reka-ui 2.2.0 → 2.2.1

package/dist/Select/SelectItemAlignedPosition.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItemAlignedPosition.cjs","sources":["../../src/Select/SelectItemAlignedPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { clamp, createContext, useForwardExpose } from '@/shared'\nimport { useCollection } from '@/Collection'\nimport { useResizeObserver } from '@vueuse/core'\n\ninterface SelectItemAlignedPositionContext {\n  contentWrapper?: Ref<HTMLElement | undefined>\n  shouldExpandOnScrollRef?: Ref<boolean>\n  onScrollButtonChange: (node: HTMLElement | undefined) => void\n}\n\nexport interface SelectItemAlignedPositionProps extends PrimitiveProps {}\n\nexport const [injectSelectItemAlignedPositionContext, provideSelectItemAlignedPositionContext]\n  = createContext<SelectItemAlignedPositionContext>('SelectItemAlignedPosition')\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted, ref } from 'vue'\nimport { injectSelectRootContext } from './SelectRoot.vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { CONTENT_MARGIN } from './utils'\nimport { Primitive } from '@/Primitive'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<SelectItemAlignedPositionProps>()\nconst emits = defineEmits<{\n  placed: []\n}>()\n\nconst { getItems } = useCollection()\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\n\nconst shouldExpandOnScrollRef = ref(false)\nconst shouldRepositionRef = ref(true)\n\nconst contentWrapperElement = ref<HTMLElement>()\nconst { forwardRef, currentElement: contentElement } = useForwardExpose()\n\nconst { viewport, selectedItem, selectedItemText, focusSelectedItem }\n  = contentContext!\n\nfunction position() {\n  if (\n    rootContext.triggerElement.value\n    && rootContext.valueElement.value\n    && contentWrapperElement.value\n    && contentElement.value\n    && viewport?.value\n    && selectedItem?.value\n    && selectedItemText?.value\n  ) {\n    const triggerRect = rootContext.triggerElement.value.getBoundingClientRect()\n\n    // -----------------------------------------------------------------------------------------\n    //  Horizontal positioning\n    // -----------------------------------------------------------------------------------------\n    const contentRect = contentElement.value.getBoundingClientRect()\n    const valueNodeRect = rootContext.valueElement.value.getBoundingClientRect()\n    const itemTextRect = selectedItemText.value.getBoundingClientRect()\n\n    if (rootContext.dir.value !== 'rtl') {\n      const itemTextOffset = itemTextRect.left - contentRect.left\n      const left = valueNodeRect.left - itemTextOffset\n      const leftDelta = triggerRect.left - left\n      const minContentWidth = triggerRect.width + leftDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const rightEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedLeft = clamp(left, CONTENT_MARGIN, Math.max(CONTENT_MARGIN, rightEdge - contentWidth))\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.left = `${clampedLeft}px`\n    }\n    else {\n      const itemTextOffset = contentRect.right - itemTextRect.right\n      const right = window.innerWidth - valueNodeRect.right - itemTextOffset\n      const rightDelta = window.innerWidth - triggerRect.right - right\n      const minContentWidth = triggerRect.width + rightDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const leftEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedRight = clamp(\n        right,\n        CONTENT_MARGIN,\n        Math.max(CONTENT_MARGIN, leftEdge - contentWidth),\n      )\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.right = `${clampedRight}px`\n    }\n\n    // -----------------------------------------------------------------------------------------\n    // Vertical positioning\n    // -----------------------------------------------------------------------------------------\n    const items = getItems().map(i => i.ref)\n    const availableHeight = window.innerHeight - CONTENT_MARGIN * 2\n    const itemsHeight = viewport.value.scrollHeight\n\n    const contentStyles = window.getComputedStyle(contentElement.value)\n    const contentBorderTopWidth = Number.parseInt(\n      contentStyles.borderTopWidth,\n      10,\n    )\n    const contentPaddingTop = Number.parseInt(contentStyles.paddingTop, 10)\n    const contentBorderBottomWidth = Number.parseInt(\n      contentStyles.borderBottomWidth,\n      10,\n    )\n    const contentPaddingBottom = Number.parseInt(\n      contentStyles.paddingBottom,\n      10,\n    )\n\n    const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth\n    const minContentHeight = Math.min(\n      selectedItem.value.offsetHeight * 5,\n      fullContentHeight,\n    )\n\n    const viewportStyles = window.getComputedStyle(viewport.value)\n    const viewportPaddingTop = Number.parseInt(viewportStyles.paddingTop, 10)\n    const viewportPaddingBottom = Number.parseInt(\n      viewportStyles.paddingBottom,\n      10,\n    )\n\n    const topEdgeToTriggerMiddle\n      = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN\n    const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle\n\n    const selectedItemHalfHeight = selectedItem.value.offsetHeight / 2\n    const itemOffsetMiddle\n      = selectedItem.value.offsetTop + selectedItemHalfHeight\n    const contentTopToItemMiddle\n      = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle\n    const itemMiddleToContentBottom\n      = fullContentHeight - contentTopToItemMiddle\n\n    const willAlignWithoutTopOverflow\n      = contentTopToItemMiddle <= topEdgeToTriggerMiddle\n\n    if (willAlignWithoutTopOverflow) {\n      const isLastItem = selectedItem.value === items[items.length - 1]\n      contentWrapperElement.value.style.bottom = `${0}px`\n      const viewportOffsetBottom\n        = contentElement.value.clientHeight\n        - viewport.value.offsetTop\n        - viewport.value.offsetHeight\n      const clampedTriggerMiddleToBottomEdge = Math.max(\n        triggerMiddleToBottomEdge,\n        selectedItemHalfHeight\n        // viewport might have padding bottom, include it to avoid a scrollable viewport\n        + (isLastItem ? viewportPaddingBottom : 0)\n        + viewportOffsetBottom\n        + contentBorderBottomWidth,\n      )\n      const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge\n      contentWrapperElement.value.style.height = `${height}px`\n    }\n    else {\n      const isFirstItem = selectedItem.value === items[0]\n      contentWrapperElement.value.style.top = `${0}px`\n      const clampedTopEdgeToTriggerMiddle = Math.max(\n        topEdgeToTriggerMiddle,\n        contentBorderTopWidth\n        + viewport.value.offsetTop\n        // viewport might have padding top, include it to avoid a scrollable viewport\n        + (isFirstItem ? viewportPaddingTop : 0)\n        + selectedItemHalfHeight,\n      )\n      const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom\n      contentWrapperElement.value.style.height = `${height}px`\n      viewport.value.scrollTop\n        = contentTopToItemMiddle\n        - topEdgeToTriggerMiddle\n        + viewport.value.offsetTop\n    }\n\n    contentWrapperElement.value.style.margin = `${CONTENT_MARGIN}px 0`\n    contentWrapperElement.value.style.minHeight = `${minContentHeight}px`\n    contentWrapperElement.value.style.maxHeight = `${availableHeight}px`\n    // -----------------------------------------------------------------------------------------\n\n    emits('placed')\n\n    // we don't want the initial scroll position adjustment to trigger \"expand on scroll\"\n    // so we explicitly turn it on only after they've registered.\n    requestAnimationFrame(() => (shouldExpandOnScrollRef.value = true))\n  }\n}\n\n// copy z-index from content to wrapper\nconst contentZIndex = ref('')\n\nonMounted(async () => {\n  await nextTick()\n  position()\n  if (contentElement.value)\n    contentZIndex.value = window.getComputedStyle(contentElement.value).zIndex\n})\n\n// When the viewport becomes scrollable at the top, the scroll up button will mount.\n// Because it is part of the normal flow, it will push down the viewport, thus throwing our\n// trigger => selectedItem alignment off by the amount the viewport was pushed down.\n// We wait for this to happen and then re-run the positining logic one more time to account for it.\nfunction handleScrollButtonChange(node: HTMLElement | undefined) {\n  if (node && shouldRepositionRef.value === true) {\n    position()\n    focusSelectedItem?.()\n    shouldRepositionRef.value = false\n  }\n}\n\n// Resize and position when trigger element changes\nuseResizeObserver(rootContext.triggerElement, () => {\n  position()\n})\n\nprovideSelectItemAlignedPositionContext({\n  contentWrapper: contentWrapperElement,\n  shouldExpandOnScrollRef,\n  onScrollButtonChange: handleScrollButtonChange,\n})\n</script>\n\n<template>\n  <div\n    ref=\"contentWrapperElement\"\n    :style=\"{\n      display: 'flex',\n      flexDirection: 'column',\n      position: 'fixed',\n      zIndex: contentZIndex,\n    }\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      :style=\"{\n        // When we get the height of the content, it includes borders. If we were to set\n        // the height without having `boxSizing: 'border-box'` it would be too big.\n        boxSizing: 'border-box',\n        // We need to ensure the content doesn't get taller than the wrapper\n        maxHeight: '100%',\n      }\"\n      v-bind=\"{ ...$attrs, ...props }\"\n    >\n      <slot />\n    </Primitive>\n  </div>\n</template>\n"],"names":["createContext","useCollection","injectSelectRootContext","injectSelectContentContext","ref","useForwardExpose","CONTENT_MARGIN","clamp","onMounted","nextTick","useResizeObserver"],"mappings":"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"}
+{"version":3,"file":"SelectItemAlignedPosition.cjs","sources":["../../src/Select/SelectItemAlignedPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport { useCollection } from '@/Collection'\nimport { clamp, createContext, useForwardExpose } from '@/shared'\nimport { useResizeObserver } from '@vueuse/core'\n\ninterface SelectItemAlignedPositionContext {\n  contentWrapper?: Ref<HTMLElement | undefined>\n  shouldExpandOnScrollRef?: Ref<boolean>\n  onScrollButtonChange: (node: HTMLElement | undefined) => void\n}\n\nexport interface SelectItemAlignedPositionProps extends PrimitiveProps {}\n\nexport const [injectSelectItemAlignedPositionContext, provideSelectItemAlignedPositionContext]\n  = createContext<SelectItemAlignedPositionContext>('SelectItemAlignedPosition')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { nextTick, onMounted, ref } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectRootContext } from './SelectRoot.vue'\nimport { CONTENT_MARGIN } from './utils'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<SelectItemAlignedPositionProps>()\nconst emits = defineEmits<{\n  placed: []\n}>()\n\nconst { getItems } = useCollection()\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\n\nconst shouldExpandOnScrollRef = ref(false)\nconst shouldRepositionRef = ref(true)\n\nconst contentWrapperElement = ref<HTMLElement>()\nconst { forwardRef, currentElement: contentElement } = useForwardExpose()\n\nconst { viewport, selectedItem, selectedItemText, focusSelectedItem }\n  = contentContext!\n\nfunction position() {\n  if (\n    rootContext.triggerElement.value\n    && rootContext.valueElement.value\n    && contentWrapperElement.value\n    && contentElement.value\n    && viewport?.value\n    && selectedItem?.value\n    && selectedItemText?.value\n  ) {\n    const triggerRect = rootContext.triggerElement.value.getBoundingClientRect()\n\n    // -----------------------------------------------------------------------------------------\n    //  Horizontal positioning\n    // -----------------------------------------------------------------------------------------\n    const contentRect = contentElement.value.getBoundingClientRect()\n    const valueNodeRect = rootContext.valueElement.value.getBoundingClientRect()\n    const itemTextRect = selectedItemText.value.getBoundingClientRect()\n\n    if (rootContext.dir.value !== 'rtl') {\n      const itemTextOffset = itemTextRect.left - contentRect.left\n      const left = valueNodeRect.left - itemTextOffset\n      const leftDelta = triggerRect.left - left\n      const minContentWidth = triggerRect.width + leftDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const rightEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedLeft = clamp(left, CONTENT_MARGIN, Math.max(CONTENT_MARGIN, rightEdge - contentWidth))\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.left = `${clampedLeft}px`\n    }\n    else {\n      const itemTextOffset = contentRect.right - itemTextRect.right\n      const right = window.innerWidth - valueNodeRect.right - itemTextOffset\n      const rightDelta = window.innerWidth - triggerRect.right - right\n      const minContentWidth = triggerRect.width + rightDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const leftEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedRight = clamp(\n        right,\n        CONTENT_MARGIN,\n        Math.max(CONTENT_MARGIN, leftEdge - contentWidth),\n      )\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.right = `${clampedRight}px`\n    }\n\n    // -----------------------------------------------------------------------------------------\n    // Vertical positioning\n    // -----------------------------------------------------------------------------------------\n    const items = getItems().map(i => i.ref)\n    const availableHeight = window.innerHeight - CONTENT_MARGIN * 2\n    const itemsHeight = viewport.value.scrollHeight\n\n    const contentStyles = window.getComputedStyle(contentElement.value)\n    const contentBorderTopWidth = Number.parseInt(\n      contentStyles.borderTopWidth,\n      10,\n    )\n    const contentPaddingTop = Number.parseInt(contentStyles.paddingTop, 10)\n    const contentBorderBottomWidth = Number.parseInt(\n      contentStyles.borderBottomWidth,\n      10,\n    )\n    const contentPaddingBottom = Number.parseInt(\n      contentStyles.paddingBottom,\n      10,\n    )\n\n    const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth\n    const minContentHeight = Math.min(\n      selectedItem.value.offsetHeight * 5,\n      fullContentHeight,\n    )\n\n    const viewportStyles = window.getComputedStyle(viewport.value)\n    const viewportPaddingTop = Number.parseInt(viewportStyles.paddingTop, 10)\n    const viewportPaddingBottom = Number.parseInt(\n      viewportStyles.paddingBottom,\n      10,\n    )\n\n    const topEdgeToTriggerMiddle\n      = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN\n    const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle\n\n    const selectedItemHalfHeight = selectedItem.value.offsetHeight / 2\n    const itemOffsetMiddle\n      = selectedItem.value.offsetTop + selectedItemHalfHeight\n    const contentTopToItemMiddle\n      = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle\n    const itemMiddleToContentBottom\n      = fullContentHeight - contentTopToItemMiddle\n\n    const willAlignWithoutTopOverflow\n      = contentTopToItemMiddle <= topEdgeToTriggerMiddle\n\n    if (willAlignWithoutTopOverflow) {\n      const isLastItem = selectedItem.value === items[items.length - 1]\n      contentWrapperElement.value.style.bottom = `${0}px`\n      const viewportOffsetBottom\n        = contentElement.value.clientHeight\n          - viewport.value.offsetTop\n          - viewport.value.offsetHeight\n      const clampedTriggerMiddleToBottomEdge = Math.max(\n        triggerMiddleToBottomEdge,\n        selectedItemHalfHeight\n        // viewport might have padding bottom, include it to avoid a scrollable viewport\n        + (isLastItem ? viewportPaddingBottom : 0)\n        + viewportOffsetBottom\n        + contentBorderBottomWidth,\n      )\n      const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge\n      contentWrapperElement.value.style.height = `${height}px`\n    }\n    else {\n      const isFirstItem = selectedItem.value === items[0]\n      contentWrapperElement.value.style.top = `${0}px`\n      const clampedTopEdgeToTriggerMiddle = Math.max(\n        topEdgeToTriggerMiddle,\n        contentBorderTopWidth\n        + viewport.value.offsetTop\n        // viewport might have padding top, include it to avoid a scrollable viewport\n        + (isFirstItem ? viewportPaddingTop : 0)\n        + selectedItemHalfHeight,\n      )\n      const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom\n      contentWrapperElement.value.style.height = `${height}px`\n      viewport.value.scrollTop\n        = contentTopToItemMiddle\n          - topEdgeToTriggerMiddle\n          + viewport.value.offsetTop\n    }\n\n    contentWrapperElement.value.style.margin = `${CONTENT_MARGIN}px 0`\n    contentWrapperElement.value.style.minHeight = `${minContentHeight}px`\n    contentWrapperElement.value.style.maxHeight = `${availableHeight}px`\n    // -----------------------------------------------------------------------------------------\n\n    emits('placed')\n\n    // we don't want the initial scroll position adjustment to trigger \"expand on scroll\"\n    // so we explicitly turn it on only after they've registered.\n    requestAnimationFrame(() => (shouldExpandOnScrollRef.value = true))\n  }\n}\n\n// copy z-index from content to wrapper\nconst contentZIndex = ref('')\n\nonMounted(async () => {\n  await nextTick()\n  position()\n  if (contentElement.value)\n    contentZIndex.value = window.getComputedStyle(contentElement.value).zIndex\n})\n\n// When the viewport becomes scrollable at the top, the scroll up button will mount.\n// Because it is part of the normal flow, it will push down the viewport, thus throwing our\n// trigger => selectedItem alignment off by the amount the viewport was pushed down.\n// We wait for this to happen and then re-run the positining logic one more time to account for it.\nfunction handleScrollButtonChange(node: HTMLElement | undefined) {\n  if (node && shouldRepositionRef.value === true) {\n    position()\n    focusSelectedItem?.()\n    shouldRepositionRef.value = false\n  }\n}\n\n// Resize and position when trigger element changes\nuseResizeObserver(rootContext.triggerElement, () => {\n  position()\n})\n\nprovideSelectItemAlignedPositionContext({\n  contentWrapper: contentWrapperElement,\n  shouldExpandOnScrollRef,\n  onScrollButtonChange: handleScrollButtonChange,\n})\n</script>\n\n<template>\n  <div\n    ref=\"contentWrapperElement\"\n    :style=\"{\n      display: 'flex',\n      flexDirection: 'column',\n      position: 'fixed',\n      zIndex: contentZIndex,\n    }\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      :style=\"{\n        // When we get the height of the content, it includes borders. If we were to set\n        // the height without having `boxSizing: 'border-box'` it would be too big.\n        boxSizing: 'border-box',\n        // We need to ensure the content doesn't get taller than the wrapper\n        maxHeight: '100%',\n      }\"\n      v-bind=\"{ ...$attrs, ...props }\"\n    >\n      <slot />\n    </Primitive>\n  </div>\n</template>\n"],"names":["createContext","useCollection","injectSelectRootContext","injectSelectContentContext","ref","useForwardExpose","CONTENT_MARGIN","clamp","onMounted","nextTick","useResizeObserver"],"mappings":"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"}

package/dist/Select/SelectItemAlignedPosition.js

@@ -2,11 +2,11 @@ import { defineComponent, ref, onMounted, nextTick, createElementBlock, openBloc
 import { C as CONTENT_MARGIN } from './utils.js';
 import { u as useCollection } from '../Collection/Collection.js';
 import { useResizeObserver } from '@vueuse/core';
+import { i as injectSelectRootContext } from './SelectRoot.js';
 import { i as injectSelectContentContext } from './SelectContentImpl.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { c as createContext } from '../shared/createContext.js';
 import { P as Primitive } from '../Primitive/Primitive.js';
-import { i as injectSelectRootContext } from './SelectRoot.js';
 import { c as clamp } from '../shared/clamp.js';
 
 const [injectSelectItemAlignedPositionContext, provideSelectItemAlignedPositionContext] = createContext("SelectItemAlignedPosition");

package/dist/Select/SelectItemAlignedPosition.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItemAlignedPosition.js","sources":["../../src/Select/SelectItemAlignedPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { PrimitiveProps } from '@/Primitive'\nimport { clamp, createContext, useForwardExpose } from '@/shared'\nimport { useCollection } from '@/Collection'\nimport { useResizeObserver } from '@vueuse/core'\n\ninterface SelectItemAlignedPositionContext {\n  contentWrapper?: Ref<HTMLElement | undefined>\n  shouldExpandOnScrollRef?: Ref<boolean>\n  onScrollButtonChange: (node: HTMLElement | undefined) => void\n}\n\nexport interface SelectItemAlignedPositionProps extends PrimitiveProps {}\n\nexport const [injectSelectItemAlignedPositionContext, provideSelectItemAlignedPositionContext]\n  = createContext<SelectItemAlignedPositionContext>('SelectItemAlignedPosition')\n</script>\n\n<script setup lang=\"ts\">\nimport { nextTick, onMounted, ref } from 'vue'\nimport { injectSelectRootContext } from './SelectRoot.vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { CONTENT_MARGIN } from './utils'\nimport { Primitive } from '@/Primitive'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<SelectItemAlignedPositionProps>()\nconst emits = defineEmits<{\n  placed: []\n}>()\n\nconst { getItems } = useCollection()\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\n\nconst shouldExpandOnScrollRef = ref(false)\nconst shouldRepositionRef = ref(true)\n\nconst contentWrapperElement = ref<HTMLElement>()\nconst { forwardRef, currentElement: contentElement } = useForwardExpose()\n\nconst { viewport, selectedItem, selectedItemText, focusSelectedItem }\n  = contentContext!\n\nfunction position() {\n  if (\n    rootContext.triggerElement.value\n    && rootContext.valueElement.value\n    && contentWrapperElement.value\n    && contentElement.value\n    && viewport?.value\n    && selectedItem?.value\n    && selectedItemText?.value\n  ) {\n    const triggerRect = rootContext.triggerElement.value.getBoundingClientRect()\n\n    // -----------------------------------------------------------------------------------------\n    //  Horizontal positioning\n    // -----------------------------------------------------------------------------------------\n    const contentRect = contentElement.value.getBoundingClientRect()\n    const valueNodeRect = rootContext.valueElement.value.getBoundingClientRect()\n    const itemTextRect = selectedItemText.value.getBoundingClientRect()\n\n    if (rootContext.dir.value !== 'rtl') {\n      const itemTextOffset = itemTextRect.left - contentRect.left\n      const left = valueNodeRect.left - itemTextOffset\n      const leftDelta = triggerRect.left - left\n      const minContentWidth = triggerRect.width + leftDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const rightEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedLeft = clamp(left, CONTENT_MARGIN, Math.max(CONTENT_MARGIN, rightEdge - contentWidth))\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.left = `${clampedLeft}px`\n    }\n    else {\n      const itemTextOffset = contentRect.right - itemTextRect.right\n      const right = window.innerWidth - valueNodeRect.right - itemTextOffset\n      const rightDelta = window.innerWidth - triggerRect.right - right\n      const minContentWidth = triggerRect.width + rightDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const leftEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedRight = clamp(\n        right,\n        CONTENT_MARGIN,\n        Math.max(CONTENT_MARGIN, leftEdge - contentWidth),\n      )\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.right = `${clampedRight}px`\n    }\n\n    // -----------------------------------------------------------------------------------------\n    // Vertical positioning\n    // -----------------------------------------------------------------------------------------\n    const items = getItems().map(i => i.ref)\n    const availableHeight = window.innerHeight - CONTENT_MARGIN * 2\n    const itemsHeight = viewport.value.scrollHeight\n\n    const contentStyles = window.getComputedStyle(contentElement.value)\n    const contentBorderTopWidth = Number.parseInt(\n      contentStyles.borderTopWidth,\n      10,\n    )\n    const contentPaddingTop = Number.parseInt(contentStyles.paddingTop, 10)\n    const contentBorderBottomWidth = Number.parseInt(\n      contentStyles.borderBottomWidth,\n      10,\n    )\n    const contentPaddingBottom = Number.parseInt(\n      contentStyles.paddingBottom,\n      10,\n    )\n\n    const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth\n    const minContentHeight = Math.min(\n      selectedItem.value.offsetHeight * 5,\n      fullContentHeight,\n    )\n\n    const viewportStyles = window.getComputedStyle(viewport.value)\n    const viewportPaddingTop = Number.parseInt(viewportStyles.paddingTop, 10)\n    const viewportPaddingBottom = Number.parseInt(\n      viewportStyles.paddingBottom,\n      10,\n    )\n\n    const topEdgeToTriggerMiddle\n      = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN\n    const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle\n\n    const selectedItemHalfHeight = selectedItem.value.offsetHeight / 2\n    const itemOffsetMiddle\n      = selectedItem.value.offsetTop + selectedItemHalfHeight\n    const contentTopToItemMiddle\n      = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle\n    const itemMiddleToContentBottom\n      = fullContentHeight - contentTopToItemMiddle\n\n    const willAlignWithoutTopOverflow\n      = contentTopToItemMiddle <= topEdgeToTriggerMiddle\n\n    if (willAlignWithoutTopOverflow) {\n      const isLastItem = selectedItem.value === items[items.length - 1]\n      contentWrapperElement.value.style.bottom = `${0}px`\n      const viewportOffsetBottom\n        = contentElement.value.clientHeight\n        - viewport.value.offsetTop\n        - viewport.value.offsetHeight\n      const clampedTriggerMiddleToBottomEdge = Math.max(\n        triggerMiddleToBottomEdge,\n        selectedItemHalfHeight\n        // viewport might have padding bottom, include it to avoid a scrollable viewport\n        + (isLastItem ? viewportPaddingBottom : 0)\n        + viewportOffsetBottom\n        + contentBorderBottomWidth,\n      )\n      const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge\n      contentWrapperElement.value.style.height = `${height}px`\n    }\n    else {\n      const isFirstItem = selectedItem.value === items[0]\n      contentWrapperElement.value.style.top = `${0}px`\n      const clampedTopEdgeToTriggerMiddle = Math.max(\n        topEdgeToTriggerMiddle,\n        contentBorderTopWidth\n        + viewport.value.offsetTop\n        // viewport might have padding top, include it to avoid a scrollable viewport\n        + (isFirstItem ? viewportPaddingTop : 0)\n        + selectedItemHalfHeight,\n      )\n      const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom\n      contentWrapperElement.value.style.height = `${height}px`\n      viewport.value.scrollTop\n        = contentTopToItemMiddle\n        - topEdgeToTriggerMiddle\n        + viewport.value.offsetTop\n    }\n\n    contentWrapperElement.value.style.margin = `${CONTENT_MARGIN}px 0`\n    contentWrapperElement.value.style.minHeight = `${minContentHeight}px`\n    contentWrapperElement.value.style.maxHeight = `${availableHeight}px`\n    // -----------------------------------------------------------------------------------------\n\n    emits('placed')\n\n    // we don't want the initial scroll position adjustment to trigger \"expand on scroll\"\n    // so we explicitly turn it on only after they've registered.\n    requestAnimationFrame(() => (shouldExpandOnScrollRef.value = true))\n  }\n}\n\n// copy z-index from content to wrapper\nconst contentZIndex = ref('')\n\nonMounted(async () => {\n  await nextTick()\n  position()\n  if (contentElement.value)\n    contentZIndex.value = window.getComputedStyle(contentElement.value).zIndex\n})\n\n// When the viewport becomes scrollable at the top, the scroll up button will mount.\n// Because it is part of the normal flow, it will push down the viewport, thus throwing our\n// trigger => selectedItem alignment off by the amount the viewport was pushed down.\n// We wait for this to happen and then re-run the positining logic one more time to account for it.\nfunction handleScrollButtonChange(node: HTMLElement | undefined) {\n  if (node && shouldRepositionRef.value === true) {\n    position()\n    focusSelectedItem?.()\n    shouldRepositionRef.value = false\n  }\n}\n\n// Resize and position when trigger element changes\nuseResizeObserver(rootContext.triggerElement, () => {\n  position()\n})\n\nprovideSelectItemAlignedPositionContext({\n  contentWrapper: contentWrapperElement,\n  shouldExpandOnScrollRef,\n  onScrollButtonChange: handleScrollButtonChange,\n})\n</script>\n\n<template>\n  <div\n    ref=\"contentWrapperElement\"\n    :style=\"{\n      display: 'flex',\n      flexDirection: 'column',\n      position: 'fixed',\n      zIndex: contentZIndex,\n    }\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      :style=\"{\n        // When we get the height of the content, it includes borders. If we were to set\n        // the height without having `boxSizing: 'border-box'` it would be too big.\n        boxSizing: 'border-box',\n        // We need to ensure the content doesn't get taller than the wrapper\n        maxHeight: '100%',\n      }\"\n      v-bind=\"{ ...$attrs, ...props }\"\n    >\n      <slot />\n    </Primitive>\n  </div>\n</template>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SelectItemAlignedPosition.js","sources":["../../src/Select/SelectItemAlignedPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport type { Ref } from 'vue'\nimport { useCollection } from '@/Collection'\nimport { clamp, createContext, useForwardExpose } from '@/shared'\nimport { useResizeObserver } from '@vueuse/core'\n\ninterface SelectItemAlignedPositionContext {\n  contentWrapper?: Ref<HTMLElement | undefined>\n  shouldExpandOnScrollRef?: Ref<boolean>\n  onScrollButtonChange: (node: HTMLElement | undefined) => void\n}\n\nexport interface SelectItemAlignedPositionProps extends PrimitiveProps {}\n\nexport const [injectSelectItemAlignedPositionContext, provideSelectItemAlignedPositionContext]\n  = createContext<SelectItemAlignedPositionContext>('SelectItemAlignedPosition')\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { nextTick, onMounted, ref } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectRootContext } from './SelectRoot.vue'\nimport { CONTENT_MARGIN } from './utils'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<SelectItemAlignedPositionProps>()\nconst emits = defineEmits<{\n  placed: []\n}>()\n\nconst { getItems } = useCollection()\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\n\nconst shouldExpandOnScrollRef = ref(false)\nconst shouldRepositionRef = ref(true)\n\nconst contentWrapperElement = ref<HTMLElement>()\nconst { forwardRef, currentElement: contentElement } = useForwardExpose()\n\nconst { viewport, selectedItem, selectedItemText, focusSelectedItem }\n  = contentContext!\n\nfunction position() {\n  if (\n    rootContext.triggerElement.value\n    && rootContext.valueElement.value\n    && contentWrapperElement.value\n    && contentElement.value\n    && viewport?.value\n    && selectedItem?.value\n    && selectedItemText?.value\n  ) {\n    const triggerRect = rootContext.triggerElement.value.getBoundingClientRect()\n\n    // -----------------------------------------------------------------------------------------\n    //  Horizontal positioning\n    // -----------------------------------------------------------------------------------------\n    const contentRect = contentElement.value.getBoundingClientRect()\n    const valueNodeRect = rootContext.valueElement.value.getBoundingClientRect()\n    const itemTextRect = selectedItemText.value.getBoundingClientRect()\n\n    if (rootContext.dir.value !== 'rtl') {\n      const itemTextOffset = itemTextRect.left - contentRect.left\n      const left = valueNodeRect.left - itemTextOffset\n      const leftDelta = triggerRect.left - left\n      const minContentWidth = triggerRect.width + leftDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const rightEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedLeft = clamp(left, CONTENT_MARGIN, Math.max(CONTENT_MARGIN, rightEdge - contentWidth))\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.left = `${clampedLeft}px`\n    }\n    else {\n      const itemTextOffset = contentRect.right - itemTextRect.right\n      const right = window.innerWidth - valueNodeRect.right - itemTextOffset\n      const rightDelta = window.innerWidth - triggerRect.right - right\n      const minContentWidth = triggerRect.width + rightDelta\n      const contentWidth = Math.max(minContentWidth, contentRect.width)\n      const leftEdge = window.innerWidth - CONTENT_MARGIN\n      const clampedRight = clamp(\n        right,\n        CONTENT_MARGIN,\n        Math.max(CONTENT_MARGIN, leftEdge - contentWidth),\n      )\n\n      contentWrapperElement.value.style.minWidth = `${minContentWidth}px`\n      contentWrapperElement.value.style.right = `${clampedRight}px`\n    }\n\n    // -----------------------------------------------------------------------------------------\n    // Vertical positioning\n    // -----------------------------------------------------------------------------------------\n    const items = getItems().map(i => i.ref)\n    const availableHeight = window.innerHeight - CONTENT_MARGIN * 2\n    const itemsHeight = viewport.value.scrollHeight\n\n    const contentStyles = window.getComputedStyle(contentElement.value)\n    const contentBorderTopWidth = Number.parseInt(\n      contentStyles.borderTopWidth,\n      10,\n    )\n    const contentPaddingTop = Number.parseInt(contentStyles.paddingTop, 10)\n    const contentBorderBottomWidth = Number.parseInt(\n      contentStyles.borderBottomWidth,\n      10,\n    )\n    const contentPaddingBottom = Number.parseInt(\n      contentStyles.paddingBottom,\n      10,\n    )\n\n    const fullContentHeight = contentBorderTopWidth + contentPaddingTop + itemsHeight + contentPaddingBottom + contentBorderBottomWidth\n    const minContentHeight = Math.min(\n      selectedItem.value.offsetHeight * 5,\n      fullContentHeight,\n    )\n\n    const viewportStyles = window.getComputedStyle(viewport.value)\n    const viewportPaddingTop = Number.parseInt(viewportStyles.paddingTop, 10)\n    const viewportPaddingBottom = Number.parseInt(\n      viewportStyles.paddingBottom,\n      10,\n    )\n\n    const topEdgeToTriggerMiddle\n      = triggerRect.top + triggerRect.height / 2 - CONTENT_MARGIN\n    const triggerMiddleToBottomEdge = availableHeight - topEdgeToTriggerMiddle\n\n    const selectedItemHalfHeight = selectedItem.value.offsetHeight / 2\n    const itemOffsetMiddle\n      = selectedItem.value.offsetTop + selectedItemHalfHeight\n    const contentTopToItemMiddle\n      = contentBorderTopWidth + contentPaddingTop + itemOffsetMiddle\n    const itemMiddleToContentBottom\n      = fullContentHeight - contentTopToItemMiddle\n\n    const willAlignWithoutTopOverflow\n      = contentTopToItemMiddle <= topEdgeToTriggerMiddle\n\n    if (willAlignWithoutTopOverflow) {\n      const isLastItem = selectedItem.value === items[items.length - 1]\n      contentWrapperElement.value.style.bottom = `${0}px`\n      const viewportOffsetBottom\n        = contentElement.value.clientHeight\n          - viewport.value.offsetTop\n          - viewport.value.offsetHeight\n      const clampedTriggerMiddleToBottomEdge = Math.max(\n        triggerMiddleToBottomEdge,\n        selectedItemHalfHeight\n        // viewport might have padding bottom, include it to avoid a scrollable viewport\n        + (isLastItem ? viewportPaddingBottom : 0)\n        + viewportOffsetBottom\n        + contentBorderBottomWidth,\n      )\n      const height = contentTopToItemMiddle + clampedTriggerMiddleToBottomEdge\n      contentWrapperElement.value.style.height = `${height}px`\n    }\n    else {\n      const isFirstItem = selectedItem.value === items[0]\n      contentWrapperElement.value.style.top = `${0}px`\n      const clampedTopEdgeToTriggerMiddle = Math.max(\n        topEdgeToTriggerMiddle,\n        contentBorderTopWidth\n        + viewport.value.offsetTop\n        // viewport might have padding top, include it to avoid a scrollable viewport\n        + (isFirstItem ? viewportPaddingTop : 0)\n        + selectedItemHalfHeight,\n      )\n      const height = clampedTopEdgeToTriggerMiddle + itemMiddleToContentBottom\n      contentWrapperElement.value.style.height = `${height}px`\n      viewport.value.scrollTop\n        = contentTopToItemMiddle\n          - topEdgeToTriggerMiddle\n          + viewport.value.offsetTop\n    }\n\n    contentWrapperElement.value.style.margin = `${CONTENT_MARGIN}px 0`\n    contentWrapperElement.value.style.minHeight = `${minContentHeight}px`\n    contentWrapperElement.value.style.maxHeight = `${availableHeight}px`\n    // -----------------------------------------------------------------------------------------\n\n    emits('placed')\n\n    // we don't want the initial scroll position adjustment to trigger \"expand on scroll\"\n    // so we explicitly turn it on only after they've registered.\n    requestAnimationFrame(() => (shouldExpandOnScrollRef.value = true))\n  }\n}\n\n// copy z-index from content to wrapper\nconst contentZIndex = ref('')\n\nonMounted(async () => {\n  await nextTick()\n  position()\n  if (contentElement.value)\n    contentZIndex.value = window.getComputedStyle(contentElement.value).zIndex\n})\n\n// When the viewport becomes scrollable at the top, the scroll up button will mount.\n// Because it is part of the normal flow, it will push down the viewport, thus throwing our\n// trigger => selectedItem alignment off by the amount the viewport was pushed down.\n// We wait for this to happen and then re-run the positining logic one more time to account for it.\nfunction handleScrollButtonChange(node: HTMLElement | undefined) {\n  if (node && shouldRepositionRef.value === true) {\n    position()\n    focusSelectedItem?.()\n    shouldRepositionRef.value = false\n  }\n}\n\n// Resize and position when trigger element changes\nuseResizeObserver(rootContext.triggerElement, () => {\n  position()\n})\n\nprovideSelectItemAlignedPositionContext({\n  contentWrapper: contentWrapperElement,\n  shouldExpandOnScrollRef,\n  onScrollButtonChange: handleScrollButtonChange,\n})\n</script>\n\n<template>\n  <div\n    ref=\"contentWrapperElement\"\n    :style=\"{\n      display: 'flex',\n      flexDirection: 'column',\n      position: 'fixed',\n      zIndex: contentZIndex,\n    }\"\n  >\n    <Primitive\n      :ref=\"forwardRef\"\n      :style=\"{\n        // When we get the height of the content, it includes borders. If we were to set\n        // the height without having `boxSizing: 'border-box'` it would be too big.\n        boxSizing: 'border-box',\n        // We need to ensure the content doesn't get taller than the wrapper\n        maxHeight: '100%',\n      }\"\n      v-bind=\"{ ...$attrs, ...props }\"\n    >\n      <slot />\n    </Primitive>\n  </div>\n</template>\n"],"names":[],"mappings":"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"}

package/dist/Select/SelectItemIndicator.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItemIndicator.cjs","sources":["../../src/Select/SelectItemIndicator.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface SelectItemIndicatorProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectSelectItemContext } from './SelectItem.vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = withDefaults(defineProps<SelectItemIndicatorProps>(), {\n  as: 'span',\n})\n\nconst itemContext = injectSelectItemContext()\n</script>\n\n<template>\n  <Primitive\n    v-if=\"itemContext.isSelected.value\"\n    aria-hidden=\"true\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectSelectItemContext"],"mappings":";;;;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAcA,yCAAwB,EAAA;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectItemIndicator.cjs","sources":["../../src/Select/SelectItemIndicator.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface SelectItemIndicatorProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectSelectItemContext } from './SelectItem.vue'\n\nconst props = withDefaults(defineProps<SelectItemIndicatorProps>(), {\n  as: 'span',\n})\n\nconst itemContext = injectSelectItemContext()\n</script>\n\n<template>\n  <Primitive\n    v-if=\"itemContext.isSelected.value\"\n    aria-hidden=\"true\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectSelectItemContext"],"mappings":";;;;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAcA,yCAAwB,EAAA;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectItemIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItemIndicator.js","sources":["../../src/Select/SelectItemIndicator.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface SelectItemIndicatorProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { injectSelectItemContext } from './SelectItem.vue'\nimport { Primitive } from '@/Primitive'\n\nconst props = withDefaults(defineProps<SelectItemIndicatorProps>(), {\n  as: 'span',\n})\n\nconst itemContext = injectSelectItemContext()\n</script>\n\n<template>\n  <Primitive\n    v-if=\"itemContext.isSelected.value\"\n    aria-hidden=\"true\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAc,uBAAwB,EAAA;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectItemIndicator.js","sources":["../../src/Select/SelectItemIndicator.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\n\nexport interface SelectItemIndicatorProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { injectSelectItemContext } from './SelectItem.vue'\n\nconst props = withDefaults(defineProps<SelectItemIndicatorProps>(), {\n  as: 'span',\n})\n\nconst itemContext = injectSelectItemContext()\n</script>\n\n<template>\n  <Primitive\n    v-if=\"itemContext.isSelected.value\"\n    aria-hidden=\"true\"\n    v-bind=\"props\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAc,uBAAwB,EAAA;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectItemText.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItemText.cjs","sources":["../../src/Select/SelectItemText.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\nimport { injectSelectRootContext } from './SelectRoot.vue'\n\nexport interface SelectItemTextProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectItemContext } from './SelectItem.vue'\nimport { Primitive } from '@/Primitive'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectItemTextProps>(), {\n  as: 'span',\n})\n\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\nconst itemContext = injectSelectItemContext()\n\nconst { forwardRef, currentElement: itemTextElement } = useForwardExpose()\n\nconst optionProps = computed(() => {\n  return {\n    value: itemContext.value,\n    disabled: itemContext.disabled.value,\n    textContent: itemTextElement.value?.textContent ?? itemContext.value?.toString() ?? '',\n  }\n})\n\nonMounted(() => {\n  if (!itemTextElement.value)\n    return\n  itemContext.onItemTextChange(itemTextElement.value)\n  contentContext.itemTextRefCallback(\n    itemTextElement.value,\n    itemContext.value,\n    itemContext.disabled.value,\n  )\n  rootContext.onOptionAdd(optionProps.value)\n})\n\nonBeforeUnmount(() => {\n  rootContext.onOptionRemove(optionProps.value)\n})\n</script>\n\n<template>\n  <Primitive\n    :id=\"itemContext.textId\"\n    :ref=\"forwardRef\"\n    v-bind=\"{ ...props, ...$attrs }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectSelectRootContext","injectSelectContentContext","injectSelectItemContext","useForwardExpose","computed","onMounted","onBeforeUnmount"],"mappings":";;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAcA,yCAAwB,EAAA;AAC5C,IAAA,MAAM,iBAAiBC,mDAA2B,EAAA;AAClD,IAAA,MAAM,cAAcC,yCAAwB,EAAA;AAE5C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,eAAA,KAAoBC,wCAAiB,EAAA;AAEzE,IAAM,MAAA,WAAA,GAAcC,aAAS,MAAM;AACjC,MAAO,OAAA;AAAA,QACL,OAAO,WAAY,CAAA,KAAA;AAAA,QACnB,QAAA,EAAU,YAAY,QAAS,CAAA,KAAA;AAAA,QAC/B,aAAa,eAAgB,CAAA,KAAA,EAAO,eAAe,WAAY,CAAA,KAAA,EAAO,UAAc,IAAA;AAAA,OACtF;AAAA,KACD,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,eAAgB,CAAA,KAAA;AACnB,QAAA;AACF,MAAY,WAAA,CAAA,gBAAA,CAAiB,gBAAgB,KAAK,CAAA;AAClD,MAAe,cAAA,CAAA,mBAAA;AAAA,QACb,eAAgB,CAAA,KAAA;AAAA,QAChB,WAAY,CAAA,KAAA;AAAA,QACZ,YAAY,QAAS,CAAA;AAAA,OACvB;AACA,MAAY,WAAA,CAAA,WAAA,CAAY,YAAY,KAAK,CAAA;AAAA,KAC1C,CAAA;AAED,IAAAC,mBAAA,CAAgB,MAAM;AACpB,MAAY,WAAA,CAAA,cAAA,CAAe,YAAY,KAAK,CAAA;AAAA,KAC7C,CAAA;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectItemText.cjs","sources":["../../src/Select/SelectItemText.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\nimport { injectSelectRootContext } from './SelectRoot.vue'\n\nexport interface SelectItemTextProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { computed, onBeforeUnmount, onMounted } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectItemContext } from './SelectItem.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectItemTextProps>(), {\n  as: 'span',\n})\n\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\nconst itemContext = injectSelectItemContext()\n\nconst { forwardRef, currentElement: itemTextElement } = useForwardExpose()\n\nconst optionProps = computed(() => {\n  return {\n    value: itemContext.value,\n    disabled: itemContext.disabled.value,\n    textContent: itemTextElement.value?.textContent ?? itemContext.value?.toString() ?? '',\n  }\n})\n\nonMounted(() => {\n  if (!itemTextElement.value)\n    return\n  itemContext.onItemTextChange(itemTextElement.value)\n  contentContext.itemTextRefCallback(\n    itemTextElement.value,\n    itemContext.value,\n    itemContext.disabled.value,\n  )\n  rootContext.onOptionAdd(optionProps.value)\n})\n\nonBeforeUnmount(() => {\n  rootContext.onOptionRemove(optionProps.value)\n})\n</script>\n\n<template>\n  <Primitive\n    :id=\"itemContext.textId\"\n    :ref=\"forwardRef\"\n    v-bind=\"{ ...props, ...$attrs }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["injectSelectRootContext","injectSelectContentContext","injectSelectItemContext","useForwardExpose","computed","onMounted","onBeforeUnmount"],"mappings":";;;;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAcA,yCAAwB,EAAA;AAC5C,IAAA,MAAM,iBAAiBC,mDAA2B,EAAA;AAClD,IAAA,MAAM,cAAcC,yCAAwB,EAAA;AAE5C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,eAAA,KAAoBC,wCAAiB,EAAA;AAEzE,IAAM,MAAA,WAAA,GAAcC,aAAS,MAAM;AACjC,MAAO,OAAA;AAAA,QACL,OAAO,WAAY,CAAA,KAAA;AAAA,QACnB,QAAA,EAAU,YAAY,QAAS,CAAA,KAAA;AAAA,QAC/B,aAAa,eAAgB,CAAA,KAAA,EAAO,eAAe,WAAY,CAAA,KAAA,EAAO,UAAc,IAAA;AAAA,OACtF;AAAA,KACD,CAAA;AAED,IAAAC,aAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,eAAgB,CAAA,KAAA;AACnB,QAAA;AACF,MAAY,WAAA,CAAA,gBAAA,CAAiB,gBAAgB,KAAK,CAAA;AAClD,MAAe,cAAA,CAAA,mBAAA;AAAA,QACb,eAAgB,CAAA,KAAA;AAAA,QAChB,WAAY,CAAA,KAAA;AAAA,QACZ,YAAY,QAAS,CAAA;AAAA,OACvB;AACA,MAAY,WAAA,CAAA,WAAA,CAAY,YAAY,KAAK,CAAA;AAAA,KAC1C,CAAA;AAED,IAAAC,mBAAA,CAAgB,MAAM;AACpB,MAAY,WAAA,CAAA,cAAA,CAAe,YAAY,KAAK,CAAA;AAAA,KAC7C,CAAA;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectItemText.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItemText.js","sources":["../../src/Select/SelectItemText.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\nimport { injectSelectRootContext } from './SelectRoot.vue'\n\nexport interface SelectItemTextProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectItemContext } from './SelectItem.vue'\nimport { Primitive } from '@/Primitive'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectItemTextProps>(), {\n  as: 'span',\n})\n\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\nconst itemContext = injectSelectItemContext()\n\nconst { forwardRef, currentElement: itemTextElement } = useForwardExpose()\n\nconst optionProps = computed(() => {\n  return {\n    value: itemContext.value,\n    disabled: itemContext.disabled.value,\n    textContent: itemTextElement.value?.textContent ?? itemContext.value?.toString() ?? '',\n  }\n})\n\nonMounted(() => {\n  if (!itemTextElement.value)\n    return\n  itemContext.onItemTextChange(itemTextElement.value)\n  contentContext.itemTextRefCallback(\n    itemTextElement.value,\n    itemContext.value,\n    itemContext.disabled.value,\n  )\n  rootContext.onOptionAdd(optionProps.value)\n})\n\nonBeforeUnmount(() => {\n  rootContext.onOptionRemove(optionProps.value)\n})\n</script>\n\n<template>\n  <Primitive\n    :id=\"itemContext.textId\"\n    :ref=\"forwardRef\"\n    v-bind=\"{ ...props, ...$attrs }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAc,uBAAwB,EAAA;AAC5C,IAAA,MAAM,iBAAiB,0BAA2B,EAAA;AAClD,IAAA,MAAM,cAAc,uBAAwB,EAAA;AAE5C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,eAAA,KAAoB,gBAAiB,EAAA;AAEzE,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAO,OAAA;AAAA,QACL,OAAO,WAAY,CAAA,KAAA;AAAA,QACnB,QAAA,EAAU,YAAY,QAAS,CAAA,KAAA;AAAA,QAC/B,aAAa,eAAgB,CAAA,KAAA,EAAO,eAAe,WAAY,CAAA,KAAA,EAAO,UAAc,IAAA;AAAA,OACtF;AAAA,KACD,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,eAAgB,CAAA,KAAA;AACnB,QAAA;AACF,MAAY,WAAA,CAAA,gBAAA,CAAiB,gBAAgB,KAAK,CAAA;AAClD,MAAe,cAAA,CAAA,mBAAA;AAAA,QACb,eAAgB,CAAA,KAAA;AAAA,QAChB,WAAY,CAAA,KAAA;AAAA,QACZ,YAAY,QAAS,CAAA;AAAA,OACvB;AACA,MAAY,WAAA,CAAA,WAAA,CAAY,YAAY,KAAK,CAAA;AAAA,KAC1C,CAAA;AAED,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAY,WAAA,CAAA,cAAA,CAAe,YAAY,KAAK,CAAA;AAAA,KAC7C,CAAA;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectItemText.js","sources":["../../src/Select/SelectItemText.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\nimport { injectSelectRootContext } from './SelectRoot.vue'\n\nexport interface SelectItemTextProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { Primitive } from '@/Primitive'\nimport { computed, onBeforeUnmount, onMounted } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectItemContext } from './SelectItem.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectItemTextProps>(), {\n  as: 'span',\n})\n\nconst rootContext = injectSelectRootContext()\nconst contentContext = injectSelectContentContext()\nconst itemContext = injectSelectItemContext()\n\nconst { forwardRef, currentElement: itemTextElement } = useForwardExpose()\n\nconst optionProps = computed(() => {\n  return {\n    value: itemContext.value,\n    disabled: itemContext.disabled.value,\n    textContent: itemTextElement.value?.textContent ?? itemContext.value?.toString() ?? '',\n  }\n})\n\nonMounted(() => {\n  if (!itemTextElement.value)\n    return\n  itemContext.onItemTextChange(itemTextElement.value)\n  contentContext.itemTextRefCallback(\n    itemTextElement.value,\n    itemContext.value,\n    itemContext.disabled.value,\n  )\n  rootContext.onOptionAdd(optionProps.value)\n})\n\nonBeforeUnmount(() => {\n  rootContext.onOptionRemove(optionProps.value)\n})\n</script>\n\n<template>\n  <Primitive\n    :id=\"itemContext.textId\"\n    :ref=\"forwardRef\"\n    v-bind=\"{ ...props, ...$attrs }\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAkBA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,MAAM,cAAc,uBAAwB,EAAA;AAC5C,IAAA,MAAM,iBAAiB,0BAA2B,EAAA;AAClD,IAAA,MAAM,cAAc,uBAAwB,EAAA;AAE5C,IAAA,MAAM,EAAE,UAAA,EAAY,cAAgB,EAAA,eAAA,KAAoB,gBAAiB,EAAA;AAEzE,IAAM,MAAA,WAAA,GAAc,SAAS,MAAM;AACjC,MAAO,OAAA;AAAA,QACL,OAAO,WAAY,CAAA,KAAA;AAAA,QACnB,QAAA,EAAU,YAAY,QAAS,CAAA,KAAA;AAAA,QAC/B,aAAa,eAAgB,CAAA,KAAA,EAAO,eAAe,WAAY,CAAA,KAAA,EAAO,UAAc,IAAA;AAAA,OACtF;AAAA,KACD,CAAA;AAED,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,eAAgB,CAAA,KAAA;AACnB,QAAA;AACF,MAAY,WAAA,CAAA,gBAAA,CAAiB,gBAAgB,KAAK,CAAA;AAClD,MAAe,cAAA,CAAA,mBAAA;AAAA,QACb,eAAgB,CAAA,KAAA;AAAA,QAChB,WAAY,CAAA,KAAA;AAAA,QACZ,YAAY,QAAS,CAAA;AAAA,OACvB;AACA,MAAY,WAAA,CAAA,WAAA,CAAY,YAAY,KAAK,CAAA;AAAA,KAC1C,CAAA;AAED,IAAA,eAAA,CAAgB,MAAM;AACpB,MAAY,WAAA,CAAA,cAAA,CAAe,YAAY,KAAK,CAAA;AAAA,KAC7C,CAAA;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectPopperPosition.cjs

@@ -1,9 +1,9 @@
 'use strict';
 
 const vue = require('vue');
+const Popper_PopperContent = require('../Popper/PopperContent.cjs');
 require('@floating-ui/vue');
 const Select_utils = require('./utils.cjs');
-const Popper_PopperContent = require('../Popper/PopperContent.cjs');
 const shared_useForwardProps = require('../shared/useForwardProps.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({

package/dist/Select/SelectPopperPosition.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectPopperPosition.cjs","sources":["../../src/Select/SelectPopperPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PopperContentProps } from '@/Popper'\n\nexport interface SelectPopperPositionProps extends PopperContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useForwardProps } from '..'\nimport { CONTENT_MARGIN } from './utils'\nimport { PopperContent } from '@/Popper'\n\nconst props = withDefaults(defineProps<SelectPopperPositionProps>(), {\n  align: 'start',\n  collisionPadding: CONTENT_MARGIN,\n})\nconst forwarded = useForwardProps(props)\n</script>\n\n<template>\n  <PopperContent\n    v-bind=\"forwarded\"\n    :style=\"{\n      // Ensure border-box for floating-ui calculations\n      'boxSizing': 'border-box',\n      '--reka-select-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n      '--reka-select-content-available-width':\n        'var(--reka-popper-available-width)',\n      '--reka-select-content-available-height':\n        'var(--reka-popper-available-height)',\n      '--reka-select-trigger-width': 'var(--reka-popper-anchor-width)',\n      '--reka-select-trigger-height': 'var(--reka-popper-anchor-height)',\n    }\"\n  >\n    <slot />\n  </PopperContent>\n</template>\n"],"names":["useForwardProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAM,MAAA,SAAA,GAAYA,uCAAgB,KAAK,CAAA;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectPopperPosition.cjs","sources":["../../src/Select/SelectPopperPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PopperContentProps } from '@/Popper'\n\nexport interface SelectPopperPositionProps extends PopperContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { PopperContent } from '@/Popper'\nimport { useForwardProps } from '..'\nimport { CONTENT_MARGIN } from './utils'\n\nconst props = withDefaults(defineProps<SelectPopperPositionProps>(), {\n  align: 'start',\n  collisionPadding: CONTENT_MARGIN,\n})\nconst forwarded = useForwardProps(props)\n</script>\n\n<template>\n  <PopperContent\n    v-bind=\"forwarded\"\n    :style=\"{\n      // Ensure border-box for floating-ui calculations\n      'boxSizing': 'border-box',\n      '--reka-select-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n      '--reka-select-content-available-width':\n        'var(--reka-popper-available-width)',\n      '--reka-select-content-available-height':\n        'var(--reka-popper-available-height)',\n      '--reka-select-trigger-width': 'var(--reka-popper-anchor-width)',\n      '--reka-select-trigger-height': 'var(--reka-popper-anchor-height)',\n    }\"\n  >\n    <slot />\n  </PopperContent>\n</template>\n"],"names":["useForwardProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAM,MAAA,SAAA,GAAYA,uCAAgB,KAAK,CAAA;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectPopperPosition.js

@@ -1,7 +1,7 @@
 import { defineComponent, createBlock, openBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { _ as _sfc_main$1 } from '../Popper/PopperContent.js';
 import '@floating-ui/vue';
 import { C as CONTENT_MARGIN } from './utils.js';
-import { _ as _sfc_main$1 } from '../Popper/PopperContent.js';
 import { u as useForwardProps } from '../shared/useForwardProps.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({

package/dist/Select/SelectPopperPosition.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectPopperPosition.js","sources":["../../src/Select/SelectPopperPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PopperContentProps } from '@/Popper'\n\nexport interface SelectPopperPositionProps extends PopperContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { useForwardProps } from '..'\nimport { CONTENT_MARGIN } from './utils'\nimport { PopperContent } from '@/Popper'\n\nconst props = withDefaults(defineProps<SelectPopperPositionProps>(), {\n  align: 'start',\n  collisionPadding: CONTENT_MARGIN,\n})\nconst forwarded = useForwardProps(props)\n</script>\n\n<template>\n  <PopperContent\n    v-bind=\"forwarded\"\n    :style=\"{\n      // Ensure border-box for floating-ui calculations\n      'boxSizing': 'border-box',\n      '--reka-select-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n      '--reka-select-content-available-width':\n        'var(--reka-popper-available-width)',\n      '--reka-select-content-available-height':\n        'var(--reka-popper-available-height)',\n      '--reka-select-trigger-width': 'var(--reka-popper-anchor-width)',\n      '--reka-select-trigger-height': 'var(--reka-popper-anchor-height)',\n    }\"\n  >\n    <slot />\n  </PopperContent>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAM,MAAA,SAAA,GAAY,gBAAgB,KAAK,CAAA;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectPopperPosition.js","sources":["../../src/Select/SelectPopperPosition.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PopperContentProps } from '@/Popper'\n\nexport interface SelectPopperPositionProps extends PopperContentProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { PopperContent } from '@/Popper'\nimport { useForwardProps } from '..'\nimport { CONTENT_MARGIN } from './utils'\n\nconst props = withDefaults(defineProps<SelectPopperPositionProps>(), {\n  align: 'start',\n  collisionPadding: CONTENT_MARGIN,\n})\nconst forwarded = useForwardProps(props)\n</script>\n\n<template>\n  <PopperContent\n    v-bind=\"forwarded\"\n    :style=\"{\n      // Ensure border-box for floating-ui calculations\n      'boxSizing': 'border-box',\n      '--reka-select-content-transform-origin':\n        'var(--reka-popper-transform-origin)',\n      '--reka-select-content-available-width':\n        'var(--reka-popper-available-width)',\n      '--reka-select-content-available-height':\n        'var(--reka-popper-available-height)',\n      '--reka-select-trigger-width': 'var(--reka-popper-anchor-width)',\n      '--reka-select-trigger-height': 'var(--reka-popper-anchor-height)',\n    }\"\n  >\n    <slot />\n  </PopperContent>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAM,MAAA,SAAA,GAAY,gBAAgB,KAAK,CAAA;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectProvider.cjs","sources":["../../src/Select/SelectProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { AcceptableValue } from '@/shared/types'\nimport type { SelectRootContext } from './SelectRoot.vue'\nimport { provideSelectRootContext } from './SelectRoot.vue'\nimport { SelectContentDefaultContextValue, provideSelectContentContext } from './SelectContentImpl.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<{\n  context: SelectRootContext<AcceptableValue>\n}>()\n\nprovideSelectRootContext(props.context)\nprovideSelectContentContext(SelectContentDefaultContextValue)\n</script>\n\n<template>\n  <slot />\n</template>\n"],"names":["provideSelectRootContext","provideSelectContentContext","SelectContentDefaultContextValue"],"mappings":";;;;;;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAAA,0CAAA,CAAyB,MAAM,OAAO,CAAA;AACtC,IAAAC,oDAAA,CAA4BC,yDAAgC,CAAA;;;;;;;;;"}
+{"version":3,"file":"SelectProvider.cjs","sources":["../../src/Select/SelectProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { AcceptableValue } from '@/shared/types'\nimport type { SelectRootContext } from './SelectRoot.vue'\nimport { provideSelectContentContext, SelectContentDefaultContextValue } from './SelectContentImpl.vue'\nimport { provideSelectRootContext } from './SelectRoot.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<{\n  context: SelectRootContext<AcceptableValue>\n}>()\n\nprovideSelectRootContext(props.context)\nprovideSelectContentContext(SelectContentDefaultContextValue)\n</script>\n\n<template>\n  <slot />\n</template>\n"],"names":["provideSelectRootContext","provideSelectContentContext","SelectContentDefaultContextValue"],"mappings":";;;;;;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAAA,0CAAA,CAAyB,MAAM,OAAO,CAAA;AACtC,IAAAC,oDAAA,CAA4BC,yDAAgC,CAAA;;;;;;;;;"}

package/dist/Select/SelectProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectProvider.js","sources":["../../src/Select/SelectProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { AcceptableValue } from '@/shared/types'\nimport type { SelectRootContext } from './SelectRoot.vue'\nimport { provideSelectRootContext } from './SelectRoot.vue'\nimport { SelectContentDefaultContextValue, provideSelectContentContext } from './SelectContentImpl.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<{\n  context: SelectRootContext<AcceptableValue>\n}>()\n\nprovideSelectRootContext(props.context)\nprovideSelectContentContext(SelectContentDefaultContextValue)\n</script>\n\n<template>\n  <slot />\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,wBAAA,CAAyB,MAAM,OAAO,CAAA;AACtC,IAAA,2BAAA,CAA4B,gCAAgC,CAAA;;;;;;;;;"}
+{"version":3,"file":"SelectProvider.js","sources":["../../src/Select/SelectProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { AcceptableValue } from '@/shared/types'\nimport type { SelectRootContext } from './SelectRoot.vue'\nimport { provideSelectContentContext, SelectContentDefaultContextValue } from './SelectContentImpl.vue'\nimport { provideSelectRootContext } from './SelectRoot.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = defineProps<{\n  context: SelectRootContext<AcceptableValue>\n}>()\n\nprovideSelectRootContext(props.context)\nprovideSelectContentContext(SelectContentDefaultContextValue)\n</script>\n\n<template>\n  <slot />\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAUA,IAAA,MAAM,KAAQ,GAAA,OAAA;AAId,IAAA,wBAAA,CAAyB,MAAM,OAAO,CAAA;AACtC,IAAA,2BAAA,CAA4B,gCAAgC,CAAA;;;;;;;;;"}

package/dist/Select/SelectRoot.cjs

@@ -1,11 +1,11 @@
 'use strict';
 
 const vue = require('vue');
-const Select_BubbleSelect = require('./BubbleSelect.cjs');
 const Popper_PopperRoot = require('../Popper/PopperRoot.cjs');
 const core = require('@vueuse/core');
-const Select_utils = require('./utils.cjs');
+const Select_BubbleSelect = require('./BubbleSelect.cjs');
 const Collection_Collection = require('../Collection/Collection.cjs');
+const Select_utils = require('./utils.cjs');
 const shared_createContext = require('../shared/createContext.cjs');
 const shared_useDirection = require('../shared/useDirection.cjs');
 const shared_useFormControl = require('../shared/useFormControl.cjs');

package/dist/Select/SelectRoot.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectRoot.cjs","sources":["../../src/Select/SelectRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { AcceptableValue, Direction, FormFieldProps } from '@/shared/types'\nimport { createContext, isNullish, useDirection, useFormControl } from '@/shared'\nimport { compare } from './utils'\nimport { useCollection } from '@/Collection'\n\nexport interface SelectRootProps<T = AcceptableValue> extends FormFieldProps {\n  /** The controlled open state of the Select. Can be bind as `v-model:open`. */\n  open?: boolean\n  /** The open state of the select when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: boolean\n  /** The value of the select when initially rendered. Use when you do not need to control the state of the Select */\n  defaultValue?: T | Array<T>\n  /** The controlled value of the Select. Can be bind as `v-model`. */\n  modelValue?: T | Array<T>\n  /** Use this to compare objects by a particular field, or pass your own comparison function for complete control over how objects are compared. */\n  by?: string | ((a: T, b: T) => boolean)\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** Whether multiple options can be selected or not. */\n  multiple?: boolean\n  /** Native html input `autocomplete` attribute. */\n  autocomplete?: string\n  /** When `true`, prevents the user from interacting with Select */\n  disabled?: boolean\n}\n\nexport type SelectRootEmits<T = AcceptableValue> = {\n  /** Event handler called when the value changes. */\n  'update:modelValue': [value: T]\n  /** Event handler called when the open state of the context menu changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface SelectRootContext<T> {\n  triggerElement: Ref<HTMLElement | undefined>\n  onTriggerChange: (node: HTMLElement | undefined) => void\n  valueElement: Ref<HTMLElement | undefined>\n  onValueElementChange: (node: HTMLElement) => void\n  contentId: string\n  modelValue: Ref<T | Array<T> | undefined>\n  onValueChange: (value: T) => void\n  open: Ref<boolean>\n  multiple: Ref<boolean>\n  required?: Ref<boolean>\n  by?: string | ((a: T, b: T) => boolean)\n  onOpenChange: (open: boolean) => void\n  dir: Ref<Direction>\n  triggerPointerDownPosRef: Ref<{ x: number, y: number } | null>\n  isEmptyModelValue: Ref<boolean>\n  disabled?: Ref<boolean>\n\n  optionsSet: Ref<Set<SelectOption>>\n  onOptionAdd: (option: SelectOption) => void\n  onOptionRemove: (option: SelectOption) => void\n}\n\nexport const [injectSelectRootContext, provideSelectRootContext]\n  = createContext<SelectRootContext<AcceptableValue>>('SelectRoot')\n\ninterface SelectOption { value: any, disabled?: boolean, textContent: string }\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { computed, ref, toRefs } from 'vue'\nimport BubbleSelect from './BubbleSelect.vue'\nimport { PopperRoot } from '@/Popper'\nimport { useVModel } from '@vueuse/core'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectRootProps>(), {\n  modelValue: undefined,\n  open: undefined,\n})\nconst emits = defineEmits<SelectRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { required, disabled, multiple, dir: propDir } = toRefs(props)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue ?? (multiple.value ? [] : undefined),\n  passive: (props.modelValue === undefined) as false,\n  deep: true,\n}) as Ref<T | T[] | undefined>\n\nconst open = useVModel(props, 'open', emits, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst triggerElement = ref<HTMLElement>()\nconst valueElement = ref<HTMLElement>()\nconst triggerPointerDownPosRef = ref({\n  x: 0,\n  y: 0,\n})\n\nconst isEmptyModelValue = computed(() => {\n  if (multiple.value && Array.isArray(modelValue.value))\n    return modelValue.value?.length === 0\n  else\n    return isNullish(modelValue.value)\n})\n\nuseCollection({ isProvider: true })\nconst dir = useDirection(propDir)\n\nconst isFormControl = useFormControl(triggerElement)\nconst optionsSet = ref<Set<SelectOption>>(new Set())\n\n// The native `select` only associates the correct default value if the corresponding\n// `option` is rendered as a child **at the same time** as itself.\n// Because it might take a few renders for our items to gather the information to build\n// the native `option`(s), we generate a key on the `select` to make sure Vue re-builds it\n// each time the options change.\nconst nativeSelectKey = computed(() => {\n  return Array.from(optionsSet.value)\n    .map(option => option.value)\n    .join(';')\n})\n\nfunction handleValueChange(value: T) {\n  if (multiple.value) {\n    const array = Array.isArray(modelValue.value) ? [...modelValue.value] : []\n    const index = array.findIndex(i => compare(i, value, props.by))\n    index === -1 ? array.push(value) : array.splice(index, 1)\n    modelValue.value = [...array]\n  }\n  else {\n    modelValue.value = value\n  }\n}\n\nprovideSelectRootContext({\n  triggerElement,\n  onTriggerChange: (node) => {\n    triggerElement.value = node\n  },\n  valueElement,\n  onValueElementChange: (node) => {\n    valueElement.value = node\n  },\n  contentId: '',\n  modelValue,\n  // @ts-expect-error Missing infer for AcceptableValue\n  onValueChange: handleValueChange,\n  by: props.by,\n  open,\n  multiple,\n  required,\n  onOpenChange: (value) => {\n    open.value = value\n  },\n  dir,\n  triggerPointerDownPosRef,\n  disabled,\n  isEmptyModelValue,\n\n  optionsSet,\n  onOptionAdd: option => optionsSet.value.add(option),\n  onOptionRemove: option => optionsSet.value.delete(option),\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot\n      :model-value=\"modelValue\"\n      :open=\"open\"\n    />\n\n    <BubbleSelect\n      v-if=\"isFormControl\"\n      :key=\"nativeSelectKey\"\n      aria-hidden=\"true\"\n      tabindex=\"-1\"\n      :multiple=\"multiple\"\n      :required=\"required\"\n      :name=\"name\"\n      :autocomplete=\"autocomplete\"\n      :disabled=\"disabled\"\n      :value=\"modelValue\"\n    >\n      <option\n        v-if=\"isNullish(modelValue)\"\n        value=\"\"\n      />\n      <option\n        v-for=\"option in Array.from(optionsSet)\"\n        :key=\"option.value ?? ''\"\n        v-bind=\"option\"\n      />\n    </BubbleSelect>\n  </PopperRoot>\n</template>\n"],"names":["createContext","toRefs","useVModel","ref","computed","isNullish","useCollection","useDirection","useFormControl","compare"],"mappings":"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"}
+{"version":3,"file":"SelectRoot.cjs","sources":["../../src/Select/SelectRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AcceptableValue, Direction, FormFieldProps } from '@/shared/types'\nimport type { Ref } from 'vue'\nimport { useCollection } from '@/Collection'\nimport { createContext, isNullish, useDirection, useFormControl } from '@/shared'\nimport { compare } from './utils'\n\nexport interface SelectRootProps<T = AcceptableValue> extends FormFieldProps {\n  /** The controlled open state of the Select. Can be bind as `v-model:open`. */\n  open?: boolean\n  /** The open state of the select when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: boolean\n  /** The value of the select when initially rendered. Use when you do not need to control the state of the Select */\n  defaultValue?: T | Array<T>\n  /** The controlled value of the Select. Can be bind as `v-model`. */\n  modelValue?: T | Array<T>\n  /** Use this to compare objects by a particular field, or pass your own comparison function for complete control over how objects are compared. */\n  by?: string | ((a: T, b: T) => boolean)\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** Whether multiple options can be selected or not. */\n  multiple?: boolean\n  /** Native html input `autocomplete` attribute. */\n  autocomplete?: string\n  /** When `true`, prevents the user from interacting with Select */\n  disabled?: boolean\n}\n\nexport type SelectRootEmits<T = AcceptableValue> = {\n  /** Event handler called when the value changes. */\n  'update:modelValue': [value: T]\n  /** Event handler called when the open state of the context menu changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface SelectRootContext<T> {\n  triggerElement: Ref<HTMLElement | undefined>\n  onTriggerChange: (node: HTMLElement | undefined) => void\n  valueElement: Ref<HTMLElement | undefined>\n  onValueElementChange: (node: HTMLElement) => void\n  contentId: string\n  modelValue: Ref<T | Array<T> | undefined>\n  onValueChange: (value: T) => void\n  open: Ref<boolean>\n  multiple: Ref<boolean>\n  required?: Ref<boolean>\n  by?: string | ((a: T, b: T) => boolean)\n  onOpenChange: (open: boolean) => void\n  dir: Ref<Direction>\n  triggerPointerDownPosRef: Ref<{ x: number, y: number } | null>\n  isEmptyModelValue: Ref<boolean>\n  disabled?: Ref<boolean>\n\n  optionsSet: Ref<Set<SelectOption>>\n  onOptionAdd: (option: SelectOption) => void\n  onOptionRemove: (option: SelectOption) => void\n}\n\nexport const [injectSelectRootContext, provideSelectRootContext]\n  = createContext<SelectRootContext<AcceptableValue>>('SelectRoot')\n\ninterface SelectOption { value: any, disabled?: boolean, textContent: string }\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { PopperRoot } from '@/Popper'\nimport { useVModel } from '@vueuse/core'\nimport { computed, ref, toRefs } from 'vue'\nimport BubbleSelect from './BubbleSelect.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectRootProps>(), {\n  modelValue: undefined,\n  open: undefined,\n})\nconst emits = defineEmits<SelectRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { required, disabled, multiple, dir: propDir } = toRefs(props)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue ?? (multiple.value ? [] : undefined),\n  passive: (props.modelValue === undefined) as false,\n  deep: true,\n}) as Ref<T | T[] | undefined>\n\nconst open = useVModel(props, 'open', emits, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst triggerElement = ref<HTMLElement>()\nconst valueElement = ref<HTMLElement>()\nconst triggerPointerDownPosRef = ref({\n  x: 0,\n  y: 0,\n})\n\nconst isEmptyModelValue = computed(() => {\n  if (multiple.value && Array.isArray(modelValue.value))\n    return modelValue.value?.length === 0\n  else\n    return isNullish(modelValue.value)\n})\n\nuseCollection({ isProvider: true })\nconst dir = useDirection(propDir)\n\nconst isFormControl = useFormControl(triggerElement)\nconst optionsSet = ref<Set<SelectOption>>(new Set())\n\n// The native `select` only associates the correct default value if the corresponding\n// `option` is rendered as a child **at the same time** as itself.\n// Because it might take a few renders for our items to gather the information to build\n// the native `option`(s), we generate a key on the `select` to make sure Vue re-builds it\n// each time the options change.\nconst nativeSelectKey = computed(() => {\n  return Array.from(optionsSet.value)\n    .map(option => option.value)\n    .join(';')\n})\n\nfunction handleValueChange(value: T) {\n  if (multiple.value) {\n    const array = Array.isArray(modelValue.value) ? [...modelValue.value] : []\n    const index = array.findIndex(i => compare(i, value, props.by))\n    index === -1 ? array.push(value) : array.splice(index, 1)\n    modelValue.value = [...array]\n  }\n  else {\n    modelValue.value = value\n  }\n}\n\nprovideSelectRootContext({\n  triggerElement,\n  onTriggerChange: (node) => {\n    triggerElement.value = node\n  },\n  valueElement,\n  onValueElementChange: (node) => {\n    valueElement.value = node\n  },\n  contentId: '',\n  modelValue,\n  // @ts-expect-error Missing infer for AcceptableValue\n  onValueChange: handleValueChange,\n  by: props.by,\n  open,\n  multiple,\n  required,\n  onOpenChange: (value) => {\n    open.value = value\n  },\n  dir,\n  triggerPointerDownPosRef,\n  disabled,\n  isEmptyModelValue,\n\n  optionsSet,\n  onOptionAdd: option => optionsSet.value.add(option),\n  onOptionRemove: option => optionsSet.value.delete(option),\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot\n      :model-value=\"modelValue\"\n      :open=\"open\"\n    />\n\n    <BubbleSelect\n      v-if=\"isFormControl\"\n      :key=\"nativeSelectKey\"\n      aria-hidden=\"true\"\n      tabindex=\"-1\"\n      :multiple=\"multiple\"\n      :required=\"required\"\n      :name=\"name\"\n      :autocomplete=\"autocomplete\"\n      :disabled=\"disabled\"\n      :value=\"modelValue\"\n    >\n      <option\n        v-if=\"isNullish(modelValue)\"\n        value=\"\"\n      />\n      <option\n        v-for=\"option in Array.from(optionsSet)\"\n        :key=\"option.value ?? ''\"\n        v-bind=\"option\"\n      />\n    </BubbleSelect>\n  </PopperRoot>\n</template>\n"],"names":["createContext","toRefs","useVModel","ref","computed","isNullish","useCollection","useDirection","useFormControl","compare"],"mappings":"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"}

package/dist/Select/SelectRoot.js

@@ -1,9 +1,9 @@
 import { defineComponent, toRefs, ref, computed, createBlock, openBlock, unref, withCtx, renderSlot, createCommentVNode, createElementBlock, Fragment, renderList, mergeProps } from 'vue';
-import { _ as _sfc_main$2 } from './BubbleSelect.js';
 import { _ as _sfc_main$1 } from '../Popper/PopperRoot.js';
 import { useVModel } from '@vueuse/core';
-import { c as compare } from './utils.js';
+import { _ as _sfc_main$2 } from './BubbleSelect.js';
 import { u as useCollection } from '../Collection/Collection.js';
+import { c as compare } from './utils.js';
 import { c as createContext } from '../shared/createContext.js';
 import { u as useDirection } from '../shared/useDirection.js';
 import { u as useFormControl } from '../shared/useFormControl.js';

package/dist/Select/SelectRoot.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectRoot.js","sources":["../../src/Select/SelectRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { Ref } from 'vue'\nimport type { AcceptableValue, Direction, FormFieldProps } from '@/shared/types'\nimport { createContext, isNullish, useDirection, useFormControl } from '@/shared'\nimport { compare } from './utils'\nimport { useCollection } from '@/Collection'\n\nexport interface SelectRootProps<T = AcceptableValue> extends FormFieldProps {\n  /** The controlled open state of the Select. Can be bind as `v-model:open`. */\n  open?: boolean\n  /** The open state of the select when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: boolean\n  /** The value of the select when initially rendered. Use when you do not need to control the state of the Select */\n  defaultValue?: T | Array<T>\n  /** The controlled value of the Select. Can be bind as `v-model`. */\n  modelValue?: T | Array<T>\n  /** Use this to compare objects by a particular field, or pass your own comparison function for complete control over how objects are compared. */\n  by?: string | ((a: T, b: T) => boolean)\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** Whether multiple options can be selected or not. */\n  multiple?: boolean\n  /** Native html input `autocomplete` attribute. */\n  autocomplete?: string\n  /** When `true`, prevents the user from interacting with Select */\n  disabled?: boolean\n}\n\nexport type SelectRootEmits<T = AcceptableValue> = {\n  /** Event handler called when the value changes. */\n  'update:modelValue': [value: T]\n  /** Event handler called when the open state of the context menu changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface SelectRootContext<T> {\n  triggerElement: Ref<HTMLElement | undefined>\n  onTriggerChange: (node: HTMLElement | undefined) => void\n  valueElement: Ref<HTMLElement | undefined>\n  onValueElementChange: (node: HTMLElement) => void\n  contentId: string\n  modelValue: Ref<T | Array<T> | undefined>\n  onValueChange: (value: T) => void\n  open: Ref<boolean>\n  multiple: Ref<boolean>\n  required?: Ref<boolean>\n  by?: string | ((a: T, b: T) => boolean)\n  onOpenChange: (open: boolean) => void\n  dir: Ref<Direction>\n  triggerPointerDownPosRef: Ref<{ x: number, y: number } | null>\n  isEmptyModelValue: Ref<boolean>\n  disabled?: Ref<boolean>\n\n  optionsSet: Ref<Set<SelectOption>>\n  onOptionAdd: (option: SelectOption) => void\n  onOptionRemove: (option: SelectOption) => void\n}\n\nexport const [injectSelectRootContext, provideSelectRootContext]\n  = createContext<SelectRootContext<AcceptableValue>>('SelectRoot')\n\ninterface SelectOption { value: any, disabled?: boolean, textContent: string }\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { computed, ref, toRefs } from 'vue'\nimport BubbleSelect from './BubbleSelect.vue'\nimport { PopperRoot } from '@/Popper'\nimport { useVModel } from '@vueuse/core'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectRootProps>(), {\n  modelValue: undefined,\n  open: undefined,\n})\nconst emits = defineEmits<SelectRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { required, disabled, multiple, dir: propDir } = toRefs(props)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue ?? (multiple.value ? [] : undefined),\n  passive: (props.modelValue === undefined) as false,\n  deep: true,\n}) as Ref<T | T[] | undefined>\n\nconst open = useVModel(props, 'open', emits, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst triggerElement = ref<HTMLElement>()\nconst valueElement = ref<HTMLElement>()\nconst triggerPointerDownPosRef = ref({\n  x: 0,\n  y: 0,\n})\n\nconst isEmptyModelValue = computed(() => {\n  if (multiple.value && Array.isArray(modelValue.value))\n    return modelValue.value?.length === 0\n  else\n    return isNullish(modelValue.value)\n})\n\nuseCollection({ isProvider: true })\nconst dir = useDirection(propDir)\n\nconst isFormControl = useFormControl(triggerElement)\nconst optionsSet = ref<Set<SelectOption>>(new Set())\n\n// The native `select` only associates the correct default value if the corresponding\n// `option` is rendered as a child **at the same time** as itself.\n// Because it might take a few renders for our items to gather the information to build\n// the native `option`(s), we generate a key on the `select` to make sure Vue re-builds it\n// each time the options change.\nconst nativeSelectKey = computed(() => {\n  return Array.from(optionsSet.value)\n    .map(option => option.value)\n    .join(';')\n})\n\nfunction handleValueChange(value: T) {\n  if (multiple.value) {\n    const array = Array.isArray(modelValue.value) ? [...modelValue.value] : []\n    const index = array.findIndex(i => compare(i, value, props.by))\n    index === -1 ? array.push(value) : array.splice(index, 1)\n    modelValue.value = [...array]\n  }\n  else {\n    modelValue.value = value\n  }\n}\n\nprovideSelectRootContext({\n  triggerElement,\n  onTriggerChange: (node) => {\n    triggerElement.value = node\n  },\n  valueElement,\n  onValueElementChange: (node) => {\n    valueElement.value = node\n  },\n  contentId: '',\n  modelValue,\n  // @ts-expect-error Missing infer for AcceptableValue\n  onValueChange: handleValueChange,\n  by: props.by,\n  open,\n  multiple,\n  required,\n  onOpenChange: (value) => {\n    open.value = value\n  },\n  dir,\n  triggerPointerDownPosRef,\n  disabled,\n  isEmptyModelValue,\n\n  optionsSet,\n  onOptionAdd: option => optionsSet.value.add(option),\n  onOptionRemove: option => optionsSet.value.delete(option),\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot\n      :model-value=\"modelValue\"\n      :open=\"open\"\n    />\n\n    <BubbleSelect\n      v-if=\"isFormControl\"\n      :key=\"nativeSelectKey\"\n      aria-hidden=\"true\"\n      tabindex=\"-1\"\n      :multiple=\"multiple\"\n      :required=\"required\"\n      :name=\"name\"\n      :autocomplete=\"autocomplete\"\n      :disabled=\"disabled\"\n      :value=\"modelValue\"\n    >\n      <option\n        v-if=\"isNullish(modelValue)\"\n        value=\"\"\n      />\n      <option\n        v-for=\"option in Array.from(optionsSet)\"\n        :key=\"option.value ?? ''\"\n        v-bind=\"option\"\n      />\n    </BubbleSelect>\n  </PopperRoot>\n</template>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SelectRoot.js","sources":["../../src/Select/SelectRoot.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { AcceptableValue, Direction, FormFieldProps } from '@/shared/types'\nimport type { Ref } from 'vue'\nimport { useCollection } from '@/Collection'\nimport { createContext, isNullish, useDirection, useFormControl } from '@/shared'\nimport { compare } from './utils'\n\nexport interface SelectRootProps<T = AcceptableValue> extends FormFieldProps {\n  /** The controlled open state of the Select. Can be bind as `v-model:open`. */\n  open?: boolean\n  /** The open state of the select when it is initially rendered. Use when you do not need to control its open state. */\n  defaultOpen?: boolean\n  /** The value of the select when initially rendered. Use when you do not need to control the state of the Select */\n  defaultValue?: T | Array<T>\n  /** The controlled value of the Select. Can be bind as `v-model`. */\n  modelValue?: T | Array<T>\n  /** Use this to compare objects by a particular field, or pass your own comparison function for complete control over how objects are compared. */\n  by?: string | ((a: T, b: T) => boolean)\n  /** The reading direction of the combobox when applicable. <br> If omitted, inherits globally from `ConfigProvider` or assumes LTR (left-to-right) reading mode. */\n  dir?: Direction\n  /** Whether multiple options can be selected or not. */\n  multiple?: boolean\n  /** Native html input `autocomplete` attribute. */\n  autocomplete?: string\n  /** When `true`, prevents the user from interacting with Select */\n  disabled?: boolean\n}\n\nexport type SelectRootEmits<T = AcceptableValue> = {\n  /** Event handler called when the value changes. */\n  'update:modelValue': [value: T]\n  /** Event handler called when the open state of the context menu changes. */\n  'update:open': [value: boolean]\n}\n\nexport interface SelectRootContext<T> {\n  triggerElement: Ref<HTMLElement | undefined>\n  onTriggerChange: (node: HTMLElement | undefined) => void\n  valueElement: Ref<HTMLElement | undefined>\n  onValueElementChange: (node: HTMLElement) => void\n  contentId: string\n  modelValue: Ref<T | Array<T> | undefined>\n  onValueChange: (value: T) => void\n  open: Ref<boolean>\n  multiple: Ref<boolean>\n  required?: Ref<boolean>\n  by?: string | ((a: T, b: T) => boolean)\n  onOpenChange: (open: boolean) => void\n  dir: Ref<Direction>\n  triggerPointerDownPosRef: Ref<{ x: number, y: number } | null>\n  isEmptyModelValue: Ref<boolean>\n  disabled?: Ref<boolean>\n\n  optionsSet: Ref<Set<SelectOption>>\n  onOptionAdd: (option: SelectOption) => void\n  onOptionRemove: (option: SelectOption) => void\n}\n\nexport const [injectSelectRootContext, provideSelectRootContext]\n  = createContext<SelectRootContext<AcceptableValue>>('SelectRoot')\n\ninterface SelectOption { value: any, disabled?: boolean, textContent: string }\n</script>\n\n<script setup lang=\"ts\" generic=\"T extends AcceptableValue = AcceptableValue\">\nimport { PopperRoot } from '@/Popper'\nimport { useVModel } from '@vueuse/core'\nimport { computed, ref, toRefs } from 'vue'\nimport BubbleSelect from './BubbleSelect.vue'\n\ndefineOptions({\n  inheritAttrs: false,\n})\n\nconst props = withDefaults(defineProps<SelectRootProps>(), {\n  modelValue: undefined,\n  open: undefined,\n})\nconst emits = defineEmits<SelectRootEmits>()\n\ndefineSlots<{\n  default: (props: {\n    /** Current input values */\n    modelValue: typeof modelValue.value\n    /** Current open state */\n    open: typeof open.value\n  }) => any\n}>()\n\nconst { required, disabled, multiple, dir: propDir } = toRefs(props)\n\nconst modelValue = useVModel(props, 'modelValue', emits, {\n  defaultValue: props.defaultValue ?? (multiple.value ? [] : undefined),\n  passive: (props.modelValue === undefined) as false,\n  deep: true,\n}) as Ref<T | T[] | undefined>\n\nconst open = useVModel(props, 'open', emits, {\n  defaultValue: props.defaultOpen,\n  passive: (props.open === undefined) as false,\n}) as Ref<boolean>\n\nconst triggerElement = ref<HTMLElement>()\nconst valueElement = ref<HTMLElement>()\nconst triggerPointerDownPosRef = ref({\n  x: 0,\n  y: 0,\n})\n\nconst isEmptyModelValue = computed(() => {\n  if (multiple.value && Array.isArray(modelValue.value))\n    return modelValue.value?.length === 0\n  else\n    return isNullish(modelValue.value)\n})\n\nuseCollection({ isProvider: true })\nconst dir = useDirection(propDir)\n\nconst isFormControl = useFormControl(triggerElement)\nconst optionsSet = ref<Set<SelectOption>>(new Set())\n\n// The native `select` only associates the correct default value if the corresponding\n// `option` is rendered as a child **at the same time** as itself.\n// Because it might take a few renders for our items to gather the information to build\n// the native `option`(s), we generate a key on the `select` to make sure Vue re-builds it\n// each time the options change.\nconst nativeSelectKey = computed(() => {\n  return Array.from(optionsSet.value)\n    .map(option => option.value)\n    .join(';')\n})\n\nfunction handleValueChange(value: T) {\n  if (multiple.value) {\n    const array = Array.isArray(modelValue.value) ? [...modelValue.value] : []\n    const index = array.findIndex(i => compare(i, value, props.by))\n    index === -1 ? array.push(value) : array.splice(index, 1)\n    modelValue.value = [...array]\n  }\n  else {\n    modelValue.value = value\n  }\n}\n\nprovideSelectRootContext({\n  triggerElement,\n  onTriggerChange: (node) => {\n    triggerElement.value = node\n  },\n  valueElement,\n  onValueElementChange: (node) => {\n    valueElement.value = node\n  },\n  contentId: '',\n  modelValue,\n  // @ts-expect-error Missing infer for AcceptableValue\n  onValueChange: handleValueChange,\n  by: props.by,\n  open,\n  multiple,\n  required,\n  onOpenChange: (value) => {\n    open.value = value\n  },\n  dir,\n  triggerPointerDownPosRef,\n  disabled,\n  isEmptyModelValue,\n\n  optionsSet,\n  onOptionAdd: option => optionsSet.value.add(option),\n  onOptionRemove: option => optionsSet.value.delete(option),\n})\n</script>\n\n<template>\n  <PopperRoot>\n    <slot\n      :model-value=\"modelValue\"\n      :open=\"open\"\n    />\n\n    <BubbleSelect\n      v-if=\"isFormControl\"\n      :key=\"nativeSelectKey\"\n      aria-hidden=\"true\"\n      tabindex=\"-1\"\n      :multiple=\"multiple\"\n      :required=\"required\"\n      :name=\"name\"\n      :autocomplete=\"autocomplete\"\n      :disabled=\"disabled\"\n      :value=\"modelValue\"\n    >\n      <option\n        v-if=\"isNullish(modelValue)\"\n        value=\"\"\n      />\n      <option\n        v-for=\"option in Array.from(optionsSet)\"\n        :key=\"option.value ?? ''\"\n        v-bind=\"option\"\n      />\n    </BubbleSelect>\n  </PopperRoot>\n</template>\n"],"names":[],"mappings":"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"}

package/dist/Select/SelectScrollButtonImpl.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectScrollButtonImpl.cjs","sources":["../../src/Select/SelectScrollButtonImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, ref, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { Primitive } from '@/Primitive'\nimport { useCollection } from '@/Collection'\nimport { getActiveElement } from '@/shared'\n\nexport type SelectScrollButtonImplEmits = {\n  autoScroll: []\n}\n\nconst emits = defineEmits<SelectScrollButtonImplEmits>()\nconst { getItems } = useCollection()\n\nconst contentContext = injectSelectContentContext()\nconst autoScrollTimerRef = ref<number | null>(null)\n\nfunction clearAutoScrollTimer() {\n  if (autoScrollTimerRef.value !== null) {\n    window.clearInterval(autoScrollTimerRef.value)\n    autoScrollTimerRef.value = null\n  }\n}\n\nwatchEffect(() => {\n  const activeItem = getItems().map(i => i.ref).find(\n    item => item === getActiveElement(),\n  )\n  activeItem?.scrollIntoView({ block: 'nearest' })\n})\n\nfunction handlePointerDown() {\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nfunction handlePointerMove() {\n  contentContext.onItemLeave?.()\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nonBeforeUnmount(() => clearAutoScrollTimer())\n</script>\n\n<template>\n  <Primitive\n    aria-hidden=\"true\"\n    :style=\"{\n      flexShrink: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerleave=\"\n      () => {\n        clearAutoScrollTimer();\n      }\n    \"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["useCollection","injectSelectContentContext","ref","watchEffect","getActiveElement","onBeforeUnmount"],"mappings":";;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,EAAE,QAAS,EAAA,GAAIA,mCAAc,EAAA;AAEnC,IAAA,MAAM,iBAAiBC,mDAA2B,EAAA;AAClD,IAAM,MAAA,kBAAA,GAAqBC,QAAmB,IAAI,CAAA;AAElD,IAAA,SAAS,oBAAuB,GAAA;AAC9B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAO,MAAA,CAAA,aAAA,CAAc,mBAAmB,KAAK,CAAA;AAC7C,QAAA,kBAAA,CAAmB,KAAQ,GAAA,IAAA;AAAA;AAC7B;AAGF,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,MAAM,aAAa,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAE,CAAA,IAAA;AAAA,QAC5C,CAAA,IAAA,KAAQ,SAASC,wCAAiB;AAAA,OACpC;AACA,MAAA,UAAA,EAAY,cAAe,CAAA,EAAE,KAAO,EAAA,SAAA,EAAW,CAAA;AAAA,KAChD,CAAA;AAED,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAA,cAAA,CAAe,WAAc,IAAA;AAC7B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAgBC,mBAAA,CAAA,MAAM,sBAAsB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectScrollButtonImpl.cjs","sources":["../../src/Select/SelectScrollButtonImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { getActiveElement } from '@/shared'\nimport { onBeforeUnmount, ref, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\n\nexport type SelectScrollButtonImplEmits = {\n  autoScroll: []\n}\n\nconst emits = defineEmits<SelectScrollButtonImplEmits>()\nconst { getItems } = useCollection()\n\nconst contentContext = injectSelectContentContext()\nconst autoScrollTimerRef = ref<number | null>(null)\n\nfunction clearAutoScrollTimer() {\n  if (autoScrollTimerRef.value !== null) {\n    window.clearInterval(autoScrollTimerRef.value)\n    autoScrollTimerRef.value = null\n  }\n}\n\nwatchEffect(() => {\n  const activeItem = getItems().map(i => i.ref).find(\n    item => item === getActiveElement(),\n  )\n  activeItem?.scrollIntoView({ block: 'nearest' })\n})\n\nfunction handlePointerDown() {\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nfunction handlePointerMove() {\n  contentContext.onItemLeave?.()\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nonBeforeUnmount(() => clearAutoScrollTimer())\n</script>\n\n<template>\n  <Primitive\n    aria-hidden=\"true\"\n    :style=\"{\n      flexShrink: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerleave=\"\n      () => {\n        clearAutoScrollTimer();\n      }\n    \"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":["useCollection","injectSelectContentContext","ref","watchEffect","getActiveElement","onBeforeUnmount"],"mappings":";;;;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,EAAE,QAAS,EAAA,GAAIA,mCAAc,EAAA;AAEnC,IAAA,MAAM,iBAAiBC,mDAA2B,EAAA;AAClD,IAAM,MAAA,kBAAA,GAAqBC,QAAmB,IAAI,CAAA;AAElD,IAAA,SAAS,oBAAuB,GAAA;AAC9B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAO,MAAA,CAAA,aAAA,CAAc,mBAAmB,KAAK,CAAA;AAC7C,QAAA,kBAAA,CAAmB,KAAQ,GAAA,IAAA;AAAA;AAC7B;AAGF,IAAAC,eAAA,CAAY,MAAM;AAChB,MAAA,MAAM,aAAa,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAE,CAAA,IAAA;AAAA,QAC5C,CAAA,IAAA,KAAQ,SAASC,wCAAiB;AAAA,OACpC;AACA,MAAA,UAAA,EAAY,cAAe,CAAA,EAAE,KAAO,EAAA,SAAA,EAAW,CAAA;AAAA,KAChD,CAAA;AAED,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAA,cAAA,CAAe,WAAc,IAAA;AAC7B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAgBC,mBAAA,CAAA,MAAM,sBAAsB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectScrollButtonImpl.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectScrollButtonImpl.js","sources":["../../src/Select/SelectScrollButtonImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onBeforeUnmount, ref, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { Primitive } from '@/Primitive'\nimport { useCollection } from '@/Collection'\nimport { getActiveElement } from '@/shared'\n\nexport type SelectScrollButtonImplEmits = {\n  autoScroll: []\n}\n\nconst emits = defineEmits<SelectScrollButtonImplEmits>()\nconst { getItems } = useCollection()\n\nconst contentContext = injectSelectContentContext()\nconst autoScrollTimerRef = ref<number | null>(null)\n\nfunction clearAutoScrollTimer() {\n  if (autoScrollTimerRef.value !== null) {\n    window.clearInterval(autoScrollTimerRef.value)\n    autoScrollTimerRef.value = null\n  }\n}\n\nwatchEffect(() => {\n  const activeItem = getItems().map(i => i.ref).find(\n    item => item === getActiveElement(),\n  )\n  activeItem?.scrollIntoView({ block: 'nearest' })\n})\n\nfunction handlePointerDown() {\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nfunction handlePointerMove() {\n  contentContext.onItemLeave?.()\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nonBeforeUnmount(() => clearAutoScrollTimer())\n</script>\n\n<template>\n  <Primitive\n    aria-hidden=\"true\"\n    :style=\"{\n      flexShrink: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerleave=\"\n      () => {\n        clearAutoScrollTimer();\n      }\n    \"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,EAAE,QAAS,EAAA,GAAI,aAAc,EAAA;AAEnC,IAAA,MAAM,iBAAiB,0BAA2B,EAAA;AAClD,IAAM,MAAA,kBAAA,GAAqB,IAAmB,IAAI,CAAA;AAElD,IAAA,SAAS,oBAAuB,GAAA;AAC9B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAO,MAAA,CAAA,aAAA,CAAc,mBAAmB,KAAK,CAAA;AAC7C,QAAA,kBAAA,CAAmB,KAAQ,GAAA,IAAA;AAAA;AAC7B;AAGF,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,MAAM,aAAa,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAE,CAAA,IAAA;AAAA,QAC5C,CAAA,IAAA,KAAQ,SAAS,gBAAiB;AAAA,OACpC;AACA,MAAA,UAAA,EAAY,cAAe,CAAA,EAAE,KAAO,EAAA,SAAA,EAAW,CAAA;AAAA,KAChD,CAAA;AAED,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAA,cAAA,CAAe,WAAc,IAAA;AAC7B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAgB,eAAA,CAAA,MAAM,sBAAsB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectScrollButtonImpl.js","sources":["../../src/Select/SelectScrollButtonImpl.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useCollection } from '@/Collection'\nimport { Primitive } from '@/Primitive'\nimport { getActiveElement } from '@/shared'\nimport { onBeforeUnmount, ref, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\n\nexport type SelectScrollButtonImplEmits = {\n  autoScroll: []\n}\n\nconst emits = defineEmits<SelectScrollButtonImplEmits>()\nconst { getItems } = useCollection()\n\nconst contentContext = injectSelectContentContext()\nconst autoScrollTimerRef = ref<number | null>(null)\n\nfunction clearAutoScrollTimer() {\n  if (autoScrollTimerRef.value !== null) {\n    window.clearInterval(autoScrollTimerRef.value)\n    autoScrollTimerRef.value = null\n  }\n}\n\nwatchEffect(() => {\n  const activeItem = getItems().map(i => i.ref).find(\n    item => item === getActiveElement(),\n  )\n  activeItem?.scrollIntoView({ block: 'nearest' })\n})\n\nfunction handlePointerDown() {\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nfunction handlePointerMove() {\n  contentContext.onItemLeave?.()\n  if (autoScrollTimerRef.value === null) {\n    autoScrollTimerRef.value = window.setInterval(() => {\n      emits('autoScroll')\n    }, 50)\n  }\n}\n\nonBeforeUnmount(() => clearAutoScrollTimer())\n</script>\n\n<template>\n  <Primitive\n    aria-hidden=\"true\"\n    :style=\"{\n      flexShrink: 0,\n    }\"\n    v-bind=\"$parent?.$props\"\n    @pointerdown=\"handlePointerDown\"\n    @pointermove=\"handlePointerMove\"\n    @pointerleave=\"\n      () => {\n        clearAutoScrollTimer();\n      }\n    \"\n  >\n    <slot />\n  </Primitive>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;AAWA,IAAA,MAAM,KAAQ,GAAA,MAAA;AACd,IAAM,MAAA,EAAE,QAAS,EAAA,GAAI,aAAc,EAAA;AAEnC,IAAA,MAAM,iBAAiB,0BAA2B,EAAA;AAClD,IAAM,MAAA,kBAAA,GAAqB,IAAmB,IAAI,CAAA;AAElD,IAAA,SAAS,oBAAuB,GAAA;AAC9B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAO,MAAA,CAAA,aAAA,CAAc,mBAAmB,KAAK,CAAA;AAC7C,QAAA,kBAAA,CAAmB,KAAQ,GAAA,IAAA;AAAA;AAC7B;AAGF,IAAA,WAAA,CAAY,MAAM;AAChB,MAAA,MAAM,aAAa,QAAS,EAAA,CAAE,IAAI,CAAK,CAAA,KAAA,CAAA,CAAE,GAAG,CAAE,CAAA,IAAA;AAAA,QAC5C,CAAA,IAAA,KAAQ,SAAS,gBAAiB;AAAA,OACpC;AACA,MAAA,UAAA,EAAY,cAAe,CAAA,EAAE,KAAO,EAAA,SAAA,EAAW,CAAA;AAAA,KAChD,CAAA;AAED,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAA,SAAS,iBAAoB,GAAA;AAC3B,MAAA,cAAA,CAAe,WAAc,IAAA;AAC7B,MAAI,IAAA,kBAAA,CAAmB,UAAU,IAAM,EAAA;AACrC,QAAmB,kBAAA,CAAA,KAAA,GAAQ,MAAO,CAAA,WAAA,CAAY,MAAM;AAClD,UAAA,KAAA,CAAM,YAAY,CAAA;AAAA,WACjB,EAAE,CAAA;AAAA;AACP;AAGF,IAAgB,eAAA,CAAA,MAAM,sBAAsB,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectScrollDownButton.cjs

@@ -2,9 +2,9 @@
 
 const vue = require('vue');
 const Select_SelectScrollButtonImpl = require('./SelectScrollButtonImpl.cjs');
+const Select_SelectItemAlignedPosition = require('./SelectItemAlignedPosition.cjs');
 const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const Select_SelectContentImpl = require('./SelectContentImpl.cjs');
-const Select_SelectItemAlignedPosition = require('./SelectItemAlignedPosition.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "SelectScrollDownButton",

package/dist/Select/SelectScrollDownButton.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"SelectScrollDownButton.cjs","sources":["../../src/Select/SelectScrollDownButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface SelectScrollDownButtonProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport SelectScrollButtonImpl from './SelectScrollButtonImpl.vue'\nimport { injectSelectItemAlignedPositionContext } from './SelectItemAlignedPosition.vue'\n\ndefineProps<SelectScrollDownButtonProps>()\n\nconst contentContext = injectSelectContentContext()\nconst alignedPositionContext\n  = contentContext.position === 'item-aligned'\n    ? injectSelectItemAlignedPositionContext()\n    : undefined\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst canScrollDown = ref(false)\n\nwatchEffect((cleanupFn) => {\n  if (contentContext.viewport?.value && contentContext.isPositioned?.value) {\n    const viewport = contentContext.viewport.value\n\n    function handleScroll() {\n      const maxScroll = viewport.scrollHeight - viewport.clientHeight\n      // we use Math.ceil here because if the UI is zoomed-in\n      // `scrollTop` is not always reported as an integer\n      canScrollDown.value = Math.ceil(viewport.scrollTop) < maxScroll\n    }\n    handleScroll()\n    viewport.addEventListener('scroll', handleScroll)\n\n    cleanupFn(() => viewport.removeEventListener('scroll', handleScroll))\n  }\n})\n\nwatch(currentElement, () => {\n  if (currentElement.value)\n    alignedPositionContext?.onScrollButtonChange(currentElement.value)\n})\n</script>\n\n<template>\n  <SelectScrollButtonImpl\n    v-if=\"canScrollDown\"\n    :ref=\"forwardRef\"\n    @auto-scroll=\"\n      () => {\n        const { viewport, selectedItem } = contentContext;\n        if (viewport?.value && selectedItem?.value) {\n          viewport.value.scrollTop = viewport.value.scrollTop + selectedItem.value.offsetHeight;\n        }\n      }\n    \"\n  >\n    <slot />\n  </SelectScrollButtonImpl>\n</template>\n"],"names":["injectSelectContentContext","injectSelectItemAlignedPositionContext","useForwardExpose","ref","watchEffect","watch"],"mappings":";;;;;;;;;;;;;;;AAeA,IAAA,MAAM,iBAAiBA,mDAA2B,EAAA;AAClD,IAAA,MAAM,sBACF,GAAA,cAAA,CAAe,QAAa,KAAA,cAAA,GAC1BC,yEACA,GAAA,MAAA;AAEN,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AAExD,IAAM,MAAA,aAAA,GAAgBC,QAAI,KAAK,CAAA;AAE/B,IAAAC,eAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAA,IAAI,cAAe,CAAA,QAAA,EAAU,KAAS,IAAA,cAAA,CAAe,cAAc,KAAO,EAAA;AAGxE,QAAA,IAAS,eAAT,WAAwB;AACtB,UAAM,MAAA,SAAA,GAAY,QAAS,CAAA,YAAA,GAAe,QAAS,CAAA,YAAA;AAGnD,UAAA,aAAA,CAAc,KAAQ,GAAA,IAAA,CAAK,IAAK,CAAA,QAAA,CAAS,SAAS,CAAI,GAAA,SAAA;AAAA,SACxD;AAPA,QAAM,MAAA,QAAA,GAAW,eAAe,QAAS,CAAA,KAAA;AAQzC,QAAa,YAAA,EAAA;AACb,QAAS,QAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAEhD,QAAA,SAAA,CAAU,MAAM,QAAA,CAAS,mBAAoB,CAAA,QAAA,EAAU,YAAY,CAAC,CAAA;AAAA;AACtE,KACD,CAAA;AAED,IAAAC,SAAA,CAAM,gBAAgB,MAAM;AAC1B,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAwB,sBAAA,EAAA,oBAAA,CAAqB,eAAe,KAAK,CAAA;AAAA,KACpE,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectScrollDownButton.cjs","sources":["../../src/Select/SelectScrollDownButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface SelectScrollDownButtonProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectItemAlignedPositionContext } from './SelectItemAlignedPosition.vue'\nimport SelectScrollButtonImpl from './SelectScrollButtonImpl.vue'\n\ndefineProps<SelectScrollDownButtonProps>()\n\nconst contentContext = injectSelectContentContext()\nconst alignedPositionContext\n  = contentContext.position === 'item-aligned'\n    ? injectSelectItemAlignedPositionContext()\n    : undefined\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst canScrollDown = ref(false)\n\nwatchEffect((cleanupFn) => {\n  if (contentContext.viewport?.value && contentContext.isPositioned?.value) {\n    const viewport = contentContext.viewport.value\n\n    function handleScroll() {\n      const maxScroll = viewport.scrollHeight - viewport.clientHeight\n      // we use Math.ceil here because if the UI is zoomed-in\n      // `scrollTop` is not always reported as an integer\n      canScrollDown.value = Math.ceil(viewport.scrollTop) < maxScroll\n    }\n    handleScroll()\n    viewport.addEventListener('scroll', handleScroll)\n\n    cleanupFn(() => viewport.removeEventListener('scroll', handleScroll))\n  }\n})\n\nwatch(currentElement, () => {\n  if (currentElement.value)\n    alignedPositionContext?.onScrollButtonChange(currentElement.value)\n})\n</script>\n\n<template>\n  <SelectScrollButtonImpl\n    v-if=\"canScrollDown\"\n    :ref=\"forwardRef\"\n    @auto-scroll=\"\n      () => {\n        const { viewport, selectedItem } = contentContext;\n        if (viewport?.value && selectedItem?.value) {\n          viewport.value.scrollTop = viewport.value.scrollTop + selectedItem.value.offsetHeight;\n        }\n      }\n    \"\n  >\n    <slot />\n  </SelectScrollButtonImpl>\n</template>\n"],"names":["injectSelectContentContext","injectSelectItemAlignedPositionContext","useForwardExpose","ref","watchEffect","watch"],"mappings":";;;;;;;;;;;;;;;AAeA,IAAA,MAAM,iBAAiBA,mDAA2B,EAAA;AAClD,IAAA,MAAM,sBACF,GAAA,cAAA,CAAe,QAAa,KAAA,cAAA,GAC1BC,yEACA,GAAA,MAAA;AAEN,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAIC,wCAAiB,EAAA;AAExD,IAAM,MAAA,aAAA,GAAgBC,QAAI,KAAK,CAAA;AAE/B,IAAAC,eAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAA,IAAI,cAAe,CAAA,QAAA,EAAU,KAAS,IAAA,cAAA,CAAe,cAAc,KAAO,EAAA;AAGxE,QAAA,IAAS,eAAT,WAAwB;AACtB,UAAM,MAAA,SAAA,GAAY,QAAS,CAAA,YAAA,GAAe,QAAS,CAAA,YAAA;AAGnD,UAAA,aAAA,CAAc,KAAQ,GAAA,IAAA,CAAK,IAAK,CAAA,QAAA,CAAS,SAAS,CAAI,GAAA,SAAA;AAAA,SACxD;AAPA,QAAM,MAAA,QAAA,GAAW,eAAe,QAAS,CAAA,KAAA;AAQzC,QAAa,YAAA,EAAA;AACb,QAAS,QAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAEhD,QAAA,SAAA,CAAU,MAAM,QAAA,CAAS,mBAAoB,CAAA,QAAA,EAAU,YAAY,CAAC,CAAA;AAAA;AACtE,KACD,CAAA;AAED,IAAAC,SAAA,CAAM,gBAAgB,MAAM;AAC1B,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAwB,sBAAA,EAAA,oBAAA,CAAqB,eAAe,KAAK,CAAA;AAAA,KACpE,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectScrollDownButton.js

@@ -1,8 +1,8 @@
 import { defineComponent, ref, watchEffect, watch, createBlock, createCommentVNode, openBlock, unref, withCtx, renderSlot } from 'vue';
 import { _ as _sfc_main$1 } from './SelectScrollButtonImpl.js';
+import { i as injectSelectItemAlignedPositionContext } from './SelectItemAlignedPosition.js';
 import { u as useForwardExpose } from '../shared/useForwardExpose.js';
 import { i as injectSelectContentContext } from './SelectContentImpl.js';
-import { i as injectSelectItemAlignedPositionContext } from './SelectItemAlignedPosition.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "SelectScrollDownButton",

package/dist/Select/SelectScrollDownButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectScrollDownButton.js","sources":["../../src/Select/SelectScrollDownButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface SelectScrollDownButtonProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport SelectScrollButtonImpl from './SelectScrollButtonImpl.vue'\nimport { injectSelectItemAlignedPositionContext } from './SelectItemAlignedPosition.vue'\n\ndefineProps<SelectScrollDownButtonProps>()\n\nconst contentContext = injectSelectContentContext()\nconst alignedPositionContext\n  = contentContext.position === 'item-aligned'\n    ? injectSelectItemAlignedPositionContext()\n    : undefined\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst canScrollDown = ref(false)\n\nwatchEffect((cleanupFn) => {\n  if (contentContext.viewport?.value && contentContext.isPositioned?.value) {\n    const viewport = contentContext.viewport.value\n\n    function handleScroll() {\n      const maxScroll = viewport.scrollHeight - viewport.clientHeight\n      // we use Math.ceil here because if the UI is zoomed-in\n      // `scrollTop` is not always reported as an integer\n      canScrollDown.value = Math.ceil(viewport.scrollTop) < maxScroll\n    }\n    handleScroll()\n    viewport.addEventListener('scroll', handleScroll)\n\n    cleanupFn(() => viewport.removeEventListener('scroll', handleScroll))\n  }\n})\n\nwatch(currentElement, () => {\n  if (currentElement.value)\n    alignedPositionContext?.onScrollButtonChange(currentElement.value)\n})\n</script>\n\n<template>\n  <SelectScrollButtonImpl\n    v-if=\"canScrollDown\"\n    :ref=\"forwardRef\"\n    @auto-scroll=\"\n      () => {\n        const { viewport, selectedItem } = contentContext;\n        if (viewport?.value && selectedItem?.value) {\n          viewport.value.scrollTop = viewport.value.scrollTop + selectedItem.value.offsetHeight;\n        }\n      }\n    \"\n  >\n    <slot />\n  </SelectScrollButtonImpl>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAeA,IAAA,MAAM,iBAAiB,0BAA2B,EAAA;AAClD,IAAA,MAAM,sBACF,GAAA,cAAA,CAAe,QAAa,KAAA,cAAA,GAC1B,wCACA,GAAA,MAAA;AAEN,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AAExD,IAAM,MAAA,aAAA,GAAgB,IAAI,KAAK,CAAA;AAE/B,IAAA,WAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAA,IAAI,cAAe,CAAA,QAAA,EAAU,KAAS,IAAA,cAAA,CAAe,cAAc,KAAO,EAAA;AAGxE,QAAA,IAAS,eAAT,WAAwB;AACtB,UAAM,MAAA,SAAA,GAAY,QAAS,CAAA,YAAA,GAAe,QAAS,CAAA,YAAA;AAGnD,UAAA,aAAA,CAAc,KAAQ,GAAA,IAAA,CAAK,IAAK,CAAA,QAAA,CAAS,SAAS,CAAI,GAAA,SAAA;AAAA,SACxD;AAPA,QAAM,MAAA,QAAA,GAAW,eAAe,QAAS,CAAA,KAAA;AAQzC,QAAa,YAAA,EAAA;AACb,QAAS,QAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAEhD,QAAA,SAAA,CAAU,MAAM,QAAA,CAAS,mBAAoB,CAAA,QAAA,EAAU,YAAY,CAAC,CAAA;AAAA;AACtE,KACD,CAAA;AAED,IAAA,KAAA,CAAM,gBAAgB,MAAM;AAC1B,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAwB,sBAAA,EAAA,oBAAA,CAAqB,eAAe,KAAK,CAAA;AAAA,KACpE,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"SelectScrollDownButton.js","sources":["../../src/Select/SelectScrollDownButton.vue"],"sourcesContent":["<script lang=\"ts\">\nimport type { PrimitiveProps } from '@/Primitive'\nimport { useForwardExpose } from '@/shared'\n\nexport interface SelectScrollDownButtonProps extends PrimitiveProps {}\n</script>\n\n<script setup lang=\"ts\">\nimport { ref, watch, watchEffect } from 'vue'\nimport { injectSelectContentContext } from './SelectContentImpl.vue'\nimport { injectSelectItemAlignedPositionContext } from './SelectItemAlignedPosition.vue'\nimport SelectScrollButtonImpl from './SelectScrollButtonImpl.vue'\n\ndefineProps<SelectScrollDownButtonProps>()\n\nconst contentContext = injectSelectContentContext()\nconst alignedPositionContext\n  = contentContext.position === 'item-aligned'\n    ? injectSelectItemAlignedPositionContext()\n    : undefined\n\nconst { forwardRef, currentElement } = useForwardExpose()\n\nconst canScrollDown = ref(false)\n\nwatchEffect((cleanupFn) => {\n  if (contentContext.viewport?.value && contentContext.isPositioned?.value) {\n    const viewport = contentContext.viewport.value\n\n    function handleScroll() {\n      const maxScroll = viewport.scrollHeight - viewport.clientHeight\n      // we use Math.ceil here because if the UI is zoomed-in\n      // `scrollTop` is not always reported as an integer\n      canScrollDown.value = Math.ceil(viewport.scrollTop) < maxScroll\n    }\n    handleScroll()\n    viewport.addEventListener('scroll', handleScroll)\n\n    cleanupFn(() => viewport.removeEventListener('scroll', handleScroll))\n  }\n})\n\nwatch(currentElement, () => {\n  if (currentElement.value)\n    alignedPositionContext?.onScrollButtonChange(currentElement.value)\n})\n</script>\n\n<template>\n  <SelectScrollButtonImpl\n    v-if=\"canScrollDown\"\n    :ref=\"forwardRef\"\n    @auto-scroll=\"\n      () => {\n        const { viewport, selectedItem } = contentContext;\n        if (viewport?.value && selectedItem?.value) {\n          viewport.value.scrollTop = viewport.value.scrollTop + selectedItem.value.offsetHeight;\n        }\n      }\n    \"\n  >\n    <slot />\n  </SelectScrollButtonImpl>\n</template>\n"],"names":[],"mappings":";;;;;;;;;;;;;AAeA,IAAA,MAAM,iBAAiB,0BAA2B,EAAA;AAClD,IAAA,MAAM,sBACF,GAAA,cAAA,CAAe,QAAa,KAAA,cAAA,GAC1B,wCACA,GAAA,MAAA;AAEN,IAAA,MAAM,EAAE,UAAA,EAAY,cAAe,EAAA,GAAI,gBAAiB,EAAA;AAExD,IAAM,MAAA,aAAA,GAAgB,IAAI,KAAK,CAAA;AAE/B,IAAA,WAAA,CAAY,CAAC,SAAc,KAAA;AACzB,MAAA,IAAI,cAAe,CAAA,QAAA,EAAU,KAAS,IAAA,cAAA,CAAe,cAAc,KAAO,EAAA;AAGxE,QAAA,IAAS,eAAT,WAAwB;AACtB,UAAM,MAAA,SAAA,GAAY,QAAS,CAAA,YAAA,GAAe,QAAS,CAAA,YAAA;AAGnD,UAAA,aAAA,CAAc,KAAQ,GAAA,IAAA,CAAK,IAAK,CAAA,QAAA,CAAS,SAAS,CAAI,GAAA,SAAA;AAAA,SACxD;AAPA,QAAM,MAAA,QAAA,GAAW,eAAe,QAAS,CAAA,KAAA;AAQzC,QAAa,YAAA,EAAA;AACb,QAAS,QAAA,CAAA,gBAAA,CAAiB,UAAU,YAAY,CAAA;AAEhD,QAAA,SAAA,CAAU,MAAM,QAAA,CAAS,mBAAoB,CAAA,QAAA,EAAU,YAAY,CAAC,CAAA;AAAA;AACtE,KACD,CAAA;AAED,IAAA,KAAA,CAAM,gBAAgB,MAAM;AAC1B,MAAA,IAAI,cAAe,CAAA,KAAA;AACjB,QAAwB,sBAAA,EAAA,oBAAA,CAAqB,eAAe,KAAK,CAAA;AAAA,KACpE,CAAA;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/Select/SelectTrigger.cjs

@@ -1,14 +1,14 @@
 'use strict';
 
 const vue = require('vue');
-const Select_utils = require('./utils.cjs');
 const Popper_PopperAnchor = require('../Popper/PopperAnchor.cjs');
+const Select_utils = require('./utils.cjs');
 const Collection_Collection = require('../Collection/Collection.cjs');
-const Select_SelectRoot = require('./SelectRoot.cjs');
 const shared_useForwardExpose = require('../shared/useForwardExpose.cjs');
 const shared_useId = require('../shared/useId.cjs');
 const shared_useTypeahead = require('../shared/useTypeahead.cjs');
 const Primitive_Primitive = require('../Primitive/Primitive.cjs');
+const Select_SelectRoot = require('./SelectRoot.cjs');
 
 const _sfc_main = /* @__PURE__ */ vue.defineComponent({
   __name: "SelectTrigger",
@@ -60,7 +60,7 @@ const _sfc_main = /* @__PURE__ */ vue.defineComponent({
             dir: vue.unref(rootContext)?.dir.value,
             "data-state": vue.unref(rootContext)?.open.value ? "open" : "closed",
             "data-disabled": isDisabled.value ? "" : void 0,
-            "data-placeholder": vue.unref(rootContext).modelValue?.value ? void 0 : "",
+            "data-placeholder": vue.unref(Select_utils.shouldShowPlaceholder)(vue.unref(rootContext).modelValue?.value) ? "" : void 0,
             "as-child": _ctx.asChild,
             as: _ctx.as,
             onClick: _cache[0] || (_cache[0] = (event) => {