|
| 1 | +--- |
| 2 | +name: shadcn-ui |
| 3 | +description: >- |
| 4 | + Give the assistant project-aware shadcn/ui context: components.json, |
| 5 | + composition patterns, CLI, registries, theming, and MCP. Use when working on |
| 6 | + web/default UI, shadcn components, or presets. Overview aligns with |
| 7 | + https://ui.shadcn.com/docs/skills.md; full upstream skill text is vendored |
| 8 | + under vendor/shadcn/. |
| 9 | +--- |
| 10 | + |
| 11 | +<!-- Canonical overview: https://ui.shadcn.com/docs/skills.md --> |
| 12 | + |
| 13 | +# Skills (shadcn/ui) |
| 14 | + |
| 15 | +Skills give AI assistants project-aware context about shadcn/ui. When used, the assistant knows how to find, install, compose, and customize components using the correct APIs and patterns for your project. |
| 16 | + |
| 17 | +For example, you can ask: |
| 18 | + |
| 19 | +- _"Add a login form with email and password fields."_ |
| 20 | +- _"Create a settings page with a form for updating profile information."_ |
| 21 | +- _"Build a dashboard with a sidebar, stats cards, and a data table."_ |
| 22 | +- _"Switch to --preset [CODE]"_ |
| 23 | +- _"Can you add a hero from @tailark?"_ |
| 24 | + |
| 25 | +The skill reads your project's `components.json` and provides your framework, aliases, installed components, icon library, and base library so it can generate correct code on the first try. |
| 26 | + |
| 27 | +--- |
| 28 | + |
| 29 | +## Install (ecosystem vs this repo) |
| 30 | + |
| 31 | +Official install from [Skills — shadcn/ui](https://ui.shadcn.com/docs/skills.md): |
| 32 | + |
| 33 | +```bash |
| 34 | +npx skills add shadcn/ui |
| 35 | +``` |
| 36 | + |
| 37 | +That installs the skill where the `skills` CLI is available. **This repository** keeps the same intent under `.agents/skills/shadcn-ui/` (overview here + **vendored** upstream docs in [`vendor/shadcn/`](./vendor/shadcn/)) and runs the shadcn CLI from the frontend app root: |
| 38 | + |
| 39 | +```bash |
| 40 | +cd web/default && bunx shadcn@latest info --json |
| 41 | +``` |
| 42 | + |
| 43 | +Learn more about skills at [skills.sh](https://skills.sh). |
| 44 | + |
| 45 | +--- |
| 46 | + |
| 47 | +## What's included (and where) |
| 48 | + |
| 49 | +### Project context |
| 50 | + |
| 51 | +Run **`shadcn info --json`** (here: `cd web/default && bunx shadcn@latest info --json`) for framework, Tailwind version, aliases, base (`radix` | `base`), icon library, installed components, and resolved paths. |
| 52 | + |
| 53 | +### CLI commands |
| 54 | + |
| 55 | +Full command reference (vendored): [`vendor/shadcn/cli.md`](./vendor/shadcn/cli.md). |
| 56 | + |
| 57 | +### Theming and customization |
| 58 | + |
| 59 | +Vendored: [`vendor/shadcn/customization.md`](./vendor/shadcn/customization.md). Live docs: [Theming](https://ui.shadcn.com/docs/theming). |
| 60 | + |
| 61 | +### Registry authoring |
| 62 | + |
| 63 | +Not duplicated as a single file in the vendor tree; see [Registry](https://ui.shadcn.com/docs/registry) and `build` in [`vendor/shadcn/cli.md`](./vendor/shadcn/cli.md). |
| 64 | + |
| 65 | +### MCP server |
| 66 | + |
| 67 | +Vendored: [`vendor/shadcn/mcp.md`](./vendor/shadcn/mcp.md). Live docs: [MCP Server](https://ui.shadcn.com/docs/mcp). |
| 68 | + |
| 69 | +--- |
| 70 | + |
| 71 | +## How it works |
| 72 | + |
| 73 | +1. **Project detection** — Applies when `components.json` exists (here: `web/default/components.json`). |
| 74 | +2. **Context injection** — Use `shadcn info --json` as ground truth for imports and APIs. |
| 75 | +3. **Pattern enforcement** — Follow rules in [`vendor/shadcn/SKILL.md`](./vendor/shadcn/SKILL.md) and [`vendor/shadcn/rules/`](./vendor/shadcn/rules/). |
| 76 | +4. **Component discovery** — `shadcn docs`, `shadcn search`, MCP, or registries — see vendored SKILL + MCP doc. |
| 77 | + |
| 78 | +--- |
| 79 | + |
| 80 | +## Learn more (web) |
| 81 | + |
| 82 | +- [CLI](https://ui.shadcn.com/docs/cli) — complements [`vendor/shadcn/cli.md`](./vendor/shadcn/cli.md) |
| 83 | +- [Theming](https://ui.shadcn.com/docs/theming) |
| 84 | +- [Registry](https://ui.shadcn.com/docs/registry) |
| 85 | +- [skills.sh](https://skills.sh) |
| 86 | + |
| 87 | +--- |
| 88 | + |
| 89 | +## Vendored upstream bundle (deep rules) |
| 90 | + |
| 91 | +Snapshot from [shadcn-ui/ui `skills/shadcn`](https://github.com/shadcn-ui/ui/tree/main/skills/shadcn); revision note in [`vendor/shadcn/UPSTREAM.txt`](./vendor/shadcn/UPSTREAM.txt). |
| 92 | + |
| 93 | +| Doc | Path | |
| 94 | +| --- | --- | |
| 95 | +| Full official skill body | [`vendor/shadcn/SKILL.md`](./vendor/shadcn/SKILL.md) | |
| 96 | +| CLI reference | [`vendor/shadcn/cli.md`](./vendor/shadcn/cli.md) | |
| 97 | +| Theming / customization | [`vendor/shadcn/customization.md`](./vendor/shadcn/customization.md) | |
| 98 | +| MCP | [`vendor/shadcn/mcp.md`](./vendor/shadcn/mcp.md) | |
| 99 | +| Forms | [`vendor/shadcn/rules/forms.md`](./vendor/shadcn/rules/forms.md) | |
| 100 | +| Composition | [`vendor/shadcn/rules/composition.md`](./vendor/shadcn/rules/composition.md) | |
| 101 | +| Icons | [`vendor/shadcn/rules/icons.md`](./vendor/shadcn/rules/icons.md) | |
| 102 | +| Styling | [`vendor/shadcn/rules/styling.md`](./vendor/shadcn/rules/styling.md) | |
| 103 | +| Base vs Radix | [`vendor/shadcn/rules/base-vs-radix.md`](./vendor/shadcn/rules/base-vs-radix.md) | |
| 104 | + |
| 105 | +**Workflow:** Prefer this **root** `SKILL.md` for repo paths (`web/default`, Bun). Read **`vendor/shadcn/SKILL.md`** for the complete upstream workflow, patterns, and CLI quick reference. Use **`vendor/shadcn/rules/*.md`** when validating concrete markup. |
0 commit comments