format-storybook

Catalogue stub — full skill: mikemai2awesome/agent-skills

Decision tree

1. Is the full skill already installed?
   • Global:

     grep -q "^das:" ~/.agents/skills/format-storybook/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"

   • Project:

     grep -q "^das:" .agents/skills/format-storybook/SKILL.md 2>/dev/null && echo "pointer" || echo "installed"

   • No

     das:

     block → full skill installed, invoke and proceed

   • das:

     block present → go to step 2
2. Detect scope, then install:
   bash

   [ -e ~/.agents/skills/format-storybook ] && echo "global" || echo "project"

   Global:
   bash

   npx skills add mikemai2awesome/agent-skills --skill format-storybook -g -y

   Project:
   bash

   npx skills add mikemai2awesome/agent-skills --skill format-storybook -y

   Claude Code: send either command as a chat message starting with

   !

   to run it without leaving the conversation.

What it does

• File structure — co-locate stories with components;

  stories/component.stories.js

  +

  stories/template.js

  + optional

  component.docs.mdx

• Template composition — import child component templates instead of duplicating markup; single source of truth per component
• Controls & args — progressive disclosure: sensible defaults + optional controls for edge cases; arg types and descriptions
• Visual regression — Chromatic integration patterns; snapshot testing strategy
• CSF conventions — Component Story Format 3.0; default export metadata; named story exports
• Documentation — MDX docs pages; component API tables; usage examples; do/don't patterns

When NOT to use

• React Native Storybook stories specifically → use

  storybook-rn-skill

• Design token generation → use

  design-tokens-skill

• Component implementation from scratch → use

  shadcn-ui

  or

  baseline-ui