@auronui/vue 1.0.11 → 1.0.13

package/dist/components/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","names":[],"sources":["../../../src/components/select/Select.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, reactive, toRef, useAttrs, useId } from 'vue'\nimport { SelectRoot } from 'reka-ui'\nimport { selectVariants, type SelectVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSelectProvide } from './Select.context'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'flat',\n  size: 'md',\n  color: 'default',\n  labelPlacement: 'inside',\n  fullWidth: false,\n  isInvalid: false,\n  isDisabled: false,\n  isReadonly: false,\n  isRequired: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  open: undefined,\n  defaultOpen: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'update:open': [value: boolean]\n}>()\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: SelectVariants['variant']\n  /** Field height. @default 'md' */\n  size?: SelectVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: SelectVariants['color']\n  /**\n   * Where the `label` is rendered relative to the field.\n   * - `inside`: floats above the trigger (shrinks when focused/filled)\n   * - `outside`: sits above the field, static\n   * - `outside-left`: sits to the left, horizontal layout\n   * @default 'inside'\n   */\n  labelPlacement?: SelectVariants['labelPlacement']\n  /** Stretches root wrapper to 100% width. @default false */\n  fullWidth?: boolean\n  /** Marks the field as invalid. Triggers danger styling and enables `errorMessage`. @default false */\n  isInvalid?: boolean\n  /** Disables the field. @default false */\n  isDisabled?: boolean\n  /** Makes the field read-only. @default false */\n  isReadonly?: boolean\n  /** Adds a required asterisk next to the label. @default false */\n  isRequired?: boolean\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string\n  /** Form field name, for native form submission. */\n  name?: string\n  /** Field label. When omitted, the floating-label behavior is skipped. */\n  label?: string\n  /** Helper text displayed below the field. Suppressed when `isInvalid && errorMessage` is shown. */\n  description?: string\n  /** Error text displayed below the field. Only rendered when `isInvalid` is also true. */\n  errorMessage?: string\n  /** Extra classes merged onto the root wrapper via `composeClassName`. */\n  class?: string\n\n  /* ─── Select-specific ─────────────────────────────────────── */\n  /** Two-way bound selected value. */\n  modelValue?: string\n  /** Initial selected value (uncontrolled). */\n  defaultValue?: string\n  /** Controls open state of the dropdown. */\n  open?: boolean\n  /** Initial open state of the dropdown (uncontrolled). */\n  defaultOpen?: boolean\n}\n\nconst attrs = useAttrs()\nconst generatedId = useId()\nconst triggerId = computed(() => (attrs.id as string | undefined) ?? generatedId)\n\nconst hasLabel = computed(() => !!props.label)\n\n// Helper IDs / aria wiring\nconst descriptionId = computed(() => `${triggerId.value}-description`)\nconst errorMessageId = computed(() => `${triggerId.value}-error`)\nconst showError = computed(() => props.isInvalid && !!props.errorMessage)\nconst showDescription = computed(() => !!props.description && !showError.value)\nconst hasHelper = computed(() => showError.value || showDescription.value)\nconst ariaDescribedBy = computed(() => {\n  if (showError.value) return errorMessageId.value\n  if (showDescription.value) return descriptionId.value\n  return undefined\n})\n\nconst slotFns = computed(() =>\n  selectVariants({\n    variant: props.variant,\n    size: props.size,\n    color: props.color,\n    fullWidth: props.fullWidth,\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    isReadonly: props.isReadonly,\n    hasLabel: hasLabel.value,\n    labelPlacement: props.labelPlacement,\n  }),\n)\n\nconst showOutsideLabel = computed(\n  () => hasLabel.value && props.labelPlacement !== 'inside',\n)\n\n// Persistent item registry. SelectItem populates on first mount; entries\n// survive SelectContent unmount so SelectValue can render the label while\n// the popover is closed.\nconst itemRegistry = reactive(new Map<string, string>())\nconst registerItem = (value: string, label: string) => {\n  itemRegistry.set(value, label)\n}\nconst itemLabel = (value: string | string[] | undefined | null): string => {\n  if (value == null) return ''\n  if (Array.isArray(value)) {\n    return value.map(v => itemRegistry.get(v) ?? v).filter(Boolean).join(', ')\n  }\n  return itemRegistry.get(value) ?? value\n}\n\nuseSelectProvide({\n  isDisabled: toRef(props, 'isDisabled'),\n  isInvalid: toRef(props, 'isInvalid'),\n  isReadonly: toRef(props, 'isReadonly'),\n  isRequired: toRef(props, 'isRequired'),\n  fullWidth: toRef(props, 'fullWidth'),\n  hasLabel,\n  labelPlacement: toRef(props, 'labelPlacement'),\n  triggerId,\n  label: toRef(props, 'label'),\n  ariaDescribedBy,\n  slots: slotFns,\n  registerItem,\n  itemLabel,\n})\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class)\"\n    :data-invalid=\"isInvalid || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-readonly=\"isReadonly || undefined\"\n    :data-required=\"isRequired || undefined\"\n    :data-has-label=\"hasLabel || undefined\"\n    :data-has-helper=\"hasHelper || undefined\"\n  >\n    <label\n      v-if=\"showOutsideLabel\"\n      :for=\"triggerId\"\n      :class=\"slotFns.label()\"\n    >{{ label }}<span\n      v-if=\"isRequired\"\n      aria-hidden=\"true\"\n    > *</span></label>\n\n    <div :class=\"slotFns.mainWrapper()\">\n      <SelectRoot\n        :model-value=\"props.modelValue\"\n        :default-value=\"props.defaultValue\"\n        :open=\"props.open\"\n        :default-open=\"props.defaultOpen\"\n        :disabled=\"props.isDisabled\"\n        :required=\"props.isRequired\"\n        :name=\"props.name\"\n        @update:model-value=\"emit('update:modelValue', $event as string)\"\n        @update:open=\"emit('update:open', $event)\"\n      >\n        <slot />\n      </SelectRoot>\n\n      <div\n        v-if=\"hasHelper\"\n        :class=\"slotFns.helperWrapper()\"\n      >\n        <div\n          v-if=\"showError\"\n          :id=\"errorMessageId\"\n          :class=\"slotFns.errorMessage()\"\n        >\n          {{ errorMessage }}\n        </div>\n        <div\n          v-else-if=\"showDescription\"\n          :id=\"descriptionId\"\n          :class=\"slotFns.description()\"\n        >\n          {{ description }}\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Select.js","names":[],"sources":["../../../src/components/select/Select.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, reactive, toRef, useAttrs, useId, useSlots } from 'vue'\nimport { SelectRoot } from 'reka-ui'\nimport { selectVariants, type SelectVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSelectProvide, type SelectItemValue, type SelectItemData } from './Select.context'\nimport { hasSlotComponent } from '../../utils/hasSlotComponent'\nimport SelectTrigger from './SelectTrigger.vue'\nimport SelectValue from './SelectValue.vue'\nimport SelectContent from './SelectContent.vue'\nimport SelectItem from './SelectItem.vue'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'flat',\n  size: 'md',\n  color: 'default',\n  labelPlacement: 'inside',\n  fullWidth: false,\n  isInvalid: false,\n  isDisabled: false,\n  isReadonly: false,\n  isRequired: false,\n  multiple: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  open: undefined,\n  defaultOpen: undefined,\n  items: () => [],\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: SelectItemValue | SelectItemValue[]]\n  'update:open': [value: boolean]\n}>()\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: SelectVariants['variant']\n  /** Field height. @default 'md' */\n  size?: SelectVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: SelectVariants['color']\n  /**\n   * Where the `label` is rendered relative to the field.\n   * - `inside`: floats above the trigger (shrinks when focused/filled)\n   * - `outside`: sits above the field, static\n   * - `outside-left`: sits to the left, horizontal layout\n   * @default 'inside'\n   */\n  labelPlacement?: SelectVariants['labelPlacement']\n  /** Stretches root wrapper to 100% width. @default false */\n  fullWidth?: boolean\n  /** Marks the field as invalid. Triggers danger styling and enables `errorMessage`. @default false */\n  isInvalid?: boolean\n  /** Disables the field. @default false */\n  isDisabled?: boolean\n  /** Makes the field read-only. @default false */\n  isReadonly?: boolean\n  /** Adds a required asterisk next to the label. @default false */\n  isRequired?: boolean\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string\n  /** Form field name, for native form submission. */\n  name?: string\n  /** Field label. When omitted, the floating-label behavior is skipped. */\n  label?: string\n  /** Helper text displayed below the field. Suppressed when `isInvalid && errorMessage` is shown. */\n  description?: string\n  /** Error text displayed below the field. Only rendered when `isInvalid` is also true. */\n  errorMessage?: string\n  /** Extra classes merged onto the root wrapper via `composeClassName`. */\n  class?: string\n\n  /* ─── Select-specific ─────────────────────────────────────── */\n  /** Two-way bound selected value. Accepts string or numeric keys. */\n  modelValue?: SelectItemValue | SelectItemValue[]\n  /** Initial selected value (uncontrolled). Accepts string or numeric keys. */\n  defaultValue?: SelectItemValue | SelectItemValue[]\n  /** Allow selecting multiple values. modelValue becomes string[]. @default false */\n  multiple?: boolean\n  /** Controls open state of the dropdown. */\n  open?: boolean\n  /** Initial open state of the dropdown (uncontrolled). */\n  defaultOpen?: boolean\n  /**\n   * Data-driven items for the terse API. When provided (and no SelectTrigger /\n   * SelectContent is passed as a child), the trigger, value, and popover are\n   * rendered internally. Use the `#item` slot to customize per-item rendering.\n   */\n  items?: SelectItemData[]\n}\n\nconst attrs = useAttrs()\nconst generatedId = useId()\nconst triggerId = computed(() => (attrs.id as string | undefined) ?? generatedId)\n\nconst hasLabel = computed(() => !!props.label)\n\nconst slots = useSlots()\n// Tier 3 (advanced): consumer supplied explicit compound chrome → pass through.\n// Tier 1/2 (terse): render trigger/value/content internally.\nconst usesCustomChrome = computed(() =>\n  hasSlotComponent(slots.default?.(), [SelectTrigger, SelectContent]),\n)\n\n// Helper IDs / aria wiring\nconst descriptionId = computed(() => `${triggerId.value}-description`)\nconst errorMessageId = computed(() => `${triggerId.value}-error`)\nconst showError = computed(() => props.isInvalid && !!props.errorMessage)\nconst showDescription = computed(() => !!props.description && !showError.value)\nconst hasHelper = computed(() => showError.value || showDescription.value)\nconst ariaDescribedBy = computed(() => {\n  if (showError.value) return errorMessageId.value\n  if (showDescription.value) return descriptionId.value\n  return undefined\n})\n\nconst slotFns = computed(() =>\n  selectVariants({\n    variant: props.variant,\n    size: props.size,\n    color: props.color,\n    fullWidth: props.fullWidth,\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    isReadonly: props.isReadonly,\n    hasLabel: hasLabel.value,\n    labelPlacement: props.labelPlacement,\n  }),\n)\n\nconst showOutsideLabel = computed(\n  () => hasLabel.value && props.labelPlacement !== 'inside',\n)\n\n// Persistent item registry. SelectItem populates on first mount; entries\n// survive SelectContent unmount so SelectValue can render the label while\n// the popover is closed.\nconst itemRegistry = reactive(new Map<SelectItemValue, string>())\nconst registerItem = (value: SelectItemValue, label: string) => {\n  itemRegistry.set(value, label)\n}\nconst itemLabel = (value: SelectItemValue | SelectItemValue[] | undefined | null): string => {\n  if (value == null) return ''\n  if (Array.isArray(value)) {\n    // Fall back to the stringified value (handles numeric keys) when no label is\n    // registered. Filter empty strings only — never use filter(Boolean), which\n    // would drop a registered label for the numeric key 0.\n    return value\n      .map(v => String(itemRegistry.get(v) ?? v))\n      .filter(s => s.length > 0)\n      .join(', ')\n  }\n  return itemRegistry.get(value) ?? String(value)\n}\n\nfunction removeValue(value: SelectItemValue) {\n  const current = Array.isArray(props.modelValue) ? props.modelValue : []\n  emit('update:modelValue', current.filter(v => v !== value))\n}\n\nuseSelectProvide({\n  isDisabled: toRef(props, 'isDisabled'),\n  isInvalid: toRef(props, 'isInvalid'),\n  isReadonly: toRef(props, 'isReadonly'),\n  isRequired: toRef(props, 'isRequired'),\n  fullWidth: toRef(props, 'fullWidth'),\n  hasLabel,\n  labelPlacement: toRef(props, 'labelPlacement'),\n  triggerId,\n  label: toRef(props, 'label'),\n  ariaDescribedBy,\n  slots: slotFns,\n  multiple: toRef(props, 'multiple'),\n  registerItem,\n  itemLabel,\n  removeValue,\n})\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class)\"\n    :data-invalid=\"isInvalid || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-readonly=\"isReadonly || undefined\"\n    :data-required=\"isRequired || undefined\"\n    :data-has-label=\"hasLabel || undefined\"\n    :data-has-helper=\"hasHelper || undefined\"\n  >\n    <label\n      v-if=\"showOutsideLabel\"\n      :for=\"triggerId\"\n      :class=\"slotFns.label()\"\n    >{{ label }}<span\n      v-if=\"isRequired\"\n      aria-hidden=\"true\"\n    > *</span></label>\n\n    <div :class=\"slotFns.mainWrapper()\">\n      <SelectRoot\n        :model-value=\"props.modelValue\"\n        :default-value=\"props.defaultValue\"\n        :multiple=\"props.multiple\"\n        :open=\"props.open\"\n        :default-open=\"props.defaultOpen\"\n        :disabled=\"props.isDisabled\"\n        :required=\"props.isRequired\"\n        :name=\"props.name\"\n        @update:model-value=\"emit('update:modelValue', $event as SelectItemValue | SelectItemValue[])\"\n        @update:open=\"emit('update:open', $event)\"\n      >\n        <!-- Tier 3: consumer-provided compound chrome -->\n        <slot v-if=\"usesCustomChrome\" />\n        <!-- Tier 1/2: internally rendered chrome -->\n        <template v-else>\n          <SelectTrigger>\n            <SelectValue :placeholder=\"props.placeholder\" />\n          </SelectTrigger>\n          <SelectContent>\n            <SelectItem\n              v-for=\"item in props.items\"\n              :key=\"item.value\"\n              :value=\"item.value\"\n              :text-value=\"item.textValue ?? item.label\"\n              :is-disabled=\"item.isDisabled\"\n            >\n              <slot\n                name=\"item\"\n                :item=\"item\"\n              >{{ item.label ?? String(item.value) }}</slot>\n            </SelectItem>\n            <slot />\n          </SelectContent>\n        </template>\n      </SelectRoot>\n\n      <div\n        v-if=\"hasHelper\"\n        :class=\"slotFns.helperWrapper()\"\n      >\n        <div\n          v-if=\"showError\"\n          :id=\"errorMessageId\"\n          :class=\"slotFns.errorMessage()\"\n        >\n          {{ errorMessage }}\n        </div>\n        <div\n          v-else-if=\"showDescription\"\n          :id=\"descriptionId\"\n          :class=\"slotFns.description()\"\n        >\n          {{ description }}\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/select/Select.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,11 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useSelectProvide } from "./Select.context.js";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, reactive, renderSlot, toDisplayString, toRef, unref, useAttrs, useId, withCtx } from "vue";
+import { hasSlotComponent } from "../../utils/hasSlotComponent.js";
+import SelectTrigger_default from "./SelectTrigger.js";
+import SelectValue_default from "./SelectValue.js";
+import SelectContent_default from "./SelectContent.js";
+import SelectItem_default from "./SelectItem.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, reactive, renderList, renderSlot, toDisplayString, toRef, unref, useAttrs, useId, useSlots, withCtx } from "vue";
 import { selectVariants } from "@auronui/styles";
 import { SelectRoot } from "reka-ui";
 //#region src/components/select/Select.vue?vue&type=script&setup=true&lang.ts
@@ -55,6 +60,10 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 		class: {},
 		modelValue: { default: void 0 },
 		defaultValue: { default: void 0 },
+		multiple: {
+			type: Boolean,
+			default: false
+		},
 		open: {
 			type: Boolean,
 			default: void 0
@@ -62,7 +71,8 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 		defaultOpen: {
 			type: Boolean,
 			default: void 0
-		}
+		},
+		items: { default: () => [] }
 	},
 	emits: ["update:modelValue", "update:open"],
 	setup(__props, { emit: __emit }) {
@@ -72,6 +82,8 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 		const generatedId = useId();
 		const triggerId = computed(() => attrs.id ?? generatedId);
 		const hasLabel = computed(() => !!props.label);
+		const slots = useSlots();
+		const usesCustomChrome = computed(() => hasSlotComponent(slots.default?.(), [SelectTrigger_default, SelectContent_default]));
 		const descriptionId = computed(() => `${triggerId.value}-description`);
 		const errorMessageId = computed(() => `${triggerId.value}-error`);
 		const showError = computed(() => props.isInvalid && !!props.errorMessage);
@@ -99,9 +111,12 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 		};
 		const itemLabel = (value) => {
 			if (value == null) return "";
-			if (Array.isArray(value)) return value.map((v) => itemRegistry.get(v) ?? v).filter(Boolean).join(", ");
-			return itemRegistry.get(value) ?? value;
+			if (Array.isArray(value)) return value.map((v) => String(itemRegistry.get(v) ?? v)).filter((s) => s.length > 0).join(", ");
+			return itemRegistry.get(value) ?? String(value);
 		};
+		function removeValue(value) {
+			emit("update:modelValue", (Array.isArray(props.modelValue) ? props.modelValue : []).filter((v) => v !== value));
+		}
 		useSelectProvide({
 			isDisabled: toRef(props, "isDisabled"),
 			isInvalid: toRef(props, "isInvalid"),
@@ -114,8 +129,10 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 			label: toRef(props, "label"),
 			ariaDescribedBy,
 			slots: slotFns,
+			multiple: toRef(props, "multiple"),
 			registerItem,
-			itemLabel
+			itemLabel,
+			removeValue
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
@@ -133,6 +150,7 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 			}, [createTextVNode(toDisplayString(__props.label), 1), __props.isRequired ? (openBlock(), createElementBlock("span", _hoisted_3, " *")) : createCommentVNode("", true)], 10, _hoisted_2)) : createCommentVNode("", true), createElementVNode("div", { class: normalizeClass(slotFns.value.mainWrapper()) }, [createVNode(unref(SelectRoot), {
 				"model-value": props.modelValue,
 				"default-value": props.defaultValue,
+				multiple: props.multiple,
 				open: props.open,
 				"default-open": props.defaultOpen,
 				disabled: props.isDisabled,
@@ -141,11 +159,32 @@ var Select_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", $event)),
 				"onUpdate:open": _cache[1] || (_cache[1] = ($event) => emit("update:open", $event))
 			}, {
-				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+				default: withCtx(() => [usesCustomChrome.value ? renderSlot(_ctx.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [createVNode(SelectTrigger_default, null, {
+					default: withCtx(() => [createVNode(SelectValue_default, { placeholder: props.placeholder }, null, 8, ["placeholder"])]),
+					_: 1
+				}), createVNode(SelectContent_default, null, {
+					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(props.items, (item) => {
+						return openBlock(), createBlock(SelectItem_default, {
+							key: item.value,
+							value: item.value,
+							"text-value": item.textValue ?? item.label,
+							"is-disabled": item.isDisabled
+						}, {
+							default: withCtx(() => [renderSlot(_ctx.$slots, "item", { item }, () => [createTextVNode(toDisplayString(item.label ?? String(item.value)), 1)])]),
+							_: 2
+						}, 1032, [
+							"value",
+							"text-value",
+							"is-disabled"
+						]);
+					}), 128)), renderSlot(_ctx.$slots, "default")]),
+					_: 3
+				})], 64))]),
 				_: 3
 			}, 8, [
 				"model-value",
 				"default-value",
+				"multiple",
 				"open",
 				"default-open",
 				"disabled",

package/dist/components/select/Select.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/Select.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, reactive, toRef, useAttrs, useId } from 'vue'\nimport { SelectRoot } from 'reka-ui'\nimport { selectVariants, type SelectVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSelectProvide } from './Select.context'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'flat',\n  size: 'md',\n  color: 'default',\n  labelPlacement: 'inside',\n  fullWidth: false,\n  isInvalid: false,\n  isDisabled: false,\n  isReadonly: false,\n  isRequired: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  open: undefined,\n  defaultOpen: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'update:open': [value: boolean]\n}>()\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: SelectVariants['variant']\n  /** Field height. @default 'md' */\n  size?: SelectVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: SelectVariants['color']\n  /**\n   * Where the `label` is rendered relative to the field.\n   * - `inside`: floats above the trigger (shrinks when focused/filled)\n   * - `outside`: sits above the field, static\n   * - `outside-left`: sits to the left, horizontal layout\n   * @default 'inside'\n   */\n  labelPlacement?: SelectVariants['labelPlacement']\n  /** Stretches root wrapper to 100% width. @default false */\n  fullWidth?: boolean\n  /** Marks the field as invalid. Triggers danger styling and enables `errorMessage`. @default false */\n  isInvalid?: boolean\n  /** Disables the field. @default false */\n  isDisabled?: boolean\n  /** Makes the field read-only. @default false */\n  isReadonly?: boolean\n  /** Adds a required asterisk next to the label. @default false */\n  isRequired?: boolean\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string\n  /** Form field name, for native form submission. */\n  name?: string\n  /** Field label. When omitted, the floating-label behavior is skipped. */\n  label?: string\n  /** Helper text displayed below the field. Suppressed when `isInvalid && errorMessage` is shown. */\n  description?: string\n  /** Error text displayed below the field. Only rendered when `isInvalid` is also true. */\n  errorMessage?: string\n  /** Extra classes merged onto the root wrapper via `composeClassName`. */\n  class?: string\n\n  /* ─── Select-specific ─────────────────────────────────────── */\n  /** Two-way bound selected value. */\n  modelValue?: string\n  /** Initial selected value (uncontrolled). */\n  defaultValue?: string\n  /** Controls open state of the dropdown. */\n  open?: boolean\n  /** Initial open state of the dropdown (uncontrolled). */\n  defaultOpen?: boolean\n}\n\nconst attrs = useAttrs()\nconst generatedId = useId()\nconst triggerId = computed(() => (attrs.id as string | undefined) ?? generatedId)\n\nconst hasLabel = computed(() => !!props.label)\n\n// Helper IDs / aria wiring\nconst descriptionId = computed(() => `${triggerId.value}-description`)\nconst errorMessageId = computed(() => `${triggerId.value}-error`)\nconst showError = computed(() => props.isInvalid && !!props.errorMessage)\nconst showDescription = computed(() => !!props.description && !showError.value)\nconst hasHelper = computed(() => showError.value || showDescription.value)\nconst ariaDescribedBy = computed(() => {\n  if (showError.value) return errorMessageId.value\n  if (showDescription.value) return descriptionId.value\n  return undefined\n})\n\nconst slotFns = computed(() =>\n  selectVariants({\n    variant: props.variant,\n    size: props.size,\n    color: props.color,\n    fullWidth: props.fullWidth,\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    isReadonly: props.isReadonly,\n    hasLabel: hasLabel.value,\n    labelPlacement: props.labelPlacement,\n  }),\n)\n\nconst showOutsideLabel = computed(\n  () => hasLabel.value && props.labelPlacement !== 'inside',\n)\n\n// Persistent item registry. SelectItem populates on first mount; entries\n// survive SelectContent unmount so SelectValue can render the label while\n// the popover is closed.\nconst itemRegistry = reactive(new Map<string, string>())\nconst registerItem = (value: string, label: string) => {\n  itemRegistry.set(value, label)\n}\nconst itemLabel = (value: string | string[] | undefined | null): string => {\n  if (value == null) return ''\n  if (Array.isArray(value)) {\n    return value.map(v => itemRegistry.get(v) ?? v).filter(Boolean).join(', ')\n  }\n  return itemRegistry.get(value) ?? value\n}\n\nuseSelectProvide({\n  isDisabled: toRef(props, 'isDisabled'),\n  isInvalid: toRef(props, 'isInvalid'),\n  isReadonly: toRef(props, 'isReadonly'),\n  isRequired: toRef(props, 'isRequired'),\n  fullWidth: toRef(props, 'fullWidth'),\n  hasLabel,\n  labelPlacement: toRef(props, 'labelPlacement'),\n  triggerId,\n  label: toRef(props, 'label'),\n  ariaDescribedBy,\n  slots: slotFns,\n  registerItem,\n  itemLabel,\n})\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class)\"\n    :data-invalid=\"isInvalid || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-readonly=\"isReadonly || undefined\"\n    :data-required=\"isRequired || undefined\"\n    :data-has-label=\"hasLabel || undefined\"\n    :data-has-helper=\"hasHelper || undefined\"\n  >\n    <label\n      v-if=\"showOutsideLabel\"\n      :for=\"triggerId\"\n      :class=\"slotFns.label()\"\n    >{{ label }}<span\n      v-if=\"isRequired\"\n      aria-hidden=\"true\"\n    > *</span></label>\n\n    <div :class=\"slotFns.mainWrapper()\">\n      <SelectRoot\n        :model-value=\"props.modelValue\"\n        :default-value=\"props.defaultValue\"\n        :open=\"props.open\"\n        :default-open=\"props.defaultOpen\"\n        :disabled=\"props.isDisabled\"\n        :required=\"props.isRequired\"\n        :name=\"props.name\"\n        @update:model-value=\"emit('update:modelValue', $event as string)\"\n        @update:open=\"emit('update:open', $event)\"\n      >\n        <slot />\n      </SelectRoot>\n\n      <div\n        v-if=\"hasHelper\"\n        :class=\"slotFns.helperWrapper()\"\n      >\n        <div\n          v-if=\"showError\"\n          :id=\"errorMessageId\"\n          :class=\"slotFns.errorMessage()\"\n        >\n          {{ errorMessage }}\n        </div>\n        <div\n          v-else-if=\"showDescription\"\n          :id=\"descriptionId\"\n          :class=\"slotFns.description()\"\n        >\n          {{ description }}\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"Select.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/Select.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, reactive, toRef, useAttrs, useId, useSlots } from 'vue'\nimport { SelectRoot } from 'reka-ui'\nimport { selectVariants, type SelectVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useSelectProvide, type SelectItemValue, type SelectItemData } from './Select.context'\nimport { hasSlotComponent } from '../../utils/hasSlotComponent'\nimport SelectTrigger from './SelectTrigger.vue'\nimport SelectValue from './SelectValue.vue'\nimport SelectContent from './SelectContent.vue'\nimport SelectItem from './SelectItem.vue'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'flat',\n  size: 'md',\n  color: 'default',\n  labelPlacement: 'inside',\n  fullWidth: false,\n  isInvalid: false,\n  isDisabled: false,\n  isReadonly: false,\n  isRequired: false,\n  multiple: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  open: undefined,\n  defaultOpen: undefined,\n  items: () => [],\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: SelectItemValue | SelectItemValue[]]\n  'update:open': [value: boolean]\n}>()\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: SelectVariants['variant']\n  /** Field height. @default 'md' */\n  size?: SelectVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: SelectVariants['color']\n  /**\n   * Where the `label` is rendered relative to the field.\n   * - `inside`: floats above the trigger (shrinks when focused/filled)\n   * - `outside`: sits above the field, static\n   * - `outside-left`: sits to the left, horizontal layout\n   * @default 'inside'\n   */\n  labelPlacement?: SelectVariants['labelPlacement']\n  /** Stretches root wrapper to 100% width. @default false */\n  fullWidth?: boolean\n  /** Marks the field as invalid. Triggers danger styling and enables `errorMessage`. @default false */\n  isInvalid?: boolean\n  /** Disables the field. @default false */\n  isDisabled?: boolean\n  /** Makes the field read-only. @default false */\n  isReadonly?: boolean\n  /** Adds a required asterisk next to the label. @default false */\n  isRequired?: boolean\n  /** Placeholder shown when no value is selected. */\n  placeholder?: string\n  /** Form field name, for native form submission. */\n  name?: string\n  /** Field label. When omitted, the floating-label behavior is skipped. */\n  label?: string\n  /** Helper text displayed below the field. Suppressed when `isInvalid && errorMessage` is shown. */\n  description?: string\n  /** Error text displayed below the field. Only rendered when `isInvalid` is also true. */\n  errorMessage?: string\n  /** Extra classes merged onto the root wrapper via `composeClassName`. */\n  class?: string\n\n  /* ─── Select-specific ─────────────────────────────────────── */\n  /** Two-way bound selected value. Accepts string or numeric keys. */\n  modelValue?: SelectItemValue | SelectItemValue[]\n  /** Initial selected value (uncontrolled). Accepts string or numeric keys. */\n  defaultValue?: SelectItemValue | SelectItemValue[]\n  /** Allow selecting multiple values. modelValue becomes string[]. @default false */\n  multiple?: boolean\n  /** Controls open state of the dropdown. */\n  open?: boolean\n  /** Initial open state of the dropdown (uncontrolled). */\n  defaultOpen?: boolean\n  /**\n   * Data-driven items for the terse API. When provided (and no SelectTrigger /\n   * SelectContent is passed as a child), the trigger, value, and popover are\n   * rendered internally. Use the `#item` slot to customize per-item rendering.\n   */\n  items?: SelectItemData[]\n}\n\nconst attrs = useAttrs()\nconst generatedId = useId()\nconst triggerId = computed(() => (attrs.id as string | undefined) ?? generatedId)\n\nconst hasLabel = computed(() => !!props.label)\n\nconst slots = useSlots()\n// Tier 3 (advanced): consumer supplied explicit compound chrome → pass through.\n// Tier 1/2 (terse): render trigger/value/content internally.\nconst usesCustomChrome = computed(() =>\n  hasSlotComponent(slots.default?.(), [SelectTrigger, SelectContent]),\n)\n\n// Helper IDs / aria wiring\nconst descriptionId = computed(() => `${triggerId.value}-description`)\nconst errorMessageId = computed(() => `${triggerId.value}-error`)\nconst showError = computed(() => props.isInvalid && !!props.errorMessage)\nconst showDescription = computed(() => !!props.description && !showError.value)\nconst hasHelper = computed(() => showError.value || showDescription.value)\nconst ariaDescribedBy = computed(() => {\n  if (showError.value) return errorMessageId.value\n  if (showDescription.value) return descriptionId.value\n  return undefined\n})\n\nconst slotFns = computed(() =>\n  selectVariants({\n    variant: props.variant,\n    size: props.size,\n    color: props.color,\n    fullWidth: props.fullWidth,\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    isReadonly: props.isReadonly,\n    hasLabel: hasLabel.value,\n    labelPlacement: props.labelPlacement,\n  }),\n)\n\nconst showOutsideLabel = computed(\n  () => hasLabel.value && props.labelPlacement !== 'inside',\n)\n\n// Persistent item registry. SelectItem populates on first mount; entries\n// survive SelectContent unmount so SelectValue can render the label while\n// the popover is closed.\nconst itemRegistry = reactive(new Map<SelectItemValue, string>())\nconst registerItem = (value: SelectItemValue, label: string) => {\n  itemRegistry.set(value, label)\n}\nconst itemLabel = (value: SelectItemValue | SelectItemValue[] | undefined | null): string => {\n  if (value == null) return ''\n  if (Array.isArray(value)) {\n    // Fall back to the stringified value (handles numeric keys) when no label is\n    // registered. Filter empty strings only — never use filter(Boolean), which\n    // would drop a registered label for the numeric key 0.\n    return value\n      .map(v => String(itemRegistry.get(v) ?? v))\n      .filter(s => s.length > 0)\n      .join(', ')\n  }\n  return itemRegistry.get(value) ?? String(value)\n}\n\nfunction removeValue(value: SelectItemValue) {\n  const current = Array.isArray(props.modelValue) ? props.modelValue : []\n  emit('update:modelValue', current.filter(v => v !== value))\n}\n\nuseSelectProvide({\n  isDisabled: toRef(props, 'isDisabled'),\n  isInvalid: toRef(props, 'isInvalid'),\n  isReadonly: toRef(props, 'isReadonly'),\n  isRequired: toRef(props, 'isRequired'),\n  fullWidth: toRef(props, 'fullWidth'),\n  hasLabel,\n  labelPlacement: toRef(props, 'labelPlacement'),\n  triggerId,\n  label: toRef(props, 'label'),\n  ariaDescribedBy,\n  slots: slotFns,\n  multiple: toRef(props, 'multiple'),\n  registerItem,\n  itemLabel,\n  removeValue,\n})\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class)\"\n    :data-invalid=\"isInvalid || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-readonly=\"isReadonly || undefined\"\n    :data-required=\"isRequired || undefined\"\n    :data-has-label=\"hasLabel || undefined\"\n    :data-has-helper=\"hasHelper || undefined\"\n  >\n    <label\n      v-if=\"showOutsideLabel\"\n      :for=\"triggerId\"\n      :class=\"slotFns.label()\"\n    >{{ label }}<span\n      v-if=\"isRequired\"\n      aria-hidden=\"true\"\n    > *</span></label>\n\n    <div :class=\"slotFns.mainWrapper()\">\n      <SelectRoot\n        :model-value=\"props.modelValue\"\n        :default-value=\"props.defaultValue\"\n        :multiple=\"props.multiple\"\n        :open=\"props.open\"\n        :default-open=\"props.defaultOpen\"\n        :disabled=\"props.isDisabled\"\n        :required=\"props.isRequired\"\n        :name=\"props.name\"\n        @update:model-value=\"emit('update:modelValue', $event as SelectItemValue | SelectItemValue[])\"\n        @update:open=\"emit('update:open', $event)\"\n      >\n        <!-- Tier 3: consumer-provided compound chrome -->\n        <slot v-if=\"usesCustomChrome\" />\n        <!-- Tier 1/2: internally rendered chrome -->\n        <template v-else>\n          <SelectTrigger>\n            <SelectValue :placeholder=\"props.placeholder\" />\n          </SelectTrigger>\n          <SelectContent>\n            <SelectItem\n              v-for=\"item in props.items\"\n              :key=\"item.value\"\n              :value=\"item.value\"\n              :text-value=\"item.textValue ?? item.label\"\n              :is-disabled=\"item.isDisabled\"\n            >\n              <slot\n                name=\"item\"\n                :item=\"item\"\n              >{{ item.label ?? String(item.value) }}</slot>\n            </SelectItem>\n            <slot />\n          </SelectContent>\n        </template>\n      </SelectRoot>\n\n      <div\n        v-if=\"hasHelper\"\n        :class=\"slotFns.helperWrapper()\"\n      >\n        <div\n          v-if=\"showError\"\n          :id=\"errorMessageId\"\n          :class=\"slotFns.errorMessage()\"\n        >\n          {{ errorMessage }}\n        </div>\n        <div\n          v-else-if=\"showDescription\"\n          :id=\"descriptionId\"\n          :class=\"slotFns.description()\"\n        >\n          {{ description }}\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/select/SelectItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItem.js","names":[],"sources":["../../../src/components/select/SelectItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, useTemplateRef } from 'vue'\nimport { SelectItem, SelectItemText, SelectItemIndicator } from 'reka-ui'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  /**\n   * Explicit human-readable label for this item. When provided, the registry is\n   * populated immediately at setup time (before the dropdown is ever opened),\n   * so SelectValue can display the correct label for a pre-set modelValue.\n   * When omitted, the label is read from slot DOM text on first mount.\n   */\n  textValue?: string\n  isDisabled?: boolean\n  class?: string\n}>(), {\n  textValue: undefined,\n  isDisabled: false,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst textRef = useTemplateRef<HTMLElement>('textRef')\n\n// Register immediately with textValue if provided — this runs at setup time,\n// before mount, so SelectValue shows the correct label for a pre-set modelValue\n// even before the dropdown has ever been opened.\nif (props.textValue !== undefined) {\n  ctx.registerItem(props.value, props.textValue)\n}\n\nonMounted(() => {\n  // textRef points to the SelectItemText component instance (not a DOM element).\n  // Access $el to get the underlying span element and read its text content.\n  // This refines the registry entry with actual DOM text (handles slot-text items\n  // that don't have an explicit textValue prop).\n  const el = (textRef.value as { $el?: HTMLElement } | null)?.$el\n  const label = props.textValue ?? el?.textContent?.trim() ?? props.value\n  ctx.registerItem(props.value, label)\n})\n</script>\n\n<template>\n  <SelectItem\n    :value=\"props.value\"\n    :disabled=\"props.isDisabled\"\n    :text-value=\"props.textValue ?? props.value\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n  >\n    <slot name=\"startContent\" />\n    <SelectItemText ref=\"textRef\">\n      <slot />\n    </SelectItemText>\n    <SelectItemIndicator\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </SelectItemIndicator>\n    <slot name=\"endContent\" />\n  </SelectItem>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SelectItem.js","names":[],"sources":["../../../src/components/select/SelectItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, useTemplateRef } from 'vue'\nimport { SelectItem, SelectItemText, SelectItemIndicator } from 'reka-ui'\nimport { useSelectInject, type SelectItemValue } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  value: SelectItemValue\n  /**\n   * Explicit human-readable label for this item. When provided, the registry is\n   * populated immediately at setup time (before the dropdown is ever opened),\n   * so SelectValue can display the correct label for a pre-set modelValue.\n   * When omitted, the label is read from slot DOM text on first mount.\n   */\n  textValue?: string\n  isDisabled?: boolean\n  class?: string\n}>(), {\n  textValue: undefined,\n  isDisabled: false,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst textRef = useTemplateRef<HTMLElement>('textRef')\n\n// Register immediately with textValue if provided — this runs at setup time,\n// before mount, so SelectValue shows the correct label for a pre-set modelValue\n// even before the dropdown has ever been opened.\nif (props.textValue !== undefined) {\n  ctx.registerItem(props.value, props.textValue)\n}\n\nonMounted(() => {\n  // textRef points to the SelectItemText component instance (not a DOM element).\n  // Access $el to get the underlying span element and read its text content.\n  // This refines the registry entry with actual DOM text (handles slot-text items\n  // that don't have an explicit textValue prop).\n  const el = (textRef.value as { $el?: HTMLElement } | null)?.$el\n  const label = props.textValue ?? el?.textContent?.trim() ?? String(props.value)\n  ctx.registerItem(props.value, label)\n})\n</script>\n\n<template>\n  <SelectItem\n    :value=\"props.value\"\n    :disabled=\"props.isDisabled\"\n    :text-value=\"props.textValue ?? String(props.value)\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n  >\n    <slot name=\"startContent\" />\n    <SelectItemText ref=\"textRef\">\n      <slot />\n    </SelectItemText>\n    <SelectItemIndicator\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </SelectItemIndicator>\n    <slot name=\"endContent\" />\n  </SelectItem>\n</template>\n"],"mappings":""}

package/dist/components/select/SelectItem.vue_vue_type_script_setup_true_lang.js

@@ -20,14 +20,14 @@ var SelectItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 		if (props.textValue !== void 0) ctx.registerItem(props.value, props.textValue);
 		onMounted(() => {
 			const el = textRef.value?.$el;
-			const label = props.textValue ?? el?.textContent?.trim() ?? props.value;
+			const label = props.textValue ?? el?.textContent?.trim() ?? String(props.value);
 			ctx.registerItem(props.value, label);
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(SelectItem), {
 				value: props.value,
 				disabled: props.isDisabled,
-				"text-value": props.textValue ?? props.value,
+				"text-value": props.textValue ?? String(props.value),
 				class: "list-box-item list-box-item--default",
 				"data-slot": "list-box-item"
 			}, {

package/dist/components/select/SelectItem.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItem.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, useTemplateRef } from 'vue'\nimport { SelectItem, SelectItemText, SelectItemIndicator } from 'reka-ui'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  /**\n   * Explicit human-readable label for this item. When provided, the registry is\n   * populated immediately at setup time (before the dropdown is ever opened),\n   * so SelectValue can display the correct label for a pre-set modelValue.\n   * When omitted, the label is read from slot DOM text on first mount.\n   */\n  textValue?: string\n  isDisabled?: boolean\n  class?: string\n}>(), {\n  textValue: undefined,\n  isDisabled: false,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst textRef = useTemplateRef<HTMLElement>('textRef')\n\n// Register immediately with textValue if provided — this runs at setup time,\n// before mount, so SelectValue shows the correct label for a pre-set modelValue\n// even before the dropdown has ever been opened.\nif (props.textValue !== undefined) {\n  ctx.registerItem(props.value, props.textValue)\n}\n\nonMounted(() => {\n  // textRef points to the SelectItemText component instance (not a DOM element).\n  // Access $el to get the underlying span element and read its text content.\n  // This refines the registry entry with actual DOM text (handles slot-text items\n  // that don't have an explicit textValue prop).\n  const el = (textRef.value as { $el?: HTMLElement } | null)?.$el\n  const label = props.textValue ?? el?.textContent?.trim() ?? props.value\n  ctx.registerItem(props.value, label)\n})\n</script>\n\n<template>\n  <SelectItem\n    :value=\"props.value\"\n    :disabled=\"props.isDisabled\"\n    :text-value=\"props.textValue ?? props.value\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n  >\n    <slot name=\"startContent\" />\n    <SelectItemText ref=\"textRef\">\n      <slot />\n    </SelectItemText>\n    <SelectItemIndicator\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </SelectItemIndicator>\n    <slot name=\"endContent\" />\n  </SelectItem>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAKA,MAAM,QAAQ;EAiBd,MAAM,MAAM,iBAAgB;EAC5B,MAAM,UAAU,eAA4B,UAAS;AAKrD,MAAI,MAAM,cAAc,KAAA,EACtB,KAAI,aAAa,MAAM,OAAO,MAAM,UAAS;AAG/C,kBAAgB;GAKd,MAAM,KAAM,QAAQ,OAAwC;GAC5D,MAAM,QAAQ,MAAM,aAAa,IAAI,aAAa,MAAM,IAAI,MAAM;AAClE,OAAI,aAAa,MAAM,OAAO,MAAK;IACpC;;uBAIC,YAkCa,MAAA,WAAA,EAAA;IAjCV,OAAO,MAAM;IACb,UAAU,MAAM;IAChB,cAAY,MAAM,aAAa,MAAM;IACtC,OAAM;IACN,aAAU;;2BAEkB;KAA5B,WAA4B,KAAA,QAAA,eAAA;KAC5B,YAEiB,MAAA,eAAA,EAAA;eAFG;MAAJ,KAAI;;6BACV,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;KAEV,YAqBsB,MAAA,oBAAA,EAAA;MApBpB,OAAM;MACN,aAAU;;6BAkBH,CAhBP,WAgBO,KAAA,QAAA,gBAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAfL,mBAcM,OAAA;OAbJ,OAAM;OACN,OAAM;OACN,QAAO;OACP,SAAQ;OACR,MAAK;OACL,QAAO;OACP,gBAAa;OACb,kBAAe;OACf,mBAAgB;OAChB,aAAU;OACV,eAAY;UAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA;;;KAIvC,WAA0B,KAAA,QAAA,aAAA"}
+{"version":3,"file":"SelectItem.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { onMounted, useTemplateRef } from 'vue'\nimport { SelectItem, SelectItemText, SelectItemIndicator } from 'reka-ui'\nimport { useSelectInject, type SelectItemValue } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  value: SelectItemValue\n  /**\n   * Explicit human-readable label for this item. When provided, the registry is\n   * populated immediately at setup time (before the dropdown is ever opened),\n   * so SelectValue can display the correct label for a pre-set modelValue.\n   * When omitted, the label is read from slot DOM text on first mount.\n   */\n  textValue?: string\n  isDisabled?: boolean\n  class?: string\n}>(), {\n  textValue: undefined,\n  isDisabled: false,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst textRef = useTemplateRef<HTMLElement>('textRef')\n\n// Register immediately with textValue if provided — this runs at setup time,\n// before mount, so SelectValue shows the correct label for a pre-set modelValue\n// even before the dropdown has ever been opened.\nif (props.textValue !== undefined) {\n  ctx.registerItem(props.value, props.textValue)\n}\n\nonMounted(() => {\n  // textRef points to the SelectItemText component instance (not a DOM element).\n  // Access $el to get the underlying span element and read its text content.\n  // This refines the registry entry with actual DOM text (handles slot-text items\n  // that don't have an explicit textValue prop).\n  const el = (textRef.value as { $el?: HTMLElement } | null)?.$el\n  const label = props.textValue ?? el?.textContent?.trim() ?? String(props.value)\n  ctx.registerItem(props.value, label)\n})\n</script>\n\n<template>\n  <SelectItem\n    :value=\"props.value\"\n    :disabled=\"props.isDisabled\"\n    :text-value=\"props.textValue ?? String(props.value)\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n  >\n    <slot name=\"startContent\" />\n    <SelectItemText ref=\"textRef\">\n      <slot />\n    </SelectItemText>\n    <SelectItemIndicator\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </SelectItemIndicator>\n    <slot name=\"endContent\" />\n  </SelectItem>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAKA,MAAM,QAAQ;EAiBd,MAAM,MAAM,iBAAgB;EAC5B,MAAM,UAAU,eAA4B,UAAS;AAKrD,MAAI,MAAM,cAAc,KAAA,EACtB,KAAI,aAAa,MAAM,OAAO,MAAM,UAAS;AAG/C,kBAAgB;GAKd,MAAM,KAAM,QAAQ,OAAwC;GAC5D,MAAM,QAAQ,MAAM,aAAa,IAAI,aAAa,MAAM,IAAI,OAAO,MAAM,MAAK;AAC9E,OAAI,aAAa,MAAM,OAAO,MAAK;IACpC;;uBAIC,YAkCa,MAAA,WAAA,EAAA;IAjCV,OAAO,MAAM;IACb,UAAU,MAAM;IAChB,cAAY,MAAM,aAAa,OAAO,MAAM,MAAK;IAClD,OAAM;IACN,aAAU;;2BAEkB;KAA5B,WAA4B,KAAA,QAAA,eAAA;KAC5B,YAEiB,MAAA,eAAA,EAAA;eAFG;MAAJ,KAAI;;6BACV,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;KAEV,YAqBsB,MAAA,oBAAA,EAAA;MApBpB,OAAM;MACN,aAAU;;6BAkBH,CAhBP,WAgBO,KAAA,QAAA,gBAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAfL,mBAcM,OAAA;OAbJ,OAAM;OACN,OAAM;OACN,QAAO;OACP,SAAQ;OACR,MAAK;OACL,QAAO;OACP,gBAAa;OACb,kBAAe;OACf,mBAAgB;OAChB,aAAU;OACV,eAAY;UAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA;;;KAIvC,WAA0B,KAAA,QAAA,aAAA"}

package/dist/components/select/SelectOverflowChips.js

@@ -0,0 +1,7 @@
+import SelectOverflowChips_vue_vue_type_script_setup_true_lang_default from "./SelectOverflowChips.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/select/SelectOverflowChips.vue
+var SelectOverflowChips_default = SelectOverflowChips_vue_vue_type_script_setup_true_lang_default;
+//#endregion
+export { SelectOverflowChips_default as default };
+
+//# sourceMappingURL=SelectOverflowChips.js.map

package/dist/components/select/SelectOverflowChips.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectOverflowChips.js","names":[],"sources":["../../../src/components/select/SelectOverflowChips.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, nextTick, useTemplateRef, onMounted, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport Chip from '../chip/Chip.vue'\nimport type { SelectItemValue } from './Select.context'\n\nconst props = defineProps<{\n  values: SelectItemValue[]\n  getLabel: (value: SelectItemValue) => string\n}>()\n\nconst containerEl = useTemplateRef<HTMLElement>('container')\nconst visibleCount = ref(props.values.length)\nconst overflowCount = computed(() => Math.max(0, props.values.length - visibleCount.value))\n\n// Prevents re-entrant reflows while we are in the async measurement phase.\nlet measuring = false\n\nasync function reflow() {\n  if (measuring) return\n  measuring = true\n\n  try {\n    const el = containerEl.value\n    if (!el) return\n\n    // Phase 1: show all chips to measure their natural widths\n    visibleCount.value = props.values.length\n    await nextTick()\n\n    const chips = [...el.querySelectorAll<HTMLElement>('[data-chip-item]')]\n    if (!chips.length) return\n\n    const containerW = el.offsetWidth\n    if (!containerW) return\n\n    // BADGE_W = estimated chip width (68px) + CSS gap before it (4px).\n    // The sm Chip has px-2 (16px padding) so \"+N more\" fits in ~52–68px.\n    const BADGE_W = 76\n\n    let usedW = 0\n    let n = 0\n\n    for (let i = 0; i < chips.length; i++) {\n      const gap = i > 0 ? 4 : 0\n      const chipW = chips[i].offsetWidth\n      const isLast = i === chips.length - 1\n      // Last chip: use full budget (no badge needed if everything fits).\n      // Earlier chips: reserve BADGE_W so the badge has room when we do overflow.\n      const budget = isLast ? containerW : containerW - BADGE_W\n\n      if (usedW + gap + chipW > budget) break\n      usedW += gap + chipW\n      n++\n    }\n\n    visibleCount.value = Math.max(1, n)\n  } finally {\n    measuring = false\n  }\n}\n\nonMounted(reflow)\nuseResizeObserver(containerEl, reflow)\n\n// Watch a comma-joined string derived from the values — Vue uses Object.is for\n// primitives, so this only fires when the selection actually changes.\n//\n// WHY NOT { deep: true }: Vue's watch fires the callback whenever the effect\n// re-runs when deep=true (because `if (deep || hasChanged)` short-circuits).\n// Reka passes a new array reference for modelValue on every internal re-render\n// (optionsSet updates, dropdown open/close), so a deep or shallow ref watch\n// fires continuously, causing the reflow loop that produces the oscillation.\nwatch(\n  () => props.values.join('\\x00'),\n  () => reflow(),\n  { flush: 'post' },\n)\n</script>\n\n<template>\n  <div\n    ref=\"container\"\n    style=\"display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; overflow: hidden; flex: 1; min-width: 0;\"\n  >\n    <Chip\n      v-for=\"(val, i) in values\"\n      :key=\"val\"\n      data-chip-item\n      size=\"sm\"\n      :style=\"i >= visibleCount ? 'display: none' : undefined\"\n    >\n      {{ getLabel(val) }}\n    </Chip>\n    <Chip\n      v-if=\"overflowCount > 0\"\n      size=\"sm\"\n      color=\"default\"\n    >\n      +{{ overflowCount }} more\n    </Chip>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/select/SelectOverflowChips.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,85 @@
+import Chip_default from "../chip/Chip.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createTextVNode, defineComponent, nextTick, normalizeStyle, onMounted, openBlock, ref, renderList, toDisplayString, useTemplateRef, watch, withCtx } from "vue";
+import { useResizeObserver } from "@vueuse/core";
+//#region src/components/select/SelectOverflowChips.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = {
+	ref: "container",
+	style: {
+		"display": "flex",
+		"flex-wrap": "nowrap",
+		"align-items": "center",
+		"gap": "4px",
+		"overflow": "hidden",
+		"flex": "1",
+		"min-width": "0"
+	}
+};
+var SelectOverflowChips_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
+	__name: "SelectOverflowChips",
+	props: {
+		values: {},
+		getLabel: { type: Function }
+	},
+	setup(__props) {
+		const props = __props;
+		const containerEl = useTemplateRef("container");
+		const visibleCount = ref(props.values.length);
+		const overflowCount = computed(() => Math.max(0, props.values.length - visibleCount.value));
+		let measuring = false;
+		async function reflow() {
+			if (measuring) return;
+			measuring = true;
+			try {
+				const el = containerEl.value;
+				if (!el) return;
+				visibleCount.value = props.values.length;
+				await nextTick();
+				const chips = [...el.querySelectorAll("[data-chip-item]")];
+				if (!chips.length) return;
+				const containerW = el.offsetWidth;
+				if (!containerW) return;
+				const BADGE_W = 76;
+				let usedW = 0;
+				let n = 0;
+				for (let i = 0; i < chips.length; i++) {
+					const gap = i > 0 ? 4 : 0;
+					const chipW = chips[i].offsetWidth;
+					const budget = i === chips.length - 1 ? containerW : containerW - BADGE_W;
+					if (usedW + gap + chipW > budget) break;
+					usedW += gap + chipW;
+					n++;
+				}
+				visibleCount.value = Math.max(1, n);
+			} finally {
+				measuring = false;
+			}
+		}
+		onMounted(reflow);
+		useResizeObserver(containerEl, reflow);
+		watch(() => props.values.join("\0"), () => reflow(), { flush: "post" });
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.values, (val, i) => {
+				return openBlock(), createBlock(Chip_default, {
+					key: val,
+					"data-chip-item": "",
+					size: "sm",
+					style: normalizeStyle(i >= visibleCount.value ? "display: none" : void 0)
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(__props.getLabel(val)), 1)]),
+					_: 2
+				}, 1032, ["style"]);
+			}), 128)), overflowCount.value > 0 ? (openBlock(), createBlock(Chip_default, {
+				key: 0,
+				size: "sm",
+				color: "default"
+			}, {
+				default: withCtx(() => [createTextVNode(" +" + toDisplayString(overflowCount.value) + " more ", 1)]),
+				_: 1
+			})) : createCommentVNode("", true)], 512);
+		};
+	}
+});
+//#endregion
+export { SelectOverflowChips_vue_vue_type_script_setup_true_lang_default as default };
+
+//# sourceMappingURL=SelectOverflowChips.vue_vue_type_script_setup_true_lang.js.map

package/dist/components/select/SelectOverflowChips.vue_vue_type_script_setup_true_lang.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectOverflowChips.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectOverflowChips.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, nextTick, useTemplateRef, onMounted, watch } from 'vue'\nimport { useResizeObserver } from '@vueuse/core'\nimport Chip from '../chip/Chip.vue'\nimport type { SelectItemValue } from './Select.context'\n\nconst props = defineProps<{\n  values: SelectItemValue[]\n  getLabel: (value: SelectItemValue) => string\n}>()\n\nconst containerEl = useTemplateRef<HTMLElement>('container')\nconst visibleCount = ref(props.values.length)\nconst overflowCount = computed(() => Math.max(0, props.values.length - visibleCount.value))\n\n// Prevents re-entrant reflows while we are in the async measurement phase.\nlet measuring = false\n\nasync function reflow() {\n  if (measuring) return\n  measuring = true\n\n  try {\n    const el = containerEl.value\n    if (!el) return\n\n    // Phase 1: show all chips to measure their natural widths\n    visibleCount.value = props.values.length\n    await nextTick()\n\n    const chips = [...el.querySelectorAll<HTMLElement>('[data-chip-item]')]\n    if (!chips.length) return\n\n    const containerW = el.offsetWidth\n    if (!containerW) return\n\n    // BADGE_W = estimated chip width (68px) + CSS gap before it (4px).\n    // The sm Chip has px-2 (16px padding) so \"+N more\" fits in ~52–68px.\n    const BADGE_W = 76\n\n    let usedW = 0\n    let n = 0\n\n    for (let i = 0; i < chips.length; i++) {\n      const gap = i > 0 ? 4 : 0\n      const chipW = chips[i].offsetWidth\n      const isLast = i === chips.length - 1\n      // Last chip: use full budget (no badge needed if everything fits).\n      // Earlier chips: reserve BADGE_W so the badge has room when we do overflow.\n      const budget = isLast ? containerW : containerW - BADGE_W\n\n      if (usedW + gap + chipW > budget) break\n      usedW += gap + chipW\n      n++\n    }\n\n    visibleCount.value = Math.max(1, n)\n  } finally {\n    measuring = false\n  }\n}\n\nonMounted(reflow)\nuseResizeObserver(containerEl, reflow)\n\n// Watch a comma-joined string derived from the values — Vue uses Object.is for\n// primitives, so this only fires when the selection actually changes.\n//\n// WHY NOT { deep: true }: Vue's watch fires the callback whenever the effect\n// re-runs when deep=true (because `if (deep || hasChanged)` short-circuits).\n// Reka passes a new array reference for modelValue on every internal re-render\n// (optionsSet updates, dropdown open/close), so a deep or shallow ref watch\n// fires continuously, causing the reflow loop that produces the oscillation.\nwatch(\n  () => props.values.join('\\x00'),\n  () => reflow(),\n  { flush: 'post' },\n)\n</script>\n\n<template>\n  <div\n    ref=\"container\"\n    style=\"display: flex; flex-wrap: nowrap; align-items: center; gap: 4px; overflow: hidden; flex: 1; min-width: 0;\"\n  >\n    <Chip\n      v-for=\"(val, i) in values\"\n      :key=\"val\"\n      data-chip-item\n      size=\"sm\"\n      :style=\"i >= visibleCount ? 'display: none' : undefined\"\n    >\n      {{ getLabel(val) }}\n    </Chip>\n    <Chip\n      v-if=\"overflowCount > 0\"\n      size=\"sm\"\n      color=\"default\"\n    >\n      +{{ overflowCount }} more\n    </Chip>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAKd,MAAM,cAAc,eAA4B,YAAW;EAC3D,MAAM,eAAe,IAAI,MAAM,OAAO,OAAM;EAC5C,MAAM,gBAAgB,eAAe,KAAK,IAAI,GAAG,MAAM,OAAO,SAAS,aAAa,MAAM,CAAA;EAG1F,IAAI,YAAY;EAEhB,eAAe,SAAS;AACtB,OAAI,UAAW;AACf,eAAY;AAEZ,OAAI;IACF,MAAM,KAAK,YAAY;AACvB,QAAI,CAAC,GAAI;AAGT,iBAAa,QAAQ,MAAM,OAAO;AAClC,UAAM,UAAS;IAEf,MAAM,QAAQ,CAAC,GAAG,GAAG,iBAA8B,mBAAmB,CAAA;AACtE,QAAI,CAAC,MAAM,OAAQ;IAEnB,MAAM,aAAa,GAAG;AACtB,QAAI,CAAC,WAAY;IAIjB,MAAM,UAAU;IAEhB,IAAI,QAAQ;IACZ,IAAI,IAAI;AAER,SAAK,IAAI,IAAI,GAAG,IAAI,MAAM,QAAQ,KAAK;KACrC,MAAM,MAAM,IAAI,IAAI,IAAI;KACxB,MAAM,QAAQ,MAAM,GAAG;KAIvB,MAAM,SAHS,MAAM,MAAM,SAAS,IAGZ,aAAa,aAAa;AAElD,SAAI,QAAQ,MAAM,QAAQ,OAAQ;AAClC,cAAS,MAAM;AACf;;AAGF,iBAAa,QAAQ,KAAK,IAAI,GAAG,EAAC;aAC1B;AACR,gBAAY;;;AAIhB,YAAU,OAAM;AAChB,oBAAkB,aAAa,OAAM;AAUrC,cACQ,MAAM,OAAO,KAAK,KAAO,QACzB,QAAQ,EACd,EAAE,OAAO,QAAQ,CACnB;;uBAIE,mBAoBM,OApBN,YAoBM,EAAA,UAAA,KAAA,EAhBJ,mBAQO,UAAA,MAAA,WAPc,QAAA,SAAX,KAAK,MAAC;wBADhB,YAQO,cAAA;KANJ,KAAK;KACN,kBAAA;KACA,MAAK;KACJ,OAAK,eAAE,KAAK,aAAA,QAAY,kBAAqB,KAAA,EAAS;;4BAEpC,CAAA,gBAAA,gBAAhB,QAAA,SAAS,IAAG,CAAA,EAAA,EAAA,CAAA,CAAA;;;cAGT,cAAA,QAAa,KAAA,WAAA,EADrB,YAMO,cAAA;;IAJL,MAAK;IACL,OAAM;;2BAEL,CAAA,gBADF,OACE,gBAAG,cAAA,MAAa,GAAG,UACtB,EAAA,CAAA,CAAA"}

package/dist/components/select/SelectValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectValue.js","names":[],"sources":["../../../src/components/select/SelectValue.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { SelectValue } from 'reka-ui'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  placeholder?: string\n  class?: string\n}>(), {\n  placeholder: undefined,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\n</script>\n\n<template>\n  <SelectValue\n    :class=\"ctx.slots.value.value()\"\n    :placeholder=\"props.placeholder\"\n    data-slot=\"value\"\n  >\n    <template #default=\"{ selectedLabel, modelValue }\">\n      <!--\n        Label resolution order:\n        1. Reka's native selectedLabel — populated via optionsSet once items mount\n           (works after first open, and in real browsers via DocumentFragment path)\n        2. itemRegistry label — populated at setup time for items with explicit\n           textValue prop, or at onMounted for slot-text items after first open\n        3. Placeholder when no value is selected\n      -->\n      <template v-if=\"selectedLabel && selectedLabel.length > 0\">\n        {{ selectedLabel.join(', ') }}\n      </template>\n      <template v-else-if=\"modelValue != null && (Array.isArray(modelValue) ? modelValue.length > 0 : modelValue !== '')\">\n        {{ ctx.itemLabel(Array.isArray(modelValue) ? modelValue : modelValue.toString()) }}\n      </template>\n      <template v-else>\n        {{ props.placeholder }}\n      </template>\n    </template>\n  </SelectValue>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SelectValue.js","names":[],"sources":["../../../src/components/select/SelectValue.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { SelectValue } from 'reka-ui'\nimport { useSelectInject, type SelectItemValue } from './Select.context'\nimport SelectOverflowChips from './SelectOverflowChips.vue'\n\nconst props = withDefaults(defineProps<{\n  placeholder?: string\n  class?: string\n}>(), {\n  placeholder: undefined,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\n</script>\n\n<template>\n  <SelectValue\n    :class=\"ctx.slots.value.value()\"\n    :placeholder=\"props.placeholder\"\n    data-slot=\"value\"\n  >\n    <template #default=\"{ selectedLabel, modelValue }\">\n      <!-- Multiple mode: chips with overflow truncation -->\n      <template v-if=\"ctx.multiple.value && Array.isArray(modelValue) && modelValue.length > 0\">\n        <SelectOverflowChips\n          :values=\"(modelValue as SelectItemValue[])\"\n          :get-label=\"ctx.itemLabel\"\n        />\n      </template>\n      <!-- Multiple mode: nothing selected yet -->\n      <template v-else-if=\"ctx.multiple.value\">\n        {{ props.placeholder }}\n      </template>\n      <!--\n        Single mode label resolution:\n        1. Reka's native selectedLabel — populated via optionsSet once items mount\n        2. itemRegistry label — populated at setup time for items with explicit textValue\n        3. Placeholder when no value is selected\n      -->\n      <template v-else-if=\"selectedLabel && selectedLabel.length > 0\">\n        {{ selectedLabel.join(', ') }}\n      </template>\n      <template v-else-if=\"modelValue != null && (Array.isArray(modelValue) ? modelValue.length > 0 : modelValue !== '')\">\n        {{ ctx.itemLabel(modelValue as SelectItemValue | SelectItemValue[]) }}\n      </template>\n      <template v-else>\n        {{ props.placeholder }}\n      </template>\n    </template>\n  </SelectValue>\n</template>\n"],"mappings":""}

package/dist/components/select/SelectValue.vue_vue_type_script_setup_true_lang.js

@@ -1,4 +1,5 @@
 import { useSelectInject } from "./Select.context.js";
+import SelectOverflowChips_default from "./SelectOverflowChips.js";
 import { Fragment, createBlock, createElementBlock, createTextVNode, defineComponent, normalizeClass, openBlock, toDisplayString, unref, withCtx } from "vue";
 import { SelectValue } from "reka-ui";
 //#region src/components/select/SelectValue.vue?vue&type=script&setup=true&lang.ts
@@ -17,7 +18,11 @@ var SelectValue_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				placeholder: props.placeholder,
 				"data-slot": "value"
 			}, {
-				default: withCtx(({ selectedLabel, modelValue }) => [selectedLabel && selectedLabel.length > 0 ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [createTextVNode(toDisplayString(selectedLabel.join(", ")), 1)], 64)) : modelValue != null && (Array.isArray(modelValue) ? modelValue.length > 0 : modelValue !== "") ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(unref(ctx).itemLabel(Array.isArray(modelValue) ? modelValue : modelValue.toString())), 1)], 64)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [createTextVNode(toDisplayString(props.placeholder), 1)], 64))]),
+				default: withCtx(({ selectedLabel, modelValue }) => [unref(ctx).multiple.value && Array.isArray(modelValue) && modelValue.length > 0 ? (openBlock(), createBlock(SelectOverflowChips_default, {
+					key: 0,
+					values: modelValue,
+					"get-label": unref(ctx).itemLabel
+				}, null, 8, ["values", "get-label"])) : unref(ctx).multiple.value ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [createTextVNode(toDisplayString(props.placeholder), 1)], 64)) : selectedLabel && selectedLabel.length > 0 ? (openBlock(), createElementBlock(Fragment, { key: 2 }, [createTextVNode(toDisplayString(selectedLabel.join(", ")), 1)], 64)) : modelValue != null && (Array.isArray(modelValue) ? modelValue.length > 0 : modelValue !== "") ? (openBlock(), createElementBlock(Fragment, { key: 3 }, [createTextVNode(toDisplayString(unref(ctx).itemLabel(modelValue)), 1)], 64)) : (openBlock(), createElementBlock(Fragment, { key: 4 }, [createTextVNode(toDisplayString(props.placeholder), 1)], 64))]),
 				_: 1
 			}, 8, ["class", "placeholder"]);
 		};

package/dist/components/select/SelectValue.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectValue.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectValue.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { SelectValue } from 'reka-ui'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  placeholder?: string\n  class?: string\n}>(), {\n  placeholder: undefined,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\n</script>\n\n<template>\n  <SelectValue\n    :class=\"ctx.slots.value.value()\"\n    :placeholder=\"props.placeholder\"\n    data-slot=\"value\"\n  >\n    <template #default=\"{ selectedLabel, modelValue }\">\n      <!--\n        Label resolution order:\n        1. Reka's native selectedLabel — populated via optionsSet once items mount\n           (works after first open, and in real browsers via DocumentFragment path)\n        2. itemRegistry label — populated at setup time for items with explicit\n           textValue prop, or at onMounted for slot-text items after first open\n        3. Placeholder when no value is selected\n      -->\n      <template v-if=\"selectedLabel && selectedLabel.length > 0\">\n        {{ selectedLabel.join(', ') }}\n      </template>\n      <template v-else-if=\"modelValue != null && (Array.isArray(modelValue) ? modelValue.length > 0 : modelValue !== '')\">\n        {{ ctx.itemLabel(Array.isArray(modelValue) ? modelValue : modelValue.toString()) }}\n      </template>\n      <template v-else>\n        {{ props.placeholder }}\n      </template>\n    </template>\n  </SelectValue>\n</template>\n"],"mappings":";;;;;;;;;;;EAIA,MAAM,QAAQ;EAQd,MAAM,MAAM,iBAAgB;;uBAI1B,YAwBc,MAAA,YAAA,EAAA;IAvBX,OAAK,eAAE,MAAA,IAAG,CAAC,MAAM,MAAM,OAAK,CAAA;IAC5B,aAAa,MAAM;IACpB,aAAU;;IAEC,SAAO,SAWL,EAXS,eAAe,iBAAU,CAS7B,iBAAiB,cAAc,SAAM,KAAA,WAAA,EAArD,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,cAAc,KAAI,KAAA,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA,IAEF,cAAU,SAAa,MAAM,QAAQ,WAAU,GAAI,WAAW,SAAM,IAAO,eAAU,OAAA,WAAA,EAA1G,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,MAAA,IAAG,CAAC,UAAU,MAAM,QAAQ,WAAU,GAAI,aAAa,WAAW,UAAQ,CAAA,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA,KAAA,WAAA,EAE/E,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,MAAM,YAAW,EAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA"}
+{"version":3,"file":"SelectValue.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectValue.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { SelectValue } from 'reka-ui'\nimport { useSelectInject, type SelectItemValue } from './Select.context'\nimport SelectOverflowChips from './SelectOverflowChips.vue'\n\nconst props = withDefaults(defineProps<{\n  placeholder?: string\n  class?: string\n}>(), {\n  placeholder: undefined,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\n</script>\n\n<template>\n  <SelectValue\n    :class=\"ctx.slots.value.value()\"\n    :placeholder=\"props.placeholder\"\n    data-slot=\"value\"\n  >\n    <template #default=\"{ selectedLabel, modelValue }\">\n      <!-- Multiple mode: chips with overflow truncation -->\n      <template v-if=\"ctx.multiple.value && Array.isArray(modelValue) && modelValue.length > 0\">\n        <SelectOverflowChips\n          :values=\"(modelValue as SelectItemValue[])\"\n          :get-label=\"ctx.itemLabel\"\n        />\n      </template>\n      <!-- Multiple mode: nothing selected yet -->\n      <template v-else-if=\"ctx.multiple.value\">\n        {{ props.placeholder }}\n      </template>\n      <!--\n        Single mode label resolution:\n        1. Reka's native selectedLabel — populated via optionsSet once items mount\n        2. itemRegistry label — populated at setup time for items with explicit textValue\n        3. Placeholder when no value is selected\n      -->\n      <template v-else-if=\"selectedLabel && selectedLabel.length > 0\">\n        {{ selectedLabel.join(', ') }}\n      </template>\n      <template v-else-if=\"modelValue != null && (Array.isArray(modelValue) ? modelValue.length > 0 : modelValue !== '')\">\n        {{ ctx.itemLabel(modelValue as SelectItemValue | SelectItemValue[]) }}\n      </template>\n      <template v-else>\n        {{ props.placeholder }}\n      </template>\n    </template>\n  </SelectValue>\n</template>\n"],"mappings":";;;;;;;;;;;;EAKA,MAAM,QAAQ;EAQd,MAAM,MAAM,iBAAgB;;uBAI1B,YAiCc,MAAA,YAAA,EAAA;IAhCX,OAAK,eAAE,MAAA,IAAG,CAAC,MAAM,MAAM,OAAK,CAAA;IAC5B,aAAa,MAAM;IACpB,aAAU;;IAEC,SAAO,SAOL,EAPS,eAAe,iBAAU,CAE7B,MAAA,IAAG,CAAC,SAAS,SAAS,MAAM,QAAQ,WAAU,IAAK,WAAW,SAAM,KAAA,WAAA,EAClF,YAGE,6BAAA;;KAFC,QAAS;KACT,aAAW,MAAA,IAAG,CAAC;4CAIC,MAAA,IAAG,CAAC,SAAS,SAAA,WAAA,EAAlC,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,MAAM,YAAW,EAAA,EAAA,CAAA,EAAA,GAAA,IAQD,iBAAiB,cAAc,SAAM,KAAA,WAAA,EAA1D,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,cAAc,KAAI,KAAA,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA,IAEF,cAAU,SAAa,MAAM,QAAQ,WAAU,GAAI,WAAW,SAAM,IAAO,eAAU,OAAA,WAAA,EAA1G,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,MAAA,IAAG,CAAC,UAAU,WAAU,CAAA,EAAA,EAAA,CAAA,EAAA,GAAA,KAAA,WAAA,EAE7B,mBAEW,UAAA,EAAA,KAAA,GAAA,EAAA,CAAA,gBAAA,gBADN,MAAM,YAAW,EAAA,EAAA,CAAA,EAAA,GAAA,EAAA,CAAA"}