reka-ui 2.1.0 → 2.2.0

package/dist/HoverCard/HoverCardRoot.cjs

@@ -3,15 +3,15 @@
 const vue = require('vue');
 const core = require('@vueuse/core');
 const Popper_PopperRoot = require('../Popper/PopperRoot.cjs');
-const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
+const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 
 const [injectHoverCardRootContext, provideHoverCardRootContext] = shared_createContext.createContext("HoverCardRoot");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "HoverCardRoot",
   props: {
     defaultOpen: { type: Boolean, default: false },
-    open: { type: Boolean, default: undefined },
+    open: { type: Boolean, default: void 0 },
     openDelay: { default: 700 },
     closeDelay: { default: 300 }
   },
@@ -23,7 +23,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     shared_useForwardExpose.useForwardExpose();
     const open = core.useVModel(props, "open", emit, {
       defaultValue: props.defaultOpen,
-      passive: props.open === undefined
+      passive: props.open === void 0
     });
     const openTimerRef = vue.ref(0);
     const closeTimerRef = vue.ref(0);

package/dist/HoverCard/HoverCardRoot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"HoverCardRoot.cjs","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n  /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: false\n  /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n  open?: boolean\n  /** The duration from when the mouse enters the trigger until the hover card opens. */\n  openDelay?: number\n  /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n  closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n  /** Event handler called when the open state of the hover card changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n  open: Ref<boolean>\n  onOpenChange: (open: boolean) => void\n  onOpen: () => void\n  onClose: () => void\n  onDismiss: () => void\n  hasSelectionRef: Ref<boolean>\n  isPointerDownOnContentRef: Ref<boolean>\n  isPointerInTransitRef: Ref<boolean>\n  triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n  = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<HoverCardRootProps>(), {\n  defaultOpen: false,\n  open: undefined,\n  openDelay: 700,\n  closeDelay: 300,\n})\nconst emit = defineEmits<HoverCardRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { openDelay, closeDelay } = toRefs(props)\n\nuseForwardExpose()\nconst open = useVModel(props, 'open', emit, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst openTimerRef = ref(0)\nconst closeTimerRef = ref(0)\nconst hasSelectionRef = ref(false)\nconst isPointerDownOnContentRef = ref(false)\nconst isPointerInTransitRef = ref(false)\nconst triggerElement = ref<HTMLElement>()\n\nfunction handleOpen() {\n  clearTimeout(closeTimerRef.value)\n  openTimerRef.value = window.setTimeout(() => open.value = true, openDelay.value)\n}\n\nfunction handleClose() {\n  clearTimeout(openTimerRef.value)\n  if (!hasSelectionRef.value && !isPointerDownOnContentRef.value)\n    closeTimerRef.value = window.setTimeout(() => open.value = false, closeDelay.value)\n}\n\nfunction handleDismiss() {\n  open.value = false\n}\n\nprovideHoverCardRootContext({\n  open,\n  onOpenChange(value) {\n    open.value = value\n  },\n  onOpen: handleOpen,\n  onClose: handleClose,\n  onDismiss: handleDismiss,\n  hasSelectionRef,\n  isPointerDownOnContentRef,\n  isPointerInTransitRef,\n  triggerElement,\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot :open=\"open\" />\n  </PopperRoot>\n</template>\n"],"names":["createContext","toRefs","useForwardExpose","useVModel","ref"],"mappings":";;;;;;;;AA+BO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe;;;;;;;;;;;AAQvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,SAAA,EAAW,UAAW,EAAA,GAAIC,WAAO,KAAK,CAAA;AAE9C,IAAiBC,wCAAA,EAAA;AACjB,IAAA,MAAM,IAAO,GAAAC,cAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAM,MAAA,YAAA,GAAeC,QAAI,CAAC,CAAA;AAC1B,IAAM,MAAA,aAAA,GAAgBA,QAAI,CAAC,CAAA;AAC3B,IAAM,MAAA,eAAA,GAAkBA,QAAI,KAAK,CAAA;AACjC,IAAM,MAAA,yBAAA,GAA4BA,QAAI,KAAK,CAAA;AAC3C,IAAM,MAAA,qBAAA,GAAwBA,QAAI,KAAK,CAAA;AACvC,IAAA,MAAM,iBAAiBA,OAAiB,EAAA;AAExC,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,YAAA,CAAa,cAAc,KAAK,CAAA;AAChC,MAAa,YAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,IAAA,EAAM,UAAU,KAAK,CAAA;AAAA;AAGjF,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,YAAA,CAAa,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,CAAC,eAAA,CAAgB,KAAS,IAAA,CAAC,yBAA0B,CAAA,KAAA;AACvD,QAAc,aAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,KAAA,EAAO,WAAW,KAAK,CAAA;AAAA;AAGtF,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA;AAGf,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,aAAa,KAAO,EAAA;AAClB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,eAAA;AAAA,MACA,yBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;"}
+{"version":3,"file":"HoverCardRoot.cjs","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n  /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: boolean\n  /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n  open?: boolean\n  /** The duration from when the mouse enters the trigger until the hover card opens. */\n  openDelay?: number\n  /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n  closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n  /** Event handler called when the open state of the hover card changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n  open: Ref<boolean>\n  onOpenChange: (open: boolean) => void\n  onOpen: () => void\n  onClose: () => void\n  onDismiss: () => void\n  hasSelectionRef: Ref<boolean>\n  isPointerDownOnContentRef: Ref<boolean>\n  isPointerInTransitRef: Ref<boolean>\n  triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n  = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<HoverCardRootProps>(), {\n  defaultOpen: false,\n  open: undefined,\n  openDelay: 700,\n  closeDelay: 300,\n})\nconst emit = defineEmits<HoverCardRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { openDelay, closeDelay } = toRefs(props)\n\nuseForwardExpose()\nconst open = useVModel(props, 'open', emit, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst openTimerRef = ref(0)\nconst closeTimerRef = ref(0)\nconst hasSelectionRef = ref(false)\nconst isPointerDownOnContentRef = ref(false)\nconst isPointerInTransitRef = ref(false)\nconst triggerElement = ref<HTMLElement>()\n\nfunction handleOpen() {\n  clearTimeout(closeTimerRef.value)\n  openTimerRef.value = window.setTimeout(() => open.value = true, openDelay.value)\n}\n\nfunction handleClose() {\n  clearTimeout(openTimerRef.value)\n  if (!hasSelectionRef.value && !isPointerDownOnContentRef.value)\n    closeTimerRef.value = window.setTimeout(() => open.value = false, closeDelay.value)\n}\n\nfunction handleDismiss() {\n  open.value = false\n}\n\nprovideHoverCardRootContext({\n  open,\n  onOpenChange(value) {\n    open.value = value\n  },\n  onOpen: handleOpen,\n  onClose: handleClose,\n  onDismiss: handleDismiss,\n  hasSelectionRef,\n  isPointerDownOnContentRef,\n  isPointerInTransitRef,\n  triggerElement,\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot :open=\"open\" />\n  </PopperRoot>\n</template>\n"],"names":["createContext","toRefs","useForwardExpose","useVModel","ref"],"mappings":";;;;;;;;AA+BO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjEA,mCAAoC,eAAe;;;;;;;;;;;AAQvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,SAAA,EAAW,UAAW,EAAA,GAAIC,WAAO,KAAK,CAAA;AAE9C,IAAiBC,wCAAA,EAAA;AACjB,IAAA,MAAM,IAAO,GAAAC,cAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAM,MAAA,YAAA,GAAeC,QAAI,CAAC,CAAA;AAC1B,IAAM,MAAA,aAAA,GAAgBA,QAAI,CAAC,CAAA;AAC3B,IAAM,MAAA,eAAA,GAAkBA,QAAI,KAAK,CAAA;AACjC,IAAM,MAAA,yBAAA,GAA4BA,QAAI,KAAK,CAAA;AAC3C,IAAM,MAAA,qBAAA,GAAwBA,QAAI,KAAK,CAAA;AACvC,IAAA,MAAM,iBAAiBA,OAAiB,EAAA;AAExC,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,YAAA,CAAa,cAAc,KAAK,CAAA;AAChC,MAAa,YAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,IAAA,EAAM,UAAU,KAAK,CAAA;AAAA;AAGjF,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,YAAA,CAAa,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,CAAC,eAAA,CAAgB,KAAS,IAAA,CAAC,yBAA0B,CAAA,KAAA;AACvD,QAAc,aAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,KAAA,EAAO,WAAW,KAAK,CAAA;AAAA;AAGtF,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA;AAGf,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,aAAa,KAAO,EAAA;AAClB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,eAAA;AAAA,MACA,yBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;;"}

package/dist/HoverCard/HoverCardRoot.js

@@ -1,15 +1,15 @@
-import { defineComponent, toRefs, ref, openBlock, createBlock, unref, withCtx, renderSlot } from 'vue';
+import { defineComponent, toRefs, ref, createBlock, openBlock, unref, withCtx, renderSlot } from 'vue';
 import { useVModel } from '@vueuse/core';
 import { _ as _sfc_main$1 } from '../Popper/PopperRoot.js';
-import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { c as createContext } from '../shared/createContext.js';
+import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 
 const [injectHoverCardRootContext, provideHoverCardRootContext] = createContext("HoverCardRoot");
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "HoverCardRoot",
   props: {
     defaultOpen: { type: Boolean, default: false },
-    open: { type: Boolean, default: undefined },
+    open: { type: Boolean, default: void 0 },
     openDelay: { default: 700 },
     closeDelay: { default: 300 }
   },
@@ -21,7 +21,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     useForwardExpose();
     const open = useVModel(props, "open", emit, {
       defaultValue: props.defaultOpen,
-      passive: props.open === undefined
+      passive: props.open === void 0
     });
     const openTimerRef = ref(0);
     const closeTimerRef = ref(0);

package/dist/HoverCard/HoverCardRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"HoverCardRoot.js","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n  /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: false\n  /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n  open?: boolean\n  /** The duration from when the mouse enters the trigger until the hover card opens. */\n  openDelay?: number\n  /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n  closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n  /** Event handler called when the open state of the hover card changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n  open: Ref<boolean>\n  onOpenChange: (open: boolean) => void\n  onOpen: () => void\n  onClose: () => void\n  onDismiss: () => void\n  hasSelectionRef: Ref<boolean>\n  isPointerDownOnContentRef: Ref<boolean>\n  isPointerInTransitRef: Ref<boolean>\n  triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n  = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<HoverCardRootProps>(), {\n  defaultOpen: false,\n  open: undefined,\n  openDelay: 700,\n  closeDelay: 300,\n})\nconst emit = defineEmits<HoverCardRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { openDelay, closeDelay } = toRefs(props)\n\nuseForwardExpose()\nconst open = useVModel(props, 'open', emit, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst openTimerRef = ref(0)\nconst closeTimerRef = ref(0)\nconst hasSelectionRef = ref(false)\nconst isPointerDownOnContentRef = ref(false)\nconst isPointerInTransitRef = ref(false)\nconst triggerElement = ref<HTMLElement>()\n\nfunction handleOpen() {\n  clearTimeout(closeTimerRef.value)\n  openTimerRef.value = window.setTimeout(() => open.value = true, openDelay.value)\n}\n\nfunction handleClose() {\n  clearTimeout(openTimerRef.value)\n  if (!hasSelectionRef.value && !isPointerDownOnContentRef.value)\n    closeTimerRef.value = window.setTimeout(() => open.value = false, closeDelay.value)\n}\n\nfunction handleDismiss() {\n  open.value = false\n}\n\nprovideHoverCardRootContext({\n  open,\n  onOpenChange(value) {\n    open.value = value\n  },\n  onOpen: handleOpen,\n  onClose: handleClose,\n  onDismiss: handleDismiss,\n  hasSelectionRef,\n  isPointerDownOnContentRef,\n  isPointerInTransitRef,\n  triggerElement,\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot :open=\"open\" />\n  </PopperRoot>\n</template>\n"],"names":[],"mappings":";;;;;;AA+BO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe;;;;;;;;;;;AAQvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,SAAA,EAAW,UAAW,EAAA,GAAI,OAAO,KAAK,CAAA;AAE9C,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,IAAO,GAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,IAAI,CAAC,CAAA;AAC1B,IAAM,MAAA,aAAA,GAAgB,IAAI,CAAC,CAAA;AAC3B,IAAM,MAAA,eAAA,GAAkB,IAAI,KAAK,CAAA;AACjC,IAAM,MAAA,yBAAA,GAA4B,IAAI,KAAK,CAAA;AAC3C,IAAM,MAAA,qBAAA,GAAwB,IAAI,KAAK,CAAA;AACvC,IAAA,MAAM,iBAAiB,GAAiB,EAAA;AAExC,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,YAAA,CAAa,cAAc,KAAK,CAAA;AAChC,MAAa,YAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,IAAA,EAAM,UAAU,KAAK,CAAA;AAAA;AAGjF,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,YAAA,CAAa,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,CAAC,eAAA,CAAgB,KAAS,IAAA,CAAC,yBAA0B,CAAA,KAAA;AACvD,QAAc,aAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,KAAA,EAAO,WAAW,KAAK,CAAA;AAAA;AAGtF,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA;AAGf,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,aAAa,KAAO,EAAA;AAClB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,eAAA;AAAA,MACA,yBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;"}
+{"version":3,"file":"HoverCardRoot.js","sources":["../../src/HoverCard/HoverCardRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport { createContext, useForwardExpose } from '@/shared'\n\nexport interface HoverCardRootProps {\n  /** The open state of the hover card when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: boolean\n  /** The controlled open state of the hover card. Can be binded as `v-model:open`. */\n  open?: boolean\n  /** The duration from when the mouse enters the trigger until the hover card opens. */\n  openDelay?: number\n  /** The duration from when the mouse leaves the trigger or content until the hover card closes. */\n  closeDelay?: number\n}\nexport type HoverCardRootEmits = {\n  /** Event handler called when the open state of the hover card changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface HoverCardRootContext {\n  open: Ref<boolean>\n  onOpenChange: (open: boolean) => void\n  onOpen: () => void\n  onClose: () => void\n  onDismiss: () => void\n  hasSelectionRef: Ref<boolean>\n  isPointerDownOnContentRef: Ref<boolean>\n  isPointerInTransitRef: Ref<boolean>\n  triggerElement: Ref<HTMLElement | undefined>\n}\n\nexport const [injectHoverCardRootContext, provideHoverCardRootContext]\n  = createContext<HoverCardRootContext>('HoverCardRoot')\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, toRefs } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { PopperRoot } from '@/Popper'\n\nconst props = withDefaults(defineProps<HoverCardRootProps>(), {\n  defaultOpen: false,\n  open: undefined,\n  openDelay: 700,\n  closeDelay: 300,\n})\nconst emit = defineEmits<HoverCardRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { openDelay, closeDelay } = toRefs(props)\n\nuseForwardExpose()\nconst open = useVModel(props, 'open', emit, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst openTimerRef = ref(0)\nconst closeTimerRef = ref(0)\nconst hasSelectionRef = ref(false)\nconst isPointerDownOnContentRef = ref(false)\nconst isPointerInTransitRef = ref(false)\nconst triggerElement = ref<HTMLElement>()\n\nfunction handleOpen() {\n  clearTimeout(closeTimerRef.value)\n  openTimerRef.value = window.setTimeout(() => open.value = true, openDelay.value)\n}\n\nfunction handleClose() {\n  clearTimeout(openTimerRef.value)\n  if (!hasSelectionRef.value && !isPointerDownOnContentRef.value)\n    closeTimerRef.value = window.setTimeout(() => open.value = false, closeDelay.value)\n}\n\nfunction handleDismiss() {\n  open.value = false\n}\n\nprovideHoverCardRootContext({\n  open,\n  onOpenChange(value) {\n    open.value = value\n  },\n  onOpen: handleOpen,\n  onClose: handleClose,\n  onDismiss: handleDismiss,\n  hasSelectionRef,\n  isPointerDownOnContentRef,\n  isPointerInTransitRef,\n  triggerElement,\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot :open=\"open\" />\n  </PopperRoot>\n</template>\n"],"names":[],"mappings":";;;;;;AA+BO,MAAM,CAAC,0BAAA,EAA4B,2BAA2B,CAAA,GACjE,cAAoC,eAAe;;;;;;;;;;;AAQvD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAMd,IAAA,MAAM,IAAO,GAAA,MAAA;AASb,IAAA,MAAM,EAAE,SAAA,EAAW,UAAW,EAAA,GAAI,OAAO,KAAK,CAAA;AAE9C,IAAiB,gBAAA,EAAA;AACjB,IAAA,MAAM,IAAO,GAAA,SAAA,CAAU,KAAO,EAAA,MAAA,EAAQ,IAAM,EAAA;AAAA,MAC1C,cAAc,KAAM,CAAA,WAAA;AAAA,MACpB,OAAA,EAAU,MAAM,IAAS,KAAA;AAAA,KAC1B,CAAA;AAED,IAAM,MAAA,YAAA,GAAe,IAAI,CAAC,CAAA;AAC1B,IAAM,MAAA,aAAA,GAAgB,IAAI,CAAC,CAAA;AAC3B,IAAM,MAAA,eAAA,GAAkB,IAAI,KAAK,CAAA;AACjC,IAAM,MAAA,yBAAA,GAA4B,IAAI,KAAK,CAAA;AAC3C,IAAM,MAAA,qBAAA,GAAwB,IAAI,KAAK,CAAA;AACvC,IAAA,MAAM,iBAAiB,GAAiB,EAAA;AAExC,IAAA,SAAS,UAAa,GAAA;AACpB,MAAA,YAAA,CAAa,cAAc,KAAK,CAAA;AAChC,MAAa,YAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,IAAA,EAAM,UAAU,KAAK,CAAA;AAAA;AAGjF,IAAA,SAAS,WAAc,GAAA;AACrB,MAAA,YAAA,CAAa,aAAa,KAAK,CAAA;AAC/B,MAAA,IAAI,CAAC,eAAA,CAAgB,KAAS,IAAA,CAAC,yBAA0B,CAAA,KAAA;AACvD,QAAc,aAAA,CAAA,KAAA,GAAQ,OAAO,UAAW,CAAA,MAAM,KAAK,KAAQ,GAAA,KAAA,EAAO,WAAW,KAAK,CAAA;AAAA;AAGtF,IAAA,SAAS,aAAgB,GAAA;AACvB,MAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA;AAGf,IAA4B,2BAAA,CAAA;AAAA,MAC1B,IAAA;AAAA,MACA,aAAa,KAAO,EAAA;AAClB,QAAA,IAAA,CAAK,KAAQ,GAAA,KAAA;AAAA,OACf;AAAA,MACA,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,SAAW,EAAA,aAAA;AAAA,MACX,eAAA;AAAA,MACA,yBAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA,KACD,CAAA;;;;;;;;;;;;;;"}

package/dist/HoverCard/HoverCardTrigger.js

@@ -1,4 +1,4 @@
-import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, withCtx, createVNode, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from '../Popper/PopperAnchor.js';
 import { e as excludeTouch } from './utils.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';

package/dist/HoverCard/utils.cjs

@@ -1,7 +1,7 @@
 'use strict';
 
 function excludeTouch(eventHandler) {
-  return (event) => event.pointerType === "touch" ? undefined : eventHandler();
+  return (event) => event.pointerType === "touch" ? void 0 : eventHandler();
 }
 function getTabbableNodes(container) {
   const nodes = [];

package/dist/HoverCard/utils.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"utils.cjs","sources":["../../src/HoverCard/utils.ts"],"sourcesContent":["export function excludeTouch(eventHandler: () => void) {\n  return (event: PointerEvent) => event.pointerType === 'touch' ? undefined : eventHandler()\n}\n\n/**\n * Returns a list of nodes that can be in the tab sequence.\n * @see: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker\n */\nexport function getTabbableNodes(container: HTMLElement) {\n  const nodes: HTMLElement[] = []\n  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n    acceptNode: (node: any) => {\n      // `.tabIndex` is not the same as the `tabindex` attribute. It works on the\n      // runtime's understanding of tabbability, so this automatically accounts\n      // for any kind of element that could be tabbed to.\n      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP\n    },\n  })\n  while (walker.nextNode()) nodes.push(walker.currentNode as HTMLElement)\n  return nodes\n}\n"],"names":[],"mappings":";;AAAO,SAAS,aAAa,YAA0B,EAAA;AACrD,EAAA,OAAO,CAAC,KAAwB,KAAA,KAAA,CAAM,WAAgB,KAAA,OAAA,GAAU,YAAY,YAAa,EAAA;AAC3F;AAMO,SAAS,iBAAiB,SAAwB,EAAA;AACvD,EAAA,MAAM,QAAuB,EAAC;AAC9B,EAAA,MAAM,MAAS,GAAA,QAAA,CAAS,gBAAiB,CAAA,SAAA,EAAW,WAAW,YAAc,EAAA;AAAA,IAC3E,UAAA,EAAY,CAAC,IAAc,KAAA;AAIzB,MAAA,OAAO,IAAK,CAAA,QAAA,IAAY,CAAI,GAAA,UAAA,CAAW,gBAAgB,UAAW,CAAA,WAAA;AAAA;AACpE,GACD,CAAA;AACD,EAAA,OAAO,OAAO,QAAS,EAAA,EAAS,KAAA,CAAA,IAAA,CAAK,OAAO,WAA0B,CAAA;AACtE,EAAO,OAAA,KAAA;AACT;;;;;"}
+{"version":3,"file":"utils.cjs","sources":["../../src/HoverCard/utils.ts"],"sourcesContent":["export function excludeTouch(eventHandler: () => void) {\n  return (event: PointerEvent) => event.pointerType === 'touch' ? undefined : eventHandler()\n}\n\n/**\n * Returns a list of nodes that can be in the tab sequence.\n * @see: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker\n */\nexport function getTabbableNodes(container: HTMLElement) {\n  const nodes: HTMLElement[] = []\n  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n    acceptNode: (node: any) => {\n      // `.tabIndex` is not the same as the `tabindex` attribute. It works on the\n      // runtime's understanding of tabbability, so this automatically accounts\n      // for any kind of element that could be tabbed to.\n      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP\n    },\n  })\n  while (walker.nextNode()) nodes.push(walker.currentNode as HTMLElement)\n  return nodes\n}\n"],"names":[],"mappings":";;AAAO,SAAS,aAAa,YAA0B,EAAA;AACrD,EAAA,OAAO,CAAC,KAAwB,KAAA,KAAA,CAAM,WAAgB,KAAA,OAAA,GAAU,SAAY,YAAa,EAAA;AAC3F;AAMO,SAAS,iBAAiB,SAAwB,EAAA;AACvD,EAAA,MAAM,QAAuB,EAAC;AAC9B,EAAA,MAAM,MAAS,GAAA,QAAA,CAAS,gBAAiB,CAAA,SAAA,EAAW,WAAW,YAAc,EAAA;AAAA,IAC3E,UAAA,EAAY,CAAC,IAAc,KAAA;AAIzB,MAAA,OAAO,IAAK,CAAA,QAAA,IAAY,CAAI,GAAA,UAAA,CAAW,gBAAgB,UAAW,CAAA,WAAA;AAAA;AACpE,GACD,CAAA;AACD,EAAA,OAAO,OAAO,QAAS,EAAA,EAAS,KAAA,CAAA,IAAA,CAAK,OAAO,WAA0B,CAAA;AACtE,EAAO,OAAA,KAAA;AACT;;;;;"}

package/dist/HoverCard/utils.js

@@ -1,5 +1,5 @@
 function excludeTouch(eventHandler) {
-  return (event) => event.pointerType === "touch" ? undefined : eventHandler();
+  return (event) => event.pointerType === "touch" ? void 0 : eventHandler();
 }
 function getTabbableNodes(container) {
   const nodes = [];

package/dist/HoverCard/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sources":["../../src/HoverCard/utils.ts"],"sourcesContent":["export function excludeTouch(eventHandler: () => void) {\n  return (event: PointerEvent) => event.pointerType === 'touch' ? undefined : eventHandler()\n}\n\n/**\n * Returns a list of nodes that can be in the tab sequence.\n * @see: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker\n */\nexport function getTabbableNodes(container: HTMLElement) {\n  const nodes: HTMLElement[] = []\n  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n    acceptNode: (node: any) => {\n      // `.tabIndex` is not the same as the `tabindex` attribute. It works on the\n      // runtime's understanding of tabbability, so this automatically accounts\n      // for any kind of element that could be tabbed to.\n      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP\n    },\n  })\n  while (walker.nextNode()) nodes.push(walker.currentNode as HTMLElement)\n  return nodes\n}\n"],"names":[],"mappings":"AAAO,SAAS,aAAa,YAA0B,EAAA;AACrD,EAAA,OAAO,CAAC,KAAwB,KAAA,KAAA,CAAM,WAAgB,KAAA,OAAA,GAAU,YAAY,YAAa,EAAA;AAC3F;AAMO,SAAS,iBAAiB,SAAwB,EAAA;AACvD,EAAA,MAAM,QAAuB,EAAC;AAC9B,EAAA,MAAM,MAAS,GAAA,QAAA,CAAS,gBAAiB,CAAA,SAAA,EAAW,WAAW,YAAc,EAAA;AAAA,IAC3E,UAAA,EAAY,CAAC,IAAc,KAAA;AAIzB,MAAA,OAAO,IAAK,CAAA,QAAA,IAAY,CAAI,GAAA,UAAA,CAAW,gBAAgB,UAAW,CAAA,WAAA;AAAA;AACpE,GACD,CAAA;AACD,EAAA,OAAO,OAAO,QAAS,EAAA,EAAS,KAAA,CAAA,IAAA,CAAK,OAAO,WAA0B,CAAA;AACtE,EAAO,OAAA,KAAA;AACT;;;;"}
+{"version":3,"file":"utils.js","sources":["../../src/HoverCard/utils.ts"],"sourcesContent":["export function excludeTouch(eventHandler: () => void) {\n  return (event: PointerEvent) => event.pointerType === 'touch' ? undefined : eventHandler()\n}\n\n/**\n * Returns a list of nodes that can be in the tab sequence.\n * @see: https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker\n */\nexport function getTabbableNodes(container: HTMLElement) {\n  const nodes: HTMLElement[] = []\n  const walker = document.createTreeWalker(container, NodeFilter.SHOW_ELEMENT, {\n    acceptNode: (node: any) => {\n      // `.tabIndex` is not the same as the `tabindex` attribute. It works on the\n      // runtime's understanding of tabbability, so this automatically accounts\n      // for any kind of element that could be tabbed to.\n      return node.tabIndex >= 0 ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_SKIP\n    },\n  })\n  while (walker.nextNode()) nodes.push(walker.currentNode as HTMLElement)\n  return nodes\n}\n"],"names":[],"mappings":"AAAO,SAAS,aAAa,YAA0B,EAAA;AACrD,EAAA,OAAO,CAAC,KAAwB,KAAA,KAAA,CAAM,WAAgB,KAAA,OAAA,GAAU,SAAY,YAAa,EAAA;AAC3F;AAMO,SAAS,iBAAiB,SAAwB,EAAA;AACvD,EAAA,MAAM,QAAuB,EAAC;AAC9B,EAAA,MAAM,MAAS,GAAA,QAAA,CAAS,gBAAiB,CAAA,SAAA,EAAW,WAAW,YAAc,EAAA;AAAA,IAC3E,UAAA,EAAY,CAAC,IAAc,KAAA;AAIzB,MAAA,OAAO,IAAK,CAAA,QAAA,IAAY,CAAI,GAAA,UAAA,CAAW,gBAAgB,UAAW,CAAA,WAAA;AAAA;AACpE,GACD,CAAA;AACD,EAAA,OAAO,OAAO,QAAS,EAAA,EAAS,KAAA,CAAA,IAAA,CAAK,OAAO,WAA0B,CAAA;AACtE,EAAO,OAAA,KAAA;AACT;;;;"}

package/dist/Label/Label.js

@@ -1,4 +1,4 @@
-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 { P as Primitive } from '../Primitive/Primitive.js';
 

package/dist/Listbox/ListboxContent.cjs

@@ -24,7 +24,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             role: "listbox",
             as: _ctx.as,
             "as-child": _ctx.asChild,
-            tabindex: vue.unref(rootContext).focusable.value ? vue.unref(rootContext).highlightedElement.value ? "-1" : "0" : undefined,
+            tabindex: vue.unref(rootContext).focusable.value ? vue.unref(rootContext).highlightedElement.value ? "-1" : "0" : void 0,
             "aria-orientation": vue.unref(rootContext).orientation.value,
             "aria-multiselectable": !!vue.unref(rootContext).multiple.value,
             "data-orientation": vue.unref(rootContext).orientation.value,
@@ -36,7 +36,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             }),
             onKeydown: [
               _cache[2] || (_cache[2] = vue.withKeys(vue.withModifiers((event) => {
-                vue.unref(rootContext).focusable.value ? vue.unref(rootContext).onKeydownNavigation(event) : undefined;
+                vue.unref(rootContext).focusable.value ? vue.unref(rootContext).onKeydownNavigation(event) : void 0;
               }, ["prevent"]), ["down", "up", "left", "right", "home", "end"])),
               vue.withKeys(vue.unref(rootContext).onKeydownEnter, ["enter"]),
               vue.unref(rootContext).onKeydownTypeAhead

package/dist/Listbox/ListboxContent.js

@@ -1,4 +1,4 @@
-import { defineComponent, openBlock, createBlock, unref, withCtx, createVNode, withModifiers, withKeys, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, withCtx, createVNode, withKeys, withModifiers, renderSlot } from 'vue';
 import { u as useCollection } from '../Collection/Collection.js';
 import '@floating-ui/vue';
 import { refAutoReset } from '@vueuse/shared';
@@ -22,7 +22,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             role: "listbox",
             as: _ctx.as,
             "as-child": _ctx.asChild,
-            tabindex: unref(rootContext).focusable.value ? unref(rootContext).highlightedElement.value ? "-1" : "0" : undefined,
+            tabindex: unref(rootContext).focusable.value ? unref(rootContext).highlightedElement.value ? "-1" : "0" : void 0,
             "aria-orientation": unref(rootContext).orientation.value,
             "aria-multiselectable": !!unref(rootContext).multiple.value,
             "data-orientation": unref(rootContext).orientation.value,
@@ -34,7 +34,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }),
             onKeydown: [
               _cache[2] || (_cache[2] = withKeys(withModifiers((event) => {
-                unref(rootContext).focusable.value ? unref(rootContext).onKeydownNavigation(event) : undefined;
+                unref(rootContext).focusable.value ? unref(rootContext).onKeydownNavigation(event) : void 0;
               }, ["prevent"]), ["down", "up", "left", "right", "home", "end"])),
               withKeys(unref(rootContext).onKeydownEnter, ["enter"]),
               unref(rootContext).onKeydownTypeAhead

package/dist/Listbox/ListboxFilter.cjs

@@ -22,20 +22,23 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const emits = __emit;
     const modelValue = core.useVModel(props, "modelValue", emits, {
       defaultValue: "",
-      passive: props.modelValue === undefined
+      passive: props.modelValue === void 0
     });
     const rootContext = Listbox_ListboxRoot.injectListboxRootContext();
-    rootContext.focusable.value = false;
     const { primitiveElement, currentElement } = Primitive_usePrimitiveElement.usePrimitiveElement();
     const disabled = vue.computed(() => props.disabled || rootContext.disabled.value || false);
     const activedescendant = vue.ref();
     vue.watchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id);
     vue.onMounted(() => {
+      rootContext.focusable.value = false;
       setTimeout(() => {
         if (props.autoFocus)
           currentElement.value?.focus();
       }, 1);
     });
+    vue.onUnmounted(() => {
+      rootContext.focusable.value = true;
+    });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(Primitive_Primitive.Primitive), {
         ref_key: "primitiveElement",
@@ -43,9 +46,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         as: _ctx.as,
         "as-child": _ctx.asChild,
         value: vue.unref(modelValue),
-        disabled: disabled.value ? "" : undefined,
-        "data-disabled": disabled.value ? "" : undefined,
-        "aria-disabled": disabled.value ?? undefined,
+        disabled: disabled.value ? "" : void 0,
+        "data-disabled": disabled.value ? "" : void 0,
+        "aria-disabled": disabled.value ?? void 0,
         "aria-activedescendant": activedescendant.value,
         type: "text",
         onKeydown: [

package/dist/Listbox/ListboxFilter.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListboxFilter.cjs","sources":["../../src/Listbox/ListboxFilter.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { computed, onMounted, ref, watchSyncEffect } from 'vue'\nimport { usePrimitiveElement } from '@/Primitive'\n\nexport interface ListboxFilterProps extends PrimitiveProps {\n  /** The controlled value of the filter. Can be binded with with v-model. */\n  modelValue?: string\n  /** Focus on element when mounted. */\n  autoFocus?: boolean\n  /** When `true`, prevents the user from interacting with item */\n  disabled?: boolean\n}\n\nexport type ListboxFilterEmits = {\n  'update:modelValue': [string]\n}\n</script>\n\n<script setup lang=\"ts\">\nconst props = withDefaults(defineProps<ListboxFilterProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ListboxFilterEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: '',\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst rootContext = injectListboxRootContext()\nrootContext.focusable.value = false\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\nconst disabled = computed(() => props.disabled || rootContext.disabled.value || false)\n\nconst activedescendant = ref<string | undefined>()\nwatchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id)\n\nonMounted(() => {\n  setTimeout(() => {\n    // make sure all DOM was flush then only capture the focus\n    if (props.autoFocus)\n      currentElement.value?.focus()\n  }, 1)\n})\n</script>\n\n<template>\n  <Primitive\n    ref=\"primitiveElement\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :value=\"modelValue\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :aria-disabled=\"disabled ?? undefined\"\n    :aria-activedescendant=\"activedescendant\"\n    type=\"text\"\n    @keydown.down.up.home.end.prevent=\"rootContext.onKeydownNavigation\"\n    @keydown.enter=\"rootContext.onKeydownEnter\"\n    @input=\"(event: InputEvent) => {\n      modelValue = (event.target as HTMLInputElement).value\n      rootContext.highlightFirstItem(event)\n    }\"\n    @compositionstart=\"rootContext.onCompositionStart\"\n    @compositionend=\"rootContext.onCompositionEnd\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":["useVModel","injectListboxRootContext","usePrimitiveElement","computed","ref","watchSyncEffect","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,UAAa,GAAAA,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,YAAc,EAAA,EAAA;AAAA,MACd,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAC7C,IAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,KAAA;AAE9B,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AACjE,IAAM,MAAA,QAAA,GAAWC,aAAS,MAAM,KAAA,CAAM,YAAY,WAAY,CAAA,QAAA,CAAS,SAAS,KAAK,CAAA;AAErF,IAAA,MAAM,mBAAmBC,OAAwB,EAAA;AACjD,IAAAC,mBAAA,CAAgB,MAAM,gBAAiB,CAAA,KAAA,GAAQ,WAAY,CAAA,kBAAA,CAAmB,OAAO,EAAE,CAAA;AAEvF,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,UAAA,CAAW,MAAM;AAEf,QAAA,IAAI,KAAM,CAAA,SAAA;AACR,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA,KACL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListboxFilter.cjs","sources":["../../src/Listbox/ListboxFilter.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { computed, onMounted, onUnmounted, ref, watchSyncEffect } from 'vue'\nimport { usePrimitiveElement } from '@/Primitive'\n\nexport interface ListboxFilterProps extends PrimitiveProps {\n  /** The controlled value of the filter. Can be binded with with v-model. */\n  modelValue?: string\n  /** Focus on element when mounted. */\n  autoFocus?: boolean\n  /** When `true`, prevents the user from interacting with item */\n  disabled?: boolean\n}\n\nexport type ListboxFilterEmits = {\n  'update:modelValue': [string]\n}\n</script>\n\n<script setup lang=\"ts\">\nconst props = withDefaults(defineProps<ListboxFilterProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ListboxFilterEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: '',\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst rootContext = injectListboxRootContext()\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\nconst disabled = computed(() => props.disabled || rootContext.disabled.value || false)\n\nconst activedescendant = ref<string | undefined>()\nwatchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id)\n\nonMounted(() => {\n  rootContext.focusable.value = false\n\n  setTimeout(() => {\n    // make sure all DOM was flush then only capture the focus\n    if (props.autoFocus)\n      currentElement.value?.focus()\n  }, 1)\n})\n\nonUnmounted(() => {\n  rootContext.focusable.value = true\n})\n</script>\n\n<template>\n  <Primitive\n    ref=\"primitiveElement\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :value=\"modelValue\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :aria-disabled=\"disabled ?? undefined\"\n    :aria-activedescendant=\"activedescendant\"\n    type=\"text\"\n    @keydown.down.up.home.end.prevent=\"rootContext.onKeydownNavigation\"\n    @keydown.enter=\"rootContext.onKeydownEnter\"\n    @input=\"(event: InputEvent) => {\n      modelValue = (event.target as HTMLInputElement).value\n      rootContext.highlightFirstItem(event)\n    }\"\n    @compositionstart=\"rootContext.onCompositionStart\"\n    @compositionend=\"rootContext.onCompositionEnd\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":["useVModel","injectListboxRootContext","usePrimitiveElement","computed","ref","watchSyncEffect","onMounted","onUnmounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AAsBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,UAAa,GAAAA,cAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,YAAc,EAAA,EAAA;AAAA,MACd,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAE7C,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAIC,iDAAoB,EAAA;AACjE,IAAM,MAAA,QAAA,GAAWC,aAAS,MAAM,KAAA,CAAM,YAAY,WAAY,CAAA,QAAA,CAAS,SAAS,KAAK,CAAA;AAErF,IAAA,MAAM,mBAAmBC,OAAwB,EAAA;AACjD,IAAAC,mBAAA,CAAgB,MAAM,gBAAiB,CAAA,KAAA,GAAQ,WAAY,CAAA,kBAAA,CAAmB,OAAO,EAAE,CAAA;AAEvF,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,KAAA;AAE9B,MAAA,UAAA,CAAW,MAAM;AAEf,QAAA,IAAI,KAAM,CAAA,SAAA;AACR,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA,KACL,CAAA;AAED,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,IAAA;AAAA,KAC/B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Listbox/ListboxFilter.js

@@ -1,4 +1,4 @@
-import { defineComponent, computed, ref, watchSyncEffect, onMounted, openBlock, createBlock, unref, withKeys, withModifiers, withCtx, renderSlot } from 'vue';
+import { defineComponent, computed, ref, watchSyncEffect, onMounted, onUnmounted, createBlock, openBlock, unref, withKeys, withModifiers, withCtx, renderSlot } from 'vue';
 import { useVModel } from '@vueuse/core';
 import '@floating-ui/vue';
 import { u as usePrimitiveElement } from '../Primitive/usePrimitiveElement.js';
@@ -20,20 +20,23 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const emits = __emit;
     const modelValue = useVModel(props, "modelValue", emits, {
       defaultValue: "",
-      passive: props.modelValue === undefined
+      passive: props.modelValue === void 0
     });
     const rootContext = injectListboxRootContext();
-    rootContext.focusable.value = false;
     const { primitiveElement, currentElement } = usePrimitiveElement();
     const disabled = computed(() => props.disabled || rootContext.disabled.value || false);
     const activedescendant = ref();
     watchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id);
     onMounted(() => {
+      rootContext.focusable.value = false;
       setTimeout(() => {
         if (props.autoFocus)
           currentElement.value?.focus();
       }, 1);
     });
+    onUnmounted(() => {
+      rootContext.focusable.value = true;
+    });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Primitive), {
         ref_key: "primitiveElement",
@@ -41,9 +44,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         as: _ctx.as,
         "as-child": _ctx.asChild,
         value: unref(modelValue),
-        disabled: disabled.value ? "" : undefined,
-        "data-disabled": disabled.value ? "" : undefined,
-        "aria-disabled": disabled.value ?? undefined,
+        disabled: disabled.value ? "" : void 0,
+        "data-disabled": disabled.value ? "" : void 0,
+        "aria-disabled": disabled.value ?? void 0,
         "aria-activedescendant": activedescendant.value,
         type: "text",
         onKeydown: [

package/dist/Listbox/ListboxFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListboxFilter.js","sources":["../../src/Listbox/ListboxFilter.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { computed, onMounted, ref, watchSyncEffect } from 'vue'\nimport { usePrimitiveElement } from '@/Primitive'\n\nexport interface ListboxFilterProps extends PrimitiveProps {\n  /** The controlled value of the filter. Can be binded with with v-model. */\n  modelValue?: string\n  /** Focus on element when mounted. */\n  autoFocus?: boolean\n  /** When `true`, prevents the user from interacting with item */\n  disabled?: boolean\n}\n\nexport type ListboxFilterEmits = {\n  'update:modelValue': [string]\n}\n</script>\n\n<script setup lang=\"ts\">\nconst props = withDefaults(defineProps<ListboxFilterProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ListboxFilterEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: '',\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst rootContext = injectListboxRootContext()\nrootContext.focusable.value = false\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\nconst disabled = computed(() => props.disabled || rootContext.disabled.value || false)\n\nconst activedescendant = ref<string | undefined>()\nwatchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id)\n\nonMounted(() => {\n  setTimeout(() => {\n    // make sure all DOM was flush then only capture the focus\n    if (props.autoFocus)\n      currentElement.value?.focus()\n  }, 1)\n})\n</script>\n\n<template>\n  <Primitive\n    ref=\"primitiveElement\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :value=\"modelValue\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :aria-disabled=\"disabled ?? undefined\"\n    :aria-activedescendant=\"activedescendant\"\n    type=\"text\"\n    @keydown.down.up.home.end.prevent=\"rootContext.onKeydownNavigation\"\n    @keydown.enter=\"rootContext.onKeydownEnter\"\n    @input=\"(event: InputEvent) => {\n      modelValue = (event.target as HTMLInputElement).value\n      rootContext.highlightFirstItem(event)\n    }\"\n    @compositionstart=\"rootContext.onCompositionStart\"\n    @compositionend=\"rootContext.onCompositionEnd\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAsBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,YAAc,EAAA,EAAA;AAAA,MACd,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,cAAc,wBAAyB,EAAA;AAC7C,IAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,KAAA;AAE9B,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAI,mBAAoB,EAAA;AACjE,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM,KAAA,CAAM,YAAY,WAAY,CAAA,QAAA,CAAS,SAAS,KAAK,CAAA;AAErF,IAAA,MAAM,mBAAmB,GAAwB,EAAA;AACjD,IAAA,eAAA,CAAgB,MAAM,gBAAiB,CAAA,KAAA,GAAQ,WAAY,CAAA,kBAAA,CAAmB,OAAO,EAAE,CAAA;AAEvF,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,UAAA,CAAW,MAAM;AAEf,QAAA,IAAI,KAAM,CAAA,SAAA;AACR,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA,KACL,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListboxFilter.js","sources":["../../src/Listbox/ListboxFilter.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { useVModel } from '@vueuse/core'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { computed, onMounted, onUnmounted, ref, watchSyncEffect } from 'vue'\nimport { usePrimitiveElement } from '@/Primitive'\n\nexport interface ListboxFilterProps extends PrimitiveProps {\n  /** The controlled value of the filter. Can be binded with with v-model. */\n  modelValue?: string\n  /** Focus on element when mounted. */\n  autoFocus?: boolean\n  /** When `true`, prevents the user from interacting with item */\n  disabled?: boolean\n}\n\nexport type ListboxFilterEmits = {\n  'update:modelValue': [string]\n}\n</script>\n\n<script setup lang=\"ts\">\nconst props = withDefaults(defineProps<ListboxFilterProps>(), {\n  as: 'input',\n})\nconst emits = defineEmits<ListboxFilterEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n  }) => any\n}>()\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: '',\n  passive: (props.modelValue === undefined) as false,\n})\n\nconst rootContext = injectListboxRootContext()\n\nconst { primitiveElement, currentElement } = usePrimitiveElement()\nconst disabled = computed(() => props.disabled || rootContext.disabled.value || false)\n\nconst activedescendant = ref<string | undefined>()\nwatchSyncEffect(() => activedescendant.value = rootContext.highlightedElement.value?.id)\n\nonMounted(() => {\n  rootContext.focusable.value = false\n\n  setTimeout(() => {\n    // make sure all DOM was flush then only capture the focus\n    if (props.autoFocus)\n      currentElement.value?.focus()\n  }, 1)\n})\n\nonUnmounted(() => {\n  rootContext.focusable.value = true\n})\n</script>\n\n<template>\n  <Primitive\n    ref=\"primitiveElement\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :value=\"modelValue\"\n    :disabled=\"disabled ? '' : undefined\"\n    :data-disabled=\"disabled ? '' : undefined\"\n    :aria-disabled=\"disabled ?? undefined\"\n    :aria-activedescendant=\"activedescendant\"\n    type=\"text\"\n    @keydown.down.up.home.end.prevent=\"rootContext.onKeydownNavigation\"\n    @keydown.enter=\"rootContext.onKeydownEnter\"\n    @input=\"(event: InputEvent) => {\n      modelValue = (event.target as HTMLInputElement).value\n      rootContext.highlightFirstItem(event)\n    }\"\n    @compositionstart=\"rootContext.onCompositionStart\"\n    @compositionend=\"rootContext.onCompositionEnd\"\n  >\n    <slot :model-value=\"modelValue\" />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAsBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AASd,IAAA,MAAM,UAAa,GAAA,SAAA,CAAU,KAAO,EAAA,YAAA,EAAc,KAAO,EAAA;AAAA,MACvD,YAAc,EAAA,EAAA;AAAA,MACd,OAAA,EAAU,MAAM,UAAe,KAAA;AAAA,KAChC,CAAA;AAED,IAAA,MAAM,cAAc,wBAAyB,EAAA;AAE7C,IAAA,MAAM,EAAE,gBAAA,EAAkB,cAAe,EAAA,GAAI,mBAAoB,EAAA;AACjE,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM,KAAA,CAAM,YAAY,WAAY,CAAA,QAAA,CAAS,SAAS,KAAK,CAAA;AAErF,IAAA,MAAM,mBAAmB,GAAwB,EAAA;AACjD,IAAA,eAAA,CAAgB,MAAM,gBAAiB,CAAA,KAAA,GAAQ,WAAY,CAAA,kBAAA,CAAmB,OAAO,EAAE,CAAA;AAEvF,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,KAAA;AAE9B,MAAA,UAAA,CAAW,MAAM;AAEf,QAAA,IAAI,KAAM,CAAA,SAAA;AACR,UAAA,cAAA,CAAe,OAAO,KAAM,EAAA;AAAA,SAC7B,CAAC,CAAA;AAAA,KACL,CAAA;AAED,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,WAAA,CAAY,UAAU,KAAQ,GAAA,IAAA;AAAA,KAC/B,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Listbox/ListboxGroup.cjs

@@ -2,8 +2,8 @@
 
 const vue = require('vue');
 const shared_useId = require('../shared/useId.cjs');
-const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
+const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 
 const [injectListboxGroupContext, provideListboxGroupContext] = shared_createContext.createContext("ListboxGroup");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
@@ -14,7 +14,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const id = shared_useId.useId(undefined, "reka-listbox-group");
+    const id = shared_useId.useId(void 0, "reka-listbox-group");
     provideListboxGroupContext({ id });
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(vue.unref(Primitive_Primitive.Primitive), vue.mergeProps({ role: "group" }, props, { "aria-labelledby": vue.unref(id) }), {

package/dist/Listbox/ListboxGroup.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListboxGroup.cjs","sources":["../../src/Listbox/ListboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useId } from '@/shared'\n\nexport interface ListboxGroupProps extends PrimitiveProps {}\n\ninterface ListboxGroupContext {\n  id: string\n}\n\nexport const [injectListboxGroupContext, provideListboxGroupContext]\n  = createContext<ListboxGroupContext>('ListboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\n\nconst props = defineProps<ListboxGroupProps>()\n\nconst id = useId(undefined, 'reka-listbox-group')\nprovideListboxGroupContext({ id })\n</script>\n\n<template>\n  <Primitive\n    role=\"group\"\n    v-bind=\"props\"\n    :aria-labelledby=\"id\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["createContext","useId"],"mappings":";;;;;;;AAUO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/DA,mCAAmC,cAAc;;;;;;;;AAMrD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAA,GAAKC,kBAAM,CAAA,SAAA,EAAW,oBAAoB,CAAA;AAChD,IAA2B,0BAAA,CAAA,EAAE,IAAI,CAAA;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListboxGroup.cjs","sources":["../../src/Listbox/ListboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useId } from '@/shared'\n\nexport interface ListboxGroupProps extends PrimitiveProps {}\n\ninterface ListboxGroupContext {\n  id: string\n}\n\nexport const [injectListboxGroupContext, provideListboxGroupContext]\n  = createContext<ListboxGroupContext>('ListboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\n\nconst props = defineProps<ListboxGroupProps>()\n\nconst id = useId(undefined, 'reka-listbox-group')\nprovideListboxGroupContext({ id })\n</script>\n\n<template>\n  <Primitive\n    role=\"group\"\n    v-bind=\"props\"\n    :aria-labelledby=\"id\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["createContext","useId"],"mappings":";;;;;;;AAUO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/DA,mCAAmC,cAAc;;;;;;;;AAMrD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAA,GAAKC,kBAAM,CAAA,MAAA,EAAW,oBAAoB,CAAA;AAChD,IAA2B,0BAAA,CAAA,EAAE,IAAI,CAAA;;;;;;;;;;;;;;;"}

package/dist/Listbox/ListboxGroup.js

@@ -1,7 +1,7 @@
-import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { u as useId } from '../shared/useId.js';
-import { P as Primitive } from '../Primitive/Primitive.js';
 import { c as createContext } from '../shared/createContext.js';
+import { P as Primitive } from '../Primitive/Primitive.js';
 
 const [injectListboxGroupContext, provideListboxGroupContext] = createContext("ListboxGroup");
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -12,7 +12,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const id = useId(undefined, "reka-listbox-group");
+    const id = useId(void 0, "reka-listbox-group");
     provideListboxGroupContext({ id });
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Primitive), mergeProps({ role: "group" }, props, { "aria-labelledby": unref(id) }), {

package/dist/Listbox/ListboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListboxGroup.js","sources":["../../src/Listbox/ListboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useId } from '@/shared'\n\nexport interface ListboxGroupProps extends PrimitiveProps {}\n\ninterface ListboxGroupContext {\n  id: string\n}\n\nexport const [injectListboxGroupContext, provideListboxGroupContext]\n  = createContext<ListboxGroupContext>('ListboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\n\nconst props = defineProps<ListboxGroupProps>()\n\nconst id = useId(undefined, 'reka-listbox-group')\nprovideListboxGroupContext({ id })\n</script>\n\n<template>\n  <Primitive\n    role=\"group\"\n    v-bind=\"props\"\n    :aria-labelledby=\"id\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;AAUO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/D,cAAmC,cAAc;;;;;;;;AAMrD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,SAAA,EAAW,oBAAoB,CAAA;AAChD,IAA2B,0BAAA,CAAA,EAAE,IAAI,CAAA;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListboxGroup.js","sources":["../../src/Listbox/ListboxGroup.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { createContext, useId } from '@/shared'\n\nexport interface ListboxGroupProps extends PrimitiveProps {}\n\ninterface ListboxGroupContext {\n  id: string\n}\n\nexport const [injectListboxGroupContext, provideListboxGroupContext]\n  = createContext<ListboxGroupContext>('ListboxGroup')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\n\nconst props = defineProps<ListboxGroupProps>()\n\nconst id = useId(undefined, 'reka-listbox-group')\nprovideListboxGroupContext({ id })\n</script>\n\n<template>\n  <Primitive\n    role=\"group\"\n    v-bind=\"props\"\n    :aria-labelledby=\"id\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;AAUO,MAAM,CAAC,yBAAA,EAA2B,0BAA0B,CAAA,GAC/D,cAAmC,cAAc;;;;;;;;AAMrD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAEd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,MAAA,EAAW,oBAAoB,CAAA;AAChD,IAA2B,0BAAA,CAAA,EAAE,IAAI,CAAA;;;;;;;;;;;;;;"}

package/dist/Listbox/ListboxGroupLabel.js

@@ -1,4 +1,4 @@
-import { defineComponent, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
 import { i as injectListboxGroupContext } from './ListboxGroup.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
 

package/dist/Listbox/ListboxItem.cjs

@@ -4,10 +4,10 @@ const vue = require('vue');
 require('@floating-ui/vue');
 const Listbox_utils = require('./utils.cjs');
 const Collection_Collection = require('../Collection/Collection.cjs');
+const shared_createContext = require('../shared/createContext.cjs');
 const shared_useId = require('../shared/useId.cjs');
 const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
-const shared_createContext = require('../shared/createContext.cjs');
 const shared_handleAndDispatchCustomEvent = require('../shared/handleAndDispatchCustomEvent.cjs');
 const Listbox_ListboxRoot = require('./ListboxRoot.cjs');
 
@@ -25,7 +25,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const id = shared_useId.useId(undefined, "reka-listbox-item");
+    const id = shared_useId.useId(void 0, "reka-listbox-item");
     const { CollectionItem } = Collection_Collection.useCollection();
     const { forwardRef, currentElement } = shared_useForwardExpose.useForwardExpose();
     const rootContext = Listbox_ListboxRoot.injectListboxRootContext();
@@ -58,9 +58,9 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             "aria-selected": isSelected.value,
             as: _ctx.as,
             "as-child": _ctx.asChild,
-            disabled: disabled.value ? "" : undefined,
-            "data-disabled": disabled.value ? "" : undefined,
-            "data-highlighted": isHighlighted.value ? "" : undefined,
+            disabled: disabled.value ? "" : void 0,
+            "data-disabled": disabled.value ? "" : void 0,
+            "data-highlighted": isHighlighted.value ? "" : void 0,
             "data-state": isSelected.value ? "checked" : "unchecked",
             onClick: handleSelectCustomEvent,
             onKeydown: vue.withKeys(vue.withModifiers(handleSelectCustomEvent, ["prevent"]), ["space"]),
@@ -70,7 +70,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
               if (vue.unref(rootContext).highlightOnHover.value)
                 vue.unref(rootContext).changeHighlight(vue.unref(currentElement), false);
               else
-                vue.unref(rootContext).focusable.value ? undefined : vue.unref(rootContext).changeHighlight(vue.unref(currentElement), false);
+                vue.unref(rootContext).focusable.value ? void 0 : vue.unref(rootContext).changeHighlight(vue.unref(currentElement), false);
             })
           }), {
             default: vue.withCtx(() => [

package/dist/Listbox/ListboxItem.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListboxItem.cjs","sources":["../../src/Listbox/ListboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { createContext, handleAndDispatchCustomEvent, useForwardExpose, useId } from '@/shared'\n\nexport interface ListboxItemProps<T = AcceptableValue> extends PrimitiveProps {\n  /** The value given as data when submitted with a `name`. */\n  value: T\n  /** When `true`, prevents the user from interacting with the item. */\n  disabled?: boolean\n}\nexport type SelectEvent<T> = CustomEvent<{ originalEvent: PointerEvent, value?: T }>\n\nexport type ListboxItemEmits<T = AcceptableValue> = {\n  /** Event handler called when the selecting item. <br> It can be prevented by calling `event.preventDefault`. */\n  select: [event: SelectEvent<T>]\n}\n\nconst LISTBOX_SELECT = 'listbox.select'\n\ninterface ListboxItemContext {\n  isSelected: Ref<boolean>\n}\n\nexport const [injectListboxItemContext, provideListboxItemContext]\n  = createContext<ListboxItemContext>('ListboxItem')\n</script>\n\n<script setup lang=\"ts\"  generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { type Ref, computed } from 'vue'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { valueComparator } from './utils'\nimport { useCollection } from '@/Collection'\nimport type { AcceptableValue } from '@/shared/types'\n\nconst props = withDefaults(defineProps<ListboxItemProps<T>>(), {\n  as: 'div',\n})\nconst emits = defineEmits<ListboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-listbox-item')\nconst { CollectionItem } = useCollection()\nconst { forwardRef, currentElement } = useForwardExpose()\nconst rootContext = injectListboxRootContext()\n\nconst isHighlighted = computed(() => currentElement.value === rootContext.highlightedElement.value)\nconst isSelected = computed(() => valueComparator(rootContext.modelValue.value, props.value, rootContext.by))\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\n\nasync function handleSelect(ev: SelectEvent<T>) {\n  emits('select', ev)\n  if (ev?.defaultPrevented)\n    return\n\n  if (!disabled.value && ev) {\n    rootContext.onValueChange(props.value)\n    rootContext.changeHighlight(currentElement.value)\n  }\n}\n\nfunction handleSelectCustomEvent(ev: PointerEvent) {\n  const eventDetail = { originalEvent: ev, value: props.value as T }\n  handleAndDispatchCustomEvent(LISTBOX_SELECT, handleSelect, eventDetail)\n}\n\nprovideListboxItemContext({\n  isSelected,\n})\n</script>\n\n<template>\n  <CollectionItem :value=\"value\">\n    <Primitive\n      :id=\"id\"\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      v-memo=\"[isHighlighted, isSelected]\"\n      role=\"option\"\n      :tabindex=\"rootContext.focusable.value ? isHighlighted ? '0' : '-1' : -1\"\n      :aria-selected=\"isSelected\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :disabled=\"disabled ? '' : undefined\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :data-highlighted=\"isHighlighted ? '' : undefined\"\n      :data-state=\"isSelected ? 'checked' : 'unchecked'\"\n      @click=\"handleSelectCustomEvent\"\n      @keydown.space.prevent=\"handleSelectCustomEvent\"\n      @pointermove=\"(event) => {\n        if (rootContext.highlightedElement.value === currentElement)\n          return\n\n        if (rootContext.highlightOnHover.value)\n          rootContext.changeHighlight(currentElement, false)\n        else\n          rootContext.focusable.value ? undefined : rootContext.changeHighlight(currentElement, false)\n      }\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":["createContext","useId","useCollection","useForwardExpose","injectListboxRootContext","computed","valueComparator","handleAndDispatchCustomEvent"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,cAAiB,GAAA,gBAAA;AAMhB,MAAM,CAAC,wBAAA,EAA0B,yBAAyB,CAAA,GAC7DA,mCAAkC,aAAa;;;;;;;;;;;AAWnD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAKC,kBAAM,CAAA,SAAA,EAAW,mBAAmB,CAAA;AAC/C,IAAM,MAAA,EAAE,cAAe,EAAA,GAAIC,mCAAc,EAAA;AACzC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAE7C,IAAA,MAAM,gBAAgBC,YAAS,CAAA,MAAM,eAAe,KAAU,KAAA,WAAA,CAAY,mBAAmB,KAAK,CAAA;AAClG,IAAM,MAAA,UAAA,GAAaA,YAAS,CAAA,MAAMC,6BAAgB,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EAAO,WAAY,CAAA,EAAE,CAAC,CAAA;AAE5G,IAAA,MAAM,WAAWD,YAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAE5E,IAAA,eAAe,aAAa,EAAoB,EAAA;AAC9C,MAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,MAAA,IAAI,EAAI,EAAA,gBAAA;AACN,QAAA;AAEF,MAAI,IAAA,CAAC,QAAS,CAAA,KAAA,IAAS,EAAI,EAAA;AACzB,QAAY,WAAA,CAAA,aAAA,CAAc,MAAM,KAAK,CAAA;AACrC,QAAY,WAAA,CAAA,eAAA,CAAgB,eAAe,KAAK,CAAA;AAAA;AAClD;AAGF,IAAA,SAAS,wBAAwB,EAAkB,EAAA;AACjD,MAAA,MAAM,cAAc,EAAE,aAAA,EAAe,EAAI,EAAA,KAAA,EAAO,MAAM,KAAW,EAAA;AACjE,MAA6BE,gEAAA,CAAA,cAAA,EAAgB,cAAc,WAAW,CAAA;AAAA;AAGxE,IAA0B,yBAAA,CAAA;AAAA,MACxB;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListboxItem.cjs","sources":["../../src/Listbox/ListboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { createContext, handleAndDispatchCustomEvent, useForwardExpose, useId } from '@/shared'\n\nexport interface ListboxItemProps<T = AcceptableValue> extends PrimitiveProps {\n  /** The value given as data when submitted with a `name`. */\n  value: T\n  /** When `true`, prevents the user from interacting with the item. */\n  disabled?: boolean\n}\nexport type SelectEvent<T> = CustomEvent<{ originalEvent: PointerEvent, value?: T }>\n\nexport type ListboxItemEmits<T = AcceptableValue> = {\n  /** Event handler called when the selecting item. <br> It can be prevented by calling `event.preventDefault`. */\n  select: [event: SelectEvent<T>]\n}\n\nconst LISTBOX_SELECT = 'listbox.select'\n\ninterface ListboxItemContext {\n  isSelected: Ref<boolean>\n}\n\nexport const [injectListboxItemContext, provideListboxItemContext]\n  = createContext<ListboxItemContext>('ListboxItem')\n</script>\n\n<script setup lang=\"ts\"  generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { type Ref, computed } from 'vue'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { valueComparator } from './utils'\nimport { useCollection } from '@/Collection'\nimport type { AcceptableValue } from '@/shared/types'\n\nconst props = withDefaults(defineProps<ListboxItemProps<T>>(), {\n  as: 'div',\n})\nconst emits = defineEmits<ListboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-listbox-item')\nconst { CollectionItem } = useCollection()\nconst { forwardRef, currentElement } = useForwardExpose()\nconst rootContext = injectListboxRootContext()\n\nconst isHighlighted = computed(() => currentElement.value === rootContext.highlightedElement.value)\nconst isSelected = computed(() => valueComparator(rootContext.modelValue.value, props.value, rootContext.by))\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\n\nasync function handleSelect(ev: SelectEvent<T>) {\n  emits('select', ev)\n  if (ev?.defaultPrevented)\n    return\n\n  if (!disabled.value && ev) {\n    rootContext.onValueChange(props.value)\n    rootContext.changeHighlight(currentElement.value)\n  }\n}\n\nfunction handleSelectCustomEvent(ev: PointerEvent) {\n  const eventDetail = { originalEvent: ev, value: props.value as T }\n  handleAndDispatchCustomEvent(LISTBOX_SELECT, handleSelect, eventDetail)\n}\n\nprovideListboxItemContext({\n  isSelected,\n})\n</script>\n\n<template>\n  <CollectionItem :value=\"value\">\n    <Primitive\n      :id=\"id\"\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      v-memo=\"[isHighlighted, isSelected]\"\n      role=\"option\"\n      :tabindex=\"rootContext.focusable.value ? isHighlighted ? '0' : '-1' : -1\"\n      :aria-selected=\"isSelected\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :disabled=\"disabled ? '' : undefined\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :data-highlighted=\"isHighlighted ? '' : undefined\"\n      :data-state=\"isSelected ? 'checked' : 'unchecked'\"\n      @click=\"handleSelectCustomEvent\"\n      @keydown.space.prevent=\"handleSelectCustomEvent\"\n      @pointermove=\"(event) => {\n        if (rootContext.highlightedElement.value === currentElement)\n          return\n\n        if (rootContext.highlightOnHover.value)\n          rootContext.changeHighlight(currentElement, false)\n        else\n          rootContext.focusable.value ? undefined : rootContext.changeHighlight(currentElement, false)\n      }\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":["createContext","useId","useCollection","useForwardExpose","injectListboxRootContext","computed","valueComparator","handleAndDispatchCustomEvent"],"mappings":";;;;;;;;;;;;;AAgBA,MAAM,cAAiB,GAAA,gBAAA;AAMhB,MAAM,CAAC,wBAAA,EAA0B,yBAAyB,CAAA,GAC7DA,mCAAkC,aAAa;;;;;;;;;;;AAWnD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAKC,kBAAM,CAAA,MAAA,EAAW,mBAAmB,CAAA;AAC/C,IAAM,MAAA,EAAE,cAAe,EAAA,GAAIC,mCAAc,EAAA;AACzC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AACxD,IAAA,MAAM,cAAcC,4CAAyB,EAAA;AAE7C,IAAA,MAAM,gBAAgBC,YAAS,CAAA,MAAM,eAAe,KAAU,KAAA,WAAA,CAAY,mBAAmB,KAAK,CAAA;AAClG,IAAM,MAAA,UAAA,GAAaA,YAAS,CAAA,MAAMC,6BAAgB,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EAAO,WAAY,CAAA,EAAE,CAAC,CAAA;AAE5G,IAAA,MAAM,WAAWD,YAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAE5E,IAAA,eAAe,aAAa,EAAoB,EAAA;AAC9C,MAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,MAAA,IAAI,EAAI,EAAA,gBAAA;AACN,QAAA;AAEF,MAAI,IAAA,CAAC,QAAS,CAAA,KAAA,IAAS,EAAI,EAAA;AACzB,QAAY,WAAA,CAAA,aAAA,CAAc,MAAM,KAAK,CAAA;AACrC,QAAY,WAAA,CAAA,eAAA,CAAgB,eAAe,KAAK,CAAA;AAAA;AAClD;AAGF,IAAA,SAAS,wBAAwB,EAAkB,EAAA;AACjD,MAAA,MAAM,cAAc,EAAE,aAAA,EAAe,EAAI,EAAA,KAAA,EAAO,MAAM,KAAW,EAAA;AACjE,MAA6BE,gEAAA,CAAA,cAAA,EAAgB,cAAc,WAAW,CAAA;AAAA;AAGxE,IAA0B,yBAAA,CAAA;AAAA,MACxB;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Listbox/ListboxItem.js

@@ -1,11 +1,11 @@
-import { defineComponent, computed, openBlock, createBlock, unref, withCtx, withMemo, createVNode, mergeProps, withKeys, withModifiers, renderSlot } from 'vue';
+import { defineComponent, computed, createBlock, openBlock, unref, withCtx, withMemo, createVNode, mergeProps, withKeys, withModifiers, renderSlot } from 'vue';
 import '@floating-ui/vue';
 import { v as valueComparator } from './utils.js';
 import { u as useCollection } from '../Collection/Collection.js';
+import { c as createContext } from '../shared/createContext.js';
 import { u as useId } from '../shared/useId.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
-import { c as createContext } from '../shared/createContext.js';
 import { h as handleAndDispatchCustomEvent } from '../shared/handleAndDispatchCustomEvent.js';
 import { i as injectListboxRootContext } from './ListboxRoot.js';
 
@@ -23,7 +23,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props, { emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const id = useId(undefined, "reka-listbox-item");
+    const id = useId(void 0, "reka-listbox-item");
     const { CollectionItem } = useCollection();
     const { forwardRef, currentElement } = useForwardExpose();
     const rootContext = injectListboxRootContext();
@@ -56,9 +56,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             "aria-selected": isSelected.value,
             as: _ctx.as,
             "as-child": _ctx.asChild,
-            disabled: disabled.value ? "" : undefined,
-            "data-disabled": disabled.value ? "" : undefined,
-            "data-highlighted": isHighlighted.value ? "" : undefined,
+            disabled: disabled.value ? "" : void 0,
+            "data-disabled": disabled.value ? "" : void 0,
+            "data-highlighted": isHighlighted.value ? "" : void 0,
             "data-state": isSelected.value ? "checked" : "unchecked",
             onClick: handleSelectCustomEvent,
             onKeydown: withKeys(withModifiers(handleSelectCustomEvent, ["prevent"]), ["space"]),
@@ -68,7 +68,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               if (unref(rootContext).highlightOnHover.value)
                 unref(rootContext).changeHighlight(unref(currentElement), false);
               else
-                unref(rootContext).focusable.value ? undefined : unref(rootContext).changeHighlight(unref(currentElement), false);
+                unref(rootContext).focusable.value ? void 0 : unref(rootContext).changeHighlight(unref(currentElement), false);
             })
           }), {
             default: withCtx(() => [

package/dist/Listbox/ListboxItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListboxItem.js","sources":["../../src/Listbox/ListboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { createContext, handleAndDispatchCustomEvent, useForwardExpose, useId } from '@/shared'\n\nexport interface ListboxItemProps<T = AcceptableValue> extends PrimitiveProps {\n  /** The value given as data when submitted with a `name`. */\n  value: T\n  /** When `true`, prevents the user from interacting with the item. */\n  disabled?: boolean\n}\nexport type SelectEvent<T> = CustomEvent<{ originalEvent: PointerEvent, value?: T }>\n\nexport type ListboxItemEmits<T = AcceptableValue> = {\n  /** Event handler called when the selecting item. <br> It can be prevented by calling `event.preventDefault`. */\n  select: [event: SelectEvent<T>]\n}\n\nconst LISTBOX_SELECT = 'listbox.select'\n\ninterface ListboxItemContext {\n  isSelected: Ref<boolean>\n}\n\nexport const [injectListboxItemContext, provideListboxItemContext]\n  = createContext<ListboxItemContext>('ListboxItem')\n</script>\n\n<script setup lang=\"ts\"  generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { type Ref, computed } from 'vue'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { valueComparator } from './utils'\nimport { useCollection } from '@/Collection'\nimport type { AcceptableValue } from '@/shared/types'\n\nconst props = withDefaults(defineProps<ListboxItemProps<T>>(), {\n  as: 'div',\n})\nconst emits = defineEmits<ListboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-listbox-item')\nconst { CollectionItem } = useCollection()\nconst { forwardRef, currentElement } = useForwardExpose()\nconst rootContext = injectListboxRootContext()\n\nconst isHighlighted = computed(() => currentElement.value === rootContext.highlightedElement.value)\nconst isSelected = computed(() => valueComparator(rootContext.modelValue.value, props.value, rootContext.by))\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\n\nasync function handleSelect(ev: SelectEvent<T>) {\n  emits('select', ev)\n  if (ev?.defaultPrevented)\n    return\n\n  if (!disabled.value && ev) {\n    rootContext.onValueChange(props.value)\n    rootContext.changeHighlight(currentElement.value)\n  }\n}\n\nfunction handleSelectCustomEvent(ev: PointerEvent) {\n  const eventDetail = { originalEvent: ev, value: props.value as T }\n  handleAndDispatchCustomEvent(LISTBOX_SELECT, handleSelect, eventDetail)\n}\n\nprovideListboxItemContext({\n  isSelected,\n})\n</script>\n\n<template>\n  <CollectionItem :value=\"value\">\n    <Primitive\n      :id=\"id\"\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      v-memo=\"[isHighlighted, isSelected]\"\n      role=\"option\"\n      :tabindex=\"rootContext.focusable.value ? isHighlighted ? '0' : '-1' : -1\"\n      :aria-selected=\"isSelected\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :disabled=\"disabled ? '' : undefined\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :data-highlighted=\"isHighlighted ? '' : undefined\"\n      :data-state=\"isSelected ? 'checked' : 'unchecked'\"\n      @click=\"handleSelectCustomEvent\"\n      @keydown.space.prevent=\"handleSelectCustomEvent\"\n      @pointermove=\"(event) => {\n        if (rootContext.highlightedElement.value === currentElement)\n          return\n\n        if (rootContext.highlightOnHover.value)\n          rootContext.changeHighlight(currentElement, false)\n        else\n          rootContext.focusable.value ? undefined : rootContext.changeHighlight(currentElement, false)\n      }\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;AAgBA,MAAM,cAAiB,GAAA,gBAAA;AAMhB,MAAM,CAAC,wBAAA,EAA0B,yBAAyB,CAAA,GAC7D,cAAkC,aAAa;;;;;;;;;;;AAWnD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,SAAA,EAAW,mBAAmB,CAAA;AAC/C,IAAM,MAAA,EAAE,cAAe,EAAA,GAAI,aAAc,EAAA;AACzC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AACxD,IAAA,MAAM,cAAc,wBAAyB,EAAA;AAE7C,IAAA,MAAM,gBAAgB,QAAS,CAAA,MAAM,eAAe,KAAU,KAAA,WAAA,CAAY,mBAAmB,KAAK,CAAA;AAClG,IAAM,MAAA,UAAA,GAAa,QAAS,CAAA,MAAM,eAAgB,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EAAO,WAAY,CAAA,EAAE,CAAC,CAAA;AAE5G,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAE5E,IAAA,eAAe,aAAa,EAAoB,EAAA;AAC9C,MAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,MAAA,IAAI,EAAI,EAAA,gBAAA;AACN,QAAA;AAEF,MAAI,IAAA,CAAC,QAAS,CAAA,KAAA,IAAS,EAAI,EAAA;AACzB,QAAY,WAAA,CAAA,aAAA,CAAc,MAAM,KAAK,CAAA;AACrC,QAAY,WAAA,CAAA,eAAA,CAAgB,eAAe,KAAK,CAAA;AAAA;AAClD;AAGF,IAAA,SAAS,wBAAwB,EAAkB,EAAA;AACjD,MAAA,MAAM,cAAc,EAAE,aAAA,EAAe,EAAI,EAAA,KAAA,EAAO,MAAM,KAAW,EAAA;AACjE,MAA6B,4BAAA,CAAA,cAAA,EAAgB,cAAc,WAAW,CAAA;AAAA;AAGxE,IAA0B,yBAAA,CAAA;AAAA,MACxB;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"ListboxItem.js","sources":["../../src/Listbox/ListboxItem.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { createContext, handleAndDispatchCustomEvent, useForwardExpose, useId } from '@/shared'\n\nexport interface ListboxItemProps<T = AcceptableValue> extends PrimitiveProps {\n  /** The value given as data when submitted with a `name`. */\n  value: T\n  /** When `true`, prevents the user from interacting with the item. */\n  disabled?: boolean\n}\nexport type SelectEvent<T> = CustomEvent<{ originalEvent: PointerEvent, value?: T }>\n\nexport type ListboxItemEmits<T = AcceptableValue> = {\n  /** Event handler called when the selecting item. <br> It can be prevented by calling `event.preventDefault`. */\n  select: [event: SelectEvent<T>]\n}\n\nconst LISTBOX_SELECT = 'listbox.select'\n\ninterface ListboxItemContext {\n  isSelected: Ref<boolean>\n}\n\nexport const [injectListboxItemContext, provideListboxItemContext]\n  = createContext<ListboxItemContext>('ListboxItem')\n</script>\n\n<script setup lang=\"ts\"  generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { injectListboxRootContext } from './ListboxRoot.vue'\nimport { type Ref, computed } from 'vue'\nimport { Primitive, type PrimitiveProps } from '..'\nimport { valueComparator } from './utils'\nimport { useCollection } from '@/Collection'\nimport type { AcceptableValue } from '@/shared/types'\n\nconst props = withDefaults(defineProps<ListboxItemProps<T>>(), {\n  as: 'div',\n})\nconst emits = defineEmits<ListboxItemEmits<T>>()\n\nconst id = useId(undefined, 'reka-listbox-item')\nconst { CollectionItem } = useCollection()\nconst { forwardRef, currentElement } = useForwardExpose()\nconst rootContext = injectListboxRootContext()\n\nconst isHighlighted = computed(() => currentElement.value === rootContext.highlightedElement.value)\nconst isSelected = computed(() => valueComparator(rootContext.modelValue.value, props.value, rootContext.by))\n\nconst disabled = computed(() => rootContext.disabled.value || props.disabled)\n\nasync function handleSelect(ev: SelectEvent<T>) {\n  emits('select', ev)\n  if (ev?.defaultPrevented)\n    return\n\n  if (!disabled.value && ev) {\n    rootContext.onValueChange(props.value)\n    rootContext.changeHighlight(currentElement.value)\n  }\n}\n\nfunction handleSelectCustomEvent(ev: PointerEvent) {\n  const eventDetail = { originalEvent: ev, value: props.value as T }\n  handleAndDispatchCustomEvent(LISTBOX_SELECT, handleSelect, eventDetail)\n}\n\nprovideListboxItemContext({\n  isSelected,\n})\n</script>\n\n<template>\n  <CollectionItem :value=\"value\">\n    <Primitive\n      :id=\"id\"\n      v-bind=\"$attrs\"\n      :ref=\"forwardRef\"\n      v-memo=\"[isHighlighted, isSelected]\"\n      role=\"option\"\n      :tabindex=\"rootContext.focusable.value ? isHighlighted ? '0' : '-1' : -1\"\n      :aria-selected=\"isSelected\"\n      :as=\"as\"\n      :as-child=\"asChild\"\n      :disabled=\"disabled ? '' : undefined\"\n      :data-disabled=\"disabled ? '' : undefined\"\n      :data-highlighted=\"isHighlighted ? '' : undefined\"\n      :data-state=\"isSelected ? 'checked' : 'unchecked'\"\n      @click=\"handleSelectCustomEvent\"\n      @keydown.space.prevent=\"handleSelectCustomEvent\"\n      @pointermove=\"(event) => {\n        if (rootContext.highlightedElement.value === currentElement)\n          return\n\n        if (rootContext.highlightOnHover.value)\n          rootContext.changeHighlight(currentElement, false)\n        else\n          rootContext.focusable.value ? undefined : rootContext.changeHighlight(currentElement, false)\n      }\"\n    >\n      <slot />\n    </Primitive>\n  </CollectionItem>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;AAgBA,MAAM,cAAiB,GAAA,gBAAA;AAMhB,MAAM,CAAC,wBAAA,EAA0B,yBAAyB,CAAA,GAC7D,cAAkC,aAAa;;;;;;;;;;;AAWnD,IAAA,MAAM,KAAQ,GAAA,OAAA;AAGd,IAAA,MAAM,KAAQ,GAAA,MAAA;AAEd,IAAM,MAAA,EAAA,GAAK,KAAM,CAAA,MAAA,EAAW,mBAAmB,CAAA;AAC/C,IAAM,MAAA,EAAE,cAAe,EAAA,GAAI,aAAc,EAAA;AACzC,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AACxD,IAAA,MAAM,cAAc,wBAAyB,EAAA;AAE7C,IAAA,MAAM,gBAAgB,QAAS,CAAA,MAAM,eAAe,KAAU,KAAA,WAAA,CAAY,mBAAmB,KAAK,CAAA;AAClG,IAAM,MAAA,UAAA,GAAa,QAAS,CAAA,MAAM,eAAgB,CAAA,WAAA,CAAY,UAAW,CAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EAAO,WAAY,CAAA,EAAE,CAAC,CAAA;AAE5G,IAAA,MAAM,WAAW,QAAS,CAAA,MAAM,YAAY,QAAS,CAAA,KAAA,IAAS,MAAM,QAAQ,CAAA;AAE5E,IAAA,eAAe,aAAa,EAAoB,EAAA;AAC9C,MAAA,KAAA,CAAM,UAAU,EAAE,CAAA;AAClB,MAAA,IAAI,EAAI,EAAA,gBAAA;AACN,QAAA;AAEF,MAAI,IAAA,CAAC,QAAS,CAAA,KAAA,IAAS,EAAI,EAAA;AACzB,QAAY,WAAA,CAAA,aAAA,CAAc,MAAM,KAAK,CAAA;AACrC,QAAY,WAAA,CAAA,eAAA,CAAgB,eAAe,KAAK,CAAA;AAAA;AAClD;AAGF,IAAA,SAAS,wBAAwB,EAAkB,EAAA;AACjD,MAAA,MAAM,cAAc,EAAE,aAAA,EAAe,EAAI,EAAA,KAAA,EAAO,MAAM,KAAW,EAAA;AACjE,MAA6B,4BAAA,CAAA,cAAA,EAAgB,cAAc,WAAW,CAAA;AAAA;AAGxE,IAA0B,yBAAA,CAAA;AAAA,MACxB;AAAA,KACD,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Listbox/ListboxItemIndicator.js

@@ -1,4 +1,4 @@
-import { defineComponent, unref, openBlock, createBlock, mergeProps, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { defineComponent, createBlock, createCommentVNode, unref, openBlock, mergeProps, withCtx, renderSlot } from 'vue';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { i as injectListboxItemContext } from './ListboxItem.js';
 import { P as Primitive } from '../Primitive/Primitive.js';

package/dist/Listbox/ListboxRoot.cjs

@@ -10,11 +10,11 @@ const shared_useTypeahead = require('../shared/useTypeahead.cjs');
 const Primitive_usePrimitiveElement = require('../Primitive/usePrimitiveElement.cjs');
 const shared_useDirection = require('../shared/useDirection.cjs');
 const shared_useFormControl = require('../shared/useFormControl.cjs');
+const shared_createContext = require('../shared/createContext.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
 const VisuallyHidden_VisuallyHiddenInput = require('../VisuallyHidden/VisuallyHiddenInput.cjs');
-const shared_createContext = require('../shared/createContext.cjs');
-const shared_arrays = require('../shared/arrays.cjs');
 const shared_useKbd = require('../shared/useKbd.cjs');
+const shared_arrays = require('../shared/arrays.cjs');
 
 const [injectListboxRootContext, provideListboxRootContext] = shared_createContext.createContext("ListboxRoot");
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
@@ -49,8 +49,8 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
     const isUserAction = vue.ref(false);
     const focusable = vue.ref(true);
     const modelValue = core.useVModel(props, "modelValue", emits, {
-      defaultValue: props.defaultValue ?? (multiple.value ? [] : undefined),
-      passive: props.modelValue === undefined,
+      defaultValue: props.defaultValue ?? (multiple.value ? [] : void 0),
+      passive: props.modelValue === void 0,
       deep: true
     });
     function onValueChange(val) {
@@ -68,7 +68,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
       } else {
         if (props.selectionBehavior === "toggle") {
           if (Listbox_utils.compare(modelValue.value, val, props.by))
-            modelValue.value = undefined;
+            modelValue.value = void 0;
           else
             modelValue.value = val;
         } else {
@@ -283,7 +283,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
         as: _ctx.as,
         "as-child": _ctx.asChild,
         dir: vue.unref(dir),
-        "data-disabled": vue.unref(disabled) ? "" : undefined,
+        "data-disabled": vue.unref(disabled) ? "" : void 0,
         onPointerleave: onLeave,
         onFocusout: _cache[0] || (_cache[0] = async (event) => {
           const target = event.relatedTarget || event.target;