diff --git a/.eslintrc.js b/.eslintrc.js index d4a90084c7..b610270dda 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -5,5 +5,11 @@ module.exports = { 'react-native/no-inline-styles': 'off', 'react/react-in-jsx-scope': 'off', curly: ['error', 'multi-line'], + 'react-hooks/exhaustive-deps': [ + 'error', + { + additionalHooks: 'useStyle', + }, + ], }, }; diff --git a/examples/expo-example/package.json b/examples/expo-example/package.json index acfd9402b6..41a8f9c382 100644 --- a/examples/expo-example/package.json +++ b/examples/expo-example/package.json @@ -1,6 +1,6 @@ { "name": "expo-example", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "private": true, "main": "index.js", "scripts": { @@ -25,24 +25,24 @@ "@react-native-async-storage/async-storage": "1.23.1", "@react-native-community/datetimepicker": "8.2.0", "@react-native-community/slider": "4.5.5", - "@storybook/addon-essentials": "^8.4.2", - "@storybook/addon-interactions": "^8.4.2", - "@storybook/addon-links": "^8.4.2", - "@storybook/addon-ondevice-actions": "^8.5.2-alpha.0", - "@storybook/addon-ondevice-backgrounds": "^8.5.2-alpha.0", - "@storybook/addon-ondevice-controls": "^8.5.2-alpha.0", - "@storybook/addon-ondevice-notes": "^8.5.2-alpha.0", + "@storybook/addon-essentials": "^8.5.1", + "@storybook/addon-interactions": "^8.5.1", + "@storybook/addon-links": "^8.5.1", + "@storybook/addon-ondevice-actions": "^8.5.2-alpha.3", + "@storybook/addon-ondevice-backgrounds": "^8.5.2-alpha.3", + "@storybook/addon-ondevice-controls": "^8.5.2-alpha.3", + "@storybook/addon-ondevice-notes": "^8.5.2-alpha.3", "@storybook/addon-react-native-server": "0.0.6", "@storybook/addon-react-native-web": "^0.0.26", "@storybook/addon-webpack5-compiler-babel": "^3.0.3", - "@storybook/blocks": "^8.4.2", - "@storybook/builder-webpack5": "^8.4.2", + "@storybook/blocks": "^8.5.1", + "@storybook/builder-webpack5": "^8.5.1", "@storybook/global": "^5.0.0", - "@storybook/react": "^8.4.2", - "@storybook/react-native": "^8.5.2-alpha.0", - "@storybook/react-native-theming": "^8.5.2-alpha.0", - "@storybook/react-webpack5": "^8.4.2", - "@storybook/test": "^8.4.2", + "@storybook/react": "^8.5.1", + "@storybook/react-native": "^8.5.2-alpha.3", + "@storybook/react-native-theming": "^8.5.2-alpha.3", + "@storybook/react-webpack5": "^8.5.1", + "@storybook/test": "^8.5.1", "expo": "~52.0.11", "history": "^5.3.0", "querystring": "^0.2.1", @@ -55,7 +55,7 @@ "react-native-svg": "15.8.0", "react-native-web": "~0.19.13", "react-router": "^6.26.2", - "storybook": "^8.4.2", + "storybook": "^8.5.1", "storybook-addon-deep-controls": "^0.9.2", "ws": "^8.18.0" }, diff --git a/examples/expo-example/scripts/generatePerfTests.ts b/examples/expo-example/scripts/generatePerfTests.ts new file mode 100644 index 0000000000..e37fb2e419 --- /dev/null +++ b/examples/expo-example/scripts/generatePerfTests.ts @@ -0,0 +1,57 @@ +import * as fs from 'fs'; +import * as path from 'path'; + +const template = (num: number) => `import { Meta, StoryObj } from '@storybook/react' +import { View } from 'react-native' + +const Test${num} = () => { + return +} + +const meta: Meta = { + title: 'PerfTesting/Test${num}', + component: Test${num}, +} + +export default meta + +export const Default: StoryObj = {} +export const one: StoryObj = {} +export const two: StoryObj = {} +export const three: StoryObj = {} +export const four: StoryObj = {} +export const five: StoryObj = {} +export const six: StoryObj = {} +export const seven: StoryObj = {} +export const eight: StoryObj = {} +export const nine: StoryObj = {} +export const ten: StoryObj = {} +export const eleven: StoryObj = {} +export const twelve: StoryObj = {} +export const thirteen: StoryObj = {} +export const fourteen: StoryObj = {} +export const fifteen: StoryObj = {} +export const sixteen: StoryObj = {} +export const seventeen: StoryObj = {} +export const eighteen: StoryObj = {} +export const nineteen: StoryObj = {}`; + +const generateFiles = () => { + const baseDir = path.join(__dirname, '../components/PerfTesting'); + + // Create directory if it doesn't exist + if (!fs.existsSync(baseDir)) { + fs.mkdirSync(baseDir, { recursive: true }); + } + + // Generate files from Test11 to Test50 (since Test1-10 already exist) + for (let i = 1; i <= 200; i++) { + const fileName = `Test${i}.stories.tsx`; + const filePath = path.join(baseDir, fileName); + + fs.writeFileSync(filePath, template(i)); + console.log(`Generated ${fileName}`); + } +}; + +generateFiles(); diff --git a/lerna.json b/lerna.json index 7bd0630776..a6728c8b71 100644 --- a/lerna.json +++ b/lerna.json @@ -1,5 +1,5 @@ { "npmClient": "yarn", "registry": "https://registry.npmjs.org", - "version": "8.5.2-alpha.0" + "version": "8.5.2-alpha.3" } \ No newline at end of file diff --git a/packages/ondevice-actions/package.json b/packages/ondevice-actions/package.json index 9d94e6c0cc..c861ec9789 100644 --- a/packages/ondevice-actions/package.json +++ b/packages/ondevice-actions/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/addon-ondevice-actions", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "Action Logger addon for react-native storybook", "keywords": [ "storybook" @@ -27,8 +27,8 @@ "prepare": "tsc" }, "dependencies": { - "@storybook/addon-actions": "^8.4.2", - "@storybook/core": "^8.4.2", + "@storybook/addon-actions": "^8.5.1", + "@storybook/core": "^8.5.1", "@storybook/global": "^5.0.0", "fast-deep-equal": "^2.0.1" }, diff --git a/packages/ondevice-backgrounds/package.json b/packages/ondevice-backgrounds/package.json index 4e799190ae..8e7a02e192 100644 --- a/packages/ondevice-backgrounds/package.json +++ b/packages/ondevice-backgrounds/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/addon-ondevice-backgrounds", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "A react-native storybook addon to show different backgrounds for your preview", "keywords": [ "addon", @@ -32,8 +32,8 @@ "dev": "tsc --watch" }, "dependencies": { - "@storybook/core": "^8.4.2", - "@storybook/react-native-theming": "^8.5.2-alpha.0" + "@storybook/core": "^8.5.1", + "@storybook/react-native-theming": "^8.5.2-alpha.3" }, "devDependencies": { "typescript": "^5.3.3" diff --git a/packages/ondevice-controls/package.json b/packages/ondevice-controls/package.json index 94c907477f..10f98c82cc 100644 --- a/packages/ondevice-controls/package.json +++ b/packages/ondevice-controls/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/addon-ondevice-controls", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "Display storybook controls on your device.", "keywords": [ "addon", @@ -30,10 +30,10 @@ "copyimages": "cross-env-shell cp -r src/components/color-picker/resources dist/components/color-picker/resources" }, "dependencies": { - "@storybook/addon-controls": "^8.4.2", - "@storybook/core": "^8.4.2", - "@storybook/react-native-theming": "^8.5.2-alpha.0", - "@storybook/react-native-ui": "^8.5.2-alpha.0", + "@storybook/addon-controls": "^8.5.1", + "@storybook/core": "^8.5.1", + "@storybook/react-native-theming": "^8.5.2-alpha.3", + "@storybook/react-native-ui": "^8.5.2-alpha.3", "deep-equal": "^1.0.1", "prop-types": "^15.7.2", "react-native-modal-datetime-picker": "^14.0.0", diff --git a/packages/ondevice-notes/package.json b/packages/ondevice-notes/package.json index cf434d8db3..3e0b171e16 100644 --- a/packages/ondevice-notes/package.json +++ b/packages/ondevice-notes/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/addon-ondevice-notes", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "Write notes for your react-native Storybook stories.", "keywords": [ "addon", @@ -29,8 +29,8 @@ "dev": "tsc --watch" }, "dependencies": { - "@storybook/core": "^8.4.2", - "@storybook/react-native-theming": "^8.5.2-alpha.0", + "@storybook/core": "^8.5.1", + "@storybook/react-native-theming": "^8.5.2-alpha.3", "react-native-markdown-display": "^7.0.2" }, "devDependencies": { diff --git a/packages/react-native-theming/package.json b/packages/react-native-theming/package.json index 17cce80919..75c5a3fef0 100644 --- a/packages/react-native-theming/package.json +++ b/packages/react-native-theming/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/react-native-theming", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "A wrapper library around emotion 11 to provide theming support for react-native storybook", "keywords": [ "react", diff --git a/packages/react-native-ui/package.json b/packages/react-native-ui/package.json index 5f5a87cdf0..a743026784 100644 --- a/packages/react-native-ui/package.json +++ b/packages/react-native-ui/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/react-native-ui", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "ui components for react native storybook", "keywords": [ "react", @@ -58,9 +58,9 @@ "typescript": "^5.3.3" }, "dependencies": { - "@storybook/core": "^8.4.2", - "@storybook/react": "^8.4.2", - "@storybook/react-native-theming": "^8.5.2-alpha.0", + "@storybook/core": "^8.5.1", + "@storybook/react": "^8.5.1", + "@storybook/react-native-theming": "^8.5.2-alpha.3", "fuse.js": "^7.0.0", "memoizerific": "^1.11.3", "polished": "^4.3.1", diff --git a/packages/react-native-ui/src/Layout.tsx b/packages/react-native-ui/src/Layout.tsx index 4074fa47ef..70731fc4ce 100644 --- a/packages/react-native-ui/src/Layout.tsx +++ b/packages/react-native-ui/src/Layout.tsx @@ -3,8 +3,8 @@ import { addons } from '@storybook/core/manager-api'; import { type API_IndexHash, type Args, type StoryContext } from '@storybook/core/types'; import type { ReactRenderer } from '@storybook/react'; import { styled, useTheme } from '@storybook/react-native-theming'; -import { ReactNode, useRef, useState } from 'react'; -import { ScrollView, Text, TouchableOpacity, View } from 'react-native'; +import { ReactNode, useRef, useState, useCallback } from 'react'; +import { ScrollView, Text, TouchableOpacity, View, ViewStyle } from 'react-native'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { IconButton } from './IconButton'; import { useLayout } from './LayoutProvider'; @@ -18,6 +18,39 @@ import { BottomBarToggleIcon } from './icon/BottomBarToggleIcon'; import { CloseFullscreenIcon } from './icon/CloseFullscreenIcon'; import { FullscreenIcon } from './icon/FullscreenIcon'; import { MenuIcon } from './icon/MenuIcon'; +import { useStyle } from './util/useStyle'; + +const desktopLogoContainer = { + flexDirection: 'row', + alignItems: 'center', + paddingTop: 10, + paddingLeft: 16, + paddingBottom: 4, + paddingRight: 10, + justifyContent: 'space-between', +} satisfies ViewStyle; + +const desktopContentContainerStyle = { flex: 1 } satisfies ViewStyle; + +const desktopContentStyle = { flex: 1, overflow: 'hidden' } satisfies ViewStyle; + +const mobileContentStyle = { flex: 1, overflow: 'hidden' } satisfies ViewStyle; + +const placeholderObject = {}; + +const placeholderArray = []; + +const iconFloatRightStyle = { marginLeft: 'auto' } satisfies ViewStyle; + +const navButtonStyle = { flexShrink: 1 } satisfies ViewStyle; + +const navButtonHitSlop = { bottom: 10, left: 10, right: 10, top: 10 }; + +const mobileMenuDrawerContentStyle = { + paddingLeft: 16, + paddingTop: 4, + paddingBottom: 4, +} satisfies ViewStyle; export const Layout = ({ storyHash, @@ -46,58 +79,114 @@ export const Layout = ({ const [uiHidden, setUiHidden] = useState(false); + const desktopContainerStyle = useStyle( + () => ({ + flex: 1, + paddingTop: insets.top, + backgroundColor: theme.background.content, + flexDirection: 'row', + }), + [theme.background.content, insets.top] + ); + + const desktopSidebarStyle = useStyle( + () => ({ + width: desktopSidebarOpen ? 240 : undefined, + padding: desktopSidebarOpen ? 0 : 10, + borderColor: theme.appBorderColor, + borderRightWidth: 1, + }), + [desktopSidebarOpen, theme.appBorderColor] + ); + + const desktopScrollViewContentContainerStyle = useStyle( + () => ({ + paddingBottom: insets.bottom, + }), + [insets.bottom] + ); + + const desktopAddonsPanelStyle = useStyle( + () => ({ + height: desktopAddonsPanelOpen ? 300 : undefined, + borderTopWidth: 1, + borderColor: theme.appBorderColor, + paddingTop: desktopAddonsPanelOpen ? 4 : 0, + padding: desktopAddonsPanelOpen ? 0 : 10, + }), + [desktopAddonsPanelOpen, theme.appBorderColor] + ); + + const mobileContainerStyle = useStyle( + () => ({ + flex: 1, + paddingTop: story?.parameters?.noSafeArea ? 0 : insets.top, + backgroundColor: theme.background.content, + }), + [theme.background.content, insets.top, story?.parameters?.noSafeArea] + ); + + const fullScreenButtonStyle = useStyle( + () => ({ + position: 'absolute', + bottom: uiHidden ? 56 + insets.bottom : 16, + right: 16, + backgroundColor: theme.background.content, + padding: 4, + borderRadius: 4, + borderWidth: 1, + borderColor: theme.appBorderColor, + }), + [uiHidden, insets.bottom, theme.background.content, theme.appBorderColor] + ); + + const containerStyle = useStyle( + () => ({ + marginBottom: insets.bottom, + }), + [insets.bottom] + ); + + const navButtonTextStyle = useStyle( + () => ({ + flexShrink: 1, + color: theme.color.defaultText, + }), + [theme.color.defaultText] + ); + + const openMobileMenu = useCallback(() => { + mobileMenuDrawerRef.current.setMobileMenuOpen(true); + }, [mobileMenuDrawerRef]); + + const setSelection = useCallback(({ storyId: newStoryId }: { storyId: string }) => { + const channel = addons.getChannel(); + + channel.emit(SET_CURRENT_STORY, { storyId: newStoryId }); + }, []); + if (isDesktop) { return ( - - + + {desktopSidebarOpen ? ( - + setDesktopSidebarOpen(false)} Icon={MenuIcon} /> { - const channel = addons.getChannel(); - - channel.emit(SET_CURRENT_STORY, { storyId: newStoryId }); - }} - status={{}} + refs={placeholderObject} + setSelection={setSelection} + status={placeholderObject} index={storyHash} storyId={story?.id} refId={DEFAULT_REF_ID} @@ -108,23 +197,15 @@ export const Layout = ({ )} - - {children} - - + + {children} + + {desktopAddonsPanelOpen ? ( setDesktopAddonsPanelOpen(false)} /> ) : ( setDesktopAddonsPanelOpen(true)} Icon={BottomBarToggleIcon} /> @@ -136,28 +217,13 @@ export const Layout = ({ } return ( - - + + {children} {story?.parameters?.hideFullScreenButton ? null : ( setUiHidden((prev) => !prev)} > {uiHidden ? ( @@ -169,43 +235,17 @@ export const Layout = ({ )} - - - - - - { - const channel = addons.getChannel(); - - channel.emit(SET_CURRENT_STORY, { storyId: newStoryId }); - }} - status={{}} - index={storyHash} - storyId={story?.id} - refId={DEFAULT_REF_ID} - /> - - - - {!uiHidden ? ( - + ) : null} + + + + + + + + + + ); }; diff --git a/packages/react-native-ui/src/MobileAddonsPanel.tsx b/packages/react-native-ui/src/MobileAddonsPanel.tsx index da22081c7a..75d2f46ce1 100644 --- a/packages/react-native-ui/src/MobileAddonsPanel.tsx +++ b/packages/react-native-ui/src/MobileAddonsPanel.tsx @@ -2,8 +2,8 @@ import { BottomSheetModal } from '@gorhom/bottom-sheet'; import { addons } from '@storybook/core/manager-api'; import { styled } from '@storybook/react-native-theming'; import { Addon_TypesEnum } from '@storybook/core/types'; -import { forwardRef, useImperativeHandle, useRef, useState } from 'react'; -import { Platform, Text, View, useWindowDimensions } from 'react-native'; +import { forwardRef, useImperativeHandle, useMemo, useRef, useState } from 'react'; +import { Platform, StyleProp, Text, View, ViewStyle, useWindowDimensions } from 'react-native'; import { ScrollView } from 'react-native-gesture-handler'; import Animated, { useAnimatedKeyboard, @@ -15,11 +15,20 @@ import { useSafeAreaInsets } from 'react-native-safe-area-context'; import { useTheme } from '@storybook/react-native-theming'; import { IconButton } from './IconButton'; import { CloseIcon } from './icon/CloseIcon'; +import { useStyle } from './util/useStyle'; export interface MobileAddonsPanelRef { setAddonsPanelOpen: (isOpen: boolean) => void; } +const bottomSheetStyle = { + paddingTop: 8, +} satisfies StyleProp; + +const contentStyle = { + flex: 1, +} satisfies StyleProp; + export const MobileAddonsPanel = forwardRef( ({ storyId }, ref) => { const theme = useTheme(); @@ -53,24 +62,31 @@ export const MobileAddonsPanel = forwardRef { + return { + borderRadius: 0, + borderTopColor: theme.appBorderColor, + borderTopWidth: 1, + backgroundColor: theme.background.content, + }; + }); + + const handleIndicatorStyle = useStyle(() => { + return { + backgroundColor: theme.textMutedColor, + }; + }); + return ( - + { addonsPanelBottomSheetRef.current?.dismiss(); @@ -92,6 +108,38 @@ export const MobileAddonsPanel = forwardRef; + +const addonsTabsStyle = { + flexDirection: 'row', + borderBottomWidth: 1, + borderBottomColor: 'lightgrey', +} satisfies StyleProp; + +const addonsTabsContentContainerStyle = { + justifyContent: 'center', +} satisfies StyleProp; + +const closeIconStyle = { + marginRight: 4, + marginBottom: 4, + alignItems: 'center', + justifyContent: 'center', +} satisfies StyleProp; + +const addonsScrollStyle = { + flex: 1, +} satisfies StyleProp; + +const centeredStyle = { + alignItems: 'center', + justifyContent: 'center', +} satisfies StyleProp; + +const hitSlop = { top: 10, right: 10, bottom: 10, left: 10 }; + export const AddonsTabs = ({ onClose, storyId }: { onClose?: () => void; storyId?: string }) => { const panels = addons.getElements(Addon_TypesEnum.PANEL); @@ -99,15 +147,39 @@ export const AddonsTabs = ({ onClose, storyId }: { onClose?: () => void; storyId const insets = useSafeAreaInsets(); + const scrollContentContainerStyle = useStyle(() => { + return { + paddingBottom: insets.bottom + 16, + }; + }); + + const panel = useMemo(() => { + if (!storyId) { + return ( + + No Story Selected + + ); + } + + if (Object.keys(panels).length === 0) { + return ( + + No addons loaded. + + ); + } + + return panels[addonSelected].render({ active: true }); + }, [addonSelected, panels, storyId]); + return ( - - + + {Object.values(panels).map(({ id, title }) => { const resolvedTitle = typeof title === 'function' ? title({}) : title; @@ -124,43 +196,18 @@ export const AddonsTabs = ({ onClose, storyId }: { onClose?: () => void; storyId onClose?.()} /> - {(() => { - if (!storyId) { - return ( - - No Story Selected - - ); - } - - if (Object.keys(panels).length === 0) { - return ( - - No addons loaded. - - ); - } - - return panels[addonSelected].render({ active: true }); - })()} + {panel} ); diff --git a/packages/react-native-ui/src/MobileMenuDrawer.tsx b/packages/react-native-ui/src/MobileMenuDrawer.tsx index 98090f3fc6..6da2ea5405 100644 --- a/packages/react-native-ui/src/MobileMenuDrawer.tsx +++ b/packages/react-native-ui/src/MobileMenuDrawer.tsx @@ -1,10 +1,9 @@ -import { +import BottomSheet, { BottomSheetBackdrop, BottomSheetBackdropProps, - BottomSheetModal, BottomSheetScrollView, } from '@gorhom/bottom-sheet'; -import { ReactNode, forwardRef, useImperativeHandle, useRef } from 'react'; +import { ReactNode, forwardRef, memo, useImperativeHandle, useMemo, useRef } from 'react'; import { Keyboard } from 'react-native'; import { useReducedMotion } from 'react-native-reanimated'; import { useSafeAreaInsets } from 'react-native-safe-area-context'; @@ -28,52 +27,67 @@ export const BottomSheetBackdropComponent = (backdropComponentProps: BottomSheet /> ); -export const MobileMenuDrawer = forwardRef( - ({ children }, ref) => { +const snapPoints = ['50%', '75%']; + +export const MobileMenuDrawer = memo( + forwardRef(({ children }, ref) => { const reducedMotion = useReducedMotion(); const insets = useSafeAreaInsets(); const theme = useTheme(); - const menuBottomSheetRef = useRef(null); + const menuBottomSheetRef = useRef(null); useImperativeHandle(ref, () => ({ setMobileMenuOpen: (open: boolean) => { if (open) { - menuBottomSheetRef.current?.present(); + // menuBottomSheetRef.current?.present(); + menuBottomSheetRef.current?.snapToIndex(1); } else { Keyboard.dismiss(); - menuBottomSheetRef.current?.dismiss(); + // menuBottomSheetRef.current?.dismiss(); + menuBottomSheetRef.current?.close(); } }, })); + const bgColorStyle = useMemo(() => { + return { backgroundColor: theme.background.content }; + }, [theme.background.content]); + + const handleIndicatorStyle = useMemo(() => { + return { backgroundColor: theme.textMutedColor }; + }, [theme.textMutedColor]); + + const contentContainerStyle = useMemo(() => { + return { paddingBottom: insets.bottom }; + }, [insets.bottom]); + return ( - {children} - + ); - } + }) ); diff --git a/packages/react-native-ui/src/Search.tsx b/packages/react-native-ui/src/Search.tsx index 9634182d71..26812ee636 100644 --- a/packages/react-native-ui/src/Search.tsx +++ b/packages/react-native-ui/src/Search.tsx @@ -2,8 +2,8 @@ import { BottomSheetTextInput } from '@gorhom/bottom-sheet'; import { styled } from '@storybook/react-native-theming'; import type { IFuseOptions } from 'fuse.js'; import Fuse from 'fuse.js'; -import React, { useCallback, useRef, useState } from 'react'; -import { TextInput, View } from 'react-native'; +import React, { useCallback, useDeferredValue, useRef, useState } from 'react'; +import { Platform, TextInput, View } from 'react-native'; import { CloseIcon } from './icon/CloseIcon'; import { SearchIcon } from './icon/SearchIcon'; import { useLayout } from './LayoutProvider'; @@ -61,6 +61,8 @@ const BottomSheetInput = styled(BottomSheetTextInput)(({ theme }) => ({ height: 32, paddingLeft: 28, paddingRight: 28, + paddingTop: Platform.OS === 'android' ? 0 : undefined, + paddingBottom: Platform.OS === 'android' ? 0 : undefined, borderWidth: 1, borderColor: theme.appBorderColor, backgroundColor: 'transparent', @@ -219,8 +221,8 @@ export const Search = React.memo<{ }, [allComponents, dataset.hash, getLastViewed, makeFuse] ); - - const input = inputValue ? inputValue.trim() : ''; + const deferredQuery = useDeferredValue(inputValue); + const input = deferredQuery ? deferredQuery.trim() : ''; const results = input ? getResults(input) : []; return ( diff --git a/packages/react-native-ui/src/StorybookLogo.tsx b/packages/react-native-ui/src/StorybookLogo.tsx index 4441110cf0..df13fa9d87 100644 --- a/packages/react-native-ui/src/StorybookLogo.tsx +++ b/packages/react-native-ui/src/StorybookLogo.tsx @@ -96,9 +96,12 @@ const BrandTitle: FC<{ theme: Theme }> = ({ theme }) => { }; export const StorybookLogo: FC<{ theme: Theme }> = ({ theme }) => { - if (theme.brand?.image) { + const image = useMemo(() => theme.brand?.image, [theme.brand?.image]); + const title = useMemo(() => theme.brand?.title, [theme.brand?.title]); + + if (image) { return ; - } else if (theme.brand?.title) { + } else if (title) { return ; } else { return ; diff --git a/packages/react-native-ui/src/TreeNode.tsx b/packages/react-native-ui/src/TreeNode.tsx index bcbc3a0b4a..1e2953a58e 100644 --- a/packages/react-native-ui/src/TreeNode.tsx +++ b/packages/react-native-ui/src/TreeNode.tsx @@ -4,7 +4,7 @@ import { GroupIcon } from './icon/GroupIcon'; import { StoryIcon } from './icon/StoryIcon'; import { CollapseIcon } from './icon/CollapseIcon'; -import React, { ComponentProps, FC } from 'react'; +import React, { ComponentProps, FC, useMemo } from 'react'; import { transparentize } from 'polished'; export interface NodeProps { @@ -95,15 +95,15 @@ export const GroupNode: FC< }) { const theme = useTheme(); + const color = useMemo(() => { + return theme.base === 'dark' ? theme.color.primary : theme.color.ultraviolet; + }, [theme.base, theme.color.primary, theme.color.ultraviolet]); + return ( {isExpandable && } - + {children} @@ -113,11 +113,16 @@ export const GroupNode: FC< export const ComponentNode: FC> = React.memo( function ComponentNode({ children, isExpanded, isExpandable, ...props }) { const theme = useTheme(); + + const color = useMemo(() => { + return theme.color.secondary; + }, [theme.color.secondary]); + return ( {isExpandable && } - + {children} @@ -131,14 +136,14 @@ export const StoryNode: FC> = React.memo(functio }) { const theme = useTheme(); + const color = useMemo(() => { + return props.selected ? theme.color.lightest : theme.color.seafoam; + }, [props.selected, theme.color.lightest, theme.color.seafoam]); + return ( - + {children} diff --git a/packages/react-native-ui/src/icon/CloseFullscreenIcon.tsx b/packages/react-native-ui/src/icon/CloseFullscreenIcon.tsx index df73dd7cc4..3ac4aae3aa 100644 --- a/packages/react-native-ui/src/icon/CloseFullscreenIcon.tsx +++ b/packages/react-native-ui/src/icon/CloseFullscreenIcon.tsx @@ -1,18 +1,16 @@ -import * as React from 'react'; +import { useMemo } from 'react'; import Svg, { Path, SvgProps } from 'react-native-svg'; import { useTheme } from '@storybook/react-native-theming'; export function CloseFullscreenIcon({ color, width = 14, height = 14, ...props }: SvgProps) { const theme = useTheme(); + const fillColor = useMemo(() => { + return color ?? theme.color.defaultText; + }, [color, theme.color.defaultText]); + return ( - + ); diff --git a/packages/react-native-ui/src/icon/CollapseAllIcon.tsx b/packages/react-native-ui/src/icon/CollapseAllIcon.tsx index 789d13cddf..ec4ed374ff 100644 --- a/packages/react-native-ui/src/icon/CollapseAllIcon.tsx +++ b/packages/react-native-ui/src/icon/CollapseAllIcon.tsx @@ -1,5 +1,6 @@ import { Path, Svg, SvgProps } from 'react-native-svg'; import { useTheme } from '@storybook/react-native-theming'; +import { useMemo } from 'react'; export const CollapseAllIcon = ({ color, //= '#2E3438', @@ -9,11 +10,15 @@ export const CollapseAllIcon = ({ }: SvgProps) => { const theme = useTheme(); + const fillColor = useMemo(() => { + return color ?? theme.color.defaultText; + }, [color, theme.color.defaultText]); + return ( ); diff --git a/packages/react-native-ui/src/icon/ExpandAllIcon.tsx b/packages/react-native-ui/src/icon/ExpandAllIcon.tsx index 9525751a52..9c611e40d1 100644 --- a/packages/react-native-ui/src/icon/ExpandAllIcon.tsx +++ b/packages/react-native-ui/src/icon/ExpandAllIcon.tsx @@ -1,5 +1,7 @@ import { Path, Svg, SvgProps } from 'react-native-svg'; import { useTheme } from '@storybook/react-native-theming'; +import { useMemo } from 'react'; + export const ExpandAllIcon = ({ color, //= '#2E3438', width = 14, @@ -8,11 +10,15 @@ export const ExpandAllIcon = ({ }: SvgProps) => { const theme = useTheme(); + const fillColor = useMemo(() => { + return color ?? theme.color.defaultText; + }, [color, theme.color.defaultText]); + return ( ); diff --git a/packages/react-native-ui/src/icon/FullscreenIcon.tsx b/packages/react-native-ui/src/icon/FullscreenIcon.tsx index 79cdcecb26..6ad7e7adda 100644 --- a/packages/react-native-ui/src/icon/FullscreenIcon.tsx +++ b/packages/react-native-ui/src/icon/FullscreenIcon.tsx @@ -1,15 +1,20 @@ import * as React from 'react'; import Svg, { Path, SvgProps } from 'react-native-svg'; import { useTheme } from '@storybook/react-native-theming'; +import { useMemo } from 'react'; export function FullscreenIcon({ color, width = 14, height = 14, ...props }: SvgProps) { const theme = useTheme(); + const fillColor = useMemo(() => { + return color ?? theme.color.defaultText; + }, [color, theme.color.defaultText]); + return ( ); diff --git a/packages/react-native-ui/src/util/status.tsx b/packages/react-native-ui/src/util/status.tsx index 225aa6d5b8..430ebd32ee 100644 --- a/packages/react-native-ui/src/util/status.tsx +++ b/packages/react-native-ui/src/util/status.tsx @@ -1,4 +1,4 @@ -import type { ReactElement } from 'react'; +import { useMemo, type ReactElement } from 'react'; import type { API_HashEntry, API_StatusState, API_StatusValue } from '@storybook/core/types'; import { useTheme } from '@storybook/react-native-theming'; @@ -21,12 +21,12 @@ function SmallIcons(props: SvgProps) { function LoadingIcons(props: SvgProps) { const theme = useTheme(); - return ( - - ); + + const color = useMemo(() => { + return theme.base === 'light' ? theme.color.mediumdark : theme.color.darker; + }, [theme.base, theme.color.darker, theme.color.mediumdark]); + + return ; } export const statusPriority: API_StatusValue[] = ['unknown', 'pending', 'success', 'warn', 'error']; diff --git a/packages/react-native-ui/src/util/useStyle.ts b/packages/react-native-ui/src/util/useStyle.ts new file mode 100644 index 0000000000..5557fcf364 --- /dev/null +++ b/packages/react-native-ui/src/util/useStyle.ts @@ -0,0 +1,28 @@ +import { DependencyList, useMemo } from 'react'; +import { ImageStyle, StyleProp, TextStyle, ViewStyle } from 'react-native'; + +/** + * A hook to memoize a style. Uses `ViewStyle` per default, but can be used with other styles deriving from `FlexStyle` as well, such as `TextStyle`. + * @param styleFactory The function that returns a style + * @param deps The dependencies to trigger memoization re-evaluation + * @see ["Memoize!!! 💾 - a react (native) performance guide"](https://gist.github.com/mrousavy/0de7486814c655de8a110df5cef74ddc) + * @example + * + * // simple object styles + * const style1 = useStyle(() => ({ height: someDynamicValue }), [someDynamicValue]) + * + * // array styles + * const style2 = useStyle( + * () => [styles.container, props.style, { height: someDynamicValue }], + * [props.style, someDynamicValue] + * ); + */ +export const useStyle = < + TStyle extends ViewStyle | TextStyle | ImageStyle, + TOutput extends StyleProp +>( + styleFactory: () => TOutput, + deps?: DependencyList +): TOutput => + // eslint-disable-next-line react-hooks/exhaustive-deps + useMemo(styleFactory, deps); diff --git a/packages/react-native/package.json b/packages/react-native/package.json index 6d06a90be3..512b4bb436 100644 --- a/packages/react-native/package.json +++ b/packages/react-native/package.json @@ -1,6 +1,6 @@ { "name": "@storybook/react-native", - "version": "8.5.2-alpha.0", + "version": "8.5.2-alpha.3", "description": "A better way to develop React Native Components for your app", "keywords": [ "react", @@ -45,12 +45,12 @@ "test:update": "jest --updateSnapshot" }, "dependencies": { - "@storybook/core": "^8.4.2", - "@storybook/csf": "^0.1.1", + "@storybook/core": "^8.5.1", + "@storybook/csf": "^0.1.13", "@storybook/global": "^5.0.0", - "@storybook/react": "^8.4.2", - "@storybook/react-native-theming": "^8.5.2-alpha.0", - "@storybook/react-native-ui": "^8.5.2-alpha.0", + "@storybook/react": "^8.5.1", + "@storybook/react-native-theming": "^8.5.2-alpha.3", + "@storybook/react-native-ui": "^8.5.2-alpha.3", "chokidar": "^3.5.1", "commander": "^8.2.0", "dedent": "^1.5.1", @@ -60,7 +60,7 @@ "react-native-swipe-gestures": "^1.0.5", "react-native-url-polyfill": "^2.0.0", "setimmediate": "^1.0.5", - "storybook": "^8.4.2", + "storybook": "^8.5.1", "type-fest": "~2.19", "util": "^0.12.4", "ws": "^8.18.0" diff --git a/packages/react-native/src/View.tsx b/packages/react-native/src/View.tsx index f22c108966..af276d39ae 100644 --- a/packages/react-native/src/View.tsx +++ b/packages/react-native/src/View.tsx @@ -1,9 +1,10 @@ import { BottomSheetModalProvider } from '@gorhom/bottom-sheet'; import { Channel, WebsocketTransport } from '@storybook/core/channels'; import Events from '@storybook/core/core-events'; -import { StoryContext, toId } from '@storybook/csf'; import { addons as managerAddons } from '@storybook/core/manager-api'; import { PreviewWithSelection, addons as previewAddons } from '@storybook/core/preview-api'; +import type { API_IndexHash, PreparedStory, StoryId, StoryIndex } from '@storybook/core/types'; +import { StoryContext, toId } from '@storybook/csf'; import type { ReactRenderer } from '@storybook/react'; import { Theme, ThemeProvider, darkTheme, theme } from '@storybook/react-native-theming'; import { @@ -12,7 +13,6 @@ import { StorageProvider, transformStoryIndexToStoriesHash, } from '@storybook/react-native-ui'; -import type { API_IndexHash, PreparedStory, StoryId, StoryIndex } from '@storybook/core/types'; import dedent from 'dedent'; import deepmerge from 'deepmerge'; import { useEffect, useMemo, useReducer, useState } from 'react'; @@ -20,8 +20,8 @@ import { ActivityIndicator, View as RNView, StyleSheet, useColorScheme } from 'r import { GestureHandlerRootView } from 'react-native-gesture-handler'; import { SafeAreaProvider } from 'react-native-safe-area-context'; import StoryView from './components/StoryView'; -import getHost from './rn-host-detect'; import { useSetStoryContext, useStoryContext } from './hooks'; +import getHost from './rn-host-detect'; const STORAGE_KEY = 'lastOpenedStory'; diff --git a/packages/react-native/src/components/StoryView/StoryView.tsx b/packages/react-native/src/components/StoryView/StoryView.tsx index 7908bd385a..23f49040e5 100644 --- a/packages/react-native/src/components/StoryView/StoryView.tsx +++ b/packages/react-native/src/components/StoryView/StoryView.tsx @@ -1,6 +1,6 @@ -import React from 'react'; import { styled, useTheme } from '@storybook/react-native-theming'; -import { Keyboard, View } from 'react-native'; +import React, { useCallback, useMemo } from 'react'; +import { Keyboard, View, ViewStyle } from 'react-native'; import { useStoryContext } from '../../hooks'; import { ErrorBoundary } from './ErrorBoundary'; @@ -25,6 +25,13 @@ const Text = styled.Text(({ theme }) => ({ color: theme?.color?.defaultText, })); +const errorContainerStyle = { + flex: 1, + padding: 16, + alignItems: 'center', + justifyContent: 'center', +} satisfies ViewStyle; + const StoryView = () => { const context = useStoryContext(); @@ -32,21 +39,29 @@ const StoryView = () => { const theme = useTheme(); + const containerStyle = useMemo(() => { + return { + flex: 1, + backgroundColor: theme.background?.content, + overflow: 'hidden', + } satisfies ViewStyle; + }, [theme.background?.content]); + + const onError = useCallback(() => { + console.log(`Error rendering story for ${context?.title} ${context?.name}`); + }, [context?.title, context?.name]); + if (context && context.unboundStoryFn) { const { unboundStoryFn: StoryComponent } = context; return ( - { - console.log(`Error rendering story for ${context.title} ${context.name}`); - }} - > + {StoryComponent && } @@ -54,7 +69,7 @@ const StoryView = () => { } return ( - + Please open the sidebar and select a story to preview. ); diff --git a/yarn.lock b/yarn.lock index 93282842ac..d468adbc72 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4991,9 +4991,9 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-actions@npm:8.4.2, @storybook/addon-actions@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-actions@npm:8.4.2" +"@storybook/addon-actions@npm:8.5.1, @storybook/addon-actions@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-actions@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" "@types/uuid": "npm:^9.0.1" @@ -5001,135 +5001,135 @@ __metadata: polished: "npm:^4.2.2" uuid: "npm:^9.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/c00b213e42ea085a19162448b5c35d2439be7aa18425fc4c535e50b2cb187c3c93d6603e7c7727258e1b8abdb04d20d60eacf3bd0e2bec86a1a5df2c043bf3d7 + storybook: ^8.5.1 + checksum: 10/416639eec990a65a85527fda8fbe9d16465cb1e60a1ac53c4e24fbf84b547d1c536325a8dfd530afc032ec104c85dc65d68c612b4081ca3f08959bbb1f9a7c6d languageName: node linkType: hard -"@storybook/addon-backgrounds@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-backgrounds@npm:8.4.2" +"@storybook/addon-backgrounds@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-backgrounds@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" memoizerific: "npm:^1.11.3" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/56f2c8bcd5c32fd071baf14764b1f78dacfc25d12549686451043c8864c3e8ef56dc064ff91308dc4f37c842feb7a2993f0e29185e19194b6063bbadaafbd044 + storybook: ^8.5.1 + checksum: 10/95cebc656f2817c8fcfadd90ab2d90327473717e263bfa0caa8f43e9f217d466e2cfd7f72e0bf897cb5793e962814aa2c82149df2d86a899815f4e2878b4f526 languageName: node linkType: hard -"@storybook/addon-controls@npm:8.4.2, @storybook/addon-controls@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-controls@npm:8.4.2" +"@storybook/addon-controls@npm:8.5.1, @storybook/addon-controls@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-controls@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" dequal: "npm:^2.0.2" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/ee23a051be689ac6d7b4d4a5e2cc5429dadfe556a4daa9d347f55bef0a6110dce4a5d68f7afe18c04817d4960f048b041eeb6cc9555031f620d78a52a19e4229 + storybook: ^8.5.1 + checksum: 10/bcc06e779d2e19cb4b5e09e0df92c4856afbf31b110931dea2c8bb238786cc4afa04fc1fe3c58f0bf0d278131d002d0ae296ec742a61704fbe84a1581f01148b languageName: node linkType: hard -"@storybook/addon-docs@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-docs@npm:8.4.2" +"@storybook/addon-docs@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-docs@npm:8.5.1" dependencies: "@mdx-js/react": "npm:^3.0.0" - "@storybook/blocks": "npm:8.4.2" - "@storybook/csf-plugin": "npm:8.4.2" - "@storybook/react-dom-shim": "npm:8.4.2" + "@storybook/blocks": "npm:8.5.1" + "@storybook/csf-plugin": "npm:8.5.1" + "@storybook/react-dom-shim": "npm:8.5.1" react: "npm:^16.8.0 || ^17.0.0 || ^18.0.0" react-dom: "npm:^16.8.0 || ^17.0.0 || ^18.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/06510b9894ac6b4d9324dec037e22b1fd882be8962fce4213a10746a2d23660a231373d70aa56f8763a5b65f2eb1a3e7e64f3228a687e36818768665e5f8e01e + storybook: ^8.5.1 + checksum: 10/a6b3115b6477509645ad3774b65223bf0af1f511d99c2e7da65bd17cf81c122bd4b1555a386456c337d7ad3155f7dd02dd3eb8b91637427361e10fa7d6a92612 languageName: node linkType: hard -"@storybook/addon-essentials@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-essentials@npm:8.4.2" - dependencies: - "@storybook/addon-actions": "npm:8.4.2" - "@storybook/addon-backgrounds": "npm:8.4.2" - "@storybook/addon-controls": "npm:8.4.2" - "@storybook/addon-docs": "npm:8.4.2" - "@storybook/addon-highlight": "npm:8.4.2" - "@storybook/addon-measure": "npm:8.4.2" - "@storybook/addon-outline": "npm:8.4.2" - "@storybook/addon-toolbars": "npm:8.4.2" - "@storybook/addon-viewport": "npm:8.4.2" +"@storybook/addon-essentials@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-essentials@npm:8.5.1" + dependencies: + "@storybook/addon-actions": "npm:8.5.1" + "@storybook/addon-backgrounds": "npm:8.5.1" + "@storybook/addon-controls": "npm:8.5.1" + "@storybook/addon-docs": "npm:8.5.1" + "@storybook/addon-highlight": "npm:8.5.1" + "@storybook/addon-measure": "npm:8.5.1" + "@storybook/addon-outline": "npm:8.5.1" + "@storybook/addon-toolbars": "npm:8.5.1" + "@storybook/addon-viewport": "npm:8.5.1" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/951da2192a63d985e9af2e1e803bbe8bd6d64a87f50644034a55eb8bdc2ad0844e87836437d5c494eff3e94c8eae894d5f28bbef4b9cb99ef7e5fad573e1980d + storybook: ^8.5.1 + checksum: 10/ce4595cbc619dbea5f9d2affcfd6d75d29ed8ffdb04953567ebf8adc7133db6e57f369dbf3acca33a34e35de40d833d0c23506ec0347327ae4e890bc7f0d7c3e languageName: node linkType: hard -"@storybook/addon-highlight@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-highlight@npm:8.4.2" +"@storybook/addon-highlight@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-highlight@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/81bdd9d758aa2b2faaa19ae6e27b6367e8522db3e8f6f2c72a452079ab35abf220472ff7ee6f7ed105dcfa7c23a2300df4753f8b5b5850a706a4c60492567735 + storybook: ^8.5.1 + checksum: 10/ac66a892f1e5c23fa049d1e6ca06ce6da89ef2eee669cf78d95ec435622fa5a9e5f62a6e57e2add0f7819ed57939dd19eabf6b59283fea5ebe65f75ad5a15147 languageName: node linkType: hard -"@storybook/addon-interactions@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-interactions@npm:8.4.2" +"@storybook/addon-interactions@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-interactions@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" - "@storybook/instrumenter": "npm:8.4.2" - "@storybook/test": "npm:8.4.2" + "@storybook/instrumenter": "npm:8.5.1" + "@storybook/test": "npm:8.5.1" polished: "npm:^4.2.2" ts-dedent: "npm:^2.2.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/a0ac4c473d5ce8a0cc2c56897faf3845ab3fa51c0d6ff217d009de9850033549ffe9653d7821284c7e1947efb9a38beb34bd4cf4788d009f3edc027a6f5b37eb + storybook: ^8.5.1 + checksum: 10/6f569a5a2ab95f1f7632070b77e25b5641e645b7d95c1126bd100a26b04a3b99696ba052871a4be0aca45fd76712123d956a1221c3d5b1c423b0dfe1d6b20479 languageName: node linkType: hard -"@storybook/addon-links@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-links@npm:8.4.2" +"@storybook/addon-links@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-links@npm:8.5.1" dependencies: - "@storybook/csf": "npm:^0.1.11" + "@storybook/csf": "npm:0.1.12" "@storybook/global": "npm:^5.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.4.2 + storybook: ^8.5.1 peerDependenciesMeta: react: optional: true - checksum: 10/f23a29ffe9c7d8eb16032c4abba6b325dfea010840f9f3aa8cf27ea6699631a64aa065a796bd685bd35c39dcfdee9a3db51a38bc0bed452ce2c5818b523820b5 + checksum: 10/5efcc1c85721f31f0a46526d4c0bfc516eabbeb998bdb27e9cfd80e9ad4927d4a93e375ea3d90b1b934af33b160913b8b1a95f302a1de4c8351bad863515b81a languageName: node linkType: hard -"@storybook/addon-measure@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-measure@npm:8.4.2" +"@storybook/addon-measure@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-measure@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" tiny-invariant: "npm:^1.3.1" peerDependencies: - storybook: ^8.4.2 - checksum: 10/48a2f3eccee2504777ac9c0fe267d3f91785674bb9a106c2610fa57912f65b2c2d32de76d3c62fe88a9d95985099283f0e55ac17b7593dece6ab3fb1657085c1 + storybook: ^8.5.1 + checksum: 10/418427d8cfd9e446f957b61ee884fe96e5638ee434e1ee44d39df8b98d6ac6e8c7fba0260bed50d640bcb6264b85ae58645bb1d071c51a8a0b869e3faa5ca2f3 languageName: node linkType: hard -"@storybook/addon-ondevice-actions@npm:^8.5.2-alpha.0, @storybook/addon-ondevice-actions@workspace:packages/ondevice-actions": +"@storybook/addon-ondevice-actions@npm:^8.5.2-alpha.3, @storybook/addon-ondevice-actions@workspace:packages/ondevice-actions": version: 0.0.0-use.local resolution: "@storybook/addon-ondevice-actions@workspace:packages/ondevice-actions" dependencies: - "@storybook/addon-actions": "npm:^8.4.2" - "@storybook/core": "npm:^8.4.2" + "@storybook/addon-actions": "npm:^8.5.1" + "@storybook/core": "npm:^8.5.1" "@storybook/global": "npm:^5.0.0" fast-deep-equal: "npm:^2.0.1" typescript: "npm:^5.3.3" @@ -5139,12 +5139,12 @@ __metadata: languageName: unknown linkType: soft -"@storybook/addon-ondevice-backgrounds@npm:^8.5.2-alpha.0, @storybook/addon-ondevice-backgrounds@workspace:packages/ondevice-backgrounds": +"@storybook/addon-ondevice-backgrounds@npm:^8.5.2-alpha.3, @storybook/addon-ondevice-backgrounds@workspace:packages/ondevice-backgrounds": version: 0.0.0-use.local resolution: "@storybook/addon-ondevice-backgrounds@workspace:packages/ondevice-backgrounds" dependencies: - "@storybook/core": "npm:^8.4.2" - "@storybook/react-native-theming": "npm:^8.5.2-alpha.0" + "@storybook/core": "npm:^8.5.1" + "@storybook/react-native-theming": "npm:^8.5.2-alpha.3" typescript: "npm:^5.3.3" peerDependencies: react: "*" @@ -5152,14 +5152,14 @@ __metadata: languageName: unknown linkType: soft -"@storybook/addon-ondevice-controls@npm:^8.5.2-alpha.0, @storybook/addon-ondevice-controls@workspace:packages/ondevice-controls": +"@storybook/addon-ondevice-controls@npm:^8.5.2-alpha.3, @storybook/addon-ondevice-controls@workspace:packages/ondevice-controls": version: 0.0.0-use.local resolution: "@storybook/addon-ondevice-controls@workspace:packages/ondevice-controls" dependencies: - "@storybook/addon-controls": "npm:^8.4.2" - "@storybook/core": "npm:^8.4.2" - "@storybook/react-native-theming": "npm:^8.5.2-alpha.0" - "@storybook/react-native-ui": "npm:^8.5.2-alpha.0" + "@storybook/addon-controls": "npm:^8.5.1" + "@storybook/core": "npm:^8.5.1" + "@storybook/react-native-theming": "npm:^8.5.2-alpha.3" + "@storybook/react-native-ui": "npm:^8.5.2-alpha.3" cross-env: "npm:^7.0.3" deep-equal: "npm:^1.0.1" prop-types: "npm:^15.7.2" @@ -5176,12 +5176,12 @@ __metadata: languageName: unknown linkType: soft -"@storybook/addon-ondevice-notes@npm:^8.5.2-alpha.0, @storybook/addon-ondevice-notes@workspace:packages/ondevice-notes": +"@storybook/addon-ondevice-notes@npm:^8.5.2-alpha.3, @storybook/addon-ondevice-notes@workspace:packages/ondevice-notes": version: 0.0.0-use.local resolution: "@storybook/addon-ondevice-notes@workspace:packages/ondevice-notes" dependencies: - "@storybook/core": "npm:^8.4.2" - "@storybook/react-native-theming": "npm:^8.5.2-alpha.0" + "@storybook/core": "npm:^8.5.1" + "@storybook/react-native-theming": "npm:^8.5.2-alpha.3" react-native-markdown-display: "npm:^7.0.2" typescript: "npm:^5.3.3" peerDependencies: @@ -5190,15 +5190,15 @@ __metadata: languageName: unknown linkType: soft -"@storybook/addon-outline@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-outline@npm:8.4.2" +"@storybook/addon-outline@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-outline@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/b43804fbbca21ee8790c82cd32559de551e14bd010507d9c6d8eac2afe0849372a44701d91d2c4baba524bef9519193ee9cf87b1e9cfaa4d868bcce82b7d57b3 + storybook: ^8.5.1 + checksum: 10/39b93776fdcdd7f8540480b5f463029f6705307bcb6b87e1a276d1d95a18ad3db9b521b4123ff03e4671f1257cb472a06f9e5f0bf96c79f7cf1b3058f4484afd languageName: node linkType: hard @@ -5234,23 +5234,23 @@ __metadata: languageName: node linkType: hard -"@storybook/addon-toolbars@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-toolbars@npm:8.4.2" +"@storybook/addon-toolbars@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-toolbars@npm:8.5.1" peerDependencies: - storybook: ^8.4.2 - checksum: 10/294019d0081874ff15fc846768f3743e11278f6a1d211f413bfcdbc5ca9415a80ac478523cae51fcfe1c77277a32bad9745362c8a0a1bd053570e07df615af95 + storybook: ^8.5.1 + checksum: 10/2ce82a9eb8621236f9c82eb8ceba6b9f2a8dcb6225003bb4cb4b22f0bde1c17a357db02a5ba33e101634da104b68b8800ea79215f9f57ec13f05fd8f0454bfc2 languageName: node linkType: hard -"@storybook/addon-viewport@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/addon-viewport@npm:8.4.2" +"@storybook/addon-viewport@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/addon-viewport@npm:8.5.1" dependencies: memoizerific: "npm:^1.11.3" peerDependencies: - storybook: ^8.4.2 - checksum: 10/7d2c0fa6ed73030cf718a306dd0c327006f54747801e13a7037416ca746ff92f3d341820744de08e651ed746e0f5bb50104a2c57b17b6f4de3ef0f8987861020 + storybook: ^8.5.1 + checksum: 10/8d1e5b1d81fde18630b951f35234fd90d2684133ea32b472af2641513f70f4fd5e9c92c5febe2f5dd769cff301373c5c577e557fb1bb8ea0af6a751195669230 languageName: node linkType: hard @@ -5264,32 +5264,31 @@ __metadata: languageName: node linkType: hard -"@storybook/blocks@npm:8.4.2, @storybook/blocks@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/blocks@npm:8.4.2" +"@storybook/blocks@npm:8.5.1, @storybook/blocks@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/blocks@npm:8.5.1" dependencies: - "@storybook/csf": "npm:^0.1.11" + "@storybook/csf": "npm:0.1.12" "@storybook/icons": "npm:^1.2.12" ts-dedent: "npm:^2.0.0" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.4.2 + storybook: ^8.5.1 peerDependenciesMeta: react: optional: true react-dom: optional: true - checksum: 10/88880e7c13752fe1323cd8eeb93005ab4493c4f024ef3119462dc160e57a985979756a64e0d6e9f374c0f510adcd0e7141d5b7f52bbe255e1c3fbf4ce0cbb896 + checksum: 10/1896bd2539233316c68a0902e86c4b394e7c587c13e5c752398620c93ce80022ff9c1bbd40e2868f0580e6baab1cbd57152a1e312ebb4c7fc3e812226856332b languageName: node linkType: hard -"@storybook/builder-webpack5@npm:8.4.2, @storybook/builder-webpack5@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/builder-webpack5@npm:8.4.2" +"@storybook/builder-webpack5@npm:8.5.1, @storybook/builder-webpack5@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/builder-webpack5@npm:8.5.1" dependencies: - "@storybook/core-webpack": "npm:8.4.2" - "@types/node": "npm:^22.0.0" + "@storybook/core-webpack": "npm:8.5.1" "@types/semver": "npm:^7.3.4" browser-assert: "npm:^1.2.1" case-sensitive-paths-webpack-plugin: "npm:^2.4.0" @@ -5314,40 +5313,39 @@ __metadata: webpack-hot-middleware: "npm:^2.25.1" webpack-virtual-modules: "npm:^0.6.0" peerDependencies: - storybook: ^8.4.2 + storybook: ^8.5.1 peerDependenciesMeta: typescript: optional: true - checksum: 10/d67458e1337c8e403f6b4914d5f00d99d3dbd0ec2d1e3bdd7f2eb7a9f0c5acc4d78db45e30c6be1fea48b502d37bda46be41508ed258152f97e7008249c95aed + checksum: 10/51c57e80ff631ad43dde46c591a0149c67756b6c79dba5548cabdd5c4fb81979a9f2344aa5b0b7e030154bce952373046f22b24a1dd0267c1b0b713317dc0568 languageName: node linkType: hard -"@storybook/components@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/components@npm:8.4.2" +"@storybook/components@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/components@npm:8.5.1" peerDependencies: storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 - checksum: 10/52c7885763f3154215b8f9fda57fe4af62e5194722bca90f35769a74aee411bf552d96455d1c2101404e30b2b0a4ed2c57c21a365ecbf18124a252538e15e83e + checksum: 10/391de76e2f2370068209d76517923527d2fafa348dd4b7b865f2dee44ac219c1495e1b0a64bbc426addb9cc9950bc645ebaf7166edef14d0cb7e91a8c45bcd77 languageName: node linkType: hard -"@storybook/core-webpack@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/core-webpack@npm:8.4.2" +"@storybook/core-webpack@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/core-webpack@npm:8.5.1" dependencies: - "@types/node": "npm:^22.0.0" ts-dedent: "npm:^2.0.0" peerDependencies: - storybook: ^8.4.2 - checksum: 10/8e6d75e70720743bd299855277cbd5a7bb00c286e715050fa8c1c7369d2e4fce7b69cee1a2cd56475760ad3ea3931e4a76c4eb61d8d70a447310414057a6bfb9 + storybook: ^8.5.1 + checksum: 10/b56ef3acd963cbe29c0a4be362f444e3ce4041b02b0fd6d1904c42387b7ebb6d39cbb6905c7139ee7b7efb41a81cfbffe6ebbcc44b4eba6866ac8639405c2e08 languageName: node linkType: hard -"@storybook/core@npm:8.4.2, @storybook/core@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/core@npm:8.4.2" +"@storybook/core@npm:8.5.1, @storybook/core@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/core@npm:8.5.1" dependencies: - "@storybook/csf": "npm:^0.1.11" + "@storybook/csf": "npm:0.1.12" better-opn: "npm:^3.0.2" browser-assert: "npm:^1.2.1" esbuild: "npm:^0.18.0 || ^0.19.0 || ^0.20.0 || ^0.21.0 || ^0.22.0 || ^0.23.0 || ^0.24.0" @@ -5363,27 +5361,36 @@ __metadata: peerDependenciesMeta: prettier: optional: true - checksum: 10/f7e1b1b50fbe038c5553695086775eca34de4ebee3dabc28b9163f37e348565a50a937231d0eed45291f9d52478c63bdf2065a99ad4826816fcd81e1652c3382 + checksum: 10/b476b36cc2fd403b555c8e3145a0443465479f42dcdc9ed4b42723cd0a6fc7a2dd13579580c9f644d19ebac26f4bdb1b323f700cbc0a3ecd6517e0ecb038051f languageName: node linkType: hard -"@storybook/csf-plugin@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/csf-plugin@npm:8.4.2" +"@storybook/csf-plugin@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/csf-plugin@npm:8.5.1" dependencies: unplugin: "npm:^1.3.1" peerDependencies: - storybook: ^8.4.2 - checksum: 10/ec787be0a4fe2928a2675fe6bca5799f0bff8c66e50cea7bed198a188b19ee57257266b0255c5226a7da97928758b86c978afecc3ee0e2bb1f21fe0e7fdaf0c5 + storybook: ^8.5.1 + checksum: 10/c945adf742a143c3ea139ef0ed48b636bbfae3a22ebb8b2c2d56be15b57947da4b515d102f2b50c7faeeb587556de0d2e66da4f2123d237a6567e99be824899c languageName: node linkType: hard -"@storybook/csf@npm:^0.1.1, @storybook/csf@npm:^0.1.11": - version: 0.1.11 - resolution: "@storybook/csf@npm:0.1.11" +"@storybook/csf@npm:0.1.12": + version: 0.1.12 + resolution: "@storybook/csf@npm:0.1.12" dependencies: type-fest: "npm:^2.19.0" - checksum: 10/f6eeefe3b92ab206676587da9e22a775da026c055999681580d2ca23c98185736f965adc79039a0ae97ea625f0fbc7915cd4559e5db24229a4805784d0b78584 + checksum: 10/f661709de5bd68bfd4ced67df31ef26341168d6679bc13564cb024cfdbc8fdfa94d384267c20b3c858a3058b1ee8dbd71cea169245fcf7b28298890d6c3e1da4 + languageName: node + linkType: hard + +"@storybook/csf@npm:^0.1.13": + version: 0.1.13 + resolution: "@storybook/csf@npm:0.1.13" + dependencies: + type-fest: "npm:^2.19.0" + checksum: 10/8a590703c44180798869fd12c1f314cb96de18349415a33bcfe30ef6af11fdc1cdb755ea620dedfd5eb7666cf05af5647b77fe28b63000aa52b53b0dc3c77bb5 languageName: node linkType: hard @@ -5404,35 +5411,34 @@ __metadata: languageName: node linkType: hard -"@storybook/instrumenter@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/instrumenter@npm:8.4.2" +"@storybook/instrumenter@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/instrumenter@npm:8.5.1" dependencies: "@storybook/global": "npm:^5.0.0" "@vitest/utils": "npm:^2.1.1" peerDependencies: - storybook: ^8.4.2 - checksum: 10/b6d48ffe6a1ad1fca0d296438e2114df6631667ccda803595d54c71732d0bb7dad086d5465254ba914f4666363018bf1df48cdc8304ad6b6c7a24b87164f7d95 + storybook: ^8.5.1 + checksum: 10/5e49c78cc58902bca539cebff38a03186b62ae640864953c5485a0ff62404a503ecd2810ff12e7c39af526e15bdd49fad2db5c0bceab8f845d426335d68f5899 languageName: node linkType: hard -"@storybook/manager-api@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/manager-api@npm:8.4.2" +"@storybook/manager-api@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/manager-api@npm:8.5.1" peerDependencies: storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 - checksum: 10/61b8f845f3271c2dd84597a94c2905a785949a2467582663165e476f455f1942b9c3be77a08f5101848d8a75ca23aa9f7db620d81f202d19093af7695d6ca8a0 + checksum: 10/487e3147dff1ea9129968596f101e776014357db08ce826b53ae4f1032b6d3934bd65ed05addb0b71eea1308bfb08017452d1a7d7b70cd7f0bdefd5abb9218e1 languageName: node linkType: hard -"@storybook/preset-react-webpack@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/preset-react-webpack@npm:8.4.2" +"@storybook/preset-react-webpack@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/preset-react-webpack@npm:8.5.1" dependencies: - "@storybook/core-webpack": "npm:8.4.2" - "@storybook/react": "npm:8.4.2" + "@storybook/core-webpack": "npm:8.5.1" + "@storybook/react": "npm:8.5.1" "@storybook/react-docgen-typescript-plugin": "npm:1.0.6--canary.9.0c3f3b7.0" - "@types/node": "npm:^22.0.0" "@types/semver": "npm:^7.3.4" find-up: "npm:^5.0.0" magic-string: "npm:^0.30.5" @@ -5444,20 +5450,20 @@ __metadata: peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.4.2 + storybook: ^8.5.1 peerDependenciesMeta: typescript: optional: true - checksum: 10/5c08b8c8d59262fa390ad35214179f17b3ddddd7b0956efd0d73542b6c82771b8e6814ab45c57b7099bd4026b49594106222cd620b34a2871427d59050a13e0b + checksum: 10/8317edd0551a5f9a7ff3bb767e38b04d8c1ca1a76a8d535544cc23d2ebfe6dadcdb8568c2146f875b28f6f54c5d8abfe0db0a9e61851c55c5ebc44d6b36d39f7 languageName: node linkType: hard -"@storybook/preview-api@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/preview-api@npm:8.4.2" +"@storybook/preview-api@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/preview-api@npm:8.5.1" peerDependencies: storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 - checksum: 10/5e57c276bc30afd106dbe89b88dd8b4265d538bc4c55d011b6277d24d0210a7b1b9921f7f2403f06ad824fc50b5846d9037803c613a6f437239a667a52841eea + checksum: 10/e8887c8ca268f6c235558895d4a264d3d1a5f50fd05b33d4f7d2f184ad7c108ee515b83c53c4607f55197c6cd61444533413d5612b234d62643c2c0e6fce7ad9 languageName: node linkType: hard @@ -5479,18 +5485,18 @@ __metadata: languageName: node linkType: hard -"@storybook/react-dom-shim@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/react-dom-shim@npm:8.4.2" +"@storybook/react-dom-shim@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/react-dom-shim@npm:8.5.1" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.4.2 - checksum: 10/76c058e1a2397dfc4fcd5a5fe74bc3e389754b1d7149c0ecc53afb5f706926d1ca2a76e7da04990cd500b378e3e09ffaead827808c12d1da73ea73a1973b630f + storybook: ^8.5.1 + checksum: 10/edbd47200265c905e850c0978f42c3475d87e3984ca88e85cfac536803b81879762f5cdcf9a1a97e3c3f54b4870147a028edee4f5cedac9deb1a284c1b29291d languageName: node linkType: hard -"@storybook/react-native-theming@npm:^8.5.2-alpha.0, @storybook/react-native-theming@workspace:packages/react-native-theming": +"@storybook/react-native-theming@npm:^8.5.2-alpha.3, @storybook/react-native-theming@workspace:packages/react-native-theming": version: 0.0.0-use.local resolution: "@storybook/react-native-theming@workspace:packages/react-native-theming" dependencies: @@ -5504,13 +5510,13 @@ __metadata: languageName: unknown linkType: soft -"@storybook/react-native-ui@npm:^8.5.2-alpha.0, @storybook/react-native-ui@workspace:packages/react-native-ui": +"@storybook/react-native-ui@npm:^8.5.2-alpha.3, @storybook/react-native-ui@workspace:packages/react-native-ui": version: 0.0.0-use.local resolution: "@storybook/react-native-ui@workspace:packages/react-native-ui" dependencies: - "@storybook/core": "npm:^8.4.2" - "@storybook/react": "npm:^8.4.2" - "@storybook/react-native-theming": "npm:^8.5.2-alpha.0" + "@storybook/core": "npm:^8.5.1" + "@storybook/react": "npm:^8.5.1" + "@storybook/react-native-theming": "npm:^8.5.2-alpha.3" "@types/jest": "npm:^29.4.3" "@types/react": "npm:~18.3.12" babel-jest: "npm:^29.7.0" @@ -5534,16 +5540,16 @@ __metadata: languageName: unknown linkType: soft -"@storybook/react-native@npm:^8.5.2-alpha.0, @storybook/react-native@workspace:packages/react-native": +"@storybook/react-native@npm:^8.5.2-alpha.3, @storybook/react-native@workspace:packages/react-native": version: 0.0.0-use.local resolution: "@storybook/react-native@workspace:packages/react-native" dependencies: - "@storybook/core": "npm:^8.4.2" - "@storybook/csf": "npm:^0.1.1" + "@storybook/core": "npm:^8.5.1" + "@storybook/csf": "npm:^0.1.13" "@storybook/global": "npm:^5.0.0" - "@storybook/react": "npm:^8.4.2" - "@storybook/react-native-theming": "npm:^8.5.2-alpha.0" - "@storybook/react-native-ui": "npm:^8.5.2-alpha.0" + "@storybook/react": "npm:^8.5.1" + "@storybook/react-native-theming": "npm:^8.5.2-alpha.3" + "@storybook/react-native-ui": "npm:^8.5.2-alpha.3" "@types/jest": "npm:^29.4.3" "@types/react": "npm:~18.3.12" babel-jest: "npm:^29.7.0" @@ -5562,7 +5568,7 @@ __metadata: react-native-url-polyfill: "npm:^2.0.0" react-test-renderer: "npm:^18.3.1" setimmediate: "npm:^1.0.5" - storybook: "npm:^8.4.2" + storybook: "npm:^8.5.1" tsup: "npm:^7.2.0" type-fest: "npm:~2.19" typescript: "npm:^5.3.3" @@ -5579,48 +5585,47 @@ __metadata: languageName: unknown linkType: soft -"@storybook/react-webpack5@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/react-webpack5@npm:8.4.2" +"@storybook/react-webpack5@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/react-webpack5@npm:8.5.1" dependencies: - "@storybook/builder-webpack5": "npm:8.4.2" - "@storybook/preset-react-webpack": "npm:8.4.2" - "@storybook/react": "npm:8.4.2" - "@types/node": "npm:^22.0.0" + "@storybook/builder-webpack5": "npm:8.5.1" + "@storybook/preset-react-webpack": "npm:8.5.1" + "@storybook/react": "npm:8.5.1" peerDependencies: react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.4.2 + storybook: ^8.5.1 typescript: ">= 4.2.x" peerDependenciesMeta: typescript: optional: true - checksum: 10/a4f98edcc918e1f0e0f03baf3846fe6f8dcb744873218a9f4ed9c0f4fb813e659b1782060f823c12da4ab66ff7b717be5f51d056650d144d243532f849a7742a + checksum: 10/630ff70defb53d872c18784509f0876ab6ee2c7b168fecc0e89ab67e459aefb2de5528eb11180612c2368e1cd65bc41a3611b18fe19000ac8d62a8958e130a9a languageName: node linkType: hard -"@storybook/react@npm:8.4.2, @storybook/react@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/react@npm:8.4.2" +"@storybook/react@npm:8.5.1, @storybook/react@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/react@npm:8.5.1" dependencies: - "@storybook/components": "npm:8.4.2" + "@storybook/components": "npm:8.5.1" "@storybook/global": "npm:^5.0.0" - "@storybook/manager-api": "npm:8.4.2" - "@storybook/preview-api": "npm:8.4.2" - "@storybook/react-dom-shim": "npm:8.4.2" - "@storybook/theming": "npm:8.4.2" + "@storybook/manager-api": "npm:8.5.1" + "@storybook/preview-api": "npm:8.5.1" + "@storybook/react-dom-shim": "npm:8.5.1" + "@storybook/theming": "npm:8.5.1" peerDependencies: - "@storybook/test": 8.4.2 + "@storybook/test": 8.5.1 react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0-beta - storybook: ^8.4.2 + storybook: ^8.5.1 typescript: ">= 4.2.x" peerDependenciesMeta: "@storybook/test": optional: true typescript: optional: true - checksum: 10/df7dd512d2e4604b7af859f594c058be959495dc0c25467f571f1e6b4e5058c2ee0d3caaed47742e3a602eef871143b1d48aa164646d61923885ebc7eec87b56 + checksum: 10/cb761e2dd039e7fa31ff3da2d4f5ee76590890e1af09eb15213531d5fa5a5c02937c2a03bbaa1fdb78e1207f19b8d4eee75017efea59f5a43b9c4f4a406c594b languageName: node linkType: hard @@ -5637,30 +5642,30 @@ __metadata: languageName: unknown linkType: soft -"@storybook/test@npm:8.4.2, @storybook/test@npm:^8.4.2": - version: 8.4.2 - resolution: "@storybook/test@npm:8.4.2" +"@storybook/test@npm:8.5.1, @storybook/test@npm:^8.5.1": + version: 8.5.1 + resolution: "@storybook/test@npm:8.5.1" dependencies: - "@storybook/csf": "npm:^0.1.11" + "@storybook/csf": "npm:0.1.12" "@storybook/global": "npm:^5.0.0" - "@storybook/instrumenter": "npm:8.4.2" + "@storybook/instrumenter": "npm:8.5.1" "@testing-library/dom": "npm:10.4.0" "@testing-library/jest-dom": "npm:6.5.0" "@testing-library/user-event": "npm:14.5.2" "@vitest/expect": "npm:2.0.5" "@vitest/spy": "npm:2.0.5" peerDependencies: - storybook: ^8.4.2 - checksum: 10/934518e629d2798df10bb892184e18dca0f3ea7b426636cef3f29a12302a3c471b59d808024ea90c58b9e183ce1b3477a0c8827824f7e74111ceaf4518f0212e + storybook: ^8.5.1 + checksum: 10/7ccb740bbaba47028863f723aa2a9ebae7c7a34ffcf5ea664be085682e81e1349c19464dc7cd5cd79a5836415b12343ce1aa4fd1682b7483463872c1964e80b7 languageName: node linkType: hard -"@storybook/theming@npm:8.4.2": - version: 8.4.2 - resolution: "@storybook/theming@npm:8.4.2" +"@storybook/theming@npm:8.5.1": + version: 8.5.1 + resolution: "@storybook/theming@npm:8.5.1" peerDependencies: storybook: ^8.2.0 || ^8.3.0-0 || ^8.4.0-0 || ^8.5.0-0 || ^8.6.0-0 - checksum: 10/8d0a6d20d3589815dea0bcdae9255216b8fc5459225871881a52e0fbc94a136a9972bef02c2ec6167ffd8eea24afab68962e01e83a8d4f60d12b4b787b9b23f3 + checksum: 10/ca26f4c9e64448b6d9383d13f32bd4bb98399187f0d68cc399882e3e3e85eb0ef01fd485b011f7bc6daeb1520107775aa09221572f8aabf4f20df508c98fbc70 languageName: node linkType: hard @@ -5924,7 +5929,7 @@ __metadata: languageName: node linkType: hard -"@types/node@npm:*, @types/node@npm:^22.0.0": +"@types/node@npm:*": version: 22.7.4 resolution: "@types/node@npm:22.7.4" dependencies: @@ -9972,24 +9977,24 @@ __metadata: "@react-native-community/datetimepicker": "npm:8.2.0" "@react-native-community/slider": "npm:4.5.5" "@react-native/babel-preset": "npm:^0.74.0" - "@storybook/addon-essentials": "npm:^8.4.2" - "@storybook/addon-interactions": "npm:^8.4.2" - "@storybook/addon-links": "npm:^8.4.2" - "@storybook/addon-ondevice-actions": "npm:^8.5.2-alpha.0" - "@storybook/addon-ondevice-backgrounds": "npm:^8.5.2-alpha.0" - "@storybook/addon-ondevice-controls": "npm:^8.5.2-alpha.0" - "@storybook/addon-ondevice-notes": "npm:^8.5.2-alpha.0" + "@storybook/addon-essentials": "npm:^8.5.1" + "@storybook/addon-interactions": "npm:^8.5.1" + "@storybook/addon-links": "npm:^8.5.1" + "@storybook/addon-ondevice-actions": "npm:^8.5.2-alpha.3" + "@storybook/addon-ondevice-backgrounds": "npm:^8.5.2-alpha.3" + "@storybook/addon-ondevice-controls": "npm:^8.5.2-alpha.3" + "@storybook/addon-ondevice-notes": "npm:^8.5.2-alpha.3" "@storybook/addon-react-native-server": "npm:0.0.6" "@storybook/addon-react-native-web": "npm:^0.0.26" "@storybook/addon-webpack5-compiler-babel": "npm:^3.0.3" - "@storybook/blocks": "npm:^8.4.2" - "@storybook/builder-webpack5": "npm:^8.4.2" + "@storybook/blocks": "npm:^8.5.1" + "@storybook/builder-webpack5": "npm:^8.5.1" "@storybook/global": "npm:^5.0.0" - "@storybook/react": "npm:^8.4.2" - "@storybook/react-native": "npm:^8.5.2-alpha.0" - "@storybook/react-native-theming": "npm:^8.5.2-alpha.0" - "@storybook/react-webpack5": "npm:^8.4.2" - "@storybook/test": "npm:^8.4.2" + "@storybook/react": "npm:^8.5.1" + "@storybook/react-native": "npm:^8.5.2-alpha.3" + "@storybook/react-native-theming": "npm:^8.5.2-alpha.3" + "@storybook/react-webpack5": "npm:^8.5.1" + "@storybook/test": "npm:^8.5.1" "@testing-library/react-native": "npm:12.4.3" "@types/react": "npm:~18.3.12" "@types/react-test-renderer": "npm:^18.3.0" @@ -10011,7 +10016,7 @@ __metadata: react-native-svg: "npm:15.8.0" react-native-web: "npm:~0.19.13" react-router: "npm:^6.26.2" - storybook: "npm:^8.4.2" + storybook: "npm:^8.5.1" storybook-addon-deep-controls: "npm:^0.9.2" typescript: "npm:^5.3.3" ws: "npm:^8.18.0" @@ -17575,11 +17580,11 @@ __metadata: languageName: node linkType: hard -"storybook@npm:^8.4.2": - version: 8.4.2 - resolution: "storybook@npm:8.4.2" +"storybook@npm:^8.5.1": + version: 8.5.1 + resolution: "storybook@npm:8.5.1" dependencies: - "@storybook/core": "npm:8.4.2" + "@storybook/core": "npm:8.5.1" peerDependencies: prettier: ^2 || ^3 peerDependenciesMeta: @@ -17589,7 +17594,7 @@ __metadata: getstorybook: ./bin/index.cjs sb: ./bin/index.cjs storybook: ./bin/index.cjs - checksum: 10/e3f1e32371a6f70639fa4fbc24e703aeb99bdb417b7c4acca6d331bf777b7c9343195175c6c088e162b8feb50f267ea70db9dd23f3ab07f110e1a76e3c7618ca + checksum: 10/2788ccb4ac383a3489c062b1afcd9831237773dcf936a6d009bfa50cec56b52298d6e4727d11714158df1f52bc7525ee30a7dd648a24d23423564ab5a2ac83b4 languageName: node linkType: hard