Command Palette

Search for a command to run...

Docs

Two things to know: how to point your project at this registry, and what's inside it. Everything is consumed through the standard shadcn CLI.

Setup

Configure your project

Add the registry to your components.json under registries, then expose the bearer token via env. The shadcn CLI handles the rest.

{
'registries': {
'@kaotypr-ui': {
'headers': {
'Authorization': 'Bearer ${KAOTYPR_UI_REGISTRY_TOKEN}'
}
}
}
}

The {name} placeholder is replaced by the CLI when you install @kaotypr-ui/<component>. Headers are sent with every fetch — keep the token out of source control.

.env.local
KAOTYPR_UI_REGISTRY_TOKEN=your-bearer-token-here

Ask the registry owner for the bearer token. The CLI reads env vars referenced as ${NAME} in the headers block.

  1. 01
    Add the registries block
    Drop the @kaotypr-ui entry into components.json — alongside any other registries you already use.
  2. 02
    Export the token
    Set KAOTYPR_UI_REGISTRY_TOKEN in your shell or .env.local before invoking the CLI.
  3. 03
    Install components
    pnpm dlx shadcn@latest add @kaotypr-ui/<name> — registry deps and npm deps resolve automatically.
Registry

What's available

70 items total — 67 components, 2 hooks, 1 lib utility. Search by name, copy the install command, or grab everything in one go.

Install everything
70 items
Copies a single shadcn add command containing every item in this registry. Useful for bootstrapping a fresh project.
pnpm dlx shadcn@latest add @kaotypr-ui/utils @kaotypr-ui/use-copy-to-clipboard @kaotypr-ui/use-mobile @kaotypr-ui/accordion @kaotypr-ui/alert @kaotypr-ui/alert-dialog @kaotypr-ui/aspect-ratio @kaotypr-ui/avatar @kaotypr-ui/badge @kaotypr-ui/breadcrumb @kaotypr-ui/button @kaotypr-ui/button-group @kaotypr-ui/calendar @kaotypr-ui/card @kaotypr-ui/carousel @kaotypr-ui/chart @kaotypr-ui/checkbox @kaotypr-ui/collapsible @kaotypr-ui/color-picker @kaotypr-ui/combobox @kaotypr-ui/command @kaotypr-ui/context-menu @kaotypr-ui/copy-button @kaotypr-ui/data-combobox @kaotypr-ui/data-multi-combobox @kaotypr-ui/data-table @kaotypr-ui/date-picker @kaotypr-ui/date-range-picker @kaotypr-ui/density @kaotypr-ui/dialog @kaotypr-ui/direction @kaotypr-ui/drawer @kaotypr-ui/dropdown-menu @kaotypr-ui/empty @kaotypr-ui/field @kaotypr-ui/hover-card @kaotypr-ui/input @kaotypr-ui/input-group @kaotypr-ui/input-otp @kaotypr-ui/item @kaotypr-ui/json-viewer @kaotypr-ui/kbd @kaotypr-ui/label @kaotypr-ui/menubar @kaotypr-ui/native-select @kaotypr-ui/navigation-menu @kaotypr-ui/pagination @kaotypr-ui/popover @kaotypr-ui/progress @kaotypr-ui/radio-group @kaotypr-ui/resizable @kaotypr-ui/scroll-area @kaotypr-ui/select @kaotypr-ui/separator @kaotypr-ui/sheet @kaotypr-ui/sidebar @kaotypr-ui/skeleton @kaotypr-ui/slider @kaotypr-ui/sonner @kaotypr-ui/spinner @kaotypr-ui/switch @kaotypr-ui/table @kaotypr-ui/tabs @kaotypr-ui/textarea @kaotypr-ui/theme @kaotypr-ui/time-picker @kaotypr-ui/timeline @kaotypr-ui/toggle @kaotypr-ui/toggle-group @kaotypr-ui/tooltip
  • Utilities
    Lib
    @kaotypr-ui/utils

    Utility functions including cn() for merging class names.

    pnpm dlx shadcn@latest add @kaotypr-ui/utils
  • Use Copy To Clipboard
    Hook
    @kaotypr-ui/use-copy-to-clipboard
    pnpm dlx shadcn@latest add @kaotypr-ui/use-copy-to-clipboard
  • Use Mobile
    Hook
    @kaotypr-ui/use-mobile
    pnpm dlx shadcn@latest add @kaotypr-ui/use-mobile
  • Accordion
    Component
    @kaotypr-ui/accordion
    pnpm dlx shadcn@latest add @kaotypr-ui/accordion
  • Alert
    Component
    @kaotypr-ui/alert
    pnpm dlx shadcn@latest add @kaotypr-ui/alert
  • Alert Dialog
    Component
    @kaotypr-ui/alert-dialog
    pnpm dlx shadcn@latest add @kaotypr-ui/alert-dialog
  • Aspect Ratio
    Component
    @kaotypr-ui/aspect-ratio
    pnpm dlx shadcn@latest add @kaotypr-ui/aspect-ratio
  • Avatar
    Component
    @kaotypr-ui/avatar
    pnpm dlx shadcn@latest add @kaotypr-ui/avatar
  • Badge
    Component
    @kaotypr-ui/badge
    pnpm dlx shadcn@latest add @kaotypr-ui/badge
  • Breadcrumb
    Component
    @kaotypr-ui/breadcrumb
    pnpm dlx shadcn@latest add @kaotypr-ui/breadcrumb
  • Button
    Component
    @kaotypr-ui/button
    pnpm dlx shadcn@latest add @kaotypr-ui/button
  • Button Group
    Component
    @kaotypr-ui/button-group
    pnpm dlx shadcn@latest add @kaotypr-ui/button-group
  • Calendar
    Component
    @kaotypr-ui/calendar
    pnpm dlx shadcn@latest add @kaotypr-ui/calendar
  • Card
    Component
    @kaotypr-ui/card
    pnpm dlx shadcn@latest add @kaotypr-ui/card
  • Carousel
    Component
    @kaotypr-ui/carousel
    pnpm dlx shadcn@latest add @kaotypr-ui/carousel
  • Chart
    Component
    @kaotypr-ui/chart
    pnpm dlx shadcn@latest add @kaotypr-ui/chart
  • Checkbox
    Component
    @kaotypr-ui/checkbox
    pnpm dlx shadcn@latest add @kaotypr-ui/checkbox
  • Collapsible
    Component
    @kaotypr-ui/collapsible
    pnpm dlx shadcn@latest add @kaotypr-ui/collapsible
  • Color Picker
    Component
    @kaotypr-ui/color-picker
    pnpm dlx shadcn@latest add @kaotypr-ui/color-picker
  • Combobox
    Component
    @kaotypr-ui/combobox
    pnpm dlx shadcn@latest add @kaotypr-ui/combobox
  • Command
    Component
    @kaotypr-ui/command
    pnpm dlx shadcn@latest add @kaotypr-ui/command
  • Context Menu
    Component
    @kaotypr-ui/context-menu
    pnpm dlx shadcn@latest add @kaotypr-ui/context-menu
  • Copy Button
    Component
    @kaotypr-ui/copy-button
    pnpm dlx shadcn@latest add @kaotypr-ui/copy-button
  • Data Combobox
    Component
    @kaotypr-ui/data-combobox
    pnpm dlx shadcn@latest add @kaotypr-ui/data-combobox
  • Data Multi Combobox
    Component
    @kaotypr-ui/data-multi-combobox
    pnpm dlx shadcn@latest add @kaotypr-ui/data-multi-combobox
  • Data Table
    Component
    @kaotypr-ui/data-table
    pnpm dlx shadcn@latest add @kaotypr-ui/data-table
  • Date Picker
    Component
    @kaotypr-ui/date-picker
    pnpm dlx shadcn@latest add @kaotypr-ui/date-picker
  • Date Range Picker
    Component
    @kaotypr-ui/date-range-picker
    pnpm dlx shadcn@latest add @kaotypr-ui/date-range-picker
  • Density
    Component
    @kaotypr-ui/density
    pnpm dlx shadcn@latest add @kaotypr-ui/density
  • Dialog
    Component
    @kaotypr-ui/dialog
    pnpm dlx shadcn@latest add @kaotypr-ui/dialog
  • Direction
    Component
    @kaotypr-ui/direction
    pnpm dlx shadcn@latest add @kaotypr-ui/direction
  • Drawer
    Component
    @kaotypr-ui/drawer
    pnpm dlx shadcn@latest add @kaotypr-ui/drawer
  • Dropdown Menu
    Component
    @kaotypr-ui/dropdown-menu
    pnpm dlx shadcn@latest add @kaotypr-ui/dropdown-menu
  • Empty
    Component
    @kaotypr-ui/empty
    pnpm dlx shadcn@latest add @kaotypr-ui/empty
  • Field
    Component
    @kaotypr-ui/field
    pnpm dlx shadcn@latest add @kaotypr-ui/field
  • Hover Card
    Component
    @kaotypr-ui/hover-card
    pnpm dlx shadcn@latest add @kaotypr-ui/hover-card
  • Input
    Component
    @kaotypr-ui/input
    pnpm dlx shadcn@latest add @kaotypr-ui/input
  • Input Group
    Component
    @kaotypr-ui/input-group
    pnpm dlx shadcn@latest add @kaotypr-ui/input-group
  • Input Otp
    Component
    @kaotypr-ui/input-otp
    pnpm dlx shadcn@latest add @kaotypr-ui/input-otp
  • Item
    Component
    @kaotypr-ui/item
    pnpm dlx shadcn@latest add @kaotypr-ui/item
  • Json Viewer
    Component
    @kaotypr-ui/json-viewer
    pnpm dlx shadcn@latest add @kaotypr-ui/json-viewer
  • Kbd
    Component
    @kaotypr-ui/kbd
    pnpm dlx shadcn@latest add @kaotypr-ui/kbd
  • Label
    Component
    @kaotypr-ui/label
    pnpm dlx shadcn@latest add @kaotypr-ui/label
  • Menubar
    Component
    @kaotypr-ui/menubar
    pnpm dlx shadcn@latest add @kaotypr-ui/menubar
  • Native Select
    Component
    @kaotypr-ui/native-select
    pnpm dlx shadcn@latest add @kaotypr-ui/native-select
  • Navigation Menu
    Component
    @kaotypr-ui/navigation-menu
    pnpm dlx shadcn@latest add @kaotypr-ui/navigation-menu
  • Pagination
    Component
    @kaotypr-ui/pagination
    pnpm dlx shadcn@latest add @kaotypr-ui/pagination
  • Popover
    Component
    @kaotypr-ui/popover
    pnpm dlx shadcn@latest add @kaotypr-ui/popover
  • Progress
    Component
    @kaotypr-ui/progress
    pnpm dlx shadcn@latest add @kaotypr-ui/progress
  • Radio Group
    Component
    @kaotypr-ui/radio-group
    pnpm dlx shadcn@latest add @kaotypr-ui/radio-group
  • Resizable
    Component
    @kaotypr-ui/resizable
    pnpm dlx shadcn@latest add @kaotypr-ui/resizable
  • Scroll Area
    Component
    @kaotypr-ui/scroll-area
    pnpm dlx shadcn@latest add @kaotypr-ui/scroll-area
  • Select
    Component
    @kaotypr-ui/select
    pnpm dlx shadcn@latest add @kaotypr-ui/select
  • Separator
    Component
    @kaotypr-ui/separator
    pnpm dlx shadcn@latest add @kaotypr-ui/separator
  • Sheet
    Component
    @kaotypr-ui/sheet
    pnpm dlx shadcn@latest add @kaotypr-ui/sheet
  • Sidebar
    Component
    @kaotypr-ui/sidebar
    pnpm dlx shadcn@latest add @kaotypr-ui/sidebar
  • Skeleton
    Component
    @kaotypr-ui/skeleton
    pnpm dlx shadcn@latest add @kaotypr-ui/skeleton
  • Slider
    Component
    @kaotypr-ui/slider
    pnpm dlx shadcn@latest add @kaotypr-ui/slider
  • Sonner
    Component
    @kaotypr-ui/sonner
    pnpm dlx shadcn@latest add @kaotypr-ui/sonner
  • Spinner
    Component
    @kaotypr-ui/spinner
    pnpm dlx shadcn@latest add @kaotypr-ui/spinner
  • Switch
    Component
    @kaotypr-ui/switch
    pnpm dlx shadcn@latest add @kaotypr-ui/switch
  • Table
    Component
    @kaotypr-ui/table
    pnpm dlx shadcn@latest add @kaotypr-ui/table
  • Tabs
    Component
    @kaotypr-ui/tabs
    pnpm dlx shadcn@latest add @kaotypr-ui/tabs
  • Textarea
    Component
    @kaotypr-ui/textarea
    pnpm dlx shadcn@latest add @kaotypr-ui/textarea
  • Theme
    Component
    @kaotypr-ui/theme
    pnpm dlx shadcn@latest add @kaotypr-ui/theme
  • Time Picker
    Component
    @kaotypr-ui/time-picker
    pnpm dlx shadcn@latest add @kaotypr-ui/time-picker
  • Timeline
    Component
    @kaotypr-ui/timeline
    pnpm dlx shadcn@latest add @kaotypr-ui/timeline
  • Toggle
    Component
    @kaotypr-ui/toggle
    pnpm dlx shadcn@latest add @kaotypr-ui/toggle
  • Toggle Group
    Component
    @kaotypr-ui/toggle-group
    pnpm dlx shadcn@latest add @kaotypr-ui/toggle-group
  • Tooltip
    Component
    @kaotypr-ui/tooltip
    pnpm dlx shadcn@latest add @kaotypr-ui/tooltip