{
	"$schema": "https://shadcn-svelte.com/schema/registry-item.json",
	"name": "command",
	"title": "Command",
	"type": "registry:ui",
	"description": "Kura Command component source.",
	"devDependencies": [
		"bits-ui@^2.18.1",
		"@internationalized/date@^3.12.2",
		"phosphor-svelte@^3.1.0"
	],
	"registryDependencies": [
		"dialog",
		"input-group",
		"utils"
	],
	"files": [
		{
			"content": "<script lang=\"ts\">\n  import type { Command as CommandPrimitive, Dialog as DialogPrimitive } from 'bits-ui';\n  import type { Snippet } from 'svelte';\n  import Command from './command.svelte';\n  import * as Dialog from '$UI$/dialog/index.js';\n  import { cn, type WithoutChildrenOrChild } from '$UTILS$.js';\n\n  let {\n    open = $bindable(false),\n    ref = $bindable(null),\n    value = $bindable(''),\n    title = 'Command Palette',\n    description = 'Search for a command to run...',\n    showCloseButton = false,\n    portalProps,\n    children,\n    class: className,\n    ...restProps\n  }: WithoutChildrenOrChild<DialogPrimitive.RootProps> &\n    WithoutChildrenOrChild<CommandPrimitive.RootProps> & {\n      portalProps?: DialogPrimitive.PortalProps;\n      children: Snippet;\n      title?: string;\n      description?: string;\n      showCloseButton?: boolean;\n      class?: string;\n    } = $props();\n</script>\n\n<Dialog.Root bind:open {...restProps}>\n  <Dialog.Header class=\"sr-only\">\n    <Dialog.Title>{title}</Dialog.Title>\n    <Dialog.Description>{description}</Dialog.Description>\n  </Dialog.Header>\n  <Dialog.Content\n    class={cn(\n      'top-1/3 translate-y-0 overflow-hidden border-[#222225] bg-[#09090b] p-0 shadow-none',\n      className\n    )}\n    {showCloseButton}\n    {portalProps}\n  >\n    <Command {...restProps} bind:value bind:ref {children} />\n  </Dialog.Content>\n</Dialog.Root>\n",
			"type": "registry:file",
			"target": "command/command-dialog.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: CommandPrimitive.EmptyProps = $props();\n</script>\n\n<CommandPrimitive.Empty\n  bind:ref\n  data-slot=\"command-empty\"\n  class={cn(\n    'py-6 text-center font-mono text-xs uppercase tracking-[0.08em] text-zinc-500',\n    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "command/command-empty.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive, useId } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    heading,\n    value,\n    ...restProps\n  }: CommandPrimitive.GroupProps & {\n    heading?: string;\n  } = $props();\n</script>\n\n<CommandPrimitive.Group\n  bind:ref\n  data-slot=\"command-group\"\n  class={cn(\n    'overflow-hidden p-1.5 text-zinc-50 **:[[cmdk-group-heading]]:px-3 **:[[cmdk-group-heading]]:py-2 **:[[cmdk-group-heading]]:font-mono **:[[cmdk-group-heading]]:text-xs **:[[cmdk-group-heading]]:font-semibold **:[[cmdk-group-heading]]:uppercase **:[[cmdk-group-heading]]:tracking-[0.08em] **:[[cmdk-group-heading]]:text-zinc-500',\n    className\n  )}\n  value={value ?? heading ?? `----${useId()}`}\n  {...restProps}\n>\n  {#if heading}\n    <CommandPrimitive.GroupHeading\n      class=\"px-2 py-1.5 font-mono text-xs font-medium uppercase tracking-[0.08em] text-zinc-500\"\n    >\n      {heading}\n    </CommandPrimitive.GroupHeading>\n  {/if}\n  <CommandPrimitive.GroupItems {children} />\n</CommandPrimitive.Group>\n",
			"type": "registry:file",
			"target": "command/command-group.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n  import * as InputGroup from '$UI$/input-group/index.js';\n  import MagnifyingGlassIcon from 'phosphor-svelte/lib/MagnifyingGlass';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    value = $bindable(''),\n    ...restProps\n  }: CommandPrimitive.InputProps = $props();\n</script>\n\n<div data-slot=\"command-input-wrapper\" class=\"border-b border-[#222225] bg-[#09090b] p-1\">\n  <InputGroup.Root\n    class=\"border-transparent bg-[#18181b] px-3 shadow-[inset_0_0_0_1px_rgba(161,161,170,0.12)]\"\n  >\n    <CommandPrimitive.Input\n      {value}\n      data-slot=\"command-input\"\n      class={cn(\n        'w-full px-2 font-mono text-xs text-zinc-50 placeholder:text-zinc-500 outline-hidden disabled:cursor-not-allowed disabled:opacity-50',\n        className\n      )}\n      {...restProps}\n    >\n      {#snippet child({ props })}\n        <InputGroup.Input {...props} bind:value bind:ref />\n      {/snippet}\n    </CommandPrimitive.Input>\n    <InputGroup.Addon>\n      <MagnifyingGlassIcon class=\"size-3.5 shrink-0 text-[#d0e891] opacity-80\" />\n    </InputGroup.Addon>\n  </InputGroup.Root>\n</div>\n",
			"type": "registry:file",
			"target": "command/command-input.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n  import CheckIcon from 'phosphor-svelte/lib/Check';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: CommandPrimitive.ItemProps = $props();\n</script>\n\n<CommandPrimitive.Item\n  bind:ref\n  data-slot=\"command-item\"\n  class={cn(\n    \"group/command-item relative flex cursor-default items-center gap-2 border border-transparent px-2 py-1.5 font-mono text-xs uppercase tracking-[0.04em] text-zinc-300 outline-hidden select-none data-selected:border-[#b9d765]/50 data-selected:bg-[#18181b] data-selected:text-zinc-50 data-selected:*:[svg]:text-[#d0e891] data-[checked=true]:text-[#d0e891] in-data-[slot=dialog-content]:rounded-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    className\n  )}\n  {...restProps}\n>\n  {@render children?.()}\n  <CheckIcon\n    class=\"cn-command-item-indicator ml-auto text-[#d0e891] opacity-0 group-has-[[data-slot=command-shortcut]]/command-item:hidden group-data-[checked=true]/command-item:opacity-100\"\n  />\n</CommandPrimitive.Item>\n",
			"type": "registry:file",
			"target": "command/command-item.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: CommandPrimitive.LinkItemProps = $props();\n</script>\n\n<CommandPrimitive.LinkItem\n  bind:ref\n  data-slot=\"command-item\"\n  class={cn(\n    \"relative flex cursor-default items-center gap-2 border border-transparent px-2 py-1.5 font-mono text-xs uppercase tracking-[0.04em] text-zinc-300 outline-hidden select-none aria-selected:border-[#b9d765]/50 aria-selected:bg-[#18181b] aria-selected:text-zinc-50 [&_svg:not([class*='text-'])]:text-[#d0e891] 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    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "command/command-link-item.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: CommandPrimitive.ListProps = $props();\n</script>\n\n<CommandPrimitive.List\n  bind:ref\n  data-slot=\"command-list\"\n  class={cn(\n    'no-scrollbar max-h-72 scroll-py-1 overflow-x-hidden overflow-y-auto border-t border-[#222225] outline-none',\n    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "command/command-list.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: CommandPrimitive.LoadingProps = $props();\n</script>\n\n<CommandPrimitive.Loading\n  bind:ref\n  class={cn('px-3 py-2 font-mono text-xs uppercase tracking-[0.08em] text-zinc-500', className)}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "command/command-loading.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { Command as CommandPrimitive } from 'bits-ui';\n  import { cn } from '$UTILS$.js';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    ...restProps\n  }: CommandPrimitive.SeparatorProps = $props();\n</script>\n\n<CommandPrimitive.Separator\n  bind:ref\n  data-slot=\"command-separator\"\n  class={cn('-mx-1.5 my-1.5 h-px bg-[#222225]', className)}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "command/command-separator.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { cn, type WithElementRef } from '$UTILS$.js';\n  import type { HTMLAttributes } from 'svelte/elements';\n\n  let {\n    ref = $bindable(null),\n    class: className,\n    children,\n    ...restProps\n  }: WithElementRef<HTMLAttributes<HTMLSpanElement>> = $props();\n</script>\n\n<span\n  bind:this={ref}\n  data-slot=\"command-shortcut\"\n  class={cn(\n    'ml-auto font-mono text-[11px] uppercase tracking-[0.12em] text-zinc-500 group-data-selected/command-item:text-[#d0e891]',\n    className\n  )}\n  {...restProps}\n>\n  {@render children?.()}\n</span>\n",
			"type": "registry:file",
			"target": "command/command-shortcut.svelte"
		},
		{
			"content": "<script lang=\"ts\">\n  import { cn } from '$UTILS$.js';\n  import { Command as CommandPrimitive } from 'bits-ui';\n\n  export type CommandRootApi = CommandPrimitive.Root;\n\n  let {\n    api = $bindable(null),\n    ref = $bindable(null),\n    value = $bindable(''),\n    class: className,\n    ...restProps\n  }: CommandPrimitive.RootProps & {\n    api?: CommandRootApi | null;\n  } = $props();\n</script>\n\n<CommandPrimitive.Root\n  bind:this={api}\n  bind:value\n  bind:ref\n  data-slot=\"command\"\n  class={cn(\n    'flex size-full flex-col overflow-hidden border border-[#222225] bg-[#09090b] text-zinc-50 shadow-none',\n    className\n  )}\n  {...restProps}\n/>\n",
			"type": "registry:file",
			"target": "command/command.svelte"
		},
		{
			"content": "import Root from './command.svelte';\nimport Loading from './command-loading.svelte';\nimport Dialog from './command-dialog.svelte';\nimport Empty from './command-empty.svelte';\nimport Group from './command-group.svelte';\nimport Item from './command-item.svelte';\nimport Input from './command-input.svelte';\nimport List from './command-list.svelte';\nimport Separator from './command-separator.svelte';\nimport Shortcut from './command-shortcut.svelte';\nimport LinkItem from './command-link-item.svelte';\n\nexport {\n  Root,\n  Dialog,\n  Empty,\n  Group,\n  Item,\n  LinkItem,\n  Input,\n  List,\n  Separator,\n  Shortcut,\n  Loading,\n  //\n  Root as Command,\n  Dialog as CommandDialog,\n  Empty as CommandEmpty,\n  Group as CommandGroup,\n  Item as CommandItem,\n  LinkItem as CommandLinkItem,\n  Input as CommandInput,\n  List as CommandList,\n  Separator as CommandSeparator,\n  Shortcut as CommandShortcut,\n  Loading as CommandLoading\n};\n",
			"type": "registry:file",
			"target": "command/index.ts"
		}
	]
}