reka-ui 2.1.1 → 2.2.1

package/dist/Combobox/ComboboxContentImpl.cjs

@@ -4,13 +4,13 @@ const vue = require('vue');
 const DismissableLayer_DismissableLayer = require('../DismissableLayer/DismissableLayer.cjs');
 const Popper_PopperContent = require('../Popper/PopperContent.cjs');
 const shared_useBodyScrollLock = require('../shared/useBodyScrollLock.cjs');
+const shared_createContext = require('../shared/createContext.cjs');
+const Combobox_ComboboxRoot = require('./ComboboxRoot.cjs');
 const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const shared_useHideOthers = require('../shared/useHideOthers.cjs');
 const shared_useForwardProps = require('../shared/useForwardProps.cjs');
 const Listbox_ListboxContent = require('../Listbox/ListboxContent.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
-const shared_createContext = require('../shared/createContext.cjs');
-const Combobox_ComboboxRoot = require('./ComboboxRoot.cjs');
 
 const [injectComboboxContentContext, provideComboboxContentContext] = shared_createContext.createContext("ComboboxContent");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({

package/dist/Combobox/ComboboxContentImpl.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxContentImpl.cjs","sources":["../../src/Combobox/ComboboxContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose, useForwardProps, useHideOthers } from '@/shared'\nimport { useBodyScrollLock } from '@/shared/useBodyScrollLock'\n\nimport type { DismissableLayerEmits, DismissableLayerProps } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\n\nexport type ComboboxContentImplEmits = DismissableLayerEmits\n\nexport interface ComboboxContentImplProps extends PopperContentProps, DismissableLayerProps {\n  /**\n   * The positioning mode to use, <br>\n   * `inline` is the default and you can control the position using CSS. <br>\n   * `popper` positions content in the same way as our other primitives, for example `Popover` or `DropdownMenu`.\n   */\n  position?: 'inline' | 'popper'\n  /** The document.body will be lock, and scrolling will be disabled. */\n  bodyLock?: boolean\n}\n\nexport const [injectComboboxContentContext, provideComboboxContentContext]\n  = createContext<{\n    position: Ref<'inline' | 'popper'>\n  }>('ComboboxContent')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, toRefs } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport { DismissableLayer } from '@/DismissableLayer'\nimport { PopperContent } from '@/Popper'\nimport { Primitive } from '@/Primitive'\nimport { ListboxContent } from '@/Listbox'\n\nconst props = withDefaults(defineProps<ComboboxContentImplProps>(), {\n  position: 'inline',\n})\nconst emits = defineEmits<ComboboxContentImplEmits>()\n\nconst { position } = toRefs(props)\nconst rootContext = injectComboboxRootContext()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nuseBodyScrollLock(props.bodyLock)\nuseHideOthers(rootContext.parentElement)\n\nconst pickedProps = computed(() => {\n  if (props.position === 'popper')\n    return props\n  else return {}\n})\n\nconst forwardedProps = useForwardProps(pickedProps.value)\n\nconst popperStyle = {\n  // Ensure border-box for floating-ui calculations\n  'boxSizing': 'border-box',\n  '--reka-combobox-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n  '--reka-combobox-content-available-width':\n        'var(--reka-popper-available-width)',\n  '--reka-combobox-content-available-height':\n        'var(--reka-popper-available-height)',\n  '--reka-combobox-trigger-width': 'var(--reka-popper-anchor-width)',\n  '--reka-combobox-trigger-height': 'var(--reka-popper-anchor-height)',\n}\n\nprovideComboboxContentContext({ position })\n\n// Handle case where input position within the content\nconst isInputWithinContent = ref(false)\nonMounted(() => {\n  if (rootContext.inputElement.value) {\n    isInputWithinContent.value = currentElement.value.contains(rootContext.inputElement.value)\n    if (isInputWithinContent.value) {\n      rootContext.inputElement.value.focus()\n    }\n  }\n})\n\nonUnmounted(() => {\n  if (isInputWithinContent.value) {\n    rootContext.triggerElement.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <ListboxContent as-child>\n    <DismissableLayer\n      as-child\n      :disable-outside-pointer-events=\"disableOutsidePointerEvents\"\n      @dismiss=\"rootContext.onOpenChange(false)\"\n      @focus-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('focusOutside', ev)\n      }\"\n      @interact-outside=\"emits('interactOutside', $event)\"\n      @escape-key-down=\"emits('escapeKeyDown', $event)\"\n      @pointer-down-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('pointerDownOutside', ev)\n      }\"\n    >\n      <component\n        :is=\"position === 'popper' ? PopperContent : Primitive\"\n        v-bind=\"{ ...$attrs, ...forwardedProps }\"\n        :id=\"rootContext.contentId\"\n        :ref=\"forwardRef\"\n        :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n        :style=\"{\n          // flex layout so we can place the scroll buttons properly\n          display: 'flex',\n          flexDirection: 'column',\n          // reset the outline by default as the content MAY get focused\n          outline: 'none',\n          ...(position === 'popper' ? popperStyle : {}),\n        }\"\n      >\n        <slot />\n      </component>\n    </DismissableLayer>\n  </ListboxContent>\n</template>\n"],"names":["createContext","toRefs","injectComboboxRootContext","useForwardExpose","useBodyScrollLock","useHideOthers","computed","useForwardProps","ref","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;AAqBO,MAAM,CAAC,4BAAA,EAA8B,6BAA6B,CAAA,GACrEA,mCAEC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWtB,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,EAAE,QAAA,EAAa,GAAAC,UAAA,CAAO,KAAK,CAAA;AACjC,IAAA,MAAM,cAAcC,+CAA0B,EAAA;AAE9C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,IAAAC,0CAAA,CAAkB,MAAM,QAAQ,CAAA;AAChC,IAAAC,kCAAA,CAAc,YAAY,aAAa,CAAA;AAEvC,IAAM,MAAA,WAAA,GAAcC,aAAS,MAAM;AACjC,MAAA,IAAI,MAAM,QAAa,KAAA,QAAA;AACrB,QAAO,OAAA,KAAA;AAAA,kBACG,EAAC;AAAA,KACd,CAAA;AAED,IAAM,MAAA,cAAA,GAAiBC,sCAAgB,CAAA,WAAA,CAAY,KAAK,CAAA;AAExD,IAAA,MAAM,WAAc,GAAA;AAAA;AAAA,MAElB,WAAa,EAAA,YAAA;AAAA,MACb,0CACM,EAAA,qCAAA;AAAA,MACN,yCACM,EAAA,oCAAA;AAAA,MACN,0CACM,EAAA,qCAAA;AAAA,MACN,+BAAiC,EAAA,iCAAA;AAAA,MACjC,gCAAkC,EAAA;AAAA,KACpC;AAEA,IAA8B,6BAAA,CAAA,EAAE,UAAU,CAAA;AAG1C,IAAM,MAAA,oBAAA,GAAuBC,QAAI,KAAK,CAAA;AACtC,IAAAC,aAAA,CAAU,MAAM;AACd,MAAI,IAAA,WAAA,CAAY,aAAa,KAAO,EAAA;AAClC,QAAA,oBAAA,CAAqB,QAAQ,cAAe,CAAA,KAAA,CAAM,QAAS,CAAA,WAAA,CAAY,aAAa,KAAK,CAAA;AACzF,QAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,UAAY,WAAA,CAAA,YAAA,CAAa,MAAM,KAAM,EAAA;AAAA;AACvC;AACF,KACD,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,QAAY,WAAA,CAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA;AAC1C,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxContentImpl.cjs","sources":["../../src/Combobox/ComboboxContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DismissableLayerEmits, DismissableLayerProps } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\nimport type { Ref } from 'vue'\n\nimport { createContext, useForwardExpose, useForwardProps, useHideOthers } from '@/shared'\nimport { useBodyScrollLock } from '@/shared/useBodyScrollLock'\n\nexport type ComboboxContentImplEmits = DismissableLayerEmits\n\nexport interface ComboboxContentImplProps extends PopperContentProps, DismissableLayerProps {\n  /**\n   * The positioning mode to use, <br>\n   * `inline` is the default and you can control the position using CSS. <br>\n   * `popper` positions content in the same way as our other primitives, for example `Popover` or `DropdownMenu`.\n   */\n  position?: 'inline' | 'popper'\n  /** The document.body will be lock, and scrolling will be disabled. */\n  bodyLock?: boolean\n}\n\nexport const [injectComboboxContentContext, provideComboboxContentContext]\n  = createContext<{\n    position: Ref<'inline' | 'popper'>\n  }>('ComboboxContent')\n</script>\n\n<script setup lang=\"ts\">\nimport { DismissableLayer } from '@/DismissableLayer'\nimport { ListboxContent } from '@/Listbox'\nimport { PopperContent } from '@/Popper'\nimport { Primitive } from '@/Primitive'\nimport { computed, onMounted, onUnmounted, ref, toRefs } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nconst props = withDefaults(defineProps<ComboboxContentImplProps>(), {\n  position: 'inline',\n})\nconst emits = defineEmits<ComboboxContentImplEmits>()\n\nconst { position } = toRefs(props)\nconst rootContext = injectComboboxRootContext()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nuseBodyScrollLock(props.bodyLock)\nuseHideOthers(rootContext.parentElement)\n\nconst pickedProps = computed(() => {\n  if (props.position === 'popper')\n    return props\n  else return {}\n})\n\nconst forwardedProps = useForwardProps(pickedProps.value)\n\nconst popperStyle = {\n  // Ensure border-box for floating-ui calculations\n  'boxSizing': 'border-box',\n  '--reka-combobox-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n  '--reka-combobox-content-available-width':\n        'var(--reka-popper-available-width)',\n  '--reka-combobox-content-available-height':\n        'var(--reka-popper-available-height)',\n  '--reka-combobox-trigger-width': 'var(--reka-popper-anchor-width)',\n  '--reka-combobox-trigger-height': 'var(--reka-popper-anchor-height)',\n}\n\nprovideComboboxContentContext({ position })\n\n// Handle case where input position within the content\nconst isInputWithinContent = ref(false)\nonMounted(() => {\n  if (rootContext.inputElement.value) {\n    isInputWithinContent.value = currentElement.value.contains(rootContext.inputElement.value)\n    if (isInputWithinContent.value) {\n      rootContext.inputElement.value.focus()\n    }\n  }\n})\n\nonUnmounted(() => {\n  if (isInputWithinContent.value) {\n    rootContext.triggerElement.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <ListboxContent as-child>\n    <DismissableLayer\n      as-child\n      :disable-outside-pointer-events=\"disableOutsidePointerEvents\"\n      @dismiss=\"rootContext.onOpenChange(false)\"\n      @focus-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('focusOutside', ev)\n      }\"\n      @interact-outside=\"emits('interactOutside', $event)\"\n      @escape-key-down=\"emits('escapeKeyDown', $event)\"\n      @pointer-down-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('pointerDownOutside', ev)\n      }\"\n    >\n      <component\n        :is=\"position === 'popper' ? PopperContent : Primitive\"\n        v-bind=\"{ ...$attrs, ...forwardedProps }\"\n        :id=\"rootContext.contentId\"\n        :ref=\"forwardRef\"\n        :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n        :style=\"{\n          // flex layout so we can place the scroll buttons properly\n          display: 'flex',\n          flexDirection: 'column',\n          // reset the outline by default as the content MAY get focused\n          outline: 'none',\n          ...(position === 'popper' ? popperStyle : {}),\n        }\"\n      >\n        <slot />\n      </component>\n    </DismissableLayer>\n  </ListboxContent>\n</template>\n"],"names":["createContext","toRefs","injectComboboxRootContext","useForwardExpose","useBodyScrollLock","useHideOthers","computed","useForwardProps","ref","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;AAqBO,MAAM,CAAC,4BAAA,EAA8B,6BAA6B,CAAA,GACrEA,mCAEC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWtB,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,EAAE,QAAA,EAAa,GAAAC,UAAA,CAAO,KAAK,CAAA;AACjC,IAAA,MAAM,cAAcC,+CAA0B,EAAA;AAE9C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,IAAAC,0CAAA,CAAkB,MAAM,QAAQ,CAAA;AAChC,IAAAC,kCAAA,CAAc,YAAY,aAAa,CAAA;AAEvC,IAAM,MAAA,WAAA,GAAcC,aAAS,MAAM;AACjC,MAAA,IAAI,MAAM,QAAa,KAAA,QAAA;AACrB,QAAO,OAAA,KAAA;AAAA,kBACG,EAAC;AAAA,KACd,CAAA;AAED,IAAM,MAAA,cAAA,GAAiBC,sCAAgB,CAAA,WAAA,CAAY,KAAK,CAAA;AAExD,IAAA,MAAM,WAAc,GAAA;AAAA;AAAA,MAElB,WAAa,EAAA,YAAA;AAAA,MACb,0CACM,EAAA,qCAAA;AAAA,MACN,yCACM,EAAA,oCAAA;AAAA,MACN,0CACM,EAAA,qCAAA;AAAA,MACN,+BAAiC,EAAA,iCAAA;AAAA,MACjC,gCAAkC,EAAA;AAAA,KACpC;AAEA,IAA8B,6BAAA,CAAA,EAAE,UAAU,CAAA;AAG1C,IAAM,MAAA,oBAAA,GAAuBC,QAAI,KAAK,CAAA;AACtC,IAAAC,aAAA,CAAU,MAAM;AACd,MAAI,IAAA,WAAA,CAAY,aAAa,KAAO,EAAA;AAClC,QAAA,oBAAA,CAAqB,QAAQ,cAAe,CAAA,KAAA,CAAM,QAAS,CAAA,WAAA,CAAY,aAAa,KAAK,CAAA;AACzF,QAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,UAAY,WAAA,CAAA,YAAA,CAAa,MAAM,KAAM,EAAA;AAAA;AACvC;AACF,KACD,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,QAAY,WAAA,CAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA;AAC1C,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxContentImpl.js

@@ -1,14 +1,14 @@
-import { defineComponent, toRefs, computed, ref, onMounted, onUnmounted, openBlock, createBlock, unref, withCtx, createVNode, resolveDynamicComponent, mergeProps, renderSlot } from 'vue';
+import { defineComponent, toRefs, computed, ref, onMounted, onUnmounted, createBlock, openBlock, unref, withCtx, createVNode, resolveDynamicComponent, mergeProps, renderSlot } from 'vue';
 import { _ as _sfc_main$2 } from '../DismissableLayer/DismissableLayer.js';
 import { _ as _sfc_main$3 } from '../Popper/PopperContent.js';
 import { u as useBodyScrollLock } from '../shared/useBodyScrollLock.js';
+import { c as createContext } from '../shared/createContext.js';
+import { i as injectComboboxRootContext } from './ComboboxRoot.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { u as useHideOthers } from '../shared/useHideOthers.js';
 import { u as useForwardProps } from '../shared/useForwardProps.js';
 import { _ as _sfc_main$1 } from '../Listbox/ListboxContent.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
-import { c as createContext } from '../shared/createContext.js';
-import { i as injectComboboxRootContext } from './ComboboxRoot.js';
 
 const [injectComboboxContentContext, provideComboboxContentContext] = createContext("ComboboxContent");
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/Combobox/ComboboxContentImpl.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxContentImpl.js","sources":["../../src/Combobox/ComboboxContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose, useForwardProps, useHideOthers } from '@/shared'\nimport { useBodyScrollLock } from '@/shared/useBodyScrollLock'\n\nimport type { DismissableLayerEmits, DismissableLayerProps } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\n\nexport type ComboboxContentImplEmits = DismissableLayerEmits\n\nexport interface ComboboxContentImplProps extends PopperContentProps, DismissableLayerProps {\n  /**\n   * The positioning mode to use, <br>\n   * `inline` is the default and you can control the position using CSS. <br>\n   * `popper` positions content in the same way as our other primitives, for example `Popover` or `DropdownMenu`.\n   */\n  position?: 'inline' | 'popper'\n  /** The document.body will be lock, and scrolling will be disabled. */\n  bodyLock?: boolean\n}\n\nexport const [injectComboboxContentContext, provideComboboxContentContext]\n  = createContext<{\n    position: Ref<'inline' | 'popper'>\n  }>('ComboboxContent')\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, ref, toRefs } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport { DismissableLayer } from '@/DismissableLayer'\nimport { PopperContent } from '@/Popper'\nimport { Primitive } from '@/Primitive'\nimport { ListboxContent } from '@/Listbox'\n\nconst props = withDefaults(defineProps<ComboboxContentImplProps>(), {\n  position: 'inline',\n})\nconst emits = defineEmits<ComboboxContentImplEmits>()\n\nconst { position } = toRefs(props)\nconst rootContext = injectComboboxRootContext()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nuseBodyScrollLock(props.bodyLock)\nuseHideOthers(rootContext.parentElement)\n\nconst pickedProps = computed(() => {\n  if (props.position === 'popper')\n    return props\n  else return {}\n})\n\nconst forwardedProps = useForwardProps(pickedProps.value)\n\nconst popperStyle = {\n  // Ensure border-box for floating-ui calculations\n  'boxSizing': 'border-box',\n  '--reka-combobox-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n  '--reka-combobox-content-available-width':\n        'var(--reka-popper-available-width)',\n  '--reka-combobox-content-available-height':\n        'var(--reka-popper-available-height)',\n  '--reka-combobox-trigger-width': 'var(--reka-popper-anchor-width)',\n  '--reka-combobox-trigger-height': 'var(--reka-popper-anchor-height)',\n}\n\nprovideComboboxContentContext({ position })\n\n// Handle case where input position within the content\nconst isInputWithinContent = ref(false)\nonMounted(() => {\n  if (rootContext.inputElement.value) {\n    isInputWithinContent.value = currentElement.value.contains(rootContext.inputElement.value)\n    if (isInputWithinContent.value) {\n      rootContext.inputElement.value.focus()\n    }\n  }\n})\n\nonUnmounted(() => {\n  if (isInputWithinContent.value) {\n    rootContext.triggerElement.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <ListboxContent as-child>\n    <DismissableLayer\n      as-child\n      :disable-outside-pointer-events=\"disableOutsidePointerEvents\"\n      @dismiss=\"rootContext.onOpenChange(false)\"\n      @focus-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('focusOutside', ev)\n      }\"\n      @interact-outside=\"emits('interactOutside', $event)\"\n      @escape-key-down=\"emits('escapeKeyDown', $event)\"\n      @pointer-down-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('pointerDownOutside', ev)\n      }\"\n    >\n      <component\n        :is=\"position === 'popper' ? PopperContent : Primitive\"\n        v-bind=\"{ ...$attrs, ...forwardedProps }\"\n        :id=\"rootContext.contentId\"\n        :ref=\"forwardRef\"\n        :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n        :style=\"{\n          // flex layout so we can place the scroll buttons properly\n          display: 'flex',\n          flexDirection: 'column',\n          // reset the outline by default as the content MAY get focused\n          outline: 'none',\n          ...(position === 'popper' ? popperStyle : {}),\n        }\"\n      >\n        <slot />\n      </component>\n    </DismissableLayer>\n  </ListboxContent>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAqBO,MAAM,CAAC,4BAAA,EAA8B,6BAA6B,CAAA,GACrE,cAEC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWtB,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,EAAE,QAAA,EAAa,GAAA,MAAA,CAAO,KAAK,CAAA;AACjC,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAE9C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AACxD,IAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAChC,IAAA,aAAA,CAAc,YAAY,aAAa,CAAA;AAEvC,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAA,IAAI,MAAM,QAAa,KAAA,QAAA;AACrB,QAAO,OAAA,KAAA;AAAA,kBACG,EAAC;AAAA,KACd,CAAA;AAED,IAAM,MAAA,cAAA,GAAiB,eAAgB,CAAA,WAAA,CAAY,KAAK,CAAA;AAExD,IAAA,MAAM,WAAc,GAAA;AAAA;AAAA,MAElB,WAAa,EAAA,YAAA;AAAA,MACb,0CACM,EAAA,qCAAA;AAAA,MACN,yCACM,EAAA,oCAAA;AAAA,MACN,0CACM,EAAA,qCAAA;AAAA,MACN,+BAAiC,EAAA,iCAAA;AAAA,MACjC,gCAAkC,EAAA;AAAA,KACpC;AAEA,IAA8B,6BAAA,CAAA,EAAE,UAAU,CAAA;AAG1C,IAAM,MAAA,oBAAA,GAAuB,IAAI,KAAK,CAAA;AACtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAI,IAAA,WAAA,CAAY,aAAa,KAAO,EAAA;AAClC,QAAA,oBAAA,CAAqB,QAAQ,cAAe,CAAA,KAAA,CAAM,QAAS,CAAA,WAAA,CAAY,aAAa,KAAK,CAAA;AACzF,QAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,UAAY,WAAA,CAAA,YAAA,CAAa,MAAM,KAAM,EAAA;AAAA;AACvC;AACF,KACD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,QAAY,WAAA,CAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA;AAC1C,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxContentImpl.js","sources":["../../src/Combobox/ComboboxContentImpl.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { DismissableLayerEmits, DismissableLayerProps } from '@/DismissableLayer'\nimport type { PopperContentProps } from '@/Popper'\nimport type { Ref } from 'vue'\n\nimport { createContext, useForwardExpose, useForwardProps, useHideOthers } from '@/shared'\nimport { useBodyScrollLock } from '@/shared/useBodyScrollLock'\n\nexport type ComboboxContentImplEmits = DismissableLayerEmits\n\nexport interface ComboboxContentImplProps extends PopperContentProps, DismissableLayerProps {\n  /**\n   * The positioning mode to use, <br>\n   * `inline` is the default and you can control the position using CSS. <br>\n   * `popper` positions content in the same way as our other primitives, for example `Popover` or `DropdownMenu`.\n   */\n  position?: 'inline' | 'popper'\n  /** The document.body will be lock, and scrolling will be disabled. */\n  bodyLock?: boolean\n}\n\nexport const [injectComboboxContentContext, provideComboboxContentContext]\n  = createContext<{\n    position: Ref<'inline' | 'popper'>\n  }>('ComboboxContent')\n</script>\n\n<script setup lang=\"ts\">\nimport { DismissableLayer } from '@/DismissableLayer'\nimport { ListboxContent } from '@/Listbox'\nimport { PopperContent } from '@/Popper'\nimport { Primitive } from '@/Primitive'\nimport { computed, onMounted, onUnmounted, ref, toRefs } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nconst props = withDefaults(defineProps<ComboboxContentImplProps>(), {\n  position: 'inline',\n})\nconst emits = defineEmits<ComboboxContentImplEmits>()\n\nconst { position } = toRefs(props)\nconst rootContext = injectComboboxRootContext()\n\nconst { forwardRef, currentElement } = useForwardExpose()\nuseBodyScrollLock(props.bodyLock)\nuseHideOthers(rootContext.parentElement)\n\nconst pickedProps = computed(() => {\n  if (props.position === 'popper')\n    return props\n  else return {}\n})\n\nconst forwardedProps = useForwardProps(pickedProps.value)\n\nconst popperStyle = {\n  // Ensure border-box for floating-ui calculations\n  'boxSizing': 'border-box',\n  '--reka-combobox-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n  '--reka-combobox-content-available-width':\n        'var(--reka-popper-available-width)',\n  '--reka-combobox-content-available-height':\n        'var(--reka-popper-available-height)',\n  '--reka-combobox-trigger-width': 'var(--reka-popper-anchor-width)',\n  '--reka-combobox-trigger-height': 'var(--reka-popper-anchor-height)',\n}\n\nprovideComboboxContentContext({ position })\n\n// Handle case where input position within the content\nconst isInputWithinContent = ref(false)\nonMounted(() => {\n  if (rootContext.inputElement.value) {\n    isInputWithinContent.value = currentElement.value.contains(rootContext.inputElement.value)\n    if (isInputWithinContent.value) {\n      rootContext.inputElement.value.focus()\n    }\n  }\n})\n\nonUnmounted(() => {\n  if (isInputWithinContent.value) {\n    rootContext.triggerElement.value?.focus()\n  }\n})\n</script>\n\n<template>\n  <ListboxContent as-child>\n    <DismissableLayer\n      as-child\n      :disable-outside-pointer-events=\"disableOutsidePointerEvents\"\n      @dismiss=\"rootContext.onOpenChange(false)\"\n      @focus-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('focusOutside', ev)\n      }\"\n      @interact-outside=\"emits('interactOutside', $event)\"\n      @escape-key-down=\"emits('escapeKeyDown', $event)\"\n      @pointer-down-outside=\"(ev) => {\n        // if clicking inside the combobox, prevent dismiss\n        if (rootContext.parentElement.value?.contains(ev.target as Node)) ev.preventDefault()\n        emits('pointerDownOutside', ev)\n      }\"\n    >\n      <component\n        :is=\"position === 'popper' ? PopperContent : Primitive\"\n        v-bind=\"{ ...$attrs, ...forwardedProps }\"\n        :id=\"rootContext.contentId\"\n        :ref=\"forwardRef\"\n        :data-state=\"rootContext.open.value ? 'open' : 'closed'\"\n        :style=\"{\n          // flex layout so we can place the scroll buttons properly\n          display: 'flex',\n          flexDirection: 'column',\n          // reset the outline by default as the content MAY get focused\n          outline: 'none',\n          ...(position === 'popper' ? popperStyle : {}),\n        }\"\n      >\n        <slot />\n      </component>\n    </DismissableLayer>\n  </ListboxContent>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;AAqBO,MAAM,CAAC,4BAAA,EAA8B,6BAA6B,CAAA,GACrE,cAEC,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWtB,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,EAAE,QAAA,EAAa,GAAA,MAAA,CAAO,KAAK,CAAA;AACjC,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAE9C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AACxD,IAAA,iBAAA,CAAkB,MAAM,QAAQ,CAAA;AAChC,IAAA,aAAA,CAAc,YAAY,aAAa,CAAA;AAEvC,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAA,IAAI,MAAM,QAAa,KAAA,QAAA;AACrB,QAAO,OAAA,KAAA;AAAA,kBACG,EAAC;AAAA,KACd,CAAA;AAED,IAAM,MAAA,cAAA,GAAiB,eAAgB,CAAA,WAAA,CAAY,KAAK,CAAA;AAExD,IAAA,MAAM,WAAc,GAAA;AAAA;AAAA,MAElB,WAAa,EAAA,YAAA;AAAA,MACb,0CACM,EAAA,qCAAA;AAAA,MACN,yCACM,EAAA,oCAAA;AAAA,MACN,0CACM,EAAA,qCAAA;AAAA,MACN,+BAAiC,EAAA,iCAAA;AAAA,MACjC,gCAAkC,EAAA;AAAA,KACpC;AAEA,IAA8B,6BAAA,CAAA,EAAE,UAAU,CAAA;AAG1C,IAAM,MAAA,oBAAA,GAAuB,IAAI,KAAK,CAAA;AACtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAI,IAAA,WAAA,CAAY,aAAa,KAAO,EAAA;AAClC,QAAA,oBAAA,CAAqB,QAAQ,cAAe,CAAA,KAAA,CAAM,QAAS,CAAA,WAAA,CAAY,aAAa,KAAK,CAAA;AACzF,QAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,UAAY,WAAA,CAAA,YAAA,CAAa,MAAM,KAAM,EAAA;AAAA;AACvC;AACF,KACD,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,IAAI,qBAAqB,KAAO,EAAA;AAC9B,QAAY,WAAA,CAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA;AAC1C,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxEmpty.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxEmpty.cjs","sources":["../../src/Combobox/ComboboxEmpty.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { computed } from 'vue'\n\nexport interface ComboboxEmptyProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = defineProps<ComboboxEmptyProps>()\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value\n  ? rootContext.allItems.value.size === 0\n  : !!rootContext.filterState.search && rootContext.filterState.filtered.count === 0,\n)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"isRender\"\n    v-bind=\"props\"\n  >\n    <slot>No options</slot>\n  </Primitive>\n</template>\n"],"names":["injectComboboxRootContext","computed"],"mappings":";;;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,cAAcA,+CAA0B,EAAA;AAE9C,IAAA,MAAM,QAAW,GAAAC,YAAA;AAAA,MAAS,MAAM,WAAY,CAAA,YAAA,CAAa,KACrD,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,IAAA,KAAS,CACpC,GAAA,CAAC,CAAC,WAAY,CAAA,WAAA,CAAY,UAAU,WAAY,CAAA,WAAA,CAAY,SAAS,KAAU,KAAA;AAAA,KACnF;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxEmpty.cjs","sources":["../../src/Combobox/ComboboxEmpty.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { computed } from 'vue'\n\nexport interface ComboboxEmptyProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nconst props = defineProps<ComboboxEmptyProps>()\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value\n  ? rootContext.allItems.value.size === 0\n  : !!rootContext.filterState.search && rootContext.filterState.filtered.count === 0,\n)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"isRender\"\n    v-bind=\"props\"\n  >\n    <slot>No options</slot>\n  </Primitive>\n</template>\n"],"names":["injectComboboxRootContext","computed"],"mappings":";;;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,cAAcA,+CAA0B,EAAA;AAE9C,IAAA,MAAM,QAAW,GAAAC,YAAA;AAAA,MAAS,MAAM,WAAY,CAAA,YAAA,CAAa,KACrD,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,IAAA,KAAS,CACpC,GAAA,CAAC,CAAC,WAAY,CAAA,WAAA,CAAY,UAAU,WAAY,CAAA,WAAA,CAAY,SAAS,KAAU,KAAA;AAAA,KACnF;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxEmpty.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, openBlock, createBlock, unref, normalizeProps, mergeProps, withCtx, renderSlot, createTextVNode, createCommentVNode } from 'vue';
+import { defineComponent, computed, createBlock, createCommentVNode, openBlock, unref, normalizeProps, mergeProps, withCtx, renderSlot, createTextVNode } from 'vue';
 import { P as Primitive } from '../Primitive/Primitive.js';
 import { i as injectComboboxRootContext } from './ComboboxRoot.js';
 

package/dist/Combobox/ComboboxEmpty.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxEmpty.js","sources":["../../src/Combobox/ComboboxEmpty.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { computed } from 'vue'\n\nexport interface ComboboxEmptyProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = defineProps<ComboboxEmptyProps>()\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value\n  ? rootContext.allItems.value.size === 0\n  : !!rootContext.filterState.search && rootContext.filterState.filtered.count === 0,\n)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"isRender\"\n    v-bind=\"props\"\n  >\n    <slot>No options</slot>\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAE9C,IAAA,MAAM,QAAW,GAAA,QAAA;AAAA,MAAS,MAAM,WAAY,CAAA,YAAA,CAAa,KACrD,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,IAAA,KAAS,CACpC,GAAA,CAAC,CAAC,WAAY,CAAA,WAAA,CAAY,UAAU,WAAY,CAAA,WAAA,CAAY,SAAS,KAAU,KAAA;AAAA,KACnF;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxEmpty.js","sources":["../../src/Combobox/ComboboxEmpty.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { computed } from 'vue'\n\nexport interface ComboboxEmptyProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nconst props = defineProps<ComboboxEmptyProps>()\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value\n  ? rootContext.allItems.value.size === 0\n  : !!rootContext.filterState.search && rootContext.filterState.filtered.count === 0,\n)\n</script>\n\n<template>\n  <Primitive\n    v-if=\"isRender\"\n    v-bind=\"props\"\n  >\n    <slot>No options</slot>\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAE9C,IAAA,MAAM,QAAW,GAAA,QAAA;AAAA,MAAS,MAAM,WAAY,CAAA,YAAA,CAAa,KACrD,GAAA,WAAA,CAAY,SAAS,KAAM,CAAA,IAAA,KAAS,CACpC,GAAA,CAAC,CAAC,WAAY,CAAA,WAAA,CAAY,UAAU,WAAY,CAAA,WAAA,CAAY,SAAS,KAAU,KAAA;AAAA,KACnF;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxGroup.cjs

@@ -2,8 +2,8 @@
 
 const vue = require('vue');
 const shared_useId = require('../shared/useId.cjs');
-const Listbox_ListboxGroup = require('../Listbox/ListboxGroup.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
+const Listbox_ListboxGroup = require('../Listbox/ListboxGroup.cjs');
 const Combobox_ComboboxRoot = require('./ComboboxRoot.cjs');
 
 const [injectComboboxGroupContext, provideComboboxGroupContext] = shared_createContext.createContext("ComboboxGroup");
@@ -15,7 +15,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const id = shared_useId.useId(undefined, "reka-combobox-group");
+    const id = shared_useId.useId(void 0, "reka-combobox-group");
     const rootContext = Combobox_ComboboxRoot.injectComboboxRootContext();
     const isRender = vue.computed(() => rootContext.ignoreFilter.value ? true : !rootContext.filterState.search ? true : rootContext.filterState.filtered.groups.has(id));
     const context = provideComboboxGroupContext({
@@ -34,7 +34,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         id: vue.unref(id),
         "aria-labelledby": vue.unref(context).labelId
       }, props, {
-        hidden: isRender.value ? undefined : true
+        hidden: isRender.value ? void 0 : true
       }), {
         default: vue.withCtx(() => [
           vue.renderSlot(_ctx.$slots, "default")

package/dist/Combobox/ComboboxGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxGroup.cjs","sources":["../../src/Combobox/ComboboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxGroupProps } from '@/Listbox'\nimport { createContext, useId } from '@/shared'\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nexport interface ComboboxGroupProps extends ListboxGroupProps {}\n\ntype ComboboxGroupContext = {\n  id: string\n  labelId: string\n}\n\nexport const [injectComboboxGroupContext, provideComboboxGroupContext]\n  = createContext<ComboboxGroupContext>('ComboboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { ListboxGroup } from '@/Listbox'\n\nconst props = defineProps<ComboboxGroupProps>()\nconst id = useId(undefined, 'reka-combobox-group')\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value ? true : !rootContext.filterState.search ? true : rootContext.filterState.filtered.groups.has(id))\n\nconst context = provideComboboxGroupContext({\n  id,\n  labelId: '',\n})\n\nonMounted(() => {\n  if (!rootContext.allGroups.value.has(id))\n    rootContext.allGroups.value.set(id, new Set())\n})\nonUnmounted(() => {\n  rootContext.allGroups.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxGroup\n    :id=\"id\"\n    :aria-labelledby=\"context.labelId\"\n    v-bind=\"props\"\n    :hidden=\"isRender ? undefined : true\"\n  >\n    <slot />\n  </ListboxGroup>\n</template>\n"],"names":["createContext","useId","injectComboboxRootContext","computed","onMounted","onUnmounted"],"mappings":";;;;;;;;AAaO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe;;;;;;;;AAMvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAM,MAAA,EAAA,GAAKC,kBAAM,CAAA,SAAA,EAAW,qBAAqB,CAAA;AACjD,IAAA,MAAM,cAAcC,+CAA0B,EAAA;AAE9C,IAAA,MAAM,WAAWC,YAAS,CAAA,MAAM,YAAY,YAAa,CAAA,KAAA,GAAQ,OAAO,CAAC,WAAA,CAAY,WAAY,CAAA,MAAA,GAAS,OAAO,WAAY,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,GAAA,CAAI,EAAE,CAAC,CAAA;AAEhK,IAAA,MAAM,UAAU,2BAA4B,CAAA;AAAA,MAC1C,EAAA;AAAA,MACA,OAAS,EAAA;AAAA,KACV,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,WAAA,CAAY,SAAU,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AACrC,QAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,EAAI,kBAAA,IAAI,KAAK,CAAA;AAAA,KAChD,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,SAAA,CAAU,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACtC,CAAA;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxGroup.cjs","sources":["../../src/Combobox/ComboboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxGroupProps } from '@/Listbox'\nimport { createContext, useId } from '@/shared'\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nexport interface ComboboxGroupProps extends ListboxGroupProps {}\n\ntype ComboboxGroupContext = {\n  id: string\n  labelId: string\n}\n\nexport const [injectComboboxGroupContext, provideComboboxGroupContext]\n  = createContext<ComboboxGroupContext>('ComboboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { ListboxGroup } from '@/Listbox'\n\nconst props = defineProps<ComboboxGroupProps>()\nconst id = useId(undefined, 'reka-combobox-group')\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value ? true : !rootContext.filterState.search ? true : rootContext.filterState.filtered.groups.has(id))\n\nconst context = provideComboboxGroupContext({\n  id,\n  labelId: '',\n})\n\nonMounted(() => {\n  if (!rootContext.allGroups.value.has(id))\n    rootContext.allGroups.value.set(id, new Set())\n})\nonUnmounted(() => {\n  rootContext.allGroups.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxGroup\n    :id=\"id\"\n    :aria-labelledby=\"context.labelId\"\n    v-bind=\"props\"\n    :hidden=\"isRender ? undefined : true\"\n  >\n    <slot />\n  </ListboxGroup>\n</template>\n"],"names":["createContext","useId","injectComboboxRootContext","computed","onMounted","onUnmounted"],"mappings":";;;;;;;;AAaO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe;;;;;;;;AAMvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAM,MAAA,EAAA,GAAKC,kBAAM,CAAA,MAAA,EAAW,qBAAqB,CAAA;AACjD,IAAA,MAAM,cAAcC,+CAA0B,EAAA;AAE9C,IAAA,MAAM,WAAWC,YAAS,CAAA,MAAM,YAAY,YAAa,CAAA,KAAA,GAAQ,OAAO,CAAC,WAAA,CAAY,WAAY,CAAA,MAAA,GAAS,OAAO,WAAY,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,GAAA,CAAI,EAAE,CAAC,CAAA;AAEhK,IAAA,MAAM,UAAU,2BAA4B,CAAA;AAAA,MAC1C,EAAA;AAAA,MACA,OAAS,EAAA;AAAA,KACV,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,WAAA,CAAY,SAAU,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AACrC,QAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,EAAI,kBAAA,IAAI,KAAK,CAAA;AAAA,KAChD,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,SAAA,CAAU,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACtC,CAAA;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxGroup.js

@@ -1,7 +1,7 @@
-import { defineComponent, computed, onMounted, onUnmounted, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, onMounted, onUnmounted, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { u as useId } from '../shared/useId.js';
-import { _ as _sfc_main$1 } from '../Listbox/ListboxGroup.js';
 import { c as createContext } from '../shared/createContext.js';
+import { _ as _sfc_main$1 } from '../Listbox/ListboxGroup.js';
 import { i as injectComboboxRootContext } from './ComboboxRoot.js';
 
 const [injectComboboxGroupContext, provideComboboxGroupContext] = createContext("ComboboxGroup");
@@ -13,7 +13,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const id = useId(undefined, "reka-combobox-group");
+    const id = useId(void 0, "reka-combobox-group");
     const rootContext = injectComboboxRootContext();
     const isRender = computed(() => rootContext.ignoreFilter.value ? true : !rootContext.filterState.search ? true : rootContext.filterState.filtered.groups.has(id));
     const context = provideComboboxGroupContext({
@@ -32,7 +32,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         id: unref(id),
         "aria-labelledby": unref(context).labelId
       }, props, {
-        hidden: isRender.value ? undefined : true
+        hidden: isRender.value ? void 0 : true
       }), {
         default: withCtx(() => [
           renderSlot(_ctx.$slots, "default")

package/dist/Combobox/ComboboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxGroup.js","sources":["../../src/Combobox/ComboboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxGroupProps } from '@/Listbox'\nimport { createContext, useId } from '@/shared'\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nexport interface ComboboxGroupProps extends ListboxGroupProps {}\n\ntype ComboboxGroupContext = {\n  id: string\n  labelId: string\n}\n\nexport const [injectComboboxGroupContext, provideComboboxGroupContext]\n  = createContext<ComboboxGroupContext>('ComboboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { ListboxGroup } from '@/Listbox'\n\nconst props = defineProps<ComboboxGroupProps>()\nconst id = useId(undefined, 'reka-combobox-group')\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value ? true : !rootContext.filterState.search ? true : rootContext.filterState.filtered.groups.has(id))\n\nconst context = provideComboboxGroupContext({\n  id,\n  labelId: '',\n})\n\nonMounted(() => {\n  if (!rootContext.allGroups.value.has(id))\n    rootContext.allGroups.value.set(id, new Set())\n})\nonUnmounted(() => {\n  rootContext.allGroups.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxGroup\n    :id=\"id\"\n    :aria-labelledby=\"context.labelId\"\n    v-bind=\"props\"\n    :hidden=\"isRender ? undefined : true\"\n  >\n    <slot />\n  </ListboxGroup>\n</template>\n"],"names":[],"mappings":";;;;;;AAaO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe;;;;;;;;AAMvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,SAAA,EAAW,qBAAqB,CAAA;AACjD,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAE9C,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,YAAa,CAAA,KAAA,GAAQ,OAAO,CAAC,WAAA,CAAY,WAAY,CAAA,MAAA,GAAS,OAAO,WAAY,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,GAAA,CAAI,EAAE,CAAC,CAAA;AAEhK,IAAA,MAAM,UAAU,2BAA4B,CAAA;AAAA,MAC1C,EAAA;AAAA,MACA,OAAS,EAAA;AAAA,KACV,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,WAAA,CAAY,SAAU,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AACrC,QAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,EAAI,kBAAA,IAAI,KAAK,CAAA;AAAA,KAChD,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,SAAA,CAAU,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACtC,CAAA;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxGroup.js","sources":["../../src/Combobox/ComboboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxGroupProps } from '@/Listbox'\nimport { createContext, useId } from '@/shared'\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nexport interface ComboboxGroupProps extends ListboxGroupProps {}\n\ntype ComboboxGroupContext = {\n  id: string\n  labelId: string\n}\n\nexport const [injectComboboxGroupContext, provideComboboxGroupContext]\n  = createContext<ComboboxGroupContext>('ComboboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { ListboxGroup } from '@/Listbox'\n\nconst props = defineProps<ComboboxGroupProps>()\nconst id = useId(undefined, 'reka-combobox-group')\nconst rootContext = injectComboboxRootContext()\n\nconst isRender = computed(() => rootContext.ignoreFilter.value ? true : !rootContext.filterState.search ? true : rootContext.filterState.filtered.groups.has(id))\n\nconst context = provideComboboxGroupContext({\n  id,\n  labelId: '',\n})\n\nonMounted(() => {\n  if (!rootContext.allGroups.value.has(id))\n    rootContext.allGroups.value.set(id, new Set())\n})\nonUnmounted(() => {\n  rootContext.allGroups.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxGroup\n    :id=\"id\"\n    :aria-labelledby=\"context.labelId\"\n    v-bind=\"props\"\n    :hidden=\"isRender ? undefined : true\"\n  >\n    <slot />\n  </ListboxGroup>\n</template>\n"],"names":[],"mappings":";;;;;;AAaO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe;;;;;;;;AAMvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,MAAA,EAAW,qBAAqB,CAAA;AACjD,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAE9C,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,YAAa,CAAA,KAAA,GAAQ,OAAO,CAAC,WAAA,CAAY,WAAY,CAAA,MAAA,GAAS,OAAO,WAAY,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,GAAA,CAAI,EAAE,CAAC,CAAA;AAEhK,IAAA,MAAM,UAAU,2BAA4B,CAAA;AAAA,MAC1C,EAAA;AAAA,MACA,OAAS,EAAA;AAAA,KACV,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,WAAA,CAAY,SAAU,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AACrC,QAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,EAAI,kBAAA,IAAI,KAAK,CAAA;AAAA,KAChD,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,SAAA,CAAU,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACtC,CAAA;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxInput.cjs

@@ -2,9 +2,9 @@
 
 const vue = require('vue');
 const core = require('@vueuse/core');
-const Combobox_ComboboxRoot = require('./ComboboxRoot.cjs');
 const Primitive_usePrimitiveElement = require('../Primitive/usePrimitiveElement.cjs');
 const Listbox_ListboxFilter = require('../Listbox/ListboxFilter.cjs');
+const Combobox_ComboboxRoot = require('./ComboboxRoot.cjs');
 const Listbox_ListboxRoot = require('../Listbox/ListboxRoot.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
@@ -25,7 +25,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const listboxContext = Listbox_ListboxRoot.injectListboxRootContext();
     const { primitiveElement, currentElement } = Primitive_usePrimitiveElement.usePrimitiveElement();
     const modelValue = core.useVModel(props, "modelValue", emits, {
-      passive: props.modelValue === undefined
+      passive: props.modelValue === void 0
     });
     vue.onMounted(() => {
       if (currentElement.value)
@@ -71,6 +71,14 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       if (!rootContext.isUserInputted.value && rootContext.resetSearchTermOnSelect.value)
         resetSearchTerm();
     }, { immediate: true, deep: true });
+    vue.watch(
+      () => props.modelValue,
+      () => {
+        if (props.modelValue !== void 0) {
+          rootContext.filterState.search = props.modelValue;
+        }
+      }
+    );
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(Listbox_ListboxFilter._sfc_main), {
         ref_key: "primitiveElement",

package/dist/Combobox/ComboboxInput.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxInput.cjs","sources":["../../src/Combobox/ComboboxInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxFilterEmits, ListboxFilterProps } from '@/Listbox'\nimport { useVModel } from '@vueuse/core'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { nextTick, onMounted, watch } from 'vue'\n\nexport type ComboboxInputEmits = ListboxFilterEmits\nexport interface ComboboxInputProps extends ListboxFilterProps {\n  /** The display value of input for selected item. Does not work with `multiple`. */\n  displayValue?: (val: any) => string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport { injectListboxRootContext } from '@/Listbox/ListboxRoot.vue'\nimport { ListboxFilter } from '@/Listbox'\n\nconst props = withDefaults(defineProps<ComboboxInputProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ComboboxInputEmits>()\n\nconst rootContext = injectComboboxRootContext()\nconst listboxContext = injectListboxRootContext()\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nonMounted(() => {\n  if (currentElement.value)\n    rootContext.onInputElementChange(currentElement.value as HTMLInputElement)\n})\n\nfunction handleKeyDown(ev: KeyboardEvent) {\n  if (!rootContext.open.value)\n    rootContext.onOpenChange(true)\n}\n\nfunction handleInput(event: InputEvent) {\n  const target = event.target as HTMLInputElement\n  if (!rootContext.open.value) {\n    rootContext.onOpenChange(true)\n    nextTick(() => {\n      if (target.value) {\n        rootContext.filterState.search = target.value\n        listboxContext.highlightFirstItem(event)\n      }\n    })\n  }\n  else {\n    rootContext.filterState.search = target.value\n  }\n}\n\nfunction resetSearchTerm() {\n  const rootModelValue = rootContext.modelValue.value\n\n  if (props.displayValue) {\n    modelValue.value = props.displayValue(rootModelValue)\n  }\n  else if (!rootContext.multiple.value && rootModelValue && !Array.isArray(rootModelValue)) {\n    if (typeof rootModelValue !== 'object')\n      modelValue.value = rootModelValue.toString()\n    else modelValue.value = ''\n  }\n  else {\n    modelValue.value = ''\n  }\n\n  nextTick(() => {\n    // Temporary force reassign\n    // eslint-disable-next-line no-self-assign\n    modelValue.value = modelValue.value\n  })\n}\n\nrootContext.onResetSearchTerm(() => {\n  resetSearchTerm()\n})\n\nwatch(rootContext.modelValue, async () => {\n  if (!rootContext.isUserInputted.value && rootContext.resetSearchTermOnSelect.value)\n    resetSearchTerm()\n}, { immediate: true, deep: true })\n</script>\n\n<template>\n  <ListboxFilter\n    ref=\"primitiveElement\"\n    v-model=\"modelValue\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :auto-focus=\"autoFocus\"\n    :aria-expanded=\"rootContext.open.value\"\n    :aria-controls=\"rootContext.contentId\"\n    aria-autocomplete=\"list\"\n    role=\"combobox\"\n    autocomplete=\"false\"\n    @input=\"handleInput\"\n    @keydown.down.up.prevent=\"handleKeyDown\"\n  >\n    <slot />\n  </ListboxFilter>\n</template>\n"],"names":["injectComboboxRootContext","injectListboxRootContext","usePrimitiveElement","useVModel","onMounted","nextTick","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,cAAcA,+CAA0B,EAAA;AAC9C,IAAA,MAAM,iBAAiBC,4CAAyB,EAAA;AAChD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AAEjE,IAAA,MAAM,UAAa,GAAAC,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAY,WAAA,CAAA,oBAAA,CAAqB,eAAe,KAAyB,CAAA;AAAA,KAC5E,CAAA;AAED,IAAA,SAAS,cAAc,EAAmB,EAAA;AACxC,MAAI,IAAA,CAAC,YAAY,IAAK,CAAA,KAAA;AACpB,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAAA;AAGjC,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAI,IAAA,CAAC,WAAY,CAAA,IAAA,CAAK,KAAO,EAAA;AAC3B,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAC7B,QAAAC,YAAA,CAAS,MAAM;AACb,UAAA,IAAI,OAAO,KAAO,EAAA;AAChB,YAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AACxC,YAAA,cAAA,CAAe,mBAAmB,KAAK,CAAA;AAAA;AACzC,SACD,CAAA;AAAA,OAEE,MAAA;AACH,QAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AAAA;AAC1C;AAGF,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAM,MAAA,cAAA,GAAiB,YAAY,UAAW,CAAA,KAAA;AAE9C,MAAA,IAAI,MAAM,YAAc,EAAA;AACtB,QAAW,UAAA,CAAA,KAAA,GAAQ,KAAM,CAAA,YAAA,CAAa,cAAc,CAAA;AAAA,OACtD,MAAA,IACS,CAAC,WAAA,CAAY,QAAS,CAAA,KAAA,IAAS,kBAAkB,CAAC,KAAA,CAAM,OAAQ,CAAA,cAAc,CAAG,EAAA;AACxF,QAAA,IAAI,OAAO,cAAmB,KAAA,QAAA;AAC5B,UAAW,UAAA,CAAA,KAAA,GAAQ,eAAe,QAAS,EAAA;AAAA,wBAC7B,KAAQ,GAAA,EAAA;AAAA,OAErB,MAAA;AACH,QAAA,UAAA,CAAW,KAAQ,GAAA,EAAA;AAAA;AAGrB,MAAAA,YAAA,CAAS,MAAM;AAGb,QAAA,UAAA,CAAW,QAAQ,UAAW,CAAA,KAAA;AAAA,OAC/B,CAAA;AAAA;AAGH,IAAA,WAAA,CAAY,kBAAkB,MAAM;AAClC,MAAgB,eAAA,EAAA;AAAA,KACjB,CAAA;AAED,IAAMC,SAAA,CAAA,WAAA,CAAY,YAAY,YAAY;AACxC,MAAA,IAAI,CAAC,WAAA,CAAY,cAAe,CAAA,KAAA,IAAS,YAAY,uBAAwB,CAAA,KAAA;AAC3E,QAAgB,eAAA,EAAA;AAAA,OACjB,EAAE,SAAA,EAAW,IAAM,EAAA,IAAA,EAAM,MAAM,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxInput.cjs","sources":["../../src/Combobox/ComboboxInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxFilterEmits, ListboxFilterProps } from '@/Listbox'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\nimport { nextTick, onMounted, watch } from 'vue'\n\nexport type ComboboxInputEmits = ListboxFilterEmits\nexport interface ComboboxInputProps extends ListboxFilterProps {\n  /** The display value of input for selected item. Does not work with `multiple`. */\n  displayValue?: (val: any) => string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ListboxFilter } from '@/Listbox'\nimport { injectListboxRootContext } from '@/Listbox/ListboxRoot.vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nconst props = withDefaults(defineProps<ComboboxInputProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ComboboxInputEmits>()\n\nconst rootContext = injectComboboxRootContext()\nconst listboxContext = injectListboxRootContext()\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nonMounted(() => {\n  if (currentElement.value)\n    rootContext.onInputElementChange(currentElement.value as HTMLInputElement)\n})\n\nfunction handleKeyDown(ev: KeyboardEvent) {\n  if (!rootContext.open.value)\n    rootContext.onOpenChange(true)\n}\n\nfunction handleInput(event: InputEvent) {\n  const target = event.target as HTMLInputElement\n  if (!rootContext.open.value) {\n    rootContext.onOpenChange(true)\n    nextTick(() => {\n      if (target.value) {\n        rootContext.filterState.search = target.value\n        listboxContext.highlightFirstItem(event)\n      }\n    })\n  }\n  else {\n    rootContext.filterState.search = target.value\n  }\n}\n\nfunction resetSearchTerm() {\n  const rootModelValue = rootContext.modelValue.value\n\n  if (props.displayValue) {\n    modelValue.value = props.displayValue(rootModelValue)\n  }\n  else if (!rootContext.multiple.value && rootModelValue && !Array.isArray(rootModelValue)) {\n    if (typeof rootModelValue !== 'object')\n      modelValue.value = rootModelValue.toString()\n    else modelValue.value = ''\n  }\n  else {\n    modelValue.value = ''\n  }\n\n  nextTick(() => {\n    // Temporary force reassign\n    // eslint-disable-next-line no-self-assign\n    modelValue.value = modelValue.value\n  })\n}\n\nrootContext.onResetSearchTerm(() => {\n  resetSearchTerm()\n})\n\nwatch(rootContext.modelValue, async () => {\n  if (!rootContext.isUserInputted.value && rootContext.resetSearchTermOnSelect.value)\n    resetSearchTerm()\n}, { immediate: true, deep: true })\n\nwatch(\n  () => props.modelValue,\n  () => {\n    if (props.modelValue !== undefined) {\n      rootContext.filterState.search = props.modelValue\n    }\n  },\n)\n</script>\n\n<template>\n  <ListboxFilter\n    ref=\"primitiveElement\"\n    v-model=\"modelValue\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :auto-focus=\"autoFocus\"\n    :aria-expanded=\"rootContext.open.value\"\n    :aria-controls=\"rootContext.contentId\"\n    aria-autocomplete=\"list\"\n    role=\"combobox\"\n    autocomplete=\"false\"\n    @input=\"handleInput\"\n    @keydown.down.up.prevent=\"handleKeyDown\"\n  >\n    <slot />\n  </ListboxFilter>\n</template>\n"],"names":["injectComboboxRootContext","injectListboxRootContext","usePrimitiveElement","useVModel","onMounted","nextTick","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,cAAcA,+CAA0B,EAAA;AAC9C,IAAA,MAAM,iBAAiBC,4CAAyB,EAAA;AAChD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AAEjE,IAAA,MAAM,UAAa,GAAAC,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAY,WAAA,CAAA,oBAAA,CAAqB,eAAe,KAAyB,CAAA;AAAA,KAC5E,CAAA;AAED,IAAA,SAAS,cAAc,EAAmB,EAAA;AACxC,MAAI,IAAA,CAAC,YAAY,IAAK,CAAA,KAAA;AACpB,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAAA;AAGjC,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAI,IAAA,CAAC,WAAY,CAAA,IAAA,CAAK,KAAO,EAAA;AAC3B,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAC7B,QAAAC,YAAA,CAAS,MAAM;AACb,UAAA,IAAI,OAAO,KAAO,EAAA;AAChB,YAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AACxC,YAAA,cAAA,CAAe,mBAAmB,KAAK,CAAA;AAAA;AACzC,SACD,CAAA;AAAA,OAEE,MAAA;AACH,QAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AAAA;AAC1C;AAGF,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAM,MAAA,cAAA,GAAiB,YAAY,UAAW,CAAA,KAAA;AAE9C,MAAA,IAAI,MAAM,YAAc,EAAA;AACtB,QAAW,UAAA,CAAA,KAAA,GAAQ,KAAM,CAAA,YAAA,CAAa,cAAc,CAAA;AAAA,OACtD,MAAA,IACS,CAAC,WAAA,CAAY,QAAS,CAAA,KAAA,IAAS,kBAAkB,CAAC,KAAA,CAAM,OAAQ,CAAA,cAAc,CAAG,EAAA;AACxF,QAAA,IAAI,OAAO,cAAmB,KAAA,QAAA;AAC5B,UAAW,UAAA,CAAA,KAAA,GAAQ,eAAe,QAAS,EAAA;AAAA,wBAC7B,KAAQ,GAAA,EAAA;AAAA,OAErB,MAAA;AACH,QAAA,UAAA,CAAW,KAAQ,GAAA,EAAA;AAAA;AAGrB,MAAAA,YAAA,CAAS,MAAM;AAGb,QAAA,UAAA,CAAW,QAAQ,UAAW,CAAA,KAAA;AAAA,OAC/B,CAAA;AAAA;AAGH,IAAA,WAAA,CAAY,kBAAkB,MAAM;AAClC,MAAgB,eAAA,EAAA;AAAA,KACjB,CAAA;AAED,IAAMC,SAAA,CAAA,WAAA,CAAY,YAAY,YAAY;AACxC,MAAA,IAAI,CAAC,WAAA,CAAY,cAAe,CAAA,KAAA,IAAS,YAAY,uBAAwB,CAAA,KAAA;AAC3E,QAAgB,eAAA,EAAA;AAAA,OACjB,EAAE,SAAA,EAAW,IAAM,EAAA,IAAA,EAAM,MAAM,CAAA;AAElC,IAAAA,SAAA;AAAA,MACE,MAAM,KAAM,CAAA,UAAA;AAAA,MACZ,MAAM;AACJ,QAAI,IAAA,KAAA,CAAM,eAAe,MAAW,EAAA;AAClC,UAAY,WAAA,CAAA,WAAA,CAAY,SAAS,KAAM,CAAA,UAAA;AAAA;AACzC;AACF,KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxInput.js

@@ -1,8 +1,8 @@
-import { defineComponent, onMounted, watch, openBlock, createBlock, unref, isRef, withKeys, withModifiers, withCtx, renderSlot, nextTick } from 'vue';
+import { defineComponent, onMounted, watch, createBlock, openBlock, unref, withKeys, withModifiers, isRef, withCtx, renderSlot, nextTick } from 'vue';
 import { useVModel } from '@vueuse/core';
-import { i as injectComboboxRootContext } from './ComboboxRoot.js';
 import { u as usePrimitiveElement } from '../Primitive/usePrimitiveElement.js';
 import { _ as _sfc_main$1 } from '../Listbox/ListboxFilter.js';
+import { i as injectComboboxRootContext } from './ComboboxRoot.js';
 import { i as injectListboxRootContext } from '../Listbox/ListboxRoot.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -23,7 +23,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const listboxContext = injectListboxRootContext();
     const { primitiveElement, currentElement } = usePrimitiveElement();
     const modelValue = useVModel(props, "modelValue", emits, {
-      passive: props.modelValue === undefined
+      passive: props.modelValue === void 0
     });
     onMounted(() => {
       if (currentElement.value)
@@ -69,6 +69,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (!rootContext.isUserInputted.value && rootContext.resetSearchTermOnSelect.value)
         resetSearchTerm();
     }, { immediate: true, deep: true });
+    watch(
+      () => props.modelValue,
+      () => {
+        if (props.modelValue !== void 0) {
+          rootContext.filterState.search = props.modelValue;
+        }
+      }
+    );
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(_sfc_main$1), {
         ref_key: "primitiveElement",

package/dist/Combobox/ComboboxInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxInput.js","sources":["../../src/Combobox/ComboboxInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxFilterEmits, ListboxFilterProps } from '@/Listbox'\nimport { useVModel } from '@vueuse/core'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { nextTick, onMounted, watch } from 'vue'\n\nexport type ComboboxInputEmits = ListboxFilterEmits\nexport interface ComboboxInputProps extends ListboxFilterProps {\n  /** The display value of input for selected item. Does not work with `multiple`. */\n  displayValue?: (val: any) => string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport { injectListboxRootContext } from '@/Listbox/ListboxRoot.vue'\nimport { ListboxFilter } from '@/Listbox'\n\nconst props = withDefaults(defineProps<ComboboxInputProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ComboboxInputEmits>()\n\nconst rootContext = injectComboboxRootContext()\nconst listboxContext = injectListboxRootContext()\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nonMounted(() => {\n  if (currentElement.value)\n    rootContext.onInputElementChange(currentElement.value as HTMLInputElement)\n})\n\nfunction handleKeyDown(ev: KeyboardEvent) {\n  if (!rootContext.open.value)\n    rootContext.onOpenChange(true)\n}\n\nfunction handleInput(event: InputEvent) {\n  const target = event.target as HTMLInputElement\n  if (!rootContext.open.value) {\n    rootContext.onOpenChange(true)\n    nextTick(() => {\n      if (target.value) {\n        rootContext.filterState.search = target.value\n        listboxContext.highlightFirstItem(event)\n      }\n    })\n  }\n  else {\n    rootContext.filterState.search = target.value\n  }\n}\n\nfunction resetSearchTerm() {\n  const rootModelValue = rootContext.modelValue.value\n\n  if (props.displayValue) {\n    modelValue.value = props.displayValue(rootModelValue)\n  }\n  else if (!rootContext.multiple.value && rootModelValue && !Array.isArray(rootModelValue)) {\n    if (typeof rootModelValue !== 'object')\n      modelValue.value = rootModelValue.toString()\n    else modelValue.value = ''\n  }\n  else {\n    modelValue.value = ''\n  }\n\n  nextTick(() => {\n    // Temporary force reassign\n    // eslint-disable-next-line no-self-assign\n    modelValue.value = modelValue.value\n  })\n}\n\nrootContext.onResetSearchTerm(() => {\n  resetSearchTerm()\n})\n\nwatch(rootContext.modelValue, async () => {\n  if (!rootContext.isUserInputted.value && rootContext.resetSearchTermOnSelect.value)\n    resetSearchTerm()\n}, { immediate: true, deep: true })\n</script>\n\n<template>\n  <ListboxFilter\n    ref=\"primitiveElement\"\n    v-model=\"modelValue\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :auto-focus=\"autoFocus\"\n    :aria-expanded=\"rootContext.open.value\"\n    :aria-controls=\"rootContext.contentId\"\n    aria-autocomplete=\"list\"\n    role=\"combobox\"\n    autocomplete=\"false\"\n    @input=\"handleInput\"\n    @keydown.down.up.prevent=\"handleKeyDown\"\n  >\n    <slot />\n  </ListboxFilter>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAC9C,IAAA,MAAM,iBAAiB,wBAAyB,EAAA;AAChD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAI,mBAAoB,EAAA;AAEjE,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAY,WAAA,CAAA,oBAAA,CAAqB,eAAe,KAAyB,CAAA;AAAA,KAC5E,CAAA;AAED,IAAA,SAAS,cAAc,EAAmB,EAAA;AACxC,MAAI,IAAA,CAAC,YAAY,IAAK,CAAA,KAAA;AACpB,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAAA;AAGjC,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAI,IAAA,CAAC,WAAY,CAAA,IAAA,CAAK,KAAO,EAAA;AAC3B,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAC7B,QAAA,QAAA,CAAS,MAAM;AACb,UAAA,IAAI,OAAO,KAAO,EAAA;AAChB,YAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AACxC,YAAA,cAAA,CAAe,mBAAmB,KAAK,CAAA;AAAA;AACzC,SACD,CAAA;AAAA,OAEE,MAAA;AACH,QAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AAAA;AAC1C;AAGF,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAM,MAAA,cAAA,GAAiB,YAAY,UAAW,CAAA,KAAA;AAE9C,MAAA,IAAI,MAAM,YAAc,EAAA;AACtB,QAAW,UAAA,CAAA,KAAA,GAAQ,KAAM,CAAA,YAAA,CAAa,cAAc,CAAA;AAAA,OACtD,MAAA,IACS,CAAC,WAAA,CAAY,QAAS,CAAA,KAAA,IAAS,kBAAkB,CAAC,KAAA,CAAM,OAAQ,CAAA,cAAc,CAAG,EAAA;AACxF,QAAA,IAAI,OAAO,cAAmB,KAAA,QAAA;AAC5B,UAAW,UAAA,CAAA,KAAA,GAAQ,eAAe,QAAS,EAAA;AAAA,wBAC7B,KAAQ,GAAA,EAAA;AAAA,OAErB,MAAA;AACH,QAAA,UAAA,CAAW,KAAQ,GAAA,EAAA;AAAA;AAGrB,MAAA,QAAA,CAAS,MAAM;AAGb,QAAA,UAAA,CAAW,QAAQ,UAAW,CAAA,KAAA;AAAA,OAC/B,CAAA;AAAA;AAGH,IAAA,WAAA,CAAY,kBAAkB,MAAM;AAClC,MAAgB,eAAA,EAAA;AAAA,KACjB,CAAA;AAED,IAAM,KAAA,CAAA,WAAA,CAAY,YAAY,YAAY;AACxC,MAAA,IAAI,CAAC,WAAA,CAAY,cAAe,CAAA,KAAA,IAAS,YAAY,uBAAwB,CAAA,KAAA;AAC3E,QAAgB,eAAA,EAAA;AAAA,OACjB,EAAE,SAAA,EAAW,IAAM,EAAA,IAAA,EAAM,MAAM,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxInput.js","sources":["../../src/Combobox/ComboboxInput.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxFilterEmits, ListboxFilterProps } from '@/Listbox'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { useVModel } from '@vueuse/core'\nimport { nextTick, onMounted, watch } from 'vue'\n\nexport type ComboboxInputEmits = ListboxFilterEmits\nexport interface ComboboxInputProps extends ListboxFilterProps {\n  /** The display value of input for selected item. Does not work with `multiple`. */\n  displayValue?: (val: any) => string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { ListboxFilter } from '@/Listbox'\nimport { injectListboxRootContext } from '@/Listbox/ListboxRoot.vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nconst props = withDefaults(defineProps<ComboboxInputProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ComboboxInputEmits>()\n\nconst rootContext = injectComboboxRootContext()\nconst listboxContext = injectListboxRootContext()\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  passive: (props.modelValue === undefined) as false,\n})\n\nonMounted(() => {\n  if (currentElement.value)\n    rootContext.onInputElementChange(currentElement.value as HTMLInputElement)\n})\n\nfunction handleKeyDown(ev: KeyboardEvent) {\n  if (!rootContext.open.value)\n    rootContext.onOpenChange(true)\n}\n\nfunction handleInput(event: InputEvent) {\n  const target = event.target as HTMLInputElement\n  if (!rootContext.open.value) {\n    rootContext.onOpenChange(true)\n    nextTick(() => {\n      if (target.value) {\n        rootContext.filterState.search = target.value\n        listboxContext.highlightFirstItem(event)\n      }\n    })\n  }\n  else {\n    rootContext.filterState.search = target.value\n  }\n}\n\nfunction resetSearchTerm() {\n  const rootModelValue = rootContext.modelValue.value\n\n  if (props.displayValue) {\n    modelValue.value = props.displayValue(rootModelValue)\n  }\n  else if (!rootContext.multiple.value && rootModelValue && !Array.isArray(rootModelValue)) {\n    if (typeof rootModelValue !== 'object')\n      modelValue.value = rootModelValue.toString()\n    else modelValue.value = ''\n  }\n  else {\n    modelValue.value = ''\n  }\n\n  nextTick(() => {\n    // Temporary force reassign\n    // eslint-disable-next-line no-self-assign\n    modelValue.value = modelValue.value\n  })\n}\n\nrootContext.onResetSearchTerm(() => {\n  resetSearchTerm()\n})\n\nwatch(rootContext.modelValue, async () => {\n  if (!rootContext.isUserInputted.value && rootContext.resetSearchTermOnSelect.value)\n    resetSearchTerm()\n}, { immediate: true, deep: true })\n\nwatch(\n  () => props.modelValue,\n  () => {\n    if (props.modelValue !== undefined) {\n      rootContext.filterState.search = props.modelValue\n    }\n  },\n)\n</script>\n\n<template>\n  <ListboxFilter\n    ref=\"primitiveElement\"\n    v-model=\"modelValue\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :auto-focus=\"autoFocus\"\n    :aria-expanded=\"rootContext.open.value\"\n    :aria-controls=\"rootContext.contentId\"\n    aria-autocomplete=\"list\"\n    role=\"combobox\"\n    autocomplete=\"false\"\n    @input=\"handleInput\"\n    @keydown.down.up.prevent=\"handleKeyDown\"\n  >\n    <slot />\n  </ListboxFilter>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAC9C,IAAA,MAAM,iBAAiB,wBAAyB,EAAA;AAChD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAI,mBAAoB,EAAA;AAEjE,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAY,WAAA,CAAA,oBAAA,CAAqB,eAAe,KAAyB,CAAA;AAAA,KAC5E,CAAA;AAED,IAAA,SAAS,cAAc,EAAmB,EAAA;AACxC,MAAI,IAAA,CAAC,YAAY,IAAK,CAAA,KAAA;AACpB,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAAA;AAGjC,IAAA,SAAS,YAAY,KAAmB,EAAA;AACtC,MAAA,MAAM,SAAS,KAAM,CAAA,MAAA;AACrB,MAAI,IAAA,CAAC,WAAY,CAAA,IAAA,CAAK,KAAO,EAAA;AAC3B,QAAA,WAAA,CAAY,aAAa,IAAI,CAAA;AAC7B,QAAA,QAAA,CAAS,MAAM;AACb,UAAA,IAAI,OAAO,KAAO,EAAA;AAChB,YAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AACxC,YAAA,cAAA,CAAe,mBAAmB,KAAK,CAAA;AAAA;AACzC,SACD,CAAA;AAAA,OAEE,MAAA;AACH,QAAY,WAAA,CAAA,WAAA,CAAY,SAAS,MAAO,CAAA,KAAA;AAAA;AAC1C;AAGF,IAAA,SAAS,eAAkB,GAAA;AACzB,MAAM,MAAA,cAAA,GAAiB,YAAY,UAAW,CAAA,KAAA;AAE9C,MAAA,IAAI,MAAM,YAAc,EAAA;AACtB,QAAW,UAAA,CAAA,KAAA,GAAQ,KAAM,CAAA,YAAA,CAAa,cAAc,CAAA;AAAA,OACtD,MAAA,IACS,CAAC,WAAA,CAAY,QAAS,CAAA,KAAA,IAAS,kBAAkB,CAAC,KAAA,CAAM,OAAQ,CAAA,cAAc,CAAG,EAAA;AACxF,QAAA,IAAI,OAAO,cAAmB,KAAA,QAAA;AAC5B,UAAW,UAAA,CAAA,KAAA,GAAQ,eAAe,QAAS,EAAA;AAAA,wBAC7B,KAAQ,GAAA,EAAA;AAAA,OAErB,MAAA;AACH,QAAA,UAAA,CAAW,KAAQ,GAAA,EAAA;AAAA;AAGrB,MAAA,QAAA,CAAS,MAAM;AAGb,QAAA,UAAA,CAAW,QAAQ,UAAW,CAAA,KAAA;AAAA,OAC/B,CAAA;AAAA;AAGH,IAAA,WAAA,CAAY,kBAAkB,MAAM;AAClC,MAAgB,eAAA,EAAA;AAAA,KACjB,CAAA;AAED,IAAM,KAAA,CAAA,WAAA,CAAY,YAAY,YAAY;AACxC,MAAA,IAAI,CAAC,WAAA,CAAY,cAAe,CAAA,KAAA,IAAS,YAAY,uBAAwB,CAAA,KAAA;AAC3E,QAAgB,eAAA,EAAA;AAAA,OACjB,EAAE,SAAA,EAAW,IAAM,EAAA,IAAA,EAAM,MAAM,CAAA;AAElC,IAAA,KAAA;AAAA,MACE,MAAM,KAAM,CAAA,UAAA;AAAA,MACZ,MAAM;AACJ,QAAI,IAAA,KAAA,CAAM,eAAe,MAAW,EAAA;AAClC,UAAY,WAAA,CAAA,WAAA,CAAY,SAAS,KAAM,CAAA,UAAA;AAAA;AACzC;AACF,KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxItem.cjs

@@ -2,10 +2,10 @@
 
 const vue = require('vue');
 const shared_useId = require('../shared/useId.cjs');
+const Combobox_ComboboxGroup = require('./ComboboxGroup.cjs');
 const Primitive_usePrimitiveElement = require('../Primitive/usePrimitiveElement.cjs');
 const Listbox_ListboxItem = require('../Listbox/ListboxItem.cjs');
 const Combobox_ComboboxRoot = require('./ComboboxRoot.cjs');
-const Combobox_ComboboxGroup = require('./ComboboxGroup.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "ComboboxItem",
@@ -20,7 +20,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const id = shared_useId.useId(undefined, "reka-combobox-item");
+    const id = shared_useId.useId(void 0, "reka-combobox-item");
     const rootContext = Combobox_ComboboxRoot.injectComboboxRootContext();
     const groupContext = Combobox_ComboboxGroup.injectComboboxGroupContext(null);
     const { primitiveElement, currentElement } = Primitive_usePrimitiveElement.usePrimitiveElement();
@@ -34,7 +34,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         return true;
       } else {
         const filteredCurrentItem = rootContext.filterState.filtered.items.get(id);
-        if (filteredCurrentItem === undefined) {
+        if (filteredCurrentItem === void 0) {
           return true;
         }
         return filteredCurrentItem > 0;
@@ -59,11 +59,12 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         id: vue.unref(id),
         ref_key: "primitiveElement",
         ref: primitiveElement,
+        disabled: vue.unref(rootContext).disabled.value || _ctx.disabled,
         onSelect: _cache[0] || (_cache[0] = (event) => {
           emits("select", event);
           if (event.defaultPrevented)
             return;
-          if (!vue.unref(rootContext).multiple.value) {
+          if (!vue.unref(rootContext).multiple.value && !_ctx.disabled && !vue.unref(rootContext).disabled.value) {
             event.preventDefault();
             vue.unref(rootContext).onOpenChange(false);
             vue.unref(rootContext).modelValue.value = props.value;
@@ -76,7 +77,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
           ])
         ]),
         _: 3
-      }, 16, ["id"])) : vue.createCommentVNode("", true);
+      }, 16, ["id", "disabled"])) : vue.createCommentVNode("", true);
     };
   }
 });

package/dist/Combobox/ComboboxItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxItem.cjs","sources":["../../src/Combobox/ComboboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport type { ListboxItemEmits, ListboxItemProps } from '@/Listbox'\nimport { useId } from '@/shared'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport type { AcceptableValue } from '@/shared/types'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\nimport { usePrimitiveElement } from '@/Primitive'\n\nexport { injectListboxItemContext as injectComboboxItemContext } from '@/Listbox'\n\nexport type ComboboxItemEmits<T = AcceptableValue> = ListboxItemEmits<T>\nexport interface ComboboxItemProps<T = AcceptableValue> extends ListboxItemProps<T> {\n  /**\n   * A string representation of the item contents.\n   *\n   * If the children are not plain text, then the `textValue` prop must also be set to a plain text representation, which will be used for autocomplete in the ComboBox.\n   */\n  textValue?: string\n}\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { ListboxItem } from '@/Listbox'\n\nconst props = defineProps<ComboboxItemProps<T>>()\nconst emits = defineEmits<ComboboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-combobox-item')\nconst rootContext = injectComboboxRootContext()\nconst groupContext = injectComboboxGroupContext(null)\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nif (props.value === '') {\n  throw new Error(\n    'A <ComboboxItem /> must have a value prop that is not an empty string. This is because the Combobox value can be set to an empty string to clear the selection and show the placeholder.',\n  )\n}\n\nconst isRender = computed(() => {\n  if (rootContext.isVirtual.value || rootContext.ignoreFilter.value || !rootContext.filterState.search) {\n    return true\n  }\n  else {\n    const filteredCurrentItem = rootContext.filterState.filtered.items.get(id)\n    // If the filtered items is undefined means not in the all times map yet\n    // Do the first render to add into the map\n    if (filteredCurrentItem === undefined) {\n      return true\n    }\n\n    // Check with filter\n    return filteredCurrentItem > 0\n  }\n})\n\nonMounted(() => {\n  // textValue to perform filter\n  rootContext.allItems.value.set(id, props.textValue || currentElement.value.textContent || currentElement.value.innerText)\n\n  const groupId = groupContext?.id\n  if (groupId) {\n    if (!rootContext.allGroups.value.has(groupId)) {\n      rootContext.allGroups.value.set(groupId, new Set([id]))\n    }\n    else {\n      rootContext.allGroups.value.get(groupId)?.add(id)\n    }\n  }\n})\nonUnmounted(() => {\n  rootContext.allItems.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxItem\n    v-if=\"isRender\"\n    v-bind=\"props\"\n    :id=\"id\"\n    ref=\"primitiveElement\"\n    @select=\"(event) => {\n      emits('select', event as any)\n      if (event.defaultPrevented)\n        return\n\n      if (!rootContext.multiple.value) {\n        event.preventDefault()\n        rootContext.onOpenChange(false)\n        rootContext.modelValue.value = props.value\n      }\n    }\"\n  >\n    <slot>{{ value }}</slot>\n  </ListboxItem>\n</template>\n"],"names":["useId","injectComboboxRootContext","injectComboboxGroupContext","usePrimitiveElement","computed","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAKA,kBAAM,CAAA,SAAA,EAAW,oBAAoB,CAAA;AAChD,IAAA,MAAM,cAAcC,+CAA0B,EAAA;AAC9C,IAAM,MAAA,YAAA,GAAeC,kDAA2B,IAAI,CAAA;AAEpD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AAEjE,IAAI,IAAA,KAAA,CAAM,UAAU,EAAI,EAAA;AACtB,MAAA,MAAM,IAAI,KAAA;AAAA,QACR;AAAA,OACF;AAAA;AAGF,IAAM,MAAA,QAAA,GAAWC,aAAS,MAAM;AAC9B,MAAI,IAAA,WAAA,CAAY,UAAU,KAAS,IAAA,WAAA,CAAY,aAAa,KAAS,IAAA,CAAC,WAAY,CAAA,WAAA,CAAY,MAAQ,EAAA;AACpG,QAAO,OAAA,IAAA;AAAA,OAEJ,MAAA;AACH,QAAA,MAAM,sBAAsB,WAAY,CAAA,WAAA,CAAY,QAAS,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AAGzE,QAAA,IAAI,wBAAwB,SAAW,EAAA;AACrC,UAAO,OAAA,IAAA;AAAA;AAIT,QAAA,OAAO,mBAAsB,GAAA,CAAA;AAAA;AAC/B,KACD,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AAEd,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,GAAA,CAAI,EAAI,EAAA,KAAA,CAAM,SAAa,IAAA,cAAA,CAAe,KAAM,CAAA,WAAA,IAAe,cAAe,CAAA,KAAA,CAAM,SAAS,CAAA;AAExH,MAAA,MAAM,UAAU,YAAc,EAAA,EAAA;AAC9B,MAAA,IAAI,OAAS,EAAA;AACX,QAAA,IAAI,CAAC,WAAY,CAAA,SAAA,CAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAG,EAAA;AAC7C,UAAY,WAAA,CAAA,SAAA,CAAU,MAAM,GAAI,CAAA,OAAA,sBAAa,GAAI,CAAA,CAAC,EAAE,CAAC,CAAC,CAAA;AAAA,SAEnD,MAAA;AACH,UAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAA,EAAG,IAAI,EAAE,CAAA;AAAA;AAClD;AACF,KACD,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACrC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxItem.cjs","sources":["../../src/Combobox/ComboboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxItemEmits, ListboxItemProps } from '@/Listbox'\nimport type { AcceptableValue } from '@/shared/types'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { useId } from '@/shared'\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nexport { injectListboxItemContext as injectComboboxItemContext } from '@/Listbox'\n\nexport type ComboboxItemEmits<T = AcceptableValue> = ListboxItemEmits<T>\nexport interface ComboboxItemProps<T = AcceptableValue> extends ListboxItemProps<T> {\n  /**\n   * A string representation of the item contents.\n   *\n   * If the children are not plain text, then the `textValue` prop must also be set to a plain text representation, which will be used for autocomplete in the ComboBox.\n   */\n  textValue?: string\n}\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { ListboxItem } from '@/Listbox'\n\nconst props = defineProps<ComboboxItemProps<T>>()\nconst emits = defineEmits<ComboboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-combobox-item')\nconst rootContext = injectComboboxRootContext()\nconst groupContext = injectComboboxGroupContext(null)\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nif (props.value === '') {\n  throw new Error(\n    'A <ComboboxItem /> must have a value prop that is not an empty string. This is because the Combobox value can be set to an empty string to clear the selection and show the placeholder.',\n  )\n}\n\nconst isRender = computed(() => {\n  if (rootContext.isVirtual.value || rootContext.ignoreFilter.value || !rootContext.filterState.search) {\n    return true\n  }\n  else {\n    const filteredCurrentItem = rootContext.filterState.filtered.items.get(id)\n    // If the filtered items is undefined means not in the all times map yet\n    // Do the first render to add into the map\n    if (filteredCurrentItem === undefined) {\n      return true\n    }\n\n    // Check with filter\n    return filteredCurrentItem > 0\n  }\n})\n\nonMounted(() => {\n  // textValue to perform filter\n  rootContext.allItems.value.set(id, props.textValue || currentElement.value.textContent || currentElement.value.innerText)\n\n  const groupId = groupContext?.id\n  if (groupId) {\n    if (!rootContext.allGroups.value.has(groupId)) {\n      rootContext.allGroups.value.set(groupId, new Set([id]))\n    }\n    else {\n      rootContext.allGroups.value.get(groupId)?.add(id)\n    }\n  }\n})\nonUnmounted(() => {\n  rootContext.allItems.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxItem\n    v-if=\"isRender\"\n    v-bind=\"props\"\n    :id=\"id\"\n    ref=\"primitiveElement\"\n    :disabled=\"rootContext.disabled.value || disabled\"\n    @select=\"(event) => {\n      emits('select', event as any)\n      if (event.defaultPrevented)\n        return\n\n      if (!rootContext.multiple.value && !disabled && !rootContext.disabled.value) {\n        event.preventDefault()\n        rootContext.onOpenChange(false)\n        rootContext.modelValue.value = props.value\n      }\n    }\"\n  >\n    <slot>{{ value }}</slot>\n  </ListboxItem>\n</template>\n"],"names":["useId","injectComboboxRootContext","injectComboboxGroupContext","usePrimitiveElement","computed","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAKA,kBAAM,CAAA,MAAA,EAAW,oBAAoB,CAAA;AAChD,IAAA,MAAM,cAAcC,+CAA0B,EAAA;AAC9C,IAAM,MAAA,YAAA,GAAeC,kDAA2B,IAAI,CAAA;AAEpD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AAEjE,IAAI,IAAA,KAAA,CAAM,UAAU,EAAI,EAAA;AACtB,MAAA,MAAM,IAAI,KAAA;AAAA,QACR;AAAA,OACF;AAAA;AAGF,IAAM,MAAA,QAAA,GAAWC,aAAS,MAAM;AAC9B,MAAI,IAAA,WAAA,CAAY,UAAU,KAAS,IAAA,WAAA,CAAY,aAAa,KAAS,IAAA,CAAC,WAAY,CAAA,WAAA,CAAY,MAAQ,EAAA;AACpG,QAAO,OAAA,IAAA;AAAA,OAEJ,MAAA;AACH,QAAA,MAAM,sBAAsB,WAAY,CAAA,WAAA,CAAY,QAAS,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AAGzE,QAAA,IAAI,wBAAwB,MAAW,EAAA;AACrC,UAAO,OAAA,IAAA;AAAA;AAIT,QAAA,OAAO,mBAAsB,GAAA,CAAA;AAAA;AAC/B,KACD,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AAEd,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,GAAA,CAAI,EAAI,EAAA,KAAA,CAAM,SAAa,IAAA,cAAA,CAAe,KAAM,CAAA,WAAA,IAAe,cAAe,CAAA,KAAA,CAAM,SAAS,CAAA;AAExH,MAAA,MAAM,UAAU,YAAc,EAAA,EAAA;AAC9B,MAAA,IAAI,OAAS,EAAA;AACX,QAAA,IAAI,CAAC,WAAY,CAAA,SAAA,CAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAG,EAAA;AAC7C,UAAY,WAAA,CAAA,SAAA,CAAU,MAAM,GAAI,CAAA,OAAA,sBAAa,GAAI,CAAA,CAAC,EAAE,CAAC,CAAC,CAAA;AAAA,SAEnD,MAAA;AACH,UAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAA,EAAG,IAAI,EAAE,CAAA;AAAA;AAClD;AACF,KACD,CAAA;AACD,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACrC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxItem.js

@@ -1,9 +1,9 @@
-import { defineComponent, computed, onMounted, onUnmounted, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, createCommentVNode } from 'vue';
+import { defineComponent, computed, onMounted, onUnmounted, createBlock, createCommentVNode, openBlock, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString } from 'vue';
 import { u as useId } from '../shared/useId.js';
+import { i as injectComboboxGroupContext } from './ComboboxGroup.js';
 import { u as usePrimitiveElement } from '../Primitive/usePrimitiveElement.js';
 import { _ as _sfc_main$1 } from '../Listbox/ListboxItem.js';
 import { i as injectComboboxRootContext } from './ComboboxRoot.js';
-import { i as injectComboboxGroupContext } from './ComboboxGroup.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ComboboxItem",
@@ -18,7 +18,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const id = useId(undefined, "reka-combobox-item");
+    const id = useId(void 0, "reka-combobox-item");
     const rootContext = injectComboboxRootContext();
     const groupContext = injectComboboxGroupContext(null);
     const { primitiveElement, currentElement } = usePrimitiveElement();
@@ -32,7 +32,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         return true;
       } else {
         const filteredCurrentItem = rootContext.filterState.filtered.items.get(id);
-        if (filteredCurrentItem === undefined) {
+        if (filteredCurrentItem === void 0) {
           return true;
         }
         return filteredCurrentItem > 0;
@@ -57,11 +57,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         id: unref(id),
         ref_key: "primitiveElement",
         ref: primitiveElement,
+        disabled: unref(rootContext).disabled.value || _ctx.disabled,
         onSelect: _cache[0] || (_cache[0] = (event) => {
           emits("select", event);
           if (event.defaultPrevented)
             return;
-          if (!unref(rootContext).multiple.value) {
+          if (!unref(rootContext).multiple.value && !_ctx.disabled && !unref(rootContext).disabled.value) {
             event.preventDefault();
             unref(rootContext).onOpenChange(false);
             unref(rootContext).modelValue.value = props.value;
@@ -74,7 +75,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ])
         ]),
         _: 3
-      }, 16, ["id"])) : createCommentVNode("", true);
+      }, 16, ["id", "disabled"])) : createCommentVNode("", true);
     };
   }
 });

package/dist/Combobox/ComboboxItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxItem.js","sources":["../../src/Combobox/ComboboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport type { ListboxItemEmits, ListboxItemProps } from '@/Listbox'\nimport { useId } from '@/shared'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\nimport type { AcceptableValue } from '@/shared/types'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\nimport { usePrimitiveElement } from '@/Primitive'\n\nexport { injectListboxItemContext as injectComboboxItemContext } from '@/Listbox'\n\nexport type ComboboxItemEmits<T = AcceptableValue> = ListboxItemEmits<T>\nexport interface ComboboxItemProps<T = AcceptableValue> extends ListboxItemProps<T> {\n  /**\n   * A string representation of the item contents.\n   *\n   * If the children are not plain text, then the `textValue` prop must also be set to a plain text representation, which will be used for autocomplete in the ComboBox.\n   */\n  textValue?: string\n}\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { ListboxItem } from '@/Listbox'\n\nconst props = defineProps<ComboboxItemProps<T>>()\nconst emits = defineEmits<ComboboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-combobox-item')\nconst rootContext = injectComboboxRootContext()\nconst groupContext = injectComboboxGroupContext(null)\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nif (props.value === '') {\n  throw new Error(\n    'A <ComboboxItem /> must have a value prop that is not an empty string. This is because the Combobox value can be set to an empty string to clear the selection and show the placeholder.',\n  )\n}\n\nconst isRender = computed(() => {\n  if (rootContext.isVirtual.value || rootContext.ignoreFilter.value || !rootContext.filterState.search) {\n    return true\n  }\n  else {\n    const filteredCurrentItem = rootContext.filterState.filtered.items.get(id)\n    // If the filtered items is undefined means not in the all times map yet\n    // Do the first render to add into the map\n    if (filteredCurrentItem === undefined) {\n      return true\n    }\n\n    // Check with filter\n    return filteredCurrentItem > 0\n  }\n})\n\nonMounted(() => {\n  // textValue to perform filter\n  rootContext.allItems.value.set(id, props.textValue || currentElement.value.textContent || currentElement.value.innerText)\n\n  const groupId = groupContext?.id\n  if (groupId) {\n    if (!rootContext.allGroups.value.has(groupId)) {\n      rootContext.allGroups.value.set(groupId, new Set([id]))\n    }\n    else {\n      rootContext.allGroups.value.get(groupId)?.add(id)\n    }\n  }\n})\nonUnmounted(() => {\n  rootContext.allItems.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxItem\n    v-if=\"isRender\"\n    v-bind=\"props\"\n    :id=\"id\"\n    ref=\"primitiveElement\"\n    @select=\"(event) => {\n      emits('select', event as any)\n      if (event.defaultPrevented)\n        return\n\n      if (!rootContext.multiple.value) {\n        event.preventDefault()\n        rootContext.onOpenChange(false)\n        rootContext.modelValue.value = props.value\n      }\n    }\"\n  >\n    <slot>{{ value }}</slot>\n  </ListboxItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,SAAA,EAAW,oBAAoB,CAAA;AAChD,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAC9C,IAAM,MAAA,YAAA,GAAe,2BAA2B,IAAI,CAAA;AAEpD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAI,mBAAoB,EAAA;AAEjE,IAAI,IAAA,KAAA,CAAM,UAAU,EAAI,EAAA;AACtB,MAAA,MAAM,IAAI,KAAA;AAAA,QACR;AAAA,OACF;AAAA;AAGF,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAC9B,MAAI,IAAA,WAAA,CAAY,UAAU,KAAS,IAAA,WAAA,CAAY,aAAa,KAAS,IAAA,CAAC,WAAY,CAAA,WAAA,CAAY,MAAQ,EAAA;AACpG,QAAO,OAAA,IAAA;AAAA,OAEJ,MAAA;AACH,QAAA,MAAM,sBAAsB,WAAY,CAAA,WAAA,CAAY,QAAS,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AAGzE,QAAA,IAAI,wBAAwB,SAAW,EAAA;AACrC,UAAO,OAAA,IAAA;AAAA;AAIT,QAAA,OAAO,mBAAsB,GAAA,CAAA;AAAA;AAC/B,KACD,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AAEd,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,GAAA,CAAI,EAAI,EAAA,KAAA,CAAM,SAAa,IAAA,cAAA,CAAe,KAAM,CAAA,WAAA,IAAe,cAAe,CAAA,KAAA,CAAM,SAAS,CAAA;AAExH,MAAA,MAAM,UAAU,YAAc,EAAA,EAAA;AAC9B,MAAA,IAAI,OAAS,EAAA;AACX,QAAA,IAAI,CAAC,WAAY,CAAA,SAAA,CAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAG,EAAA;AAC7C,UAAY,WAAA,CAAA,SAAA,CAAU,MAAM,GAAI,CAAA,OAAA,sBAAa,GAAI,CAAA,CAAC,EAAE,CAAC,CAAC,CAAA;AAAA,SAEnD,MAAA;AACH,UAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAA,EAAG,IAAI,EAAE,CAAA;AAAA;AAClD;AACF,KACD,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACrC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxItem.js","sources":["../../src/Combobox/ComboboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { ListboxItemEmits, ListboxItemProps } from '@/Listbox'\nimport type { AcceptableValue } from '@/shared/types'\nimport { usePrimitiveElement } from '@/Primitive'\nimport { useId } from '@/shared'\nimport { computed, onMounted, onUnmounted } from 'vue'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\nimport { injectComboboxRootContext } from './ComboboxRoot.vue'\n\nexport { injectListboxItemContext as injectComboboxItemContext } from '@/Listbox'\n\nexport type ComboboxItemEmits<T = AcceptableValue> = ListboxItemEmits<T>\nexport interface ComboboxItemProps<T = AcceptableValue> extends ListboxItemProps<T> {\n  /**\n   * A string representation of the item contents.\n   *\n   * If the children are not plain text, then the `textValue` prop must also be set to a plain text representation, which will be used for autocomplete in the ComboBox.\n   */\n  textValue?: string\n}\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { ListboxItem } from '@/Listbox'\n\nconst props = defineProps<ComboboxItemProps<T>>()\nconst emits = defineEmits<ComboboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-combobox-item')\nconst rootContext = injectComboboxRootContext()\nconst groupContext = injectComboboxGroupContext(null)\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\n\nif (props.value === '') {\n  throw new Error(\n    'A <ComboboxItem /> must have a value prop that is not an empty string. This is because the Combobox value can be set to an empty string to clear the selection and show the placeholder.',\n  )\n}\n\nconst isRender = computed(() => {\n  if (rootContext.isVirtual.value || rootContext.ignoreFilter.value || !rootContext.filterState.search) {\n    return true\n  }\n  else {\n    const filteredCurrentItem = rootContext.filterState.filtered.items.get(id)\n    // If the filtered items is undefined means not in the all times map yet\n    // Do the first render to add into the map\n    if (filteredCurrentItem === undefined) {\n      return true\n    }\n\n    // Check with filter\n    return filteredCurrentItem > 0\n  }\n})\n\nonMounted(() => {\n  // textValue to perform filter\n  rootContext.allItems.value.set(id, props.textValue || currentElement.value.textContent || currentElement.value.innerText)\n\n  const groupId = groupContext?.id\n  if (groupId) {\n    if (!rootContext.allGroups.value.has(groupId)) {\n      rootContext.allGroups.value.set(groupId, new Set([id]))\n    }\n    else {\n      rootContext.allGroups.value.get(groupId)?.add(id)\n    }\n  }\n})\nonUnmounted(() => {\n  rootContext.allItems.value.delete(id)\n})\n</script>\n\n<template>\n  <ListboxItem\n    v-if=\"isRender\"\n    v-bind=\"props\"\n    :id=\"id\"\n    ref=\"primitiveElement\"\n    :disabled=\"rootContext.disabled.value || disabled\"\n    @select=\"(event) => {\n      emits('select', event as any)\n      if (event.defaultPrevented)\n        return\n\n      if (!rootContext.multiple.value && !disabled && !rootContext.disabled.value) {\n        event.preventDefault()\n        rootContext.onOpenChange(false)\n        rootContext.modelValue.value = props.value\n      }\n    }\"\n  >\n    <slot>{{ value }}</slot>\n  </ListboxItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAyBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AACd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,MAAA,EAAW,oBAAoB,CAAA;AAChD,IAAA,MAAM,cAAc,yBAA0B,EAAA;AAC9C,IAAM,MAAA,YAAA,GAAe,2BAA2B,IAAI,CAAA;AAEpD,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAI,mBAAoB,EAAA;AAEjE,IAAI,IAAA,KAAA,CAAM,UAAU,EAAI,EAAA;AACtB,MAAA,MAAM,IAAI,KAAA;AAAA,QACR;AAAA,OACF;AAAA;AAGF,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAC9B,MAAI,IAAA,WAAA,CAAY,UAAU,KAAS,IAAA,WAAA,CAAY,aAAa,KAAS,IAAA,CAAC,WAAY,CAAA,WAAA,CAAY,MAAQ,EAAA;AACpG,QAAO,OAAA,IAAA;AAAA,OAEJ,MAAA;AACH,QAAA,MAAM,sBAAsB,WAAY,CAAA,WAAA,CAAY,QAAS,CAAA,KAAA,CAAM,IAAI,EAAE,CAAA;AAGzE,QAAA,IAAI,wBAAwB,MAAW,EAAA;AACrC,UAAO,OAAA,IAAA;AAAA;AAIT,QAAA,OAAO,mBAAsB,GAAA,CAAA;AAAA;AAC/B,KACD,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AAEd,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,GAAA,CAAI,EAAI,EAAA,KAAA,CAAM,SAAa,IAAA,cAAA,CAAe,KAAM,CAAA,WAAA,IAAe,cAAe,CAAA,KAAA,CAAM,SAAS,CAAA;AAExH,MAAA,MAAM,UAAU,YAAc,EAAA,EAAA;AAC9B,MAAA,IAAI,OAAS,EAAA;AACX,QAAA,IAAI,CAAC,WAAY,CAAA,SAAA,CAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAG,EAAA;AAC7C,UAAY,WAAA,CAAA,SAAA,CAAU,MAAM,GAAI,CAAA,OAAA,sBAAa,GAAI,CAAA,CAAC,EAAE,CAAC,CAAC,CAAA;AAAA,SAEnD,MAAA;AACH,UAAA,WAAA,CAAY,UAAU,KAAM,CAAA,GAAA,CAAI,OAAO,CAAA,EAAG,IAAI,EAAE,CAAA;AAAA;AAClD;AACF,KACD,CAAA;AACD,IAAA,WAAA,CAAY,MAAM;AAChB,MAAY,WAAA,CAAA,QAAA,CAAS,KAAM,CAAA,MAAA,CAAO,EAAE,CAAA;AAAA,KACrC,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxItemIndicator.js

@@ -1,4 +1,4 @@
-import { defineComponent, openBlock, createBlock, unref, normalizeProps, guardReactiveProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, normalizeProps, guardReactiveProps, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from '../Listbox/ListboxItemIndicator.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/Combobox/ComboboxLabel.cjs

@@ -2,9 +2,9 @@
 
 const vue = require('vue');
 const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
-const Combobox_ComboboxGroup = require('./ComboboxGroup.cjs');
 const shared_useId = require('../shared/useId.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
+const Combobox_ComboboxGroup = require('./ComboboxGroup.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "ComboboxLabel",
@@ -17,7 +17,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const props = __props;
     shared_useForwardExpose.useForwardExpose();
     const groupContext = Combobox_ComboboxGroup.injectComboboxGroupContext({ id: "", labelId: "" });
-    groupContext.labelId ||= shared_useId.useId(undefined, "reka-combobox-group-label");
+    groupContext.labelId ||= shared_useId.useId(void 0, "reka-combobox-group-label");
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(Primitive_Primitive.Primitive), vue.mergeProps(props, {
         id: vue.unref(groupContext).labelId

package/dist/Combobox/ComboboxLabel.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxLabel.cjs","sources":["../../src/Combobox/ComboboxLabel.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface ComboboxLabelProps extends PrimitiveProps {\n  for?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\n\nconst props = withDefaults(defineProps<ComboboxLabelProps>(), {\n  as: 'div',\n})\n\nuseForwardExpose()\nconst groupContext = injectComboboxGroupContext({ id: '', labelId: '' })\n\ngroupContext.labelId ||= useId(undefined, 'reka-combobox-group-label')\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"props\"\n    :id=\"groupContext.labelId\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["useForwardExpose","injectComboboxGroupContext","useId"],"mappings":";;;;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAiBA,wCAAA,EAAA;AACjB,IAAA,MAAM,eAAeC,iDAA2B,CAAA,EAAE,IAAI,EAAI,EAAA,OAAA,EAAS,IAAI,CAAA;AAEvE,IAAa,YAAA,CAAA,OAAA,KAAYC,kBAAM,CAAA,SAAA,EAAW,2BAA2B,CAAA;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxLabel.cjs","sources":["../../src/Combobox/ComboboxLabel.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface ComboboxLabelProps extends PrimitiveProps {\n  for?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\n\nconst props = withDefaults(defineProps<ComboboxLabelProps>(), {\n  as: 'div',\n})\n\nuseForwardExpose()\nconst groupContext = injectComboboxGroupContext({ id: '', labelId: '' })\n\ngroupContext.labelId ||= useId(undefined, 'reka-combobox-group-label')\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"props\"\n    :id=\"groupContext.labelId\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["useForwardExpose","injectComboboxGroupContext","useId"],"mappings":";;;;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAiBA,wCAAA,EAAA;AACjB,IAAA,MAAM,eAAeC,iDAA2B,CAAA,EAAE,IAAI,EAAI,EAAA,OAAA,EAAS,IAAI,CAAA;AAEvE,IAAa,YAAA,CAAA,OAAA,KAAYC,kBAAM,CAAA,MAAA,EAAW,2BAA2B,CAAA;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxLabel.js

@@ -1,8 +1,8 @@
-import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
-import { i as injectComboboxGroupContext } from './ComboboxGroup.js';
 import { u as useId } from '../shared/useId.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
+import { i as injectComboboxGroupContext } from './ComboboxGroup.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "ComboboxLabel",
@@ -15,7 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const props = __props;
     useForwardExpose();
     const groupContext = injectComboboxGroupContext({ id: "", labelId: "" });
-    groupContext.labelId ||= useId(undefined, "reka-combobox-group-label");
+    groupContext.labelId ||= useId(void 0, "reka-combobox-group-label");
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Primitive), mergeProps(props, {
         id: unref(groupContext).labelId

package/dist/Combobox/ComboboxLabel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboboxLabel.js","sources":["../../src/Combobox/ComboboxLabel.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface ComboboxLabelProps extends PrimitiveProps {\n  for?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\n\nconst props = withDefaults(defineProps<ComboboxLabelProps>(), {\n  as: 'div',\n})\n\nuseForwardExpose()\nconst groupContext = injectComboboxGroupContext({ id: '', labelId: '' })\n\ngroupContext.labelId ||= useId(undefined, 'reka-combobox-group-label')\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"props\"\n    :id=\"groupContext.labelId\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,eAAe,0BAA2B,CAAA,EAAE,IAAI,EAAI,EAAA,OAAA,EAAS,IAAI,CAAA;AAEvE,IAAa,YAAA,CAAA,OAAA,KAAY,KAAM,CAAA,SAAA,EAAW,2BAA2B,CAAA;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ComboboxLabel.js","sources":["../../src/Combobox/ComboboxLabel.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface ComboboxLabelProps extends PrimitiveProps {\n  for?: string\n}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { useForwardExpose, useId } from '@/shared'\nimport { injectComboboxGroupContext } from './ComboboxGroup.vue'\n\nconst props = withDefaults(defineProps<ComboboxLabelProps>(), {\n  as: 'div',\n})\n\nuseForwardExpose()\nconst groupContext = injectComboboxGroupContext({ id: '', labelId: '' })\n\ngroupContext.labelId ||= useId(undefined, 'reka-combobox-group-label')\n</script>\n\n<template>\n  <Primitive\n    v-bind=\"props\"\n    :id=\"groupContext.labelId\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAaA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,eAAe,0BAA2B,CAAA,EAAE,IAAI,EAAI,EAAA,OAAA,EAAS,IAAI,CAAA;AAEvE,IAAa,YAAA,CAAA,OAAA,KAAY,KAAM,CAAA,MAAA,EAAW,2BAA2B,CAAA;;;;;;;;;;;;;;;;"}

package/dist/Combobox/ComboboxPortal.js

@@ -1,4 +1,4 @@
-import { defineComponent, openBlock, createBlock, unref, normalizeProps, guardReactiveProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, normalizeProps, guardReactiveProps, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from '../Teleport/Teleport.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({