Registry Integration
Register 8-bit components in registry.json for discovery via shadcn add @8bitcn/[component-name].
Component Entry Pattern { "name": "button", "type": "registry:component", "title": "8-bit Button", "description": "A simple 8-bit button component", "registryDependencies": ["button"], "files": [ { "path": "components/ui/8bit/button.tsx", "type": "registry:component", "target": "components/ui/8bit/button.tsx" }, { "path": "components/ui/8bit/styles/retro.css", "type": "registry:component", "target": "components/ui/8bit/styles/retro.css" } ] }
Block Entry Pattern
For pre-built layouts like game UIs:
{ "name": "quest-log", "type": "registry:block", "title": "8-bit Quest Log", "description": "An 8-bit quest and mission tracking system.", "registryDependencies": ["card", "accordion"], "categories": ["gaming"], "files": [ { "path": "components/ui/8bit/quest-log.tsx", "type": "registry:block", "target": "components/ui/8bit/quest-log.tsx" }, { "path": "components/ui/8bit/styles/retro.css", "type": "registry:component", "target": "components/ui/8bit/styles/retro.css" } ] }
Required retro.css
Always include retro.css in files array:
"files": [ { "path": "components/ui/8bit/new-component.tsx", "type": "registry:component", "target": "components/ui/8bit/new-component.tsx" }, { "path": "components/ui/8bit/styles/retro.css", "type": "registry:component", "target": "components/ui/8bit/styles/retro.css" } ]
Categories
Use gaming-specific categories for game components:
"categories": ["gaming"]
Available categories: gaming, layout, form, data-display, feedback, navigation, overlay.
Registry Dependencies
List base shadcn dependencies (not 8-bit versions):
"registryDependencies": ["button", "dialog", "progress"]
For blocks with multiple components:
"registryDependencies": ["card", "button", "progress", "tabs"]
Type Selection
registry:component - Single reusable component:
{ "type": "registry:component", "files": [...] }
registry:block - Pre-built layout or feature:
{ "type": "registry:block", "categories": ["gaming"], "files": [...] }
Complete Example { "name": "health-bar", "type": "registry:component", "title": "8-bit Health Bar", "description": "An 8-bit health bar component for game UI.", "registryDependencies": ["progress"], "files": [ { "path": "components/ui/8bit/health-bar.tsx", "type": "registry:component", "target": "components/ui/8bit/health-bar.tsx" }, { "path": "components/ui/8bit/progress.tsx", "type": "registry:component", "target": "components/ui/8bit/progress.tsx" }, { "path": "components/ui/8bit/styles/retro.css", "type": "registry:component", "target": "components/ui/8bit/styles/retro.css" } ] }
Key Principles Type - Use registry:component for single, registry:block for layouts retro.css required - Always include in files array Target path - Same path for source and target Categories - Use gaming for retro-themed blocks Dependencies - List base shadcn/ui components (not 8-bit) Description - Clear, concise for CLI output Files order - Component first, retro.css last Adding a New Component Create component in components/ui/8bit/component.tsx Create documentation in content/docs/components/component.mdx Add entry to registry.json: Copy existing component as template Update name, title, description Set correct registryDependencies Include retro.css in files Test: pnpm dlx shadcn@latest add @8bitcn/component Reference registry.json - Full component registry content/docs/components/*.mdx - Component documentation