@dr.pogodin/react-global-state 0.12.0 → 0.14.0

package/build/module/useGlobalState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useGlobalState.js","names":["cloneDeep","isFunction","useEffect","useRef","useSyncExternalStore","Emitter","getGlobalState","isDebugMode","useGlobalState","path","initialValue","globalState","ref","rc","current","emitter","setter","value","newState","state","process","env","NODE_ENV","console","groupCollapsed","log","groupEnd","set","emit","watcher","get","cb","addListener","initialState","watch","unWatch"],"sources":["../../src/useGlobalState.ts"],"sourcesContent":["// Hook for updates of global state.\n\nimport { cloneDeep, isFunction } from 'lodash';\nimport { useEffect, useRef, useSyncExternalStore } from 'react';\n\nimport { Emitter } from '@dr.pogodin/js-utils';\n\nimport GlobalState from './GlobalState';\nimport { getGlobalState } from './GlobalStateProvider';\n\nimport {\n  type CallbackT,\n  type ForceT,\n  type LockT,\n  type TypeLock,\n  type ValueAtPathT,\n  type ValueOrInitializerT,\n  isDebugMode,\n} from './utils';\n\nexport type SetterT<T> = React.Dispatch<React.SetStateAction<T>>;\n\ntype GlobalStateRef = {\n  emitter: Emitter<[]>;\n  globalState: GlobalState<unknown>;\n  path: null | string | undefined;\n  setter: SetterT<unknown>;\n  state: unknown;\n  watcher: CallbackT;\n};\n\nexport type UseGlobalStateResT<T> = [T, SetterT<T>];\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 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 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 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 */\n\n// \"Enforced type overload\"\nfunction useGlobalState<\n  Forced extends ForceT | LockT = LockT,\n  ValueT = void,\n>(\n  path: null | string | undefined,\n  initialValue?: ValueOrInitializerT<TypeLock<Forced, never, ValueT>>,\n): UseGlobalStateResT<TypeLock<Forced, void, ValueT>>;\n\n// \"Entire state overload\"\nfunction useGlobalState<StateT>(): UseGlobalStateResT<StateT>;\n\n// \"State evaluation overload\"\nfunction useGlobalState<\n  StateT,\n  PathT extends null | string | undefined,\n>(\n  path: PathT,\n  initialValue?: ValueOrInitializerT<ValueAtPathT<StateT, PathT, never>>\n): UseGlobalStateResT<ValueAtPathT<StateT, PathT, void>>;\n\nfunction useGlobalState(\n  path?: null | string,\n  initialValue?: ValueOrInitializerT<unknown>,\n): UseGlobalStateResT<any> {\n  const globalState = getGlobalState();\n\n  const ref = useRef<GlobalStateRef>();\n  const rc: GlobalStateRef = ref.current || {\n    emitter: new Emitter(),\n    globalState,\n    path,\n    setter: (value) => {\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<ForceT, unknown>(rc.path, newState);\n\n      // NOTE: The regular global state's update notifications, automatically\n      // triggered by the rc.globalState.set() call above, are batched, and\n      // scheduled to fire asynchronosuly at a later time, which is problematic\n      // for managed text inputs - if they have their value update delayed to\n      // future render cycles, it will result in reset of their cursor position\n      // to the value end. Calling the rc.emitter.emit() below causes a sooner\n      // state update for the current component, thus working around the issue.\n      // For additional details see the original issue:\n      // https://github.com/birdofpreyru/react-global-state/issues/22\n      if (newState !== rc.state) rc.emitter.emit();\n    },\n    state: isFunction(initialValue) ? initialValue() : initialValue,\n    watcher: () => {\n      const state = rc.globalState.get(rc.path);\n      if (state !== rc.state) rc.emitter.emit();\n    },\n  };\n  ref.current = rc;\n\n  rc.globalState = globalState;\n  rc.path = path;\n\n  rc.state = useSyncExternalStore(\n    (cb) => rc.emitter.addListener(cb),\n    () => rc.globalState.get<ForceT, unknown>(rc.path, { initialValue }),\n    () => rc.globalState.get<ForceT, unknown>(rc.path, { initialValue, initialState: true }),\n  );\n\n  useEffect(() => {\n    const { watcher } = ref.current!;\n    globalState.watch(watcher);\n    watcher();\n    return () => globalState.unWatch(watcher);\n  }, [globalState]);\n\n  useEffect(() => {\n    ref.current!.watcher();\n  }, [path]);\n\n  return [rc.state, rc.setter];\n}\n\nexport default useGlobalState;\n\nexport interface UseGlobalStateI<StateT> {\n  (): UseGlobalStateResT<StateT>;\n\n  <PathT extends null | string | undefined>(\n    path: PathT,\n    initialValue?: ValueOrInitializerT<ValueAtPathT<StateT, PathT, never>>\n  ): UseGlobalStateResT<ValueAtPathT<StateT, PathT, void>>;\n\n  <Forced extends ForceT | LockT = LockT, ValueT = unknown>(\n    path: null | string | undefined,\n    initialValue?: ValueOrInitializerT<TypeLock<Forced, never, ValueT>>,\n  ): UseGlobalStateResT<TypeLock<Forced, void, ValueT>>;\n}\n"],"mappings":"AAAA;;AAEA,SAASA,SAAS,EAAEC,UAAU,QAAQ,QAAQ;AAC9C,SAASC,SAAS,EAAEC,MAAM,EAAEC,oBAAoB,QAAQ,OAAO;AAE/D,SAASC,OAAO,QAAQ,sBAAsB;AAG9C,SAASC,cAAc;AAEvB,SAOEC,WAAW;;AAgBb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AASA;;AAGA;;AASA,SAASC,cAAcA,CACrBC,IAAoB,EACpBC,YAA2C,EAClB;EACzB,MAAMC,WAAW,GAAGL,cAAc,CAAC,CAAC;EAEpC,MAAMM,GAAG,GAAGT,MAAM,CAAiB,CAAC;EACpC,MAAMU,EAAkB,GAAGD,GAAG,CAACE,OAAO,IAAI;IACxCC,OAAO,EAAE,IAAIV,OAAO,CAAC,CAAC;IACtBM,WAAW;IACXF,IAAI;IACJO,MAAM,EAAGC,KAAK,IAAK;MACjB,MAAMC,QAAQ,GAAGjB,UAAU,CAACgB,KAAK,CAAC,GAAGA,KAAK,CAACJ,EAAE,CAACM,KAAK,CAAC,GAAGF,KAAK;MAC5D,IAAIG,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,IAAIf,WAAW,CAAC,CAAC,EAAE;QAC1D;QACAgB,OAAO,CAACC,cAAc,CACnB,+DACCX,EAAE,CAACJ,IAAI,IAAI,EACZ,EACH,CAAC;QACDc,OAAO,CAACE,GAAG,CAAC,YAAY,EAAEzB,SAAS,CAACkB,QAAQ,CAAC,CAAC;QAC9CK,OAAO,CAACG,QAAQ,CAAC,CAAC;QAClB;MACF;MACAb,EAAE,CAACF,WAAW,CAACgB,GAAG,CAAkBd,EAAE,CAACJ,IAAI,EAAES,QAAQ,CAAC;;MAEtD;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA;MACA,IAAIA,QAAQ,KAAKL,EAAE,CAACM,KAAK,EAAEN,EAAE,CAACE,OAAO,CAACa,IAAI,CAAC,CAAC;IAC9C,CAAC;IACDT,KAAK,EAAElB,UAAU,CAACS,YAAY,CAAC,GAAGA,YAAY,CAAC,CAAC,GAAGA,YAAY;IAC/DmB,OAAO,EAAEA,CAAA,KAAM;MACb,MAAMV,KAAK,GAAGN,EAAE,CAACF,WAAW,CAACmB,GAAG,CAACjB,EAAE,CAACJ,IAAI,CAAC;MACzC,IAAIU,KAAK,KAAKN,EAAE,CAACM,KAAK,EAAEN,EAAE,CAACE,OAAO,CAACa,IAAI,CAAC,CAAC;IAC3C;EACF,CAAC;EACDhB,GAAG,CAACE,OAAO,GAAGD,EAAE;EAEhBA,EAAE,CAACF,WAAW,GAAGA,WAAW;EAC5BE,EAAE,CAACJ,IAAI,GAAGA,IAAI;EAEdI,EAAE,CAACM,KAAK,GAAGf,oBAAoB,CAC5B2B,EAAE,IAAKlB,EAAE,CAACE,OAAO,CAACiB,WAAW,CAACD,EAAE,CAAC,EAClC,MAAMlB,EAAE,CAACF,WAAW,CAACmB,GAAG,CAAkBjB,EAAE,CAACJ,IAAI,EAAE;IAAEC;EAAa,CAAC,CAAC,EACpE,MAAMG,EAAE,CAACF,WAAW,CAACmB,GAAG,CAAkBjB,EAAE,CAACJ,IAAI,EAAE;IAAEC,YAAY;IAAEuB,YAAY,EAAE;EAAK,CAAC,CACzF,CAAC;EAED/B,SAAS,CAAC,MAAM;IACd,MAAM;MAAE2B;IAAQ,CAAC,GAAGjB,GAAG,CAACE,OAAQ;IAChCH,WAAW,CAACuB,KAAK,CAACL,OAAO,CAAC;IAC1BA,OAAO,CAAC,CAAC;IACT,OAAO,MAAMlB,WAAW,CAACwB,OAAO,CAACN,OAAO,CAAC;EAC3C,CAAC,EAAE,CAAClB,WAAW,CAAC,CAAC;EAEjBT,SAAS,CAAC,MAAM;IACdU,GAAG,CAACE,OAAO,CAAEe,OAAO,CAAC,CAAC;EACxB,CAAC,EAAE,CAACpB,IAAI,CAAC,CAAC;EAEV,OAAO,CAACI,EAAE,CAACM,KAAK,EAAEN,EAAE,CAACG,MAAM,CAAC;AAC9B;AAEA,eAAeR,cAAc"}
+{"version":3,"file":"useGlobalState.js","names":["cloneDeep","isFunction","useEffect","useRef","useSyncExternalStore","Emitter","getGlobalState","isDebugMode","useGlobalState","path","initialValue","globalState","ref","rc","current","emitter","setter","value","newState","get","process","env","NODE_ENV","console","groupCollapsed","log","groupEnd","set","state","emit","subscribe","addListener","bind","watcher","initialState","watch","unWatch"],"sources":["../../src/useGlobalState.ts"],"sourcesContent":["// Hook for updates of global state.\n\nimport { cloneDeep, isFunction } from 'lodash';\nimport { useEffect, useRef, useSyncExternalStore } from 'react';\n\nimport { Emitter } from '@dr.pogodin/js-utils';\n\nimport GlobalState from './GlobalState';\nimport { getGlobalState } from './GlobalStateProvider';\n\nimport {\n  type CallbackT,\n  type ForceT,\n  type LockT,\n  type TypeLock,\n  type ValueAtPathT,\n  type ValueOrInitializerT,\n  isDebugMode,\n} from './utils';\n\nexport type SetterT<T> = React.Dispatch<React.SetStateAction<T>>;\n\ntype ListenerT = () => void;\n\ntype GlobalStateRef = {\n  emitter: Emitter<[]>;\n  globalState: GlobalState<unknown>;\n  path: null | string | undefined;\n  setter: SetterT<unknown>;\n  subscribe: (listener: ListenerT) => () => void;\n  state: unknown;\n  watcher: CallbackT;\n};\n\nexport type UseGlobalStateResT<T> = [T, SetterT<T>];\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 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 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 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 */\n\n// \"Enforced type overload\"\nfunction useGlobalState<\n  Forced extends ForceT | LockT = LockT,\n  ValueT = void,\n>(\n  path: null | string | undefined,\n  initialValue?: ValueOrInitializerT<TypeLock<Forced, never, ValueT>>,\n): UseGlobalStateResT<TypeLock<Forced, void, ValueT>>;\n\n// \"Entire state overload\"\nfunction useGlobalState<StateT>(): UseGlobalStateResT<StateT>;\n\n// \"State evaluation overload\"\nfunction useGlobalState<\n  StateT,\n  PathT extends null | string | undefined,\n>(\n  path: PathT,\n  initialValue?: ValueOrInitializerT<ValueAtPathT<StateT, PathT, never>>\n): UseGlobalStateResT<ValueAtPathT<StateT, PathT, void>>;\n\nfunction useGlobalState(\n  path?: null | string,\n  initialValue?: ValueOrInitializerT<unknown>,\n): UseGlobalStateResT<any> {\n  const globalState = getGlobalState();\n\n  const ref = useRef<GlobalStateRef>();\n\n  let rc: GlobalStateRef;\n  if (!ref.current) {\n    const emitter = new Emitter();\n    ref.current = {\n      emitter,\n      globalState,\n      path,\n      setter: (value) => {\n        const newState = isFunction(value)\n          ? value(rc!.globalState.get(rc!.path))\n          : value;\n\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<ForceT, unknown>(rc!.path, newState);\n\n        // NOTE: The regular global state's update notifications, automatically\n        // triggered by the rc.globalState.set() call above, are batched, and\n        // scheduled to fire asynchronosuly at a later time, which is problematic\n        // for managed text inputs - if they have their value update delayed to\n        // future render cycles, it will result in reset of their cursor position\n        // to the value end. Calling the rc.emitter.emit() below causes a sooner\n        // state update for the current component, thus working around the issue.\n        // For additional details see the original issue:\n        // https://github.com/birdofpreyru/react-global-state/issues/22\n        if (newState !== rc!.state) rc!.emitter.emit();\n      },\n      state: isFunction(initialValue) ? initialValue() : initialValue,\n      subscribe: emitter.addListener.bind(emitter),\n      watcher: () => {\n        const state = rc!.globalState.get(rc!.path);\n        if (state !== rc!.state) rc!.emitter.emit();\n      },\n    };\n  }\n  rc = ref.current!;\n\n  rc.globalState = globalState;\n  rc.path = path;\n\n  rc.state = useSyncExternalStore(\n    rc.subscribe,\n    () => rc!.globalState.get<ForceT, unknown>(rc!.path, { initialValue }),\n\n    () => rc!.globalState.get<ForceT, unknown>(\n      rc!.path,\n      { initialValue, initialState: true },\n    ),\n  );\n\n  useEffect(() => {\n    const { watcher } = ref.current!;\n    globalState.watch(watcher);\n    watcher();\n    return () => globalState.unWatch(watcher);\n  }, [globalState]);\n\n  useEffect(() => {\n    ref.current!.watcher();\n  }, [path]);\n\n  return [rc.state, rc.setter];\n}\n\nexport default useGlobalState;\n\nexport interface UseGlobalStateI<StateT> {\n  (): UseGlobalStateResT<StateT>;\n\n  <PathT extends null | string | undefined>(\n    path: PathT,\n    initialValue?: ValueOrInitializerT<ValueAtPathT<StateT, PathT, never>>\n  ): UseGlobalStateResT<ValueAtPathT<StateT, PathT, void>>;\n\n  <Forced extends ForceT | LockT = LockT, ValueT = unknown>(\n    path: null | string | undefined,\n    initialValue?: ValueOrInitializerT<TypeLock<Forced, never, ValueT>>,\n  ): UseGlobalStateResT<TypeLock<Forced, void, ValueT>>;\n}\n"],"mappings":"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","ignoreList":[]}

package/build/module/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","names":["isDebugMode","process","env","NODE_ENV","REACT_GLOBAL_STATE_DEBUG","error"],"sources":["../../src/utils.ts"],"sourcesContent":["import { type GetFieldType } from 'lodash';\n\nexport type CallbackT = () => void;\n\n// TODO: This (ForceT, LockT, and TypeLock) probably should be moved to JS Utils\n// lib.\n\ndeclare const force: unique symbol;\ndeclare const lock: unique symbol;\n\nexport type ForceT = typeof force;\nexport type LockT = typeof lock;\n\nexport type TypeLock<\n  Unlocked extends ForceT | LockT,\n  LockedT extends never | void,\n  UnlockedT,\n> = Unlocked extends ForceT ? UnlockedT : LockedT;\n\n/**\n * Given the type of state, `StateT`, and the type of state path, `PathT`,\n * it evaluates the type of value at that path of the state, if it can be\n * evaluated from the path type (it is possible when `PathT` is a string\n * literal type, and `StateT` elements along this path have appropriate\n * types); otherwise it falls back to the specified `UnknownT` type,\n * which should be set either `never` (for input arguments), or `void`\n * (for return types) - `never` and `void` in those places forbid assignments,\n * and are not auto-inferred to more permissible types.\n *\n * BEWARE: When StateT is any the construct resolves to any for any string\n * paths.\n */\nexport type ValueAtPathT<\n  StateT,\n  PathT extends null | string | undefined,\n  UnknownT extends never | undefined | void,\n> = unknown extends StateT\n  ? UnknownT\n  : string extends PathT\n    ? UnknownT\n    : PathT extends null | undefined\n      ? StateT\n      : GetFieldType<StateT, PathT> extends undefined\n        ? UnknownT : GetFieldType<StateT, PathT>;\n\nexport type ValueOrInitializerT<ValueT> = ValueT | (() => ValueT);\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\n * @ignore\n */\nexport function isDebugMode(): boolean {\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"],"mappings":"AAIA;AACA;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,WAAWA,CAAA,EAAY;EACrC,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"}
+{"version":3,"file":"utils.js","names":["isDebugMode","process","env","NODE_ENV","REACT_GLOBAL_STATE_DEBUG","error"],"sources":["../../src/utils.ts"],"sourcesContent":["import { type GetFieldType } from 'lodash';\n\nexport type CallbackT = () => void;\n\n// TODO: This (ForceT, LockT, and TypeLock) probably should be moved to JS Utils\n// lib.\n\ndeclare const force: unique symbol;\ndeclare const lock: unique symbol;\n\nexport type ForceT = typeof force;\nexport type LockT = typeof lock;\n\nexport type TypeLock<\n  Unlocked extends ForceT | LockT,\n  LockedT extends never | void,\n  UnlockedT,\n> = Unlocked extends ForceT ? UnlockedT : LockedT;\n\n/**\n * Given the type of state, `StateT`, and the type of state path, `PathT`,\n * it evaluates the type of value at that path of the state, if it can be\n * evaluated from the path type (it is possible when `PathT` is a string\n * literal type, and `StateT` elements along this path have appropriate\n * types); otherwise it falls back to the specified `UnknownT` type,\n * which should be set either `never` (for input arguments), or `void`\n * (for return types) - `never` and `void` in those places forbid assignments,\n * and are not auto-inferred to more permissible types.\n *\n * BEWARE: When StateT is any the construct resolves to any for any string\n * paths.\n */\nexport type ValueAtPathT<\n  StateT,\n  PathT extends null | string | undefined,\n  UnknownT extends never | undefined | void,\n> = unknown extends StateT\n  ? UnknownT\n  : string extends PathT\n    ? UnknownT\n    : PathT extends null | undefined\n      ? StateT\n      : GetFieldType<StateT, PathT> extends undefined\n        ? UnknownT : GetFieldType<StateT, PathT>;\n\nexport type ValueOrInitializerT<ValueT> = ValueT | (() => ValueT);\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\n * @ignore\n */\nexport function isDebugMode(): boolean {\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"],"mappings":"AAIA;AACA;;AAcA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAgBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,WAAWA,CAAA,EAAY;EACrC,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","ignoreList":[]}

package/build/types/useAsyncData.d.ts

@@ -9,7 +9,10 @@ export type AsyncDataEnvelopeT<DataT> = {
     operationId: string;
     timestamp: number;
 };
-export declare function newAsyncDataEnvelope<DataT>(initialData?: DataT | null): AsyncDataEnvelopeT<DataT>;
+export declare function newAsyncDataEnvelope<DataT>(initialData?: DataT | null, { numRefs, timestamp }?: {
+    numRefs?: number | undefined;
+    timestamp?: number | undefined;
+}): AsyncDataEnvelopeT<DataT>;
 export type UseAsyncDataOptionsT = {
     deps?: unknown[];
     garbageCollectAge?: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dr.pogodin/react-global-state",
-  "version": "0.12.0",
+  "version": "0.14.0",
   "description": "Hook-based global state for React",
   "main": "./build/common/index.js",
   "react-native": "src/index.ts",
@@ -43,41 +43,40 @@
     "node": ">=18"
   },
   "dependencies": {
-    "@babel/runtime": "^7.23.6",
-    "@dr.pogodin/js-utils": "^0.0.6",
-    "@types/lodash": "^4.14.202",
+    "@babel/runtime": "^7.24.1",
+    "@dr.pogodin/js-utils": "^0.0.9",
+    "@types/lodash": "^4.17.0",
     "lodash": "^4.17.21",
     "uuid": "^9.0.1"
   },
   "devDependencies": {
-    "@babel/cli": "^7.23.4",
-    "@babel/core": "^7.23.6",
-    "@babel/eslint-parser": "^7.23.3",
+    "@babel/cli": "^7.24.1",
+    "@babel/core": "^7.24.3",
+    "@babel/eslint-parser": "^7.24.1",
     "@babel/eslint-plugin": "^7.23.5",
-    "@babel/node": "^7.22.19",
-    "@babel/plugin-transform-runtime": "^7.23.6",
-    "@babel/preset-env": "^7.23.6",
-    "@babel/preset-react": "^7.23.3",
-    "@babel/preset-typescript": "^7.23.3",
-    "@tsconfig/recommended": "^1.0.3",
-    "@tsd/typescript": "^5.3.3",
-    "@types/jest": "^29.5.11",
+    "@babel/node": "^7.23.9",
+    "@babel/plugin-transform-runtime": "^7.24.3",
+    "@babel/preset-env": "^7.24.3",
+    "@babel/preset-react": "^7.24.1",
+    "@babel/preset-typescript": "^7.24.1",
+    "@tsconfig/recommended": "^1.0.5",
+    "@tsd/typescript": "^5.4.3",
+    "@types/jest": "^29.5.12",
     "@types/pretty": "^2.0.3",
-    "@types/react": "^18.2.43",
-    "@types/react-dom": "^18.2.17",
-    "@types/uuid": "^9.0.7",
-    "@typescript-eslint/eslint-plugin": "^6.13.2",
-    "@typescript-eslint/parser": "^6.13.2",
+    "@types/react": "^18.2.73",
+    "@types/react-dom": "^18.2.23",
+    "@types/uuid": "^9.0.8",
+    "typescript-eslint": "^7.4.0",
     "babel-jest": "^29.7.0",
     "babel-plugin-module-resolver": "^5.0.0",
-    "eslint": "^8.55.0",
+    "eslint": "^8.57.0",
     "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-airbnb-typescript": "^17.1.0",
+    "eslint-config-airbnb-typescript": "^18.0.0",
     "eslint-import-resolver-babel-module": "^5.3.2",
-    "eslint-plugin-import": "^2.29.0",
-    "eslint-plugin-jest": "^27.6.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jest": "^27.9.0",
     "eslint-plugin-jsx-a11y": "^6.8.0",
-    "eslint-plugin-react": "^7.33.2",
+    "eslint-plugin-react": "^7.34.1",
     "eslint-plugin-react-hooks": "^4.6.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
@@ -85,8 +84,8 @@
     "mockdate": "^3.0.5",
     "pretty": "^2.0.0",
     "rimraf": "^5.0.1",
-    "tsd-lite": "^0.8.1",
-    "typescript": "^5.3.3"
+    "tsd-lite": "^0.9.0",
+    "typescript": "^5.4.3"
   },
   "peerDependencies": {
     "react": "^18.2.0",

package/src/useAsyncData.ts

@@ -36,12 +36,13 @@ export type AsyncDataEnvelopeT<DataT> = {
 
 export function newAsyncDataEnvelope<DataT>(
   initialData: DataT | null = null,
+  { numRefs = 0, timestamp = 0 } = {},
 ): AsyncDataEnvelopeT<DataT> {
   return {
     data: initialData,
-    numRefs: 0,
+    numRefs,
     operationId: '',
-    timestamp: 0,
+    timestamp,
   };
 }
 
@@ -280,12 +281,16 @@ function useAsyncData<DataT>(
       }
     });
 
-    const deps = options.deps || [];
     useEffect(() => { // eslint-disable-line react-hooks/rules-of-hooks
-      if (globalState.hasChangedDependencies(path || '', deps) && !loadTriggered) {
+      const { deps } = options;
+      if (deps && globalState.hasChangedDependencies(path || '', deps) && !loadTriggered) {
         load(path, loader, globalState, null);
       }
-    }, deps); // eslint-disable-line react-hooks/exhaustive-deps
+
+    // Here we need to default to empty array, so that this hook is re-evaluated
+    // only when dependencies specified in options change, and it should not be
+    // re-evaluated at all if no `deps` option is used.
+    }, options.deps || []); // eslint-disable-line react-hooks/exhaustive-deps
   }
 
   const [localState] = useGlobalState<ForceT, AsyncDataEnvelopeT<DataT>>(

package/src/useGlobalState.ts

@@ -20,11 +20,14 @@ import {
 
 export type SetterT<T> = React.Dispatch<React.SetStateAction<T>>;
 
+type ListenerT = () => void;
+
 type GlobalStateRef = {
   emitter: Emitter<[]>;
   globalState: GlobalState<unknown>;
   path: null | string | undefined;
   setter: SetterT<unknown>;
+  subscribe: (listener: ListenerT) => () => void;
   state: unknown;
   watcher: CallbackT;
 };
@@ -110,51 +113,64 @@ function useGlobalState(
   const globalState = getGlobalState();
 
   const ref = useRef<GlobalStateRef>();
-  const rc: GlobalStateRef = ref.current || {
-    emitter: new Emitter(),
-    globalState,
-    path,
-    setter: (value) => {
-      const newState = isFunction(value) ? value(rc.state) : value;
-      if (process.env.NODE_ENV !== 'production' && isDebugMode()) {
-        /* eslint-disable no-console */
-        console.groupCollapsed(
-          `ReactGlobalState - useGlobalState setter triggered for path ${
-            rc.path || ''
-          }`,
-        );
-        console.log('New value:', cloneDeep(newState));
-        console.groupEnd();
-        /* eslint-enable no-console */
-      }
-      rc.globalState.set<ForceT, unknown>(rc.path, newState);
-
-      // NOTE: The regular global state's update notifications, automatically
-      // triggered by the rc.globalState.set() call above, are batched, and
-      // scheduled to fire asynchronosuly at a later time, which is problematic
-      // for managed text inputs - if they have their value update delayed to
-      // future render cycles, it will result in reset of their cursor position
-      // to the value end. Calling the rc.emitter.emit() below causes a sooner
-      // state update for the current component, thus working around the issue.
-      // For additional details see the original issue:
-      // https://github.com/birdofpreyru/react-global-state/issues/22
-      if (newState !== rc.state) rc.emitter.emit();
-    },
-    state: isFunction(initialValue) ? initialValue() : initialValue,
-    watcher: () => {
-      const state = rc.globalState.get(rc.path);
-      if (state !== rc.state) rc.emitter.emit();
-    },
-  };
-  ref.current = rc;
+
+  let rc: GlobalStateRef;
+  if (!ref.current) {
+    const emitter = new Emitter();
+    ref.current = {
+      emitter,
+      globalState,
+      path,
+      setter: (value) => {
+        const newState = isFunction(value)
+          ? value(rc!.globalState.get(rc!.path))
+          : value;
+
+        if (process.env.NODE_ENV !== 'production' && isDebugMode()) {
+          /* eslint-disable no-console */
+          console.groupCollapsed(
+            `ReactGlobalState - useGlobalState setter triggered for path ${
+              rc!.path || ''
+            }`,
+          );
+          console.log('New value:', cloneDeep(newState));
+          console.groupEnd();
+          /* eslint-enable no-console */
+        }
+        rc!.globalState.set<ForceT, unknown>(rc!.path, newState);
+
+        // NOTE: The regular global state's update notifications, automatically
+        // triggered by the rc.globalState.set() call above, are batched, and
+        // scheduled to fire asynchronosuly at a later time, which is problematic
+        // for managed text inputs - if they have their value update delayed to
+        // future render cycles, it will result in reset of their cursor position
+        // to the value end. Calling the rc.emitter.emit() below causes a sooner
+        // state update for the current component, thus working around the issue.
+        // For additional details see the original issue:
+        // https://github.com/birdofpreyru/react-global-state/issues/22
+        if (newState !== rc!.state) rc!.emitter.emit();
+      },
+      state: isFunction(initialValue) ? initialValue() : initialValue,
+      subscribe: emitter.addListener.bind(emitter),
+      watcher: () => {
+        const state = rc!.globalState.get(rc!.path);
+        if (state !== rc!.state) rc!.emitter.emit();
+      },
+    };
+  }
+  rc = ref.current!;
 
   rc.globalState = globalState;
   rc.path = path;
 
   rc.state = useSyncExternalStore(
-    (cb) => rc.emitter.addListener(cb),
-    () => rc.globalState.get<ForceT, unknown>(rc.path, { initialValue }),
-    () => rc.globalState.get<ForceT, unknown>(rc.path, { initialValue, initialState: true }),
+    rc.subscribe,
+    () => rc!.globalState.get<ForceT, unknown>(rc!.path, { initialValue }),
+
+    () => rc!.globalState.get<ForceT, unknown>(
+      rc!.path,
+      { initialValue, initialState: true },
+    ),
   );
 
   useEffect(() => {