Skip to content

Commit 548e78a

Browse files
Merge branch 'next' into fix-storybook-useArgs-25070
2 parents 887946e + 1abc1a5 commit 548e78a

File tree

217 files changed

+3680
-1115
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

217 files changed

+3680
-1115
lines changed

.github/workflows/generate-sandboxes.yml

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ name: Generate and publish sandboxes
22

33
on:
44
schedule:
5-
- cron: "2 2 */1 * *"
5+
- cron: '2 2 */1 * *'
66
workflow_dispatch:
77
# To test fixes on push rather than wait for the scheduling, do the following:
88
# 1. Uncomment the lines below and add your branch.
@@ -14,8 +14,8 @@ on:
1414
# 4. 👉 DON'T FORGET TO UNDO THE STEPS BEFORE YOU MERGE YOUR CHANGES!
1515

1616
env:
17-
YARN_ENABLE_IMMUTABLE_INSTALLS: "false"
18-
CLEANUP_SANDBOX_NODE_MODULES: "true"
17+
YARN_ENABLE_IMMUTABLE_INSTALLS: 'false'
18+
CLEANUP_SANDBOX_NODE_MODULES: 'true'
1919

2020
defaults:
2121
run:
@@ -32,7 +32,7 @@ jobs:
3232

3333
- uses: actions/setup-node@v4
3434
with:
35-
node-version-file: ".nvmrc"
35+
node-version-file: '.nvmrc'
3636

3737
- name: Setup git user
3838
run: |
@@ -84,7 +84,7 @@ jobs:
8484

8585
- uses: actions/setup-node@v4
8686
with:
87-
node-version-file: ".nvmrc"
87+
node-version-file: '.nvmrc'
8888

8989
- name: Setup git user
9090
run: |

.github/workflows/publish.yml

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,17 @@ jobs:
189189
git commit -m "Update $VERSION_FILE for v${{ steps.version.outputs.current-version }}"
190190
git push origin main
191191
192+
- name: Create Sentry release
193+
if: steps.publish-needed.outputs.published == 'false'
194+
uses: sentry/action-release@v2
195+
env:
196+
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
197+
SENTRY_ORG: ${{ secrets.SENTRY_ORG }}
198+
SENTRY_PROJECT: ${{ secrets.SENTRY_PROJECT }}
199+
with:
200+
release: ${{ steps.version.outputs.current-version }}
201+
environment: ${{ steps.is-prerelease.outputs.prerelease == 'true' && 'prerelease' || 'latest' }}
202+
192203
- name: Report job failure to Discord
193204
if: failure()
194205
env:

.kiro/steering/product.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
# Product Overview
2+
3+
Storybook is a frontend workshop for building UI components and pages in isolation. It's a tool for UI development, testing, and documentation that supports multiple frameworks including React, Angular, Vue, Svelte, and many others.
4+
5+
## Core Purpose
6+
7+
- Build bulletproof UI components faster
8+
- Develop UI components in isolation
9+
- Create comprehensive documentation for components
10+
- Enable visual testing and interaction testing
11+
- Support component-driven development workflows
12+
13+
## Key Features
14+
15+
- Multi-framework support (React, Angular, Vue, Svelte, etc.)
16+
- Extensive addon ecosystem for enhanced functionality
17+
- Built-in documentation generation
18+
- Visual testing capabilities
19+
- Component story format (CSF) for organizing examples
20+
- Hot module reloading for fast development
21+
22+
## Target Users
23+
24+
- Frontend developers building component libraries
25+
- Design system teams
26+
- UI/UX designers collaborating with developers
27+
- QA teams performing visual testing
28+
- Documentation writers creating component guides

.kiro/steering/structure.md

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
# Project Structure
2+
3+
## Repository Layout
4+
5+
This is a monorepo with the main codebase in the `code/` directory and supporting files at the root level.
6+
7+
```ascii
8+
storybook/
9+
├── code/ # Main codebase (Nx workspace)
10+
│ ├── addons/ # Storybook addons (a11y, docs, jest, etc.)
11+
│ ├── builders/ # Build system integrations
12+
│ ├── core/ # Core Storybook UI and API
13+
│ ├── frameworks/ # Framework-specific implementations
14+
│ ├── lib/ # CLI tools and utilities
15+
│ ├── presets/ # Configuration presets
16+
│ ├── renderers/ # Framework renderers
17+
│ └── sandbox/ # Development sandboxes
18+
├── docs/ # Documentation source files
19+
├── scripts/ # Build and automation scripts
20+
├── test-storybooks/ # Integration test projects
21+
└── sandbox/ # Generated sandbox environments
22+
```
23+
24+
## Code Organization
25+
26+
### Core Packages (`code/`)
27+
28+
- **`core/`**: Main Storybook application (manager UI, preview, server)
29+
- **`addons/`**: Official addons (a11y, docs, jest, links, etc.)
30+
- **`frameworks/`**: Framework-specific integrations (angular, nextjs, sveltekit), usually a combination of a renderer and a builder
31+
- **`renderers/`**: Pure framework renderers (react, vue3, svelte)
32+
- **`builders/`**: Build tool integrations (vite, webpack5)
33+
- **`lib/`**: Utilities and CLI tools (cli-sb, codemod, create-storybook)
34+
- **`presets/`**: Webpack configuration presets for popular setups
35+
36+
### Package Naming Conventions
37+
38+
- Renderer packages: `@storybook/{renderer}` (e.g., `@storybook/react`)
39+
- Framework + builder: `@storybook/{renderer}-{builder}` OR `@storybook/{framework}` (e.g., `@storybook/react-vite`, `@storybook/sveltekit`)
40+
- Addons: `@storybook/addon-{name}` (e.g., `@storybook/addon-docs`)
41+
- Builders: `@storybook/builder-{name}` (e.g., `@storybook/builder-vite`)
42+
- Presets: `@storybook/preset-{name}` (e.g., `@storybook/preset-create-react-app`)
43+
44+
## File Conventions
45+
46+
### TypeScript Configuration
47+
48+
- Strict TypeScript with `noImplicitAny: true`
49+
- Module resolution: `bundler` mode
50+
- Target: `ES2020`
51+
- JSX: `preserve` mode
52+
53+
### Code Style
54+
55+
- **Prettier**: 100 character line width, single quotes, trailing commas
56+
- **Import Order**: Node modules → testing → React → Storybook internal → third-party → relative
57+
- **File Extensions**: Prefer `.ts`/`.tsx` over `.js`/`.jsx`
58+
- **Naming**: Use kebab-case for files, PascalCase for components
59+
60+
### Testing Structure
61+
62+
- **Unit Tests**: `*.test.ts` files alongside source code
63+
- **E2E Tests**: `code/e2e-tests/` directory with Playwright
64+
- **Stories**: `*.stories.ts` files for component examples
65+
- **Mocks**: `__mocks__/` directories for test fixtures
66+
67+
### Documentation
68+
69+
- **API Docs**: JSDoc comments with TSDoc format
70+
- **README**: Each package should have comprehensive README
71+
- **Stories**: Use Component Story Format (CSF) 3.0
72+
- **Migration Guides**: Document breaking changes
73+
74+
## Development Patterns
75+
76+
### Monorepo Workflow
77+
78+
1. All development happens in `code/` directory
79+
2. Use `yarn build --watch` for active development
80+
3. Nx handles dependency graph and caching
81+
4. All packages are versioned and released together
82+
83+
### Package Dependencies
84+
85+
- **Internal**: Use `workspace:*` for internal package references
86+
- **Peer Dependencies**: Framework packages are peer dependencies
87+
- **Dev Dependencies**: Testing and build tools in root package.json
88+
89+
### Build Outputs
90+
91+
- **`dist/`**: Compiled JavaScript and type definitions
92+
- **`template/`**: Framework-specific template files
93+
- **`*.d.ts`**: TypeScript declaration files
94+
95+
### Sandbox Development
96+
97+
- Use `yarn start` for quick React TypeScript sandbox
98+
- Use `yarn task` for custom framework/template selection
99+
- Sandboxes are generated in `sandbox/` directory
100+
- Link mode connects to local packages for development

.kiro/steering/tech.md

Lines changed: 113 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,113 @@
1+
# Technology Stack
2+
3+
## Build System & Package Management
4+
5+
- **Monorepo**: Managed with Nx for build orchestration and caching
6+
- **Package Manager**: Yarn 4 with workspaces
7+
- **Node.js**: Version 22+ (specified in .nvmrc)
8+
- **Build Tool**: Custom build scripts with esbuild and Vite integration
9+
10+
## Core Technologies
11+
12+
- **TypeScript**: Primary language with strict configuration
13+
- **React**: Main UI framework for Storybook's own interface
14+
- **Vite**: Build tool and dev server for modern frameworks
15+
- **Webpack 5**: Alternative bundler support
16+
- **ESBuild**: Fast JavaScript bundler and minifier
17+
18+
## Testing & Quality
19+
20+
- **Vitest**: Primary test runner with coverage via Istanbul
21+
- **Playwright**: End-to-end testing framework
22+
- **ESLint**: Code linting with extensive custom rules
23+
- **Prettier**: Code formatting with custom plugins
24+
- **Chromatic**: Visual testing and review
25+
26+
## Development Workflow
27+
28+
- **Hot Module Reloading**: Fast development feedback
29+
- **Watch Mode**: Automatic rebuilds during development
30+
- **Parallel Builds**: Nx orchestrates parallel package builds
31+
- **Caching**: Aggressive build and test caching via Nx
32+
33+
## Common Commands
34+
35+
### Development
36+
37+
```bash
38+
# Start development environment with React TypeScript sandbox
39+
yarn start
40+
41+
# Start with custom template selection
42+
yarn task
43+
44+
# Build specific packages in watch mode
45+
cd code && yarn build --watch <package-names>
46+
47+
# Run Storybook UI development server
48+
yarn storybook:ui
49+
50+
# Create a standalone sandbox to develop against a specific framework
51+
yarn task --task sandbox
52+
```
53+
54+
### Testing
55+
56+
```bash
57+
# Run all tests
58+
yarn test
59+
60+
# Run tests in watch mode
61+
yarn test:watch
62+
63+
# Run specific package tests
64+
yarn nx test <package-name>
65+
66+
# Run E2E tests
67+
yarn playwright test
68+
```
69+
70+
### Building
71+
72+
```bash
73+
# Build all packages
74+
yarn build
75+
76+
# Build in production mode (required for Angular)
77+
yarn build --prod
78+
79+
# Build with watch mode
80+
yarn build --watch
81+
82+
# Build specific packages
83+
yarn build <package-1> <package-2>
84+
```
85+
86+
### Linting & Formatting
87+
88+
```bash
89+
# Lint JavaScript/TypeScript
90+
yarn lint:js
91+
92+
# Lint markdown and code samples
93+
yarn lint:md
94+
95+
# Auto-fix linting issues
96+
yarn lint:js --fix
97+
98+
# Format code with Prettier
99+
yarn lint:prettier
100+
```
101+
102+
## Framework Support
103+
104+
Storybook supports multiple frontend frameworks through dedicated packages:
105+
106+
- React (react, react-vite, react-webpack5)
107+
- Angular (angular)
108+
- Vue (vue3, vue3-vite)
109+
- Svelte (svelte, svelte-vite, sveltekit)
110+
- Web Components (web-components, web-components-vite)
111+
- HTML (html, html-vite)
112+
- Preact (preact, preact-vite)
113+
- Next.js (nextjs, nextjs-vite)

CHANGELOG.md

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,23 @@
1+
## 9.1.5
2+
3+
- CSF: Support `satisfies x as y` syntax - [#32169](https://github.com/storybookjs/storybook/pull/32169), thanks @diagramatics!
4+
- Vitest addon: Handle Playwright installation errors gracefully - [#32329](https://github.com/storybookjs/storybook/pull/32329), thanks @ndelangen!
5+
6+
## 9.1.4
7+
8+
- Angular: Properly merge builder options and browserTarget options - [#32272](https://github.com/storybookjs/storybook/pull/32272), thanks @kroeder!
9+
- Core: Optimize bundlesize, by reusing internal/babel in mocking-utils - [#32350](https://github.com/storybookjs/storybook/pull/32350), thanks @ndelangen!
10+
- Svelte & Vue: Add framework-specific `docgen` option to disable docgen processing - [#32319](https://github.com/storybookjs/storybook/pull/32319), thanks @copilot-swe-agent!
11+
- Svelte: Support `@sveltejs/vite-plugin-svelte` v6 - [#32320](https://github.com/storybookjs/storybook/pull/32320), thanks @JReinhold!
12+
13+
## 9.1.3
14+
15+
- Docs: Move button in ArgsTable heading to fix screenreader announcements - [#32238](https://github.com/storybookjs/storybook/pull/32238), thanks @Sidnioulz!
16+
- Mock: Catch errors when transforming preview files - [#32216](https://github.com/storybookjs/storybook/pull/32216), thanks @valentinpalkovic!
17+
- Next.js: Fix version mismatch error in Webpack - [#32306](https://github.com/storybookjs/storybook/pull/32306), thanks @valentinpalkovic!
18+
- Telemetry: Disambiguate traffic coming from error/upgrade links - [#32287](https://github.com/storybookjs/storybook/pull/32287), thanks @shilman!
19+
- Telemetry: Disambiguate unattributed traffic from Onboarding - [#32286](https://github.com/storybookjs/storybook/pull/32286), thanks @shilman!
20+
121
## 9.1.2
222

323
- Addon Docs: Fix Symbol conversion issue in docs page and controls panel - [#32220](https://github.com/storybookjs/storybook/pull/32220), thanks @yannbf!

CHANGELOG.prerelease.md

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,31 @@
1+
## 10.0.0-beta.2
2+
3+
- Build: Fix dts bundling external detection - [#32366](https://github.com/storybookjs/storybook/pull/32366), thanks @mrginglymus!
4+
- Codemod: Replace `globby` with `tinyglobby` - [#31407](https://github.com/storybookjs/storybook/pull/31407), thanks @benmccann!
5+
- Next.js-vite: Use `fileURLToPath` for module resolution in preset - [#32386](https://github.com/storybookjs/storybook/pull/32386), thanks @ndelangen!
6+
- Tags: Remove undocumented x-only tags - [#32360](https://github.com/storybookjs/storybook/pull/32360), thanks @shilman!
7+
- Vitest addon: Handle Playwright installation errors gracefully - [#32329](https://github.com/storybookjs/storybook/pull/32329), thanks @ndelangen!
8+
9+
## 10.0.0-beta.1
10+
11+
- AddonA11Y: Fix postinstall - [#32309](https://github.com/storybookjs/storybook/pull/32309), thanks @ndelangen!
12+
- Angular: Properly merge builder options and browserTarget options - [#32272](https://github.com/storybookjs/storybook/pull/32272), thanks @kroeder!
13+
- Core: Optimize bundlesize, by reusing internal/babel in mocking-utils - [#32350](https://github.com/storybookjs/storybook/pull/32350), thanks @ndelangen!
14+
- Core: Update tags filter UI - [#32343](https://github.com/storybookjs/storybook/pull/32343), thanks @ghengeveld!
15+
- Next.js: Avoid multiple webpack versions at runtime - [#32313](https://github.com/storybookjs/storybook/pull/32313), thanks @valentinpalkovic!
16+
- Next.js: Fix version mismatch error in Webpack - [#32306](https://github.com/storybookjs/storybook/pull/32306), thanks @valentinpalkovic!
17+
- Svelte & Vue: Add framework-specific `docgen` option to disable docgen processing - [#32319](https://github.com/storybookjs/storybook/pull/32319), thanks @copilot-swe-agent!
18+
- Svelte: Support `@sveltejs/vite-plugin-svelte` v6 - [#32320](https://github.com/storybookjs/storybook/pull/32320), thanks @JReinhold!
19+
- Update: Satellite repos after major version bump - [#32303](https://github.com/storybookjs/storybook/pull/32303), thanks @ndelangen!
20+
21+
## 10.0.0-beta.0
22+
23+
- Core: Fix staticCopy not copying `index.html` to sub directory - [#32259](https://github.com/storybookjs/storybook/pull/32259), thanks @ndelangen!
24+
- Core: Remove CJS bundles, only ship ESM - [#31819](https://github.com/storybookjs/storybook/pull/31819), thanks @ndelangen!
25+
- Docs: Move button in ArgsTable heading to fix screenreader announcements - [#32238](https://github.com/storybookjs/storybook/pull/32238), thanks @Sidnioulz!
26+
- Telemetry: Disambiguate traffic coming from error/upgrade links - [#32287](https://github.com/storybookjs/storybook/pull/32287), thanks @shilman!
27+
- Telemetry: Disambiguate unattributed traffic from Onboarding - [#32286](https://github.com/storybookjs/storybook/pull/32286), thanks @shilman!
28+
129
## 9.2.0-alpha.3
230

331
- Addon Docs: Fix Symbol conversion issue in docs page and controls panel - [#32220](https://github.com/storybookjs/storybook/pull/32220), thanks @yannbf!

MIGRATION.md

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
- [Node.js 20.19+ or 22.12+ required](#nodejs-2019-or-2212-required)
88
- [Require `tsconfig.json` `moduleResolution` set to value that supports `types` condition](#require-tsconfigjson-moduleresolution-set-to-value-that-supports-types-condition)
99
- [`core.builder` configuration must be a fully resolved path](#corebuilder-configuration-must-be-a-fully-resolved-path)
10+
- [Removed x-only builtin tags](#removed-x-only-builtin-tags)
1011
- [From version 8.x to 9.0.0](#from-version-8x-to-900)
1112
- [Core Changes and Removals](#core-changes-and-removals)
1213
- [Dropped support for legacy packages](#dropped-support-for-legacy-packages)
@@ -580,6 +581,10 @@ export const core = {
580581
};
581582
```
582583

584+
#### Removed x-only builtin tags
585+
During development of Storybook [Tags](https://storybook.js.org/docs/writing-stories/tags), we created `dev-only`, `docs-only`, and `test-only` built-in tags. These tags were never documented and superseded by the currently-documented `dev`, `autodocs`, and `test` tags which provide more precise control. The outdated `x-only` tags are removed in 10.0.
586+
During development of Storybook [Tags](https://storybook.js.org/docs/writing-stories/tags), we created `dev-only`, `docs-only`, and `test-only` built-in tags. These tags were never documented and superceded by the currently-documented `dev`, `autodocs`, and `test` tags which provide more precise control. The outdated `x-only` tags are removed in 10.0.
587+
583588
## From version 8.x to 9.0.0
584589

585590
### Core Changes and Removals
@@ -1806,7 +1811,7 @@ These sections explain the rationale, and the required changes you might have to
18061811

18071812
### Deprecated `@storybook/testing-library` package
18081813

1809-
The `@storybook/testing-library` package has been deprecated with the release of Storybook 8.0, and we recommend using the `@storybook/test` package instead. If you're migrating manually, you'll need to install the new package and update your imports as follows:
1814+
The `@storybook/testing-library` package has been deprecated with the release of Storybook 8.0, and we recommend using the `@storybook/test` package instead. If you're migrating manually, you'll need to install the new package and update your imports as follows:
18101815

18111816
```diff
18121817
- import { userEvent } from '@storybook/testing-library';

0 commit comments

Comments
 (0)