effector-inspector - npm Package Compare versions

Comparing version 0.2.0 to 0.2.1

dist/common.js

@@ -1,2 +0,2 @@
-module.exports=function(e){var t={};function r(o){if(t[o])return t[o].exports;var n=t[o]={i:o,l:!1,exports:{}};return e[o].call(n.exports,n,n.exports,r),n.l=!0,n.exports}return r.m=e,r.c=t,r.d=function(e,t,o){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:o})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var o=Object.create(null);if(r.r(o),Object.defineProperty(o,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)r.d(o,n,function(t){return e[t]}.bind(null,n));return o},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=2)}([function(e,t){e.exports=require("effector-dom")},function(e,t){e.exports=require("effector")},function(e,t,r){"use strict";r.r(t),r.d(t,"addStore",(function(){return l})),r.d(t,"addEvent",(function(){return u})),r.d(t,"addEffect",(function(){return p})),r.d(t,"addDomain",(function(){return f})),r.d(t,"createInspector",(function(){return b}));var o=r(1),n=r(0);function i(e){const t=Object(o.createStore)([],{name:`$${e}Storage`});return{$store:t,api:Object(o.createApi)(t,{add:(e,t)=>[...e,t]})}}const c=i("stores"),a=i("events"),s=i("effects"),d=i("domain"),l=c.api.add,u=a.api.add,p=s.api.add,f=d.api.add;function b(){const e=document.createElement("div");return e.classList.add("effector-inspector"),document.body.append(e),function(e){const t=Object(o.createStore)(!1),r=Object(o.createEvent)();console.info("%c[effector-inspector] %cPress %cCTRL+B %cto open Inspector","color: gray; font-size: 1rem;","color: currentColor; font-size: 1rem;","color: deepskyblue; font-family: monospace; font-size: 1rem;","color: currentColor; font-size: 1rem;"),t.on(r,e=>!e),document.addEventListener("keypress",e=>{const t=e;2===t.keyCode&&t.ctrlKey&&r()}),Object(n.using)(e,()=>{Object(n.h)("div",()=>{Object(n.spec)({style:m.root,visible:t}),Object(n.h)("div",{style:m.sectionHead,text:"Stores"}),Object(n.h)("div",()=>{Object(n.spec)({style:m.storesTable}),Object(n.list)(c.$store,({store:e})=>{Object(n.h)("div",()=>{Object(n.spec)({style:m.store,attr:{title:e.map(e=>{var t,r,o;return null!=(o=null===(r=null===(t=e.defaultConfig)||void 0===t?void 0:t.loc)||void 0===r?void 0:r.file)?o:""})}});const t=e.map(e=>e.compositeName.path.slice(1).join("/"));Object(n.h)("pre",()=>{Object(n.spec)({style:m.storeName,text:t})}),Object(n.h)("pre",()=>{Object(n.spec)({style:m.storeValue,text:e.getState().map(e=>JSON.stringify(e))})})})})})})})}(e),{root:e}}const m={root:{backgroundColor:"white",borderRadius:"0.5rem",bottom:"3rem",boxShadow:"0 14.5px 5.2px -10px rgba(0,0,0,0.038), 0 23.9px 16.6px -10px rgba(0,0,0,0.057), 0 64px 118px -10px rgba(0,0,0,0.08)",display:"flex",flexDirection:"column",left:"3rem",overflowX:"auto",position:"fixed",top:"3rem",userSelect:"none",width:"26rem",zIndex:1e3},sectionHead:{backgroundColor:"white",borderBottom:"1px solid rgba(0,0,0,0.08)",display:"flex",fontSize:"1.5rem",fontWeight:"bold",left:0,lineHeight:"2rem",padding:"0.5rem 1rem",position:"sticky",right:0,top:0},storesTable:{display:"table"},store:{display:"table-row",fontSize:"1rem"},storeName:{margin:0,display:"table-cell",padding:"0.5rem 1rem"},storeValue:{margin:0,display:"table-cell",padding:"0.5rem 1rem"}}}]);
+module.exports=function(e){var t={};function o(r){if(t[r])return t[r].exports;var n=t[r]={i:r,l:!1,exports:{}};return e[r].call(n.exports,n,n.exports,o),n.l=!0,n.exports}return o.m=e,o.c=t,o.d=function(e,t,r){o.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},o.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},o.t=function(e,t){if(1&t&&(e=o(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(o.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)o.d(r,n,function(t){return e[t]}.bind(null,n));return r},o.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return o.d(t,"a",t),t},o.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},o.p="",o(o.s=2)}([function(e,t){e.exports=require("effector-dom")},function(e,t){e.exports=require("effector")},function(e,t,o){"use strict";o.r(t);var r=o(1),n=o(0);function i(e){Object(n.h)("ul",()=>{Object(n.spec)({style:d.list}),Object(n.list)(e.map(e=>[...e.entries()]),({store:e})=>{const t=e.map(([,e])=>e).getState(),o=e.map(([e])=>e),i=Object(r.createStore)(!1),u=Object(r.createEvent)();i.on(u,e=>!e),function(e,t){const o=t.store.map(a);Object(n.h)("li",()=>{Object(n.spec)({style:d.node}),Object(n.h)("pre",{text:e,style:d.nodeTitle}),Object(n.h)("pre",{text:": ",style:d.nodeTitle}),Object(n.variant)(o,{Object(){l(t.store)},Error(){l(t.store)},WeakMap(){l(t.store)},WeakSet(){l(t.store)},Array(){var e;e=t.store,Object(n.h)("pre",{text:e.map(e=>JSON.stringify(e)),style:d.nodeContent})},Iterable(){s(t.store)},Map(){s(t.store)},Set(){s(t.store)},String(){c(t.store,e=>"string"==typeof e?`"${e}"`:"")},Number(){c(t.store)},Boolean(){c(t.store,e=>e?"true":"false")},Date(){c(t.store,e=>{var t,o,r;return null===(r=null===(t=e)||void 0===t?void 0:(o=t).toISOString)||void 0===r?void 0:r.call(o)})},Null(){c(t.store,()=>"null")},Undefined(){c(t.store,()=>"undefined")},Function(){c(t.store,e=>{var t,o,r;return null===(r=null===(t=e)||void 0===t?void 0:(o=t).toString)||void 0===r?void 0:r.call(o)})},Symbol(){c(t.store,e=>{var t,o,r;return null===(r=null===(t=e)||void 0===t?void 0:(o=t).toString)||void 0===r?void 0:r.call(o)})}})})}(o,t)})})}function c(e,t=(e=>String(e))){Object(n.h)("pre",()=>{Object(n.spec)({text:e.map(t),style:d.nodeContent})})}function l(e){Object(n.h)("pre",{text:e.map(e=>JSON.stringify(e)),style:d.nodeContent})}function s(e){Object(n.h)("pre",{text:e.map(e=>JSON.stringify(e)),style:d.nodeContent})}function a(e){const t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&"function"==typeof e[Symbol.iterator]?"Iterable":"Custom"===t&&e.constructor!==Object&&e instanceof Object?"Object":t}const d={list:{listStyleType:"none",margin:"0 0",padding:"0 0"},node:{display:"flex",padding:"0.5rem 1rem",margin:"0 0"},nodeTitle:{display:"flex",margin:"0 0"},nodeContent:{margin:"0 0"}};o.d(t,"addStore",(function(){return f})),o.d(t,"addEvent",(function(){return b})),o.d(t,"createInspector",(function(){return m}));const u=Object(r.createEvent)(),p=Object(r.createStore)({map:new Map});function f(e,t={}){u(Object.assign({store:e},t))}p.on(u,({map:e},t)=>{var o,r;const n=null!=(o=t.name)?o:t.store.compositeName.path.join("/");return e.set(n,{store:t.store,mapped:(r=t.mapped,null!=r&&r)}),{map:e}});const b=Object(r.createEvent)();function m(e={}){const t=document.createElement("div");return t.classList.add("effector-inspector"),document.body.append(t),function(e,t){var o;const c=Object(r.createStore)(null!==(o=t.visible)&&void 0!==o&&o),l=Object(r.createEvent)();console.info("%c[effector-inspector] %cPress %cCTRL+B %cto open Inspector","color: gray; font-size: 1rem;","color: currentColor; font-size: 1rem;","color: deepskyblue; font-family: monospace; font-size: 1rem;","color: currentColor; font-size: 1rem;"),c.on(l,e=>!e),document.addEventListener("keypress",e=>{const t=e;2===t.keyCode&&t.ctrlKey&&l()}),Object(n.using)(e,()=>{Object(n.h)("div",()=>{Object(n.spec)({style:y.root,visible:c}),Object(n.h)("div",{style:y.sectionHead,text:"Stores"}),Object(n.h)("div",()=>{Object(n.spec)({style:y.storesTable}),i(p.map(({map:e})=>e))})})})}(t,e),{root:t}}const y={root:{backgroundColor:"white",borderRadius:"0.5rem",bottom:"3rem",boxShadow:"0 14.5px 5.2px -10px rgba(0,0,0,0.038), 0 23.9px 16.6px -10px rgba(0,0,0,0.057), 0 64px 118px -10px rgba(0,0,0,0.08)",display:"flex",flexDirection:"column",left:"3rem",overflowX:"auto",position:"fixed",top:"3rem",userSelect:"none",width:"26rem",zIndex:1e3},sectionHead:{backgroundColor:"white",borderBottom:"1px solid rgba(0,0,0,0.08)",display:"flex",fontSize:"1.5rem",fontWeight:"bold",left:0,lineHeight:"2rem",padding:"0.5rem 1rem",position:"sticky",right:0,top:0},storesTable:{display:"flex",flexDirection:"column"},store:{display:"table-row",fontSize:"1rem"},storeName:{margin:0,display:"table-cell",padding:"0.5rem 1rem"},storeValue:{margin:0,display:"table-cell",padding:"0.5rem 1rem"}}}]);
 //# sourceMappingURL=common.js.map

dist/index.d.ts

@@ -1,8 +0,14 @@
-import { Store, Event, Effect, Domain } from 'effector';
-export declare const addStore: Event<Store<any>>;
-export declare const addEvent: Event<Event<any>>;
-export declare const addEffect: Event<Effect<any, any, any>>;
-export declare const addDomain: Event<Domain>;
-export declare function createInspector(): {
-    root: HTMLDivElement;
+import { Store, Event } from 'effector';
+export declare function addStore(store: Store<any>, opts?: {
+    mapped?: boolean;
+    name?: string;
+}): void;
+export declare const addEvent: Event<void>;
+interface Options {
+    trimDomain?: string;
+    visible?: boolean;
+}
+export declare function createInspector(options?: Options): {
+    root: HTMLElement;
 };
+export {};

package.json

 {
   "name": "effector-inspector",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "main": "./dist/common.js",
@@ -14,5 +14,9 @@ "types": "./dist/index.d.ts",
     "commit": "git-cz",
-    "prepublish": "yarn build"
+    "prepublish": "yarn build",
+    "start": "parcel serve ./usage/index.html"
   },
   "devDependencies": {
+    "@babel/core": "^7.8.4",
+    "@babel/preset-env": "^7.8.4",
+    "@babel/preset-typescript": "^7.8.3",
     "@commitlint/cli": "8.2.0",
@@ -31,2 +35,3 @@ "@commitlint/config-conventional": "8.2.0",
     "husky": "3.1.0",
+    "parcel-bundler": "^1.12.4",
     "prettier": "^1.19.1",
@@ -33,0 +38,0 @@ "react": "^16.11.0",

README.md

@@ -1,29 +0,42 @@
-# 🐣 Rollup starter with Typescript
+# Effector Inspector
 
-[![Build Status](https://travis-ci.org/toastyboost/rollup-starter.svg?branch=master)](https://travis-ci.org/toastyboost/rollup-starter) [![Commitizen friendly](https://img.shields.io/badge/commitizen-friendly-brightgreen.svg)](http://commitizen.github.io/cz-cli/) [![Conventional Commits](https://img.shields.io/badge/Conventional%20Commits-1.0.0-yellow.svg)](https://conventionalcommits.org)
+![Effector-Inspector](https://i.imgur.com/D5oqpLv.png)
 
-Build your module into a clean, typed and cross-platform package.  
-It's just works. Only key featurs.
+## Installation
 
-## Usage
+1. Install effector, logger and **inspector**
 
-`yarn build` builds the application to `dist/`  
-`yarn lint` check for errors `src/**.ts`
+```bash
+npm install effector
+npm install --dev effector-logger effector-inspector
+```
 
-## Features
+or yarn
 
-- [x] Bundles CJS/ES module formats
-- [x] Compression by Terser
-- [x] Aliases
-- [x] Sourcemaps
-- [x] ESLint plugins: Recommended, Typescript Recommended, React, Requiring Types
-- [x] Prettier
-- [x] No TSLint (because he's dead)
-- [x] Compiling types
-- [x] Remove console.log's from bundle with @rollup/strip
+```bash
+yarn add effector
+yarn add -D effector-logger effector-inspector
+```
 
-## TODO
+**effector-inspector** requires `effector` and `effector-logger` to be installed
 
-- [ ] Add CI
-- [ ] Add Badges: CI
-- [ ] Add article how to publish NPM package
+2. Follow instructions for [effector-logger](https://github.com/sergeysova/effector-logger#installation)
+
+- Setup babel plugin
+- Replace `effector` to `effector-logger`
+
+3. Open your root application file (`client.tsx` or `index.tsx`)
+
+Initialize effector logger in it first lines.
+
+```ts
+import { createInspector } from 'effector-inspector';
+
+createInspector();
+```
+
+4. Press hot keys to open inspector
+
+By default: `CTRL+B` in your application
+
+5. Watch your stores and its values

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

26118

increased by44.99%

Number of package files

7

increased by40%

Lines of code

53

increased by140.91%

Number of lines in readme file

43

increased by43.33%

Worsened metrics

Dev dependency count

25

increased by19.05%

No dependency changes