Registry
How the radk component registry works.
The radk registry is a JSON-based system for distributing component source code. It's how npx radk add button knows what to download and install.
How It Works
registry.json ← manifest of all components
↓
public/r/radk/
├── button.json ← component source + metadata
├── card.json
└── ...Each component JSON contains:
- source code — the actual
.tsxfile content - npm dependencies — packages to install
- registry dependencies — other radk components required
- CSS variables — any theme variables the component needs
Component JSON Structure
{
"$schema": "https://radk.dev/schema/registry-item.json",
"name": "button",
"type": "registry:ui",
"title": "Button",
"description": "A button component with multiple variants.",
"dependencies": [
"class-variance-authority",
"@radix-ui/react-slot"
],
"registryDependencies": [],
"files": [
{
"path": "registry/radk/ui/button.tsx",
"type": "registry:component",
"content": "// full source code..."
}
],
"cssVars": {}
}Item Types
| Type | Install Path | Purpose |
|---|---|---|
registry:ui | @/components/ui/ | Core UI primitives |
registry:component | @/components/ | Composed components |
registry:hook | @/hooks/ | React hooks |
registry:lib | @/lib/ | Utility functions |
Building the Registry
Run the build script to regenerate the registry JSON from source:
pnpm registry:buildThis reads apps/www/registry.json, reads each component's source file, and outputs to apps/www/public/r/.