From Storybook Workbench
Iterate on a new or redesigned component in a sandboxed Explore story outside src/components/ (+ Figma), checked against a graduation gate. Use for 'prototype this', 'try a v2', 'explore from Figma', or net-new UI not ready to ship.
How this skill is triggered — by the user, by Claude, or both
Slash command
/storybook-workbench:sb-exploreThis skill is limited to the following tools:
The summary Claude sees in its skill listing — used to decide when to auto-load this skill
The component is new or being redesigned. It lives **outside `src/components/`** so production
The component is new or being redesigned. It lives outside src/components/ so production
code can't depend on it. Load references/labs-workflow.md before scaffolding.
If the user pasted a Figma URL, ALSO load references/figma-to-storybook.md. Do NOT
load composition-patterns.md (that's Compare → sb-wrappers).
Naming:
Exploreis the canonical term used throughout this skill (titles, disk paths, tags).references/labs-workflow.mdpredates the rename and saysLabs/src/stories/labs/— read it as the same track (Explore = Labs). Author withExplore; treatLabsonly as a legacy alias you may meet in an existing repo.
parameters.design = { type: 'figma', url } immediately and
iterate against the frame (see figma-to-storybook.md).storiesLocation (.storybook/audit/status.md): when stories are
isolated (the audit/client default), scaffold the experiment under .storybook/explore/<topic>/ —
don't scatter into a src/ you don't own. Only use src/explore/<topic>/ when the user opted into
co-located for a project they own. Vite excludes either from the production bundle.Explore/<topic>/<name> — last in storySort.order, bottom of sidebar.['explore', '!autodocs', '!test']. Optional: 'motion', 'figma-sync', 'v2-preview'.Four criteria in labs-workflow.md: stable API · ≥3 callsites planned · designer-reviewed ·
tokens not magic numbers. When all met → trigger sb-ship (it preserves the experiment,
never git mv). Until then, keep iterating here.
Iterate; when the gate is met, hand off to sb-ship. Append progress to .storybook/audit/status.md
so an interrupted session resumes cleanly (CONTEXT.md resume protocol).
npx claudepluginhub strongeron/storybook-workbench --plugin storybook-workbenchGraduate ONE Explore experiment to a production component — preserve the experiment (cp, never git mv), pick new-vs-update, close the decision loop. Use for 'ship this', 'promote this experiment', 'graduate to production'.
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.
Storybook 9+ setup, CSF3 story authoring, args/controls, decorators, play-function testing, a11y axe-core integration, autodocs, design tokens, Figma linking, Chromatic deployment, CI caching, and on-demand build performance.