diff --git a/packages/claude-plugin/skills/stories/SKILL.md b/packages/claude-plugin/skills/stories/SKILL.md index 3e9cddb9..686c9ddb 100644 --- a/packages/claude-plugin/skills/stories/SKILL.md +++ b/packages/claude-plugin/skills/stories/SKILL.md @@ -5,10 +5,9 @@ description: Invoke FIRST, before creating, editing, or deleting components, sto Prerequisites: -1. Storybook must be installed in the project. Invoke the `/storybook-init` skill to set up Storybook, but only if the user explicitly invoked this skill and approves a Storybook installation. -2. Storybook must be >= 10.5 (or an alpha/canary version). Invoke the `/storybook-upgrade` skill to upgrade it, but only if the user - explicitly approved a Storybook upgrade. -3. Ensure `@storybook/addon-mcp` is installed. If it is missing, install it with `npx storybook add @storybook/addon-mcp`. +1. **Storybook is not installed** (no Storybook dependencies in `package.json`, no `.storybook/` directory): invoke the `/storybook-init` skill, but only if the user explicitly approves a Storybook installation. +2. **Storybook is installed but outdated** (version < 10.5 and not an alpha/canary version): invoke the `/storybook-upgrade` skill, but only if the user explicitly approved a Storybook upgrade. +3. **Storybook is installed and up to date**: proceed. Ensure `@storybook/addon-mcp` is installed; if it is missing, install it with `npx storybook add @storybook/addon-mcp`. Run `STORYBOOK_FEATURE_AI_CLI=1 npx storybook ai --help` and read the output in its **entirety** to get the **mandatory, ordered workflow** for working on UI changes, writing stories, and keeping stories in sync with every frontend component you create, modify, or delete. This workflow explains how to write stories, preview stories, and display a curated Storybook review. diff --git a/packages/claude-plugin/skills/storybook-init/SKILL.md b/packages/claude-plugin/skills/storybook-init/SKILL.md index 6045f733..01762c76 100644 --- a/packages/claude-plugin/skills/storybook-init/SKILL.md +++ b/packages/claude-plugin/skills/storybook-init/SKILL.md @@ -3,6 +3,12 @@ name: storybook-init description: Use when adding Storybook to a project that does not have Storybook configured yet. --- +Prerequisites: + +1. **Storybook is not installed** (no Storybook dependencies in `package.json`, no `.storybook/` directory): invoke the `/storybook-init` skill, but only if the user explicitly approves a Storybook installation. +2. **Storybook is installed but outdated** (version < 10.5 and not an alpha/canary version): invoke the `/storybook-upgrade` skill, but only if the user explicitly approved a Storybook upgrade. +3. **Storybook is installed and up to date**: proceed. Ensure `@storybook/addon-mcp` is installed; if it is missing, install it with `npx storybook add @storybook/addon-mcp`. + 1. Run `npm create storybook@latest` inside your project's root directory to install the latest version of Storybook. Use the matching package-manager command when appropriate, such as `pnpm create storybook@latest` or `yarn create storybook`. 2. After initialization succeeds, run `npx storybook add @storybook/addon-mcp`. 3. Invoke the `/storybook-setup` skill to help the user set up project-specific Storybook configuration, such as the `.storybook/preview.ts` file. diff --git a/packages/claude-plugin/skills/storybook-setup/SKILL.md b/packages/claude-plugin/skills/storybook-setup/SKILL.md index 2ca25193..b7969fdb 100644 --- a/packages/claude-plugin/skills/storybook-setup/SKILL.md +++ b/packages/claude-plugin/skills/storybook-setup/SKILL.md @@ -3,10 +3,7 @@ name: storybook-setup description: Use this skill when Storybook is already installed and the user wants a working `preview` file and stories for real components. --- -Prerequisites: - -1. Confirm Storybook exists (`package.json`, `.storybook/`). If not, switch to `/storybook-init`. -2. If Storybook is outdated or upgrade/repair is needed first, switch to `/storybook-upgrade`. +Prerequisites: Storybook must already be installed and up to date. If it is not installed, switch to `/storybook-init`; if it is outdated, switch to `/storybook-upgrade`. Run `npx storybook ai setup` from the project root (or the Storybook package in a monorepo). diff --git a/packages/claude-plugin/skills/storybook-upgrade/SKILL.md b/packages/claude-plugin/skills/storybook-upgrade/SKILL.md index 694f8a52..450245c6 100644 --- a/packages/claude-plugin/skills/storybook-upgrade/SKILL.md +++ b/packages/claude-plugin/skills/storybook-upgrade/SKILL.md @@ -3,4 +3,10 @@ name: storybook-upgrade description: Use this skill when Storybook exists but needs an upgrade. --- +Prerequisites: + +1. **Storybook is not installed** (no Storybook dependencies in `package.json`, no `.storybook/` directory): invoke the `/storybook-init` skill, but only if the user explicitly approves a Storybook installation. +2. **Storybook is installed but outdated** (version < 10.5 and not an alpha/canary version): invoke the `/storybook-upgrade` skill, but only if the user explicitly approved a Storybook upgrade. +3. **Storybook is installed and up to date**: proceed. Ensure `@storybook/addon-mcp` is installed; if it is missing, install it with `npx storybook add @storybook/addon-mcp`. + Read https://storybook.js.org/docs/releases/upgrading.md in its **entirety** to get the latest Storybook upgrade instructions. diff --git a/packages/codex-plugin/plugins/storybook/skills/init/SKILL.md b/packages/codex-plugin/plugins/storybook/skills/init/SKILL.md index c60a4084..4fb17339 100644 --- a/packages/codex-plugin/plugins/storybook/skills/init/SKILL.md +++ b/packages/codex-plugin/plugins/storybook/skills/init/SKILL.md @@ -3,6 +3,12 @@ name: init description: Use when adding Storybook to a project that does not have Storybook configured yet. --- +Prerequisites: + +1. **Storybook is not installed** (no Storybook dependencies in `package.json`, no `.storybook/` directory): invoke the `$storybook:init` skill, but only if the user explicitly approves a Storybook installation. +2. **Storybook is installed but outdated** (version < 10.5 and not an alpha/canary version): invoke the `$storybook:upgrade` skill, but only if the user explicitly approved a Storybook upgrade. +3. **Storybook is installed and up to date**: proceed. Ensure `@storybook/addon-mcp` is installed; if it is missing, install it with `npx storybook add @storybook/addon-mcp`. + 1. Run `npm create storybook@latest` inside your project's root directory to install the latest version of Storybook. Use the matching package-manager command when appropriate, such as `pnpm create storybook@latest` or `yarn create storybook`. 2. After initialization succeeds, run `npx storybook add @storybook/addon-mcp`. 3. Invoke the `$storybook:setup` skill to help the user set up project-specific Storybook configuration, such as the `.storybook/preview.ts` file. diff --git a/packages/codex-plugin/plugins/storybook/skills/setup/SKILL.md b/packages/codex-plugin/plugins/storybook/skills/setup/SKILL.md index 2b546892..6aba623b 100644 --- a/packages/codex-plugin/plugins/storybook/skills/setup/SKILL.md +++ b/packages/codex-plugin/plugins/storybook/skills/setup/SKILL.md @@ -3,10 +3,7 @@ name: setup description: Use this skill when Storybook is already installed and the user wants a working `preview` file and stories for real components. --- -Prerequisites: - -1. Confirm Storybook exists (`package.json`, `.storybook/`). If not, switch to `$storybook:init`. -2. If Storybook is outdated or upgrade/repair is needed first, switch to `$storybook:upgrade`. +Prerequisites: Storybook must already be installed and up to date. If it is not installed, switch to `$storybook:init`; if it is outdated, switch to `$storybook:upgrade`. Run `npx storybook ai setup` from the project root (or the Storybook package in a monorepo). diff --git a/packages/codex-plugin/plugins/storybook/skills/stories/SKILL.md b/packages/codex-plugin/plugins/storybook/skills/stories/SKILL.md index 664f9f71..3e3ab0ae 100644 --- a/packages/codex-plugin/plugins/storybook/skills/stories/SKILL.md +++ b/packages/codex-plugin/plugins/storybook/skills/stories/SKILL.md @@ -5,10 +5,9 @@ description: Invoke FIRST, before creating, editing, or deleting components, sto Prerequisites: -1. Storybook must be installed in the project. Invoke the `$storybook:init` skill to set up Storybook, but only if the user explicitly invoked this skill and approves a Storybook installation. -2. Storybook must be >= 10.5 (or an alpha/canary version). Invoke the `$storybook:upgrade` skill to upgrade it, but only if the user - explicitly approved a Storybook upgrade. -3. Ensure `@storybook/addon-mcp` is installed. If it is missing, install it with `npx storybook add @storybook/addon-mcp`. +1. **Storybook is not installed** (no Storybook dependencies in `package.json`, no `.storybook/` directory): invoke the `$storybook:init` skill, but only if the user explicitly approves a Storybook installation. +2. **Storybook is installed but outdated** (version < 10.5 and not an alpha/canary version): invoke the `$storybook:upgrade` skill, but only if the user explicitly approved a Storybook upgrade. +3. **Storybook is installed and up to date**: proceed. Ensure `@storybook/addon-mcp` is installed; if it is missing, install it with `npx storybook add @storybook/addon-mcp`. Run `STORYBOOK_FEATURE_AI_CLI=1 npx storybook ai --help` and read the output in its **entirety** to get the **mandatory, ordered workflow** for working on UI changes, writing stories, and keeping stories in sync with every frontend component you create, modify, or delete. This workflow explains how to write stories, preview stories, and display a curated Storybook review. diff --git a/packages/codex-plugin/plugins/storybook/skills/upgrade/SKILL.md b/packages/codex-plugin/plugins/storybook/skills/upgrade/SKILL.md index 11ce760b..4729da3f 100644 --- a/packages/codex-plugin/plugins/storybook/skills/upgrade/SKILL.md +++ b/packages/codex-plugin/plugins/storybook/skills/upgrade/SKILL.md @@ -3,4 +3,10 @@ name: upgrade description: Use this skill when Storybook exists but needs an upgrade. --- +Prerequisites: + +1. **Storybook is not installed** (no Storybook dependencies in `package.json`, no `.storybook/` directory): invoke the `$storybook:init` skill, but only if the user explicitly approves a Storybook installation. +2. **Storybook is installed but outdated** (version < 10.5 and not an alpha/canary version): invoke the `$storybook:upgrade` skill, but only if the user explicitly approved a Storybook upgrade. +3. **Storybook is installed and up to date**: proceed. Ensure `@storybook/addon-mcp` is installed; if it is missing, install it with `npx storybook add @storybook/addon-mcp`. + Read https://storybook.js.org/docs/releases/upgrading.md in its **entirety** to get the latest Storybook upgrade instructions.