react-hooks-global-state - npm Package Compare versions

Comparing version 1.0.0 to 2.0.0-alpha.1

dist/index.esm.js

@@ -1,2 +0,2 @@
-import{useReducer as n,useEffect as t,useRef as r,useState as e,useCallback as o}from"react";function u(){return(u=Object.assign||function(n){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var e in r)Object.prototype.hasOwnProperty.call(r,e)&&(n[e]=r[e])}return n}).apply(this,arguments)}var i=function(n,t){if(!n.includes(t))throw new Error("'"+t+"' not found. It must be provided in initialState as a property key.")},c="production"!==process.env.NODE_ENV?Symbol("UPDATE_STATE"):Symbol(),a=function(a,f){var l=Object.keys(f),s=f,p=null,v={};l.forEach(function(n){v[n]=new Set});var d=function(n,t){return t.type===c?t.r?t.r(n):t.e:a(n,t)},E=function(n,t){"production"!==process.env.NODE_ENV&&i(l,n);var r=function(r){var e,o;return u({},r,((e={})[n]="function"==typeof(o=t)?o(r[n]):o,e))};if(p){var e;p(((e={type:c}).r=r,e))}else{var o=(s=r(s))[n];v[n].forEach(function(n){return n(o)})}},S=function(n,t){l.forEach(function(r){var e=t[r];n[r]!==e&&v[r].forEach(function(n){return n(e)})})};return{useGlobalStateProvider:function(){var e=n(d,s),o=e[0],u=e[1];t(function(){var n;if(p)throw new Error("Only one global state provider is allowed");return p=u,u(((n={type:c}).e=s,n)),function(){p=null}},[]);var i=r(o);S(i.current,o),i.current=o,t(function(){s=o},[o])},useGlobalState:function(n){"production"!==process.env.NODE_ENV&&i(l,n);var r=e(s[n]),u=r[0],c=r[1];return t(function(){return v[n].add(c),c(s[n]),function(){v[n].delete(c)}},[n]),[u,o(function(t){return E(n,t)},[n])]},getGlobalState:function(n){return"production"!==process.env.NODE_ENV&&i(l,n),s[n]},setGlobalState:E,getState:function(){return s},setState:function(n){var t;p?p(((t={type:c}).e=n,t)):S(s,s=n)},dispatch:function(n){if(p)p(n);else{var t=s;s=a(s,n),S(t,s)}return n}}},f=function(n){return a(function(n,t){return n},n)},l=function n(t,r,e){return void 0===r&&(r=t(void 0,{type:void 0})),e?e(n)(t,r):a(t,r)},s=function(){return window.__REDUX_DEVTOOLS_EXTENSION__?function(){for(var n=arguments.length,t=new Array(n),r=0;r<n;r++)t[r]=arguments[r];return t.reduce(function(n,t){return function(){return n(t.apply(void 0,arguments))}})}(function(r){return function(e,o,i){if(n=e,t=o,i)return i(r)(e,o);var c=r(e,o);return u({},c,{useGlobalState:function(n){return[c.useGlobalState(n)[0],function(){throw new Error("Update is not allowed when using DevTools")}]}})}},window.__REDUX_DEVTOOLS_EXTENSION__(),function(r){return function(e,o,i){if(i)return i(r)(e,o);var c=r(n,t),a=u({},e(o,{type:"@@redux/INIT"}),{},t),f=[];return u({},c,{getState:function(){return a},dispatch:function(n){return a=e(a,n),c.setState(a.computedStates[a.currentStateIndex].state),f.forEach(function(n){return n()}),n},subscribe:function(n){return f.push(n),function(){var t=f.indexOf(n);f.splice(t,1)}}})}}):function(n){return n};var n,t};export{f as createGlobalState,l as createStore,s as reduxDevToolsExt};
+import{createMutableSource as t,useCallback as n,useMutableSource as e}from"react";function r(){return(r=Object.assign||function(t){for(var n=1;n<arguments.length;n++){var e=arguments[n];for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r])}return t}).apply(this,arguments)}var u=function(t,n){return"function"==typeof n?n(t):n},o=function(t,n){if(!t.includes(n))throw new Error("'"+n+"' not found. It must be provided in initialState as a property key.")};function i(n,e){var i=Object.keys(n),c=n,a=function(){var t=new Map;return i.forEach(function(n){t.set(n,new Set)}),t.set(null,new Set),t}(),f=function(t,n){i.forEach(function(e){t[e]!==n[e]&&a.get(e).forEach(function(t){t()})}),a.get(null).forEach(function(t){t()})},s={getState:function(){return c},setState:function(t){var n=c;c=u(n,t),f(n,c)},getStateByKey:function(t){return"production"!==process.env.NODE_ENV&&o(i,t),c[t]},setStateByKey:function(t,n){var e,f;"production"!==process.env.NODE_ENV&&o(i,t),c=r(r({},e=c),{},((f={})[t]=u(e[t],n),f)),a.get(t).forEach(function(t){t()}),a.get(null).forEach(function(t){t()})},dispatch:function(t){if(!e)throw new Error("no reducer specified");var n=c;return c=e(n,t),f(n,c),t},subscribe:function(t,n){var e=a.get(t);return e.add(n),function(){e.delete(n)}},mutableSource:void 0};return s.mutableSource=t(s,function(){return c}),s}function c(t,r){var u=n(function(t){return r?t.getStateByKey(r):t.getState()},[r]),o=n(function(t,n){return t.subscribe(r||null,n)},[r]);return[e(t.mutableSource,u,o),n(function(n){r?t.setStateByKey(r,n):t.setState(n)},[t,r])]}var a=function(t){var n=i(t);return{useGlobalState:function(t){return c(n,t)},getGlobalState:n.getStateByKey,setGlobalState:n.setStateByKey}},f=function t(n,e,r){if(void 0===e&&(e=n(void 0,{type:void 0})),r)return r(t)(n,e);var u=i(e,n);return{useGlobalState:function(t){return c(u,t)},getState:u.getState,setState:u.setState,dispatch:u.dispatch}},s=function(){return window.__REDUX_DEVTOOLS_EXTENSION__?function(){return[].slice.call(arguments).reduce(function(t,n){return function(){return t(n.apply(void 0,[].slice.call(arguments)))}})}(function(e){return function(u,o,i){if(t=u,n=o,i)return i(e)(u,o);var c=e(u,o);return r(r({},c),{},{useGlobalState:function(t){return[c.useGlobalState(t)[0],function(){throw new Error("Update is not allowed when using DevTools")}]}})}},window.__REDUX_DEVTOOLS_EXTENSION__(),function(e){return function(u,o,i){if(i)return i(e)(u,o);var c=e(t,n),a=r(r({},u(o,{type:"@@redux/INIT"})),n),f=[];return r(r({},c),{},{getState:function(){return a},dispatch:function(t){return a=u(a,t),c.setState(a.computedStates[a.currentStateIndex].state),f.forEach(function(t){return t()}),t},subscribe:function(t){return f.push(t),function(){var n=f.indexOf(t);f.splice(n,1)}}})}}):function(t){return t};var t,n};export{i as createAtom,a as createGlobalState,f as createStore,s as reduxDevToolsExt,c as useAtom};
 //# sourceMappingURL=index.esm.js.map

dist/index.js

@@ -1,2 +0,2 @@
-var t=require("react");function n(){return(n=Object.assign||function(t){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var e in r)Object.prototype.hasOwnProperty.call(r,e)&&(t[e]=r[e])}return t}).apply(this,arguments)}var r=function(t,n){if(!t.includes(n))throw new Error("'"+n+"' not found. It must be provided in initialState as a property key.")},e="production"!==process.env.NODE_ENV?Symbol("UPDATE_STATE"):Symbol(),o=function(o,u){var i=Object.keys(u),c=u,a=null,f={};i.forEach(function(t){f[t]=new Set});var s=function(t,n){return n.type===e?n.r?n.r(t):n.e:o(t,n)},l=function(t,o){"production"!==process.env.NODE_ENV&&r(i,t);var u=function(r){var e,u;return n({},r,((e={})[t]="function"==typeof(u=o)?u(r[t]):u,e))};if(a){var s;a(((s={type:e}).r=u,s))}else{var l=(c=u(c))[t];f[t].forEach(function(t){return t(l)})}},v=function(t,n){i.forEach(function(r){var e=n[r];t[r]!==e&&f[r].forEach(function(t){return t(e)})})};return{useGlobalStateProvider:function(){var n=t.useReducer(s,c),r=n[0],o=n[1];t.useEffect(function(){var t;if(a)throw new Error("Only one global state provider is allowed");return a=o,o(((t={type:e}).e=c,t)),function(){a=null}},[]);var u=t.useRef(r);v(u.current,r),u.current=r,t.useEffect(function(){c=r},[r])},useGlobalState:function(n){"production"!==process.env.NODE_ENV&&r(i,n);var e=t.useState(c[n]),o=e[0],u=e[1];return t.useEffect(function(){return f[n].add(u),u(c[n]),function(){f[n].delete(u)}},[n]),[o,t.useCallback(function(t){return l(n,t)},[n])]},getGlobalState:function(t){return"production"!==process.env.NODE_ENV&&r(i,t),c[t]},setGlobalState:l,getState:function(){return c},setState:function(t){var n;a?a(((n={type:e}).e=t,n)):v(c,c=t)},dispatch:function(t){if(a)a(t);else{var n=c;c=o(c,t),v(n,c)}return t}}};exports.createGlobalState=function(t){return o(function(t,n){return t},t)},exports.createStore=function t(n,r,e){return void 0===r&&(r=n(void 0,{type:void 0})),e?e(t)(n,r):o(n,r)},exports.reduxDevToolsExt=function(){return window.__REDUX_DEVTOOLS_EXTENSION__?function(){for(var t=arguments.length,n=new Array(t),r=0;r<t;r++)n[r]=arguments[r];return n.reduce(function(t,n){return function(){return t(n.apply(void 0,arguments))}})}(function(e){return function(o,u,i){if(t=o,r=u,i)return i(e)(o,u);var c=e(o,u);return n({},c,{useGlobalState:function(t){return[c.useGlobalState(t)[0],function(){throw new Error("Update is not allowed when using DevTools")}]}})}},window.__REDUX_DEVTOOLS_EXTENSION__(),function(e){return function(o,u,i){if(i)return i(e)(o,u);var c=e(t,r),a=n({},o(u,{type:"@@redux/INIT"}),{},r),f=[];return n({},c,{getState:function(){return a},dispatch:function(t){return a=o(a,t),c.setState(a.computedStates[a.currentStateIndex].state),f.forEach(function(t){return t()}),t},subscribe:function(t){return f.push(t),function(){var n=f.indexOf(t);f.splice(n,1)}}})}}):function(t){return t};var t,r};
+var t=require("react");function e(){return(e=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t}).apply(this,arguments)}var n=function(t,e){return"function"==typeof e?e(t):e},r=function(t,e){if(!t.includes(e))throw new Error("'"+e+"' not found. It must be provided in initialState as a property key.")};function u(u,o){var a=Object.keys(u),c=u,i=function(){var t=new Map;return a.forEach(function(e){t.set(e,new Set)}),t.set(null,new Set),t}(),f=function(t,e){a.forEach(function(n){t[n]!==e[n]&&i.get(n).forEach(function(t){t()})}),i.get(null).forEach(function(t){t()})},s={getState:function(){return c},setState:function(t){var e=c;c=n(e,t),f(e,c)},getStateByKey:function(t){return"production"!==process.env.NODE_ENV&&r(a,t),c[t]},setStateByKey:function(t,u){var o,f;"production"!==process.env.NODE_ENV&&r(a,t),c=e(e({},o=c),{},((f={})[t]=n(o[t],u),f)),i.get(t).forEach(function(t){t()}),i.get(null).forEach(function(t){t()})},dispatch:function(t){if(!o)throw new Error("no reducer specified");var e=c;return c=o(e,t),f(e,c),t},subscribe:function(t,e){var n=i.get(t);return n.add(e),function(){n.delete(e)}},mutableSource:void 0};return s.mutableSource=t.createMutableSource(s,function(){return c}),s}function o(e,n){var r=t.useCallback(function(t){return n?t.getStateByKey(n):t.getState()},[n]),u=t.useCallback(function(t,e){return t.subscribe(n||null,e)},[n]);return[t.useMutableSource(e.mutableSource,r,u),t.useCallback(function(t){n?e.setStateByKey(n,t):e.setState(t)},[e,n])]}exports.createAtom=u,exports.createGlobalState=function(t){var e=u(t);return{useGlobalState:function(t){return o(e,t)},getGlobalState:e.getStateByKey,setGlobalState:e.setStateByKey}},exports.createStore=function t(e,n,r){if(void 0===n&&(n=e(void 0,{type:void 0})),r)return r(t)(e,n);var a=u(n,e);return{useGlobalState:function(t){return o(a,t)},getState:a.getState,setState:a.setState,dispatch:a.dispatch}},exports.reduxDevToolsExt=function(){return window.__REDUX_DEVTOOLS_EXTENSION__?function(){return[].slice.call(arguments).reduce(function(t,e){return function(){return t(e.apply(void 0,[].slice.call(arguments)))}})}(function(r){return function(u,o,a){if(t=u,n=o,a)return a(r)(u,o);var c=r(u,o);return e(e({},c),{},{useGlobalState:function(t){return[c.useGlobalState(t)[0],function(){throw new Error("Update is not allowed when using DevTools")}]}})}},window.__REDUX_DEVTOOLS_EXTENSION__(),function(r){return function(u,o,a){if(a)return a(r)(u,o);var c=r(t,n),i=e(e({},u(o,{type:"@@redux/INIT"})),n),f=[];return e(e({},c),{},{getState:function(){return i},dispatch:function(t){return i=u(i,t),c.setState(i.computedStates[i.currentStateIndex].state),f.forEach(function(t){return t()}),t},subscribe:function(t){return f.push(t),function(){var e=f.indexOf(t);f.splice(e,1)}}})}}):function(t){return t};var t,n},exports.useAtom=o;
 //# sourceMappingURL=index.js.map

dist/index.umd.js

@@ -1,2 +0,2 @@
-!function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],n):n((t=t||self).reactHooksGlobalState={},t.react)}(this,function(t,n){function e(){return(e=Object.assign||function(t){for(var n=1;n<arguments.length;n++){var e=arguments[n];for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&(t[r]=e[r])}return t}).apply(this,arguments)}var r=function(t,n){if(!t.includes(n))throw new Error("'"+n+"' not found. It must be provided in initialState as a property key.")},o="production"!==process.env.NODE_ENV?Symbol("UPDATE_STATE"):Symbol(),u=function(t,u){var i=Object.keys(u),c=u,f=null,a={};i.forEach(function(t){a[t]=new Set});var s=function(n,e){return e.type===o?e.r?e.r(n):e.e:t(n,e)},l=function(t,n){"production"!==process.env.NODE_ENV&&r(i,t);var u=function(r){var o,u;return e({},r,((o={})[t]="function"==typeof(u=n)?u(r[t]):u,o))};if(f){var s;f(((s={type:o}).r=u,s))}else{var l=(c=u(c))[t];a[t].forEach(function(t){return t(l)})}},d=function(t,n){i.forEach(function(e){var r=n[e];t[e]!==r&&a[e].forEach(function(t){return t(r)})})};return{useGlobalStateProvider:function(){var t=n.useReducer(s,c),e=t[0],r=t[1];n.useEffect(function(){var t;if(f)throw new Error("Only one global state provider is allowed");return f=r,r(((t={type:o}).e=c,t)),function(){f=null}},[]);var u=n.useRef(e);d(u.current,e),u.current=e,n.useEffect(function(){c=e},[e])},useGlobalState:function(t){"production"!==process.env.NODE_ENV&&r(i,t);var e=n.useState(c[t]),o=e[0],u=e[1];return n.useEffect(function(){return a[t].add(u),u(c[t]),function(){a[t].delete(u)}},[t]),[o,n.useCallback(function(n){return l(t,n)},[t])]},getGlobalState:function(t){return"production"!==process.env.NODE_ENV&&r(i,t),c[t]},setGlobalState:l,getState:function(){return c},setState:function(t){var n;f?f(((n={type:o}).e=t,n)):d(c,c=t)},dispatch:function(n){if(f)f(n);else{var e=c;c=t(c,n),d(e,c)}return n}}};t.createGlobalState=function(t){return u(function(t,n){return t},t)},t.createStore=function t(n,e,r){return void 0===e&&(e=n(void 0,{type:void 0})),r?r(t)(n,e):u(n,e)},t.reduxDevToolsExt=function(){return window.__REDUX_DEVTOOLS_EXTENSION__?function(){for(var t=arguments.length,n=new Array(t),e=0;e<t;e++)n[e]=arguments[e];return n.reduce(function(t,n){return function(){return t(n.apply(void 0,arguments))}})}(function(r){return function(o,u,i){if(t=o,n=u,i)return i(r)(o,u);var c=r(o,u);return e({},c,{useGlobalState:function(t){return[c.useGlobalState(t)[0],function(){throw new Error("Update is not allowed when using DevTools")}]}})}},window.__REDUX_DEVTOOLS_EXTENSION__(),function(r){return function(o,u,i){if(i)return i(r)(o,u);var c=r(t,n),f=e({},o(u,{type:"@@redux/INIT"}),{},n),a=[];return e({},c,{getState:function(){return f},dispatch:function(t){return f=o(f,t),c.setState(f.computedStates[f.currentStateIndex].state),a.forEach(function(t){return t()}),t},subscribe:function(t){return a.push(t),function(){var n=a.indexOf(t);a.splice(n,1)}}})}}):function(t){return t};var t,n}});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],e):e((t=t||self).reactHooksGlobalState={},t.react)}(this,function(t,e){function n(){return(n=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n=arguments[e];for(var r in n)Object.prototype.hasOwnProperty.call(n,r)&&(t[r]=n[r])}return t}).apply(this,arguments)}var r=function(t,e){return"function"==typeof e?e(t):e},u=function(t,e){if(!t.includes(e))throw new Error("'"+e+"' not found. It must be provided in initialState as a property key.")};function o(t,o){var c=Object.keys(t),a=t,i=function(){var t=new Map;return c.forEach(function(e){t.set(e,new Set)}),t.set(null,new Set),t}(),f=function(t,e){c.forEach(function(n){t[n]!==e[n]&&i.get(n).forEach(function(t){t()})}),i.get(null).forEach(function(t){t()})},s={getState:function(){return a},setState:function(t){var e=a;a=r(e,t),f(e,a)},getStateByKey:function(t){return"production"!==process.env.NODE_ENV&&u(c,t),a[t]},setStateByKey:function(t,e){var o,f;"production"!==process.env.NODE_ENV&&u(c,t),a=n(n({},o=a),{},((f={})[t]=r(o[t],e),f)),i.get(t).forEach(function(t){t()}),i.get(null).forEach(function(t){t()})},dispatch:function(t){if(!o)throw new Error("no reducer specified");var e=a;return a=o(e,t),f(e,a),t},subscribe:function(t,e){var n=i.get(t);return n.add(e),function(){n.delete(e)}},mutableSource:void 0};return s.mutableSource=e.createMutableSource(s,function(){return a}),s}function c(t,n){var r=e.useCallback(function(t){return n?t.getStateByKey(n):t.getState()},[n]),u=e.useCallback(function(t,e){return t.subscribe(n||null,e)},[n]);return[e.useMutableSource(t.mutableSource,r,u),e.useCallback(function(e){n?t.setStateByKey(n,e):t.setState(e)},[t,n])]}t.createAtom=o,t.createGlobalState=function(t){var e=o(t);return{useGlobalState:function(t){return c(e,t)},getGlobalState:e.getStateByKey,setGlobalState:e.setStateByKey}},t.createStore=function t(e,n,r){if(void 0===n&&(n=e(void 0,{type:void 0})),r)return r(t)(e,n);var u=o(n,e);return{useGlobalState:function(t){return c(u,t)},getState:u.getState,setState:u.setState,dispatch:u.dispatch}},t.reduxDevToolsExt=function(){return window.__REDUX_DEVTOOLS_EXTENSION__?function(){return[].slice.call(arguments).reduce(function(t,e){return function(){return t(e.apply(void 0,[].slice.call(arguments)))}})}(function(r){return function(u,o,c){if(t=u,e=o,c)return c(r)(u,o);var a=r(u,o);return n(n({},a),{},{useGlobalState:function(t){return[a.useGlobalState(t)[0],function(){throw new Error("Update is not allowed when using DevTools")}]}})}},window.__REDUX_DEVTOOLS_EXTENSION__(),function(r){return function(u,o,c){if(c)return c(r)(u,o);var a=r(t,e),i=n(n({},u(o,{type:"@@redux/INIT"})),e),f=[];return n(n({},a),{},{getState:function(){return i},dispatch:function(t){return i=u(i,t),a.setState(i.computedStates[i.currentStateIndex].state),f.forEach(function(t){return t()}),t},subscribe:function(t){return f.push(t),function(){var e=f.indexOf(t);f.splice(e,1)}}})}}):function(t){return t};var t,e},t.useAtom=c});
 //# sourceMappingURL=index.umd.js.map

dist/src/createGlobalState.d.ts

 /// <reference types="react" />
-declare type ExportFields = 'useGlobalStateProvider' | 'useGlobalState' | 'getGlobalState' | 'setGlobalState';
 /**
@@ -21,11 +20,6 @@ * create a gloal state
  */
-export declare const createGlobalState: <State>(initialState: State) => Pick<{
-    useGlobalStateProvider: () => void;
-    useGlobalState: <StateKey extends keyof State>(stateKey: StateKey) => readonly [State[StateKey], (u: import("react").SetStateAction<State[StateKey]>) => void];
-    getGlobalState: <StateKey_1 extends keyof State>(stateKey: StateKey_1) => State[StateKey_1];
-    setGlobalState: <StateKey_2 extends keyof State>(stateKey: StateKey_2, update: import("react").SetStateAction<State[StateKey_2]>) => void;
-    getState: () => State;
-    setState: (nextGlobalState: State) => void;
-    dispatch: (action: never) => never;
-}, ExportFields>;
-export {};
+export declare const createGlobalState: <State>(initialState: State) => {
+    useGlobalState: <StateKey extends keyof State>(stateKey: StateKey) => [State[StateKey], (u: import("react").SetStateAction<State[StateKey]>) => void];
+    getGlobalState: <StateKey_1 extends keyof State>(key: StateKey_1) => State[StateKey_1];
+    setGlobalState: <StateKey_2 extends keyof State>(key: StateKey_2, update: import("react").SetStateAction<State[StateKey_2]>) => void;
+};

dist/src/createStore.d.ts

 import { Reducer } from 'react';
 declare type Enhancer<Creator> = (creator: Creator) => Creator;
-declare type ExportFields = 'useGlobalStateProvider' | 'useGlobalState' | 'getState' | 'dispatch';
 /**
@@ -25,11 +24,8 @@ * create a global store
  */
-export declare const createStore: <State, Action>(reducer: Reducer<State, Action>, initialState?: State, enhancer?: Enhancer<any> | undefined) => Pick<{
-    useGlobalStateProvider: () => void;
-    useGlobalState: <StateKey extends keyof State>(stateKey: StateKey) => readonly [State[StateKey], (u: import("react").SetStateAction<State[StateKey]>) => void];
-    getGlobalState: <StateKey_1 extends keyof State>(stateKey: StateKey_1) => State[StateKey_1];
-    setGlobalState: <StateKey_2 extends keyof State>(stateKey: StateKey_2, update: import("react").SetStateAction<State[StateKey_2]>) => void;
+export declare const createStore: <State, Action>(reducer: Reducer<State, Action>, initialState?: State, enhancer?: Enhancer<any> | undefined) => {
+    useGlobalState: <StateKey extends keyof State>(stateKey: StateKey) => [State[StateKey], (u: import("react").SetStateAction<State[StateKey]>) => void];
     getState: () => State;
-    setState: (nextGlobalState: State) => void;
+    setState: (update: import("react").SetStateAction<State>) => void;
     dispatch: (action: Action) => Action;
-}, ExportFields>;
+};
 export {};

dist/src/index.d.ts

@@ -0,3 +1,5 @@
+export { createAtom } from './createAtom';
+export { useAtom } from './useAtom';
 export { createGlobalState } from './createGlobalState';
 export { createStore } from './createStore';
 export { reduxDevToolsExt } from './devtools';

package.json

 {
   "name": "react-hooks-global-state",
   "description": "Simple global state for React with Hooks API",
-  "version": "1.0.0",
+  "version": "2.0.0-alpha.1",
+  "publishConfig": {
+    "tag": "next"
+  },
   "author": "Daishi Kato",
@@ -24,5 +27,5 @@ "repository": {
     "eslint": "eslint --ext .js,.ts,.tsx --ignore-pattern dist .",
-    "jest": "jest --config '{\"preset\":\"ts-jest/presets/js-with-ts\"}' __tests__/*.tsx",
+    "jest": "jest --preset ts-jest/presets/js-with-ts __tests__/*.tsx",
     "tsc-test": "tsc --project . --noEmit",
-    "apidoc": "documentation readme --section API --markdown-toc false --parse-extension ts src/createGlobalState.ts src/createStore.ts",
+    "apidoc": "documentation readme --section API --markdown-toc false --parse-extension ts src/*.ts",
     "e2e-test:01_minimal": "server-test examples:01_minimal 8080 'jest --preset jest-puppeteer __tests__/e2e/01_minimal.ts'",
@@ -66,46 +69,46 @@ "e2e-test:02_typescript": "server-test examples:02_typescript 8080 'jest --preset jest-puppeteer __tests__/e2e/02_typescript.ts'",
   "devDependencies": {
-    "@babel/core": "^7.8.4",
-    "@pmmmwh/react-refresh-webpack-plugin": "^0.1.3",
-    "@testing-library/react": "^9.4.0",
-    "@types/expect-puppeteer": "^4.4.0",
-    "@types/jest": "^25.1.2",
+    "@babel/core": "^7.9.6",
+    "@pmmmwh/react-refresh-webpack-plugin": "^0.3.1",
+    "@testing-library/react": "^10.0.4",
+    "@types/expect-puppeteer": "^4.4.1",
+    "@types/jest": "^25.2.1",
     "@types/jest-environment-puppeteer": "^4.3.1",
-    "@types/puppeteer": "^2.0.0",
-    "@types/react": "16.9.19",
-    "@types/react-dom": "^16.9.5",
+    "@types/puppeteer": "^2.0.1",
+    "@types/react": "^16.9.35",
+    "@types/react-dom": "^16.9.8",
     "@types/redux-logger": "^3.0.7",
-    "@typescript-eslint/eslint-plugin": "^2.20.0",
-    "@typescript-eslint/parser": "^2.20.0",
-    "babel-loader": "^8.0.6",
-    "documentation": "^12.1.4",
-    "eslint": "^6.8.0",
-    "eslint-config-airbnb": "^18.0.1",
-    "eslint-plugin-import": "^2.20.1",
+    "@typescript-eslint/eslint-plugin": "^2.31.0",
+    "@typescript-eslint/parser": "^2.31.0",
+    "babel-loader": "^8.1.0",
+    "documentation": "^13.0.0",
+    "eslint": "^7.0.0",
+    "eslint-config-airbnb": "^18.1.0",
+    "eslint-plugin-import": "^2.20.2",
     "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-react": "^7.18.3",
-    "eslint-plugin-react-hooks": "^2.4.0",
-    "html-webpack-plugin": "^3.2.0",
-    "immer": "^5.3.6",
-    "jest": "^25.1.0",
+    "eslint-plugin-react": "^7.19.0",
+    "eslint-plugin-react-hooks": "^4.0.0",
+    "html-webpack-plugin": "^4.3.0",
+    "immer": "^6.0.5",
+    "jest": "^26.0.1",
     "jest-puppeteer": "^4.4.0",
-    "microbundle": "^0.12.0-next.8",
+    "microbundle": "^0.12.0",
     "npm-run-all": "^4.1.5",
-    "puppeteer": "^2.1.1",
-    "react": "^16.12.0",
-    "react-dom": "^16.12.0",
-    "react-refresh": "^0.7.2",
+    "puppeteer": "^3.0.4",
+    "react": "experimental",
+    "react-dom": "experimental",
+    "react-refresh": "^0.8.2",
     "redux": "^4.0.5",
     "redux-logger": "^3.0.6",
     "redux-thunk": "^2.3.0",
-    "start-server-and-test": "^1.10.8",
-    "ts-jest": "^25.2.0",
-    "ts-loader": "^6.2.1",
-    "typescript": "^3.7.5",
-    "webpack": "^4.41.6",
+    "start-server-and-test": "^1.11.0",
+    "ts-jest": "^25.5.1",
+    "ts-loader": "^7.0.3",
+    "typescript": "^3.8.3",
+    "webpack": "^4.43.0",
     "webpack-cli": "^3.3.11",
-    "webpack-dev-server": "^3.10.3"
+    "webpack-dev-server": "^3.11.0"
   },
   "peerDependencies": {
-    "react": ">=16.8.0"
+    "react": ">=16.14.0"
   }
 }

README.md

@@ -14,11 +14,15 @@ # react-hooks-global-state
 
--   Optimization for shallow state getter and setter.
-    -   The library cares the state object only one-level deep.
+-   React Hooks only API without React Context
+    -   You don't need Context for global state.
+-   Hardly misusable selector by state keys
+    -   For most of cases, function selectors are not necessary.
 -   TypeScript type definitions
     -   A creator function creates hooks with types inferred.
--   Redux middleware support to some extent
-    -   Some of libraries in Redux ecosystem can be used.
-    -   Redux DevTools Extension could be used in a simple scenario.
--   Concurrent Mode support (Experimental)
-    -   Undocumented `useGlobalStateProvider` supports CM without React Context.
+-   Analogous APIs
+    -   useGlobalState works like React.useState.
+    -   useAtom resembles with the concept of Recoil.
+    -   createStore implies Redux.
+-   Concurrent Mode support
+    -   Under the hood, it's implemented with useMutableSource.
+    -   (For external stores like this, state branching is never possible.)
 
@@ -33,6 +37,36 @@ ## Install
 
-### setState style
+### createAtom style
 
 ```javascript
 import React from 'react';
+import { createAtom, useAtom } from 'react-hooks-global-state';
+
+const initialState = { count: 0 };
+const atom1 = createAtom(initialState);
+
+const Counter = () => {
+  const [count, setCount] = useAtom(atom1, 'count');
+  return (
+    <div>
+      <span>Counter: {count}</span>
+      {/* update state by passing callback function */}
+      <button onClick={() => setCount(v => v + 1)}>+1</button>
+      {/* update state by passing new value */}
+      <button onClick={() => setCount(count - 1)}>-1</button>
+    </div>
+  );
+};
+
+const App = () => (
+  <>
+    <Counter />
+    <Counter />
+  </>
+);
+```
+
+### createGlobalState style
+
+```javascript
+import React from 'react';
 import { createGlobalState } from 'react-hooks-global-state';
@@ -64,3 +98,3 @@
 
-### reducer style
+### createStore style
 
@@ -104,2 +138,29 @@ ```javascript
 
+### createAtom
+
+create an atom
+
+It returns a set of functions to be called outside React
+
+-   `getStateByKey`: a function to get the part of state by key outside React
+-   `setStateByKey`: a function to set the part of state by key outside React
+-   `getState`: a function to get the entire state
+-   `setState`: a function to get the entire state
+-   `dispatch`: an optional function that can be used if reducer is provided
+
+#### Parameters
+
+-   `initialState` **State** 
+-   `reducer` **Reducer&lt;State, Action>?** 
+
+#### Examples
+
+```javascript
+import { createAtom } from 'react-hooks-global-state';
+
+const atom = createAtom({ count: 0 });
+
+atom.setStateByKey('count', 1);
+```
+
 ### createGlobalState
@@ -163,2 +224,26 @@
 
+### useAtom
+
+use atom
+
+a custom hook that works like React.useState
+
+#### Parameters
+
+-   `atom` **Atom&lt;State, any>** 
+-   `stateKey` **any?** 
+
+#### Examples
+
+```javascript
+import { createAtom, useAtom } from 'react-hooks-global-state';
+
+const atom = createAtom({ count: 0 });
+
+const Component = () => {
+  const [count, setCount] = useAtom(atom, 'count');
+  ...
+};
+```
+
 ## Examples
@@ -197,2 +282,3 @@
 -   [Four patterns for global state with React hooks: Context or Redux](https://blog.axlight.com/posts/four-patterns-for-global-state-with-react-hooks-context-or-redux/)
+-   [Steps to Develop Global State for React With Hooks Without Context](https://blog.axlight.com/posts/steps-to-develop-global-state-for-react/)
 
@@ -199,0 +285,0 @@ ## Community Wiki

src/createGlobalState.ts

@@ -1,9 +0,4 @@
-import { createContainer } from './createContainer';
+import { createAtom } from './createAtom';
+import { useAtom } from './useAtom';
 
-type ExportFields =
-  | 'useGlobalStateProvider'
-  | 'useGlobalState'
-  | 'getGlobalState'
-  | 'setGlobalState';
-
 /**
@@ -28,4 +23,10 @@ * create a gloal state
 export const createGlobalState = <State>(initialState: State) => {
-  const store = createContainer((state: State, _action: never) => state, initialState);
-  return store as Pick<typeof store, ExportFields>;
+  const atom = createAtom(initialState);
+  return {
+    useGlobalState: <StateKey extends keyof State>(stateKey: StateKey) => (
+      useAtom<State, StateKey>(atom, stateKey)
+    ),
+    getGlobalState: atom.getStateByKey,
+    setGlobalState: atom.setStateByKey,
+  };
 };

src/createStore.ts

@@ -0,13 +1,10 @@
+/* eslint @typescript-eslint/no-explicit-any: off */
+
 import { Reducer } from 'react';
 
-import { createContainer } from './createContainer';
+import { Atom, createAtom } from './createAtom';
+import { useAtom } from './useAtom';
 
 type Enhancer<Creator> = (creator: Creator) => Creator;
 
-type ExportFields =
-  | 'useGlobalStateProvider'
-  | 'useGlobalState'
-  | 'getState'
-  | 'dispatch';
-
 /**
@@ -36,10 +33,15 @@ * create a global store
   reducer: Reducer<State, Action>,
-  /* eslint-disable @typescript-eslint/no-explicit-any */
   initialState: State = (reducer as any)(undefined, { type: undefined }),
   enhancer?: Enhancer<any>,
-  /* eslint-enable @typescript-eslint/no-explicit-any */
 ) => {
   if (enhancer) return enhancer(createStore)(reducer, initialState) as never;
-  const store = createContainer(reducer, initialState);
-  return store as Pick<typeof store, ExportFields>;
+  const atom = createAtom(initialState, reducer);
+  return {
+    useGlobalState: <StateKey extends keyof State>(stateKey: StateKey) => (
+      useAtom<State, StateKey>(atom as Atom<State, any>, stateKey)
+    ),
+    getState: atom.getState,
+    setState: atom.setState, // for library use
+    dispatch: atom.dispatch,
+  };
 };

src/index.ts

@@ -0,1 +1,3 @@
+export { createAtom } from './createAtom';
+export { useAtom } from './useAtom';
 export { createGlobalState } from './createGlobalState';
@@ -2,0 +4,0 @@ export { createStore } from './createStore';

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

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

86365

increased by8.35%

Number of package files

22

increased by10%

Lines of code

456

increased by13.15%

Number of lines in readme file

283

increased by43.65%

Number of low supply chain risk alerts

6

decreased by-50%

Worsened metrics

Number of low quality alerts

4

increased by33.33%

Number of medium supply chain risk alerts

1

increased byInfinity%

No dependency changes