# Command

shadcn's command menu (cmdk) in Candor's theme.

- Registry name: `command` (`@candor/command`)
- Tier: Pro. Installing it needs a Pro, Premium or Team licence key: the person runs `npx candor-ui key <key>` themselves; never ask for the key in chat or write it to a file.
- Docs: https://candor.themethodic.com/docs/command

## Install

```bash
npx candor-ui add command
```

Run `npx candor-ui@latest init` once first (https://candor.themethodic.com/get-started.md). Without the CLI: `npx shadcn@latest add @candor/command`.
It brings in: dialog, locale, utils.
npm packages: cmdk@^1.1.1, lucide-react@^1.67.0.

## Example

```tsx
"use client"

import { Flag, GitBranch, Table2 } from "lucide-react"
import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandShortcut } from "@/components/ui/command"

export default function Example() {
  return (
    <Command label="Jump to" className="w-full max-w-sm rounded-lg border">
      <CommandInput placeholder="Search repositories, tables and flags…" />
      <CommandList>
        <CommandEmpty>Nothing matches.</CommandEmpty>
        <CommandGroup heading="Repositories">
          <CommandItem>
            <GitBranch aria-hidden /> acme-api
            <CommandShortcut>⌘1</CommandShortcut>
          </CommandItem>
          <CommandItem>
            <GitBranch aria-hidden /> acme-web
            <CommandShortcut>⌘2</CommandShortcut>
          </CommandItem>
        </CommandGroup>
        <CommandGroup heading="Tables">
          <CommandItem>
            <Table2 aria-hidden /> customers
          </CommandItem>
          <CommandItem>
            <Table2 aria-hidden /> invoices
          </CommandItem>
        </CommandGroup>
        <CommandGroup heading="Flags">
          <CommandItem>
            <Flag aria-hidden /> checkout.new_tax_engine
          </CommandItem>
        </CommandGroup>
      </CommandList>
    </Command>
  )
}
```

## <Command>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive>`.

## <CommandDialog>

Props:

- `title?: string | undefined`: The dialog's title, for screen readers only. Defaults to "Command Palette".
- `description?: string | undefined`: The dialog's description, for screen readers only. Defaults to "Search for a command to run...".
- `className?: string | undefined`
- `showCloseButton?: boolean | undefined` (default `true`): Shows the close (×) button. Defaults to true.

Also takes the props of `React.ComponentProps<typeof Dialog>`.

## <CommandInput>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive.Input>`.

## <CommandList>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive.List>`.

## <CommandEmpty>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive.Empty>`.

## <CommandGroup>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive.Group>`.

## <CommandItem>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive.Item>`.

## <CommandShortcut>

No props.

Also takes the props of `React.ComponentProps<"span">`.

## <CommandSeparator>

No props.

Also takes the props of `React.ComponentProps<typeof CommandPrimitive.Separator>`.

## Strings (`command`)

The fixed words, English by default. Override any of them under `command` in `<LocaleProvider strings={{ command: { … } }}>`; the table is exported as `commandStrings`.

- `title`: Command Palette
- `description`: Search for a command to run...

## Rules for using Candor UI

- Components take plain typed data. Never pass model output as HTML or render it as a link; messages are typed blocks.
- A control that can't be used says why: wrap it in `<Locked reason="…">`, don't just disable it.
- Don't show a value you don't have: leave it out (it renders as —) rather than guess. An estimate is labelled as one.
- Nothing is pre-selected in a decision a person makes, and the agent is named from your app's data, never from model output.
- Your app's words go in `LocaleProvider` (fixed strings) and `TermsProvider` (nouns); entity kinds and agent roles in `EntityKindsProvider` and `AgentRolesProvider`.