storybook

Storybook 8.1 is here with a tone of new features and bug fixes:

• 🏷️ Static tag-based filtering

• 🦺 Type-safe, standards-based module mocking

• 🐣 New beforeEach test hook

• 🧳 Portable Stories API for Playwright Component Testing

• 🐕‍🦺 Support the new signal-based input & output functions in Angular

• 2️⃣ Two new ways to create stories: generating them from story controls or from your components directly!

List of all updates

• Addon-actions: Fix falsy args printing as object - 22163

• Addon-docs: Fix MDX compilation with @vitejs/plugin-react-swc and plugins

• Addon-docs: Fix providerImportSource extension

• Addon-docs: Fix react-dom/server imports breaking stories and docs

• Addon-docs: Support Stencil based display names in source snippets

• Addon-docs: Fix [Object object] displayName in some JSX components

• Angular: Add type support for Angular's input signals

• Angular: Add type support for Angular's output signals

• API: Add API access to sidebar renderLabel

• Args: Add possibility to mark controls as read-only

• Automigrations: Fix name of VTA addon

• Automigrations: Add migration note about new react-docgen default

• Automigrations: Fix missing support for mts vite config

• Automigrations: Improve react-docgen automigration prompt

• Blocks: Add of prop to Subtitle

• Blocks: Add of prop to Title

• CLI: Add --config-dir flag to add command

• CLI: Add --config-dir flag to migrate command

• CLI: Add main.js docs.autodocs automigration

• CLI: Add Visual Tests addon install auto-migration when upgrading to 8.0.x

• CLI: Automigrate improve upgrade storybook related packages

• CLI: Automigrations copy edits

• CLI: Fix eslint configuration for string extends

• CLI: Improve Yarn berry error parsing

• CLI: Improve vite-config-file.ts

• CLI: Instruct the correct auto-migration command

• CLI: Introduce package manager fallback for initializing Storybook in an empty directory with yarn1

• CLI: Throw an error when running upgrade command in incorrect cwd

• Codemods: Escape filename given as argument

• Controls: Add Channels API to search for files in the project root

• Controls: Added server channel to create a new story

• Controls: Add UI to create new story files

• Controls: Fix crashing when docgen extraction partially fails

• Controls: Fix disable condition in ArgControl component

• Controls: Fix number controls do not reset

• Core: Add duration and onClick support to Notification API and improve Notification UI

• Core: Drop unneeded UPDATE_STORY_ARGS which was for SSv6

• Core: Ensure that simultaneous onStoriesChanged don't clobber each other

• Core: Fix filters not being applied in WebKit

• Core: Fix preloading too early

• Core: Implement file formatter

• Core: Optimize clearNotification

• Core: Save from controls

• CSF: Allow default export without title or component attributes

• CSF: Fix typings for control and other properties of argTypes

• CSF: Make sure loaders/decorators can be used as array

• Dependencies: Bump es-module-lexer

• Dependencies: Update globby dependency

• Dependencies: Update postcss-loader in Next.js framework

• Doc Tools: Signature Type Error Handling

• Indexer: Escape special characters in storyImport regex

• Maintenance: Fix performance regressions

• MDX: Do not transform http:// links

• Next.js: Fix Compatibility with <v14.0.4

• Next.js: Fix next/font usage on Windows machines

• Next.js: Move sharp into optional deps

• Next.js: Support v14.2 useParams functionality

• Next.js: Implement next redirect and the RedirectBoundary

• Next.js: Support path aliases when no base url is set

• Node: Safe use of document for preview

• Onboarding: Improve UI

• Portable stories: Introduce experimental Playwright CT API and Support for more renderers

• Portable stories: Make setProjectAnnotations accept multiple types of imports

• Portable Stories: Remove link to missing docs

• Portable Stories: Warn when rendering stories without cleaning up first

• React-Docgen: Make sure to be able to handle empty unions

• React: Support v19 betas in peer dependencies

• React: Support v19 in react-dom-shim

• Tags: Add project tags, negation, dev/autodocs/test system tags

• Tags: Fix missing default tags if no preview.js

• Theming: Update emotion dependencies

• Typescript: Add types for experimental-playwright entries without type:bundler

• UI: Add key property to list children in Highlight component

• UI: Fix not re-rendering tabs on state change

• UI: Fix panel layout resizing do not apply when done too fast

• UI: Fix search result color contrast

• UI: Fix sidebar search hanging when selecting a story in touch mode

• UI: Fix theming of elements inside bars

• UI: Improve empty state of addon panel

• UI: Replace the icon prop in the Manager API

• Viewport: Fix missing style

• Vite: Merge assetsInclude property with Storybook default values

• Vue: Disable controls for events, slots, and expose

• security

  Webpack: Bump webpack-dev-middleware to patch high security issue

• Webpack: Fix sourcemap generation in webpack react-docgen-loader

• Webpack: Hide runtime errors