chore: check against v8.2

MIGRATION.md

@@ -204,14 +204,14 @@ You can now also update main.js to main.ts and use the StorybookConfig type. Thi
 import type { StorybookConfig } from '@storybook/react-native';
 
 const main: StorybookConfig = {
-	stories: ['../components/**/*.stories.?(ts|tsx|js|jsx)'],
-	addons: [
+  stories: ['../components/**/*.stories.?(ts|tsx|js|jsx)'],
+  addons: [
     '@storybook/addon-ondevice-notes',
     '@storybook/addon-ondevice-controls',
     '@storybook/addon-ondevice-backgrounds',
     '@storybook/addon-ondevice-actions',
   ],
-}
+};
 
 export default main;
 ```
@@ -237,7 +237,7 @@ To make it work you still need babel-plugin-react-docgen-typescript though.
 ```diff
 -import { extractArgTypes } from "@storybook/react/dist/modern/client/docs/extractArgTypes";
 -import { addArgTypesEnhancer, addParameters } from "@storybook/react-native";
--import { enhanceArgTypes } from "@storybook/docs-tools";
+-import { enhanceArgTypes } from "@storybook/core/docs-tools";
 
 -addArgTypesEnhancer(enhanceArgTypes);
 -addParameters({
@@ -445,7 +445,7 @@ If you're using typescript you may notice that for v7 we've removed the types in
 To make storybook more compatible with core storybook libraries we are using some new dependencies. You will need to add these to your project.
 
 ```sh
-yarn add -D @storybook/react-native @storybook/core-common @react-native-async-storage/async-storage react-native-safe-area-context react-dom
+yarn add -D @storybook/react-native @storybook/core/core-common @react-native-async-storage/async-storage react-native-safe-area-context react-dom
 ```
 
 #### Controls (the new knobs)

examples/expo-example/package.json

@@ -24,25 +24,23 @@
     "@react-native-async-storage/async-storage": "1.23.1",
     "@react-native-community/datetimepicker": "8.0.1",
     "@react-native-community/slider": "4.5.2",
-    "@storybook/addon-essentials": "^8",
-    "@storybook/addon-interactions": "^8",
-    "@storybook/addon-links": "^8",
+    "@storybook/addon-essentials": "0.0.0-pr-28310-sha-4e2aa1c7",
+    "@storybook/addon-interactions": "0.0.0-pr-28310-sha-4e2aa1c7",
+    "@storybook/addon-links": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/addon-ondevice-actions": "^8.0.0-alpha.4",
     "@storybook/addon-ondevice-backgrounds": "^8.0.0-alpha.4",
     "@storybook/addon-ondevice-controls": "^8.0.0-alpha.4",
     "@storybook/addon-ondevice-notes": "^8.0.0-alpha.4",
     "@storybook/addon-react-native-server": "^0.0.5",
     "@storybook/addon-react-native-web": "^0.0.22",
-    "@storybook/blocks": "^8",
-    "@storybook/builder-webpack5": "^8",
-    "@storybook/core-common": "^8",
-    "@storybook/docs-tools": "^8",
+    "@storybook/blocks": "0.0.0-pr-28310-sha-4e2aa1c7",
+    "@storybook/builder-webpack5": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/global": "^5.0.0",
-    "@storybook/react": "^8",
+    "@storybook/react": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/react-native": "^8.0.0-alpha.4",
     "@storybook/react-native-theming": "^8.0.0-alpha.4",
-    "@storybook/react-webpack5": "^8",
-    "@storybook/test": "^8",
+    "@storybook/react-webpack5": "0.0.0-pr-28310-sha-4e2aa1c7",
+    "@storybook/test": "0.0.0-pr-28310-sha-4e2aa1c7",
     "expo": "^51.0.14",
     "querystring": "^0.2.1",
     "react": "18.2.0",
@@ -53,7 +51,7 @@
     "react-native-safe-area-context": "4.10.1",
     "react-native-svg": "15.2.0",
     "react-native-web": "~0.19.10",
-    "storybook": "^8",
+    "storybook": "0.0.0-pr-28310-sha-4e2aa1c7",
     "ws": "^8.16.0"
   },
   "devDependencies": {

packages/ondevice-actions/package.json

@@ -27,10 +27,9 @@
     "prepare": "tsc"
   },
   "dependencies": {
-    "@storybook/addon-actions": "^8",
-    "@storybook/core-events": "^8",
+    "@storybook/addon-actions": "0.0.0-pr-28310-sha-4e2aa1c7",
+    "@storybook/core": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/global": "^5.0.0",
-    "@storybook/manager-api": "^8",
     "fast-deep-equal": "^2.0.1"
   },
   "devDependencies": {

packages/ondevice-actions/src/containers/ActionLogger/index.tsx

@@ -1,7 +1,7 @@
 import React, { useState, useEffect } from 'react';
 import deepEqual from 'fast-deep-equal';
-import { addons } from '@storybook/manager-api';
-import { SET_CURRENT_STORY } from '@storybook/core-events';
+import { addons } from '@storybook/core/manager-api';
+import { SET_CURRENT_STORY } from '@storybook/core/core-events';
 import { ActionDisplay, EVENT_ID } from '@storybook/addon-actions';
 import { ActionLogger as ActionLoggerComponent } from '../../components/ActionLogger';
 

packages/ondevice-actions/src/index.tsx

@@ -1,5 +1,5 @@
 import { ADDON_ID, PANEL_ID, PARAM_KEY } from '@storybook/addon-actions';
-import { addons, types } from '@storybook/manager-api';
+import { addons, types } from '@storybook/core/manager-api';
 import ActionLogger from './containers/ActionLogger';
 
 export function register() {

packages/ondevice-backgrounds/package.json

@@ -32,8 +32,7 @@
     "dev": "tsc --watch"
   },
   "dependencies": {
-    "@storybook/manager-api": "^8",
-    "@storybook/preview-api": "^8",
+    "@storybook/core": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/react-native-theming": "^8.0.0-alpha.4"
   },
   "devDependencies": {

packages/ondevice-backgrounds/src/BackgroundPanel.tsx

@@ -1,4 +1,4 @@
-import { AddonStore, type API } from '@storybook/manager-api';
+import { AddonStore, type API } from '@storybook/core/manager-api';
 import { StyleSheet, Text, View } from 'react-native';
 
 import Swatch from './Swatch';

packages/ondevice-backgrounds/src/index.tsx

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import { makeDecorator } from '@storybook/preview-api';
-import { addons } from '@storybook/manager-api';
+import { makeDecorator } from '@storybook/core/preview-api';
+import { addons } from '@storybook/core/manager-api';
 
 import Events from './constants';
 import Container from './container';

packages/ondevice-backgrounds/src/register.tsx

@@ -1,4 +1,4 @@
-import { addons, types } from '@storybook/manager-api';
+import { addons, types } from '@storybook/core/manager-api';
 
 import BackgroundPanel from './BackgroundPanel';
 import { ADDON_ID, PANEL_ID, PARAM_KEY } from './constants';

packages/ondevice-controls/package.json

@@ -30,11 +30,8 @@
     "copyimages": "cross-env-shell cp -r src/components/color-picker/resources dist/components/color-picker/resources"
   },
   "dependencies": {
-    "@storybook/addon-controls": "^8",
-    "@storybook/channels": "^8",
-    "@storybook/client-logger": "^8",
-    "@storybook/core-events": "^8",
-    "@storybook/manager-api": "^8",
+    "@storybook/addon-controls": "0.0.0-pr-28310-sha-4e2aa1c7",
+    "@storybook/core": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/react-native-theming": "^8.0.0-alpha.4",
     "deep-equal": "^1.0.1",
     "prop-types": "^15.7.2",

packages/ondevice-controls/src/ControlsPanel.tsx

@@ -1,8 +1,8 @@
-import type { API } from '@storybook/manager-api';
-import { Channel } from '@storybook/channels';
+import type { API } from '@storybook/core/manager-api';
+import { Channel } from '@storybook/core/channels';
 import type { Args, StoryContextForLoaders } from '@storybook/csf';
 import { styled } from '@storybook/react-native-theming';
-import type { Renderer } from '@storybook/types';
+import type { Renderer } from '@storybook/core/types';
 import React, { ComponentType, ReactElement, useCallback, useState } from 'react';
 import NoControlsWarning from './NoControlsWarning';
 import PropForm from './PropForm';

packages/ondevice-controls/src/hooks.ts

@@ -1,6 +1,6 @@
-import { Args, StoryContext } from '@storybook/types';
+import { Args, StoryContext } from '@storybook/core/types';
 import { useState, useEffect, useCallback } from 'react';
-import Events from '@storybook/core-events';
+import Events from '@storybook/core/core-events';
 
 export const useArgs = (
   storyId: string,

packages/ondevice-controls/src/index.tsx

@@ -1,4 +1,4 @@
-import { addons, types } from '@storybook/manager-api';
+import { addons, types } from '@storybook/core/manager-api';
 
 import ControlsPanel from './ControlsPanel';
 import { AddonPanel } from './Panel';

packages/ondevice-notes/package.json

@@ -29,9 +29,7 @@
     "dev": "tsc --watch"
   },
   "dependencies": {
-    "@storybook/client-logger": "^8",
-    "@storybook/core-events": "^8",
-    "@storybook/manager-api": "^8",
+    "@storybook/core": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/react-native-theming": "^8.0.0-alpha.4",
     "react-native-markdown-display": "^7.0.2"
   },

packages/ondevice-notes/src/components/Notes.tsx

@@ -1,11 +1,11 @@
-import { SET_CURRENT_STORY } from '@storybook/core-events';
+import { SET_CURRENT_STORY } from '@storybook/core/core-events';
 import { useEffect, useState } from 'react';
 import { StyleSheet, View } from 'react-native';
 import Markdown from 'react-native-markdown-display';
 
 import { RNAddonApi, StoryFromId } from '../register';
 import { ErrorBoundary } from '../ErrorBoundary';
-import { addons } from '@storybook/manager-api';
+import { addons } from '@storybook/core/manager-api';
 
 export const PARAM_KEY = 'notes';
 

packages/ondevice-notes/src/index.ts

@@ -1,4 +1,4 @@
-import { logger } from '@storybook/client-logger';
+import { logger } from '@storybook/core/client-logger';
 
 if (__DEV__) {
   logger.log("import '@storybook/addon-ondevice-notes/register' to register the notes addon");

packages/ondevice-notes/src/register.tsx

@@ -1,10 +1,10 @@
-import { API, addons, types } from '@storybook/manager-api';
+import { API, addons, types } from '@storybook/core/manager-api';
 import { Notes } from './components/Notes';
 import { ComponentType, ReactElement } from 'react';
 import type { Args, StoryContextForLoaders } from '@storybook/csf';
-import type { Renderer } from '@storybook/types';
+import type { Renderer } from '@storybook/core/types';
 export const PARAM_KEY = 'notes';
-import type { Channel } from '@storybook/channels';
+import type { Channel } from '@storybook/core/channels';
 
 export interface Selection {
   storyId: string;

packages/react-native-ui/package.json

@@ -48,8 +48,7 @@
     "preset": "react-native"
   },
   "devDependencies": {
-    "@storybook/react": "^8",
-    "@storybook/types": "^8",
+    "@storybook/react": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@types/jest": "^29.4.3",
     "@types/react": "~18.2.79",
     "babel-jest": "^29.4.3",
@@ -59,8 +58,7 @@
     "typescript": "^5.3.3"
   },
   "dependencies": {
-    "@storybook/core-events": "^8",
-    "@storybook/manager-api": "^8",
+    "@storybook/core": "0.0.0-pr-28310-sha-4e2aa1c7",
     "@storybook/react-native-theming": "^8.0.0-alpha.4",
     "fuse.js": "^7.0.0",
     "memoizerific": "^1.11.3",

packages/react-native-ui/src/Layout.tsx

@@ -1,7 +1,7 @@
-import { SET_CURRENT_STORY } from '@storybook/core-events';
-import { addons } from '@storybook/manager-api';
+import { SET_CURRENT_STORY } from '@storybook/core/core-events';
+import { addons } from '@storybook/core/manager-api';
 import { styled, useTheme } from '@storybook/react-native-theming';
-import { type API_IndexHash, type Args, type StoryContext } from '@storybook/types';
+import { type API_IndexHash, type Args, type StoryContext } from '@storybook/core/types';
 import { ReactNode, useRef, useState } from 'react';
 import { Platform, Text, View } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';

packages/react-native-ui/src/MobileAddonsPanel.tsx

@@ -1,7 +1,7 @@
 import { BottomSheetModal } from '@gorhom/bottom-sheet';
-import { addons } from '@storybook/manager-api';
+import { addons } from '@storybook/core/manager-api';
 import { styled } from '@storybook/react-native-theming';
-import { Addon_TypesEnum } from '@storybook/types';
+import { Addon_TypesEnum } from '@storybook/core/types';
 import { forwardRef, useImperativeHandle, useRef, useState } from 'react';
 import { Text, View, useWindowDimensions } from 'react-native';
 import { ScrollView } from 'react-native-gesture-handler';

packages/react-native-ui/src/Refs.tsx

@@ -1,6 +1,6 @@
 import type { FC } from 'react';
 import React, { useMemo, useCallback, useEffect, useState } from 'react';
-import type { State } from '@storybook/manager-api';
+import type { State } from '@storybook/core/manager-api';
 import { styled } from '@storybook/react-native-theming';
 import { Tree } from './Tree';
 import type { RefType } from './types';

packages/react-native-ui/src/Sidebar.stories.tsx

@@ -1,8 +1,8 @@
 import React from 'react';
-import type { IndexHash, State } from '@storybook/manager-api';
-import { types } from '@storybook/manager-api';
+import type { IndexHash, State } from '@storybook/core/manager-api';
+import { types } from '@storybook/core/manager-api';
 import type { StoryObj, Meta } from '@storybook/react';
-import type { Addon_SidebarTopType } from '@storybook/types';
+import type { Addon_SidebarTopType } from '@storybook/core/types';
 import { Sidebar } from './Sidebar';
 import { mockDataset } from './mockdata';
 import type { RefType } from './types';

packages/react-native-ui/src/Sidebar.tsx

@@ -1,11 +1,11 @@
 import React, { useMemo } from 'react';
 import { styled } from '@storybook/react-native-theming';
-import type { State } from '@storybook/manager-api';
+import type { State } from '@storybook/core/manager-api';
 import type {
   Addon_SidebarBottomType,
   Addon_SidebarTopType,
   API_LoadedRefData,
-} from '@storybook/types';
+} from '@storybook/core/types';
 import { Explorer } from './Explorer';
 import { Search } from './Search';
 import { SearchResults } from './SearchResults';

packages/react-native-ui/src/Tree.stories.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import type { ComponentEntry, IndexHash } from '@storybook/manager-api';
+import type { ComponentEntry, IndexHash } from '@storybook/core/manager-api';
 import type { StoryObj, Meta } from '@storybook/react';
 import { Tree } from './Tree';
 import { index } from './mockdata.large';

packages/react-native-ui/src/Tree.tsx

@@ -4,7 +4,7 @@ import type {
   State,
   StoriesHash,
   StoryEntry,
-} from '@storybook/manager-api';
+} from '@storybook/core/manager-api';
 import { styled } from '@storybook/react-native-theming';
 import React, { useCallback, useMemo, useRef } from 'react';
 import { IconButton } from './IconButton';

packages/react-native-ui/src/mockdata.ts

@@ -1,4 +1,4 @@
-import type { API_HashEntry } from '@storybook/types';
+import type { API_HashEntry } from '@storybook/core/types';
 
 export type MockDataSet = Record<string, Record<string, Partial<API_HashEntry>>>;
 

packages/react-native-ui/src/types.ts

@@ -1,5 +1,5 @@
-import type { StoriesHash, State } from '@storybook/manager-api';
-import type { API_StatusState, API_StatusValue } from '@storybook/types';
+import type { StoriesHash, State } from '@storybook/core/manager-api';
+import type { API_StatusState, API_StatusValue } from '@storybook/core/types';
 import * as Fuse from 'fuse.js';
 import { PressableProps } from 'react-native';
 

packages/react-native-ui/src/useExpanded.ts

@@ -1,4 +1,4 @@
-import type { StoriesHash } from '@storybook/manager-api';
+import type { StoriesHash } from '@storybook/core/manager-api';
 import type { Dispatch, Reducer } from 'react';
 import { useCallback, useEffect, useReducer } from 'react';
 import { getAncestorIds } from './util/tree';

packages/react-native-ui/src/util/StoryHash.ts

@@ -1,5 +1,5 @@
 import { sanitize } from '@storybook/csf';
-import { type API, type State } from '@storybook/manager-api';
+import { type API, type State } from '@storybook/core/manager-api';
 import type {
   API_ComponentEntry,
   API_DocsEntry,
@@ -14,7 +14,7 @@ import type {
   IndexEntry,
   StoryIndexV2,
   StoryIndexV3,
-} from '@storybook/types';
+} from '@storybook/core/types';
 import countBy from 'lodash/countBy.js';
 import { dedent } from 'ts-dedent';
 type ToStoriesHashOptions = {
@@ -27,7 +27,7 @@ type ToStoriesHashOptions = {
 import isEqual from 'lodash/isEqual.js';
 import mergeWith from 'lodash/mergeWith.js';
 
-import { logger } from '@storybook/client-logger';
+import { logger } from '@storybook/core/client-logger';
 
 const merge = <TObj = any>(a: TObj, b: Partial<TObj>) =>
   mergeWith({}, a, b, (objValue: TObj, srcValue: Partial<TObj>) => {

packages/react-native-ui/src/util/status.tsx

@@ -1,5 +1,5 @@
 import type { ReactElement } from 'react';
-import type { API_HashEntry, API_StatusState, API_StatusValue } from '@storybook/types';
+import type { API_HashEntry, API_StatusState, API_StatusValue } from '@storybook/core/types';
 
 import { useTheme } from '@storybook/react-native-theming';
 

packages/react-native-ui/src/util/tree.ts

@@ -1,6 +1,6 @@
 import memoize from 'memoizerific';
 import type { SyntheticEvent } from 'react';
-import type { IndexHash } from '@storybook/manager-api';
+import type { IndexHash } from '@storybook/core/manager-api';
 
 import { DEFAULT_REF_ID } from '../constants';
 import type { Item, RefType, Dataset, SearchItem } from '../types';