{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "command",
  "title": "Command",
  "description": "Fast, composable, unstyled command menu for React.",
  "dependencies": [
    "cmdk",
    "lucide-react",
    "clsx",
    "tailwind-merge"
  ],
  "registryDependencies": [
    "https://optics.agusmayol.com.ar/r/dialog.json",
    "https://optics.agusmayol.com.ar/r/scroll-area.json",
    "https://optics.agusmayol.com.ar/r/utils.json"
  ],
  "files": [
    {
      "path": "registry/optics/command.jsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { Command as CommandPrimitive } from \"cmdk\";\n\nimport { cn } from \"@/lib/utils\";\nimport {\n\tDialog,\n\tDialogPopup,\n\tDialogDescription,\n\tDialogHeader,\n\tDialogTitle,\n} from \"@/registry/optics/dialog\";\nimport { ScrollArea } from \"@/registry/optics/scroll-area\";\nimport { SearchIcon } from \"lucide-react\";\n\nfunction Command({ className = \"\", ...props }) {\n\treturn (\n\t\t<CommandPrimitive\n\t\t\tdata-slot=\"command\"\n\t\t\tclassName={cn(\n\t\t\t\t\"bg-popover text-popover-foreground flex h-full w-full flex-col overflow-hidden rounded-2xl\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandDialog({\n\ttitle = \"Command Palette\",\n\tdescription = \"Search for a command to run...\",\n\tchildren = null,\n\tclassName = \"\",\n\tshowCloseButton = false,\n\t...props\n}) {\n\treturn (\n\t\t<Dialog {...props}>\n\t\t\t<DialogHeader className=\"sr-only\">\n\t\t\t\t<DialogTitle>{title}</DialogTitle>\n\t\t\t\t<DialogDescription>{description}</DialogDescription>\n\t\t\t</DialogHeader>\n\t\t\t<DialogPopup\n\t\t\t\tclassName={cn(\"overflow-hidden\", className)}\n\t\t\t\tshowCloseButton={showCloseButton}\n\t\t\t\tcontainerClassName=\"p-0\"\n\t\t\t>\n\t\t\t\t<Command className=\"[&_[cmdk-group-heading]]:text-muted-foreground **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5\">\n\t\t\t\t\t{children}\n\t\t\t\t</Command>\n\t\t\t</DialogPopup>\n\t\t</Dialog>\n\t);\n}\n\nfunction CommandInput({ className = \"\", ...props }) {\n\treturn (\n\t\t<div\n\t\t\tdata-slot=\"command-input-wrapper\"\n\t\t\tclassName=\"flex h-9 items-center gap-2 border-b px-3 bg-background\"\n\t\t>\n\t\t\t<SearchIcon className=\"size-4 shrink-0 opacity-50\" />\n\t\t\t<CommandPrimitive.Input\n\t\t\t\tdata-slot=\"command-input\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"placeholder:text-muted-foreground flex h-10 w-full rounded-xl bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction CommandList({ className = \"\", ...props }) {\n\treturn (\n\t\t<ScrollArea\n\t\t\tclassName={cn(\"max-h-[300px]\", className)}\n\t\t\tviewportClassName=\"scroll-py-1\"\n\t\t>\n\t\t\t<CommandPrimitive.List\n\t\t\t\tdata-slot=\"command-list\"\n\t\t\t\tclassName=\"overflow-x-hidden\"\n\t\t\t\t{...props}\n\t\t\t/>\n\t\t</ScrollArea>\n\t);\n}\n\nfunction CommandEmpty({ ...props } = {}) {\n\treturn (\n\t\t<CommandPrimitive.Empty\n\t\t\tdata-slot=\"command-empty\"\n\t\t\tclassName=\"py-6 text-center text-sm\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandGroup({ className = \"\", ...props }) {\n\treturn (\n\t\t<CommandPrimitive.Group\n\t\t\tdata-slot=\"command-group\"\n\t\t\tclassName={cn(\n\t\t\t\t\"text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden p-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandSeparator({ className = \"\", ...props }) {\n\treturn (\n\t\t<CommandPrimitive.Separator\n\t\t\tdata-slot=\"command-separator\"\n\t\t\tclassName={cn(\"bg-border -mx-1 h-px\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandItem({ className = \"\", ...props }) {\n\treturn (\n\t\t<CommandPrimitive.Item\n\t\t\tdata-slot=\"command-item\"\n\t\t\tclassName={cn(\n\t\t\t\t\"data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-lg px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CommandShortcut({ className = \"\", ...props }) {\n\treturn (\n\t\t<span\n\t\t\tdata-slot=\"command-shortcut\"\n\t\t\tclassName={cn(\n\t\t\t\t\"text-muted-foreground ml-auto text-xs tracking-widest\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nCommand.displayName = \"Command\";\nCommandDialog.displayName = \"CommandDialog\";\nCommandInput.displayName = \"CommandInput\";\nCommandList.displayName = \"CommandList\";\nCommandEmpty.displayName = \"CommandEmpty\";\nCommandGroup.displayName = \"CommandGroup\";\nCommandItem.displayName = \"CommandItem\";\nCommandShortcut.displayName = \"CommandShortcut\";\nCommandSeparator.displayName = \"CommandSeparator\";\n\nexport {\n\tCommand,\n\tCommandDialog,\n\tCommandInput,\n\tCommandList,\n\tCommandEmpty,\n\tCommandGroup,\n\tCommandItem,\n\tCommandShortcut,\n\tCommandSeparator,\n};\n",
      "type": "registry:component",
      "target": "components/optics/command.jsx"
    }
  ],
  "type": "registry:component"
}