shipbase/ui components are distributed through shadcn/ui’s registry system, so you can install them using the familiar shadcn CLI.
Already initialized with shadcn CLI
If your project has components.json configured (from running shadcn init previously), add the appropriate shipbase registry for your framework:
{
"registries": {
"@shipbase": "https://ui.shipbase.xyz/r/react/{name}.json"
}
} {
"registries": {
"@shipbase": "https://ui.shipbase.xyz/r/vue/{name}.json"
}
} Not yet available
Not yet available
Then install components:
bunx --bun shadcn@latest add @shipbase/button npx shadcn@latest add @shipbase/button pnpm dlx shadcn@latest add @shipbase/button yarn dlx shadcn@latest add @shipbase/button New project setup
If you haven’t initialized shadcn CLI yet, start with the standard setup:
1. Set up shadcn/ui
Follow the official shadcn/ui installation guide for your framework (Next.js, Vite, etc.) to properly initialize your project.
2. Add shipbase registry
After initialization, add the appropriate shipbase registry to your generated components.json:
{
"registries": {
"@shipbase": "https://ui.shipbase.xyz/r/react/{name}.json"
}
} {
"registries": {
"@shipbase": "https://ui.shipbase.xyz/r/vue/{name}.json"
}
} Not yet available
Not yet available
3. Install components
bunx --bun shadcn@latest add @shipbase/button npx shadcn@latest add @shipbase/button pnpm dlx shadcn@latest add @shipbase/button yarn dlx shadcn@latest add @shipbase/button Usage
Components work exactly like shadcn/ui components:
import { Button } from "@/components/ui/button"
export function MyComponent() {
return <Button>Click me</Button>
}