@storybook/csf-plugin

CSF Plugin

The CSF plugin reads CSF files and enriches their content via static analysis. It supports Webpack, Vite, and other bundlers using unplugin.

Source snippets

CSF plugin can add static source snippets to each story. For example:

export const Basic = () => <Button />;

Would be transformed to:

export const Basic = () => <Button />;
Basic.parameters = {
  storySource: {
    source: '() => <Button />',
  },
  ...Basic.parameters,
};

This allows @storybook/addon-docs to display the static source snippet.

Changelog

7.0.0-beta.0 (December 8, 2022)

We made it to beta, folks! 🎉

SB7 overhauls our build architecture, modernizes our output to ESM only, promotes Vite to a first-class peer to Webpack, rethinks our Docs addon, cleans up the UI, and contains hundreds of improvements at every level of the stack. We've been sharing some of these changes on the Storybook blog and will share more over the coming weeks.

Beta means that we don't have any more major changes on the radar for 7.0 and it's mostly stabilization from here on out. The core team is doing some basic testing now, and once we have a good QA plan, we'd love your help to make that happen. Please keep an eye out on the blog and on our Twitter or Mastadon (coming soon!) or Discord if you're interested in helping.

Bug Fixes

• Extend Angular Zone.js peer dependency range #20107
• Vite: Fix static source handling for addon-docs #20147
• Controls: Arrow keys don't work on number controls #19954