@storybook/react-native-ui-common 10.2.2-alpha.0 → 10.2.2-alpha.1

package/dist/index.d.ts

@@ -193,5 +193,6 @@ declare const useLastViewed: (selection: Selection) => {
 };
 
 declare const useStoreBooleanState: (key: string, defaultValue: boolean) => ReturnType<typeof useState<boolean>>;
+declare const useStoreNumberState: (key: string, defaultValue: number) => [number, (value: number | ((prev: number) => number)) => void];
 
-export { Button, ButtonIcon, type ButtonProps, ButtonText, type CombinedDataset, type Dataset, type ExpandAction, type ExpandType, type ExpandedProps, type ExpandedState, type GetSearchItemProps, type Highlight, type HighlightRange, type HighlightRanges, IconButton, type Item, type ItemRef, LayoutProvider, type RefType, type Refs, type SBUI, type SearchChildrenFn, type SearchItem, type SearchResult, type SearchResultProps, type Selection, type Storage, StorageProvider, type StoryRef, createId, cycle, get, getAncestorIds, getDescendantIds, getParent, getParents, getPath, getStateType, intersect, isAncestor, isExpandType, isStoryHoistable, merge, noArrayMerge, prevent, removeNoiseFromName, searchItem, transformStoryIndexToStoriesHash, transformStoryIndexV2toV3, transformStoryIndexV3toV4, transformStoryIndexV4toV5, useExpanded, useLastViewed, useLayout, useStorage, useStoreBooleanState, useStyle };
+export { Button, ButtonIcon, type ButtonProps, ButtonText, type CombinedDataset, type Dataset, type ExpandAction, type ExpandType, type ExpandedProps, type ExpandedState, type GetSearchItemProps, type Highlight, type HighlightRange, type HighlightRanges, IconButton, type Item, type ItemRef, LayoutProvider, type RefType, type Refs, type SBUI, type SearchChildrenFn, type SearchItem, type SearchResult, type SearchResultProps, type Selection, type Storage, StorageProvider, type StoryRef, createId, cycle, get, getAncestorIds, getDescendantIds, getParent, getParents, getPath, getStateType, intersect, isAncestor, isExpandType, isStoryHoistable, merge, noArrayMerge, prevent, removeNoiseFromName, searchItem, transformStoryIndexToStoriesHash, transformStoryIndexV2toV3, transformStoryIndexV3toV4, transformStoryIndexV4toV5, useExpanded, useLastViewed, useLayout, useStorage, useStoreBooleanState, useStoreNumberState, useStyle };

package/dist/index.js

@@ -62,6 +62,7 @@ __export(index_exports, {
   useLayout: () => useLayout,
   useStorage: () => useStorage,
   useStoreBooleanState: () => useStoreBooleanState,
+  useStoreNumberState: () => useStoreNumberState,
   useStyle: () => useStyle
 });
 module.exports = __toCommonJS(index_exports);
@@ -664,6 +665,31 @@ var useStoreBooleanState = (key, defaultValue) => {
   }, [key, storage, val]);
   return [val, setVal];
 };
+var useStoreNumberState = (key, defaultValue) => {
+  const storage = useStorage();
+  const [val, setVal] = (0, import_react8.useState)(defaultValue);
+  (0, import_react8.useEffect)(() => {
+    storage.getItem(key).then((newVal) => {
+      if (newVal === null || newVal === void 0) {
+        setVal(defaultValue);
+      } else {
+        const parsed = parseFloat(newVal);
+        setVal(isNaN(parsed) ? defaultValue : parsed);
+      }
+    });
+  }, [key, storage, defaultValue]);
+  const setAndStore = (0, import_react8.useCallback)(
+    (value) => {
+      setVal((prev) => {
+        const next = typeof value === "function" ? value(prev) : value;
+        storage.setItem(key, next.toString());
+        return next;
+      });
+    },
+    [key, storage]
+  );
+  return [val, setAndStore];
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   Button,
@@ -699,5 +725,6 @@ var useStoreBooleanState = (key, defaultValue) => {
   useLayout,
   useStorage,
   useStoreBooleanState,
+  useStoreNumberState,
   useStyle
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-native-ui-common",
-  "version": "10.2.2-alpha.0",
+  "version": "10.2.2-alpha.1",
   "description": "common ui components for react native storybook",
   "keywords": [
     "react",
@@ -39,7 +39,7 @@
   "dependencies": {
     "@nozbe/microfuzz": "^1.0.0",
     "@storybook/react": "^10.2.2",
-    "@storybook/react-native-theming": "^10.2.2-alpha.0",
+    "@storybook/react-native-theming": "^10.2.2-alpha.1",
     "es-toolkit": "^1.41.0",
     "memoizerific": "^1.11.3",
     "ts-dedent": "^2.2.0"
@@ -55,5 +55,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "5e99a2f9de73aa3b88e6517f1016e933cac67c19"
+  "gitHead": "900db1ac2a226eb8206cc89b7142d1ea50272a9e"
 }

package/src/hooks/useStoreState.ts

@@ -1,4 +1,4 @@
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { useStorage } from '../StorageProvider';
 
 export const useStoreBooleanState = (
@@ -25,3 +25,36 @@ export const useStoreBooleanState = (
 
   return [val, setVal];
 };
+
+export const useStoreNumberState = (
+  key: string,
+  defaultValue: number
+): [number, (value: number | ((prev: number) => number)) => void] => {
+  const storage = useStorage();
+
+  const [val, setVal] = useState<number>(defaultValue);
+
+  useEffect(() => {
+    storage.getItem(key).then((newVal) => {
+      if (newVal === null || newVal === undefined) {
+        setVal(defaultValue);
+      } else {
+        const parsed = parseFloat(newVal);
+        setVal(isNaN(parsed) ? defaultValue : parsed);
+      }
+    });
+  }, [key, storage, defaultValue]);
+
+  const setAndStore = useCallback(
+    (value: number | ((prev: number) => number)) => {
+      setVal((prev) => {
+        const next = typeof value === 'function' ? value(prev) : value;
+        storage.setItem(key, next.toString());
+        return next;
+      });
+    },
+    [key, storage]
+  );
+
+  return [val, setAndStore];
+};