@storybook/react-native-ui-common 9.0.0-beta.15 → 9.0.0-rc.4

package/dist/index.d.ts

@@ -1,13 +1,15 @@
 import * as react from 'react';
-import { ReactElement, FC, PropsWithChildren, SyntheticEvent, DependencyList, Dispatch, useState } from 'react';
+import { ReactElement, FC, PropsWithChildren, ReactNode, SyntheticEvent, DependencyList, Dispatch, useState } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _storybook_react_native_theming from '@storybook/react-native-theming';
-import { useTheme } from '@storybook/react-native-theming';
+import { useTheme, Theme } from '@storybook/react-native-theming';
 import * as react_native from 'react-native';
 import { TouchableOpacityProps, PressableProps, ViewStyle, TextStyle, ImageStyle, StyleProp } from 'react-native';
-import { State, StoriesHash, API, IndexHash } from 'storybook/internal/manager-api';
-import { StatusesByStoryIdAndTypeId, StatusValue, API_PreparedStoryIndex, StoryIndexV2, StoryIndexV3, API_IndexHash, API_Provider, DocsOptions } from 'storybook/internal/types';
+import { StoryContext, Args } from '@storybook/csf';
+import { ReactRenderer } from '@storybook/react';
 import * as Fuse from 'fuse.js';
+import { State, StoriesHash, API, IndexHash } from 'storybook/internal/manager-api';
+import { StatusesByStoryIdAndTypeId, StatusValue, API_IndexHash, API_PreparedStoryIndex, StoryIndexV2, StoryIndexV3, API_Provider, DocsOptions } from 'storybook/internal/types';
 
 interface ButtonProps extends TouchableOpacityProps {
     asChild?: boolean;
@@ -49,6 +51,15 @@ type LayoutContextType = {
 declare const LayoutProvider: FC<PropsWithChildren>;
 declare const useLayout: () => LayoutContextType;
 
+interface Storage {
+    getItem: (key: string) => Promise<string | null>;
+    setItem: (key: string, value: string) => Promise<void>;
+}
+declare const StorageProvider: FC<PropsWithChildren<{
+    storage: Storage;
+}>>;
+declare const useStorage: () => Storage;
+
 type Refs = State['refs'];
 type RefType = Refs[keyof Refs] & {
     allStatuses?: StatusesByStoryIdAndTypeId;
@@ -99,16 +110,15 @@ type SearchChildrenFn = (args: {
     closeMenu: (cb?: () => void) => void;
     getItemProps: GetSearchItemProps;
     highlightedIndex: number | null;
-}) => React.ReactNode;
-
-interface Storage {
-    getItem: (key: string) => Promise<string | null>;
-    setItem: (key: string, value: string) => Promise<void>;
-}
-declare const StorageProvider: FC<PropsWithChildren<{
+}) => ReactNode;
+type SBUI = (props: {
+    story?: StoryContext<ReactRenderer, Args>;
+    storyHash: API_IndexHash;
+    setStory: (storyId: string) => void;
     storage: Storage;
-}>>;
-declare const useStorage: () => Storage;
+    theme: Theme;
+    children: ReactElement;
+}) => ReactElement;
 
 type ToStoriesHashOptions = {
     provider: API_Provider<API>;
@@ -179,4 +189,4 @@ declare const useLastViewed: (selection: Selection) => {
 
 declare const useStoreBooleanState: (key: string, defaultValue: boolean) => ReturnType<typeof useState<boolean>>;
 
-export { Button, ButtonIcon, ButtonProps, ButtonText, CombinedDataset, Dataset, ExpandAction, ExpandType, ExpandedProps, ExpandedState, GetSearchItemProps, Highlight, IconButton, Item, ItemRef, LayoutProvider, RefType, Refs, SearchChildrenFn, SearchItem, SearchResult, SearchResultProps, Selection, Storage, StorageProvider, 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, ButtonProps, ButtonText, CombinedDataset, Dataset, ExpandAction, ExpandType, ExpandedProps, ExpandedState, GetSearchItemProps, Highlight, IconButton, Item, ItemRef, LayoutProvider, RefType, Refs, SBUI, SearchChildrenFn, SearchItem, SearchResult, SearchResultProps, Selection, Storage, StorageProvider, 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 };

package/dist/index.js

@@ -252,8 +252,8 @@ var LayoutProvider = ({ children }) => {
 var useLayout = () => (0, import_react3.useContext)(LayoutContext);
 
 // src/types.ts
-function isExpandType(x2) {
-  return !!(x2 && x2.showAll);
+function isExpandType(x) {
+  return !!(x && x.showAll);
 }
 
 // src/StorageProvider.tsx
@@ -272,92 +272,8 @@ var StorageProvider = ({
 };
 var useStorage = () => (0, import_react4.useContext)(StorageContext);
 
-// ../../node_modules/@storybook/csf/dist/index.mjs
-var C = Object.create;
-var u = Object.defineProperty;
-var B = Object.getOwnPropertyDescriptor;
-var F = Object.getOwnPropertyNames;
-var h = Object.getPrototypeOf;
-var w = Object.prototype.hasOwnProperty;
-var E = (r, e) => () => (e || r((e = { exports: {} }).exports, e), e.exports);
-var v = (r, e, n, t) => {
-  if (e && typeof e == "object" || typeof e == "function")
-    for (let a of F(e))
-      !w.call(r, a) && a !== n && u(r, a, { get: () => e[a], enumerable: !(t = B(e, a)) || t.enumerable });
-  return r;
-};
-var I = (r, e, n) => (n = r != null ? C(h(r)) : {}, v(e || !r || !r.__esModule ? u(n, "default", { value: r, enumerable: true }) : n, r));
-var x = E((T) => {
-  Object.defineProperty(T, "__esModule", { value: true }), T.isEqual = function() {
-    var r = Object.prototype.toString, e = Object.getPrototypeOf, n = Object.getOwnPropertySymbols ? function(t) {
-      return Object.keys(t).concat(Object.getOwnPropertySymbols(t));
-    } : Object.keys;
-    return function(t, a) {
-      return function i(o, s, p) {
-        var g, y, d, c = r.call(o), b = r.call(s);
-        if (o === s)
-          return true;
-        if (o == null || s == null)
-          return false;
-        if (p.indexOf(o) > -1 && p.indexOf(s) > -1)
-          return true;
-        if (p.push(o, s), c != b || (g = n(o), y = n(s), g.length != y.length || g.some(function(A) {
-          return !i(o[A], s[A], p);
-        })))
-          return false;
-        switch (c.slice(8, -1)) {
-          case "Symbol":
-            return o.valueOf() == s.valueOf();
-          case "Date":
-          case "Number":
-            return +o == +s || +o != +o && +s != +s;
-          case "RegExp":
-          case "Function":
-          case "String":
-          case "Boolean":
-            return "" + o == "" + s;
-          case "Set":
-          case "Map":
-            g = o.entries(), y = s.entries();
-            do
-              if (!i((d = g.next()).value, y.next().value, p))
-                return false;
-            while (!d.done);
-            return true;
-          case "ArrayBuffer":
-            o = new Uint8Array(o), s = new Uint8Array(s);
-          case "DataView":
-            o = new Uint8Array(o.buffer), s = new Uint8Array(s.buffer);
-          case "Float32Array":
-          case "Float64Array":
-          case "Int8Array":
-          case "Int16Array":
-          case "Int32Array":
-          case "Uint8Array":
-          case "Uint16Array":
-          case "Uint32Array":
-          case "Uint8ClampedArray":
-          case "Arguments":
-          case "Array":
-            if (o.length != s.length)
-              return false;
-            for (d = 0; d < o.length; d++)
-              if ((d in o || d in s) && (d in o != d in s || !i(o[d], s[d], p)))
-                return false;
-            return true;
-          case "Object":
-            return i(e(o), e(s), p);
-          default:
-            return false;
-        }
-      }(t, a, []);
-    };
-  }();
-});
-var l = I(x());
-var O = (r) => r.toLowerCase().replace(/[ ’–—―′¿'`~!@#$%^&*()_|+\-=?;:'",.<>\{\}\[\]\\\/]/gi, "-").replace(/-+/g, "-").replace(/^-+/, "").replace(/-+$/, "");
-
 // src/util/StoryHash.ts
+var import_csf = require("@storybook/csf");
 var import_ts_dedent = require("ts-dedent");
 var import_client_logger = require("storybook/internal/client-logger");
 var import_es_toolkit = require("es-toolkit");
@@ -469,7 +385,7 @@ var transformStoryIndexToStoriesHash = (input, { provider, docsOptions, filters,
     const names = [...root, ...groups];
     const paths = names.reduce((list, name, idx) => {
       const parent = idx > 0 && list[idx - 1];
-      const id = O(parent ? `${parent}-${name}` : name);
+      const id = (0, import_csf.sanitize)(parent ? `${parent}-${name}` : name);
       if (name.trim() === "") {
         throw new Error(import_ts_dedent.dedent`Invalid title ${title} ending in slash.`);
       }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-native-ui-common",
-  "version": "9.0.0-beta.15",
+  "version": "9.0.0-rc.4",
   "description": "common ui components for react native storybook",
   "keywords": [
     "react",
@@ -57,8 +57,9 @@
     "typescript": "~5.8.3"
   },
   "dependencies": {
-    "@storybook/react": "9.0.0-beta.10",
-    "@storybook/react-native-theming": "^9.0.0-beta.15",
+    "@storybook/csf": "^0.1.13",
+    "@storybook/react": "9.0.0-rc.4",
+    "@storybook/react-native-theming": "^9.0.0-rc.4",
     "es-toolkit": "^1.38.0",
     "fuse.js": "^7.0.0",
     "memoizerific": "^1.11.3",
@@ -69,7 +70,7 @@
   "peerDependencies": {
     "react": "*",
     "react-native": ">=0.57.0",
-    "storybook": "9.0.0-beta.10"
+    "storybook": "9.0.0-rc.4"
   },
   "engines": {
     "node": ">=18.0.0"
@@ -77,5 +78,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "905adcca4ea272933c7f0fa16f10dda201da9a5f"
+  "gitHead": "1d0249371caed6a6a90f42530d722040eb18c9dc"
 }

package/src/LayoutProvider.tsx

@@ -18,6 +18,8 @@ export const LayoutProvider: FC<PropsWithChildren> = ({ children }) => {
   const isDesktop = width >= BREAKPOINT;
   const isMobile = !isDesktop;
 
+  // console.log({ isDesktop, isMobile, breakpoint: BREAKPOINT, width });
+
   const contextValue = useMemo(
     () => ({
       isDesktop,

package/src/types.ts

@@ -1,7 +1,16 @@
-import type { StoriesHash, State } from 'storybook/internal/manager-api';
-import type { StatusValue, StatusesByStoryIdAndTypeId } from 'storybook/internal/types';
+import type { Args, StoryContext } from '@storybook/csf';
+import type { ReactRenderer } from '@storybook/react';
+import { Theme } from '@storybook/react-native-theming';
+import { Storage } from './StorageProvider';
 import * as Fuse from 'fuse.js';
+import { ReactElement, ReactNode } from 'react';
 import { PressableProps } from 'react-native';
+import type { State, StoriesHash } from 'storybook/internal/manager-api';
+import type {
+  API_IndexHash,
+  StatusesByStoryIdAndTypeId,
+  StatusValue,
+} from 'storybook/internal/types';
 
 export type Refs = State['refs'];
 export type RefType = Refs[keyof Refs] & { allStatuses?: StatusesByStoryIdAndTypeId };
@@ -63,4 +72,13 @@ export type SearchChildrenFn = (args: {
   closeMenu: (cb?: () => void) => void;
   getItemProps: GetSearchItemProps;
   highlightedIndex: number | null;
-}) => React.ReactNode;
+}) => ReactNode;
+
+export type SBUI = (props: {
+  story?: StoryContext<ReactRenderer, Args>;
+  storyHash: API_IndexHash;
+  setStory: (storyId: string) => void;
+  storage: Storage;
+  theme: Theme;
+  children: ReactElement;
+}) => ReactElement;