Merge branch 'next' into fix/stats-json-in-angular-executor

.circleci/config.yml

@@ -211,6 +211,57 @@ jobs:
             yarn knip --no-exit-code
       - report-workflow-on-failure
       - cancel-workflow-on-failure
+  bench-packages:
+    executor:
+      class: medium
+      name: sb_node_22_classic
+    steps:
+      - git-shallow-clone/checkout_advanced:
+          clone_options: "--depth 1 --verbose"
+      - attach_workspace:
+          at: .
+      # if there is a base branch AND a PR number in parameters, benchmark packages against those
+      # this happens when run against a PR
+      - when:
+          condition:
+            and:
+              - << pipeline.parameters.ghBaseBranch >>
+              - << pipeline.parameters.ghPrNumber >>
+          steps:
+            - run:
+                name: Benchmarking packages against base branch
+                working_directory: scripts
+                command: |
+                  yarn local-registry --open &
+                  until curl -s http://localhost:6001 > /dev/null; do
+                    echo 'Waiting for local registry to be available...'
+                    sleep 2
+                  done
+                  yarn bench-packages --base-branch << pipeline.parameters.ghBaseBranch >> --pull-request << pipeline.parameters.ghPrNumber >> --upload
+      # if there is a NOT a base branch OR NOT a PR number in parameters, just upload benchmarks for the branch
+      # this happens when runned directly on branches, like next or main
+      - when:
+          condition:
+            or:
+              - not: << pipeline.parameters.ghBaseBranch >>
+              - not: << pipeline.parameters.ghPrNumber >>
+          steps:
+            - run:
+                name: Uploading package benchmarks for branch
+                working_directory: scripts
+                command: |
+                  yarn local-registry --open &
+                  until curl -s http://localhost:6001 > /dev/null; do
+                    echo 'Waiting for local registry to be available...'
+                    sleep 2
+                  done
+                  yarn bench-packages --upload
+      - store_artifacts:
+          path: bench/packages/results.json
+      - store_artifacts:
+          path: bench/packages/compare-with-<< pipeline.parameters.ghBaseBranch >>.json
+      - report-workflow-on-failure
+      - cancel-workflow-on-failure
   check:
     executor:
       class: xlarge
@@ -543,7 +594,7 @@ jobs:
       - store_artifacts: # this is where playwright puts more complex stuff
           path: code/playwright-results/
           destination: playwright
-  bench:
+  bench-sandboxes:
     parameters:
       parallelism:
         type: integer
@@ -753,6 +804,9 @@ workflows:
       - knip:
           requires:
             - build
+      - bench-packages:
+          requires:
+            - build
       - check:
           requires:
             - build
@@ -799,7 +853,7 @@ workflows:
           parallelism: 5
           requires:
             - create-sandboxes
-      - bench:
+      - bench-sandboxes:
           parallelism: 5
           requires:
             - build-sandboxes
@@ -828,6 +882,9 @@ workflows:
       - knip:
           requires:
             - build
+      - bench-packages:
+          requires:
+            - build
       - check:
           requires:
             - build
@@ -883,7 +940,7 @@ workflows:
       - test-ui-testing-module:
           requires:
             - build
-      - bench:
+      - bench-sandboxes:
           parallelism: 5
           requires:
             - build-sandboxes
@@ -904,6 +961,9 @@ workflows:
       - knip:
           requires:
             - build
+      - bench-packages:
+          requires:
+            - build
       - check:
           requires:
             - build
@@ -977,7 +1037,7 @@ workflows:
                 # --smoke-test is not supported for the angular builder right now
                 # - "angular-cli"
                 - "lit-vite-ts"
-      - bench:
+      - bench-sandboxes:
           parallelism: 5
           requires:
             - build-sandboxes

CHANGELOG.md

@@ -1,3 +1,27 @@
+## 8.4.5
+
+- Angular: Support v19 - [#29659](https://github.com/storybookjs/storybook/pull/29659), thanks @leosvelperez!
+- CLI: Disable corepack auto pin behavior - [#29627](https://github.com/storybookjs/storybook/pull/29627), thanks @yannbf!
+- CLI: Fix qwik init - [#29632](https://github.com/storybookjs/storybook/pull/29632), thanks @shilman!
+- Nextjs-Vite: Add Next.js 15 support - [#29640](https://github.com/storybookjs/storybook/pull/29640), thanks @yannbf!
+
+## 8.4.4
+
+- Addon Test: Only optimize react deps if applicable in vitest-plugin - [#29617](https://github.com/storybookjs/storybook/pull/29617), thanks @yannbf!
+
+## 8.4.3
+
+- Addon Test: Optimize internal dependencies - [#29595](https://github.com/storybookjs/storybook/pull/29595), thanks @yannbf!
+- Next.js: Add support for Next 15 - [#29587](https://github.com/storybookjs/storybook/pull/29587), thanks @yannbf!
+
+## 8.4.2
+
+- Addon Test: Fix post-install logic for Next.js Vite framework support - [#29524](https://github.com/storybookjs/storybook/pull/29524), thanks @valentinpalkovic!
+- Addon Test: Only render the TestingModule component in development mode - [#29501](https://github.com/storybookjs/storybook/pull/29501), thanks @yannbf!
+- CLI: Fix Solid init by installing `@storybook/test` - [#29514](https://github.com/storybookjs/storybook/pull/29514), thanks @shilman!
+- Core: Shim CJS-only globals in ESM output - [#29157](https://github.com/storybookjs/storybook/pull/29157), thanks @valentinpalkovic!
+- Next.js: Fix bundled react and react-dom in monorepos - [#29444](https://github.com/storybookjs/storybook/pull/29444), thanks @sentience!
+
 ## 8.4.1
 
 - Core: Relax peer dep constraint of shim packages - [#29503](https://github.com/storybookjs/storybook/pull/29503), thanks @kasperpeulen!

CHANGELOG.prerelease.md

@@ -1,3 +1,40 @@
+## 8.5.0-alpha.9
+
+- Angular: Support v19 - [#29659](https://github.com/storybookjs/storybook/pull/29659), thanks @leosvelperez!
+- Manager: Fix size regression - [#29660](https://github.com/storybookjs/storybook/pull/29660), thanks @JReinhold!
+- Nextjs-Vite: Add Next.js 15 support - [#29640](https://github.com/storybookjs/storybook/pull/29640), thanks @yannbf!
+
+## 8.5.0-alpha.8
+
+- UI: Sidebar context menu addon API - [#29557](https://github.com/storybookjs/storybook/pull/29557), thanks @ndelangen!
+
+## 8.5.0-alpha.7
+
+- CLI: Disable corepack auto pin behavior - [#29627](https://github.com/storybookjs/storybook/pull/29627), thanks @yannbf!
+- RNW-Vite: Integrate with experimental-addon-test - [#29645](https://github.com/storybookjs/storybook/pull/29645), thanks @shilman!
+
+## 8.5.0-alpha.6
+
+- CLI: Fix qwik init - [#29632](https://github.com/storybookjs/storybook/pull/29632), thanks @shilman!
+- React Native Web: Add framework, CLI integration, sandboxes - [#29520](https://github.com/storybookjs/storybook/pull/29520), thanks @shilman!
+
+## 8.5.0-alpha.5
+
+- Addon Test: Only optimize react deps if applicable in vitest-plugin - [#29617](https://github.com/storybookjs/storybook/pull/29617), thanks @yannbf!
+- Addon Test: Optimize internal dependencies - [#29595](https://github.com/storybookjs/storybook/pull/29595), thanks @yannbf!
+- CLI: Fix init help for `storybook` command - [#29480](https://github.com/storybookjs/storybook/pull/29480), thanks @toothlessdev!
+- Composition: Fix composed story search - [#29453](https://github.com/storybookjs/storybook/pull/29453), thanks @jsingh0026!
+
+## 8.5.0-alpha.4
+
+- Next.js: Add support for Next 15 - [#29587](https://github.com/storybookjs/storybook/pull/29587), thanks @yannbf!
+- UI: Add Yarn to About Section - [#29225](https://github.com/storybookjs/storybook/pull/29225), thanks @grantwforsythe!
+
+## 8.5.0-alpha.3
+
+- Addon Test: Fix post-install logic for Next.js Vite framework support - [#29524](https://github.com/storybookjs/storybook/pull/29524), thanks @valentinpalkovic!
+- Core: Prevent clipping box shadow on file search modal - [#29523](https://github.com/storybookjs/storybook/pull/29523), thanks @ghengeveld!
+
 ## 8.5.0-alpha.2
 
 - Addon Test: Only render the TestingModule component in development mode - [#29501](https://github.com/storybookjs/storybook/pull/29501), thanks @yannbf!

CONTRIBUTING.md

@@ -5,6 +5,7 @@ Storybook is developed against a specific node version which is defined in an `.
 ## Ensure you have the required system utilities
 
 You will need to have the following installed:
+
 - git
 - node
 - yarn
@@ -20,7 +21,7 @@ You will need to have the following installed:
 
 ## Running the local development environment
 
-- Ensure if you are using Windows to use the Windows Subsystem for Linux (WSL).
+- All commands should be run in a terminal with administrator privileges in Windows environments.
 - Run `yarn start` in the root directory to run a basic test Storybook "sandbox".
 
 The `yarn start` script will generate a React Vite TypeScript sandbox with a set of test stories inside it, as well as taking all steps required to get it running (building the various packages we need etc). There is no need to run `yarn` or `yarn install` as `yarn start` will do this for you.

CONTRIBUTING/RELEASING.md

@@ -19,6 +19,7 @@
   - [5. Make Manual Changes](#5-make-manual-changes)
   - [6. Merge](#6-merge)
   - [7. See the "Publish" Workflow Finish](#7-see-the-publish-workflow-finish)
+- [Releasing changes to older minor versions](#releasing-changes-to-older-minor-versions)
 - [Releasing Locally in an Emergency 🚨](#releasing-locally-in-an-emergency-)
 - [Canary Releases](#canary-releases)
   - [With GitHub UI](#with-github-ui)
@@ -330,6 +331,59 @@ Merging the pull request will trigger [the publish workflow](https://github.com/
 
 Done! 🚀
 
+## Releasing changes to older minor versions
+
+If you need to release a change to an older minor version that is not the latest, you have to do it manually, locally. The process is described below, with an example of releasing a new `v8.3.7` in a situation where `8.4.0` is currently the latest version.
+
+1. Checkout the _existing_ tag that matches the latest minor release you want to bump, and create a new branch from it. In this case, we want to do:
+    1. `git fetch --all --tags`
+    2. `git checkout tags/v8.3.6 -b patch-8-3-7`
+2. Make the changes you need to, most likely cherry-picking commits from the fix you need to back-port.
+3. Run `yarn install` in `scripts` and `code`
+4. Build all packages in `code` with `yarn task --task compile --no-link`
+5. Commit and push your changes.
+6. Trigger _daily_ CI manually on your branch:
+    1. Open [CircleCI](https://app.circleci.com/pipelines/github/storybookjs/storybook) and click "Trigger Pipeline" on the top right corner of the page.
+    2. Set the following configuration options:
+        - Pipeline: _"storybook default"_
+        - Config Source: _"storybook"_
+        - Branch: Your branch, eg. `patch-8-3-7`
+    3. Add a parameter, with _"name"_ `workflow`, _"value"_ `daily`
+7. Wait for CI to finish successfully.
+8. Bump all package versions:
+    1. `cd scripts`
+    2. `yarn release:version --release-type patch`
+9.  Commit with `git commit -m "Bump version from <CURRENT_VERSION> to <NEXT_VERSION> MANUALLY"`
+10. Add a new entry to `CHANGELOG.md`, describing your changes
+11. Commit with `git commit -m "Update CHANGELOG.md with <NEXT_VERSION> MANUALLY"`
+12. Ensure you have the correct write permissions for all the Storybook npm packages. You need to be an admin of the _storybook_ org, and the packages that are not in the org. The simplest way to check this is to ensure you can see the _"Settings"_ tab in the following packages:
+    1.  [`@storybook/react-vite`](https://www.npmjs.com/package/@storybook/react-vite/access)
+    2.  [`storybook`](https://www.npmjs.com/package/storybook/access)
+    3.  [`sb`](https://www.npmjs.com/package/sb/access)
+    4.  [`create-storybook`](https://www.npmjs.com/package/create-storybook/access)
+13. Get your npm access token or generate a new one at https://www.npmjs.com/settings/your-username/tokens. Remember to give it access to the `storybook` org and the packages not in the org, as listed above.
+14. Publish all packages with `YARN_NPM_AUTH_TOKEN=<NPM_TOKEN> yarn release:publish --tag tag-for-publishing-older-releases --verbose`
+    - It goes through all packages and publishes them. If any number of packages fails to publish, it will retry 5 times, skipping those that have already been published.
+15. Confirm the new version has been released on npm with the tag `tag-for-publishing-older-releases`:
+    1. [`@storybook/react-vite`](https://www.npmjs.com/package/@storybook/react-vite?activeTab=versions)
+    2. [`storybook`](https://www.npmjs.com/package/storybook?activeTab=versions)
+    3. [`sb`](https://www.npmjs.com/package/sb?activeTab=versions)
+    4. [`create-storybook`](https://www.npmjs.com/package/create-storybook?activeTab=versions)
+16. Push
+17. Manually create a GitHub Release at https://github.com/storybookjs/storybook/releases/new with:
+    1.  Create new tag: `v<VERSION>` (e.g., `v8.3.7`)
+    2.  Target: your branch (e.g., `patch-8-3-7`)
+    3.  Previous tag: `v<PREVIOUS_VERSION>` (e.g., `v8.3.6`)
+    4.  Title: `v<VERSION>` (e.g., `v8.3.7`)
+    5.  Description: The content you added to `CHANGELOG.md`
+    6.  Untick _"Set as the latest release"_
+18. Cherry-pick your changelog changes into `next`, so they are actually visible 
+    1.  Checkout the `next` branch
+    2.  Cherry-pick the commit you created with your changelog modifications
+    3.  Push
+
+Done. 🎉
+
 ## Releasing Locally in an Emergency 🚨
 
 Things can fail, code can break, and bugs can exist. When automation is broken, there may be a need for an emergency escape hatch to release new fixes. In such a situation, it's valid to run the whole release process locally instead of relying on pull requests and workflows. You don't need to create pull requests or split preparation and publishing; you can do it all at once, but make sure you still follow the correct branching strategy.

README.md

@@ -36,7 +36,7 @@
   <a href="#sponsors">
     <img src="https://opencollective.com/storybook/tiers/sponsors/badge.svg" alt="Sponsors on Open Collective" />
   </a>
-  <a href="https://twitter.com/intent/follow?screen_name=storybookjs">
+  <a href="https://x.com/intent/follow?screen_name=storybookjs">
     <img src="https://img.shields.io/twitter/follow/storybookjs?color=blue&logo=twitter" alt="Official Twitter Handle" />
   </a>
   <a href="https://api.securityscorecards.dev/projects/github.com/storybookjs/storybook">
@@ -68,8 +68,8 @@ Storybook is a frontend workshop for building UI components and pages in isolati
 - 👥 [Community](#community)
 - 👏 [Contributing](#contributing)
   - 👨‍💻 [Development scripts](#development-scripts)
-  - 💵 [Backers](#backers)
   - 💸 [Sponsors](#sponsors)
+  - 💵 [Backers](#backers)
 - :memo: [License](#license)
 
 ## Getting Started
@@ -156,7 +156,7 @@ If you're looking for material to use in your Storybook presentation, such as lo
 
 ## Community
 
-- Tweeting via [@storybookjs](https://twitter.com/storybookjs)
+- Tweeting via [@storybookjs](https://x.com/storybookjs)
 - Blogging at [storybook.js.org](https://storybook.js.org/blog/) and [Medium](https://medium.com/storybookjs)
 - Chatting on [Discord](https://discord.gg/storybook)
 - Videos and streams at [YouTube](https://www.youtube.com/channel/UCr7Quur3eIyA_oe8FNYexfg)

RESOLUTIONS.md

@@ -2,10 +2,6 @@
 
 This file keeps track of any resolutions or exact versions specified in any `package.json` file. Resolutions are used to specify a specific version of a package to be used, even if a different version is specified as a dependency of another package.
 
-## code/renderers/svelte/package.json
+## path/to/package.json
 
-[email protected] (bug: 3.5.x): Type issues
-
-## code/ui/components/package.json
-
-[email protected] (bug: 2.3.x): The Scrollbar doesn't disappear anymore by default. It might has something to do with the `scrollbars.autoHideSuspend` option, which was introduced in 2.3.0. https://github.com/KingSora/OverlayScrollbars/blob/master/packages/overlayscrollbars/CHANGELOG.md#230
+[email protected] (bug: 3.5.x): Pinned as there is a bug in version 3.5.x that prevents foo from doing bar.

code/.storybook/preview.tsx

@@ -117,8 +117,8 @@ const ThemedSetRoot = () => {
 };
 
 // eslint-disable-next-line no-underscore-dangle
-const preview = (window as any).__STORYBOOK_PREVIEW__ as PreviewWeb<ReactRenderer>;
-const channel = (window as any).__STORYBOOK_ADDONS_CHANNEL__ as Channel;
+const preview = (window as any).__STORYBOOK_PREVIEW__ as PreviewWeb<ReactRenderer> | undefined;
+const channel = (window as any).__STORYBOOK_ADDONS_CHANNEL__ as Channel | undefined;
 export const loaders = [
   /**
    * This loader adds a DocsContext to the story, which is required for the most Blocks to work. A
@@ -133,9 +133,9 @@ export const loaders = [
    * The DocsContext will then be added via the decorator below.
    */
   async ({ parameters: { relativeCsfPaths, attached = true } }) => {
-    // TODO bring a better way to skip tests when running as part of the vitest plugin instead of __STORYBOOK_URL__
-    // eslint-disable-next-line no-underscore-dangle
-    if (!relativeCsfPaths || (import.meta as any).env?.__STORYBOOK_URL__) {
+    // __STORYBOOK_PREVIEW__ and __STORYBOOK_ADDONS_CHANNEL__ is set in the PreviewWeb constructor
+    // which isn't loaded in portable stories/vitest
+    if (!relativeCsfPaths || !preview || !channel) {
       return {};
     }
     const csfFiles = await Promise.all(

code/addons/a11y/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-a11y",
-  "version": "8.5.0-alpha.2",
+  "version": "8.5.0-alpha.9",
   "description": "Test component compliance with web accessibility standards",
   "keywords": [
     "a11y",

code/addons/actions/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-actions",
-  "version": "8.5.0-alpha.2",
+  "version": "8.5.0-alpha.9",
   "description": "Get UI feedback when an action is performed on an interactive element",
   "keywords": [
     "storybook",

code/addons/backgrounds/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-backgrounds",
-  "version": "8.5.0-alpha.2",
+  "version": "8.5.0-alpha.9",
   "description": "Switch backgrounds to view components in different settings",
   "keywords": [
     "addon",

code/addons/backgrounds/src/components/Tool.tsx

@@ -124,7 +124,7 @@ const Pure = memo(function PureTool(props: PureProps) {
                       onHide();
                     },
                   })),
-                ]}
+                ].flat()}
               />
             );
           }}

code/addons/controls/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-controls",
-  "version": "8.5.0-alpha.2",
+  "version": "8.5.0-alpha.9",
   "description": "Interact with component inputs dynamically in the Storybook UI",
   "keywords": [
     "addon",

code/addons/docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@storybook/addon-docs",
-  "version": "8.5.0-alpha.2",
+  "version": "8.5.0-alpha.9",
   "description": "Document component usage and properties in Markdown",
   "keywords": [
     "addon",