@contember/react-utils 1.3.0-alpha.8 → 2.0.0-alpha.1

package/dist/development/index.js

@@ -1,25 +1,18 @@
-import { createNonNullableContextFactory } from "./context/createNonNullableContextFactory.js";
-import { createOptionalContextFactory } from "./context/createOptionalContextFactory.js";
+import { createRequiredContext } from "./context/createRequiredContext.js";
+import { createContext } from "./context/createContext.js";
 import { isNoopScopedConsole, noopLog, noopLogged, noopScopedConsole } from "./debug-context/Constants.js";
 import { DebugChildren, ScopedConsoleContext, useScopedConsoleRef } from "./debug-context/Context.js";
 import { unwrapRefValue } from "./hooks/unwrapRefValue.js";
 import { useAbortController } from "./hooks/useAbortController.js";
-import { useAddClassNameDuringResize } from "./hooks/useAddClassNameDuringResize.js";
 import { useArrayMapMemo } from "./hooks/useArrayMapMemo.js";
 import { useAutoHeightTextArea } from "./hooks/useAutoHeightTextArea.js";
 import { getChildrenAsLabel, useChildrenAsLabel } from "./hooks/useChildrenAsLabel.js";
-import { useCloseOnClickOutside } from "./hooks/useCloseOnClickOutside.js";
-import { useCloseOnEscape } from "./hooks/useCloseOnEscape.js";
 import { useComposeRef } from "./hooks/useComposeRef.js";
 import { useConstantLengthInvariant } from "./hooks/useConstantLengthInvariant.js";
 import { useConstantValueInvariant } from "./hooks/useConstantValueInvariant.js";
-import { ContainerWidthContext, useContainerWidth } from "./hooks/useContainerWidth.js";
 import { useDebounce } from "./hooks/useDebounce.js";
 import { useDebounceCallback } from "./hooks/useDebounceCallback.js";
 import { useDocumentTitle } from "./hooks/useDocumentTitle.js";
-import { useElementSize } from "./hooks/useElementSize.js";
-import { useElementTopOffset } from "./hooks/useElementTopOffset.js";
-import { useEventHandler } from "./hooks/useEventHandler.js";
 import { useExpectSameValueReference } from "./hooks/useExpectSameValueReference.js";
 import { useForceRender } from "./hooks/useForceRender.js";
 import { useId } from "./hooks/useId.js";
@@ -27,13 +20,10 @@ import { useIsMounted } from "./hooks/useIsMounted.js";
 import { useObjectMemo } from "./hooks/useObjectMemo.js";
 import { useOnElementClickOutsideCallback } from "./hooks/useOnElementClickOutsideCallback.js";
 import { useOnElementMouseEnterDelayedCallback } from "./hooks/useOnElementMouseEnterDelayedCallback.js";
-import { useOnElementMutation } from "./hooks/useOnElementMutation.js";
 import { useOnElementResize } from "./hooks/useOnElementResize.js";
-import { useOnScrollWithin } from "./hooks/useOnScrollWithin.js";
 import { useOnWindowResize } from "./hooks/useOnWindowResize.js";
 import { usePreviousValue } from "./hooks/usePreviousValue.js";
-import { useScrollOffsets } from "./hooks/useScrollOffsets.js";
-import { useSessionStorageState } from "./hooks/useStoredState.js";
+import { getStateStorage, localStateStorage, nullStorage, sessionStateStorage, urlStateStorage, useLocalStorageState, useSessionStorageState, useStoredState } from "./hooks/useStoredState.js";
 import { useUpdatedRef } from "./hooks/useUpdatedRef.js";
 import { useWindowSize } from "./hooks/useWindowSize.js";
 import { emptyArray } from "./referentiallyStable/emptyArray.js";
@@ -43,73 +33,53 @@ import { noop } from "./referentiallyStable/noop.js";
 import { returnFalse } from "./referentiallyStable/returnFalse.js";
 import { returnTrue } from "./referentiallyStable/returnTrue.js";
 import { useReferentiallyStableCallback } from "./referentiallyStable/useReferentiallyStableCallback.js";
-import { ColorSchemeProvider } from "./theming/ColorSchemeProvider.js";
-import { GlobalClassNamePrefixContext } from "./theming/GlobalClassNamePrefixContext.js";
-import { ColorSchemeContext, DEFAULT_COLOR_SCHEME, useColorScheme } from "./theming/contexts.js";
-import { useClassName } from "./theming/useClassName.js";
-import { useClassNameFactory } from "./theming/useClassNameFactory.js";
-import { useThemedClassName } from "./theming/useThemedClassName.js";
-import { useThemedClassNameFactory } from "./theming/useThemedClassNameFactory.js";
 export {
-  ColorSchemeContext,
-  ColorSchemeProvider,
-  ContainerWidthContext,
-  DEFAULT_COLOR_SCHEME,
   DebugChildren,
-  GlobalClassNamePrefixContext,
   ScopedConsoleContext,
-  createNonNullableContextFactory,
-  createOptionalContextFactory,
+  createContext,
+  createRequiredContext,
   emptyArray,
   emptyObject,
   getChildrenAsLabel,
+  getStateStorage,
   identityFunction,
   isNoopScopedConsole,
+  localStateStorage,
   noop,
   noopLog,
   noopLogged,
   noopScopedConsole,
+  nullStorage,
   returnFalse,
   returnTrue,
+  sessionStateStorage,
   unwrapRefValue,
+  urlStateStorage,
   useAbortController,
-  useAddClassNameDuringResize,
   useArrayMapMemo,
   useAutoHeightTextArea,
   useChildrenAsLabel,
-  useClassName,
-  useClassNameFactory,
-  useCloseOnClickOutside,
-  useCloseOnEscape,
-  useColorScheme,
   useComposeRef,
   useConstantLengthInvariant,
   useConstantValueInvariant,
-  useContainerWidth,
   useDebounce,
   useDebounceCallback,
   useDocumentTitle,
-  useElementSize,
-  useElementTopOffset,
-  useEventHandler,
   useExpectSameValueReference,
   useForceRender,
   useId,
   useIsMounted,
+  useLocalStorageState,
   useObjectMemo,
   useOnElementClickOutsideCallback,
   useOnElementMouseEnterDelayedCallback,
-  useOnElementMutation,
   useOnElementResize,
-  useOnScrollWithin,
   useOnWindowResize,
   usePreviousValue,
   useReferentiallyStableCallback,
   useScopedConsoleRef,
-  useScrollOffsets,
   useSessionStorageState,
-  useThemedClassName,
-  useThemedClassNameFactory,
+  useStoredState,
   useUpdatedRef,
   useWindowSize
 };

package/dist/development/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/production/context/createContext.cjs

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const react = require("react");
+function createContext(name, initialValue) {
+  const OptionalContext = react.createContext(initialValue);
+  OptionalContext.displayName = name;
+  return [OptionalContext, () => react.useContext(OptionalContext)];
+}
+exports.createContext = createContext;
+//# sourceMappingURL=createContext.cjs.map

package/dist/production/context/createContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createContext.cjs","sources":["../../../src/context/createContext.ts"],"sourcesContent":["import type { Context } from 'react'\nimport { createContext as baseCreateContext, useContext } from 'react'\n\nexport function createContext<T>(name: string, initialValue: T): [Context<T>, () => T] {\n  const OptionalContext = baseCreateContext<T>(initialValue)\n  OptionalContext.displayName = name\n\n  return [OptionalContext, () => useContext(OptionalContext)]\n}\n"],"names":["baseCreateContext","useContext"],"mappings":";;;AAGgB,SAAA,cAAiB,MAAc,cAAwC;AAC/E,QAAA,kBAAkBA,oBAAqB,YAAY;AACzD,kBAAgB,cAAc;AAE9B,SAAO,CAAC,iBAAiB,MAAMC,iBAAW,eAAe,CAAC;AAC5D;;"}

package/dist/production/context/createContext.js

@@ -0,0 +1,10 @@
+import { createContext as createContext$1, useContext } from "react";
+function createContext(name, initialValue) {
+  const OptionalContext = createContext$1(initialValue);
+  OptionalContext.displayName = name;
+  return [OptionalContext, () => useContext(OptionalContext)];
+}
+export {
+  createContext
+};
+//# sourceMappingURL=createContext.js.map

package/dist/production/context/createContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createContext.js","sources":["../../../src/context/createContext.ts"],"sourcesContent":["import type { Context } from 'react'\nimport { createContext as baseCreateContext, useContext } from 'react'\n\nexport function createContext<T>(name: string, initialValue: T): [Context<T>, () => T] {\n  const OptionalContext = baseCreateContext<T>(initialValue)\n  OptionalContext.displayName = name\n\n  return [OptionalContext, () => useContext(OptionalContext)]\n}\n"],"names":["baseCreateContext"],"mappings":";AAGgB,SAAA,cAAiB,MAAc,cAAwC;AAC/E,QAAA,kBAAkBA,gBAAqB,YAAY;AACzD,kBAAgB,cAAc;AAE9B,SAAO,CAAC,iBAAiB,MAAM,WAAW,eAAe,CAAC;AAC5D;"}

package/dist/production/context/{createNonNullableContextFactory.cjs → createRequiredContext.cjs}

@@ -1,17 +1,18 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const react = require("react");
-function createNonNullableContextFactory(displayName, initialValue) {
-  const RequiredContext = react.createContext(initialValue ?? null);
+const EmptyContextSymbol = Symbol("EmptyContextSymbol");
+function createRequiredContext(displayName) {
+  const RequiredContext = react.createContext(EmptyContextSymbol);
   RequiredContext.displayName = displayName;
   const useRequiredContext = () => {
     const context = react.useContext(RequiredContext);
-    if (context == null) {
+    if (context === EmptyContextSymbol) {
       throw new Error(`use${displayName} must be used within a ${displayName} provider`);
     }
     return context;
   };
   return [RequiredContext, useRequiredContext];
 }
-exports.createNonNullableContextFactory = createNonNullableContextFactory;
-//# sourceMappingURL=createNonNullableContextFactory.cjs.map
+exports.createRequiredContext = createRequiredContext;
+//# sourceMappingURL=createRequiredContext.cjs.map

package/dist/production/context/createRequiredContext.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"createRequiredContext.cjs","sources":["../../../src/context/createRequiredContext.ts"],"sourcesContent":["import type { Context } from 'react'\nimport { createContext, useContext } from 'react'\n\nconst EmptyContextSymbol = Symbol('EmptyContextSymbol')\n\nexport function createRequiredContext<T>(displayName: string): [Context<T>, () => T] {\n  const RequiredContext = createContext<T>(EmptyContextSymbol as T)\n  RequiredContext.displayName = displayName\n\n  const useRequiredContext = (): T => {\n    const context = useContext(RequiredContext)\n\n    if (context === EmptyContextSymbol) {\n      throw new Error(`use${displayName} must be used within a ${displayName} provider`)\n    }\n\n    return context\n  }\n\n  return [RequiredContext, useRequiredContext]\n}\n"],"names":["createContext","useContext"],"mappings":";;;AAGA,MAAM,qBAAqB,OAAO,oBAAoB;AAE/C,SAAS,sBAAyB,aAA4C;AAC7E,QAAA,kBAAkBA,oBAAiB,kBAAuB;AAChE,kBAAgB,cAAc;AAE9B,QAAM,qBAAqB,MAAS;AAC5B,UAAA,UAAUC,iBAAW,eAAe;AAE1C,QAAI,YAAY,oBAAoB;AAClC,YAAM,IAAI,MAAM,MAAM,WAAW,0BAA0B,WAAW,WAAW;AAAA,IACnF;AAEO,WAAA;AAAA,EAAA;AAGF,SAAA,CAAC,iBAAiB,kBAAkB;AAC7C;;"}

package/dist/production/context/{createNonNullableContextFactory.js → createRequiredContext.js}

@@ -1,10 +1,11 @@
 import { createContext, useContext } from "react";
-function createNonNullableContextFactory(displayName, initialValue) {
-  const RequiredContext = createContext(initialValue ?? null);
+const EmptyContextSymbol = Symbol("EmptyContextSymbol");
+function createRequiredContext(displayName) {
+  const RequiredContext = createContext(EmptyContextSymbol);
   RequiredContext.displayName = displayName;
   const useRequiredContext = () => {
     const context = useContext(RequiredContext);
-    if (context == null) {
+    if (context === EmptyContextSymbol) {
       throw new Error(`use${displayName} must be used within a ${displayName} provider`);
     }
     return context;
@@ -12,6 +13,6 @@ function createNonNullableContextFactory(displayName, initialValue) {
   return [RequiredContext, useRequiredContext];
 }
 export {
-  createNonNullableContextFactory
+  createRequiredContext
 };
-//# sourceMappingURL=createNonNullableContextFactory.js.map
+//# sourceMappingURL=createRequiredContext.js.map

package/dist/production/context/createRequiredContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createRequiredContext.js","sources":["../../../src/context/createRequiredContext.ts"],"sourcesContent":["import type { Context } from 'react'\nimport { createContext, useContext } from 'react'\n\nconst EmptyContextSymbol = Symbol('EmptyContextSymbol')\n\nexport function createRequiredContext<T>(displayName: string): [Context<T>, () => T] {\n  const RequiredContext = createContext<T>(EmptyContextSymbol as T)\n  RequiredContext.displayName = displayName\n\n  const useRequiredContext = (): T => {\n    const context = useContext(RequiredContext)\n\n    if (context === EmptyContextSymbol) {\n      throw new Error(`use${displayName} must be used within a ${displayName} provider`)\n    }\n\n    return context\n  }\n\n  return [RequiredContext, useRequiredContext]\n}\n"],"names":[],"mappings":";AAGA,MAAM,qBAAqB,OAAO,oBAAoB;AAE/C,SAAS,sBAAyB,aAA4C;AAC7E,QAAA,kBAAkB,cAAiB,kBAAuB;AAChE,kBAAgB,cAAc;AAE9B,QAAM,qBAAqB,MAAS;AAC5B,UAAA,UAAU,WAAW,eAAe;AAE1C,QAAI,YAAY,oBAAoB;AAClC,YAAM,IAAI,MAAM,MAAM,WAAW,0BAA0B,WAAW,WAAW;AAAA,IACnF;AAEO,WAAA;AAAA,EAAA;AAGF,SAAA,CAAC,iBAAiB,kBAAkB;AAC7C;"}

package/dist/production/hooks/useAutoHeightTextArea.cjs

@@ -12,7 +12,7 @@ const useAutoHeightTextArea = (textAreaRef, value, minRows, maxRows) => {
       ref.style.minHeight = "";
       ref.style.maxHeight = "";
       if (minRows2 !== maxRows2) {
-        const height = ref.scrollHeight;
+        const height = ref.scrollHeight - ref.clientHeight + ref.offsetHeight;
         let minHeight;
         let maxHeight;
         ref.rows = minRows2;

package/dist/production/hooks/useAutoHeightTextArea.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoHeightTextArea.cjs","sources":["../../../src/hooks/useAutoHeightTextArea.ts"],"sourcesContent":["import { px } from '@contember/utilities'\nimport { useCallback, useLayoutEffect } from 'react'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnElementResize } from './useOnElementResize'\n\nexport const useAutoHeightTextArea = (\n\ttextAreaRef: RefObjectOrElement<HTMLTextAreaElement>,\n\tvalue: string,\n\tminRows: number,\n\tmaxRows: number,\n) => {\n\tconst measure = useCallback(async (ref: HTMLTextAreaElement | null, minRows: number, maxRows: number) => {\n\t\tif (ref) {\n\t\t\tconst rowsAttribute = ref.rows\n\n\t\t\tref.style.height = ''\n\t\t\tref.style.minHeight = ''\n\t\t\tref.style.maxHeight = ''\n\n\t\t\tif (minRows !== maxRows) {\n\t\t\t\tconst height = ref.scrollHeight\n\t\t\t\tlet minHeight: number\n\t\t\t\tlet maxHeight: number\n\n\t\t\t\tref.rows = minRows\n\t\t\t\tminHeight = await ref.getBoundingClientRect().height\n\n\t\t\t\tif (maxRows === Infinity) {\n\t\t\t\t\tmaxHeight = Infinity\n\t\t\t\t} else {\n\t\t\t\t\tref.rows = maxRows\n\t\t\t\t\tmaxHeight = await ref.getBoundingClientRect().height\n\t\t\t\t}\n\n\t\t\t\tref.style.height = px(height)\n\t\t\t\tref.style.minHeight = px(minHeight)\n\t\t\t\tref.style.maxHeight = px(maxHeight)\n\t\t\t}\n\n\t\t\tref.rows = rowsAttribute\n\t\t}\n\t}, [])\n\n\tuseOnElementResize(textAreaRef, () => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t}, [maxRows, measure, minRows, textAreaRef, value])\n}\n"],"names":["useCallback","minRows","maxRows","px","useOnElementResize","unwrapRefValue","useLayoutEffect"],"mappings":";;;;;;AAKO,MAAM,wBAAwB,CACpC,aACA,OACA,SACA,YACI;AACJ,QAAM,UAAUA,MAAA,YAAY,OAAO,KAAiCC,UAAiBC,aAAoB;AACxG,QAAI,KAAK;AACR,YAAM,gBAAgB,IAAI;AAE1B,UAAI,MAAM,SAAS;AACnB,UAAI,MAAM,YAAY;AACtB,UAAI,MAAM,YAAY;AAEtB,UAAID,aAAYC,UAAS;AACxB,cAAM,SAAS,IAAI;AACf,YAAA;AACA,YAAA;AAEJ,YAAI,OAAOD;AACC,oBAAA,MAAM,IAAI,sBAAA,EAAwB;AAE9C,YAAIC,aAAY,UAAU;AACb,sBAAA;AAAA,QAAA,OACN;AACN,cAAI,OAAOA;AACC,sBAAA,MAAM,IAAI,sBAAA,EAAwB;AAAA,QAC/C;AAEI,YAAA,MAAM,SAASC,UAAA,GAAG,MAAM;AACxB,YAAA,MAAM,YAAYA,UAAA,GAAG,SAAS;AAC9B,YAAA,MAAM,YAAYA,UAAA,GAAG,SAAS;AAAA,MACnC;AAEA,UAAI,OAAO;AAAA,IACZ;AAAA,EACD,GAAG,CAAE,CAAA;AAELC,qBAAA,mBAAmB,aAAa,MAAM;AACrC,YAAQC,eAAAA,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,CACrD;AAEDC,QAAAA,gBAAgB,MAAM;AACrB,YAAQD,eAAAA,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,GACnD,CAAC,SAAS,SAAS,SAAS,aAAa,KAAK,CAAC;AACnD;;"}
+{"version":3,"file":"useAutoHeightTextArea.cjs","sources":["../../../src/hooks/useAutoHeightTextArea.ts"],"sourcesContent":["import { px } from '@contember/utilities'\nimport { useCallback, useLayoutEffect } from 'react'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnElementResize } from './useOnElementResize'\n\nexport const useAutoHeightTextArea = (\n\ttextAreaRef: RefObjectOrElement<HTMLTextAreaElement>,\n\tvalue: string,\n\tminRows: number,\n\tmaxRows: number,\n) => {\n\tconst measure = useCallback(async (ref: HTMLTextAreaElement | null, minRows: number, maxRows: number) => {\n\t\tif (ref) {\n\t\t\tconst rowsAttribute = ref.rows\n\n\t\t\tref.style.height = ''\n\t\t\tref.style.minHeight = ''\n\t\t\tref.style.maxHeight = ''\n\n\t\t\tif (minRows !== maxRows) {\n\t\t\t\tconst height = ref.scrollHeight - ref.clientHeight + ref.offsetHeight\n\t\t\t\tlet minHeight: number\n\t\t\t\tlet maxHeight: number\n\n\t\t\t\tref.rows = minRows\n\t\t\t\tminHeight = await ref.getBoundingClientRect().height\n\n\t\t\t\tif (maxRows === Infinity) {\n\t\t\t\t\tmaxHeight = Infinity\n\t\t\t\t} else {\n\t\t\t\t\tref.rows = maxRows\n\t\t\t\t\tmaxHeight = await ref.getBoundingClientRect().height\n\t\t\t\t}\n\n\t\t\t\tref.style.height = px(height)\n\t\t\t\tref.style.minHeight = px(minHeight)\n\t\t\t\tref.style.maxHeight = px(maxHeight)\n\t\t\t}\n\n\t\t\tref.rows = rowsAttribute\n\t\t}\n\t}, [])\n\n\tuseOnElementResize(textAreaRef, () => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t}, [maxRows, measure, minRows, textAreaRef, value])\n}\n"],"names":["useCallback","minRows","maxRows","px","useOnElementResize","unwrapRefValue","useLayoutEffect"],"mappings":";;;;;;AAKO,MAAM,wBAAwB,CACpC,aACA,OACA,SACA,YACI;AACJ,QAAM,UAAUA,MAAA,YAAY,OAAO,KAAiCC,UAAiBC,aAAoB;AACxG,QAAI,KAAK;AACR,YAAM,gBAAgB,IAAI;AAE1B,UAAI,MAAM,SAAS;AACnB,UAAI,MAAM,YAAY;AACtB,UAAI,MAAM,YAAY;AAEtB,UAAID,aAAYC,UAAS;AACxB,cAAM,SAAS,IAAI,eAAe,IAAI,eAAe,IAAI;AACrD,YAAA;AACA,YAAA;AAEJ,YAAI,OAAOD;AACC,oBAAA,MAAM,IAAI,sBAAA,EAAwB;AAE9C,YAAIC,aAAY,UAAU;AACb,sBAAA;AAAA,QAAA,OACN;AACN,cAAI,OAAOA;AACC,sBAAA,MAAM,IAAI,sBAAA,EAAwB;AAAA,QAC/C;AAEI,YAAA,MAAM,SAASC,UAAA,GAAG,MAAM;AACxB,YAAA,MAAM,YAAYA,UAAA,GAAG,SAAS;AAC9B,YAAA,MAAM,YAAYA,UAAA,GAAG,SAAS;AAAA,MACnC;AAEA,UAAI,OAAO;AAAA,IACZ;AAAA,EACD,GAAG,CAAE,CAAA;AAELC,qBAAA,mBAAmB,aAAa,MAAM;AACrC,YAAQC,eAAAA,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,CACrD;AAEDC,QAAAA,gBAAgB,MAAM;AACrB,YAAQD,eAAAA,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,GACnD,CAAC,SAAS,SAAS,SAAS,aAAa,KAAK,CAAC;AACnD;;"}

package/dist/production/hooks/useAutoHeightTextArea.js

@@ -10,7 +10,7 @@ const useAutoHeightTextArea = (textAreaRef, value, minRows, maxRows) => {
       ref.style.minHeight = "";
       ref.style.maxHeight = "";
       if (minRows2 !== maxRows2) {
-        const height = ref.scrollHeight;
+        const height = ref.scrollHeight - ref.clientHeight + ref.offsetHeight;
         let minHeight;
         let maxHeight;
         ref.rows = minRows2;

package/dist/production/hooks/useAutoHeightTextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAutoHeightTextArea.js","sources":["../../../src/hooks/useAutoHeightTextArea.ts"],"sourcesContent":["import { px } from '@contember/utilities'\nimport { useCallback, useLayoutEffect } from 'react'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnElementResize } from './useOnElementResize'\n\nexport const useAutoHeightTextArea = (\n\ttextAreaRef: RefObjectOrElement<HTMLTextAreaElement>,\n\tvalue: string,\n\tminRows: number,\n\tmaxRows: number,\n) => {\n\tconst measure = useCallback(async (ref: HTMLTextAreaElement | null, minRows: number, maxRows: number) => {\n\t\tif (ref) {\n\t\t\tconst rowsAttribute = ref.rows\n\n\t\t\tref.style.height = ''\n\t\t\tref.style.minHeight = ''\n\t\t\tref.style.maxHeight = ''\n\n\t\t\tif (minRows !== maxRows) {\n\t\t\t\tconst height = ref.scrollHeight\n\t\t\t\tlet minHeight: number\n\t\t\t\tlet maxHeight: number\n\n\t\t\t\tref.rows = minRows\n\t\t\t\tminHeight = await ref.getBoundingClientRect().height\n\n\t\t\t\tif (maxRows === Infinity) {\n\t\t\t\t\tmaxHeight = Infinity\n\t\t\t\t} else {\n\t\t\t\t\tref.rows = maxRows\n\t\t\t\t\tmaxHeight = await ref.getBoundingClientRect().height\n\t\t\t\t}\n\n\t\t\t\tref.style.height = px(height)\n\t\t\t\tref.style.minHeight = px(minHeight)\n\t\t\t\tref.style.maxHeight = px(maxHeight)\n\t\t\t}\n\n\t\t\tref.rows = rowsAttribute\n\t\t}\n\t}, [])\n\n\tuseOnElementResize(textAreaRef, () => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t}, [maxRows, measure, minRows, textAreaRef, value])\n}\n"],"names":["minRows","maxRows"],"mappings":";;;;AAKO,MAAM,wBAAwB,CACpC,aACA,OACA,SACA,YACI;AACJ,QAAM,UAAU,YAAY,OAAO,KAAiCA,UAAiBC,aAAoB;AACxG,QAAI,KAAK;AACR,YAAM,gBAAgB,IAAI;AAE1B,UAAI,MAAM,SAAS;AACnB,UAAI,MAAM,YAAY;AACtB,UAAI,MAAM,YAAY;AAEtB,UAAID,aAAYC,UAAS;AACxB,cAAM,SAAS,IAAI;AACf,YAAA;AACA,YAAA;AAEJ,YAAI,OAAOD;AACC,oBAAA,MAAM,IAAI,sBAAA,EAAwB;AAE9C,YAAIC,aAAY,UAAU;AACb,sBAAA;AAAA,QAAA,OACN;AACN,cAAI,OAAOA;AACC,sBAAA,MAAM,IAAI,sBAAA,EAAwB;AAAA,QAC/C;AAEI,YAAA,MAAM,SAAS,GAAG,MAAM;AACxB,YAAA,MAAM,YAAY,GAAG,SAAS;AAC9B,YAAA,MAAM,YAAY,GAAG,SAAS;AAAA,MACnC;AAEA,UAAI,OAAO;AAAA,IACZ;AAAA,EACD,GAAG,CAAE,CAAA;AAEL,qBAAmB,aAAa,MAAM;AACrC,YAAQ,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,CACrD;AAED,kBAAgB,MAAM;AACrB,YAAQ,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,GACnD,CAAC,SAAS,SAAS,SAAS,aAAa,KAAK,CAAC;AACnD;"}
+{"version":3,"file":"useAutoHeightTextArea.js","sources":["../../../src/hooks/useAutoHeightTextArea.ts"],"sourcesContent":["import { px } from '@contember/utilities'\nimport { useCallback, useLayoutEffect } from 'react'\nimport { RefObjectOrElement, unwrapRefValue } from './unwrapRefValue'\nimport { useOnElementResize } from './useOnElementResize'\n\nexport const useAutoHeightTextArea = (\n\ttextAreaRef: RefObjectOrElement<HTMLTextAreaElement>,\n\tvalue: string,\n\tminRows: number,\n\tmaxRows: number,\n) => {\n\tconst measure = useCallback(async (ref: HTMLTextAreaElement | null, minRows: number, maxRows: number) => {\n\t\tif (ref) {\n\t\t\tconst rowsAttribute = ref.rows\n\n\t\t\tref.style.height = ''\n\t\t\tref.style.minHeight = ''\n\t\t\tref.style.maxHeight = ''\n\n\t\t\tif (minRows !== maxRows) {\n\t\t\t\tconst height = ref.scrollHeight - ref.clientHeight + ref.offsetHeight\n\t\t\t\tlet minHeight: number\n\t\t\t\tlet maxHeight: number\n\n\t\t\t\tref.rows = minRows\n\t\t\t\tminHeight = await ref.getBoundingClientRect().height\n\n\t\t\t\tif (maxRows === Infinity) {\n\t\t\t\t\tmaxHeight = Infinity\n\t\t\t\t} else {\n\t\t\t\t\tref.rows = maxRows\n\t\t\t\t\tmaxHeight = await ref.getBoundingClientRect().height\n\t\t\t\t}\n\n\t\t\t\tref.style.height = px(height)\n\t\t\t\tref.style.minHeight = px(minHeight)\n\t\t\t\tref.style.maxHeight = px(maxHeight)\n\t\t\t}\n\n\t\t\tref.rows = rowsAttribute\n\t\t}\n\t}, [])\n\n\tuseOnElementResize(textAreaRef, () => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t})\n\n\tuseLayoutEffect(() => {\n\t\tmeasure(unwrapRefValue(textAreaRef), minRows, maxRows)\n\t}, [maxRows, measure, minRows, textAreaRef, value])\n}\n"],"names":["minRows","maxRows"],"mappings":";;;;AAKO,MAAM,wBAAwB,CACpC,aACA,OACA,SACA,YACI;AACJ,QAAM,UAAU,YAAY,OAAO,KAAiCA,UAAiBC,aAAoB;AACxG,QAAI,KAAK;AACR,YAAM,gBAAgB,IAAI;AAE1B,UAAI,MAAM,SAAS;AACnB,UAAI,MAAM,YAAY;AACtB,UAAI,MAAM,YAAY;AAEtB,UAAID,aAAYC,UAAS;AACxB,cAAM,SAAS,IAAI,eAAe,IAAI,eAAe,IAAI;AACrD,YAAA;AACA,YAAA;AAEJ,YAAI,OAAOD;AACC,oBAAA,MAAM,IAAI,sBAAA,EAAwB;AAE9C,YAAIC,aAAY,UAAU;AACb,sBAAA;AAAA,QAAA,OACN;AACN,cAAI,OAAOA;AACC,sBAAA,MAAM,IAAI,sBAAA,EAAwB;AAAA,QAC/C;AAEI,YAAA,MAAM,SAAS,GAAG,MAAM;AACxB,YAAA,MAAM,YAAY,GAAG,SAAS;AAC9B,YAAA,MAAM,YAAY,GAAG,SAAS;AAAA,MACnC;AAEA,UAAI,OAAO;AAAA,IACZ;AAAA,EACD,GAAG,CAAE,CAAA;AAEL,qBAAmB,aAAa,MAAM;AACrC,YAAQ,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,CACrD;AAED,kBAAgB,MAAM;AACrB,YAAQ,eAAe,WAAW,GAAG,SAAS,OAAO;AAAA,EAAA,GACnD,CAAC,SAAS,SAAS,SAAS,aAAa,KAAK,CAAC;AACnD;"}

package/dist/production/hooks/useStoredState.cjs

@@ -1,23 +1,100 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const react = require("react");
-const createStoredStateHook = (getStorage) => {
-  return (key, initializeValue) => {
-    const storage = getStorage();
-    const [value, setValue] = react.useState(() => {
-      const value2 = storage.getItem(key);
-      const parsedValue = value2 !== null ? JSON.parse(value2) : void 0;
-      return initializeValue(parsedValue);
-    });
-    return [value, react.useCallback((value2) => {
+const urlStateStorage = {
+  getItem(key) {
+    const searchParams = new URLSearchParams(window.location.search);
+    const value = searchParams.get(key[1]);
+    return value !== null && value !== void 0 ? JSON.parse(value) : null;
+  },
+  setItem(key, value) {
+    const searchParams = new URLSearchParams(window.location.search);
+    searchParams.set(key[1], JSON.stringify(value));
+    const newUrl = `${window.location.pathname}?${searchParams.toString()}`;
+    window.history.replaceState({}, "", newUrl);
+  }
+};
+const createStateStorageFromNativeStorage = (getStorage) => {
+  return {
+    getItem(key) {
+      const value = getStorage().getItem(key.join("-"));
+      return value !== null ? JSON.parse(value) : null;
+    },
+    setItem(key, value) {
+      getStorage().setItem(key.join("-"), JSON.stringify(value));
+    }
+  };
+};
+const sessionStateStorage = createStateStorageFromNativeStorage(() => sessionStorage);
+const localStateStorage = createStateStorageFromNativeStorage(() => localStorage);
+const nullStorage = {
+  getItem() {
+    return null;
+  },
+  setItem() {
+  }
+};
+const builtInStorages = {
+  url: urlStateStorage,
+  session: sessionStateStorage,
+  local: localStateStorage,
+  null: nullStorage
+};
+const useStoredState = (storageOrName, key, initializeValue) => {
+  const storage = react.useMemo(() => {
+    return getStateStorage(storageOrName);
+  }, [storageOrName]);
+  const [value, setValue] = react.useState(() => {
+    const value2 = storage.getItem(key);
+    return initializeValue(value2);
+  });
+  return [
+    value,
+    react.useCallback((value2) => {
       setValue((current) => {
         const newValue = typeof value2 === "function" ? value2(current) : value2;
-        storage.setItem(key, JSON.stringify(newValue));
+        storage.setItem(key, newValue);
         return newValue;
       });
-    }, [key, storage])];
+    }, [key, storage])
+  ];
+};
+const useSessionStorageState = (key, initializeValue) => {
+  return useStoredState(sessionStateStorage, key, initializeValue);
+};
+const useLocalStorageState = (key, initializeValue) => {
+  return useStoredState(localStateStorage, key, initializeValue);
+};
+const getStateStorage = (storageOrName) => {
+  if (Array.isArray(storageOrName)) {
+    return createFallbackStorage(storageOrName.map((it) => typeof it === "string" ? builtInStorages[it] : it));
+  }
+  return typeof storageOrName === "string" ? builtInStorages[storageOrName] : storageOrName;
+};
+const createFallbackStorage = (storageTypes) => {
+  return {
+    getItem(key) {
+      for (const storage of storageTypes) {
+        const value = storage.getItem(key);
+        if (value !== null) {
+          return value;
+        }
+      }
+      return null;
+    },
+    setItem(key, value) {
+      for (const storage of storageTypes) {
+        storage.setItem(key, value);
+      }
+    }
   };
 };
-const useSessionStorageState = createStoredStateHook(() => sessionStorage);
+exports.getStateStorage = getStateStorage;
+exports.localStateStorage = localStateStorage;
+exports.nullStorage = nullStorage;
+exports.sessionStateStorage = sessionStateStorage;
+exports.urlStateStorage = urlStateStorage;
+exports.useLocalStorageState = useLocalStorageState;
 exports.useSessionStorageState = useSessionStorageState;
+exports.useStoredState = useStoredState;
 //# sourceMappingURL=useStoredState.cjs.map

package/dist/production/hooks/useStoredState.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"useStoredState.cjs","sources":["../../../src/hooks/useStoredState.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { Serializable } from '../types'\n\nexport type SetState<V extends Serializable> = (value: V | ((current: V) => V)) => void;\nexport type ValueInitializer<V extends Serializable> = (storedValue: V | undefined) => V;\n\nconst createStoredStateHook = (getStorage: () => Storage) => {\n\treturn <V extends Serializable>(key: string, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\t\tconst storage = getStorage()\n\t\tconst [value, setValue] = useState<V>(() => {\n\t\t\tconst value = storage.getItem(key)\n\t\t\tconst parsedValue: V | undefined = value !== null ? JSON.parse(value) : undefined\n\t\t\treturn initializeValue(parsedValue)\n\t\t})\n\t\treturn [value, useCallback(value => {\n\t\t\tsetValue(current => {\n\t\t\t\tconst newValue = typeof value === 'function' ? (value as (current: V) => V)(current) : value\n\t\t\t\tstorage.setItem(key, JSON.stringify(newValue))\n\t\t\t\treturn newValue\n\t\t\t})\n\t\t}, [key, storage])]\n\t}\n\n}\n\nexport const useSessionStorageState = createStoredStateHook(() => sessionStorage)\n"],"names":["useState","value","useCallback"],"mappings":";;;AAMA,MAAM,wBAAwB,CAAC,eAA8B;AACrD,SAAA,CAAyB,KAAa,oBAA2D;AACvG,UAAM,UAAU;AAChB,UAAM,CAAC,OAAO,QAAQ,IAAIA,eAAY,MAAM;AACrCC,YAAAA,SAAQ,QAAQ,QAAQ,GAAG;AACjC,YAAM,cAA6BA,WAAU,OAAO,KAAK,MAAMA,MAAK,IAAI;AACxE,aAAO,gBAAgB,WAAW;AAAA,IAAA,CAClC;AACD,WAAO,CAAC,OAAOC,kBAAY,CAAAD,WAAS;AACnC,eAAS,CAAW,YAAA;AACnB,cAAM,WAAW,OAAOA,WAAU,aAAcA,OAA4B,OAAO,IAAIA;AACvF,gBAAQ,QAAQ,KAAK,KAAK,UAAU,QAAQ,CAAC;AACtC,eAAA;AAAA,MAAA,CACP;AAAA,IACC,GAAA,CAAC,KAAK,OAAO,CAAC,CAAC;AAAA,EAAA;AAGpB;AAEa,MAAA,yBAAyB,sBAAsB,MAAM,cAAc;;"}
+{"version":3,"file":"useStoredState.cjs","sources":["../../../src/hooks/useStoredState.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport { Serializable } from '../types'\n\nexport type SetState<V extends Serializable> = (value: V | ((current: V) => V)) => void;\nexport type StateStorageKey = [uniquePrefix: string, key: string]\n\nexport type ValueInitializer<V extends Serializable> = (storedValue: V | undefined) => V;\n\nexport interface StateStorage {\n\tgetItem(key: StateStorageKey): Serializable\n\n\tsetItem(key: StateStorageKey, value: Serializable): void\n}\n\n\nexport const urlStateStorage: StateStorage = {\n\tgetItem(key) {\n\t\tconst searchParams = new URLSearchParams(window.location.search)\n\t\tconst value = searchParams.get(key[1])\n\t\treturn value !== null && value !== undefined ? JSON.parse(value) : null\n\t},\n\tsetItem(key, value) {\n\t\tconst searchParams = new URLSearchParams(window.location.search)\n\t\tsearchParams.set(key[1], JSON.stringify(value))\n\t\tconst newUrl = `${window.location.pathname}?${searchParams.toString()}`\n\t\twindow.history.replaceState({}, '', newUrl)\n\t},\n}\n\nconst createStateStorageFromNativeStorage = (getStorage: () => Storage): StateStorage => {\n\treturn {\n\t\tgetItem(key) {\n\t\t\tconst value = getStorage().getItem(key.join('-'))\n\t\t\treturn value !== null ? JSON.parse(value) : null\n\t\t},\n\t\tsetItem(key, value) {\n\t\t\tgetStorage().setItem(key.join('-'), JSON.stringify(value))\n\t\t},\n\t}\n}\n\nexport const sessionStateStorage = createStateStorageFromNativeStorage(() => sessionStorage)\nexport const localStateStorage = createStateStorageFromNativeStorage(() => localStorage)\nexport const nullStorage: StateStorage = {\n\tgetItem() {\n\t\treturn null\n\t},\n\tsetItem() {\n\t},\n}\n\nconst builtInStorages = {\n\turl: urlStateStorage,\n\tsession: sessionStateStorage,\n\tlocal: localStateStorage,\n\tnull: nullStorage,\n}\n\nexport type StateStorageOrName = StateStorage | 'url' | 'session' | 'local' | 'null'\n\nexport const useStoredState = <V extends Serializable>(storageOrName: StateStorageOrName | StateStorageOrName[], key: StateStorageKey, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\tconst storage = useMemo(() => {\n\t\treturn getStateStorage(storageOrName)\n\t}, [storageOrName])\n\n\tconst [value, setValue] = useState<V>(() => {\n\t\tconst value = storage.getItem(key)\n\t\treturn initializeValue(value as V)\n\t})\n\treturn [\n\t\tvalue,\n\t\tuseCallback(value => {\n\t\t\tsetValue(current => {\n\t\t\t\tconst newValue = typeof value === 'function' ? (value as (current: V) => V)(current) : value\n\t\t\t\tstorage.setItem(key, newValue)\n\t\t\t\treturn newValue\n\t\t\t})\n\t\t}, [key, storage]),\n\t]\n}\n\nexport const useSessionStorageState = <V extends Serializable>(key: StateStorageKey, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\treturn useStoredState<V>(sessionStateStorage, key, initializeValue)\n}\n\nexport const useLocalStorageState = <V extends Serializable>(key: StateStorageKey, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\treturn useStoredState<V>(localStateStorage, key, initializeValue)\n}\n\nexport const getStateStorage = (storageOrName: StateStorageOrName | StateStorageOrName[]) => {\n\tif (Array.isArray(storageOrName)) {\n\t\treturn createFallbackStorage(storageOrName.map(it => typeof it === 'string' ? builtInStorages[it] : it))\n\t}\n\treturn typeof storageOrName === 'string' ? builtInStorages[storageOrName] : storageOrName\n}\n\n\nconst createFallbackStorage = (storageTypes: StateStorage[]): StateStorage => {\n\treturn {\n\t\tgetItem(key) {\n\t\t\tfor (const storage of storageTypes) {\n\t\t\t\tconst value = storage.getItem(key)\n\t\t\t\tif (value !== null) {\n\t\t\t\t\treturn value\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\t\tsetItem(key, value) {\n\t\t\tfor (const storage of storageTypes) {\n\t\t\t\tstorage.setItem(key, value)\n\t\t\t}\n\t\t},\n\t}\n}\n"],"names":["useMemo","useState","value","useCallback"],"mappings":"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"}

package/dist/production/hooks/useStoredState.js

@@ -1,23 +1,100 @@
-import { useState, useCallback } from "react";
-const createStoredStateHook = (getStorage) => {
-  return (key, initializeValue) => {
-    const storage = getStorage();
-    const [value, setValue] = useState(() => {
-      const value2 = storage.getItem(key);
-      const parsedValue = value2 !== null ? JSON.parse(value2) : void 0;
-      return initializeValue(parsedValue);
-    });
-    return [value, useCallback((value2) => {
+import { useMemo, useState, useCallback } from "react";
+const urlStateStorage = {
+  getItem(key) {
+    const searchParams = new URLSearchParams(window.location.search);
+    const value = searchParams.get(key[1]);
+    return value !== null && value !== void 0 ? JSON.parse(value) : null;
+  },
+  setItem(key, value) {
+    const searchParams = new URLSearchParams(window.location.search);
+    searchParams.set(key[1], JSON.stringify(value));
+    const newUrl = `${window.location.pathname}?${searchParams.toString()}`;
+    window.history.replaceState({}, "", newUrl);
+  }
+};
+const createStateStorageFromNativeStorage = (getStorage) => {
+  return {
+    getItem(key) {
+      const value = getStorage().getItem(key.join("-"));
+      return value !== null ? JSON.parse(value) : null;
+    },
+    setItem(key, value) {
+      getStorage().setItem(key.join("-"), JSON.stringify(value));
+    }
+  };
+};
+const sessionStateStorage = createStateStorageFromNativeStorage(() => sessionStorage);
+const localStateStorage = createStateStorageFromNativeStorage(() => localStorage);
+const nullStorage = {
+  getItem() {
+    return null;
+  },
+  setItem() {
+  }
+};
+const builtInStorages = {
+  url: urlStateStorage,
+  session: sessionStateStorage,
+  local: localStateStorage,
+  null: nullStorage
+};
+const useStoredState = (storageOrName, key, initializeValue) => {
+  const storage = useMemo(() => {
+    return getStateStorage(storageOrName);
+  }, [storageOrName]);
+  const [value, setValue] = useState(() => {
+    const value2 = storage.getItem(key);
+    return initializeValue(value2);
+  });
+  return [
+    value,
+    useCallback((value2) => {
       setValue((current) => {
         const newValue = typeof value2 === "function" ? value2(current) : value2;
-        storage.setItem(key, JSON.stringify(newValue));
+        storage.setItem(key, newValue);
         return newValue;
       });
-    }, [key, storage])];
+    }, [key, storage])
+  ];
+};
+const useSessionStorageState = (key, initializeValue) => {
+  return useStoredState(sessionStateStorage, key, initializeValue);
+};
+const useLocalStorageState = (key, initializeValue) => {
+  return useStoredState(localStateStorage, key, initializeValue);
+};
+const getStateStorage = (storageOrName) => {
+  if (Array.isArray(storageOrName)) {
+    return createFallbackStorage(storageOrName.map((it) => typeof it === "string" ? builtInStorages[it] : it));
+  }
+  return typeof storageOrName === "string" ? builtInStorages[storageOrName] : storageOrName;
+};
+const createFallbackStorage = (storageTypes) => {
+  return {
+    getItem(key) {
+      for (const storage of storageTypes) {
+        const value = storage.getItem(key);
+        if (value !== null) {
+          return value;
+        }
+      }
+      return null;
+    },
+    setItem(key, value) {
+      for (const storage of storageTypes) {
+        storage.setItem(key, value);
+      }
+    }
   };
 };
-const useSessionStorageState = createStoredStateHook(() => sessionStorage);
 export {
-  useSessionStorageState
+  getStateStorage,
+  localStateStorage,
+  nullStorage,
+  sessionStateStorage,
+  urlStateStorage,
+  useLocalStorageState,
+  useSessionStorageState,
+  useStoredState
 };
 //# sourceMappingURL=useStoredState.js.map

package/dist/production/hooks/useStoredState.js.map

@@ -1 +1 @@
-{"version":3,"file":"useStoredState.js","sources":["../../../src/hooks/useStoredState.ts"],"sourcesContent":["import { useCallback, useState } from 'react'\nimport { Serializable } from '../types'\n\nexport type SetState<V extends Serializable> = (value: V | ((current: V) => V)) => void;\nexport type ValueInitializer<V extends Serializable> = (storedValue: V | undefined) => V;\n\nconst createStoredStateHook = (getStorage: () => Storage) => {\n\treturn <V extends Serializable>(key: string, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\t\tconst storage = getStorage()\n\t\tconst [value, setValue] = useState<V>(() => {\n\t\t\tconst value = storage.getItem(key)\n\t\t\tconst parsedValue: V | undefined = value !== null ? JSON.parse(value) : undefined\n\t\t\treturn initializeValue(parsedValue)\n\t\t})\n\t\treturn [value, useCallback(value => {\n\t\t\tsetValue(current => {\n\t\t\t\tconst newValue = typeof value === 'function' ? (value as (current: V) => V)(current) : value\n\t\t\t\tstorage.setItem(key, JSON.stringify(newValue))\n\t\t\t\treturn newValue\n\t\t\t})\n\t\t}, [key, storage])]\n\t}\n\n}\n\nexport const useSessionStorageState = createStoredStateHook(() => sessionStorage)\n"],"names":["value"],"mappings":";AAMA,MAAM,wBAAwB,CAAC,eAA8B;AACrD,SAAA,CAAyB,KAAa,oBAA2D;AACvG,UAAM,UAAU;AAChB,UAAM,CAAC,OAAO,QAAQ,IAAI,SAAY,MAAM;AACrCA,YAAAA,SAAQ,QAAQ,QAAQ,GAAG;AACjC,YAAM,cAA6BA,WAAU,OAAO,KAAK,MAAMA,MAAK,IAAI;AACxE,aAAO,gBAAgB,WAAW;AAAA,IAAA,CAClC;AACD,WAAO,CAAC,OAAO,YAAY,CAAAA,WAAS;AACnC,eAAS,CAAW,YAAA;AACnB,cAAM,WAAW,OAAOA,WAAU,aAAcA,OAA4B,OAAO,IAAIA;AACvF,gBAAQ,QAAQ,KAAK,KAAK,UAAU,QAAQ,CAAC;AACtC,eAAA;AAAA,MAAA,CACP;AAAA,IACC,GAAA,CAAC,KAAK,OAAO,CAAC,CAAC;AAAA,EAAA;AAGpB;AAEa,MAAA,yBAAyB,sBAAsB,MAAM,cAAc;"}
+{"version":3,"file":"useStoredState.js","sources":["../../../src/hooks/useStoredState.ts"],"sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport { Serializable } from '../types'\n\nexport type SetState<V extends Serializable> = (value: V | ((current: V) => V)) => void;\nexport type StateStorageKey = [uniquePrefix: string, key: string]\n\nexport type ValueInitializer<V extends Serializable> = (storedValue: V | undefined) => V;\n\nexport interface StateStorage {\n\tgetItem(key: StateStorageKey): Serializable\n\n\tsetItem(key: StateStorageKey, value: Serializable): void\n}\n\n\nexport const urlStateStorage: StateStorage = {\n\tgetItem(key) {\n\t\tconst searchParams = new URLSearchParams(window.location.search)\n\t\tconst value = searchParams.get(key[1])\n\t\treturn value !== null && value !== undefined ? JSON.parse(value) : null\n\t},\n\tsetItem(key, value) {\n\t\tconst searchParams = new URLSearchParams(window.location.search)\n\t\tsearchParams.set(key[1], JSON.stringify(value))\n\t\tconst newUrl = `${window.location.pathname}?${searchParams.toString()}`\n\t\twindow.history.replaceState({}, '', newUrl)\n\t},\n}\n\nconst createStateStorageFromNativeStorage = (getStorage: () => Storage): StateStorage => {\n\treturn {\n\t\tgetItem(key) {\n\t\t\tconst value = getStorage().getItem(key.join('-'))\n\t\t\treturn value !== null ? JSON.parse(value) : null\n\t\t},\n\t\tsetItem(key, value) {\n\t\t\tgetStorage().setItem(key.join('-'), JSON.stringify(value))\n\t\t},\n\t}\n}\n\nexport const sessionStateStorage = createStateStorageFromNativeStorage(() => sessionStorage)\nexport const localStateStorage = createStateStorageFromNativeStorage(() => localStorage)\nexport const nullStorage: StateStorage = {\n\tgetItem() {\n\t\treturn null\n\t},\n\tsetItem() {\n\t},\n}\n\nconst builtInStorages = {\n\turl: urlStateStorage,\n\tsession: sessionStateStorage,\n\tlocal: localStateStorage,\n\tnull: nullStorage,\n}\n\nexport type StateStorageOrName = StateStorage | 'url' | 'session' | 'local' | 'null'\n\nexport const useStoredState = <V extends Serializable>(storageOrName: StateStorageOrName | StateStorageOrName[], key: StateStorageKey, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\tconst storage = useMemo(() => {\n\t\treturn getStateStorage(storageOrName)\n\t}, [storageOrName])\n\n\tconst [value, setValue] = useState<V>(() => {\n\t\tconst value = storage.getItem(key)\n\t\treturn initializeValue(value as V)\n\t})\n\treturn [\n\t\tvalue,\n\t\tuseCallback(value => {\n\t\t\tsetValue(current => {\n\t\t\t\tconst newValue = typeof value === 'function' ? (value as (current: V) => V)(current) : value\n\t\t\t\tstorage.setItem(key, newValue)\n\t\t\t\treturn newValue\n\t\t\t})\n\t\t}, [key, storage]),\n\t]\n}\n\nexport const useSessionStorageState = <V extends Serializable>(key: StateStorageKey, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\treturn useStoredState<V>(sessionStateStorage, key, initializeValue)\n}\n\nexport const useLocalStorageState = <V extends Serializable>(key: StateStorageKey, initializeValue: ValueInitializer<V>): [V, SetState<V>] => {\n\treturn useStoredState<V>(localStateStorage, key, initializeValue)\n}\n\nexport const getStateStorage = (storageOrName: StateStorageOrName | StateStorageOrName[]) => {\n\tif (Array.isArray(storageOrName)) {\n\t\treturn createFallbackStorage(storageOrName.map(it => typeof it === 'string' ? builtInStorages[it] : it))\n\t}\n\treturn typeof storageOrName === 'string' ? builtInStorages[storageOrName] : storageOrName\n}\n\n\nconst createFallbackStorage = (storageTypes: StateStorage[]): StateStorage => {\n\treturn {\n\t\tgetItem(key) {\n\t\t\tfor (const storage of storageTypes) {\n\t\t\t\tconst value = storage.getItem(key)\n\t\t\t\tif (value !== null) {\n\t\t\t\t\treturn value\n\t\t\t\t}\n\t\t\t}\n\t\t\treturn null\n\t\t},\n\t\tsetItem(key, value) {\n\t\t\tfor (const storage of storageTypes) {\n\t\t\t\tstorage.setItem(key, value)\n\t\t\t}\n\t\t},\n\t}\n}\n"],"names":["value"],"mappings":"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"}