@harlem/plugin-devtools - npm Package Compare versions

Comparing version 1.0.9 to 1.0.10

dist/devtools.esm.js

@@ -1,2 +0,2 @@
-import{setupDevtoolsPlugin as e}from"@vue/devtools-api";function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e}).apply(this,arguments)}var r={label:"Harlem",color:4244621};export default function(a){void 0===a&&(a=r);var n=t({},r,a),o=n.label,i=n.color;return{name:"devtools",install:function(t,r,a){var n=function(e,t){return function(r){r.app===e&&"harlem"===r.inspectorId&&0!==t.size&&(r.rootNodes=Array.from(t.keys()).map(function(e){return{id:e,label:e}}))}}(t,a),l=function(e,t){return function(r){if(r.app===e&&"harlem"===r.inspectorId&&0!==t.size){var a=t.get(r.nodeId);a&&(r.state=function(e){return{state:[{key:"root",value:e.state,editable:!1}],getters:Array.from(e.getters).map(function(e){return{key:e[0],value:(0,e[1])(),editable:!1,objectType:"computed"}}),mutations:Array.from(e.mutations).map(function(e){return{key:e,value:function(){},editable:!1}})}}(a))}}}(t,a);e({app:t,label:o,id:"harlem"},function(e){var t=function(e){return function(t){var r=t.store,a=t.data,n=a.mutation,o=a.payload;e.sendInspectorState("harlem"),e.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:r,mutation:n,payload:o},meta:{store:r}}})}}(e);e.addInspector({label:o,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),e.addTimelineLayer({label:o,color:i,id:"harlem"}),e.on.getInspectorTree(n),e.on.getInspectorState(l),r.on("mutation",t)})}}}
+import{setupDevtoolsPlugin as t}from"@vue/devtools-api";function e(){return(e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a])}return t}).apply(this,arguments)}var r={label:"Harlem",color:4244621};function a(t,e){return t.localeCompare(e)}export default function(n){void 0===n&&(n=r);var o=e({},r,n),i=o.label,l=o.color;return{name:"devtools",install:function(e,r,n){var o=function(t,e){return function(r){if(r.app===t&&"harlem"===r.inspectorId&&0!==e.size){var n=Array.from(e.keys()).sort(a).map(function(t){return{id:t,label:t}});r.rootNodes=[{children:n,id:"$all",label:"Stores"}]}}}(e,n),u=function(t,e){return function(r){var n=r.nodeId;if(r.app===t&&"harlem"===r.inspectorId&&0!==e.size){var o=[e.get(n)];"$all"===n&&(o=Array.from(e.values())),r.state=function(t){return t.reduce(function(t,e){if(!e)return t;var r=function(t){return{state:[{key:t.name,value:t.state,editable:!1}],getters:Array.from(t.getters).sort(function(t,e){return a(t[0],e[0])}).map(function(t){return{key:t[0],value:(0,t[1])(),editable:!1,objectType:"computed"}}),mutations:Array.from(t.mutations).sort(function(t,e){return a(t[0],e[0])}).map(function(t){return{key:t,value:function(){},editable:!1}})}}(e);return{state:[].concat(t.state,r.state),getters:[].concat(t.getters,r.getters),mutations:[].concat(t.mutations,r.mutations)}},{state:[],getters:[],mutations:[]})}(o)}}}(e,n);t({app:e,label:i,id:"harlem"},function(t){var e=function(t){return function(e){var r=e.store,a=e.data,n=a.mutation,o=a.payload;t.sendInspectorState("harlem"),t.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:r,mutation:n,payload:o},meta:{store:r}}})}}(t);t.addInspector({label:i,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),t.addTimelineLayer({label:i,color:l,id:"harlem"}),t.on.getInspectorTree(o),t.on.getInspectorState(u),r.on("mutation",e)})}}}
 //# sourceMappingURL=devtools.esm.js.map

dist/devtools.js

@@ -1,2 +0,2 @@
-var e=require("@vue/devtools-api");function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e}).apply(this,arguments)}var r={label:"Harlem",color:4244621};module.exports=function(a){void 0===a&&(a=r);var n=t({},r,a),o=n.label,i=n.color;return{name:"devtools",install:function(t,r,a){var n=function(e,t){return function(r){r.app===e&&"harlem"===r.inspectorId&&0!==t.size&&(r.rootNodes=Array.from(t.keys()).map(function(e){return{id:e,label:e}}))}}(t,a),l=function(e,t){return function(r){if(r.app===e&&"harlem"===r.inspectorId&&0!==t.size){var a=t.get(r.nodeId);a&&(r.state=function(e){return{state:[{key:"root",value:e.state,editable:!1}],getters:Array.from(e.getters).map(function(e){return{key:e[0],value:(0,e[1])(),editable:!1,objectType:"computed"}}),mutations:Array.from(e.mutations).map(function(e){return{key:e,value:function(){},editable:!1}})}}(a))}}}(t,a);e.setupDevtoolsPlugin({app:t,label:o,id:"harlem"},function(e){var t=function(e){return function(t){var r=t.store,a=t.data,n=a.mutation,o=a.payload;e.sendInspectorState("harlem"),e.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:r,mutation:n,payload:o},meta:{store:r}}})}}(e);e.addInspector({label:o,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),e.addTimelineLayer({label:o,color:i,id:"harlem"}),e.on.getInspectorTree(n),e.on.getInspectorState(l),r.on("mutation",t)})}}};
+var t=require("@vue/devtools-api");function e(){return(e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a])}return t}).apply(this,arguments)}var r={label:"Harlem",color:4244621};function a(t,e){return t.localeCompare(e)}module.exports=function(n){void 0===n&&(n=r);var o=e({},r,n),i=o.label,l=o.color;return{name:"devtools",install:function(e,r,n){var o=function(t,e){return function(r){if(r.app===t&&"harlem"===r.inspectorId&&0!==e.size){var n=Array.from(e.keys()).sort(a).map(function(t){return{id:t,label:t}});r.rootNodes=[{children:n,id:"$all",label:"Stores"}]}}}(e,n),u=function(t,e){return function(r){var n=r.nodeId;if(r.app===t&&"harlem"===r.inspectorId&&0!==e.size){var o=[e.get(n)];"$all"===n&&(o=Array.from(e.values())),r.state=function(t){return t.reduce(function(t,e){if(!e)return t;var r=function(t){return{state:[{key:t.name,value:t.state,editable:!1}],getters:Array.from(t.getters).sort(function(t,e){return a(t[0],e[0])}).map(function(t){return{key:t[0],value:(0,t[1])(),editable:!1,objectType:"computed"}}),mutations:Array.from(t.mutations).sort(function(t,e){return a(t[0],e[0])}).map(function(t){return{key:t,value:function(){},editable:!1}})}}(e);return{state:[].concat(t.state,r.state),getters:[].concat(t.getters,r.getters),mutations:[].concat(t.mutations,r.mutations)}},{state:[],getters:[],mutations:[]})}(o)}}}(e,n);t.setupDevtoolsPlugin({app:e,label:i,id:"harlem"},function(t){var e=function(t){return function(e){var r=e.store,a=e.data,n=a.mutation,o=a.payload;t.sendInspectorState("harlem"),t.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:r,mutation:n,payload:o},meta:{store:r}}})}}(t);t.addInspector({label:i,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),t.addTimelineLayer({label:i,color:l,id:"harlem"}),t.on.getInspectorTree(o),t.on.getInspectorState(u),r.on("mutation",e)})}}};
 //# sourceMappingURL=devtools.js.map

dist/devtools.modern.js

@@ -1,2 +0,2 @@
-import{setupDevtoolsPlugin as e}from"@vue/devtools-api";function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(e[a]=r[a])}return e}).apply(this,arguments)}const r={label:"Harlem",color:4244621};export default function(a=r){const{label:o,color:n}=t({},r,a);return{name:"devtools",install(t,r,a){const l=function(e,t){return r=>{const{app:a,inspectorId:o}=r;a===e&&"harlem"===o&&0!==t.size&&(r.rootNodes=Array.from(t.keys()).map(e=>({id:e,label:e})))}}(t,a),s=function(e,t){return r=>{const{app:a,inspectorId:o,nodeId:n}=r;if(a!==e||"harlem"!==o||0===t.size)return;const l=t.get(n);l&&(r.state=function(e){return{state:[{key:"root",value:e.state,editable:!1}],getters:Array.from(e.getters).map(([e,t])=>({key:e,value:t(),editable:!1,objectType:"computed"})),mutations:Array.from(e.mutations).map(e=>({key:e,value:()=>{},editable:!1}))}}(l))}}(t,a);e({app:t,label:o,id:"harlem"},e=>{const t=function(e){return({store:t,data:r})=>{const{mutation:a,payload:o}=r;e.sendInspectorState("harlem"),e.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:t,mutation:a,payload:o},meta:{store:t}}})}}(e);e.addInspector({label:o,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),e.addTimelineLayer({label:o,color:n,id:"harlem"}),e.on.getInspectorTree(l),e.on.getInspectorState(s),r.on("mutation",t)})}}}
+import{setupDevtoolsPlugin as t}from"@vue/devtools-api";function e(){return(e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var a in r)Object.prototype.hasOwnProperty.call(r,a)&&(t[a]=r[a])}return t}).apply(this,arguments)}const r={label:"Harlem",color:4244621};function a(t,e){return t.localeCompare(e)}export default function(o=r){const{label:n,color:l}=e({},r,o);return{name:"devtools",install(e,r,o){const s=function(t,e){return r=>{const{app:o,inspectorId:n}=r;if(o!==t||"harlem"!==n||0===e.size)return;const l=Array.from(e.keys()).sort(a).map(t=>({id:t,label:t}));r.rootNodes=[{children:l,id:"$all",label:"Stores"}]}}(e,o),i=function(t,e){return r=>{const{app:o,inspectorId:n,nodeId:l}=r;if(o!==t||"harlem"!==n||0===e.size)return;let s=[e.get(l)];"$all"===l&&(s=Array.from(e.values())),r.state=function(t){return t.reduce((t,e)=>{if(!e)return t;const r=function(t){return{state:[{key:t.name,value:t.state,editable:!1}],getters:Array.from(t.getters).sort(([t],[e])=>a(t,e)).map(([t,e])=>({key:t,value:e(),editable:!1,objectType:"computed"})),mutations:Array.from(t.mutations).sort(([t],[e])=>a(t,e)).map(t=>({key:t,value:()=>{},editable:!1}))}}(e);return{state:[...t.state,...r.state],getters:[...t.getters,...r.getters],mutations:[...t.mutations,...r.mutations]}},{state:[],getters:[],mutations:[]})}(s)}}(e,o);t({app:e,label:n,id:"harlem"},t=>{const e=function(t){return({store:e,data:r})=>{const{mutation:a,payload:o}=r;t.sendInspectorState("harlem"),t.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:e,mutation:a,payload:o},meta:{store:e}}})}}(t);t.addInspector({label:n,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),t.addTimelineLayer({label:n,color:l,id:"harlem"}),t.on.getInspectorTree(s),t.on.getInspectorState(i),r.on("mutation",e)})}}}
 //# sourceMappingURL=devtools.modern.js.map

dist/devtools.umd.js

@@ -1,2 +0,2 @@
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("@vue/devtools-api")):"function"==typeof define&&define.amd?define(["@vue/devtools-api"],t):(e=e||self).pluginDevtools=t(e.devtoolsApi)}(this,function(e){function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&(e[n]=o[n])}return e}).apply(this,arguments)}var o={label:"Harlem",color:4244621};return function(n){void 0===n&&(n=o);var r=t({},o,n),a=r.label,i=r.color;return{name:"devtools",install:function(t,o,n){var r=function(e,t){return function(o){o.app===e&&"harlem"===o.inspectorId&&0!==t.size&&(o.rootNodes=Array.from(t.keys()).map(function(e){return{id:e,label:e}}))}}(t,n),l=function(e,t){return function(o){if(o.app===e&&"harlem"===o.inspectorId&&0!==t.size){var n=t.get(o.nodeId);n&&(o.state=function(e){return{state:[{key:"root",value:e.state,editable:!1}],getters:Array.from(e.getters).map(function(e){return{key:e[0],value:(0,e[1])(),editable:!1,objectType:"computed"}}),mutations:Array.from(e.mutations).map(function(e){return{key:e,value:function(){},editable:!1}})}}(n))}}}(t,n);e.setupDevtoolsPlugin({app:t,label:a,id:"harlem"},function(e){var t=function(e){return function(t){var o=t.store,n=t.data,r=n.mutation,a=n.payload;e.sendInspectorState("harlem"),e.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:o,mutation:r,payload:a},meta:{store:o}}})}}(e);e.addInspector({label:a,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),e.addTimelineLayer({label:a,color:i,id:"harlem"}),e.on.getInspectorTree(r),e.on.getInspectorState(l),o.on("mutation",t)})}}}});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("@vue/devtools-api")):"function"==typeof define&&define.amd?define(["@vue/devtools-api"],t):(e=e||self).pluginDevtools=t(e.devtoolsApi)}(this,function(e){function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}var r={label:"Harlem",color:4244621};function n(e,t){return e.localeCompare(t)}return function(o){void 0===o&&(o=r);var a=t({},r,o),i=a.label,u=a.color;return{name:"devtools",install:function(t,r,o){var a=function(e,t){return function(r){if(r.app===e&&"harlem"===r.inspectorId&&0!==t.size){var o=Array.from(t.keys()).sort(n).map(function(e){return{id:e,label:e}});r.rootNodes=[{children:o,id:"$all",label:"Stores"}]}}}(t,o),l=function(e,t){return function(r){var o=r.nodeId;if(r.app===e&&"harlem"===r.inspectorId&&0!==t.size){var a=[t.get(o)];"$all"===o&&(a=Array.from(t.values())),r.state=function(e){return e.reduce(function(e,t){if(!t)return e;var r=function(e){return{state:[{key:e.name,value:e.state,editable:!1}],getters:Array.from(e.getters).sort(function(e,t){return n(e[0],t[0])}).map(function(e){return{key:e[0],value:(0,e[1])(),editable:!1,objectType:"computed"}}),mutations:Array.from(e.mutations).sort(function(e,t){return n(e[0],t[0])}).map(function(e){return{key:e,value:function(){},editable:!1}})}}(t);return{state:[].concat(e.state,r.state),getters:[].concat(e.getters,r.getters),mutations:[].concat(e.mutations,r.mutations)}},{state:[],getters:[],mutations:[]})}(a)}}}(t,o);e.setupDevtoolsPlugin({app:t,label:i,id:"harlem"},function(e){var t=function(e){return function(t){var r=t.store,n=t.data,o=n.mutation,a=n.payload;e.sendInspectorState("harlem"),e.addTimelineEvent({layerId:"harlem",event:{time:Date.now(),data:{store:r,mutation:o,payload:a},meta:{store:r}}})}}(e);e.addInspector({label:i,id:"harlem",icon:"storage",treeFilterPlaceholder:"Search stores"}),e.addTimelineLayer({label:i,color:u,id:"harlem"}),e.on.getInspectorTree(a),e.on.getInspectorState(l),r.on("mutation",t)})}}}});
 //# sourceMappingURL=devtools.umd.js.map

package.json

 {
     "name": "@harlem/plugin-devtools",
-    "version": "1.0.9",
+    "version": "1.0.10",
     "description": "Simple Vue 3 State Management",
@@ -26,5 +26,5 @@ "repository": "https://github.com/andrewcourtice/harlem.git",
     "devDependencies": {
-        "@harlem/core": "^1.0.9"
+        "@harlem/core": "^1.0.10"
     },
-    "gitHead": "2df3b2801cd74f6c7f02ba0a413db10af79e6483"
+    "gitHead": "d601a8a809b8a048da0951c43929be518818de83"
 }

src/index.ts

@@ -28,2 +28,3 @@ import {
 const DEVTOOLS_ID = 'harlem';
+const ALL_STORES_ID = '$all';
 
@@ -35,2 +36,6 @@ const OPTIONS: Options = {
 
+function stringComparitor(valueA: string, valueB: string): number {
+    return valueA.localeCompare(valueB);
+}
+
 function getInspectorTreeHook(application: App, stores: InternalStores): TreeHookHandler {
@@ -47,6 +52,16 @@ return payload => {
 
-        payload.rootNodes = Array.from(stores.keys()).map(name => ({
-            id: name,
-            label: name
-        }));
+        const children = Array.from(stores.keys())
+            .sort(stringComparitor)
+            .map(name => ({
+                id: name,
+                label: name
+            }));
+
+        payload.rootNodes = [
+            {
+                children,
+                id: ALL_STORES_ID,
+                label: 'Stores',
+            }
+        ];
     }
@@ -56,5 +71,12 @@ }
 function getStoreSnapshot(store: InternalStore): CustomInspectorState {
-    const state = store.state;
+    const state = [
+        {
+            key: store.name,
+            value: store.state,
+            editable: false
+        }
+    ];
 
     const getters: StateBase[] = Array.from(store.getters)
+        .sort(([a], [b]) => stringComparitor(a, b))
         .map(([key, accessor]) => ({
@@ -65,5 +87,6 @@ key,
             objectType: 'computed'
-        }));
-
+        }))
+        
     const mutations: StateBase[] = Array.from(store.mutations)
+        .sort(([a], [b]) => stringComparitor(a, b))
         .map(key => ({
@@ -76,9 +99,3 @@ key,
     return {
-        state: [
-            {
-                key: 'root',
-                value: state,
-                editable: false
-            }
-        ],
+        state,
         getters,
@@ -89,2 +106,22 @@ mutations,
 
+function getStoreSnapshots(stores: (InternalStore | undefined)[]): CustomInspectorState {
+    return stores.reduce((output, store) => {
+        if (!store) {
+            return output;
+        }
+
+        const snapshot = getStoreSnapshot(store);
+
+        return {
+            state: [...output.state, ...snapshot.state],
+            getters: [...output.getters, ...snapshot.getters],
+            mutations: [...output.mutations, ...snapshot.mutations],
+        };
+    }, {
+        state: [],
+        getters: [],
+        mutations: []
+    } as CustomInspectorState);
+}
+
 function getInspectorStateHook(application: App, stores: InternalStores): StateHookHandler {
@@ -102,7 +139,9 @@ return payload => {
 
-        const store = stores.get(nodeId);
+        let internalStores = [stores.get(nodeId)];
 
-        if (store) {
-            payload.state = getStoreSnapshot(store);
+        if (nodeId === ALL_STORES_ID) {
+            internalStores = Array.from(stores.values());
         }
+
+        payload.state = getStoreSnapshots(internalStores);
     }
@@ -109,0 +148,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

48527

increased by26.25%

Lines of code

228

increased by21.93%

Worsened metrics

Number of downloads

267

decreased by-23.05%

No dependency changes