{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "combobox",
  "dependencies": [
    "@data-slot/combobox"
  ],
  "registryDependencies": [
    "input-group"
  ],
  "files": [
    {
      "path": "ui/combobox/Combobox.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/Combobox.astro directly.\n/**\n * @component Combobox\n * @title Combobox\n * @description A searchable dropdown (autocomplete) that lets users filter and select from a list of options with full keyboard navigation and accessibility support.\n *\n * @preview\n * <Combobox class=\"w-[200px]\">\n *   <ComboboxInput placeholder=\"Select framework...\" showClear />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxEmpty>No results found.</ComboboxEmpty>\n *       <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *       <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *       <ComboboxItem value=\"nuxt\">Nuxt</ComboboxItem>\n *       <ComboboxItem value=\"remix\">Remix</ComboboxItem>\n *       <ComboboxItem value=\"svelte\">SvelteKit</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n *\n * @usage\n *\n * ```astro nocollapse\n * ---\n * import {\n *   Combobox,\n *   ComboboxInput,\n *   ComboboxContent,\n *   ComboboxList,\n *   ComboboxItem,\n *   ComboboxEmpty,\n *   ComboboxGroup,\n *   ComboboxLabel,\n *   ComboboxSeparator,\n * } from '@bejamas/ui/components/combobox';\n * ---\n *\n * <Combobox name=\"framework\">\n *   <ComboboxInput placeholder=\"Select framework...\" />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxEmpty>No results found.</ComboboxEmpty>\n *       <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *       <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n * ```\n *\n * @api\n *\n * ### Events\n *\n * The combobox emits custom events that you can listen to:\n *\n * | Event | Detail | Description |\n * |-------|--------|-------------|\n * | `combobox:change` | `{ value: string \\| null }` | Fired when a new value is selected |\n * | `combobox:open-change` | `{ open: boolean }` | Fired when the dropdown opens or closes |\n * | `combobox:input-change` | `{ inputValue: string }` | Fired when the user types in the input |\n *\n * ```astro nocollapse\n * <Combobox id=\"my-combobox\">\n *   <ComboboxInput placeholder=\"Search...\" />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxItem value=\"option1\">Option 1</ComboboxItem>\n *       <ComboboxItem value=\"option2\">Option 2</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n * ```\n *\n * ```js nocollapse\n *   const combobox = document.getElementById('my-combobox');\n *\n *   combobox.addEventListener('combobox:change', (e) => {\n *     console.log('Selected value:', e.detail.value);\n *   });\n *\n *   combobox.addEventListener('combobox:input-change', (e) => {\n *     console.log('Input text:', e.detail.inputValue);\n *   });\n * ```\n *\n * ### Programmatic Control\n *\n * You can control the combobox programmatically by dispatching a `combobox:set` event:\n *\n * ```js nocollapse\n * const combobox = document.getElementById('my-combobox');\n *\n * // Set a specific value\n * combobox.dispatchEvent(new CustomEvent('combobox:set', {\n *   detail: { value: 'option2' }\n * }));\n *\n * // Clear the value\n * combobox.dispatchEvent(new CustomEvent('combobox:set', {\n *   detail: { value: null }\n * }));\n *\n * // Open the dropdown\n * combobox.dispatchEvent(new CustomEvent('combobox:set', {\n *   detail: { open: true }\n * }));\n *\n * // Set the input text\n * combobox.dispatchEvent(new CustomEvent('combobox:set', {\n *   detail: { inputValue: 'search term' }\n * }));\n *\n * // Custom display text for selected value\n * // itemToStringValue — (item: HTMLElement | null, value: string | null) => string\n * // Controls what text appears in the input after selection.\n * // Useful when items contain rich content (icons, descriptions).\n * combobox.dispatchEvent(new CustomEvent('combobox:set', {\n *   detail: {\n *     itemToStringValue: (item, value) => value ? `TZ: ${value}` : ''\n *   }\n * }));\n * ```\n *\n * ### Data Attributes\n *\n * The combobox sets these data attributes that you can use for styling or querying state:\n *\n * | Attribute | Element | Description |\n * |-----------|---------|-------------|\n * | `data-open` | combobox, combobox-content | Present when the popup is open |\n * | `data-closed` | combobox, combobox-content | Present when the popup is closed |\n * | `data-side` | combobox-content | Resolved popup side |\n * | `data-align` | combobox-content | Resolved popup alignment |\n * | `data-value` | combobox | Currently selected value |\n * | `data-selected` | combobox-item | Present when item is selected |\n * | `data-highlighted` | combobox-item | Present when item is focused/highlighted |\n * | `data-disabled` | combobox, combobox-item | Present when disabled |\n * | `data-empty` | combobox-content | Present when no items match the filter |\n *\n * ### Positioning\n *\n * Placement options are configured on `ComboboxContent`:\n *\n * ```astro nocollapse nopreview\n * <Combobox>\n *   <ComboboxInput />\n *   <ComboboxContent side=\"top\" align=\"start\" sideOffset={8}>\n *     ...\n *   </ComboboxContent>\n * </Combobox>\n * ```\n *\n * @examples\n *\n * ### Clear Button\n *\n * Use the `showClear` prop to show a clear button in the input.\n *\n * <Combobox class=\"w-[200px]\">\n *   <ComboboxInput placeholder=\"Select framework...\" showClear />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxEmpty>No results found.</ComboboxEmpty>\n *       <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *       <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *       <ComboboxItem value=\"nuxt\">Nuxt</ComboboxItem>\n *       <ComboboxItem value=\"remix\">Remix</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n *\n * ### Sizing\n *\n * Use the `size` prop on `ComboboxInput` to match button/input sizing.\n *\n * <div class=\"grid w-full max-w-sm gap-3\">\n *   <Combobox>\n *     <ComboboxInput size=\"sm\" placeholder=\"Small (h-8)\" />\n *     <ComboboxContent>\n *       <ComboboxList>\n *         <ComboboxItem value=\"astro-sm\">Astro</ComboboxItem>\n *         <ComboboxItem value=\"next-sm\">Next.js</ComboboxItem>\n *       </ComboboxList>\n *     </ComboboxContent>\n *   </Combobox>\n *   <Combobox>\n *     <ComboboxInput placeholder=\"Default (h-9)\" />\n *     <ComboboxContent>\n *       <ComboboxList>\n *         <ComboboxItem value=\"astro-default\">Astro</ComboboxItem>\n *         <ComboboxItem value=\"next-default\">Next.js</ComboboxItem>\n *       </ComboboxList>\n *     </ComboboxContent>\n *   </Combobox>\n *   <Combobox>\n *     <ComboboxInput size=\"lg\" placeholder=\"Large (h-10)\" />\n *     <ComboboxContent>\n *       <ComboboxList>\n *         <ComboboxItem value=\"astro-lg\">Astro</ComboboxItem>\n *         <ComboboxItem value=\"next-lg\">Next.js</ComboboxItem>\n *       </ComboboxList>\n *     </ComboboxContent>\n *   </Combobox>\n * </div>\n *\n * ### Groups\n *\n * Use the `ComboboxGroup` and `ComboboxLabel` to group items and add a label to the group.\n *\n * <Combobox class=\"w-[200px]\">\n *   <ComboboxInput placeholder=\"Select framework...\" />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxEmpty>No results found.</ComboboxEmpty>\n *       <ComboboxGroup>\n *         <ComboboxLabel>Frontend</ComboboxLabel>\n *         <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *         <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *         <ComboboxItem value=\"nuxt\">Nuxt</ComboboxItem>\n *       </ComboboxGroup>\n *       <ComboboxSeparator />\n *       <ComboboxGroup>\n *         <ComboboxLabel>Backend</ComboboxLabel>\n *         <ComboboxItem value=\"express\">Express</ComboboxItem>\n *         <ComboboxItem value=\"hono\">Hono</ComboboxItem>\n *       </ComboboxGroup>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n *\n * ### Invalid\n *\n * Use the `aria-invalid=\"true\"` attribute on the `ComboboxInput` to mark the combobox as invalid.\n *\n * <Combobox class=\"w-[200px]\">\n *   <ComboboxInput placeholder=\"Select framework...\" aria-invalid=\"true\" />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *       <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n *\n * ### Disabled\n *\n * Use the `disabled` prop to disable the combobox.\n *\n * <Combobox disabled class=\"w-[200px]\">\n *   <ComboboxInput placeholder=\"Select framework...\" disabled />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *       <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n *\n * ### Auto Highlight\n *\n * Use the `autoHighlight` prop to automatically highlight the first item on filter.\n *\n * <Combobox autoHighlight class=\"w-[200px]\">\n *   <ComboboxInput placeholder=\"Start typing...\" />\n *   <ComboboxContent>\n *     <ComboboxList>\n *       <ComboboxEmpty>No results found.</ComboboxEmpty>\n *       <ComboboxItem value=\"astro\">Astro</ComboboxItem>\n *       <ComboboxItem value=\"next\">Next.js</ComboboxItem>\n *       <ComboboxItem value=\"nuxt\">Nuxt</ComboboxItem>\n *       <ComboboxItem value=\"remix\">Remix</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n *\n * ### Search in Popup\n *\n * You can trigger the combobox from a button or any other component by using the render prop. Move the `ComboboxInput` inside the `ComboboxContent`.\n *\n * <Combobox class=\"w-[200px]\">\n *   <ComboboxTrigger>\n *     <ComboboxValue placeholder=\"Select country...\" />\n *   </ComboboxTrigger>\n *   <ComboboxContent>\n *     <ComboboxInput showTrigger={false} placeholder=\"Search countries...\" />\n *     <ComboboxList>\n *       <ComboboxEmpty>No countries found.</ComboboxEmpty>\n *       <ComboboxItem value=\"brazil\" label=\"Brazil\">Brazil</ComboboxItem>\n *       <ComboboxItem value=\"canada\" label=\"Canada\">Canada</ComboboxItem>\n *       <ComboboxItem value=\"france\" label=\"France\">France</ComboboxItem>\n *       <ComboboxItem value=\"germany\" label=\"Germany\">Germany</ComboboxItem>\n *       <ComboboxItem value=\"japan\" label=\"Japan\">Japan</ComboboxItem>\n *     </ComboboxList>\n *   </ComboboxContent>\n * </Combobox>\n */\n\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n  name?: string;\n  defaultValue?: string;\n  placeholder?: string;\n  disabled?: boolean;\n  required?: boolean;\n  openOnFocus?: boolean;\n  autoHighlight?: boolean;\n}\n\nconst {\n  class: className = \"\",\n  name,\n  defaultValue,\n  placeholder,\n  disabled = false,\n  required = false,\n  openOnFocus,\n  autoHighlight,\n  ...rest\n} = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  data-slot=\"combobox\"\n  data-name={name}\n  data-default-value={defaultValue}\n  data-placeholder={placeholder}\n  data-disabled={disabled ? \"\" : undefined}\n  data-required={required ? \"\" : undefined}\n  data-open-on-focus={openOnFocus !== undefined\n    ? String(openOnFocus)\n    : undefined}\n  data-auto-highlight={autoHighlight !== undefined\n    ? String(autoHighlight)\n    : undefined}\n  class={cn(\"\", \"group/combobox relative inline-block\", className)}\n>\n  <slot />\n</div>\n\n<script>\n  import { createCombobox } from \"@data-slot/combobox\";\n\n  document.querySelectorAll('[data-slot=\"combobox\"]').forEach((el) => {\n    createCombobox(el);\n  });\n\n  // Clear button delegation\n  document.addEventListener(\"click\", (e) => {\n    const target = e.target as Element;\n    const clear = target.closest('[data-slot=\"combobox-clear\"]');\n    if (!clear) return;\n    const root = clear.closest('[data-slot=\"combobox\"]');\n    if (root) {\n      root.dispatchEvent(\n        new CustomEvent(\"combobox:set\", { detail: { value: null } }),\n      );\n    }\n  });\n</script>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxInput.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxInput.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\nimport {\n  InputGroup,\n  InputGroupInput,\n  InputGroupAddon,\n  InputGroupButton,\n} from \"../input-group\";\nimport SemanticIcon from \"../icon/SemanticIcon.astro\";\n\ninterface Props extends Omit<HTMLAttributes<\"input\">, \"size\"> {\n  class?: string;\n  size?: \"sm\" | \"default\" | \"lg\";\n  placeholder?: string;\n  disabled?: boolean;\n  showTrigger?: boolean;\n  showClear?: boolean;\n}\n\nconst {\n  class: className = \"\",\n  size = \"default\",\n  placeholder,\n  disabled = false,\n  showTrigger = true,\n  showClear = false,\n  ...rest\n} = Astro.props as Props;\n---\n\n<InputGroup size={size} class={cn(\"w-auto\", className)}>\n  <InputGroupInput\n    data-input-group-control\n    data-slot=\"combobox-input\"\n    placeholder={placeholder}\n    disabled={disabled}\n    autocomplete=\"off\"\n    {...rest}\n   class=\"\" />\n  {\n    (showTrigger || showClear) && (\n      <InputGroupAddon align=\"inline-end\">\n        {showClear && (\n          <InputGroupButton\n            data-slot=\"combobox-clear\"\n            type=\"button\"\n            size=\"icon-xs\"\n            class=\"hidden [[data-value]_&]:inline-flex\"\n            aria-label=\"Clear selection\"\n          >\n            <SemanticIcon name=\"x\" class=\"size-3.5 group-data-[size=sm]/input-group:size-3\" />\n          </InputGroupButton>\n        )}\n        {showTrigger && (\n          <InputGroupButton\n            data-slot=\"combobox-trigger\"\n            type=\"button\"\n            size=\"icon-xs\"\n            tabindex={-1}\n            disabled={disabled}\n            class={cn(\"[&_svg:not([class*='size-'])]:size-4 rounded-lg\", \n              \"text-muted-foreground\",\n              showClear && \"[[data-value]_&]:hidden\",\n            )}\n            aria-label=\"Toggle menu\"\n          >\n            <SemanticIcon\n              name=\"chevron-down\"\n              data-slot=\"combobox-icon\"\n              class=\"size-4 group-data-[size=sm]/input-group:size-3.5\"\n            />\n          </InputGroupButton>\n        )}\n      </InputGroupAddon>\n    )\n  }\n</InputGroup>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxContent.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxContent.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n  side?: \"top\" | \"bottom\";\n  align?: \"start\" | \"center\" | \"end\";\n  sideOffset?: number;\n  alignOffset?: number;\n}\n\nconst {\n  class: className = \"\",\n  side = \"bottom\",\n  align = \"center\",\n  sideOffset = 6,\n  alignOffset = 0,\n  ...rest\n} = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  data-slot=\"combobox-content\"\n  data-side={side}\n  data-align={align}\n  data-side-offset={sideOffset}\n  data-align-offset={alignOffset}\n  hidden\n  class={cn(\n    \"bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 *:data-[slot=input-group]:bg-input/30 *:data-[slot=input-group]:border-input/30 max-h-72 min-w-36 overflow-hidden rounded-md shadow-md ring-1 duration-100 *:data-[slot=input-group]:m-1 *:data-[slot=input-group]:mb-0 *:data-[slot=input-group]:h-8 *:data-[slot=input-group]:shadow-none rounded-lg data-[side=inline-start]:slide-in-from-right-2 data-[side=inline-end]:slide-in-from-left-2 cn-menu-target cn-menu-translucent group/combobox-content relative w-[var(--anchor-width)] max-h-[var(--available-height)] max-w-[var(--available-width)] min-w-[max(8rem,var(--anchor-width))] origin-(--transform-origin)\",\n    className,\n  )}\n>\n  <slot />\n</div>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxList.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxList.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n}\n\nconst { class: className = \"\", ...rest } = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  data-slot=\"combobox-list\"\n  class={cn(\n    \"no-scrollbar max-h-[min(calc(--spacing(72)---spacing(9)),calc(var(--available-height)---spacing(9)))] scroll-py-1 overflow-y-auto p-1 data-empty:p-0 max-h-[min(18rem,calc(var(--available-height)-var(--anchor-height)))] overscroll-contain\",\n    className,\n  )}\n>\n  <slot />\n</div>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxItem.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxItem.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\nimport SemanticIcon from \"../icon/SemanticIcon.astro\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  value: string;\n  label?: string;\n  disabled?: boolean;\n  class?: string;\n}\n\nconst {\n  value,\n  label,\n  disabled = false,\n  class: className = \"\",\n  ...rest\n} = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  data-slot=\"combobox-item\"\n  data-value={value}\n  data-label={label}\n  data-disabled={disabled ? \"\" : undefined}\n  class={cn(\n    \"data-highlighted:bg-accent data-highlighted:text-accent-foreground not-data-[variant=destructive]:data-highlighted:**:text-accent-foreground gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm [&_svg:not([class*='size-'])]:size-4 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\",\n    className,\n  )}\n>\n  <span\n    data-slot=\"combobox-item-indicator\"\n    class=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\"\n  >\n    <SemanticIcon\n      name=\"check\"\n      class=\"pointer-events-none\"\n    />\n  </span>\n  <span data-slot=\"combobox-item-text\" class=\"flex flex-1 gap-2\"><slot /></span>\n</div>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxGroup.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxGroup.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n}\n\nconst { class: className = \"\", ...rest } = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  role=\"group\"\n  data-slot=\"combobox-group\"\n  class={cn(\"\", \"scroll-my-1\", className)}\n>\n  <slot />\n</div>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxLabel.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxLabel.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n}\n\nconst { class: className = \"\", ...rest } = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  data-slot=\"combobox-label\"\n  class={cn(\"text-muted-foreground px-2 py-1.5 text-xs\", className)}\n>\n  <slot />\n</div>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxSeparator.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxSeparator.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n}\n\nconst { class: className = \"\", ...rest } = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  role=\"separator\"\n  data-slot=\"combobox-separator\"\n  class={cn(\"bg-border -mx-1 my-1 h-px\", className)}\n/>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxEmpty.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxEmpty.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"div\"> {\n  class?: string;\n}\n\nconst { class: className = \"\", ...rest } = Astro.props as Props;\n---\n\n<div\n  {...rest}\n  data-slot=\"combobox-empty\"\n  class={cn(\"text-muted-foreground hidden w-full justify-center py-2 text-center text-sm group-data-empty/combobox-content:flex\", className)}\n>\n  <slot />\n</div>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxTrigger.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxTrigger.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\nimport SemanticIcon from \"../icon/SemanticIcon.astro\";\n\ninterface Props extends HTMLAttributes<\"button\"> {\n  class?: string;\n  size?: \"sm\" | \"default\" | \"lg\";\n}\n\nconst {\n  class: className = \"\",\n  size = \"default\",\n  ...rest\n} = Astro.props as Props;\n---\n\n<button\n  {...rest}\n  type=\"button\"\n  data-slot=\"combobox-trigger\"\n  data-size={size}\n  class={cn(\n    \"[&_svg:not([class*='size-'])]:size-4 rounded-lg flex w-full items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=combobox-value]:line-clamp-1 *:data-[slot=combobox-value]:flex *:data-[slot=combobox-value]:items-center [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n    className,\n  )}\n>\n  <slot />\n  <SemanticIcon\n    name=\"chevron-down\"\n    class=\"text-muted-foreground size-4 pointer-events-none\"\n    data-slot=\"combobox-icon\"\n  />\n</button>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/ComboboxValue.astro",
      "content": "---\n// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/ComboboxValue.astro directly.\nimport type { HTMLAttributes } from \"astro/types\";\nimport { cn } from \"@/lib/utils\";\n\ninterface Props extends HTMLAttributes<\"span\"> {\n  class?: string;\n  placeholder?: string;\n}\n\nconst {\n  class: className = \"\",\n  placeholder = \"\",\n  ...rest\n} = Astro.props as Props;\n---\n\n<span\n  {...rest}\n  data-slot=\"combobox-value\"\n  data-placeholder={placeholder}\n  class={cn(\"\", \"block truncate pointer-events-none\", className)}\n>{placeholder}</span>\n",
      "type": "registry:ui"
    },
    {
      "path": "ui/combobox/index.ts",
      "content": "// Generated from bejamas-juno style registry. Do not edit packages/ui/src/components/combobox/index.ts directly.\nexport { default as Combobox } from \"./Combobox.astro\";\nexport { default as ComboboxInput } from \"./ComboboxInput.astro\";\nexport { default as ComboboxContent } from \"./ComboboxContent.astro\";\nexport { default as ComboboxList } from \"./ComboboxList.astro\";\nexport { default as ComboboxItem } from \"./ComboboxItem.astro\";\nexport { default as ComboboxGroup } from \"./ComboboxGroup.astro\";\nexport { default as ComboboxLabel } from \"./ComboboxLabel.astro\";\nexport { default as ComboboxSeparator } from \"./ComboboxSeparator.astro\";\nexport { default as ComboboxEmpty } from \"./ComboboxEmpty.astro\";\nexport { default as ComboboxTrigger } from \"./ComboboxTrigger.astro\";\nexport { default as ComboboxValue } from \"./ComboboxValue.astro\";\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}