{
  "name": "combobox",
  "type": "registry:ui",
  "dependencies": [
    "@vueuse/core",
    "reka-ui"
  ],
  "registryDependencies": [
    "input-group"
  ],
  "files": [
    {
      "path": "ui/combobox/Combobox.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxRootEmits, ComboboxRootProps } from \"reka-ui\"\nimport { ComboboxRoot, useForwardPropsEmits } from \"reka-ui\"\n\nconst props = defineProps<ComboboxRootProps>()\nconst emits = defineEmits<ComboboxRootEmits>()\n\nconst forwarded = useForwardPropsEmits(props, emits)\n</script>\n\n<template>\n  <ComboboxRoot\n    v-slot=\"slotProps\"\n    data-slot=\"combobox\"\n    v-bind=\"forwarded\"\n  >\n    <slot v-bind=\"slotProps\" />\n  </ComboboxRoot>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxAnchor.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxAnchorProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxAnchor, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxAnchorProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <ComboboxAnchor\n    data-slot=\"combobox-anchor\"\n    v-bind=\"forwarded\"\n    :class=\"cn('', props.class)\"\n  >\n    <slot />\n  </ComboboxAnchor>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxEmpty.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxEmptyProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxEmpty } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxEmptyProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <ComboboxEmpty\n    data-slot=\"combobox-empty\"\n    v-bind=\"delegatedProps\"\n    :class=\"cn('cn-combobox-empty', props.class)\"\n  >\n    <slot />\n  </ComboboxEmpty>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxGroup.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxGroupProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxGroup, ComboboxLabel } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxGroupProps & {\n  class?: HTMLAttributes[\"class\"]\n  heading?: string\n}>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <ComboboxGroup\n    data-slot=\"combobox-group\"\n    v-bind=\"delegatedProps\"\n    :class=\"cn('cn-combobox-group overflow-hidden text-foreground', props.class)\"\n  >\n    <ComboboxLabel v-if=\"heading\" class=\"cn-combobox-label\">\n      {{ heading }}\n    </ComboboxLabel>\n    <slot />\n  </ComboboxGroup>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxInput.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxInputEmits, ComboboxInputProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxInput, useForwardPropsEmits } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\nimport { IconPlaceholder } from \"@/components/docs/icon-placeholder\"\nimport { InputGroup, InputGroupAddon } from \"@/components/ui/input-group\"\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<ComboboxInputProps & {\n  class?: HTMLAttributes[\"class\"]\n}>()\n\nconst emits = defineEmits<ComboboxInputEmits>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardPropsEmits(delegatedProps, emits)\n</script>\n\n<template>\n  <InputGroup>\n    <InputGroupAddon>\n      <IconPlaceholder lucide=\"SearchIcon\" tabler=\"IconSearch\" hugeicons=\"Search01Icon\" phosphor=\"MagnifyingGlassIcon\" remixicon=\"RiSearchLine\" class=\"cn-command-input-icon\" />\n    </InputGroupAddon>\n    <ComboboxInput\n      data-slot=\"combobox-input\"\n      :class=\"cn('cn-combobox-input flex-1 outline-hidden disabled:cursor-not-allowed disabled:opacity-50', props.class)\"\n      v-bind=\"{ ...$attrs, ...forwarded }\"\n    />\n  </InputGroup>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxItem.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxItemEmits, ComboboxItemProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxItem, useForwardPropsEmits } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxItemProps & { class?: HTMLAttributes[\"class\"] }>()\nconst emits = defineEmits<ComboboxItemEmits>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardPropsEmits(delegatedProps, emits)\n</script>\n\n<template>\n  <ComboboxItem\n    data-slot=\"combobox-item\"\n    v-bind=\"forwarded\"\n    :class=\"cn('cn-combobox-item relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0', props.class)\"\n  >\n    <slot />\n  </ComboboxItem>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxItemIndicator.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxItemIndicatorProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxItemIndicator, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxItemIndicatorProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <ComboboxItemIndicator\n    data-slot=\"combobox-item-indicator\"\n    v-bind=\"forwarded\"\n    :class=\"cn('cn-combobox-item-indicator', props.class)\"\n  >\n    <slot />\n  </ComboboxItemIndicator>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxList.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxContentEmits, ComboboxContentProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxContent, ComboboxPortal, useForwardPropsEmits } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<ComboboxContentProps & { class?: HTMLAttributes[\"class\"] }>(), {\n  position: \"popper\",\n  align: \"center\",\n  sideOffset: 4,\n})\nconst emits = defineEmits<ComboboxContentEmits>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\nconst forwarded = useForwardPropsEmits(delegatedProps, emits)\n</script>\n\n<template>\n  <ComboboxPortal>\n    <ComboboxContent\n      data-slot=\"combobox-content\"\n      v-bind=\"{ ...$attrs, ...forwarded }\"\n      :class=\"cn('cn-combobox-content cn-combobox-content-logical cn-menu-target cn-menu-translucent group/combobox-content z-50 w-(--reka-combobox-trigger-width)', props.class)\"\n    >\n      <slot />\n    </ComboboxContent>\n  </ComboboxPortal>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxSeparator.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxSeparatorProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxSeparator } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxSeparatorProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <ComboboxSeparator\n    data-slot=\"combobox-separator\"\n    v-bind=\"delegatedProps\"\n    :class=\"cn('cn-combobox-separator', props.class)\"\n  >\n    <slot />\n  </ComboboxSeparator>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxTrigger.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxTriggerProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxTrigger, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxTriggerProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <ComboboxTrigger\n    data-slot=\"combobox-trigger\"\n    v-bind=\"forwarded\"\n    :class=\"cn('cn-combobox-trigger', props.class)\"\n    tabindex=\"0\"\n  >\n    <slot />\n  </ComboboxTrigger>\n</template>\n"
    },
    {
      "path": "ui/combobox/ComboboxViewport.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { ComboboxViewportProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { ComboboxViewport, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<ComboboxViewportProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <ComboboxViewport\n    data-slot=\"combobox-viewport\"\n    v-bind=\"forwarded\"\n    :class=\"cn('cn-combobox-list', props.class)\"\n  >\n    <slot />\n  </ComboboxViewport>\n</template>\n"
    },
    {
      "path": "ui/combobox/index.ts",
      "type": "registry:ui",
      "content": "export { default as Combobox } from \"./Combobox.vue\"\nexport { default as ComboboxAnchor } from \"./ComboboxAnchor.vue\"\nexport { default as ComboboxEmpty } from \"./ComboboxEmpty.vue\"\nexport { default as ComboboxGroup } from \"./ComboboxGroup.vue\"\nexport { default as ComboboxInput } from \"./ComboboxInput.vue\"\nexport { default as ComboboxItem } from \"./ComboboxItem.vue\"\nexport { default as ComboboxItemIndicator } from \"./ComboboxItemIndicator.vue\"\nexport { default as ComboboxList } from \"./ComboboxList.vue\"\nexport { default as ComboboxSeparator } from \"./ComboboxSeparator.vue\"\nexport { default as ComboboxTrigger } from \"./ComboboxTrigger.vue\"\nexport { default as ComboboxViewport } from \"./ComboboxViewport.vue\"\n\nexport { ComboboxCancel } from \"reka-ui\"\n"
    }
  ]
}