diff --git a/code/addons/docs/src/blocks/components/TableOfContents.stories.tsx b/code/addons/docs/src/blocks/components/TableOfContents.stories.tsx index 1a68d6f1fa70..0b9589e2be4d 100644 --- a/code/addons/docs/src/blocks/components/TableOfContents.stories.tsx +++ b/code/addons/docs/src/blocks/components/TableOfContents.stories.tsx @@ -1,10 +1,9 @@ import React from 'react'; -import { styled } from 'storybook/internal/theming'; - import type { Meta, StoryObj } from '@storybook/react-vite'; import { expect, within } from 'storybook/test'; +import { styled } from 'storybook/theming'; import { Heading } from '../blocks/Heading'; import { TableOfContents } from './TableOfContents'; diff --git a/code/addons/pseudo-states/src/manager/PseudoStateTool.tsx b/code/addons/pseudo-states/src/manager/PseudoStateTool.tsx index 3ce72f4a6df7..f7c9cfcb2705 100644 --- a/code/addons/pseudo-states/src/manager/PseudoStateTool.tsx +++ b/code/addons/pseudo-states/src/manager/PseudoStateTool.tsx @@ -1,11 +1,11 @@ import React, { type ComponentProps, useCallback } from 'react'; import { Form, IconButton, TooltipLinkList, WithTooltip } from 'storybook/internal/components'; -import { color, styled } from 'storybook/internal/theming'; import { ButtonIcon, RefreshIcon } from '@storybook/icons'; import { useGlobals } from 'storybook/manager-api'; +import { color, styled } from 'storybook/theming'; import { PARAM_KEY, PSEUDO_STATES } from '../constants'; diff --git a/code/addons/pseudo-states/src/stories/CSSAtRules.stories.tsx b/code/addons/pseudo-states/src/stories/CSSAtRules.stories.tsx index 5c1fd571f8f4..4f9e7fc01c28 100644 --- a/code/addons/pseudo-states/src/stories/CSSAtRules.stories.tsx +++ b/code/addons/pseudo-states/src/stories/CSSAtRules.stories.tsx @@ -1,10 +1,11 @@ import React, { type ComponentProps } from 'react'; import { FORCE_REMOUNT } from 'storybook/internal/core-events'; -import { useChannel, useStoryContext } from 'storybook/internal/preview-api'; import type { Meta, StoryObj } from '@storybook/react-vite'; +import { useChannel, useStoryContext } from 'storybook/preview-api'; + import { Button } from './CSSAtRules'; import './grid.css'; diff --git a/code/addons/vitest/src/components/SidebarContextMenu.tsx b/code/addons/vitest/src/components/SidebarContextMenu.tsx index 7380c84d1a42..c8fe04772012 100644 --- a/code/addons/vitest/src/components/SidebarContextMenu.tsx +++ b/code/addons/vitest/src/components/SidebarContextMenu.tsx @@ -1,9 +1,10 @@ import type { FC } from 'react'; import React from 'react'; -import { type API } from 'storybook/internal/manager-api'; import type { API_HashEntry } from 'storybook/internal/types'; +import { type API } from 'storybook/manager-api'; + import { useTestProvider } from '../use-test-provider-state'; import { TestProviderRender } from './TestProviderRender'; diff --git a/code/builders/builder-vite/src/constants.ts b/code/builders/builder-vite/src/constants.ts index 4f870d92e00b..d376399b25e4 100644 --- a/code/builders/builder-vite/src/constants.ts +++ b/code/builders/builder-vite/src/constants.ts @@ -105,7 +105,6 @@ export const INCLUDE_CANDIDATES = [ 'storybook/actions/decorator', 'storybook/internal/core-events', 'storybook/internal/csf', - 'storybook/internal/preview-api', 'storybook/internal/preview/runtime', 'storybook/preview-api', 'storybook/viewport', diff --git a/code/core/build-config.ts b/code/core/build-config.ts index 2d01d50b4be7..20552490d75c 100644 --- a/code/core/build-config.ts +++ b/code/core/build-config.ts @@ -97,7 +97,7 @@ const config: BuildEntries = { entryPoint: './src/instrumenter/index.ts', }, { - exportEntries: ['./test', './internal/test'], + exportEntries: ['./test'], entryPoint: './src/test/index.ts', }, { @@ -105,19 +105,19 @@ const config: BuildEntries = { entryPoint: './src/preview-api/index.ts', }, { - exportEntries: ['./highlight', './internal/highlight'], + exportEntries: ['./highlight'], entryPoint: './src/highlight/index.ts', }, { - exportEntries: ['./actions', './internal/actions'], + exportEntries: ['./actions'], entryPoint: './src/actions/index.ts', }, { - exportEntries: ['./actions/decorator', './internal/actions/decorator'], + exportEntries: ['./actions/decorator'], entryPoint: './src/actions/decorator.ts', }, { - exportEntries: ['./viewport', './internal/viewport'], + exportEntries: ['./viewport'], entryPoint: './src/viewport/index.ts', }, { @@ -145,11 +145,11 @@ const config: BuildEntries = { dts: false, }, { - exportEntries: ['./theming', './internal/theming'], + exportEntries: ['./theming'], entryPoint: './src/theming/index.ts', }, { - exportEntries: ['./theming/create', './internal/theming/create'], + exportEntries: ['./theming/create'], entryPoint: './src/theming/create.ts', }, { @@ -157,7 +157,7 @@ const config: BuildEntries = { entryPoint: './src/components/index.ts', }, { - exportEntries: ['./manager-api', './internal/manager-api'], + exportEntries: ['./manager-api'], entryPoint: './src/manager-api/index.ts', }, { diff --git a/code/core/package.json b/code/core/package.json index 1d95c4868f55..ec25357daade 100644 --- a/code/core/package.json +++ b/code/core/package.json @@ -58,14 +58,6 @@ "types": "./dist/highlight/index.d.ts", "default": "./dist/highlight/index.js" }, - "./internal/actions": { - "types": "./dist/actions/index.d.ts", - "default": "./dist/actions/index.js" - }, - "./internal/actions/decorator": { - "types": "./dist/actions/decorator.d.ts", - "default": "./dist/actions/decorator.js" - }, "./internal/babel": { "types": "./dist/babel/index.d.ts", "default": "./dist/babel/index.js" @@ -113,18 +105,10 @@ "types": "./dist/docs-tools/index.d.ts", "default": "./dist/docs-tools/index.js" }, - "./internal/highlight": { - "types": "./dist/highlight/index.d.ts", - "default": "./dist/highlight/index.js" - }, "./internal/instrumenter": { "types": "./dist/instrumenter/index.d.ts", "default": "./dist/instrumenter/index.js" }, - "./internal/manager-api": { - "types": "./dist/manager-api/index.d.ts", - "default": "./dist/manager-api/index.js" - }, "./internal/manager-errors": { "types": "./dist/manager-errors.d.ts", "default": "./dist/manager-errors.js" @@ -163,26 +147,10 @@ "types": "./dist/telemetry/index.d.ts", "default": "./dist/telemetry/index.js" }, - "./internal/test": { - "types": "./dist/test/index.d.ts", - "default": "./dist/test/index.js" - }, - "./internal/theming": { - "types": "./dist/theming/index.d.ts", - "default": "./dist/theming/index.js" - }, - "./internal/theming/create": { - "types": "./dist/theming/create.d.ts", - "default": "./dist/theming/create.js" - }, "./internal/types": { "types": "./dist/types/index.d.ts", "default": "./dist/types/index.js" }, - "./internal/viewport": { - "types": "./dist/viewport/index.d.ts", - "default": "./dist/viewport/index.js" - }, "./manager-api": { "types": "./dist/manager-api/index.d.ts", "default": "./dist/manager-api/index.js" diff --git a/code/core/src/components/components/Button/Button.stories.tsx b/code/core/src/components/components/Button/Button.stories.tsx index d3839e0c3b56..0534c75cda79 100644 --- a/code/core/src/components/components/Button/Button.stories.tsx +++ b/code/core/src/components/components/Button/Button.stories.tsx @@ -1,9 +1,9 @@ import React from 'react'; -import { styled } from 'storybook/internal/theming'; - import { FaceHappyIcon } from '@storybook/icons'; +import { styled } from 'storybook/theming'; + import preview from '../../../../../.storybook/preview'; import { Button } from './Button'; diff --git a/code/core/src/components/components/Form/Checkbox.tsx b/code/core/src/components/components/Form/Checkbox.tsx index 04e8258d35ab..e9cb7c423d01 100644 --- a/code/core/src/components/components/Form/Checkbox.tsx +++ b/code/core/src/components/components/Form/Checkbox.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { color, styled } from 'storybook/internal/theming'; +import { color, styled } from 'storybook/theming'; const Input = styled.input({ appearance: 'none', diff --git a/code/core/src/components/components/Form/Radio.tsx b/code/core/src/components/components/Form/Radio.tsx index 8a077c1f9561..b9d6297d9e73 100644 --- a/code/core/src/components/components/Form/Radio.tsx +++ b/code/core/src/components/components/Form/Radio.tsx @@ -1,6 +1,6 @@ import React from 'react'; -import { color, styled } from 'storybook/internal/theming'; +import { color, styled } from 'storybook/theming'; const Input = styled.input({ appearance: 'none', diff --git a/code/core/src/highlight/useHighlights.stories.tsx b/code/core/src/highlight/useHighlights.stories.tsx index 38e3b485c6b3..e296c8602a78 100644 --- a/code/core/src/highlight/useHighlights.stories.tsx +++ b/code/core/src/highlight/useHighlights.stories.tsx @@ -1,7 +1,6 @@ import React from 'react'; -import { useChannel } from 'storybook/internal/preview-api'; - +import { useChannel } from 'storybook/preview-api'; import { fn, userEvent, within } from 'storybook/test'; import preview from '../../../.storybook/preview'; diff --git a/code/core/src/manager/components/layout/Layout.stories.tsx b/code/core/src/manager/components/layout/Layout.stories.tsx index 6203d2063cdf..1604abf09dcf 100644 --- a/code/core/src/manager/components/layout/Layout.stories.tsx +++ b/code/core/src/manager/components/layout/Layout.stories.tsx @@ -1,12 +1,12 @@ import type { FC, PropsWithChildren } from 'react'; import React, { useState } from 'react'; -import { ManagerContext } from 'storybook/internal/manager-api'; import { LocationProvider } from 'storybook/internal/router'; import type { Meta, StoryObj } from '@storybook/react-vite'; import { action } from 'storybook/actions'; +import { ManagerContext } from 'storybook/manager-api'; import { fn } from 'storybook/test'; import { styled } from 'storybook/theming'; @@ -63,6 +63,15 @@ const managerContext: any = { state: {}, api: { foo: 'bar', + getCurrentStoryData: fn() + .mockName('api::getCurrentStoryData') + .mockImplementation(() => ({ + id: '123', + name: 'Test Story', + renderLabel: fn() + .mockName('api::getCurrentStoryData::renderLabel') + .mockImplementation(() => 'Test Story'), + })), getNavSizeWithCustomisations: fn() .mockName('api::getNavSizeWithCustomisations') .mockImplementation((size: number) => size), diff --git a/code/core/src/manager/globals/globals-module-info.ts b/code/core/src/manager/globals/globals-module-info.ts index ff5e8f0b9ecb..dd9e0cea6be8 100644 --- a/code/core/src/manager/globals/globals-module-info.ts +++ b/code/core/src/manager/globals/globals-module-info.ts @@ -22,6 +22,16 @@ import { globalPackages, globalsNameReferenceMap } from './globals'; * The `runtime.ts` file is used inside the manager's browser code runtime. */ +const duplicatedKeys = [ + 'storybook/theming', + 'storybook/theming/create', + 'storybook/manager-api', + 'storybook/test', + 'storybook/actions', + 'storybook/highlight', + 'storybook/viewport', +]; + export const globalsModuleInfoMap = globalPackages.reduce( (acc, key) => { acc[key] = { @@ -30,6 +40,15 @@ export const globalsModuleInfoMap = globalPackages.reduce( namedExports: Exports[key], defaultExport: true, }; + + if (duplicatedKeys.includes(key)) { + acc[key.replace('storybook', 'storybook/internal') as typeof key] = { + type: 'esm', + varName: globalsNameReferenceMap[key], + namedExports: Exports[key], + defaultExport: true, + }; + } return acc; }, {} as Required>> diff --git a/code/core/src/preview/globals/globals.ts b/code/core/src/preview/globals/globals.ts index c38eeecf07f2..60f747a915de 100644 --- a/code/core/src/preview/globals/globals.ts +++ b/code/core/src/preview/globals/globals.ts @@ -13,7 +13,7 @@ export const globalsNameReferenceMap = { 'storybook/internal/preview-errors': '__STORYBOOK_MODULE_CORE_EVENTS_PREVIEW_ERRORS__', 'storybook/internal/types': '__STORYBOOK_MODULE_TYPES__', - // @deprecated TODO: Remove in 9.1 + // @deprecated TODO: Remove in 9.1 or some point in the future, I guess 'storybook/internal/preview-api': '__STORYBOOK_MODULE_PREVIEW_API__', } as const; diff --git a/code/core/src/preview/globals/runtime.ts b/code/core/src/preview/globals/runtime.ts index 29f28c7abb0a..fee28ce6425e 100644 --- a/code/core/src/preview/globals/runtime.ts +++ b/code/core/src/preview/globals/runtime.ts @@ -25,6 +25,5 @@ export const globalsNameValueMap: Required = { const importErrors = await transformImportFiles( [...storiesPaths, ...configFiles].filter(Boolean) as string[], - consolidatedPackages, + { + ...consolidatedPackages, + 'storybook/internal/manager-api': 'storybook/manager-api', + 'storybook/internal/preview-api': 'storybook/preview-api', + 'storybook/internal/theming': 'storybook/theming', + 'storybook/internal/theming/create': 'storybook/theming/create', + 'storybook/internal/test': 'storybook/test', + 'storybook/internal/actions': 'storybook/internal/actions', + 'storybook/internal/actions/decorator': 'storybook/internal/actions/decorator', + 'storybook/internal/highlight': 'storybook/internal/highlight', + 'storybook/internal/viewport': 'storybook/internal/viewport', + }, !!dryRun ); diff --git a/code/renderers/react/template/stories/decorators.stories.tsx b/code/renderers/react/template/stories/decorators.stories.tsx index e1014e7ee911..f4f9fd9e4e73 100644 --- a/code/renderers/react/template/stories/decorators.stories.tsx +++ b/code/renderers/react/template/stories/decorators.stories.tsx @@ -1,10 +1,10 @@ import type { FC } from 'react'; import React, { createContext, useContext, useState } from 'react'; -import { useParameter } from 'storybook/internal/preview-api'; - import type { Meta, StoryObj } from '@storybook/react'; +import { useParameter } from 'storybook/preview-api'; + const Component: FC = () =>

Story

; export default {