{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "command",
  "type": "registry:ui",
  "title": "Command",
  "description": "A command component",
  "dependencies": [
    "solid-js",
    "cmdk-solid",
    "@kobalte/core"
  ],
  "registryDependencies": [
    "https://solid-ui.com/r/dialog.json"
  ],
  "files": [
    {
      "path": "src/registry/ui/command.tsx",
      "content": "import type { Component, ComponentProps, ParentProps, VoidProps } from \"solid-js\"\nimport { splitProps } from \"solid-js\"\n\nimport type { DialogRootProps } from \"@kobalte/core/dialog\"\nimport * as CommandPrimitive from \"cmdk-solid\"\n\nimport { cn } from \"~/lib/utils\"\nimport { Dialog, DialogContent } from \"~/registry/ui/dialog\"\n\nconst Command: Component<ParentProps<CommandPrimitive.CommandRootProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <CommandPrimitive.CommandRoot\n      class={cn(\n        \"flex size-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground blur-none\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\nconst CommandDialog: Component<ParentProps<DialogRootProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"children\"])\n\n  return (\n    <Dialog {...others}>\n      <DialogContent class=\"overflow-hidden p-0\">\n        <Command class=\"[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:size-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:size-5\">\n          {local.children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  )\n}\n\nconst CommandInput: Component<VoidProps<CommandPrimitive.CommandInputProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <div class=\"flex items-center border-b px-3\" cmdk-input-wrapper=\"\">\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        class=\"mr-2 size-4 shrink-0 opacity-50\"\n      >\n        <path d=\"M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0\" />\n        <path d=\"M21 21l-6 -6\" />\n      </svg>\n      <CommandPrimitive.CommandInput\n        class={cn(\n          \"flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50\",\n          local.class\n        )}\n        {...others}\n      />\n    </div>\n  )\n}\n\nconst CommandList: Component<ParentProps<CommandPrimitive.CommandListProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <CommandPrimitive.CommandList\n      class={cn(\"max-h-[300px] overflow-y-auto overflow-x-hidden\", local.class)}\n      {...others}\n    />\n  )\n}\n\nconst CommandEmpty: Component<ParentProps<CommandPrimitive.CommandEmptyProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <CommandPrimitive.CommandEmpty\n      class={cn(\"py-6 text-center text-sm\", local.class)}\n      {...others}\n    />\n  )\n}\n\nconst CommandGroup: Component<ParentProps<CommandPrimitive.CommandGroupProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <CommandPrimitive.CommandGroup\n      class={cn(\n        \"overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\nconst CommandSeparator: Component<VoidProps<CommandPrimitive.CommandSeparatorProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return <CommandPrimitive.CommandSeparator class={cn(\"h-px bg-border\", local.class)} {...others} />\n}\n\nconst CommandItem: Component<ParentProps<CommandPrimitive.CommandItemProps>> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <CommandPrimitive.CommandItem\n      cmdk-item=\"\"\n      class={cn(\n        \"relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\nconst CommandShortcut: Component<ComponentProps<\"span\">> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n\n  return (\n    <span\n      class={cn(\"ml-auto text-xs tracking-widest text-muted-foreground\", local.class)}\n      {...others}\n    />\n  )\n}\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandShortcut,\n  CommandSeparator\n}\n",
      "type": "registry:ui"
    }
  ]
}