storybook

Storybook reference

An API reference skill covering the official Storybook documentation. Read the appropriate README.md according to the user's task, and from there follow the links to individual files.

Directory structure

skills/storybook/
  SKILL.md
  references/
    get-started/
      README.md
      browse-stories.md
      frameworks.md
      install.md
      setup.md
      whats-a-story.md
    writing-stories/
      README.md
      args.md
      build-pages.md
      decorators.md
      loaders.md
      mocking-modules.md
      mocking-network-requests.md
      mocking-providers.md
      multiple-components.md
      naming-and-hierarchy.md
      parameters.md
      play-function.md
      tags.md
      typescript.md
    writing-tests/
      README.md
      accessibility-testing.md
      in-ci.md
      interaction-testing.md
      portable-stories.md
      snapshot-testing.md
      test-coverage.md
      vitest-addon.md
      visual-testing.md
    writing-docs/
      README.md
      autodocs.md
      build-documentation.md
      code-panel.md
      doc-blocks.md
      mdx.md
    essentials/
      README.md
      actions.md
      backgrounds.md
      controls.md
      highlight.md
      measure-and-outline.md
      toolbars-and-globals.md
      viewport.md
    configure/
      README.md
      addons.md
      compilers.md
      environment-variables.md
      features-and-behavior.md
      frameworks.md
      images-and-assets.md
      sidebar-and-urls.md
      story-layout.md
      story-rendering.md
      styling-and-css.md
      telemetry.md
      theming.md
      typescript.md
    builders/
      README.md
      builder-api.md
      vite.md
      webpack.md
    sharing/
      README.md
      design-integrations.md
      embed.md
      package-composition.md
      publish-storybook.md
      storybook-composition.md
    api/
      README.md
      arg-types.md
      cli-options.md
      csf.md
      new-frameworks.md
      parameters.md
      main-config/
        README.md
        addons.md
        babel.md
        build.md
        core.md
        docs.md
        env.md
        features.md
        framework.md
        indexers.md
        log-level.md
        manager-head.md
        preview-annotations.md
        preview-body.md
        preview-head.md
        refs.md
        static-dirs.md
        stories.md
        swc.md
        tags.md
        typescript.md
        vite-final.md
        webpack-final.md
      doc-blocks/
        README.md
        arg-types.md
        canvas.md
        color-palette.md
        controls.md
        description.md
        icon-gallery.md
        markdown.md
        meta.md
        primary.md
        source.md
        stories.md
        story.md
        subtitle.md
        table-of-contents.md
        title.md
        typeset.md
        unstyled.md
        use-of.md
      portable-stories/
        README.md
        jest.md
        playwright.md
        vitest.md
  samples/
    README.md
    accessibility-testing.md
    args-composition.md
    autodocs.md
    basic-story.md
    decorators.md
    global-styles-setup.md
    loaders.md
    parameters.md
    play-function.md
  scripts/
    README.md
    addons.md
    build.md
    cli.md
    install.md
    sandbox.md
    test.md
    upgrade.md

Exploration procedure

Derive the category from the task, and identify the target page from the category's README.md:

1. Find the category corresponding to the task in the mapping table below
2. For that category references/{category}/README.md to identify the target page
3. Read the .md of the relevant page to check the details

Task → Category mapping

Task	Category	Reference README
Installation, setup, framework selection, what a story is	get-started	references/get-started/README.md
Args、Decorators、Play function、Loaders、Tags、Mocking、TypeScript	writing-stories	references/writing-stories/README.md
Interaction tests, A11y tests, Visual tests, Vitest addon, CI, test coverage	writing-tests	references/writing-tests/README.md
Autodocs, MDX, Doc Blocks, documentation build, Code Panel	writing-docs	references/writing-docs/README.md
Actions、Controls、Viewport、Backgrounds、Toolbars、Highlight	essentials	references/essentials/README.md
CSS, TypeScript, Theming, Telemetry, environment variables, sidebar, addon registration, compiler	configure	references/configure/README.md
Vite、Webpack、Builder API	builders	references/builders/README.md
Publishing and sharing Storybook, design tool integration, Composition, embedding	sharing	references/sharing/README.md
CSF, ArgTypes, Parameters, CLI options, adding a new framework	api	references/api/README.md
Configuration of main.js / main.ts such as framework, stories, addons, features, etc.	api/main-config	references/api/main-config/README.md
Doc Block components such as Canvas, Source, Meta, Controls	api/doc-blocks	references/api/doc-blocks/README.md
Portable Stories with Vitest, Jest, and Playwright	api/portable-stories	references/api/portable-stories/README.md
Want to know typical usage and implementation examples	samples	samples/README.md
Want to know about installation, CLI commands, build, test execution, and upgrades	scripts	scripts/README.md