The MDX team has just released the long-awaited MDXv2 with dramatically better syntax and performance. It's a huge win for the community! 🎉
Now I'm excited to announce experimental support in Storybook 6.5. This gist summarizes how to try it out, how to report bugs, and known gotchas that you might encounter along the way.
Since MDXv2 is a breaking change, it's an opt-in feature in Storybook 6.5.
Storybook 6.4 introduces a whole new core architecture to enable performance optimization. The "on-demand store" makes it possible to code-split Storybook, which leads to smaller bundle sizes, and will enable incremental compilation and granular file-system caching when used with Webpack5.
Storybook 6.4-alpha.35 introduces this massive change to the codebase via PR #15871. Now we're in stabilization mode, trying to get it ready for release.
We just announced Component Story Format 3.0 that brings play functions to Storybook.
Play functions are scripted interactions that execute after the story has rendered, allowing you test hard-to-reach states in your UI like form validations and hover states.
Here's a quick example of filling out a form. For more see the announcement:
import { userEvent } from '@storybook/testing-library';
Hallelujah Angular users! 🙌 We just merged a last-minute Angular PR for Ivy rendering support in Storybook (huge props to @ThibaudAv @kroeder for making this happen!). This change is available in SB 6.3.0-beta.10 and above.
We're very late in the Storybook 6.3 cycle (RC on Monday!), so we desperately need your testing help. If it's too destabilizing, we need to roll it back and release in 6.4.
If you're installing Storybook from scratch, run this in your project root:
To streamline bug reporting and maintenance, we're introducing a standardized repro process in Storybook. The process is now in alpha, and we'd love your feedback to make it better before we introduce it to the community at large. Thank you for your help!!!
The process is automated by two new commands:
sb repro - create a new repro based on a templatesb link - download a repro and link it against the storybook monorepo to interactively develop a fix against it
Storybook recently released pluggable builder support in 6.2, which promised to unlock support for webpack alternatives.
Now we have our first community builder in experimental release: storybook-builder-vite. Kudos to Eirik Sletteberg and Sasan Farrokh. Vite is one of the most exciting next-gen bundlers: the official builder of modern Vue and Svelte apps, with great DX for React and Lit as well.
npm init @vitejs/app vite-react-app --template react
⚠️ Warning: this document is out of date.For the most recent webpack5 instructions see MIGRATION.md.
Storybook 6.2 includes experimental Webpack 5 support. Webpack 5 brings a variety of performance improvements, as well as exciting new features like module federation. Here's a quick guide to get you going.
We've flip-flopped on prop table handling for React components written in Typescript. This document attempts to be a final reference for anybody who's been trying to follow along.
TLDR:
SB6 uses react-docgen-typescript by default. We hope to use react-docgen in SB7. The whole experience led to zero-config in SB6, so it's now a one-line change main.js to switch between the two.
This is a quick-and-dirty walkthrough to set up a fresh project with Storybook Controls. It's also an introduction to Storybook Args, which is a major update to Storybook's Component Story Format (CSF): a more portable and ergonomic way to write stories.
This walkthrough gives you:
Nov 16 beta, Dec 16 rc, Jan 7 final (3 mo cycle)