{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "command-dialog",
  "type": "registry:ui",
  "title": "Command dialog",
  "description": "Command dialog that opens the command palette in a modal from a list of commands with labels and handlers. Wire it to a Cmd K shortcut in your React app.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "https://ui.minidev.pro/r/button.json",
    "https://ui.minidev.pro/r/command-palette.json"
  ],
  "files": [
    {
      "path": "registry/ui/command-dialog.tsx",
      "type": "registry:ui",
      "target": "components/ui/command-dialog.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { SearchIcon } from \"lucide-react\"\nimport { CommandPalette } from \"@/components/ui/command-palette\"\nimport { Button } from \"@/components/ui/button\"\n\ntype Command = { id: string; label: string; onSelect?: () => void }\n\n/** A command palette in a dialog; uncontrolled with its own \"Search commands\" trigger unless `open` is passed. */\ntype CommandDialogProps = {\n  /** Controlled open state. Leave undefined to get a built-in trigger button and internal state. */\n  open?: boolean\n  onOpenChange?: (o: boolean) => void\n  commands?: Command[]\n}\n\nconst SAMPLE_COMMANDS: Command[] = [\n  { id: \"new-invoice\", label: \"New invoice\" },\n  { id: \"add-customer\", label: \"Add customer\" },\n  { id: \"record-payment\", label: \"Record a payment\" },\n  { id: \"go-deploys\", label: \"Go to deploys\" },\n  { id: \"export-csv\", label: \"Export customers to CSV\" },\n  { id: \"toggle-theme\", label: \"Toggle dark mode\" },\n]\n\nfunction CommandDialog({ open, onOpenChange, commands = SAMPLE_COMMANDS }: CommandDialogProps) {\n  const [inner, setInner] = React.useState(false)\n  const uncontrolled = open === undefined\n  const isOpen = open ?? inner\n  const setOpen = (o: boolean) => {\n    if (uncontrolled) setInner(o)\n    onOpenChange?.(o)\n  }\n  return (\n    <div data-slot=\"command-dialog\">\n      {uncontrolled ? (\n        <Button type=\"button\" variant=\"outline\" onClick={() => setOpen(true)} aria-haspopup=\"dialog\" aria-expanded={isOpen}>\n          <SearchIcon />\n          Search commands\n        </Button>\n      ) : null}\n      <CommandPalette open={isOpen} onOpenChange={setOpen} commands={commands} />\n    </div>\n  )\n}\nexport { CommandDialog }\nexport type { CommandDialogProps, Command as CommandDialogCommand }\n"
    }
  ]
}
