GitHub/storybook
1
0
Fork 0
mirror of https://github.com/storybookjs/storybook.git synced 2025-04-08 04:31:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'kasper/canvas' into kasper/mount

Browse Source
This commit is contained in:
Kasper Peulen 2024-07-02 11:31:11 +02:00
commit 6193e8514a
2015 changed files with 8558 additions and 7717 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
.circleci/config.yml
View File

@ -66,6 +66,8 @@ orbs:
browser-tools: circleci/browser-tools@1.4.1
discord: antonioned/discord@0.1.0
codecov: codecov/codecov@3.2.4
bun-orb: cmgriffing/bun-orb@0.0.29
node: circleci/node@5.2.0
nx: nrwl/nx@1.6.2
commands:
@ -129,6 +131,8 @@ jobs:
steps:
- git-shallow-clone/checkout_advanced:
clone_options: "--depth 1 --verbose"
- bun-orb/setup:
version: 1.1.1
- restore_cache:
name: Restore Yarn cache
keys:
@ -161,6 +165,7 @@ jobs:
- code/frameworks
- code/deprecated
- code/lib
- code/core
- code/builders
- code/ui
- code/renderers
@ -189,6 +194,8 @@ jobs:
steps:
- git-shallow-clone/checkout_advanced:
clone_options: "--depth 1 --verbose"
- bun-orb/setup:
version: 1.1.1
- attach_workspace:
at: .
- nx/set-shas:
@ -260,7 +267,7 @@ jobs:
at: .
- codecov/upload
- report-workflow-on-failure
chromatic-internal-storybooks:
chromatic-internal-storybook:
executor:
class: medium+
name: sb_node_18_browsers
@ -273,10 +280,8 @@ jobs:
at: .
- run:
name: Running Chromatic
command: |
cd code
yarn storybook:ui:chromatic
yarn storybook:blocks:chromatic
command: yarn storybook:ui:chromatic
working_directory: code
- report-workflow-on-failure
- store_test_results:
path: test-results
@ -339,6 +344,8 @@ jobs:
steps:
- git-shallow-clone/checkout_advanced:
clone_options: "--depth 1 --verbose"
- bun-orb/setup:
version: 1.1.1
- attach_workspace:
at: .
- run:
@ -349,13 +356,15 @@ jobs:
- run:
name: Building Sandboxes
command: yarn task --task build --template $(yarn get-template --cadence << pipeline.parameters.workflow >> --task build) --no-link --start-from=never --junit
environment:
STORYBOOK_TELEMETRY_URL: "http://localhost:6007/event-log"
- run:
name: Verifying Telemetry
command: |
TEMPLATE=$(yarn get-template --cadence << pipeline.parameters.workflow >> --task build)
if [[ $TEMPLATE != bench/* ]]
then
node --loader esbuild-register/loader -r esbuild-register ./event-log-checker build $TEMPLATE
node --loader esbuild-register/loader -r esbuild-register ./event-log-checker.ts build $TEMPLATE
fi
working_directory: scripts
- report-workflow-on-failure:
@ -644,7 +653,7 @@ workflows:
- script-checks:
requires:
- build
- chromatic-internal-storybooks:
- chromatic-internal-storybook:
requires:
- build
- coverage:
@ -706,7 +715,7 @@ workflows:
- script-checks:
requires:
- build
- chromatic-internal-storybooks:
- chromatic-internal-storybook:
requires:
- build
- coverage:
@ -769,7 +778,7 @@ workflows:
- script-checks:
requires:
- build
- chromatic-internal-storybooks:
- chromatic-internal-storybook:
requires:
- build
- create-sandboxes:

2
.github/workflows/canary-release-pr.yml vendored
View File

@ -105,7 +105,7 @@ jobs:
| | |
| --- | --- |
| **Published version** | [`${{ steps.version.outputs.next-version }}`](https://npmjs.com/package/@storybook/cli/v/${{ steps.version.outputs.next-version }}) |
| **Published version** | [`${{ steps.version.outputs.next-version }}`](https://npmjs.com/package/storybook/v/${{ steps.version.outputs.next-version }}) |
| **Triggered by** | @${{ github.triggering_actor }} |
| **Repository** | [${{ steps.info.outputs.repository }}](https://github.com/${{ steps.info.outputs.repository }}) |
| **Branch** | [`${{ steps.info.outputs.branch }}`](https://github.com/${{ steps.info.outputs.repository }}/tree/${{ steps.info.outputs.branch }}) |

8
.github/workflows/generate-sandboxes.yml vendored
View File

@ -30,6 +30,10 @@ jobs:
with:
ref: next
- uses: oven-sh/setup-bun@v1
with:
bun-version: 1.1.1
- uses: actions/setup-node@v4
with:
node-version-file: ".nvmrc"
@ -82,6 +86,10 @@ jobs:
with:
ref: main
- uses: oven-sh/setup-bun@v1
with:
bun-version: 1.1.1
- uses: actions/setup-node@v4
with:
node-version-file: ".nvmrc"

4
.github/workflows/prepare-non-patch-release.yml vendored
View File

@ -56,6 +56,10 @@ jobs:
with:
node-version-file: ".nvmrc"
- uses: oven-sh/setup-bun@v1
with:
bun-version: 1.1.1
- name: Cache dependencies
uses: actions/cache@v4
with:

4
.github/workflows/prepare-patch-release.yml vendored
View File

@ -35,6 +35,10 @@ jobs:
with:
node-version-file: ".nvmrc"
- uses: oven-sh/setup-bun@v1
with:
bun-version: 1.1.1
- name: Cache dependencies
uses: actions/cache@v4
with:

4
.github/workflows/publish.yml vendored
View File

@ -47,6 +47,10 @@ jobs:
with:
node-version-file: ".nvmrc"
- uses: oven-sh/setup-bun@v1
with:
bun-version: 1.1.1
- name: Cache dependencies
uses: actions/cache@v4
with:

6
.github/workflows/tests-unit.yml vendored
View File

@ -17,11 +17,15 @@ jobs:
runs-on: ${{ matrix.os }}
steps:
- uses: actions/checkout@v4
- uses: oven-sh/setup-bun@v1
with:
bun-version: 1.1.1
- name: Set node version
uses: actions/setup-node@v4
with:
node-version-file: ".nvmrc"
- name: install and compile
run: yarn task --task compile --start-from=auto --no-link
run: yarn task --task compile --start-from=auto
- name: test
run: yarn test

1
.gitignore vendored
View File

@ -54,3 +54,4 @@ code/bench-results/
/packs
code/.nx/cache
!**/fixtures/**/yarn.lock

12
CONTRIBUTING.md
View File

@ -2,6 +2,14 @@
Storybook is developed against a specific node version which is defined in an `.nvmrc` file. You can use any Node version manager that uses the `.nvmrc` configuration file (we recommend [fnm](https://fnm.vercel.app/)).
## Ensure you have the required system utilities
You will need to have the following installed:
- git
- node
- yarn
- (bun)[https://bun.sh/]
## Using fnm as a Node version manager
- Install fnm [as per instructions](https://github.com/Schniz/fnm/tree/master#installation)
@ -50,7 +58,7 @@ If you want to make code changes to Storybook packages while running a sandbox,
```bash
cd code
yarn build --watch react core-server api addon-docs
yarn build --watch react core addon-docs
```
2. If you are running the sandbox in "linked" mode (the default), you should see the changes reflected on a refresh (you may need to restart it if changing server packages)
@ -71,7 +79,7 @@ yarn task --prod
```bash
cd code
yarn build --prod --watch angular core-server api addon-docs
yarn build --prod --watch angular core addon-docs
```
## Contributing to Storybook

26
MIGRATION.md
View File

@ -100,17 +100,17 @@
- [Tab addons cannot manually route, Tool addons can filter their visibility via tabId](#tab-addons-cannot-manually-route-tool-addons-can-filter-their-visibility-via-tabid)
- [Removed `config` preset](#removed-config-preset-1)
- [From version 7.5.0 to 7.6.0](#from-version-750-to-760)
- [CommonJS with Vite is deprecated](#commonjs-with-vite-is-deprecated)
- [Using implicit actions during rendering is deprecated](#using-implicit-actions-during-rendering-is-deprecated)
- [typescript.skipBabel deprecated](#typescriptskipbabel-deprecated)
- [Primary doc block accepts of prop](#primary-doc-block-accepts-of-prop)
- [Addons no longer need a peer dependency on React](#addons-no-longer-need-a-peer-dependency-on-react)
- [CommonJS with Vite is deprecated](#commonjs-with-vite-is-deprecated)
- [Using implicit actions during rendering is deprecated](#using-implicit-actions-during-rendering-is-deprecated)
- [typescript.skipBabel deprecated](#typescriptskipbabel-deprecated)
- [Primary doc block accepts of prop](#primary-doc-block-accepts-of-prop)
- [Addons no longer need a peer dependency on React](#addons-no-longer-need-a-peer-dependency-on-react)
- [From version 7.4.0 to 7.5.0](#from-version-740-to-750)
- [`storyStoreV6` and `storiesOf` is deprecated](#storystorev6-and-storiesof-is-deprecated)
- [`storyIndexers` is replaced with `experimental_indexers`](#storyindexers-is-replaced-with-experimental_indexers)
- [`storyStoreV6` and `storiesOf` is deprecated](#storystorev6-and-storiesof-is-deprecated)
- [`storyIndexers` is replaced with `experimental_indexers`](#storyindexers-is-replaced-with-experimental_indexers)
- [From version 7.0.0 to 7.2.0](#from-version-700-to-720)
- [Addon API is more type-strict](#addon-api-is-more-type-strict)
- [Addon-controls hideNoControlsWarning parameter is deprecated](#addon-controls-hidenocontrolswarning-parameter-is-deprecated)
- [Addon API is more type-strict](#addon-api-is-more-type-strict)
- [Addon-controls hideNoControlsWarning parameter is deprecated](#addon-controls-hidenocontrolswarning-parameter-is-deprecated)
- [From version 6.5.x to 7.0.0](#from-version-65x-to-700)
- [7.0 breaking changes](#70-breaking-changes)
- [Dropped support for Node 15 and below](#dropped-support-for-node-15-and-below)
@ -136,7 +136,7 @@
- [Deploying build artifacts](#deploying-build-artifacts)
- [Dropped support for file URLs](#dropped-support-for-file-urls)
- [Serving with nginx](#serving-with-nginx)
- [Ignore story files from node_modules](#ignore-story-files-from-node_modules)
- [Ignore story files from node\_modules](#ignore-story-files-from-node_modules)
- [7.0 Core changes](#70-core-changes)
- [7.0 feature flags removed](#70-feature-flags-removed)
- [Story context is prepared before for supporting fine grained updates](#story-context-is-prepared-before-for-supporting-fine-grained-updates)
@ -150,7 +150,7 @@
- [Addon-interactions: Interactions debugger is now default](#addon-interactions-interactions-debugger-is-now-default)
- [7.0 Vite changes](#70-vite-changes)
- [Vite builder uses Vite config automatically](#vite-builder-uses-vite-config-automatically)
- [Vite cache moved to node_modules/.cache/.vite-storybook](#vite-cache-moved-to-node_modulescachevite-storybook)
- [Vite cache moved to node\_modules/.cache/.vite-storybook](#vite-cache-moved-to-node_modulescachevite-storybook)
- [7.0 Webpack changes](#70-webpack-changes)
- [Webpack4 support discontinued](#webpack4-support-discontinued)
- [Babel mode v7 exclusively](#babel-mode-v7-exclusively)
@ -200,7 +200,7 @@
- [Dropped addon-docs manual babel configuration](#dropped-addon-docs-manual-babel-configuration)
- [Dropped addon-docs manual configuration](#dropped-addon-docs-manual-configuration)
- [Autoplay in docs](#autoplay-in-docs)
- [Removed STORYBOOK_REACT_CLASSES global](#removed-storybook_react_classes-global)
- [Removed STORYBOOK\_REACT\_CLASSES global](#removed-storybook_react_classes-global)
- [7.0 Deprecations and default changes](#70-deprecations-and-default-changes)
- [storyStoreV7 enabled by default](#storystorev7-enabled-by-default)
- [`Story` type deprecated](#story-type-deprecated)
@ -5616,7 +5616,7 @@ Also, here's the error you'll get if you're running an older version of React:
```
core.browser.esm.js:15 Uncaught TypeError: Object(...) is not a function
at Module../node_modules/@emotion/core/dist/core.browser.esm.js (core.browser.esm.js:15)
at Module../node_modules/@emotion/core/core.browser.esm.js (core.browser.esm.js:15)
at **webpack_require** (bootstrap:724)
at fn (bootstrap:101)
at Module../node_modules/@emotion/styled-base/dist/styled-base.browser.esm.js (styled-base.browser.esm.js:1)

4
code/.eslintignore
View File

@ -17,5 +17,5 @@ ember-output
!.eslintrc.js
!.eslintrc-markdown.js
!.storybook
lib/core-common/templates/base-preview-head.html
lib/core-server/src/utils/__search-files-tests__
core/assets
core/src/core-server/utils/__search-files-tests__

22
code/.eslintrc.js
View File

@ -9,10 +9,6 @@ const addonsPackages = fs
const libPackages = fs
.readdirSync(path.join(__dirname, 'lib'))
.filter((p) => fs.statSync(path.join(__dirname, 'lib', p)).isDirectory());
const uiPackages = fs
.readdirSync(path.join(__dirname, 'ui'))
.filter((p) => fs.statSync(path.join(__dirname, 'ui', p)).isDirectory())
.filter((p) => !p.startsWith('.'));
module.exports = {
root: true,
@ -23,6 +19,7 @@ module.exports = {
},
plugins: ['local-rules'],
rules: {
'import/no-unresolved': 'off', // covered by typescript
'eslint-comments/disable-enable-pair': ['error', { allowWholeFile: true }],
'eslint-comments/no-unused-disable': 'error',
'react-hooks/rules-of-hooks': 'off',
@ -93,20 +90,20 @@ module.exports = {
{
// these packages use pre-bundling, dependencies will be bundled, and will be in devDepenencies
files: ['frameworks/**/*', 'builders/**/*', 'deprecated/**/*', 'renderers/**/*'],
excludedFiles: ['frameworks/angular/**/*', 'frameworks/ember/**/*', 'lib/core-server/**/*'],
excludedFiles: ['frameworks/angular/**/*', 'frameworks/ember/**/*', 'core/**/*'],
rules: {
'import/no-extraneous-dependencies': [
'error',
{ bundledDependencies: false, devDependencies: true },
{ bundledDependencies: false, devDependencies: true, peerDependencies: true },
],
},
},
{
files: ['**/ui/.storybook/**'],
files: ['**/.storybook/**'],
rules: {
'import/no-extraneous-dependencies': [
'error',
{ packageDir: [__dirname], devDependencies: true },
{ packageDir: [__dirname], devDependencies: true, peerDependencies: true },
],
},
},
@ -122,15 +119,6 @@ module.exports = {
],
},
})),
...uiPackages.map((directory) => ({
files: [path.join('**', 'ui', directory, '**', '*.*')],
rules: {
'import/no-extraneous-dependencies': [
'error',
{ packageDir: [__dirname, path.join(__dirname, 'ui', directory)], devDependencies: true },
],
},
})),
...libPackages.map((directory) => ({
files: [path.join('**', 'lib', directory, '**', '*.*')],
rules: {

0
code/ui/.storybook/isChromatic.ts → code/.storybook/isChromatic.ts
View File

87
code/.storybook/main.ts Normal file
View File

@ -0,0 +1,87 @@
import path from 'path';
// eslint-disable-next-line @typescript-eslint/no-restricted-imports
import { mergeConfig } from 'vite';
import type { StorybookConfig } from '../frameworks/react-vite';
const componentsPath = path.join(__dirname, '../core/src/components');
const managerApiPath = path.join(__dirname, '../core/src/manager-api');
const config: StorybookConfig = {
stories: [
{
directory: '../core/src/manager',
titlePrefix: '@manager',
},
{
directory: '../core/src/preview-api',
titlePrefix: '@preview',
},
{
directory: '../core/src/components',
titlePrefix: '@components',
},
{
directory: '../lib/blocks/src',
titlePrefix: '@blocks',
},
{
directory: '../addons/controls/src',
titlePrefix: '@addons/controls',
},
{
directory: '../addons/onboarding/src',
titlePrefix: '@addons/onboarding',
},
{
directory: '../addons/interactions/src',
titlePrefix: '@addons/interactions',
},
],
addons: [
'@storybook/addon-links',
'@storybook/addon-essentials',
'@storybook/addon-interactions',
'@storybook/addon-storysource',
'@storybook/addon-designs',
'@storybook/addon-a11y',
'@chromatic-com/storybook',
],
build: {
test: {
// we have stories for the blocks here, we can't exclude them
disableBlocks: false,
// some stories in blocks (ArgTypes, Controls) depends on argTypes inference
disableDocgen: false,
},
},
framework: {
name: '@storybook/react-vite',
options: {},
},
core: {
disableTelemetry: true,
},
viteFinal: (viteConfig, { configType }) =>
mergeConfig(viteConfig, {
resolve: {
alias: {
...(configType === 'DEVELOPMENT'
? {
'@storybook/components': componentsPath,
'storybook/internal/components': componentsPath,
'@storybook/manager-api': managerApiPath,
'storybook/internal/manager-api': managerApiPath,
}
: {}),
},
},
optimizeDeps: { force: true },
build: {
// disable sourcemaps in CI to not run out of memory
sourcemap: process.env.CI !== 'true',
},
}),
logLevel: 'debug',
};
export default config;

2
code/ui/.storybook/manager.tsx → code/.storybook/manager.tsx
View File

@ -1,4 +1,4 @@
import { addons } from '@storybook/manager-api';
import { addons } from 'storybook/internal/manager-api';
import startCase from 'lodash/startCase.js';
addons.setConfig({

0
code/ui/.storybook/preview-head.html → code/.storybook/preview-head.html
View File

12
code/ui/.storybook/preview.tsx → code/.storybook/preview.tsx
View File

@ -9,15 +9,15 @@ import {
convert,
styled,
useTheme,
} from '@storybook/theming';
import { useArgs, DocsContext as DocsContextProps } from '@storybook/preview-api';
import type { PreviewWeb } from '@storybook/preview-api';
} from 'storybook/internal/theming';
import { useArgs, DocsContext as DocsContextProps } from 'storybook/internal/preview-api';
import type { PreviewWeb } from 'storybook/internal/preview-api';
import type { ReactRenderer } from '@storybook/react';
import type { Channel } from '@storybook/channels';
import type { Channel } from 'storybook/internal/channels';
import { DocsContext } from '@storybook/blocks';
import { DocsPageWrapper } from '../blocks/src/components';
import { DocsPageWrapper } from '../lib/blocks/src/components';
const { document } = global;
@ -107,7 +107,7 @@ export const loaders = [
if (!relativeCsfPaths) return {};
const csfFiles = await Promise.all(
(relativeCsfPaths as string[]).map(async (blocksRelativePath) => {
const projectRelativePath = `./ui/blocks/src/${blocksRelativePath.replace(
const projectRelativePath = `./lib/blocks/src/${blocksRelativePath.replace(
/^..\//,
''
)}.tsx`;

10
code/addons/a11y/package.json
View File

@ -60,15 +60,8 @@
"axe-core": "^4.2.0"
},
"devDependencies": {
"@storybook/channels": "workspace:*",
"@storybook/client-logger": "workspace:*",
"@storybook/components": "workspace:*",
"@storybook/global": "^5.0.0",
"@storybook/icons": "^1.2.5",
"@storybook/manager-api": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@storybook/theming": "workspace:*",
"@storybook/types": "workspace:*",
"@testing-library/react": "^14.0.0",
"lodash": "^4.17.21",
"react": "^18.2.0",
@ -77,6 +70,9 @@
"resize-observer-polyfill": "^1.5.1",
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/a11y/project.json
View File

@ -1,4 +1,5 @@
{
"name": "a11y",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

4
code/addons/a11y/src/a11yRunner.test.ts
View File

@ -1,9 +1,9 @@
import type { Mock } from 'vitest';
import { describe, beforeEach, it, expect, vi } from 'vitest';
import { addons } from '@storybook/preview-api';
import { addons } from 'storybook/internal/preview-api';
import { EVENTS } from './constants';
vi.mock('@storybook/preview-api');
vi.mock('storybook/internal/preview-api');
const mockedAddons = vi.mocked(addons);
describe('a11yRunner', () => {

2
code/addons/a11y/src/a11yRunner.ts
View File

@ -1,5 +1,5 @@
import { global } from '@storybook/global';
import { addons } from '@storybook/preview-api';
import { addons } from 'storybook/internal/preview-api';
import { EVENTS } from './constants';
import type { A11yParameters } from './params';

6
code/addons/a11y/src/components/A11YPanel.test.tsx
View File

@ -4,13 +4,13 @@ import { describe, beforeEach, afterEach, it, expect, vi } from 'vitest';
import React from 'react';
import { render, waitFor, fireEvent, act, cleanup } from '@testing-library/react';
import { ThemeProvider, themes, convert } from '@storybook/theming';
import * as api from '@storybook/manager-api';
import { ThemeProvider, themes, convert } from 'storybook/internal/theming';
import * as api from 'storybook/internal/manager-api';
import { A11YPanel } from './A11YPanel';
import { EVENTS } from '../constants';
vi.mock('@storybook/manager-api');
vi.mock('storybook/internal/manager-api');
global.ResizeObserver = require('resize-observer-polyfill');

6
code/addons/a11y/src/components/A11YPanel.tsx
View File

@ -1,8 +1,8 @@
import React, { useCallback, useMemo, useState } from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import { ActionBar, ScrollArea } from '@storybook/components';
import { ActionBar, ScrollArea } from 'storybook/internal/components';
import { SyncIcon, CheckIcon } from '@storybook/icons';
import type { AxeResults } from 'axe-core';
@ -11,7 +11,7 @@ import {
useParameter,
useStorybookApi,
useStorybookState,
} from '@storybook/manager-api';
} from 'storybook/internal/manager-api';
import { Report } from './Report';

6
code/addons/a11y/src/components/A11yContext.test.tsx
View File

@ -4,14 +4,14 @@ import { describe, beforeEach, afterEach, it, expect, vi } from 'vitest';
import * as React from 'react';
import type { AxeResults } from 'axe-core';
import { render, act, cleanup } from '@testing-library/react';
import * as api from '@storybook/manager-api';
import { STORY_CHANGED } from '@storybook/core-events';
import * as api from 'storybook/internal/manager-api';
import { STORY_CHANGED } from 'storybook/internal/core-events';
import { HIGHLIGHT } from '@storybook/addon-highlight';
import { A11yContextProvider, useA11yContext } from './A11yContext';
import { EVENTS } from '../constants';
vi.mock('@storybook/manager-api');
vi.mock('storybook/internal/manager-api');
const mockedApi = vi.mocked(api);
const storyId = 'jest';

6
code/addons/a11y/src/components/A11yContext.tsx
View File

@ -1,8 +1,8 @@
import * as React from 'react';
import { themes, convert } from '@storybook/theming';
import { themes, convert } from 'storybook/internal/theming';
import type { Result } from 'axe-core';
import { useChannel, useAddonState, useStorybookApi } from '@storybook/manager-api';
import { STORY_CHANGED, STORY_RENDERED } from '@storybook/core-events';
import { useChannel, useAddonState, useStorybookApi } from 'storybook/internal/manager-api';
import { STORY_CHANGED, STORY_RENDERED } from 'storybook/internal/core-events';
import { HIGHLIGHT } from '@storybook/addon-highlight';
import { ADDON_ID, EVENTS } from '../constants';

2
code/addons/a11y/src/components/Report/Elements.tsx
View File

@ -1,7 +1,7 @@
import type { FC } from 'react';
import React from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import type { NodeResult } from 'axe-core';
import { Rules } from './Rules';

2
code/addons/a11y/src/components/Report/HighlightToggle.tsx
View File

@ -1,5 +1,5 @@
import React from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import type { NodeResult } from 'axe-core';
import { useA11yContext } from '../A11yContext';

2
code/addons/a11y/src/components/Report/Info.tsx
View File

@ -1,7 +1,7 @@
import type { FC } from 'react';
import React from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import type { Result } from 'axe-core';
const Wrapper = styled.div({

2
code/addons/a11y/src/components/Report/Item.tsx
View File

@ -1,6 +1,6 @@
import React, { Fragment, useState } from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import type { Result } from 'axe-core';
import { Info } from './Info';

4
code/addons/a11y/src/components/Report/Rules.tsx
View File

@ -1,7 +1,7 @@
import type { FC } from 'react';
import React from 'react';
import { styled } from '@storybook/theming';
import { Badge } from '@storybook/components';
import { styled } from 'storybook/internal/theming';
import { Badge } from 'storybook/internal/components';
import type { CheckResult } from 'axe-core';
import { useResizeDetector } from 'react-resize-detector';

2
code/addons/a11y/src/components/Report/Tags.tsx
View File

@ -1,7 +1,7 @@
import type { FC } from 'react';
import React from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import type { TagValue } from 'axe-core';
const Wrapper = styled.div({

2
code/addons/a11y/src/components/Report/index.tsx
View File

@ -1,6 +1,6 @@
import type { FC } from 'react';
import React, { Fragment } from 'react';
import { EmptyTabContent } from '@storybook/components';
import { EmptyTabContent } from 'storybook/internal/components';
import type { Result } from 'axe-core';
import { Item } from './Item';

2
code/addons/a11y/src/components/Tabs.tsx
View File

@ -1,6 +1,6 @@
import * as React from 'react';
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import type { NodeResult, Result } from 'axe-core';
import { useResizeDetector } from 'react-resize-detector';
import HighlightToggle from './Report/HighlightToggle';

4
code/addons/a11y/src/components/VisionSimulator.test.tsx
View File

@ -1,9 +1,11 @@
// @vitest-environment happy-dom
/// <reference types="@testing-library/jest-dom" />;
import { describe, it, expect } from 'vitest';
import React from 'react';
import { render, fireEvent, screen, waitFor } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { ThemeProvider, themes, convert } from '@storybook/theming';
import { ThemeProvider, themes, convert } from 'storybook/internal/theming';
import { VisionSimulator, baseList } from './VisionSimulator';
const getOptionByNameAndPercentage = (option: string, percentage?: number) =>

4
code/addons/a11y/src/components/VisionSimulator.tsx
View File

@ -1,7 +1,7 @@
import type { ReactNode } from 'react';
import React, { useState } from 'react';
import { Global, styled } from '@storybook/theming';
import { IconButton, WithTooltip, TooltipLinkList } from '@storybook/components';
import { Global, styled } from 'storybook/internal/theming';
import { IconButton, WithTooltip, TooltipLinkList } from 'storybook/internal/components';
import { AccessibilityIcon } from '@storybook/icons';
import { Filters } from './ColorFilters';

8
code/addons/a11y/src/manager.test.tsx
View File

@ -1,10 +1,12 @@
// @vitest-environment happy-dom
import { describe, it, expect, vi } from 'vitest';
import * as api from '@storybook/manager-api';
import type { Addon_BaseType } from '@storybook/types';
import * as api from 'storybook/internal/manager-api';
import type { Addon_BaseType } from 'storybook/internal/types';
import { PANEL_ID } from './constants';
import './manager';
vi.mock('@storybook/manager-api');
vi.mock('storybook/internal/manager-api');
const mockedApi = vi.mocked<api.API>(api as any);
mockedApi.useAddonState = vi.fn();
const mockedAddons = vi.mocked(api.addons);

4
code/addons/a11y/src/manager.tsx
View File

@ -1,6 +1,6 @@
import React from 'react';
import { addons, types, useAddonState } from '@storybook/manager-api';
import { Badge, Spaced } from '@storybook/components';
import { addons, types, useAddonState } from 'storybook/internal/manager-api';
import { Badge, Spaced } from 'storybook/internal/components';
import { ADDON_ID, PANEL_ID, PARAM_KEY } from './constants';
import { VisionSimulator } from './components/VisionSimulator';
import { A11YPanel } from './components/A11YPanel';

11
code/addons/actions/package.json
View File

@ -68,7 +68,6 @@
"prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
},
"dependencies": {
"@storybook/core-events": "workspace:*",
"@storybook/global": "^5.0.0",
"@types/uuid": "^9.0.1",
"dequal": "^2.0.2",
@ -76,18 +75,16 @@
"uuid": "^9.0.0"
},
"devDependencies": {
"@storybook/client-logger": "workspace:*",
"@storybook/components": "workspace:*",
"@storybook/manager-api": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@storybook/theming": "workspace:*",
"@storybook/types": "workspace:*",
"@storybook/test": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-inspector": "^6.0.0",
"telejson": "^7.2.0",
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/actions/project.json
View File

@ -1,4 +1,5 @@
{
"name": "actions",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

2
code/addons/actions/src/addArgs.ts
View File

@ -1,4 +1,4 @@
import type { ArgsEnhancer } from '@storybook/types';
import type { ArgsEnhancer } from 'storybook/internal/types';
import { addActionsFromArgTypes, inferActionsFromArgTypesRegex } from './addArgsHelpers';
export const argsEnhancers: ArgsEnhancer[] = [

2
code/addons/actions/src/addArgsHelpers.test.ts
View File

@ -1,5 +1,5 @@
import { describe, it, expect } from 'vitest';
import type { StoryContext } from '@storybook/types';
import type { StoryContext } from 'storybook/internal/types';
import { inferActionsFromArgTypesRegex, addActionsFromArgTypes } from './addArgsHelpers';
describe('actions parameter enhancers', () => {

2
code/addons/actions/src/addArgsHelpers.ts
View File

@ -1,4 +1,4 @@
import type { Args, Renderer, ArgsEnhancer } from '@storybook/types';
import type { Args, Renderer, ArgsEnhancer } from 'storybook/internal/types';
import { action } from './runtime/action';
// interface ActionsParameter {

6
code/addons/actions/src/components/ActionLogger/index.tsx
View File

@ -1,10 +1,10 @@
import type { ElementRef, ReactNode } from 'react';
import React, { forwardRef, Fragment, useEffect, useRef } from 'react';
import type { Theme } from '@storybook/theming';
import { styled, withTheme } from '@storybook/theming';
import type { Theme } from 'storybook/internal/theming';
import { styled, withTheme } from 'storybook/internal/theming';
import { Inspector } from 'react-inspector';
import { ActionBar, ScrollArea } from '@storybook/components';
import { ActionBar, ScrollArea } from 'storybook/internal/components';
import { Action, Counter, InspectorContainer } from './style';
import type { ActionDisplay } from '../../models';

2
code/addons/actions/src/components/ActionLogger/style.tsx
View File

@ -1,4 +1,4 @@
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
import { opacify } from 'polished';
export const Action = styled.div({

4
code/addons/actions/src/containers/ActionLogger/index.tsx
View File

@ -1,8 +1,8 @@
import React, { Component } from 'react';
import { dequal as deepEqual } from 'dequal';
import type { API } from '@storybook/manager-api';
import { STORY_CHANGED } from '@storybook/core-events';
import type { API } from 'storybook/internal/manager-api';
import { STORY_CHANGED } from 'storybook/internal/core-events';
import { ActionLogger as ActionLoggerComponent } from '../../components/ActionLogger';
import type { ActionDisplay } from '../../models';

4
code/addons/actions/src/decorator.ts
View File

@ -1,6 +1,6 @@
import { global } from '@storybook/global';
import { useEffect, makeDecorator } from '@storybook/preview-api';
import type { PartialStoryFn, Renderer } from '@storybook/types';
import { useEffect, makeDecorator } from 'storybook/internal/preview-api';
import type { PartialStoryFn, Renderer } from 'storybook/internal/types';
import { actions } from './runtime/actions';
import { PARAM_KEY } from './constants';

2
code/addons/actions/src/loaders.ts
View File

@ -1,5 +1,5 @@
/* eslint-disable no-underscore-dangle */
import type { LoaderFunction } from '@storybook/types';
import type { LoaderFunction } from 'storybook/internal/types';
import { global } from '@storybook/global';
import type { onMockCall as onMockCallType } from '@storybook/test';
import { action } from './runtime';

6
code/addons/actions/src/manager.tsx
View File

@ -1,7 +1,7 @@
import React from 'react';
import { addons, types, useAddonState, useChannel } from '@storybook/manager-api';
import { STORY_CHANGED } from '@storybook/core-events';
import { Badge, Spaced } from '@storybook/components';
import { addons, types, useAddonState, useChannel } from 'storybook/internal/manager-api';
import { STORY_CHANGED } from 'storybook/internal/core-events';
import { Badge, Spaced } from 'storybook/internal/components';
import ActionLogger from './containers/ActionLogger';
import { ADDON_ID, CLEAR_ID, EVENT_ID, PANEL_ID, PARAM_KEY } from './constants';

4
code/addons/actions/src/runtime/__tests__/action.test.js
View File

@ -1,8 +1,8 @@
import { describe, it, expect, vi } from 'vitest';
import { addons } from '@storybook/preview-api';
import { addons } from 'storybook/internal/preview-api';
import { action, configureActions } from '../..';
vi.mock('@storybook/preview-api');
vi.mock('storybook/internal/preview-api');
const createChannel = () => {
const channel = { emit: vi.fn() };

4
code/addons/actions/src/runtime/__tests__/actions.test.js
View File

@ -1,8 +1,8 @@
import { describe, it, expect, vi } from 'vitest';
import { addons } from '@storybook/preview-api';
import { addons } from 'storybook/internal/preview-api';
import { actions } from '../..';
vi.mock('@storybook/preview-api');
vi.mock('storybook/internal/preview-api');
const createChannel = () => {
const channel = { emit: vi.fn() };

8
code/addons/actions/src/runtime/action.ts
View File

@ -1,9 +1,9 @@
import { v4 as uuidv4 } from 'uuid';
import type { PreviewWeb } from '@storybook/preview-api';
import { addons } from '@storybook/preview-api';
import type { Renderer } from '@storybook/types';
import type { PreviewWeb } from 'storybook/internal/preview-api';
import { addons } from 'storybook/internal/preview-api';
import type { Renderer } from 'storybook/internal/types';
import { global } from '@storybook/global';
import { ImplicitActionsDuringRendering } from '@storybook/core-events/preview-errors';
import { ImplicitActionsDuringRendering } from 'storybook/internal/preview-errors';
import { EVENT_ID } from '../constants';
import type { ActionDisplay, ActionOptions, HandlerFunction } from '../models';
import { config } from './configureActions';

2
code/addons/actions/src/typings.d.ts vendored
View File

@ -1 +1 @@
declare var FEATURES: import('@storybook/types').StorybookConfigRaw['features'];
declare var FEATURES: import('storybook/internal/types').StorybookConfigRaw['features'];

9
code/addons/backgrounds/package.json
View File

@ -61,17 +61,14 @@
"ts-dedent": "^2.0.0"
},
"devDependencies": {
"@storybook/client-logger": "workspace:*",
"@storybook/components": "workspace:*",
"@storybook/icons": "^1.2.5",
"@storybook/manager-api": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@storybook/theming": "workspace:*",
"@storybook/types": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/backgrounds/project.json
View File

@ -1,4 +1,5 @@
{
"name": "backgrounds",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

2
code/addons/backgrounds/src/components/ColorIcon.tsx
View File

@ -1,4 +1,4 @@
import { styled } from '@storybook/theming';
import { styled } from 'storybook/internal/theming';
export const ColorIcon = styled.span(
({ background }: { background: string }) => ({

6
code/addons/backgrounds/src/containers/BackgroundSelector.tsx
View File

@ -2,9 +2,9 @@ import type { FC } from 'react';
import React, { useState, Fragment, useCallback, useMemo, memo } from 'react';
import memoize from 'memoizerific';
import { useParameter, useGlobals } from '@storybook/manager-api';
import { logger } from '@storybook/client-logger';
import { IconButton, WithTooltip, TooltipLinkList } from '@storybook/components';
import { useParameter, useGlobals } from 'storybook/internal/manager-api';
import { logger } from 'storybook/internal/client-logger';
import { IconButton, WithTooltip, TooltipLinkList } from 'storybook/internal/components';
import { PhotoIcon } from '@storybook/icons';
import { PARAM_KEY as BACKGROUNDS_PARAM_KEY } from '../constants';

4
code/addons/backgrounds/src/containers/GridSelector.tsx
View File

@ -1,8 +1,8 @@
import type { FC } from 'react';
import React, { memo } from 'react';
import { useGlobals, useParameter } from '@storybook/manager-api';
import { IconButton } from '@storybook/components';
import { useGlobals, useParameter } from 'storybook/internal/manager-api';
import { IconButton } from 'storybook/internal/components';
import { GridIcon } from '@storybook/icons';
import { PARAM_KEY as BACKGROUNDS_PARAM_KEY } from '../constants';

8
code/addons/backgrounds/src/decorators/withBackground.ts
View File

@ -1,5 +1,9 @@
import { useMemo, useEffect } from '@storybook/preview-api';
import type { Renderer, PartialStoryFn as StoryFunction, StoryContext } from '@storybook/types';
import { useMemo, useEffect } from 'storybook/internal/preview-api';
import type {
Renderer,
PartialStoryFn as StoryFunction,
StoryContext,
} from 'storybook/internal/types';
import { PARAM_KEY as BACKGROUNDS_PARAM_KEY } from '../constants';
import {

8
code/addons/backgrounds/src/decorators/withGrid.ts
View File

@ -1,5 +1,9 @@
import { useMemo, useEffect } from '@storybook/preview-api';
import type { Renderer, PartialStoryFn as StoryFunction, StoryContext } from '@storybook/types';
import { useMemo, useEffect } from 'storybook/internal/preview-api';
import type {
Renderer,
PartialStoryFn as StoryFunction,
StoryContext,
} from 'storybook/internal/types';
import { clearStyles, addGridStyle } from '../helpers';
import { PARAM_KEY as BACKGROUNDS_PARAM_KEY } from '../constants';

2
code/addons/backgrounds/src/helpers/index.ts
View File

@ -1,7 +1,7 @@
import { global } from '@storybook/global';
import { dedent } from 'ts-dedent';
import { logger } from '@storybook/client-logger';
import { logger } from 'storybook/internal/client-logger';
import type { Background } from '../types';

2
code/addons/backgrounds/src/manager.tsx
View File

@ -1,5 +1,5 @@
import React, { Fragment } from 'react';
import { addons, types } from '@storybook/manager-api';
import { addons, types } from 'storybook/internal/manager-api';
import { ADDON_ID } from './constants';
import { BackgroundSelector } from './containers/BackgroundSelector';

2
code/addons/backgrounds/src/preview.tsx
View File

@ -1,4 +1,4 @@
import type { Addon_DecoratorFunction } from '@storybook/types';
import type { Addon_DecoratorFunction } from 'storybook/internal/types';
import { withBackground } from './decorators/withBackground';
import { withGrid } from './decorators/withGrid';
import { PARAM_KEY } from './constants';

13
code/addons/controls/package.json
View File

@ -51,24 +51,19 @@
"prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
},
"dependencies": {
"@storybook/blocks": "workspace:*",
"dequal": "^2.0.2",
"lodash": "^4.17.21",
"ts-dedent": "^2.0.0"
},
"devDependencies": {
"@storybook/client-logger": "workspace:*",
"@storybook/components": "workspace:*",
"@storybook/core-common": "workspace:*",
"@storybook/blocks": "workspace:*",
"@storybook/icons": "^1.2.5",
"@storybook/manager-api": "workspace:*",
"@storybook/node-logger": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@storybook/theming": "workspace:*",
"@storybook/types": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/controls/project.json
View File

@ -1,4 +1,5 @@
{
"name": "controls",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

6
code/addons/controls/src/ControlsPanel.tsx
View File

@ -7,10 +7,10 @@ import {
useArgTypes,
useParameter,
useStorybookState,
} from '@storybook/manager-api';
} from 'storybook/internal/manager-api';
import { PureArgsTable as ArgsTable, type PresetColor, type SortType } from '@storybook/blocks';
import { styled } from '@storybook/theming';
import type { ArgTypes } from '@storybook/types';
import { styled } from 'storybook/internal/theming';
import type { ArgTypes } from 'storybook/internal/types';
import { PARAM_KEY } from './constants';
import { SaveStory } from './SaveStory';

4
code/addons/controls/src/SaveStory.tsx
View File

@ -6,9 +6,9 @@ import {
Modal,
TooltipNote,
WithTooltip,
} from '@storybook/components';
} from 'storybook/internal/components';
import { AddIcon, CheckIcon, UndoIcon } from '@storybook/icons';
import { keyframes, styled } from '@storybook/theming';
import { keyframes, styled } from 'storybook/internal/theming';
import React from 'react';
const slideIn = keyframes({

15
code/addons/controls/src/manager.tsx
View File

@ -1,14 +1,19 @@
import React from 'react';
import { dequal as deepEqual } from 'dequal';
import { AddonPanel, Badge, Spaced } from '@storybook/components';
import { AddonPanel, Badge, Spaced } from 'storybook/internal/components';
import type {
ResponseData,
SaveStoryRequestPayload,
SaveStoryResponsePayload,
} from '@storybook/core-events';
import { SAVE_STORY_REQUEST, SAVE_STORY_RESPONSE } from '@storybook/core-events';
import { addons, experimental_requestResponse, types, useArgTypes } from '@storybook/manager-api';
import { color } from '@storybook/theming';
} from 'storybook/internal/core-events';
import { SAVE_STORY_REQUEST, SAVE_STORY_RESPONSE } from 'storybook/internal/core-events';
import {
addons,
experimental_requestResponse,
types,
useArgTypes,
} from 'storybook/internal/manager-api';
import { color } from 'storybook/internal/theming';
import { ControlsPanel } from './ControlsPanel';
import { ADDON_ID, PARAM_KEY } from './constants';
import type { Args } from '@storybook/csf';

2
code/addons/controls/src/preset/checkDocsLoaded.ts
View File

@ -1,4 +1,4 @@
import { checkAddonOrder, serverRequire } from '@storybook/core-common';
import { checkAddonOrder, serverRequire } from 'storybook/internal/common';
import path from 'path';
export const checkDocsLoaded = (configDir: string) => {

2
code/addons/controls/src/typings.d.ts vendored
View File

@ -7,7 +7,7 @@ declare var PREVIEW_URL: any;
declare var __STORYBOOK_ADDONS_MANAGER: any;
declare var RELEASE_NOTES_DATA: any;
declare var FEATURES: import('@storybook/types').StorybookConfigRaw['features'];
declare var FEATURES: import('storybook/internal/types').StorybookConfigRaw['features'];
declare var REFS: any;
declare var VERSIONCHECK: any;

2
code/addons/controls/template/stories/basics.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

2
code/addons/controls/template/stories/conditional.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

2
code/addons/controls/template/stories/disable.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

2
code/addons/controls/template/stories/filters.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

2
code/addons/controls/template/stories/issues.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

2
code/addons/controls/template/stories/matchers.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

2
code/addons/controls/template/stories/sorting.stories.ts
View File

@ -1,5 +1,5 @@
import { global as globalThis } from '@storybook/global';
import type { PartialStoryFn, StoryContext } from '@storybook/types';
import type { PartialStoryFn, StoryContext } from 'storybook/internal/types';
export default {
component: globalThis.Components.Pre,

11
code/addons/docs/package.json
View File

@ -101,16 +101,9 @@
"@babel/core": "^7.24.4",
"@mdx-js/react": "^3.0.0",
"@storybook/blocks": "workspace:*",
"@storybook/client-logger": "workspace:*",
"@storybook/components": "workspace:*",
"@storybook/csf-plugin": "workspace:*",
"@storybook/csf-tools": "workspace:*",
"@storybook/global": "^5.0.0",
"@storybook/node-logger": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@storybook/react-dom-shim": "workspace:*",
"@storybook/theming": "workspace:*",
"@storybook/types": "workspace:*",
"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
"fs-extra": "^11.1.0",
"react": "^16.8.0 || ^17.0.0 || ^18.0.0",
@ -122,12 +115,14 @@
"devDependencies": {
"@mdx-js/mdx": "^3.0.0",
"@rollup/pluginutils": "^5.0.2",
"@storybook/test": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^5.3.2",
"vite": "^4.0.4"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/docs/project.json
View File

@ -1,4 +1,5 @@
{
"name": "docs",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

7
code/addons/docs/src/DocsRenderer.tsx
View File

@ -1,7 +1,12 @@
import type { PropsWithChildren } from 'react';
import React, { Component } from 'react';
import { renderElement, unmountElement } from '@storybook/react-dom-shim';
import type { Renderer, Parameters, DocsContextProps, DocsRenderFunction } from '@storybook/types';
import type {
Renderer,
Parameters,
DocsContextProps,
DocsRenderFunction,
} from 'storybook/internal/types';
import { Docs, CodeOrSourceMdx, AnchorMdx, HeadersMdx } from '@storybook/blocks';
// TS doesn't like that we export a component with types that it doesn't know about (TS4203)

2
code/addons/docs/src/blocks.ts
View File

@ -1,4 +1,4 @@
import { deprecate } from '@storybook/client-logger';
import { deprecate } from 'storybook/internal/client-logger';
deprecate(
"Import from '@storybook/addon-docs/blocks' is deprecated. Please import from '@storybook/blocks' instead."

2
code/addons/docs/src/plugins/mdx-plugin.ts
View File

@ -1,4 +1,4 @@
import type { Options } from '@storybook/types';
import type { Options } from 'storybook/internal/types';
import type { Plugin } from 'vite';
import rehypeSlug from 'rehype-slug';
import rehypeExternalLinks from 'rehype-external-links';

48
code/addons/docs/src/preset.ts
View File

@ -2,9 +2,9 @@ import { dirname, join, isAbsolute } from 'path';
import rehypeSlug from 'rehype-slug';
import rehypeExternalLinks from 'rehype-external-links';
import type { DocsOptions, Options, PresetProperty } from '@storybook/types';
import type { DocsOptions, Options, PresetProperty } from 'storybook/internal/types';
import type { CsfPluginOptions } from '@storybook/csf-plugin';
import { logger } from '@storybook/node-logger';
import { logger } from 'storybook/internal/node-logger';
import type { CompileOptions } from './compiler';
/**
@ -62,6 +62,16 @@ async function webpack(
const { react, reactDom, mdx } = await getResolvedReact(options);
let alias;
/** Add aliases for `@storybook/addon-docs` & `@storybook/blocks`
* These must be singletons to avoid multiple instances of react & emotion being loaded, both would cause the components to fail to render.
*
* In the future the `@storybook/theming` and `@storybook/components` can be removed, as they should be singletons in the future due to the peerDependency on `storybook` package.
*/
const cliPath = require.resolve('storybook/package.json');
const themingPath = join(cliPath, '..', 'core', 'theming', 'index.js');
const componentsPath = join(cliPath, '..', 'core', 'components', 'index.js');
const blocksPath = dirname(require.resolve('@storybook/blocks/package.json'));
if (Array.isArray(webpackConfig.resolve?.alias)) {
alias = [...webpackConfig.resolve?.alias];
alias.push(
@ -76,12 +86,28 @@ async function webpack(
{
name: '@mdx-js/react',
alias: mdx,
},
{
name: '@storybook/theming',
alias: themingPath,
},
{
name: '@storybook/components',
alias: componentsPath,
},
{
name: '@storybook/blocks',
alias: blocksPath,
}
);
} else {
alias = {
...webpackConfig.resolve?.alias,
react,
'@storybook/theming': themingPath,
'@storybook/components': componentsPath,
'@storybook/blocks': blocksPath,
'react-dom': reactDom,
'@mdx-js/react': mdx,
};
@ -140,6 +166,11 @@ export const viteFinal = async (config: any, options: Options) => {
// Use the resolvedReact preset to alias react and react-dom to either the users version or the version shipped with addon-docs
const { react, reactDom, mdx } = await getResolvedReact(options);
const cliPath = dirname(require.resolve('storybook/package.json'));
const themingPath = join(cliPath, 'core', 'theming', 'index.js');
const componentsPath = join(cliPath, 'core', 'components', 'index.js');
const blocksPath = dirname(require.resolve('@storybook/blocks/package.json'));
const packageDeduplicationPlugin = {
name: 'storybook:package-deduplication',
enforce: 'pre',
@ -151,13 +182,14 @@ export const viteFinal = async (config: any, options: Options) => {
...(isAbsolute(reactDom) && { 'react-dom/server': `${reactDom}/server.browser.js` }),
'react-dom': reactDom,
'@mdx-js/react': mdx,
/**
* The following aliases are used to ensure a single instance of these packages are used in situations where they are duplicated
* The packages will be duplicated by the package manager when the user has react installed with another version than 18.2.0
/** Add aliases for `@storybook/addon-docs` & `@storybook/blocks`
* These must be singletons to avoid multiple instances of react & emotion being loaded, both would cause the components to fail to render.
*
* In the future the `@storybook/theming` and `@storybook/components` can be removed, as they should be singletons in the future due to the peerDependency on `storybook` package.
*/
'@storybook/theming': dirname(require.resolve('@storybook/theming')),
'@storybook/components': dirname(require.resolve('@storybook/components')),
'@storybook/blocks': dirname(require.resolve('@storybook/blocks')),
'@storybook/theming': themingPath,
'@storybook/components': componentsPath,
'@storybook/blocks': blocksPath,
},
},
}),

2
code/addons/docs/src/preview.ts
View File

@ -1,4 +1,4 @@
import type { PreparedStory } from '@storybook/types';
import type { PreparedStory } from 'storybook/internal/types';
import { global } from '@storybook/global';
const excludeTags = Object.entries(global.TAGS_OPTIONS ?? {}).reduce(

4
code/addons/docs/src/typings.d.ts vendored
View File

@ -6,8 +6,8 @@ declare module 'sveltedoc-parser' {
export function parse(options: any): Promise<any>;
}
declare var FEATURES: import('@storybook/types').StorybookConfigRaw['features'];
declare var FEATURES: import('storybook/internal/types').StorybookConfigRaw['features'];
declare var LOGLEVEL: 'trace' | 'debug' | 'info' | 'warn' | 'error' | 'silent' | undefined;
declare var TAGS_OPTIONS: import('@storybook/types').TagsOptions;
declare var TAGS_OPTIONS: import('storybook/internal/types').TagsOptions;

4
code/addons/docs/template/stories/docspage/source.stories.ts vendored
View File

@ -1,6 +1,6 @@
import { global as globalThis } from '@storybook/global';
import type { StoryContext } from '@storybook/types';
import dedent from 'ts-dedent';
import type { StoryContext } from 'storybook/internal/types';
import { dedent } from 'ts-dedent';
export default {
component: globalThis.Components.Button,

7
code/addons/essentials/package.json
View File

@ -98,15 +98,14 @@
"@storybook/addon-outline": "workspace:*",
"@storybook/addon-toolbars": "workspace:*",
"@storybook/addon-viewport": "workspace:*",
"@storybook/core-common": "workspace:*",
"@storybook/manager-api": "workspace:*",
"@storybook/node-logger": "workspace:*",
"@storybook/preview-api": "workspace:*",
"ts-dedent": "^2.0.0"
},
"devDependencies": {
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/essentials/project.json
View File

@ -1,4 +1,5 @@
{
"name": "essentials",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

4
code/addons/essentials/src/index.ts
View File

@ -1,6 +1,6 @@
import path from 'path';
import { logger } from '@storybook/node-logger';
import { serverRequire } from '@storybook/core-common';
import { logger } from 'storybook/internal/node-logger';
import { serverRequire } from 'storybook/internal/common';
interface PresetOptions {
/**

4
code/addons/gfm/package.json
View File

@ -44,13 +44,15 @@
"prep": "node --loader ../../../scripts/node_modules/esbuild-register/loader.js -r ../../../scripts/node_modules/esbuild-register/register.js ../../../scripts/prepare/addon-bundle.ts"
},
"dependencies": {
"@storybook/node-logger": "workspace:*",
"remark-gfm": "^4.0.0",
"ts-dedent": "^2.0.0"
},
"devDependencies": {
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/gfm/project.json
View File

@ -1,4 +1,5 @@
{
"name": "gfm",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

2
code/addons/gfm/src/index.ts
View File

@ -1,5 +1,5 @@
import { dedent } from 'ts-dedent';
import { deprecate } from '@storybook/node-logger';
import { deprecate } from 'storybook/internal/node-logger';
import remarkGfm from 'remark-gfm';

5
code/addons/highlight/package.json
View File

@ -55,11 +55,12 @@
"@storybook/global": "^5.0.0"
},
"devDependencies": {
"@storybook/core-events": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@types/webpack-env": "^1.16.0",
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/highlight/project.json
View File

@ -1,4 +1,5 @@
{
"name": "highlight",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

4
code/addons/highlight/src/preview.ts
View File

@ -1,7 +1,7 @@
/* eslint-env browser */
import { global } from '@storybook/global';
import { addons } from '@storybook/preview-api';
import { STORY_CHANGED } from '@storybook/core-events';
import { addons } from 'storybook/internal/preview-api';
import { STORY_CHANGED } from 'storybook/internal/core-events';
import { HIGHLIGHT, RESET_HIGHLIGHT, HIGHLIGHT_STYLE_ID } from './constants';
const { document } = global;

12
code/addons/interactions/package.json
View File

@ -55,27 +55,21 @@
"dependencies": {
"@storybook/global": "^5.0.0",
"@storybook/instrumenter": "workspace:*",
"@storybook/test": "workspace:*",
"@storybook/types": "workspace:*",
"polished": "^4.2.2",
"ts-dedent": "^2.2.0"
},
"devDependencies": {
"@devtools-ds/object-inspector": "^1.1.2",
"@storybook/client-logger": "workspace:*",
"@storybook/components": "workspace:*",
"@storybook/core-common": "workspace:*",
"@storybook/core-events": "workspace:*",
"@storybook/icons": "^1.2.5",
"@storybook/manager-api": "workspace:*",
"@storybook/preview-api": "workspace:*",
"@storybook/theming": "workspace:*",
"@types/node": "^18.0.0",
"formik": "^2.2.9",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"typescript": "^5.3.2"
},
"peerDependencies": {
"storybook": "workspace:^"
},
"publishConfig": {
"access": "public"
},

1
code/addons/interactions/project.json
View File

@ -1,4 +1,5 @@
{
"name": "interactions",
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "library",
"targets": {

2
code/addons/interactions/src/Panel.test.ts
View File

@ -1,3 +1,5 @@
// @vitest-environment happy-dom
import { describe, it, expect } from 'vitest';
import { type Call, CallStates, type LogItem } from '@storybook/instrumenter';
import { getInteractions } from './Panel';

4
code/addons/interactions/src/Panel.tsx
View File

@ -1,14 +1,14 @@
import { global } from '@storybook/global';
import type { Dispatch, SetStateAction } from 'react';
import React, { Fragment, memo, useEffect, useMemo, useRef, useState } from 'react';
import { useAddonState, useChannel, useParameter } from '@storybook/manager-api';
import { useAddonState, useChannel, useParameter } from 'storybook/internal/manager-api';
import {
FORCE_REMOUNT,
STORY_RENDER_PHASE_CHANGED,
STORY_THREW_EXCEPTION,
PLAY_FUNCTION_THREW_EXCEPTION,
UNHANDLED_ERRORS_WHILE_PLAYING,
} from '@storybook/core-events';
} from 'storybook/internal/core-events';
import { EVENTS, type Call, CallStates, type LogItem } from '@storybook/instrumenter';
import { InteractionsPanel } from './components/InteractionsPanel';

6
code/addons/interactions/src/components/EmptyState.tsx
View File

@ -1,8 +1,8 @@
import React, { useEffect, useState } from 'react';
import { Link, EmptyTabContent } from '@storybook/components';
import { Link, EmptyTabContent } from 'storybook/internal/components';
import { DocumentIcon, VideoIcon } from '@storybook/icons';
import { useStorybookApi } from '@storybook/manager-api';
import { styled } from '@storybook/theming';
import { useStorybookApi } from 'storybook/internal/manager-api';
import { styled } from 'storybook/internal/theming';
import { DOCUMENTATION_LINK, TUTORIAL_VIDEO_LINK } from '../constants';

2
code/addons/interactions/src/components/Interaction.stories.tsx
View File

@ -9,7 +9,7 @@ import SubnavStories from './Subnav.stories';
type Story = StoryObj<typeof Interaction>;
export default {
title: 'Addons/Interactions/Interaction',
title: 'Interaction',
component: Interaction,
args: {
callsById: new Map(getCalls(CallStates.DONE).map((call) => [call.id, call])),

Some files were not shown because too many files have changed in this diff Show More