Components
Command
A command component
Preview
Loading...
import { Calculator, Calendar, CreditCard, Settings, Smile, User,} from "lucide-react";import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut,} from "@/registry/axon/ui/command";export default function CommandDemo() { return ( <Command className="rounded-lg border shadow-md md:min-w-[450px]"> <CommandInput placeholder="Type a command or search..." /> <CommandList> <CommandEmpty>No results found.</CommandEmpty> <CommandGroup heading="Suggestions"> <CommandItem> <Calendar /> <span>Calendar</span> </CommandItem> <CommandItem> <Smile /> <span>Search Emoji</span> </CommandItem> <CommandItem disabled> <Calculator /> <span>Calculator</span> </CommandItem> </CommandGroup> <CommandSeparator /> <CommandGroup heading="Settings"> <CommandItem> <User /> <span>Profile</span> <CommandShortcut>⌘P</CommandShortcut> </CommandItem> <CommandItem> <CreditCard /> <span>Billing</span> <CommandShortcut>⌘B</CommandShortcut> </CommandItem> <CommandItem> <Settings /> <span>Settings</span> <CommandShortcut>⌘S</CommandShortcut> </CommandItem> </CommandGroup> </CommandList> </Command> );}Installation
CLI
npx shadcn@latest add @emberui/commandyarn shadcn@latest add @emberui/commandpnpm dlx shadcn@latest add @emberui/commandbunx --bun shadcn@latest add @emberui/commandReference
This component is based on the shadcn/ui Command component.