Stats
Actions
Tags
From storybook
Configures Storybook preview files and writes co-located example stories from real components in an existing React+Vite Storybook project.
How this skill is triggered — by the user, by Claude, or both
Slash command
/storybook:storybook-setupThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Use this skill when Storybook is already installed and the user wants a working `preview` file and colocated stories for real components.
Use this skill when Storybook is already installed and the user wants a working preview file and colocated stories for real components.
package.json, .storybook/). If not, switch to /storybook-init./storybook-upgrade.From the project root (or the Storybook package in a monorepo):
npx storybook ai setup
Use the repo's package manager when appropriate: pnpm exec storybook ai setup, yarn exec storybook ai setup.
Follow the printed Markdown precisely. Do not substitute your own plan.
/storybook-setup-claude-launch and the Claude launcher entry. Do not start Storybook as an ad hoc Bash command or background task.npx claudepluginhub storybookjs/mcp --plugin storybookGuides writing, updating, and reviewing Storybook stories with a strict workflow. Pulls story-writing rules from the MCP, ensures a running preview, and prevents unverified stories.
Generates CSF3 Storybook stories for components (React, Vue, shadcn/ui) with variant coverage and state matrices. Invoke when creating component stories.
Creates and reviews Storybook component documentation with stories, MDX, decorators, interaction tests, and visual baselines. Useful for setting up design system presentations or isolated component state previews.