feat: add shadcn component registry

.claude/rules/registry.md

@@ -0,0 +1,23 @@
+---
+paths:
+  - "src/components/ui/**"
+  - "src/components/form/**"
+  - "src/hooks/**"
+  - "src/lib/tailwind/utils.ts"
+  - "src/lib/dayjs/parse-string-to-date.ts"
+---
+
+When you add, rename, or remove a component in `src/components/ui/`, `src/components/form/`, `src/hooks/`, or a registry lib (`src/lib/tailwind/utils.ts`, `src/lib/dayjs/parse-string-to-date.ts`), you MUST update `registry.json` at the project root to keep the shadcn registry in sync.
+
+Checklist:
+1. **New component** → Add a new item in `registry.json` with correct `name`, `type`, `dependencies`, `registryDependencies`, and `files`.
+2. **Renamed/moved component** → Update the corresponding `files[].path` in `registry.json`.
+3. **Deleted component** → Remove the item from `registry.json` and remove it from other items' `registryDependencies`.
+4. **Changed imports** → If a component gains or loses an npm dependency or an internal dependency on another registry component, update `dependencies` and `registryDependencies` accordingly.
+5. **Rebuild** → Run `pnpm registry:build` after changes to verify the build succeeds.
+
+Registry item types:
+- `registry:ui` for `src/components/ui/` components
+- `registry:component` for `src/components/form/` components
+- `registry:hook` for `src/hooks/` hooks
+- `registry:lib` for utility libraries

.gitignore

@@ -15,6 +15,7 @@
 /dist
 /build
 /public/storybook
+/public/r
 /storybook-static
 
 # misc

CONTRIBUTING.md

@@ -15,7 +15,39 @@ Thank you for considering contributing to this repository!
 > Write a good commit message.
 > Also, make sure that the linting is correct.
 
+## Component Registry
+
+Start UI exposes a [shadcn registry](https://ui.shadcn.com/docs/registry) so that components can be installed individually in other projects.
+
+### How it works
+
+- `registry.json` at the project root defines every registry item (UI components, form fields, hooks, libs).
+- `pnpm registry:build` generates JSON files in `public/r/` from that definition.
+- In production, the registry is served at `https://demo.start-ui.com/r/<name>.json`.
+
+### Keeping the registry up to date
+
+Whenever you **add, rename, move, or delete** a component in `src/components/ui/`, `src/components/form/`, or `src/hooks/`, you must update `registry.json`:
+
+| Action | What to do in `registry.json` |
+|---|---|
+| Add a component | Add a new item with `name`, `type`, `files`, `dependencies`, `registryDependencies` |
+| Rename/move a component | Update the `files[].path` entry |
+| Delete a component | Remove the item and remove it from other items' `registryDependencies` |
+| Change a component's imports | Update `dependencies` (npm packages) and `registryDependencies` (other registry items) |
+
+After changes, run `pnpm registry:build` to verify the build succeeds.
+
+### Registry item types
+
+| Type | Used for |
+|---|---|
+| `registry:ui` | Components in `src/components/ui/` |
+| `registry:component` | Components in `src/components/form/` |
+| `registry:hook` | Hooks in `src/hooks/` |
+| `registry:lib` | Utility libraries (e.g. `cn`, `parse-string-to-date`) |
+
 ## Translations
 
-You only need to maintain the english and french translations for you PR. 
+You only need to maintain the english and french translations for you PR.
 Other language translations are not required to submit a PR 😉

README.md

@@ -117,6 +117,30 @@ If you want to use the same set of custom duotone icons that Start UI is already
 > [!WARNING]
 > All svg icons should be svg files prefixed by `icon-` (example: `icon-externel-link`) with **square size** and **filled with `#000` color** (will be replaced by `currentColor`).
 
+### Component Registry
+
+Start UI ships a [shadcn-compatible registry](https://ui.shadcn.com/docs/registry) so you can install individual components into other projects.
+
+#### Build the registry
+
+```bash
+pnpm registry:build
+```
+
+This generates JSON files in `public/r/`. In development they are served at `http://localhost:3000/r/<name>.json`.
+
+#### Install a component from the registry
+
+From a consumer project:
+
+```bash
+pnpm dlx shadcn@latest add https://demo.start-ui.com/r/button.json
+```
+
+> [!NOTE]
+> See `registry.json` at the project root for the full list of available components, hooks, and utilities.
+> See `CONTRIBUTING.md` for instructions on keeping the registry up to date when adding or modifying components.
+
 ### E2E Tests
 
 E2E tests are setup with Playwright.

package.json

@@ -12,13 +12,14 @@
     "prepare": "pnpm lefthook install",
     "dev": "run-p env dev:*",
     "dev:app": "pnpm gen:build-info && vite dev",
-    "build": "cross-env NODE_ENV=production run-p env gen:build-info && vite build",
+    "build": "cross-env NODE_ENV=production run-p env gen:build-info && pnpm registry:build && vite build",
     "start": "dotenv -- node .output/server/index.mjs",
     "env": "run-p env:*",
     "env:client": "dotenv -- node ./run-jiti ./src/env/client.ts",
     "env:server": "dotenv -- node ./run-jiti ./src/env/server.ts",
     "storybook": "storybook dev --no-open -p 6006",
     "storybook:build": "storybook build && mv ./storybook-static ./public/storybook",
+    "registry:build": "pnpm dlx shadcn@latest build",
     "pretty": "prettier -w .",
     "lint": "run-p lint:*",
     "lint:eslint": "eslint ./src --fix",