Command

Paleta de comandos com busca e navegação por teclado. Construído sobre cmdk. Usado no AppSidebar como diálogo de busca rápida (atalho /).

import {
  Command, CommandEmpty, CommandGroup,
  CommandInput, CommandItem, CommandList,
} from "@workspace/ui/components/command";

<Command>
  <CommandInput placeholder="Buscar..." />
  <CommandList>
    <CommandEmpty>Nenhum resultado.</CommandEmpty>
    <CommandGroup heading="Navegação">
      <CommandItem>Página Inicial</CommandItem>
      <CommandItem>Consultoras</CommandItem>
    </CommandGroup>
  </CommandList>
</Command>

Inline

Command embutido como campo de busca filtrado.

Anatomia

Estrutura do componente Command.

Componente	Função
`CommandInput`	Campo de busca com ícone de lupa
`CommandList`	Container de resultados com scroll (máx. 300px)
`CommandEmpty`	Mensagem quando não há resultados
`CommandGroup`	Agrupamento com heading opcional
`CommandItem`	Item selecionável via teclado/mouse
`CommandSeparator`	Divisor entre grupos
`CommandShortcut`	Atalho de teclado (alinhado à direita)

API Reference

Prop	Type	Default	Descrição
`CommandInput.placeholder`	`string`	—	Texto placeholder do campo de busca
`CommandGroup.heading`	`string`	—	Título do grupo de itens
`CommandItem.onSelect`	`(value: string) => void`	—	Callback ao selecionar um item
`CommandItem.disabled`	`boolean`	false	Desabilita o item
`CommandShortcut.children`	`ReactNode`	—	Texto do atalho (ex: ⌘K)
`CommandDialog`	`DialogProps`	—	Wrapper que abre o Command dentro de um Dialog modal