@dr.pogodin/react-global-state 0.8.3 → 0.9.1

package/build/node/useAsyncData.js

@@ -1,27 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useAsyncData;
-
 var _lodash = require("lodash");
-
 var _react = require("react");
-
 var _uuid = require("uuid");
-
 var _GlobalStateProvider = require("./GlobalStateProvider");
-
 var _useGlobalState = _interopRequireDefault(require("./useGlobalState"));
-
 var _utils = require("./utils");
-
 /**
  * Loads and uses async data into the GlobalState path.
  */
+
 const DEFAULT_MAXAGE = 5 * 60 * 1000; // 5 minutes.
 
 /**
@@ -38,7 +31,6 @@ const DEFAULT_MAXAGE = 5 * 60 * 1000; // 5 minutes.
  * @return {Promise} Resolves once the operation is done.
  * @ignore
  */
-
 async function load(path, loader, globalState, oldData, opIdPrefix = 'C') {
   if (process.env.NODE_ENV !== 'production' && (0, _utils.isDebugMode)()) {
     /* eslint-disable no-console */
@@ -51,7 +43,6 @@ async function load(path, loader, globalState, oldData, opIdPrefix = 'C') {
   globalState.set(operationIdPath, operationId);
   const data = await loader(oldData || globalState.get(path).data);
   const state = globalState.get(path);
-
   if (operationId === state.operationId) {
     if (process.env.NODE_ENV !== 'production' && (0, _utils.isDebugMode)()) {
       /* eslint-disable no-console */
@@ -60,12 +51,12 @@ async function load(path, loader, globalState, oldData, opIdPrefix = 'C') {
       /* eslint-enable no-console */
     }
 
-    globalState.set(path, { ...state,
+    globalState.set(path, {
+      ...state,
       data,
       operationId: '',
       timestamp: Date.now()
     });
-
     if (process.env.NODE_ENV !== 'production' && (0, _utils.isDebugMode)()) {
       /* eslint-disable no-console */
       console.groupEnd();
@@ -73,6 +64,7 @@ async function load(path, loader, globalState, oldData, opIdPrefix = 'C') {
     }
   }
 }
+
 /**
  * Resolves asynchronous data, and stores them at given `path` of global
  * state. When multiple components rely on asynchronous data at the same `path`,
@@ -124,8 +116,6 @@ async function load(path, loader, globalState, oldData, opIdPrefix = 'C') {
  * _e.g._ {@link useGlobalState}, but doing so you may interfere with related
  * `useAsyncData()` hooks logic.
  */
-
-
 function useAsyncData(path, loader, options = {}) {
   let {
     garbageCollectAge,
@@ -134,22 +124,19 @@ function useAsyncData(path, loader, options = {}) {
   } = options;
   if (maxage === undefined) maxage = DEFAULT_MAXAGE;
   if (refreshAge === undefined) refreshAge = maxage;
-  if (garbageCollectAge === undefined) garbageCollectAge = maxage; // Note: here we can't depend on useGlobalState() to init the initial value,
-  // because that way we'll have issues with SSR (see details below).
+  if (garbageCollectAge === undefined) garbageCollectAge = maxage;
 
+  // Note: here we can't depend on useGlobalState() to init the initial value,
+  // because that way we'll have issues with SSR (see details below).
   const globalState = (0, _GlobalStateProvider.getGlobalState)();
-  let state = globalState.get(path);
-
-  if (state === undefined) {
-    state = {
+  const state = globalState.get(path, {
+    initialValue: {
       data: null,
       numRefs: 0,
       operationId: '',
       timestamp: 0
-    };
-    globalState.set(path, state);
-  }
-
+    }
+  });
   if (globalState.ssrContext && !options.noSSR) {
     if (!state.timestamp && !state.operationId) {
       globalState.ssrContext.pending.push(load(path, loader, globalState, state.data, 'S'));
@@ -171,7 +158,6 @@ function useAsyncData(path, loader, options = {}) {
       globalState.set(numRefsPath, numRefs + 1);
       return () => {
         const state2 = globalState.get(path);
-
         if (state2.numRefs === 1 && garbageCollectAge < Date.now() - state2.timestamp) {
           if (process.env.NODE_ENV !== 'production' && (0, _utils.isDebugMode)()) {
             /* eslint-disable no-console */
@@ -179,40 +165,43 @@ function useAsyncData(path, loader, options = {}) {
             /* eslint-enable no-console */
           }
 
-          globalState.set(path, { ...state2,
+          globalState.set(path, {
+            ...state2,
             data: null,
             numRefs: 0,
             timestamp: 0
           });
         } else globalState.set(numRefsPath, state2.numRefs - 1);
       };
-    }, [garbageCollectAge, globalState, path]); // Note: a bunch of Rules of Hooks ignored belows because in our very
+    }, [garbageCollectAge, globalState, path]);
+
+    // Note: a bunch of Rules of Hooks ignored belows because in our very
     // special case the otherwise wrong behavior is actually what we need.
-    // Data loading and refreshing.
 
+    // Data loading and refreshing.
     let loadTriggered = false;
     (0, _react.useEffect)(() => {
       // eslint-disable-line react-hooks/rules-of-hooks
       const state2 = globalState.get(path);
-
       if (refreshAge < Date.now() - state2.timestamp && (!state2.operationId || state2.operationId.charAt() === 'S')) {
         load(path, loader, globalState, state2.data);
         loadTriggered = true; // eslint-disable-line react-hooks/exhaustive-deps
       }
     });
+
     const deps = options.deps || [];
     (0, _react.useEffect)(() => {
       // eslint-disable-line react-hooks/rules-of-hooks
       if (!loadTriggered && deps.length) load(path, loader, globalState);
     }, deps); // eslint-disable-line react-hooks/exhaustive-deps
-  } // Note: this subscription to updates of the global state segment must be
-  // here, after the possible initialization of the loading operation, to take
-  // into effect the resulting loading state. This mostly ensures the correct
-  // SSR in the edge case when the loading starts, but times out, and incomplete
-  // render has to be served.
-
+  }
 
-  const [localState] = (0, _useGlobalState.default)(path);
+  const [localState] = (0, _useGlobalState.default)(path, {
+    data: null,
+    numRefs: 0,
+    operationId: '',
+    timestamp: 0
+  });
   return {
     data: maxage < Date.now() - localState.timestamp ? null : localState.data,
     loading: Boolean(localState.operationId),

package/build/node/useAsyncData.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/useAsyncData.js"],"names":["DEFAULT_MAXAGE","load","path","loader","globalState","oldData","opIdPrefix","process","env","NODE_ENV","console","log","operationId","operationIdPath","set","data","get","state","groupCollapsed","timestamp","Date","now","groupEnd","useAsyncData","options","garbageCollectAge","maxage","refreshAge","undefined","numRefs","ssrContext","noSSR","pending","push","numRefsPath","state2","loadTriggered","charAt","deps","length","localState","loading","Boolean"],"mappings":"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","sourcesContent":["/**\n * Loads and uses async data into the GlobalState path.\n */\n\nimport { cloneDeep } from 'lodash';\nimport { useEffect } from 'react';\nimport { v4 as uuid } from 'uuid';\n\nimport { getGlobalState } from './GlobalStateProvider';\nimport useGlobalState from './useGlobalState';\nimport { isDebugMode } from './utils';\n\nconst DEFAULT_MAXAGE = 5 * 60 * 1000; // 5 minutes.\n\n/**\n * Executes the data loading operation.\n * @param {string} path Data segment path inside the global state.\n * @param {function} loader Data loader.\n * @param {GlobalState} globalState The global state instance.\n * @param {any} [oldData] Optional. Previously fetched data, currently stored in\n *  the state, if already fetched by the caller; otherwise, they will be fetched\n *  by the load() function itself.\n * @param {string} [opIdPrefix='C'] operationId prefix to use, which should be\n * 'C' at the client-side (default), or 'S' at the server-side (within SSR\n * context).\n * @return {Promise} Resolves once the operation is done.\n * @ignore\n */\nasync function load(path, loader, globalState, oldData, opIdPrefix = 'C') {\n  if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n    /* eslint-disable no-console */\n    console.log(\n      `ReactGlobalState: useAsyncData data (re-)loading. Path: \"${path || ''}\"`,\n    );\n    /* eslint-enable no-console */\n  }\n  const operationId = opIdPrefix + uuid();\n  const operationIdPath = path ? `${path}.operationId` : 'operationId';\n  globalState.set(operationIdPath, operationId);\n  const data = await loader(oldData || globalState.get(path).data);\n  const state = globalState.get(path);\n  if (operationId === state.operationId) {\n    if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n      /* eslint-disable no-console */\n      console.groupCollapsed(\n        `ReactGlobalState: useAsyncData data (re-)loaded. Path: \"${\n          path || ''\n        }\"`,\n      );\n      console.log('Data:', cloneDeep(data));\n      /* eslint-enable no-console */\n    }\n    globalState.set(path, {\n      ...state,\n      data,\n      operationId: '',\n      timestamp: Date.now(),\n    });\n    if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n      /* eslint-disable no-console */\n      console.groupEnd();\n      /* eslint-enable no-console */\n    }\n  }\n}\n\n/**\n * Resolves asynchronous data, and stores them at given `path` of global\n * state. When multiple components rely on asynchronous data at the same `path`,\n * the data are resolved once, and reused until their age is within specified\n * bounds. Once the data are stale, the hook allows to refresh them. It also\n * garbage-collects stale data from the global state when the last component\n * relying on them is unmounted.\n * @param {string} path Dot-delimitered state path, where data envelop is\n * stored.\n * @param {AsyncDataLoader} loader Asynchronous function which resolves (loads)\n * data, which should be stored at the global state `path`. When multiple\n * components\n * use `useAsyncData()` hook for the same `path`, the library assumes that all\n * hook instances are called with the same `loader` (_i.e._ whichever of these\n * loaders is used to resolve async data, the result is acceptable to be reused\n * in all related components).\n * @param {object} [options] Additional options.\n * @param {any[]}  [options.deps=[]] An array of dependencies, which trigger\n * data reload when changed. Given dependency changes are watched shallowly\n * (similarly to the standard React's\n * [useEffect()](https://reactjs.org/docs/hooks-reference.html#useeffect)).\n * @param {boolean} [options.noSSR] If `true`, this hook won't load data during\n * server-side rendering.\n * @param {number} [options.garbageCollectAge=maxage] The maximum age of data\n * (in milliseconds), after which they are dropped from the state when the last\n * component referencing them via `useAsyncData()` hook unmounts. Defaults to\n * `maxage` option value.\n * @param {number} [options.maxage=5 x 60 x 1000] The maximum age of\n * data (in milliseconds) acceptable to the hook's caller. If loaded data are\n * older than this value, `null` is returned instead. Defaults to 5 minutes.\n * @param {number} [options.refreshAge=maxage] The maximum age of data\n * (in milliseconds), after which their refreshment will be triggered when\n * any component referencing them via `useAsyncData()` hook (re-)renders.\n * Defaults to `maxage` value.\n * @return {{\n *   data: any,\n *   loading: boolean,\n *   timestamp: number\n * }} Returns an object with three fields: `data` holds the actual result of\n * last `loader` invokation, if any, and if satisfies `maxage` limit; `loading`\n * is a boolean flag, which is `true` if data are being loaded (the hook is\n * waiting for `loader` function resolution); `timestamp` (in milliseconds)\n * is Unix timestamp of related data currently loaded into the global state.\n *\n * Note that loaded data, if any, are stored at the given `path` of global state\n * along with related meta-information, using slightly different state segment\n * structure (see {@link AsyncDataEnvelope}). That segment of the global state\n * can be accessed, and even modified using other hooks,\n * _e.g._ {@link useGlobalState}, but doing so you may interfere with related\n * `useAsyncData()` hooks logic.\n */\nexport default function useAsyncData(\n  path,\n  loader,\n  options = {},\n) {\n  let { garbageCollectAge, maxage, refreshAge } = options;\n  if (maxage === undefined) maxage = DEFAULT_MAXAGE;\n  if (refreshAge === undefined) refreshAge = maxage;\n  if (garbageCollectAge === undefined) garbageCollectAge = maxage;\n\n  // Note: here we can't depend on useGlobalState() to init the initial value,\n  // because that way we'll have issues with SSR (see details below).\n  const globalState = getGlobalState();\n  let state = globalState.get(path);\n  if (state === undefined) {\n    state = {\n      data: null,\n      numRefs: 0,\n      operationId: '',\n      timestamp: 0,\n    };\n    globalState.set(path, state);\n  }\n\n  if (globalState.ssrContext && !options.noSSR) {\n    if (!state.timestamp && !state.operationId) {\n      globalState.ssrContext.pending.push(\n        load(path, loader, globalState, state.data, 'S'),\n      );\n    }\n  } else {\n    // This takes care about the client-side reference counting, and garbage\n    // collection.\n    //\n    // Note: the Rules of Hook below are violated by conditional call to a hook,\n    // but as the condition is actually server-side or client-side environment,\n    // it is effectively non-conditional at the runtime.\n    //\n    // TODO: Though, maybe there is a way to refactor it into a cleaner code.\n    // The same applies to other useEffect() hooks below.\n    useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks\n      const numRefsPath = path ? `${path}.numRefs` : 'numRefs';\n      const numRefs = globalState.get(numRefsPath);\n      globalState.set(numRefsPath, numRefs + 1);\n      return () => {\n        const state2 = globalState.get(path);\n        if (\n          state2.numRefs === 1\n          && garbageCollectAge < Date.now() - state2.timestamp\n        ) {\n          if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n            /* eslint-disable no-console */\n            console.log(\n              `ReactGlobalState - useAsyncData garbage collected at path ${\n                path || ''\n              }`,\n            );\n            /* eslint-enable no-console */\n          }\n          globalState.set(path, {\n            ...state2,\n            data: null,\n            numRefs: 0,\n            timestamp: 0,\n          });\n        } else globalState.set(numRefsPath, state2.numRefs - 1);\n      };\n    }, [garbageCollectAge, globalState, path]);\n\n    // Note: a bunch of Rules of Hooks ignored belows because in our very\n    // special case the otherwise wrong behavior is actually what we need.\n\n    // Data loading and refreshing.\n    let loadTriggered = false;\n    useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks\n      const state2 = globalState.get(path);\n      if (refreshAge < Date.now() - state2.timestamp\n      && (!state2.operationId || state2.operationId.charAt() === 'S')) {\n        load(path, loader, globalState, state2.data);\n        loadTriggered = true; // eslint-disable-line react-hooks/exhaustive-deps\n      }\n    });\n\n    const deps = options.deps || [];\n    useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks\n      if (!loadTriggered && deps.length) load(path, loader, globalState);\n    }, deps); // eslint-disable-line react-hooks/exhaustive-deps\n  }\n\n  // Note: this subscription to updates of the global state segment must be\n  // here, after the possible initialization of the loading operation, to take\n  // into effect the resulting loading state. This mostly ensures the correct\n  // SSR in the edge case when the loading starts, but times out, and incomplete\n  // render has to be served.\n  const [localState] = useGlobalState(path);\n\n  return {\n    data: maxage < Date.now() - localState.timestamp ? null : localState.data,\n    loading: Boolean(localState.operationId),\n    timestamp: localState.timestamp,\n  };\n}\n"],"file":"useAsyncData.js"}
+{"version":3,"file":"useAsyncData.js","names":["DEFAULT_MAXAGE","load","path","loader","globalState","oldData","opIdPrefix","process","env","NODE_ENV","isDebugMode","console","log","operationId","uuid","operationIdPath","set","data","get","state","groupCollapsed","cloneDeep","timestamp","Date","now","groupEnd","useAsyncData","options","garbageCollectAge","maxage","refreshAge","undefined","getGlobalState","initialValue","numRefs","ssrContext","noSSR","pending","push","useEffect","numRefsPath","state2","loadTriggered","charAt","deps","length","localState","useGlobalState","loading","Boolean"],"sources":["../../src/useAsyncData.js"],"sourcesContent":["/**\n * Loads and uses async data into the GlobalState path.\n */\n\nimport { cloneDeep } from 'lodash';\nimport { useEffect } from 'react';\nimport { v4 as uuid } from 'uuid';\n\nimport { getGlobalState } from './GlobalStateProvider';\nimport useGlobalState from './useGlobalState';\nimport { isDebugMode } from './utils';\n\nconst DEFAULT_MAXAGE = 5 * 60 * 1000; // 5 minutes.\n\n/**\n * Executes the data loading operation.\n * @param {string} path Data segment path inside the global state.\n * @param {function} loader Data loader.\n * @param {GlobalState} globalState The global state instance.\n * @param {any} [oldData] Optional. Previously fetched data, currently stored in\n *  the state, if already fetched by the caller; otherwise, they will be fetched\n *  by the load() function itself.\n * @param {string} [opIdPrefix='C'] operationId prefix to use, which should be\n * 'C' at the client-side (default), or 'S' at the server-side (within SSR\n * context).\n * @return {Promise} Resolves once the operation is done.\n * @ignore\n */\nasync function load(path, loader, globalState, oldData, opIdPrefix = 'C') {\n  if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n    /* eslint-disable no-console */\n    console.log(\n      `ReactGlobalState: useAsyncData data (re-)loading. Path: \"${path || ''}\"`,\n    );\n    /* eslint-enable no-console */\n  }\n  const operationId = opIdPrefix + uuid();\n  const operationIdPath = path ? `${path}.operationId` : 'operationId';\n  globalState.set(operationIdPath, operationId);\n  const data = await loader(oldData || globalState.get(path).data);\n  const state = globalState.get(path);\n  if (operationId === state.operationId) {\n    if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n      /* eslint-disable no-console */\n      console.groupCollapsed(\n        `ReactGlobalState: useAsyncData data (re-)loaded. Path: \"${\n          path || ''\n        }\"`,\n      );\n      console.log('Data:', cloneDeep(data));\n      /* eslint-enable no-console */\n    }\n    globalState.set(path, {\n      ...state,\n      data,\n      operationId: '',\n      timestamp: Date.now(),\n    });\n    if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n      /* eslint-disable no-console */\n      console.groupEnd();\n      /* eslint-enable no-console */\n    }\n  }\n}\n\n/**\n * Resolves asynchronous data, and stores them at given `path` of global\n * state. When multiple components rely on asynchronous data at the same `path`,\n * the data are resolved once, and reused until their age is within specified\n * bounds. Once the data are stale, the hook allows to refresh them. It also\n * garbage-collects stale data from the global state when the last component\n * relying on them is unmounted.\n * @param {string} path Dot-delimitered state path, where data envelop is\n * stored.\n * @param {AsyncDataLoader} loader Asynchronous function which resolves (loads)\n * data, which should be stored at the global state `path`. When multiple\n * components\n * use `useAsyncData()` hook for the same `path`, the library assumes that all\n * hook instances are called with the same `loader` (_i.e._ whichever of these\n * loaders is used to resolve async data, the result is acceptable to be reused\n * in all related components).\n * @param {object} [options] Additional options.\n * @param {any[]}  [options.deps=[]] An array of dependencies, which trigger\n * data reload when changed. Given dependency changes are watched shallowly\n * (similarly to the standard React's\n * [useEffect()](https://reactjs.org/docs/hooks-reference.html#useeffect)).\n * @param {boolean} [options.noSSR] If `true`, this hook won't load data during\n * server-side rendering.\n * @param {number} [options.garbageCollectAge=maxage] The maximum age of data\n * (in milliseconds), after which they are dropped from the state when the last\n * component referencing them via `useAsyncData()` hook unmounts. Defaults to\n * `maxage` option value.\n * @param {number} [options.maxage=5 x 60 x 1000] The maximum age of\n * data (in milliseconds) acceptable to the hook's caller. If loaded data are\n * older than this value, `null` is returned instead. Defaults to 5 minutes.\n * @param {number} [options.refreshAge=maxage] The maximum age of data\n * (in milliseconds), after which their refreshment will be triggered when\n * any component referencing them via `useAsyncData()` hook (re-)renders.\n * Defaults to `maxage` value.\n * @return {{\n *   data: any,\n *   loading: boolean,\n *   timestamp: number\n * }} Returns an object with three fields: `data` holds the actual result of\n * last `loader` invokation, if any, and if satisfies `maxage` limit; `loading`\n * is a boolean flag, which is `true` if data are being loaded (the hook is\n * waiting for `loader` function resolution); `timestamp` (in milliseconds)\n * is Unix timestamp of related data currently loaded into the global state.\n *\n * Note that loaded data, if any, are stored at the given `path` of global state\n * along with related meta-information, using slightly different state segment\n * structure (see {@link AsyncDataEnvelope}). That segment of the global state\n * can be accessed, and even modified using other hooks,\n * _e.g._ {@link useGlobalState}, but doing so you may interfere with related\n * `useAsyncData()` hooks logic.\n */\nexport default function useAsyncData(\n  path,\n  loader,\n  options = {},\n) {\n  let { garbageCollectAge, maxage, refreshAge } = options;\n  if (maxage === undefined) maxage = DEFAULT_MAXAGE;\n  if (refreshAge === undefined) refreshAge = maxage;\n  if (garbageCollectAge === undefined) garbageCollectAge = maxage;\n\n  // Note: here we can't depend on useGlobalState() to init the initial value,\n  // because that way we'll have issues with SSR (see details below).\n  const globalState = getGlobalState();\n  const state = globalState.get(path, {\n    initialValue: {\n      data: null,\n      numRefs: 0,\n      operationId: '',\n      timestamp: 0,\n    },\n  });\n\n  if (globalState.ssrContext && !options.noSSR) {\n    if (!state.timestamp && !state.operationId) {\n      globalState.ssrContext.pending.push(\n        load(path, loader, globalState, state.data, 'S'),\n      );\n    }\n  } else {\n    // This takes care about the client-side reference counting, and garbage\n    // collection.\n    //\n    // Note: the Rules of Hook below are violated by conditional call to a hook,\n    // but as the condition is actually server-side or client-side environment,\n    // it is effectively non-conditional at the runtime.\n    //\n    // TODO: Though, maybe there is a way to refactor it into a cleaner code.\n    // The same applies to other useEffect() hooks below.\n    useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks\n      const numRefsPath = path ? `${path}.numRefs` : 'numRefs';\n      const numRefs = globalState.get(numRefsPath);\n      globalState.set(numRefsPath, numRefs + 1);\n      return () => {\n        const state2 = globalState.get(path);\n        if (\n          state2.numRefs === 1\n          && garbageCollectAge < Date.now() - state2.timestamp\n        ) {\n          if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n            /* eslint-disable no-console */\n            console.log(\n              `ReactGlobalState - useAsyncData garbage collected at path ${\n                path || ''\n              }`,\n            );\n            /* eslint-enable no-console */\n          }\n          globalState.set(path, {\n            ...state2,\n            data: null,\n            numRefs: 0,\n            timestamp: 0,\n          });\n        } else globalState.set(numRefsPath, state2.numRefs - 1);\n      };\n    }, [garbageCollectAge, globalState, path]);\n\n    // Note: a bunch of Rules of Hooks ignored belows because in our very\n    // special case the otherwise wrong behavior is actually what we need.\n\n    // Data loading and refreshing.\n    let loadTriggered = false;\n    useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks\n      const state2 = globalState.get(path);\n      if (refreshAge < Date.now() - state2.timestamp\n      && (!state2.operationId || state2.operationId.charAt() === 'S')) {\n        load(path, loader, globalState, state2.data);\n        loadTriggered = true; // eslint-disable-line react-hooks/exhaustive-deps\n      }\n    });\n\n    const deps = options.deps || [];\n    useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks\n      if (!loadTriggered && deps.length) load(path, loader, globalState);\n    }, deps); // eslint-disable-line react-hooks/exhaustive-deps\n  }\n\n  const [localState] = useGlobalState(path, {\n    data: null,\n    numRefs: 0,\n    operationId: '',\n    timestamp: 0,\n  });\n\n  return {\n    data: maxage < Date.now() - localState.timestamp ? null : localState.data,\n    loading: Boolean(localState.operationId),\n    timestamp: localState.timestamp,\n  };\n}\n"],"mappings":"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"}

package/build/node/useGlobalState.js

@@ -4,15 +4,10 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useGlobalState;
-
 var _lodash = require("lodash");
-
 var _react = require("react");
-
 var _GlobalStateProvider = require("./GlobalStateProvider");
-
 var _utils = require("./utils");
-
 // Hook for updates of global state.
 
 /**
@@ -66,67 +61,54 @@ var _utils = require("./utils");
  *   stable function: it does not change between component re-renders.
  */
 function useGlobalState(path, initialValue) {
-  const globalState = (0, _GlobalStateProvider.getGlobalState)();
-  let state = globalState.get(path);
-
-  if (state === undefined && initialValue !== undefined) {
-    const value = (0, _lodash.isFunction)(initialValue) ? initialValue() : initialValue;
-    state = globalState.set(path, value);
-  }
-
-  const [localState, setLocalState] = (0, _react.useState)(() => state);
-  (0, _react.useEffect)(() => {
-    // Note: the "callback.active" flag below is needed to workaround the issue
-    // https://github.com/birdofpreyru/react-global-state/issues/33,
-    // which, unfortunately, I am not able to reproduce in test environment,
-    // but I definitely seen it in the wild.
-    const callback = () => {
-      if (callback.active) {
-        const newState = globalState.get(path);
-        if (newState !== localState) setLocalState(() => newState);
-      }
-    };
-
-    callback.active = true;
-    globalState.watch(callback);
-    callback();
-    return () => {
-      delete callback.active;
-      globalState.unWatch(callback);
-    };
-  }, [globalState, localState, path]);
   const ref = (0, _react.useRef)();
-
   if (!ref.current) {
     ref.current = {
-      localState,
-      path,
+      callbacks: [],
       setter: value => {
-        const newValue = (0, _lodash.isFunction)(value) ? value(ref.current.localState) : value;
-
+        const rc = ref.current;
+        const newState = (0, _lodash.isFunction)(value) ? value(rc.state) : value;
         if (process.env.NODE_ENV !== 'production' && (0, _utils.isDebugMode)()) {
           /* eslint-disable no-console */
-          console.groupCollapsed(`ReactGlobalState - useGlobalState setter triggered for path ${ref.current.path || ''}`);
-          console.log('New value:', (0, _lodash.cloneDeep)(newValue));
+          console.groupCollapsed(`ReactGlobalState - useGlobalState setter triggered for path ${rc.path || ''}`);
+          console.log('New value:', (0, _lodash.cloneDeep)(newState));
           console.groupEnd();
           /* eslint-enable no-console */
         }
 
-        globalState.set(ref.current.path, newValue); // The update of local state here is important for managed inputs:
-        // if we wait until the global state change notification is delivered
-        // (which happens after the next React render), React won't conserve
-        // the text cursor inside the currently focused input field (the cursor
-        // will jump to the field end, like if the value was changed not by
-        // keyboard input).
-
-        setLocalState(() => newValue);
+        rc.globalState.set(rc.path, newState);
+      },
+      watcher: () => {
+        const rc = ref.current;
+        const state = rc.globalState.get(rc.path);
+        if (state !== rc.state) {
+          for (let i = 0; i < rc.callbacks.length; ++i) {
+            rc.callbacks[i]();
+          }
+        }
       }
     };
-  } else {
-    ref.current.localState = localState;
-    ref.current.path = path;
   }
-
-  return [localState, ref.current.setter];
+  const rc = ref.current;
+  const globalState = (0, _GlobalStateProvider.getGlobalState)();
+  rc.globalState = globalState;
+  rc.path = path;
+  rc.state = (0, _react.useSyncExternalStore)(cb => {
+    rc.callbacks.push(cb);
+  }, () => rc.globalState.get(rc.path, {
+    initialValue
+  }), () => rc.globalState.get(rc.path, {
+    initialValue,
+    initialState: true
+  }));
+  (0, _react.useEffect)(() => {
+    globalState.watch(rc.watcher);
+    rc.watcher();
+    return () => globalState.unWatch(rc.watcher);
+  }, [globalState, rc]);
+  (0, _react.useEffect)(() => {
+    rc.watcher();
+  }, [path, rc]);
+  return [rc.state, rc.setter];
 }
 //# sourceMappingURL=useGlobalState.js.map

package/build/node/useGlobalState.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/useGlobalState.js"],"names":["useGlobalState","path","initialValue","globalState","state","get","undefined","value","set","localState","setLocalState","callback","active","newState","watch","unWatch","ref","current","setter","newValue","process","env","NODE_ENV","console","groupCollapsed","log","groupEnd"],"mappings":"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","sourcesContent":["// Hook for updates of global state.\n\nimport { cloneDeep, isFunction } from 'lodash';\nimport { useEffect, useRef, useState } from 'react';\n\nimport { getGlobalState } from './GlobalStateProvider';\nimport { isDebugMode } from './utils';\n\n/**\n * The primary hook for interacting with the global state, modeled after\n * the standard React's\n * [useState](https://reactjs.org/docs/hooks-reference.html#usestate).\n * It subscribes a component to a given `path` of global state, and provides\n * a function to update it. Each time the value at `path` changes, the hook\n * triggers re-render of its host component.\n *\n * **Note:**\n * - For performance, the library does not copy objects written to / read from\n *   global state paths. You MUST NOT manually mutate returned state values,\n *   or change objects already written into the global state, without explicitly\n *   clonning them first yourself.\n * - State update notifications are asynchronous. When your code does multiple\n *   global state updates in the same React rendering cycle, all state update\n *   notifications are queued and dispatched together, after the current\n *   rendering cycle. In other words, in any given rendering cycle the global\n *   state values are \"fixed\", and all changes becomes visible at once in the\n *   next triggered rendering pass.\n *\n * @param {string} [path] Dot-delimitered state path. It can be undefined to\n * subscribe for entire state.\n *\n * Under-the-hood state values are read and written using `lodash`\n * [_.get()](https://lodash.com/docs/4.17.15#get) and\n * [_.set()](https://lodash.com/docs/4.17.15#set) methods, thus it is safe\n * to access state paths which have not been created before.\n * @param {any} [initialValue] Initial value to set at the `path`, or its\n * factory:\n * - If a function is given, it will act similar to\n *   [the lazy initial state of the standard React's useState()](https://reactjs.org/docs/hooks-reference.html#lazy-initial-state):\n *   only if the value at `path` is `undefined`, the function will be executed,\n *   and the value it returns will be written to the `path`.\n * - Otherwise, the given value itself will be written to the `path`,\n *   if the current value at `path` is `undefined`.\n * @return {Array} It returs an array with two elements: `[value, setValue]`:\n *\n * - The `value` is the current value at given `path`.\n *\n * - The `setValue()` is setter function to write a new value to the `path`.\n *\n *   Similar to the standard React's `useState()`, it supports\n *   [functional value updates](https://reactjs.org/docs/hooks-reference.html#functional-updates):\n *   if `setValue()` is called with a function as argument, that function will\n *   be called and its return value will be written to `path`. Otherwise,\n *   the argument of `setValue()` itself is written to `path`.\n *\n *   Also, similar to the standard React's state setters, `setValue()` is\n *   stable function: it does not change between component re-renders.\n */\nexport default function useGlobalState(path, initialValue) {\n  const globalState = getGlobalState();\n  let state = globalState.get(path);\n  if (state === undefined && initialValue !== undefined) {\n    const value = isFunction(initialValue) ? initialValue() : initialValue;\n    state = globalState.set(path, value);\n  }\n  const [\n    localState,\n    setLocalState,\n  ] = useState(() => state);\n\n  useEffect(() => {\n    // Note: the \"callback.active\" flag below is needed to workaround the issue\n    // https://github.com/birdofpreyru/react-global-state/issues/33,\n    // which, unfortunately, I am not able to reproduce in test environment,\n    // but I definitely seen it in the wild.\n    const callback = () => {\n      if (callback.active) {\n        const newState = globalState.get(path);\n        if (newState !== localState) setLocalState(() => newState);\n      }\n    };\n    callback.active = true;\n    globalState.watch(callback);\n    callback();\n    return () => {\n      delete callback.active;\n      globalState.unWatch(callback);\n    };\n  }, [globalState, localState, path]);\n\n  const ref = useRef();\n  if (!ref.current) {\n    ref.current = {\n      localState,\n      path,\n      setter: (value) => {\n        const newValue = isFunction(value)\n          ? value(ref.current.localState) : value;\n        if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n          /* eslint-disable no-console */\n          console.groupCollapsed(\n            `ReactGlobalState - useGlobalState setter triggered for path ${\n              ref.current.path || ''\n            }`,\n          );\n          console.log('New value:', cloneDeep(newValue));\n          console.groupEnd();\n          /* eslint-enable no-console */\n        }\n\n        globalState.set(ref.current.path, newValue);\n\n        // The update of local state here is important for managed inputs:\n        // if we wait until the global state change notification is delivered\n        // (which happens after the next React render), React won't conserve\n        // the text cursor inside the currently focused input field (the cursor\n        // will jump to the field end, like if the value was changed not by\n        // keyboard input).\n        setLocalState(() => newValue);\n      },\n    };\n  } else {\n    ref.current.localState = localState;\n    ref.current.path = path;\n  }\n\n  return [\n    localState,\n    ref.current.setter,\n  ];\n}\n"],"file":"useGlobalState.js"}
+{"version":3,"file":"useGlobalState.js","names":["useGlobalState","path","initialValue","ref","useRef","current","callbacks","setter","value","rc","newState","isFunction","state","process","env","NODE_ENV","isDebugMode","console","groupCollapsed","log","cloneDeep","groupEnd","globalState","set","watcher","get","i","length","getGlobalState","useSyncExternalStore","cb","push","initialState","useEffect","watch","unWatch"],"sources":["../../src/useGlobalState.js"],"sourcesContent":["// Hook for updates of global state.\n\nimport { cloneDeep, isFunction } from 'lodash';\nimport { useEffect, useRef, useSyncExternalStore } from 'react';\n\nimport { getGlobalState } from './GlobalStateProvider';\nimport { isDebugMode } from './utils';\n\n/**\n * The primary hook for interacting with the global state, modeled after\n * the standard React's\n * [useState](https://reactjs.org/docs/hooks-reference.html#usestate).\n * It subscribes a component to a given `path` of global state, and provides\n * a function to update it. Each time the value at `path` changes, the hook\n * triggers re-render of its host component.\n *\n * **Note:**\n * - For performance, the library does not copy objects written to / read from\n *   global state paths. You MUST NOT manually mutate returned state values,\n *   or change objects already written into the global state, without explicitly\n *   clonning them first yourself.\n * - State update notifications are asynchronous. When your code does multiple\n *   global state updates in the same React rendering cycle, all state update\n *   notifications are queued and dispatched together, after the current\n *   rendering cycle. In other words, in any given rendering cycle the global\n *   state values are \"fixed\", and all changes becomes visible at once in the\n *   next triggered rendering pass.\n *\n * @param {string} [path] Dot-delimitered state path. It can be undefined to\n * subscribe for entire state.\n *\n * Under-the-hood state values are read and written using `lodash`\n * [_.get()](https://lodash.com/docs/4.17.15#get) and\n * [_.set()](https://lodash.com/docs/4.17.15#set) methods, thus it is safe\n * to access state paths which have not been created before.\n * @param {any} [initialValue] Initial value to set at the `path`, or its\n * factory:\n * - If a function is given, it will act similar to\n *   [the lazy initial state of the standard React's useState()](https://reactjs.org/docs/hooks-reference.html#lazy-initial-state):\n *   only if the value at `path` is `undefined`, the function will be executed,\n *   and the value it returns will be written to the `path`.\n * - Otherwise, the given value itself will be written to the `path`,\n *   if the current value at `path` is `undefined`.\n * @return {Array} It returs an array with two elements: `[value, setValue]`:\n *\n * - The `value` is the current value at given `path`.\n *\n * - The `setValue()` is setter function to write a new value to the `path`.\n *\n *   Similar to the standard React's `useState()`, it supports\n *   [functional value updates](https://reactjs.org/docs/hooks-reference.html#functional-updates):\n *   if `setValue()` is called with a function as argument, that function will\n *   be called and its return value will be written to `path`. Otherwise,\n *   the argument of `setValue()` itself is written to `path`.\n *\n *   Also, similar to the standard React's state setters, `setValue()` is\n *   stable function: it does not change between component re-renders.\n */\nexport default function useGlobalState(path, initialValue) {\n  const ref = useRef();\n  if (!ref.current) {\n    ref.current = {\n      callbacks: [],\n      setter: (value) => {\n        const rc = ref.current;\n        const newState = isFunction(value) ? value(rc.state) : value;\n        if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n          /* eslint-disable no-console */\n          console.groupCollapsed(\n            `ReactGlobalState - useGlobalState setter triggered for path ${\n              rc.path || ''\n            }`,\n          );\n          console.log('New value:', cloneDeep(newState));\n          console.groupEnd();\n          /* eslint-enable no-console */\n        }\n        rc.globalState.set(rc.path, newState);\n      },\n      watcher: () => {\n        const rc = ref.current;\n        const state = rc.globalState.get(rc.path);\n        if (state !== rc.state) {\n          for (let i = 0; i < rc.callbacks.length; ++i) {\n            rc.callbacks[i]();\n          }\n        }\n      },\n    };\n  }\n\n  const rc = ref.current;\n  const globalState = getGlobalState();\n  rc.globalState = globalState;\n  rc.path = path;\n\n  rc.state = useSyncExternalStore(\n    (cb) => { rc.callbacks.push(cb); },\n    () => rc.globalState.get(rc.path, { initialValue }),\n    () => rc.globalState.get(rc.path, { initialValue, initialState: true }),\n  );\n\n  useEffect(() => {\n    globalState.watch(rc.watcher);\n    rc.watcher();\n    return () => globalState.unWatch(rc.watcher);\n  }, [globalState, rc]);\n\n  useEffect(() => {\n    rc.watcher();\n  }, [path, rc]);\n\n  return [rc.state, rc.setter];\n}\n"],"mappings":"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"}

package/build/node/utils.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 exports.isDebugMode = isDebugMode;
-
 // Auxiliary stuff.
 
 /**
@@ -27,7 +26,6 @@ function isDebugMode() {
     return false;
   }
 }
-
 var _default = null;
 exports.default = _default;
 //# sourceMappingURL=utils.js.map

package/build/node/utils.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/utils.js"],"names":["isDebugMode","process","env","NODE_ENV","REACT_GLOBAL_STATE_DEBUG","error"],"mappings":";;;;;;;;AAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,WAAT,GAAuB;AAC5B,MAAI;AACF,WAAOC,OAAO,CAACC,GAAR,CAAYC,QAAZ,KAAyB,YAAzB,IACF,CAAC,CAACF,OAAO,CAACC,GAAR,CAAYE,wBADnB;AAED,GAHD,CAGE,OAAOC,KAAP,EAAc;AACd,WAAO,KAAP;AACD;AACF;;eAEc,I","sourcesContent":["// Auxiliary stuff.\n\n/**\n * Returns 'true' if debug logging should be performed; 'false' otherwise.\n *\n * BEWARE: The actual safeguards for the debug logging still should read\n *  if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n *    // Some debug logging\n *  }\n * to ensure that debug code is stripped out by Webpack in production mode.\n *\n * @returns {boolean}\n * @ignore\n */\nexport function isDebugMode() {\n  try {\n    return process.env.NODE_ENV !== 'production'\n      && !!process.env.REACT_GLOBAL_STATE_DEBUG;\n  } catch (error) {\n    return false;\n  }\n}\n\nexport default null;\n"],"file":"utils.js"}
+{"version":3,"file":"utils.js","names":["isDebugMode","process","env","NODE_ENV","REACT_GLOBAL_STATE_DEBUG","error"],"sources":["../../src/utils.js"],"sourcesContent":["// Auxiliary stuff.\n\n/**\n * Returns 'true' if debug logging should be performed; 'false' otherwise.\n *\n * BEWARE: The actual safeguards for the debug logging still should read\n *  if (process.env.NODE_ENV !== 'production' && isDebugMode()) {\n *    // Some debug logging\n *  }\n * to ensure that debug code is stripped out by Webpack in production mode.\n *\n * @returns {boolean}\n * @ignore\n */\nexport function isDebugMode() {\n  try {\n    return process.env.NODE_ENV !== 'production'\n      && !!process.env.REACT_GLOBAL_STATE_DEBUG;\n  } catch (error) {\n    return false;\n  }\n}\n\nexport default null;\n"],"mappings":";;;;;;;AAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASA,WAAW,GAAG;EAC5B,IAAI;IACF,OAAOC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,IACvC,CAAC,CAACF,OAAO,CAACC,GAAG,CAACE,wBAAwB;EAC7C,CAAC,CAAC,OAAOC,KAAK,EAAE;IACd,OAAO,KAAK;EACd;AACF;AAAC,eAEc,IAAI;AAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dr.pogodin/react-global-state",
-  "version": "0.8.3",
+  "version": "0.9.1",
   "description": "Hook-based global state for React",
   "main": "./build/node/index.js",
   "exports": {
@@ -35,37 +35,37 @@
   },
   "homepage": "https://dr.pogodin.studio/docs/react-global-state/index.html",
   "dependencies": {
-    "@babel/runtime": "^7.17.9",
+    "@babel/runtime": "^7.19.4",
     "lodash": "^4.17.21",
-    "uuid": "^8.3.2"
+    "uuid": "^9.0.0"
   },
   "devDependencies": {
-    "@babel/cli": "^7.17.6",
-    "@babel/core": "^7.17.9",
-    "@babel/eslint-parser": "^7.17.0",
-    "@babel/eslint-plugin": "^7.17.7",
-    "@babel/node": "^7.16.8",
-    "@babel/plugin-transform-runtime": "^7.17.0",
-    "@babel/preset-env": "^7.16.11",
-    "@babel/preset-react": "^7.16.7",
-    "babel-jest": "^28.0.0",
+    "@babel/cli": "^7.19.3",
+    "@babel/core": "^7.19.6",
+    "@babel/eslint-parser": "^7.19.1",
+    "@babel/eslint-plugin": "^7.19.1",
+    "@babel/node": "^7.19.1",
+    "@babel/plugin-transform-runtime": "^7.19.6",
+    "@babel/preset-env": "^7.19.4",
+    "@babel/preset-react": "^7.18.6",
+    "babel-jest": "^29.2.1",
     "babel-plugin-module-resolver": "^4.1.0",
-    "eslint": "^8.14.0",
+    "eslint": "^8.25.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-import-resolver-babel-module": "^5.3.1",
     "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jest": "^26.1.5",
-    "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-react": "^7.29.4",
-    "eslint-plugin-react-hooks": "^4.4.0",
-    "jest": "^28.0.0",
-    "jest-environment-jsdom": "^28.0.0",
+    "eslint-plugin-jest": "^27.1.3",
+    "eslint-plugin-jsx-a11y": "^6.6.1",
+    "eslint-plugin-react": "^7.31.10",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "jest": "^29.2.1",
+    "jest-environment-jsdom": "^29.2.1",
     "mockdate": "^3.0.5",
     "pretty": "^2.0.0",
     "rimraf": "^3.0.2"
   },
   "peerDependencies": {
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0"
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
   }
 }