@storybook/react-native-ui 10.0.1 → 10.0.2-alpha.1

package/dist/index.d.ts

@@ -7,8 +7,8 @@ import { State, StoriesHash } from 'storybook/manager-api';
 import { Item, ExpandAction, CombinedDataset, Selection, SBUI } from '@storybook/react-native-ui-common';
 import { API_LoadedRefData, API_IndexHash } from 'storybook/internal/types';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { StoryContext, Args } from 'storybook/internal/csf';
 import { ReactRenderer } from '@storybook/react';
+import { StoryContext, Args } from 'storybook/internal/csf';
 
 interface NodeProps$1 {
     children: React.ReactNode | React.ReactNode[];

package/dist/index.js

@@ -1277,6 +1277,7 @@ var Sidebar = import_react12.default.memo(function Sidebar2({
 
 // src/Layout.tsx
 var import_bottom_sheet4 = require("@gorhom/bottom-sheet");
+var import_portal = require("@gorhom/portal");
 var import_react_native_theming15 = require("@storybook/react-native-theming");
 var import_react_native_ui_common7 = require("@storybook/react-native-ui-common");
 var import_react18 = require("react");
@@ -1888,7 +1889,10 @@ var mobileMenuDrawerContentStyle = {
 };
 var flex1 = { flex: 1 };
 var FullUI = ({ storage, theme, storyHash, story, children }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_theming15.ThemeProvider, { theme, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_safe_area_context3.SafeAreaProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_gesture_handler2.GestureHandlerRootView, { style: flex1, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_bottom_sheet4.BottomSheetModalProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_ui_common7.StorageProvider, { storage, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_ui_common7.LayoutProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Layout, { storyHash, story, children }) }) }) }) }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_theming15.ThemeProvider, { theme, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_safe_area_context3.SafeAreaProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_gesture_handler2.GestureHandlerRootView, { style: flex1, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_bottom_sheet4.BottomSheetModalProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_react_native_ui_common7.StorageProvider, { storage, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_react_native_ui_common7.LayoutProvider, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(Layout, { storyHash, story, children }),
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_portal.PortalHost, { name: "storybook-lite-ui-root" })
+  ] }) }) }) }) }) });
 };
 var Layout = ({
   storyHash,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/react-native-ui",
-  "version": "10.0.1",
+  "version": "10.0.2-alpha.1",
   "description": "ui components for react native storybook",
   "keywords": [
     "react",
@@ -57,9 +57,10 @@
     "typescript": "~5.9.3"
   },
   "dependencies": {
+    "@gorhom/portal": "^1.0.14",
     "@storybook/react": "^10.0.1",
-    "@storybook/react-native-theming": "^10.0.1",
-    "@storybook/react-native-ui-common": "^10.0.1",
+    "@storybook/react-native-theming": "^10.0.2-alpha.1",
+    "@storybook/react-native-ui-common": "^10.0.2-alpha.1",
     "fuse.js": "^7.1.0",
     "polished": "^4.3.1"
   },
@@ -79,5 +80,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "7604d1c21f15767940d30d9c5dcf9da73d0a9fe7"
+  "gitHead": "14fb007dc99d435fd405054b84bedb38b96ab8c5"
 }

package/src/Layout.tsx

@@ -1,5 +1,5 @@
 import { BottomSheetModalProvider } from '@gorhom/bottom-sheet';
-import type { Args, StoryContext } from 'storybook/internal/csf';
+import { PortalHost, PortalProvider } from '@gorhom/portal';
 import type { ReactRenderer } from '@storybook/react';
 import { styled, ThemeProvider, useTheme } from '@storybook/react-native-theming';
 import {
@@ -16,8 +16,9 @@ import { ScrollView, Text, TouchableOpacity, View, ViewStyle } from 'react-nativ
 import { GestureHandlerRootView } from 'react-native-gesture-handler';
 import { SafeAreaProvider, useSafeAreaInsets } from 'react-native-safe-area-context';
 import { SET_CURRENT_STORY } from 'storybook/internal/core-events';
-import { addons } from 'storybook/manager-api';
+import type { Args, StoryContext } from 'storybook/internal/csf';
 import type { API_IndexHash } from 'storybook/internal/types';
+import { addons } from 'storybook/manager-api';
 import { DEFAULT_REF_ID } from './constants';
 import { BottomBarToggleIcon } from './icon/BottomBarToggleIcon';
 import { CloseFullscreenIcon } from './icon/CloseFullscreenIcon';
@@ -70,6 +71,7 @@ export const FullUI: SBUI = ({ storage, theme, storyHash, story, children }) =>
                 <Layout storyHash={storyHash} story={story}>
                   {children}
                 </Layout>
+                <PortalHost name="storybook-lite-ui-root" />
               </LayoutProvider>
             </StorageProvider>
           </BottomSheetModalProvider>

package/src/MobileMenuDrawer.tsx

@@ -5,7 +5,7 @@ import BottomSheet, {
 } from '@gorhom/bottom-sheet';
 import { useTheme } from '@storybook/react-native-theming';
 import { forwardRef, memo, ReactNode, useImperativeHandle, useMemo, useRef } from 'react';
-import { Keyboard, Platform, StyleSheet } from 'react-native';
+import { Keyboard, Platform } from 'react-native';
 import { useAnimatedStyle, useReducedMotion } from 'react-native-reanimated';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { useSelectedNode } from './SelectedNodeProvider';