Skip to main content

create-template

Create a new copy-paste template in the CoreAI Design System Storybook. Use when asked to add a new template, pattern, or page scaffold under Templates/ in Storybook. ALWAYS read apps/storybook/README.md's "Creating a template" section first. IGNORE and DO NOT use when editing ./apps/prototype

Informations de source

Dépôt
microsoft/coreai-design-system
Dernière activité de la source
14 octobre 2026 à 03:35
Langue détectée de SKILL.md
anglais
Étoiles
2
Forks
1

Options d'installation

Le prompt qui vérifie d'abord la source est sélectionné par défaut. Vous pouvez passer à une commande directe ou télécharger une copie locale.

Vérifiez les fichiers source

Lisez SKILL.md et les fichiers associés affichés par SkillsMP avant de décider de l'installer.

Affichage de SKILL.md

SKILL.md
Instructions source · Aperçu en lecture seule
name
create-template
description
Create a new copy-paste template in the CoreAI Design System Storybook. Use when asked to add a new template, pattern, or page scaffold under Templates/ in Storybook. ALWAYS read apps/storybook/README.md's "Creating a template" section first. IGNORE and DO NOT use when editing ./apps/prototype
argument-hint
e.g. "create a Detail Page template"
# Creating a Storybook template Before writing any files, read [apps/storybook/README.md#creating-a-template](../../../apps/storybook/README.md#creating-a-template) — it's the source of truth for the file convention (`{Name}.tsx` + `{Name}.stories.tsx` + generated `{Name}.mdx`), the CSF3 story rules, the JSDoc→MCP mapping, and the quality checklist. Follow it exactly; don't improvise a different file layout. ## Steps 1. Create `{Name}.tsx` under `apps/storybook/src/stories/templates/` — the self-contained copy-paste component (no Storybook imports). 2. Create `{Name}.stories.tsx` next to it — minimal meta + `Default` story + JSDoc, per the README convention. 3. Run `npm --workspace apps/storybook run docs:templates` (or just save — the dev-server watcher regenerates it) to produce `{Name}.mdx`. Never hand-author or edit that file. 4. Work through the Quality checklist in the README section before committing. ## Commit and PR conventions ### Commits One commit per logical unit: ``` feat(storybook): add {Name} copy-paste template ``` Fix commits that arise during review: ``` fix(storybook): {short description} refactor(storybook): {short description} ``` ### PR title ``` feat(storybook): {Name} copy-paste template ``` ### PR body sections ```md Closes #{issue} ## What One paragraph — what was built and why. ## Changes ### Storybook — {Name} - `{Name}.tsx` — the copy-paste component (single source of truth) - `{Name}.stories.tsx` — Storybook meta, stories, JSDoc for MCP ## Features ### {Key decision 1} Explain the non-obvious design choice and why it was made. ``` Reference the existing templates (`EmptyState`, `FilterableList`, `ShellAndNavigation`) as style examples. See also the [`create-pr` skill](../create-pr/SKILL.md) for changelog/reviewer conventions once the template is ready to ship.
Voir sur GitHub