storybook

Improved UI and story authoring ergonomics

Storybook 10.2 contains hundreds of fixes and improvement including:

• 💅 New Viewports and Zoom UI

• 🏭 Typesafe CSF factories for Vue, Angular, Web Components (preview)

• 📄 MDX support for Storybook MCP (experimental)

List of all updates

• Addon-A11y: Lock vision filter dropdown for stories with vision global

• Addon-Docs: Add MDX manifest generation

• Addon-Docs: Skip !autodocs stories when computing primary story

• Addon-Pseudo States: Fix stylesheet rewrite for :not() with parenthesis in inner selector

• Addon-Vitest: Added timeout for fetching localhost 6006 during global setup.

• Addon-Vitest: Fallback detecting vitest version in postinstall

• Addon-Vitest: Improve error message in testing widget modal

• Addon-Vitest: Improve perf & fix loading incorrect .env file

• CLI: Detect free port when running dev during initiate

• CLI: Remove any return type of getAbsolutePath

• CLI: Skip vitest transform for CSF Factories in a11y-addon-test automigration

• Codemod: Fix glob string to only match stories files

• Controls: Allow resetting the Select control

• Controls: Fix displaying as object instead of select for optional union types

• Controls: Force object control JSON mode to reset

• Core and Vite: Use story index as source of truth for Vite paths

• Core: Add getStoryHrefs manager API and add hotkey for "open in isolation"

• Core: Add global error boundary for Manager UI

• Core: Add support for wrapped components in component transformer

• Core: Add try-catch for cross-origin access in Storybook hooks

• Core: Add zoom level 8 and limit manual input to 800%

• Core: Avoid late layout shift and improve ChecklistWidget perceived performance

• Core: Ensure /project.json route is up before builders serve local FS

• Core: Fix react-docgen-typescript support in story creation

• Core: Fix Checklist behavior with hidden sidebar

• Core: Fix cwd handling for negated globs

• Core: Fix Date input layout

• Core: Fix import statement for react-docgen-typescript

• Core: Fix input width

• Core: Fix manual zoom input field UX

• Core: Fix onboarding visual bugs, survey telemetry and modal dismissal

• Core: Fix play function mount detection when destructuring in the function body

• Core: Fix viewport args handling and reset option

• Core: Honor BROWSER shell scripts before xdg-open

• Core: Improve addon sanitization

• Core: Improve path handling in arg types data extraction

• Core: Improve the story generation experience

• Core: Redesign and refactor Viewports tool

• Core: Refactor channel initialization

• Core: Render sidebar toggle on settings pages

• Core: Retry writeFile cache when EBUSY error occurs

• Core: Support defineConfig when setting up ESLint plugin

• Core: Support disabling Checklist widget through feature config

• Core: Track vision simulator state through globals and apply styles in preview

• Core: Use canonical links in sidebar and menu

• Core: Viewport UX fixes

• Core: Zoom tool reimplementation

• CSF-Factories: Add CSF Factories for Vue3, Web Components, and Angular

• CSF-Factories: Allow kebab-case HTML attribute names in web components args

• CSF-Factories: Export WebComponentsTypes and VueTypes

• CSF-Factories: Skip non-factory exports instead of throwing error

• CSF: Export type to prevent type cannot be named-errors

• Dependencies: Bump various packages

• Dependencies: Update baseline-browser-mapping

• Docgen: Update extraction of React docgen

• Docs-Blocks: Fix broken tooltip in ArgValue details

• Interactions: Add disable parameter for interactions panel

• Interactions: Fix state reset bug when switching stories with date mocks

• Manager: Ensure reset item only appears in globals toolbar when specified

• Manager: Fix system query parameters being overridable

• Manifests: Add support for summaries in MDX files

• Manifests: Refactor from componentManifestGenerator to extensible manifests preset property

• Manifests: Support !manifest tag in preview files

• NextJS: Import next/dist with .js-extension for ESM compat

• NextJS: Support top-level weight/style in next/font/local with string src

• NextJSVite: Add @opentelemetry/api to optimizeDeps

• NextJSVite: Upgrade plugin

• Onboarding: Fix navigation to first story when configure-your-project entry missing

• Onboarding: Hide TourGuide as soon as tests start

• Preview: Prevent error in RN due to navigator?.clipboard

• Preview: Treat canceled animations as finished

• React: Use self-closing tag for code snippets

• SvelteKit: Align JS template with TS template

• Telemetry: Add packageJson.type

• TypeScript: Fix summary undefined type issue

• TypeScript: Improve globalTypes type-strictness

• TypeScript: Reduce cannot be named errors

• TypeScript: Support exactOptionalPropertyTypes for public API types

• UI: Ensure consistent right padding in TreeNode

• UI: Ensure preview error displays use a readable text color

• UI: Fix border color for Select picker

• UI: Fix empty sidebar after navigating from search

• UI: Fix regression in select close handler focus

• UI: Fix search highlight visibility in High Contrast Mode

• UI: Improve landmark navigation

• UI: Keep preview frame stable in overall layout

• UI: Make vertical alignment of TestStatusIcon more robust

• UI: Prevent primary story from duplicating anchor ID

• UI: Prevent updating non-existent stories in sidebar

• Upgrade: Preserve package.json indentation when upgrading

• Vue3: Update renderer's setup function to allow passing generic HostElement type

• Webpack: Revert "disable bugfixes property in swc and babel

• Zoom: Keyboard-shortcut for the plus key