sb-explore

Name: sb-explore
Author: strongeron

18stars0forks

How to install sb-explore?

strongeron/storybook-workbench/sb-explore

$npx -y skills add strongeron/storybook-workbench --skill sb-explore

Installs into the current project.

Summary

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.

Files · 1

View on GitHub

SKILL.md

1	# sb-explore — sandboxed iteration (Build mode: Explore)
2
3	The component is new or being redesigned. It lives outside `src/components/` so production
4	code can't depend on it. Load `references/labs-workflow.md` before scaffolding.
5	If the user pasted a Figma URL, ALSO load `references/figma-to-storybook.md`. Do NOT
6	load `composition-patterns.md` (that's Compare → `sb-wrappers`).
7
8	> Naming: `Explore` is the canonical term used throughout this skill (titles, disk paths, tags).
9	> `references/labs-workflow.md` predates the rename and says `Labs` / `src/stories/labs/` — read it as
10	> the same track (Explore = Labs). Author with `Explore`; treat `Labs` only as a legacy alias you may meet
11	> in an existing repo.
12
13	## Before scaffolding (ask yourself)
14
15	- Iterating on a shipping component, or net-new? Determines Path A vs Path B at Ship time.
16	- Figma URL pasted? If yes — set `parameters.design = { type: 'figma', url }` immediately and
17	iterate against the frame (see figma-to-storybook.md).
18	- API stable enough to graduate? See the 4 criteria in labs-workflow.md. If not — stay in Explore.
19
20	## Scaffold
21
22	- Disk path — honor the recorded `storiesLocation` (`.storybook/audit/status.md`): when stories are
23	isolated (the audit/client default), scaffold the experiment under `.storybook/explore/<topic>/` —
24	don't scatter into a `src/` you don't own. Only use `src/explore/<topic>/` when the user opted into
25	co-located for a project they own. Vite excludes either from the production bundle.
26	- Title — `Explore/<topic>/<name>` — last in `storySort.order`, bottom of sidebar.
27	- Tags — `['explore', '!autodocs', '!test']`. Optional: `'motion'`, `'figma-sync'`, `'v2-preview'`.
28
29	## Graduation gate (Explore → Component)
30
31	Four criteria in labs-workflow.md: stable API · ≥3 callsites planned · designer-reviewed ·
32	tokens not magic numbers. When all met → trigger `sb-ship` (it preserves the experiment,
33	never `git mv`). Until then, keep iterating here.
34
35	## Next
36
37	Iterate; when the gate is met, hand off to `sb-ship`. Append progress to `.storybook/audit/status.md`
38	so an interrupted session resumes cleanly (CONTEXT.md resume protocol).

People who liked this also viewed

6 picks

Type

sb-explore

18stars0forks

View on GitHub

How to install sb-explore?

strongeron/storybook-workbench/sb-explore

$npx -y skills add strongeron/storybook-workbench --skill sb-explore

Installs into the current project.

Summary

Files · 1

View on GitHub

SKILL.md

1	# sb-explore — sandboxed iteration (Build mode: Explore)
2
3	The component is new or being redesigned. It lives outside `src/components/` so production
4	code can't depend on it. Load `references/labs-workflow.md` before scaffolding.
5	If the user pasted a Figma URL, ALSO load `references/figma-to-storybook.md`. Do NOT
6	load `composition-patterns.md` (that's Compare → `sb-wrappers`).
7
8	> Naming: `Explore` is the canonical term used throughout this skill (titles, disk paths, tags).
9	> `references/labs-workflow.md` predates the rename and says `Labs` / `src/stories/labs/` — read it as
10	> the same track (Explore = Labs). Author with `Explore`; treat `Labs` only as a legacy alias you may meet
11	> in an existing repo.
12
13	## Before scaffolding (ask yourself)
14
15	- Iterating on a shipping component, or net-new? Determines Path A vs Path B at Ship time.
16	- Figma URL pasted? If yes — set `parameters.design = { type: 'figma', url }` immediately and
17	iterate against the frame (see figma-to-storybook.md).
18	- API stable enough to graduate? See the 4 criteria in labs-workflow.md. If not — stay in Explore.
19
20	## Scaffold
21
22	- Disk path — honor the recorded `storiesLocation` (`.storybook/audit/status.md`): when stories are
23	isolated (the audit/client default), scaffold the experiment under `.storybook/explore/<topic>/` —
24	don't scatter into a `src/` you don't own. Only use `src/explore/<topic>/` when the user opted into
25	co-located for a project they own. Vite excludes either from the production bundle.
26	- Title — `Explore/<topic>/<name>` — last in `storySort.order`, bottom of sidebar.
27	- Tags — `['explore', '!autodocs', '!test']`. Optional: `'motion'`, `'figma-sync'`, `'v2-preview'`.
28
29	## Graduation gate (Explore → Component)
30
31	Four criteria in labs-workflow.md: stable API · ≥3 callsites planned · designer-reviewed ·
32	tokens not magic numbers. When all met → trigger `sb-ship` (it preserves the experiment,
33	never `git mv`). Until then, keep iterating here.
34
35	## Next
36
37	Iterate; when the gate is met, hand off to `sb-ship`. Append progress to `.storybook/audit/status.md`
38	so an interrupted session resumes cleanly (CONTEXT.md resume protocol).

People who liked this also viewed

6 picks

Type