Command Palette

Search for a command to run...

Command

shadcn/ui

Fast, composable, unstyled command menu for React.

import {	Command,	CommandDialog,	CommandEmpty,	CommandGroup,	CommandInput,	CommandItem,	CommandList,	CommandSeparator,	CommandShortcut,} from "@/registry/optics/command";<Command className="rounded-lg border shadow-md">	<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>		</CommandGroup>		<CommandSeparator />		<CommandGroup heading="Settings">			<CommandItem>				<User />				<span>Profile</span>				<CommandShortcut>⌘P</CommandShortcut>			</CommandItem>		</CommandGroup>	</CommandList></Command>

Installation

pnpm dlx shadcn@latest add https://optics.agusmayol.com.ar/r/command.json

Props

<Command />
Name
Type
className
string

<CommandDialog />
Name
Type
className
string
title
string (default: "Command Palette")
description
string (default: "Search for a command to run...")
showCloseButton
boolean (default: false)
open
boolean
onOpenChange
(open: boolean) => void
<CommandInput />
Name
Type
className
string
placeholder
string
<CommandList />
Name
Type
className
string
<CommandEmpty />
Name
Type
className
string
<CommandGroup />
Name
Type
className
string
heading
string
<CommandItem />
Name
Type
className
string
value
string
onSelect
(value: string) => void
disabled
boolean
<CommandSeparator />
Name
Type
className
string
<CommandShortcut />
Name
Type
className
string