@auronui/vue 1.0.16 → 1.0.18

package/dist/components/button/ToggleButtonGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useToggleButtonGroupProvide } from "./toggle-button-group.context.js";
-import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, ref, renderSlot, toRef, unref, watch } from "vue";
+import ToggleButton_default from "./ToggleButton.js";
+import { Fragment, computed, createBlock, createElementBlock, createTextVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, toRef, unref, watch, withCtx } from "vue";
 import { toggleButtonGroupVariants } from "@auronui/styles";
 //#region src/components/button/ToggleButtonGroup.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["data-orientation"];
@@ -32,7 +33,8 @@ var ToggleButtonGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			Object,
 			Array
 		] },
-		classNames: {}
+		classNames: {},
+		buttons: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -75,7 +77,23 @@ var ToggleButtonGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 				class: normalizeClass(unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base)),
 				"data-orientation": props.orientation,
 				role: "group"
-			}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1);
+			}, [props.buttons ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.buttons, (btn) => {
+				return openBlock(), createBlock(ToggleButton_default, {
+					key: btn.value,
+					value: btn.value,
+					"is-icon-only": btn.isIconOnly,
+					disabled: btn.disabled,
+					class: normalizeClass(btn.class)
+				}, {
+					default: withCtx(() => [createTextVNode(toDisplayString(btn.label), 1)]),
+					_: 2
+				}, 1032, [
+					"value",
+					"is-icon-only",
+					"disabled",
+					"class"
+				]);
+			}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })], 10, _hoisted_1);
 		};
 	}
 });

package/dist/components/button/ToggleButtonGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButtonGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/ToggleButtonGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { toggleButtonGroupVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useToggleButtonGroupProvide } from './toggle-button-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  disabled?: boolean\n  fullWidth?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  selectionMode?: 'single' | 'multiple'\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  class?: ClassValue\n  /** Additional class names to apply to component slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  variant: 'default',\n  size: 'md',\n  disabled: false,\n  fullWidth: false,\n  orientation: 'horizontal',\n  isDetached: false,\n  selectionMode: 'multiple',\n  modelValue: undefined,\n  defaultValue: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[]]\n}>()\n\n// Normalize modelValue / defaultValue to string[] for internal use\nconst internalSelected = ref<string[]>(\n  props.modelValue !== undefined\n    ? (Array.isArray(props.modelValue) ? [...props.modelValue] : [props.modelValue])\n    : props.defaultValue !== undefined\n      ? (Array.isArray(props.defaultValue) ? [...props.defaultValue] : [props.defaultValue])\n      : []\n)\n\n// Keep internalSelected in sync when modelValue changes from outside (controlled mode)\nimport { watch } from 'vue'\nwatch(\n  () => props.modelValue,\n  (val) => {\n    if (val === undefined) return\n    internalSelected.value = Array.isArray(val) ? [...val] : [val]\n  },\n)\n\n// The selectedValues exposed to children (always string[])\nconst selectedValues = computed(() => internalSelected.value)\n\nfunction toggleValue(value: string) {\n  if (props.selectionMode === 'single') {\n    const next = internalSelected.value.includes(value) ? [] : [value]\n    internalSelected.value = next\n    emit('update:modelValue', next[0] ?? '')\n  } else {\n    // multiple\n    const idx = internalSelected.value.indexOf(value)\n    const next = idx === -1\n      ? [...internalSelected.value, value]\n      : internalSelected.value.filter((v) => v !== value)\n    internalSelected.value = next\n    emit('update:modelValue', next)\n  }\n}\n\n// Provide context to child ToggleButtons via toRef() for live reactivity\nuseToggleButtonGroupProvide({\n  variant: toRef(props, 'variant'),\n  size: toRef(props, 'size'),\n  disabled: toRef(props, 'disabled'),\n  fullWidth: toRef(props, 'fullWidth'),\n  orientation: toRef(props, 'orientation'),\n  selectionMode: toRef(props, 'selectionMode'),\n  selectedValues,\n  toggleValue,\n})\n\nconst slotFns = computed(() =>\n  toggleButtonGroupVariants({\n    fullWidth: props.fullWidth,\n    orientation: props.orientation,\n    isDetached: props.isDetached,\n  })\n)\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-orientation=\"props.orientation\"\n    role=\"group\"\n  >\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EA2Bd,MAAM,OAAO;EAKb,MAAM,mBAAmB,IACvB,MAAM,eAAe,KAAA,IAChB,MAAM,QAAQ,MAAM,WAAW,GAAG,CAAC,GAAG,MAAM,WAAW,GAAG,CAAC,MAAM,WAAW,GAC7E,MAAM,iBAAiB,KAAA,IACpB,MAAM,QAAQ,MAAM,aAAa,GAAG,CAAC,GAAG,MAAM,aAAa,GAAG,CAAC,MAAM,aAAa,GACnF,EAAC,CACT;AAIA,cACQ,MAAM,aACX,QAAQ;AACP,OAAI,QAAQ,KAAA,EAAW;AACvB,oBAAiB,QAAQ,MAAM,QAAQ,IAAI,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,IAAG;IAEjE;EAGA,MAAM,iBAAiB,eAAe,iBAAiB,MAAK;EAE5D,SAAS,YAAY,OAAe;AAClC,OAAI,MAAM,kBAAkB,UAAU;IACpC,MAAM,OAAO,iBAAiB,MAAM,SAAS,MAAM,GAAG,EAAE,GAAG,CAAC,MAAK;AACjE,qBAAiB,QAAQ;AACzB,SAAK,qBAAqB,KAAK,MAAM,GAAE;UAClC;IAGL,MAAM,OADM,iBAAiB,MAAM,QAAQ,MAAK,KAC3B,KACjB,CAAC,GAAG,iBAAiB,OAAO,MAAK,GACjC,iBAAiB,MAAM,QAAQ,MAAM,MAAM,MAAK;AACpD,qBAAiB,QAAQ;AACzB,SAAK,qBAAqB,KAAI;;;AAKlC,8BAA4B;GAC1B,SAAS,MAAM,OAAO,UAAU;GAChC,MAAM,MAAM,OAAO,OAAO;GAC1B,UAAU,MAAM,OAAO,WAAW;GAClC,WAAW,MAAM,OAAO,YAAY;GACpC,aAAa,MAAM,OAAO,cAAc;GACxC,eAAe,MAAM,OAAO,gBAAgB;GAC5C;GACA;GACD,CAAA;EAED,MAAM,UAAU,eACd,0BAA0B;GACxB,WAAW,MAAM;GACjB,aAAa,MAAM;GACnB,YAAY,MAAM;GACnB,CAAA,CACH;;uBAIE,mBAMM,OAAA;IALH,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA;IAC3E,oBAAkB,MAAM;IACzB,MAAK;OAEL,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,IAAA,WAAA"}
+{"version":3,"file":"ToggleButtonGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/ToggleButtonGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { toggleButtonGroupVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useToggleButtonGroupProvide } from './toggle-button-group.context'\nimport ToggleButton from './ToggleButton.vue'\n\ntype ToggleButtonShorthandItem = { value: string; label?: string; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = withDefaults(defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  disabled?: boolean\n  fullWidth?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  selectionMode?: 'single' | 'multiple'\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  class?: ClassValue\n  /** Additional class names to apply to component slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render toggle buttons from an array instead of the compound slot API */\n  buttons?: ToggleButtonShorthandItem[]\n}>(), {\n  variant: 'default',\n  size: 'md',\n  disabled: false,\n  fullWidth: false,\n  orientation: 'horizontal',\n  isDetached: false,\n  selectionMode: 'multiple',\n  modelValue: undefined,\n  defaultValue: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[]]\n}>()\n\n// Normalize modelValue / defaultValue to string[] for internal use\nconst internalSelected = ref<string[]>(\n  props.modelValue !== undefined\n    ? (Array.isArray(props.modelValue) ? [...props.modelValue] : [props.modelValue])\n    : props.defaultValue !== undefined\n      ? (Array.isArray(props.defaultValue) ? [...props.defaultValue] : [props.defaultValue])\n      : []\n)\n\n// Keep internalSelected in sync when modelValue changes from outside (controlled mode)\nimport { watch } from 'vue'\nwatch(\n  () => props.modelValue,\n  (val) => {\n    if (val === undefined) return\n    internalSelected.value = Array.isArray(val) ? [...val] : [val]\n  },\n)\n\n// The selectedValues exposed to children (always string[])\nconst selectedValues = computed(() => internalSelected.value)\n\nfunction toggleValue(value: string) {\n  if (props.selectionMode === 'single') {\n    const next = internalSelected.value.includes(value) ? [] : [value]\n    internalSelected.value = next\n    emit('update:modelValue', next[0] ?? '')\n  } else {\n    // multiple\n    const idx = internalSelected.value.indexOf(value)\n    const next = idx === -1\n      ? [...internalSelected.value, value]\n      : internalSelected.value.filter((v) => v !== value)\n    internalSelected.value = next\n    emit('update:modelValue', next)\n  }\n}\n\n// Provide context to child ToggleButtons via toRef() for live reactivity\nuseToggleButtonGroupProvide({\n  variant: toRef(props, 'variant'),\n  size: toRef(props, 'size'),\n  disabled: toRef(props, 'disabled'),\n  fullWidth: toRef(props, 'fullWidth'),\n  orientation: toRef(props, 'orientation'),\n  selectionMode: toRef(props, 'selectionMode'),\n  selectedValues,\n  toggleValue,\n})\n\nconst slotFns = computed(() =>\n  toggleButtonGroupVariants({\n    fullWidth: props.fullWidth,\n    orientation: props.orientation,\n    isDetached: props.isDetached,\n  })\n)\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-orientation=\"props.orientation\"\n    role=\"group\"\n  >\n    <template v-if=\"props.buttons\">\n      <ToggleButton\n        v-for=\"btn in props.buttons\"\n        :key=\"btn.value\"\n        :value=\"btn.value\"\n        :is-icon-only=\"btn.isIconOnly\"\n        :disabled=\"btn.disabled\"\n        :class=\"btn.class\"\n      >{{ btn.label }}</ToggleButton>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EA6Bd,MAAM,OAAO;EAKb,MAAM,mBAAmB,IACvB,MAAM,eAAe,KAAA,IAChB,MAAM,QAAQ,MAAM,WAAW,GAAG,CAAC,GAAG,MAAM,WAAW,GAAG,CAAC,MAAM,WAAW,GAC7E,MAAM,iBAAiB,KAAA,IACpB,MAAM,QAAQ,MAAM,aAAa,GAAG,CAAC,GAAG,MAAM,aAAa,GAAG,CAAC,MAAM,aAAa,GACnF,EAAC,CACT;AAIA,cACQ,MAAM,aACX,QAAQ;AACP,OAAI,QAAQ,KAAA,EAAW;AACvB,oBAAiB,QAAQ,MAAM,QAAQ,IAAI,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,IAAG;IAEjE;EAGA,MAAM,iBAAiB,eAAe,iBAAiB,MAAK;EAE5D,SAAS,YAAY,OAAe;AAClC,OAAI,MAAM,kBAAkB,UAAU;IACpC,MAAM,OAAO,iBAAiB,MAAM,SAAS,MAAM,GAAG,EAAE,GAAG,CAAC,MAAK;AACjE,qBAAiB,QAAQ;AACzB,SAAK,qBAAqB,KAAK,MAAM,GAAE;UAClC;IAGL,MAAM,OADM,iBAAiB,MAAM,QAAQ,MAAK,KAC3B,KACjB,CAAC,GAAG,iBAAiB,OAAO,MAAK,GACjC,iBAAiB,MAAM,QAAQ,MAAM,MAAM,MAAK;AACpD,qBAAiB,QAAQ;AACzB,SAAK,qBAAqB,KAAI;;;AAKlC,8BAA4B;GAC1B,SAAS,MAAM,OAAO,UAAU;GAChC,MAAM,MAAM,OAAO,OAAO;GAC1B,UAAU,MAAM,OAAO,WAAW;GAClC,WAAW,MAAM,OAAO,YAAY;GACpC,aAAa,MAAM,OAAO,cAAc;GACxC,eAAe,MAAM,OAAO,gBAAgB;GAC5C;GACA;GACD,CAAA;EAED,MAAM,UAAU,eACd,0BAA0B;GACxB,WAAW,MAAM;GACjB,aAAa,MAAM;GACnB,YAAY,MAAM;GACnB,CAAA,CACH;;uBAIE,mBAgBM,OAAA;IAfH,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA;IAC3E,oBAAkB,MAAM;IACzB,MAAK;OAEW,MAAM,WAAA,UAAA,KAAA,EACpB,mBAO+B,UAAA,EAAA,KAAA,GAAA,EAAA,WANf,MAAM,UAAb,QAAG;wBADZ,YAO+B,sBAAA;KAL5B,KAAK,IAAI;KACT,OAAO,IAAI;KACX,gBAAc,IAAI;KAClB,UAAU,IAAI;KACd,OAAK,eAAE,IAAI,MAAK;;4BACH,CAAA,gBAAA,gBAAZ,IAAI,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;;eAEf,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,EAAA,IAAA,WAAA"}

package/dist/components/button/button-group.context.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.context.js","names":[],"sources":["../../../src/components/button/button-group.context.ts"],"sourcesContent":["import { createContext } from '../../utils/context'\nimport type { Ref } from 'vue'\nimport type { ButtonVariants } from '@auronui/styles'\n\nexport type ButtonGroupSelectionMode = 'single' | 'multiple'\nexport type ButtonGroupValue = string | number | null | Array<string | number>\n\nexport interface ButtonGroupContext {\n  variant: Ref<ButtonVariants['variant']>\n  size: Ref<ButtonVariants['size']>\n  disabled: Ref<boolean>\n  fullWidth: Ref<boolean>\n  orientation: Ref<'horizontal' | 'vertical'>\n  selectionMode: Ref<ButtonGroupSelectionMode>\n  selectedValue: Ref<ButtonGroupValue>\n  isValueSelected: (value: string | number | undefined) => boolean\n  selectValue: (value: string | number) => void\n}\n\nexport const {\n  useProvide: useButtonGroupProvide,\n  useInject: useButtonGroupInject,\n  key: buttonGroupContextKey,\n} = createContext<ButtonGroupContext>('ButtonGroup')\n"],"mappings":";;AAmBA,IAAa,EACX,YAAY,uBACZ,WAAW,sBACX,KAAK,0BACH,cAAkC,cAAc"}
+{"version":3,"file":"button-group.context.js","names":[],"sources":["../../../src/components/button/button-group.context.ts"],"sourcesContent":["import { createContext } from '../../utils/context'\nimport type { Ref } from 'vue'\nimport type { ButtonVariants } from '@auronui/styles'\n\nexport type ButtonGroupSelectionMode = 'single' | 'multiple'\nexport type ButtonGroupValue = string | number | null | Array<string | number>\n\nexport interface ButtonGroupContext {\n  variant: Ref<ButtonVariants['variant']>\n  color: Ref<ButtonVariants['color']>\n  size: Ref<ButtonVariants['size']>\n  disabled: Ref<boolean>\n  fullWidth: Ref<boolean>\n  orientation: Ref<'horizontal' | 'vertical'>\n  selectionMode: Ref<ButtonGroupSelectionMode>\n  selectedValue: Ref<ButtonGroupValue>\n  isValueSelected: (value: string | number | undefined) => boolean\n  selectValue: (value: string | number) => void\n}\n\nexport const {\n  useProvide: useButtonGroupProvide,\n  useInject: useButtonGroupInject,\n  key: buttonGroupContextKey,\n} = createContext<ButtonGroupContext>('ButtonGroup')\n"],"mappings":";;AAoBA,IAAa,EACX,YAAY,uBACZ,WAAW,sBACX,KAAK,0BACH,cAAkC,cAAc"}

package/dist/components/checkbox/CheckboxGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.js","names":[],"sources":["../../../src/components/checkbox/CheckboxGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { checkboxGroupVariants, type CheckboxGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useCheckboxGroupProvide } from './checkbox-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: CheckboxGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Checkboxes\nuseCheckboxGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `checkbox-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  checkboxGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"checkbox-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"checkbox-group__wrapper\">\n      <slot />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"checkbox-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"CheckboxGroup.js","names":[],"sources":["../../../src/components/checkbox/CheckboxGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { checkboxGroupVariants, type CheckboxGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useCheckboxGroupProvide } from './checkbox-group.context'\nimport Checkbox from './Checkbox.vue'\n\ntype CheckboxShorthandItem = { value: string; label?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  variant?: CheckboxGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n  /** Shorthand API: render checkboxes from an array instead of the compound slot API */\n  items?: CheckboxShorthandItem[]\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Checkboxes\nuseCheckboxGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `checkbox-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  checkboxGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"checkbox-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"checkbox-group__wrapper\">\n      <template v-if=\"props.items\">\n        <Checkbox\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label ?? item.value }}</Checkbox>\n      </template>\n      <slot v-else />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"checkbox-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/checkbox/CheckboxGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useCheckboxGroupProvide } from "./checkbox-group.context.js";
-import { computed, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, ref, renderSlot, toDisplayString, toRef, unref } from "vue";
+import Checkbox_default from "./Checkbox.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, toRef, unref, withCtx } from "vue";
 import { checkboxGroupVariants } from "@auronui/styles";
 //#region src/components/checkbox/CheckboxGroup.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["aria-labelledby", "data-orientation"];
@@ -23,7 +24,8 @@ var CheckboxGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		orientation: { default: "vertical" },
 		label: { default: void 0 },
 		description: { default: void 0 },
-		class: {}
+		class: {},
+		items: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -57,7 +59,16 @@ var CheckboxGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 					id: labelId,
 					class: "checkbox-group__label"
 				}, toDisplayString(props.label), 1)) : createCommentVNode("", true),
-				createElementVNode("div", _hoisted_2, [renderSlot(_ctx.$slots, "default")]),
+				createElementVNode("div", _hoisted_2, [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item) => {
+					return openBlock(), createBlock(Checkbox_default, {
+						key: item.value,
+						value: item.value,
+						disabled: item.disabled
+					}, {
+						default: withCtx(() => [createTextVNode(toDisplayString(item.label ?? item.value), 1)]),
+						_: 2
+					}, 1032, ["value", "disabled"]);
+				}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
 				props.description ? (openBlock(), createElementBlock("span", _hoisted_3, toDisplayString(props.description), 1)) : createCommentVNode("", true)
 			], 10, _hoisted_1);
 		};

package/dist/components/checkbox/CheckboxGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"CheckboxGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/checkbox/CheckboxGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { checkboxGroupVariants, type CheckboxGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useCheckboxGroupProvide } from './checkbox-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: CheckboxGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Checkboxes\nuseCheckboxGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `checkbox-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  checkboxGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"checkbox-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"checkbox-group__wrapper\">\n      <slot />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"checkbox-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAqBd,MAAM,OAAO;EAKb,MAAM,iBAAiB,IAAc,MAAM,gBAAgB,EAAE,CAAA;EAG7D,MAAM,gBAAgB,eAAe,MAAM,cAAc,eAAe,MAAK;EAG7E,SAAS,YAAY,OAAe;GAClC,MAAM,OAAO,cAAc,MAAM,SAAS,MAAK,GAC3C,cAAc,MAAM,QAAO,MAAK,MAAM,MAAK,GAC3C,CAAC,GAAG,cAAc,OAAO,MAAK;AAClC,kBAAe,QAAQ;AACvB,QAAK,qBAAqB,KAAI;;AAIhC,0BAAwB;GACtB,SAAS,MAAM,OAAO,UAAU;GAChC,UAAU,MAAM,OAAO,WAAW;GAClC,gBAAgB;GAChB;GACA,MAAM,MAAM,OAAO,OAAO;GAC3B,CAAA;EAED,MAAM,UAAU,wBAAwB,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE;EAE9E,MAAM,eAAe,eACnB,sBAAsB,EAAE,SAAS,MAAM,SAAS,CAAA,CAClD;;uBAIE,mBAkBM,OAAA;IAjBJ,MAAK;IACJ,mBAAiB,MAAM,QAAQ,UAAU,KAAA;IACzC,oBAAkB,MAAM;IACxB,OAAK,eAAE,MAAA,iBAAgB,CAAC,aAAA,OAAc,MAAM,MAAK,CAAA;;IAG1C,MAAM,SAAA,WAAA,EADd,mBAIyB,QAAA;;KAFtB,IAAI;KACL,OAAM;uBACJ,MAAM,MAAK,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;IACf,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;IAGF,MAAM,eAAA,WAAA,EADd,mBAG+B,QAH/B,YAG+B,gBAA3B,MAAM,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA"}
+{"version":3,"file":"CheckboxGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/checkbox/CheckboxGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { checkboxGroupVariants, type CheckboxGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useCheckboxGroupProvide } from './checkbox-group.context'\nimport Checkbox from './Checkbox.vue'\n\ntype CheckboxShorthandItem = { value: string; label?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  variant?: CheckboxGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string[]\n  defaultValue?: string[]\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n  /** Shorthand API: render checkboxes from an array instead of the compound slot API */\n  items?: CheckboxShorthandItem[]\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string[]]\n}>()\n\n// Internal state for uncontrolled mode\nconst internalValues = ref<string[]>(props.defaultValue ?? [])\n\n// Current values: controlled (modelValue) or uncontrolled (internalValues)\nconst currentValues = computed(() => props.modelValue ?? internalValues.value)\n\n// Toggle value in the selection list\nfunction toggleValue(value: string) {\n  const next = currentValues.value.includes(value)\n    ? currentValues.value.filter(v => v !== value)\n    : [...currentValues.value, value]\n  internalValues.value = next\n  emit('update:modelValue', next)\n}\n\n// Provide context to child Checkboxes\nuseCheckboxGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n  selectedValues: currentValues,\n  toggleValue,\n  name: toRef(props, 'name'),\n})\n\nconst labelId = `checkbox-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  checkboxGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :data-orientation=\"props.orientation\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"checkbox-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"checkbox-group__wrapper\">\n      <template v-if=\"props.items\">\n        <Checkbox\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label ?? item.value }}</Checkbox>\n      </template>\n      <slot v-else />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"checkbox-group__description\"\n    >{{ props.description }}</span>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EAuBd,MAAM,OAAO;EAKb,MAAM,iBAAiB,IAAc,MAAM,gBAAgB,EAAE,CAAA;EAG7D,MAAM,gBAAgB,eAAe,MAAM,cAAc,eAAe,MAAK;EAG7E,SAAS,YAAY,OAAe;GAClC,MAAM,OAAO,cAAc,MAAM,SAAS,MAAK,GAC3C,cAAc,MAAM,QAAO,MAAK,MAAM,MAAK,GAC3C,CAAC,GAAG,cAAc,OAAO,MAAK;AAClC,kBAAe,QAAQ;AACvB,QAAK,qBAAqB,KAAI;;AAIhC,0BAAwB;GACtB,SAAS,MAAM,OAAO,UAAU;GAChC,UAAU,MAAM,OAAO,WAAW;GAClC,gBAAgB;GAChB;GACA,MAAM,MAAM,OAAO,OAAO;GAC3B,CAAA;EAED,MAAM,UAAU,wBAAwB,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE;EAE9E,MAAM,eAAe,eACnB,sBAAsB,EAAE,SAAS,MAAM,SAAS,CAAA,CAClD;;uBAIE,mBA0BM,OAAA;IAzBJ,MAAK;IACJ,mBAAiB,MAAM,QAAQ,UAAU,KAAA;IACzC,oBAAkB,MAAM;IACxB,OAAK,eAAE,MAAA,iBAAgB,CAAC,aAAA,OAAc,MAAM,MAAK,CAAA;;IAG1C,MAAM,SAAA,WAAA,EADd,mBAIyB,QAAA;;KAFtB,IAAI;KACL,OAAM;uBACJ,MAAM,MAAK,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;IACf,mBAUM,OAVN,YAUM,CATY,MAAM,SAAA,UAAA,KAAA,EACpB,mBAK0C,UAAA,EAAA,KAAA,GAAA,EAAA,WAJzB,MAAM,QAAd,SAAI;yBADb,YAK0C,kBAAA;MAHvC,KAAK,KAAK;MACV,OAAO,KAAK;MACZ,UAAU,KAAK;;6BACa,CAAA,gBAAA,gBAA3B,KAAK,SAAS,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;gBAE9B,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA;IAGT,MAAM,eAAA,WAAA,EADd,mBAG+B,QAH/B,YAG+B,gBAA3B,MAAM,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA"}

package/dist/components/collapsible/CollapsibleGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleGroup.js","names":[],"sources":["../../../src/components/collapsible/CollapsibleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { collapsibleGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport {\n  provideCollapsibleGroup,\n  type CollapsibleGroupRegistryEntry,\n} from './collapsible-group.context'\n\nconst props = withDefaults(defineProps<{\n  // single-open = true means only one child open at a time\n  singleOpen?: boolean\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  singleOpen: false,\n})\n\nconst registry = new Map<string, CollapsibleGroupRegistryEntry>()\n\nprovideCollapsibleGroup({\n  allowMultiple: toRef(() => !props.singleOpen),\n  register(entry) {\n    registry.set(entry.id, entry)\n  },\n  unregister(id) {\n    registry.delete(id)\n  },\n  notifyOpen(openingId: string) {\n    if (props.singleOpen) {\n      for (const [id, entry] of registry) {\n        if (id !== openingId && entry.open.value) {\n          entry.open.value = false\n        }\n      }\n    }\n  },\n})\n\nconst slotFns = computed(() => collapsibleGroupVariants({}))\n</script>\n\n<template>\n  <div :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\">\n    <slot />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"CollapsibleGroup.js","names":[],"sources":["../../../src/components/collapsible/CollapsibleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { collapsibleGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport {\n  provideCollapsibleGroup,\n  type CollapsibleGroupRegistryEntry,\n} from './collapsible-group.context'\nimport Collapsible from './Collapsible.vue'\nimport CollapsibleTrigger from './CollapsibleTrigger.vue'\nimport CollapsibleContent from './CollapsibleContent.vue'\n\ntype CollapsibleShorthandItem = { title: string; content?: string; defaultOpen?: boolean; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  // single-open = true means only one child open at a time\n  singleOpen?: boolean\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render collapsibles from an array instead of the compound slot API */\n  items?: CollapsibleShorthandItem[]\n}>(), {\n  singleOpen: false,\n})\n\nconst registry = new Map<string, CollapsibleGroupRegistryEntry>()\n\nprovideCollapsibleGroup({\n  allowMultiple: toRef(() => !props.singleOpen),\n  register(entry) {\n    registry.set(entry.id, entry)\n  },\n  unregister(id) {\n    registry.delete(id)\n  },\n  notifyOpen(openingId: string) {\n    if (props.singleOpen) {\n      for (const [id, entry] of registry) {\n        if (id !== openingId && entry.open.value) {\n          entry.open.value = false\n        }\n      }\n    }\n  },\n})\n\nconst slotFns = computed(() => collapsibleGroupVariants({}))\n</script>\n\n<template>\n  <div :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\">\n    <template v-if=\"props.items\">\n      <Collapsible\n        v-for=\"(item, idx) in props.items\"\n        :key=\"idx\"\n        :default-open=\"item.defaultOpen\"\n        :disabled=\"item.disabled\"\n      >\n        <CollapsibleTrigger>{{ item.title }}</CollapsibleTrigger>\n        <CollapsibleContent>{{ item.content }}</CollapsibleContent>\n      </Collapsible>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/collapsible/CollapsibleGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,9 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { provideCollapsibleGroup } from "./collapsible-group.context.js";
-import { computed, createElementBlock, defineComponent, normalizeClass, openBlock, renderSlot, toRef, unref } from "vue";
+import Collapsible_default from "./Collapsible.js";
+import CollapsibleTrigger_default from "./CollapsibleTrigger.js";
+import CollapsibleContent_default from "./CollapsibleContent.js";
+import { Fragment, computed, createBlock, createElementBlock, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, toRef, unref, withCtx } from "vue";
 import { collapsibleGroupVariants } from "@auronui/styles";
 //#region src/components/collapsible/CollapsibleGroup.vue?vue&type=script&setup=true&lang.ts
 var CollapsibleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
@@ -17,7 +20,8 @@ var CollapsibleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			Object,
 			Array
 		] },
-		classNames: {}
+		classNames: {},
+		items: {}
 	},
 	setup(__props) {
 		const props = __props;
@@ -38,7 +42,22 @@ var CollapsibleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		});
 		const slotFns = computed(() => collapsibleGroupVariants({}));
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base)) }, [renderSlot(_ctx.$slots, "default")], 2);
+			return openBlock(), createElementBlock("div", { class: normalizeClass(unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base)) }, [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item, idx) => {
+				return openBlock(), createBlock(Collapsible_default, {
+					key: idx,
+					"default-open": item.defaultOpen,
+					disabled: item.disabled
+				}, {
+					default: withCtx(() => [createVNode(CollapsibleTrigger_default, null, {
+						default: withCtx(() => [createTextVNode(toDisplayString(item.title), 1)]),
+						_: 2
+					}, 1024), createVNode(CollapsibleContent_default, null, {
+						default: withCtx(() => [createTextVNode(toDisplayString(item.content), 1)]),
+						_: 2
+					}, 1024)]),
+					_: 2
+				}, 1032, ["default-open", "disabled"]);
+			}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })], 2);
 		};
 	}
 });

package/dist/components/collapsible/CollapsibleGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsibleGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/collapsible/CollapsibleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { collapsibleGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport {\n  provideCollapsibleGroup,\n  type CollapsibleGroupRegistryEntry,\n} from './collapsible-group.context'\n\nconst props = withDefaults(defineProps<{\n  // single-open = true means only one child open at a time\n  singleOpen?: boolean\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  singleOpen: false,\n})\n\nconst registry = new Map<string, CollapsibleGroupRegistryEntry>()\n\nprovideCollapsibleGroup({\n  allowMultiple: toRef(() => !props.singleOpen),\n  register(entry) {\n    registry.set(entry.id, entry)\n  },\n  unregister(id) {\n    registry.delete(id)\n  },\n  notifyOpen(openingId: string) {\n    if (props.singleOpen) {\n      for (const [id, entry] of registry) {\n        if (id !== openingId && entry.open.value) {\n          entry.open.value = false\n        }\n      }\n    }\n  },\n})\n\nconst slotFns = computed(() => collapsibleGroupVariants({}))\n</script>\n\n<template>\n  <div :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\">\n    <slot />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EAYd,MAAM,2BAAW,IAAI,KAA2C;AAEhE,0BAAwB;GACtB,eAAe,YAAY,CAAC,MAAM,WAAW;GAC7C,SAAS,OAAO;AACd,aAAS,IAAI,MAAM,IAAI,MAAK;;GAE9B,WAAW,IAAI;AACb,aAAS,OAAO,GAAE;;GAEpB,WAAW,WAAmB;AAC5B,QAAI,MAAM;UACH,MAAM,CAAC,IAAI,UAAU,SACxB,KAAI,OAAO,aAAa,MAAM,KAAK,MACjC,OAAM,KAAK,QAAQ;;;GAK5B,CAAA;EAED,MAAM,UAAU,eAAe,yBAAyB,EAAE,CAAC,CAAA;;uBAIzD,mBAEM,OAAA,EAFA,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA,EAAA,EAAA,CAC/E,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA"}
+{"version":3,"file":"CollapsibleGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/collapsible/CollapsibleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { collapsibleGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport {\n  provideCollapsibleGroup,\n  type CollapsibleGroupRegistryEntry,\n} from './collapsible-group.context'\nimport Collapsible from './Collapsible.vue'\nimport CollapsibleTrigger from './CollapsibleTrigger.vue'\nimport CollapsibleContent from './CollapsibleContent.vue'\n\ntype CollapsibleShorthandItem = { title: string; content?: string; defaultOpen?: boolean; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  // single-open = true means only one child open at a time\n  singleOpen?: boolean\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render collapsibles from an array instead of the compound slot API */\n  items?: CollapsibleShorthandItem[]\n}>(), {\n  singleOpen: false,\n})\n\nconst registry = new Map<string, CollapsibleGroupRegistryEntry>()\n\nprovideCollapsibleGroup({\n  allowMultiple: toRef(() => !props.singleOpen),\n  register(entry) {\n    registry.set(entry.id, entry)\n  },\n  unregister(id) {\n    registry.delete(id)\n  },\n  notifyOpen(openingId: string) {\n    if (props.singleOpen) {\n      for (const [id, entry] of registry) {\n        if (id !== openingId && entry.open.value) {\n          entry.open.value = false\n        }\n      }\n    }\n  },\n})\n\nconst slotFns = computed(() => collapsibleGroupVariants({}))\n</script>\n\n<template>\n  <div :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\">\n    <template v-if=\"props.items\">\n      <Collapsible\n        v-for=\"(item, idx) in props.items\"\n        :key=\"idx\"\n        :default-open=\"item.defaultOpen\"\n        :disabled=\"item.disabled\"\n      >\n        <CollapsibleTrigger>{{ item.title }}</CollapsibleTrigger>\n        <CollapsibleContent>{{ item.content }}</CollapsibleContent>\n      </Collapsible>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAcA,MAAM,QAAQ;EAcd,MAAM,2BAAW,IAAI,KAA2C;AAEhE,0BAAwB;GACtB,eAAe,YAAY,CAAC,MAAM,WAAW;GAC7C,SAAS,OAAO;AACd,aAAS,IAAI,MAAM,IAAI,MAAK;;GAE9B,WAAW,IAAI;AACb,aAAS,OAAO,GAAE;;GAEpB,WAAW,WAAmB;AAC5B,QAAI,MAAM;UACH,MAAM,CAAC,IAAI,UAAU,SACxB,KAAI,OAAO,aAAa,MAAM,KAAK,MACjC,OAAM,KAAK,QAAQ;;;GAK5B,CAAA;EAED,MAAM,UAAU,eAAe,yBAAyB,EAAE,CAAC,CAAA;;uBAIzD,mBAaM,OAAA,EAbA,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA,EAAA,EAAA,CAC/D,MAAM,SAAA,UAAA,KAAA,EACpB,mBAQc,UAAA,EAAA,KAAA,GAAA,EAAA,WAPU,MAAM,QAApB,MAAM,QAAG;wBADnB,YAQc,qBAAA;KANX,KAAK;KACL,gBAAc,KAAK;KACnB,UAAU,KAAK;;4BAEyC,CAAzD,YAAyD,4BAAA,MAAA;6BAArB,CAAA,gBAAA,gBAAb,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;eACjC,YAA2D,4BAAA,MAAA;6BAArB,CAAA,gBAAA,gBAAf,KAAK,QAAO,EAAA,EAAA,CAAA,CAAA;;;;;eAGvC,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,EAAA,EAAA"}

package/dist/components/list-box/ListBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListBox.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionMode === 'multiple' ? 'toggle' : 'replace'\"\n    :disabled=\"props.isDisabled\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <slot />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ListBox.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\nimport ListBoxItem from './ListBoxItem.vue'\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\ntype ListBoxShorthandItem = { value: string; label?: string; disabled?: boolean; textValue?: string }\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render list items from an array instead of the compound slot API */\n  items?: ListBoxShorthandItem[]\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionMode === 'multiple' ? 'toggle' : 'replace'\"\n    :disabled=\"props.isDisabled\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <template v-if=\"props.items\">\n        <ListBoxItem\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :is-disabled=\"item.disabled\"\n          :text-value=\"item.textValue\"\n        >{{ item.label ?? item.value }}</ListBoxItem>\n      </template>\n      <slot v-else />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":""}

package/dist/components/list-box/ListBox.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useListBoxProvide } from "./ListBox.context.js";
-import { computed, createBlock, createVNode, defineComponent, mergeProps, openBlock, renderSlot, toRef, unref, useAttrs, withCtx } from "vue";
+import ListBoxItem_default from "./ListBoxItem.js";
+import { Fragment, computed, createBlock, createElementBlock, createTextVNode, createVNode, defineComponent, mergeProps, openBlock, renderList, renderSlot, toDisplayString, toRef, unref, useAttrs, withCtx } from "vue";
 import { listboxVariants } from "@auronui/styles";
 import { ListboxContent, ListboxRoot } from "reka-ui";
 //#region src/components/list-box/ListBox.vue?vue&type=script&setup=true&lang.ts
@@ -26,7 +27,8 @@ var ListBox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 			],
 			default: void 0
 		},
-		classNames: {}
+		classNames: {},
+		items: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -49,7 +51,21 @@ var ListBox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", props.selectionMode === "single" ? Array.isArray($event) ? $event[0] : $event : $event))
 			}, {
 				default: withCtx(() => [createVNode(unref(ListboxContent), mergeProps(unref(attrs), { class: unref(composeClassName)(slotFns.value, props.class, props.classNames?.base) }), {
-					default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+					default: withCtx(() => [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item) => {
+						return openBlock(), createBlock(ListBoxItem_default, {
+							key: item.value,
+							value: item.value,
+							"is-disabled": item.disabled,
+							"text-value": item.textValue
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(item.label ?? item.value), 1)]),
+							_: 2
+						}, 1032, [
+							"value",
+							"is-disabled",
+							"text-value"
+						]);
+					}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
 					_: 3
 				}, 16, ["class"])]),
 				_: 3

package/dist/components/list-box/ListBox.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListBox.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionMode === 'multiple' ? 'toggle' : 'replace'\"\n    :disabled=\"props.isDisabled\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <slot />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,MAAM,QAAQ;EAuBd,MAAM,OAAO;EAIb,MAAM,QAAQ,UAAS;AAGvB,oBAAkB;GAChB,SAAS,MAAM,OAAO,UAAU;GAChC,aAAa,MAAM,OAAO,UAAU;GACpC,YAAY,MAAM,OAAO,aAAa;GACvC,CAAA;EAED,MAAM,UAAU,eACd,gBAAgB,EAAE,SAAS,MAAM,SAAS,CAAA,CAC5C;;uBAME,YAcc,MAAA,YAAA,EAAA;IAbX,eAAa,MAAM,cAAU,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,WAAU;IAC5F,iBAAe,MAAM,gBAAY,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,aAAY;IAClG,UAAU,MAAM,kBAAa;IAC7B,sBAAoB,MAAM,kBAAa,aAAA,WAAA;IACvC,UAAU,MAAM;IAChB,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,qBAAsB,MAAM,kBAAa,WAAiB,MAAM,QAAQ,OAAM,GAAK,OAAM,KAAmB,SAAoB,OAAM;;2BAO9I,CALjB,YAKiB,MAAA,eAAA,EALjB,WACU,MAIO,MAJF,EAAA,EACZ,OAAO,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,OAAO,MAAM,YAAY,KAAI,EAAA,CAAA,EAAA;4BAE7D,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ListBox.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\nimport ListBoxItem from './ListBoxItem.vue'\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\ntype ListBoxShorthandItem = { value: string; label?: string; disabled?: boolean; textValue?: string }\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render list items from an array instead of the compound slot API */\n  items?: ListBoxShorthandItem[]\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionMode === 'multiple' ? 'toggle' : 'replace'\"\n    :disabled=\"props.isDisabled\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <template v-if=\"props.items\">\n        <ListBoxItem\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :is-disabled=\"item.disabled\"\n          :text-value=\"item.textValue\"\n        >{{ item.label ?? item.value }}</ListBoxItem>\n      </template>\n      <slot v-else />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAaA,MAAM,QAAQ;EAyBd,MAAM,OAAO;EAIb,MAAM,QAAQ,UAAS;AAGvB,oBAAkB;GAChB,SAAS,MAAM,OAAO,UAAU;GAChC,aAAa,MAAM,OAAO,UAAU;GACpC,YAAY,MAAM,OAAO,aAAa;GACvC,CAAA;EAED,MAAM,UAAU,eACd,gBAAgB,EAAE,SAAS,MAAM,SAAS,CAAA,CAC5C;;uBAME,YAuBc,MAAA,YAAA,EAAA;IAtBX,eAAa,MAAM,cAAU,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,WAAU;IAC5F,iBAAe,MAAM,gBAAY,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,aAAY;IAClG,UAAU,MAAM,kBAAa;IAC7B,sBAAoB,MAAM,kBAAa,aAAA,WAAA;IACvC,UAAU,MAAM;IAChB,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,qBAAsB,MAAM,kBAAa,WAAiB,MAAM,QAAQ,OAAM,GAAK,OAAM,KAAmB,SAAoB,OAAM;;2BAgB9I,CAdjB,YAciB,MAAA,eAAA,EAdjB,WACU,MAaO,MAbF,EAAA,EACZ,OAAO,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,OAAO,MAAM,YAAY,KAAI,EAAA,CAAA,EAAA;4BAU1D,CARK,MAAM,SAAA,UAAA,KAAA,EACpB,mBAM6C,UAAA,EAAA,KAAA,GAAA,EAAA,WAL5B,MAAM,QAAd,SAAI;0BADb,YAM6C,qBAAA;OAJ1C,KAAK,KAAK;OACV,OAAO,KAAK;OACZ,eAAa,KAAK;OAClB,cAAY,KAAK;;8BACW,CAAA,gBAAA,gBAA3B,KAAK,SAAS,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;iBAE9B,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/modal/ModalContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.js","names":[],"sources":["../../../src/components/modal/ModalContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogPortal, DialogContent, injectDialogRootContext } from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { modalVariants } from '@auronui/styles/components/modal'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useModalInject } from './Modal.vue'\nimport ModalOverlay from './ModalOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  class?: string\n}>(), {})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\n// Inject context from Modal root\nconst ctx = useModalInject({ size: 'md', scroll: 'inside', variant: 'opaque', placement: 'auto' })\n\n// Inject Reka's dialog root context to read open state for AnimatePresence\nconst dialogRootContext = injectDialogRootContext()\n\nconst styles = modalVariants()\n</script>\n\n<template>\n  <DialogPortal>\n    <ModalOverlay />\n    <DialogContent\n      :class=\"composeClassName(styles.container({ scroll: ctx.scroll }), props.class)\"\n      :data-placement=\"ctx.placement\"\n      :aria-hidden=\"!dialogRootContext.open.value || undefined\"\n      @escape-key-down=\"emit('escape-key-down', $event)\"\n      @pointer-down-outside=\"emit('pointer-down-outside', $event)\"\n      @interact-outside=\"emit('interact-outside', $event)\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <AnimatePresence>\n        <motion.div\n          v-if=\"dialogRootContext.open.value\"\n          :class=\"composeClassName(styles.dialog({ size: ctx.size, scroll: ctx.scroll }), 'modal-content-inner')\"\n          :data-placement=\"ctx.placement\"\n          :initial=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :animate=\"{ opacity: 1, scale: 1, y: 0 }\"\n          :exit=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :transition=\"{ duration: 0.2, ease: 'easeOut' }\"\n        >\n          <slot />\n        </motion.div>\n      </AnimatePresence>\n    </DialogContent>\n  </DialogPortal>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ModalContent.js","names":[],"sources":["../../../src/components/modal/ModalContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogPortal, DialogContent, injectDialogRootContext } from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { modalVariants } from '@auronui/styles/components/modal'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useModalInject } from './Modal.vue'\nimport ModalOverlay from './ModalOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  class?: string\n}>(), {})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\n// Inject context from Modal root\nconst ctx = useModalInject({ size: 'md', scroll: 'inside', variant: 'opaque', placement: 'auto' })\n\n// Inject Reka's dialog root context to read open state for AnimatePresence\nconst dialogRootContext = injectDialogRootContext()\n\nconst styles = modalVariants()\n</script>\n\n<template>\n  <DialogPortal>\n    <div class=\"modal__portal\">\n    <ModalOverlay />\n    <DialogContent\n      :class=\"composeClassName(styles.container({ scroll: ctx.scroll }), props.class)\"\n      :data-placement=\"ctx.placement\"\n      :aria-hidden=\"!dialogRootContext.open.value || undefined\"\n      @escape-key-down=\"emit('escape-key-down', $event)\"\n      @pointer-down-outside=\"emit('pointer-down-outside', $event)\"\n      @interact-outside=\"emit('interact-outside', $event)\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <AnimatePresence>\n        <motion.div\n          v-if=\"dialogRootContext.open.value\"\n          :class=\"composeClassName(styles.dialog({ size: ctx.size, scroll: ctx.scroll }), 'modal-content-inner')\"\n          :data-placement=\"ctx.placement\"\n          :initial=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :animate=\"{ opacity: 1, scale: 1, y: 0 }\"\n          :exit=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :transition=\"{ duration: 0.2, ease: 'easeOut' }\"\n        >\n          <slot />\n        </motion.div>\n      </AnimatePresence>\n    </DialogContent>\n    </div>\n  </DialogPortal>\n</template>\n"],"mappings":""}

package/dist/components/modal/ModalContent.vue_vue_type_script_setup_true_lang.js

@@ -4,9 +4,10 @@ import { AnimatePresence_default } from "../../node_modules/.pnpm/motion-v@2.2.1
 import { useModalInject } from "./Modal.vue_vue_type_script_lang.js";
 import { modalVariants } from "../../packages/styles/src/components/modal/modal.styles.js";
 import ModalOverlay_default from "./ModalOverlay.js";
-import { createBlock, createCommentVNode, createVNode, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
+import { createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
 import { DialogContent, DialogPortal, injectDialogRootContext } from "reka-ui";
 //#region src/components/modal/ModalContent.vue?vue&type=script&setup=true&lang.ts
+var _hoisted_1 = { class: "modal__portal" };
 var ModalContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "ModalContent",
 	props: { class: {} },
@@ -30,7 +31,7 @@ var ModalContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 		const styles = modalVariants();
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(DialogPortal), null, {
-				default: withCtx(() => [createVNode(ModalOverlay_default), createVNode(unref(DialogContent), {
+				default: withCtx(() => [createElementVNode("div", _hoisted_1, [createVNode(ModalOverlay_default), createVNode(unref(DialogContent), {
 					class: normalizeClass(unref(composeClassName)(unref(styles).container({ scroll: unref(ctx).scroll }), props.class)),
 					"data-placement": unref(ctx).placement,
 					"aria-hidden": !unref(dialogRootContext).open.value || void 0,
@@ -78,7 +79,7 @@ var ModalContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 					"class",
 					"data-placement",
 					"aria-hidden"
-				])]),
+				])])]),
 				_: 3
 			});
 		};

package/dist/components/modal/ModalContent.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ModalContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/modal/ModalContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogPortal, DialogContent, injectDialogRootContext } from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { modalVariants } from '@auronui/styles/components/modal'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useModalInject } from './Modal.vue'\nimport ModalOverlay from './ModalOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  class?: string\n}>(), {})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\n// Inject context from Modal root\nconst ctx = useModalInject({ size: 'md', scroll: 'inside', variant: 'opaque', placement: 'auto' })\n\n// Inject Reka's dialog root context to read open state for AnimatePresence\nconst dialogRootContext = injectDialogRootContext()\n\nconst styles = modalVariants()\n</script>\n\n<template>\n  <DialogPortal>\n    <ModalOverlay />\n    <DialogContent\n      :class=\"composeClassName(styles.container({ scroll: ctx.scroll }), props.class)\"\n      :data-placement=\"ctx.placement\"\n      :aria-hidden=\"!dialogRootContext.open.value || undefined\"\n      @escape-key-down=\"emit('escape-key-down', $event)\"\n      @pointer-down-outside=\"emit('pointer-down-outside', $event)\"\n      @interact-outside=\"emit('interact-outside', $event)\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <AnimatePresence>\n        <motion.div\n          v-if=\"dialogRootContext.open.value\"\n          :class=\"composeClassName(styles.dialog({ size: ctx.size, scroll: ctx.scroll }), 'modal-content-inner')\"\n          :data-placement=\"ctx.placement\"\n          :initial=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :animate=\"{ opacity: 1, scale: 1, y: 0 }\"\n          :exit=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :transition=\"{ duration: 0.2, ease: 'easeOut' }\"\n        >\n          <slot />\n        </motion.div>\n      </AnimatePresence>\n    </DialogContent>\n  </DialogPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EAId,MAAM,OAAO;EASb,MAAM,MAAM,eAAe;GAAE,MAAM;GAAM,QAAQ;GAAU,SAAS;GAAU,WAAW;GAAQ,CAAA;EAGjG,MAAM,oBAAoB,yBAAwB;EAElD,MAAM,SAAS,eAAc;;uBAI3B,YA0Be,MAAA,aAAA,EAAA,MAAA;2BAzBG,CAAhB,YAAgB,qBAAA,EAChB,YAuBgB,MAAA,cAAA,EAAA;KAtBb,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,UAAS,EAAA,QAAW,MAAA,IAAG,CAAC,QAAM,CAAA,EAAK,MAAM,MAAK,CAAA;KAC7E,kBAAgB,MAAA,IAAG,CAAC;KACpB,eAAW,CAAG,MAAA,kBAAiB,CAAC,KAAK,SAAS,KAAA;KAC9C,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,sBAAoB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,wBAAyB,OAAM;KACzD,mBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;KACjD,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,kBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;;4BAchC,CAZlB,YAYkB,MAAA,wBAAA,EAAA,MAAA;6BADH,CATL,MAAA,kBAAiB,CAAC,KAAK,SAAA,WAAA,EAD/B,YAUa,MAAA,OAAA,CAAA,KAAA;;OARV,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAM;QAAA,MAAS,MAAA,IAAG,CAAC;QAAI,QAAU,MAAA,IAAG,CAAC;QAAM,CAAA,EAAA,sBAAA,CAAA;OAC1E,kBAAgB,MAAA,IAAG,CAAC;OACpB,SAAS;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAAmC;OAC5C,SAAS;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAA8B;OACvC,MAAM;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAAmC;OACzC,YAAY;QAAA,UAAA;QAAA,MAAA;QAAkC;;8BAEvC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ModalContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/modal/ModalContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogPortal, DialogContent, injectDialogRootContext } from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { modalVariants } from '@auronui/styles/components/modal'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useModalInject } from './Modal.vue'\nimport ModalOverlay from './ModalOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  class?: string\n}>(), {})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\n// Inject context from Modal root\nconst ctx = useModalInject({ size: 'md', scroll: 'inside', variant: 'opaque', placement: 'auto' })\n\n// Inject Reka's dialog root context to read open state for AnimatePresence\nconst dialogRootContext = injectDialogRootContext()\n\nconst styles = modalVariants()\n</script>\n\n<template>\n  <DialogPortal>\n    <div class=\"modal__portal\">\n    <ModalOverlay />\n    <DialogContent\n      :class=\"composeClassName(styles.container({ scroll: ctx.scroll }), props.class)\"\n      :data-placement=\"ctx.placement\"\n      :aria-hidden=\"!dialogRootContext.open.value || undefined\"\n      @escape-key-down=\"emit('escape-key-down', $event)\"\n      @pointer-down-outside=\"emit('pointer-down-outside', $event)\"\n      @interact-outside=\"emit('interact-outside', $event)\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <AnimatePresence>\n        <motion.div\n          v-if=\"dialogRootContext.open.value\"\n          :class=\"composeClassName(styles.dialog({ size: ctx.size, scroll: ctx.scroll }), 'modal-content-inner')\"\n          :data-placement=\"ctx.placement\"\n          :initial=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :animate=\"{ opacity: 1, scale: 1, y: 0 }\"\n          :exit=\"{ opacity: 0, scale: 0.95, y: -10 }\"\n          :transition=\"{ duration: 0.2, ease: 'easeOut' }\"\n        >\n          <slot />\n        </motion.div>\n      </AnimatePresence>\n    </DialogContent>\n    </div>\n  </DialogPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EAId,MAAM,OAAO;EASb,MAAM,MAAM,eAAe;GAAE,MAAM;GAAM,QAAQ;GAAU,SAAS;GAAU,WAAW;GAAQ,CAAA;EAGjG,MAAM,oBAAoB,yBAAwB;EAElD,MAAM,SAAS,eAAc;;uBAI3B,YA4Be,MAAA,aAAA,EAAA,MAAA;2BADP,CA1BN,mBA0BM,OA1BN,YA0BM,CAzBN,YAAgB,qBAAA,EAChB,YAuBgB,MAAA,cAAA,EAAA;KAtBb,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,UAAS,EAAA,QAAW,MAAA,IAAG,CAAC,QAAM,CAAA,EAAK,MAAM,MAAK,CAAA;KAC7E,kBAAgB,MAAA,IAAG,CAAC;KACpB,eAAW,CAAG,MAAA,kBAAiB,CAAC,KAAK,SAAS,KAAA;KAC9C,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,sBAAoB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,wBAAyB,OAAM;KACzD,mBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;KACjD,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,kBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;;4BAchC,CAZlB,YAYkB,MAAA,wBAAA,EAAA,MAAA;6BADH,CATL,MAAA,kBAAiB,CAAC,KAAK,SAAA,WAAA,EAD/B,YAUa,MAAA,OAAA,CAAA,KAAA;;OARV,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAM;QAAA,MAAS,MAAA,IAAG,CAAC;QAAI,QAAU,MAAA,IAAG,CAAC;QAAM,CAAA,EAAA,sBAAA,CAAA;OAC1E,kBAAgB,MAAA,IAAG,CAAC;OACpB,SAAS;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAAmC;OAC5C,SAAS;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAA8B;OACvC,MAAM;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAAmC;OACzC,YAAY;QAAA,UAAA;QAAA,MAAA;QAAkC;;8BAEvC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/radio/RadioGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.js","names":[],"sources":["../../../src/components/radio/RadioGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { RadioGroupRoot } from 'reka-ui'\nimport { radioGroupVariants, type RadioGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useRadioGroupProvide } from './radio-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: RadioGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\n// Provide context to child Radio components\nuseRadioGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n})\n\nconst labelId = `radio-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  radioGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <RadioGroupRoot\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :name=\"props.name\"\n    :orientation=\"props.orientation\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n    @update:model-value=\"$event != null && emit('update:modelValue', String($event))\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"radio-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"radio-group__wrapper\">\n      <slot />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"radio-group__description\"\n    >{{ props.description }}</span>\n  </RadioGroupRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"RadioGroup.js","names":[],"sources":["../../../src/components/radio/RadioGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { RadioGroupRoot } from 'reka-ui'\nimport { radioGroupVariants, type RadioGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useRadioGroupProvide } from './radio-group.context'\nimport Radio from './Radio.vue'\n\ntype RadioShorthandItem = { value: string; label?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  variant?: RadioGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n  /** Shorthand API: render radio options from an array instead of the compound slot API */\n  items?: RadioShorthandItem[]\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\n// Provide context to child Radio components\nuseRadioGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n})\n\nconst labelId = `radio-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  radioGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <RadioGroupRoot\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :name=\"props.name\"\n    :orientation=\"props.orientation\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n    @update:model-value=\"$event != null && emit('update:modelValue', String($event))\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"radio-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"radio-group__wrapper\">\n      <template v-if=\"props.items\">\n        <Radio\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label ?? item.value }}</Radio>\n      </template>\n      <slot v-else />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"radio-group__description\"\n    >{{ props.description }}</span>\n  </RadioGroupRoot>\n</template>\n"],"mappings":""}

package/dist/components/radio/RadioGroup.vue_vue_type_script_setup_true_lang.js

@@ -1,6 +1,7 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useRadioGroupProvide } from "./radio-group.context.js";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, normalizeClass, openBlock, renderSlot, toDisplayString, toRef, unref, withCtx } from "vue";
+import Radio_default from "./Radio.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, toRef, unref, withCtx } from "vue";
 import { radioGroupVariants } from "@auronui/styles";
 import { RadioGroupRoot } from "reka-ui";
 //#region src/components/radio/RadioGroup.vue?vue&type=script&setup=true&lang.ts
@@ -23,7 +24,8 @@ var RadioGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 		orientation: { default: "vertical" },
 		label: { default: void 0 },
 		description: { default: void 0 },
-		class: {}
+		class: {},
+		items: {}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
@@ -52,7 +54,16 @@ var RadioGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 						id: labelId,
 						class: "radio-group__label"
 					}, toDisplayString(props.label), 1)) : createCommentVNode("", true),
-					createElementVNode("div", _hoisted_1, [renderSlot(_ctx.$slots, "default")]),
+					createElementVNode("div", _hoisted_1, [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item) => {
+						return openBlock(), createBlock(Radio_default, {
+							key: item.value,
+							value: item.value,
+							disabled: item.disabled
+						}, {
+							default: withCtx(() => [createTextVNode(toDisplayString(item.label ?? item.value), 1)]),
+							_: 2
+						}, 1032, ["value", "disabled"]);
+					}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
 					props.description ? (openBlock(), createElementBlock("span", _hoisted_2, toDisplayString(props.description), 1)) : createCommentVNode("", true)
 				]),
 				_: 3

package/dist/components/radio/RadioGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/radio/RadioGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { RadioGroupRoot } from 'reka-ui'\nimport { radioGroupVariants, type RadioGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useRadioGroupProvide } from './radio-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: RadioGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\n// Provide context to child Radio components\nuseRadioGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n})\n\nconst labelId = `radio-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  radioGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <RadioGroupRoot\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :name=\"props.name\"\n    :orientation=\"props.orientation\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n    @update:model-value=\"$event != null && emit('update:modelValue', String($event))\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"radio-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"radio-group__wrapper\">\n      <slot />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"radio-group__description\"\n    >{{ props.description }}</span>\n  </RadioGroupRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;EAqBd,MAAM,OAAO;AAKb,uBAAqB;GACnB,SAAS,MAAM,OAAO,UAAU;GAChC,UAAU,MAAM,OAAO,WAAW;GACnC,CAAA;EAED,MAAM,UAAU,qBAAqB,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE;EAE3E,MAAM,eAAe,eACnB,mBAAmB,EAAE,SAAS,MAAM,SAAS,CAAA,CAC/C;;uBAIE,YAsBiB,MAAA,eAAA,EAAA;IArBd,eAAa,MAAM;IACnB,iBAAe,MAAM;IACrB,UAAU,MAAM;IAChB,MAAM,MAAM;IACZ,aAAa,MAAM;IACnB,mBAAiB,MAAM,QAAQ,UAAU,KAAA;IACzC,OAAK,eAAE,MAAA,iBAAgB,CAAC,aAAA,OAAc,MAAM,MAAK,CAAA;IACjD,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,UAAM,QAAY,KAAI,qBAAsB,OAAO,OAAM,CAAA;;2BAMrD;KAHjB,MAAM,SAAA,WAAA,EADd,mBAIyB,QAAA;;MAFtB,IAAI;MACL,OAAM;wBACJ,MAAM,MAAK,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KACf,mBAEM,OAFN,YAEM,CADJ,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;KAGF,MAAM,eAAA,WAAA,EADd,mBAG+B,QAH/B,YAG+B,gBAA3B,MAAM,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA"}
+{"version":3,"file":"RadioGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/radio/RadioGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { RadioGroupRoot } from 'reka-ui'\nimport { radioGroupVariants, type RadioGroupVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useRadioGroupProvide } from './radio-group.context'\nimport Radio from './Radio.vue'\n\ntype RadioShorthandItem = { value: string; label?: string; disabled?: boolean }\n\nconst props = withDefaults(defineProps<{\n  variant?: RadioGroupVariants['variant']\n  disabled?: boolean\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  orientation?: 'horizontal' | 'vertical'\n  label?: string\n  description?: string\n  class?: string\n  /** Shorthand API: render radio options from an array instead of the compound slot API */\n  items?: RadioShorthandItem[]\n}>(), {\n  variant: 'primary',\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  orientation: 'vertical',\n  label: undefined,\n  description: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n}>()\n\n// Provide context to child Radio components\nuseRadioGroupProvide({\n  variant: toRef(props, 'variant'),\n  disabled: toRef(props, 'disabled'),\n})\n\nconst labelId = `radio-group-label-${Math.random().toString(36).slice(2, 8)}`\n\nconst groupClasses = computed(() =>\n  radioGroupVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <RadioGroupRoot\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :name=\"props.name\"\n    :orientation=\"props.orientation\"\n    :aria-labelledby=\"props.label ? labelId : undefined\"\n    :class=\"composeClassName(groupClasses, props.class)\"\n    @update:model-value=\"$event != null && emit('update:modelValue', String($event))\"\n  >\n    <span\n      v-if=\"props.label\"\n      :id=\"labelId\"\n      class=\"radio-group__label\"\n    >{{ props.label }}</span>\n    <div class=\"radio-group__wrapper\">\n      <template v-if=\"props.items\">\n        <Radio\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :disabled=\"item.disabled\"\n        >{{ item.label ?? item.value }}</Radio>\n      </template>\n      <slot v-else />\n    </div>\n    <span\n      v-if=\"props.description\"\n      class=\"radio-group__description\"\n    >{{ props.description }}</span>\n  </RadioGroupRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,MAAM,QAAQ;EAuBd,MAAM,OAAO;AAKb,uBAAqB;GACnB,SAAS,MAAM,OAAO,UAAU;GAChC,UAAU,MAAM,OAAO,WAAW;GACnC,CAAA;EAED,MAAM,UAAU,qBAAqB,KAAK,QAAQ,CAAC,SAAS,GAAG,CAAC,MAAM,GAAG,EAAE;EAE3E,MAAM,eAAe,eACnB,mBAAmB,EAAE,SAAS,MAAM,SAAS,CAAA,CAC/C;;uBAIE,YA8BiB,MAAA,eAAA,EAAA;IA7Bd,eAAa,MAAM;IACnB,iBAAe,MAAM;IACrB,UAAU,MAAM;IAChB,MAAM,MAAM;IACZ,aAAa,MAAM;IACnB,mBAAiB,MAAM,QAAQ,UAAU,KAAA;IACzC,OAAK,eAAE,MAAA,iBAAgB,CAAC,aAAA,OAAc,MAAM,MAAK,CAAA;IACjD,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,UAAM,QAAY,KAAI,qBAAsB,OAAO,OAAM,CAAA;;2BAMrD;KAHjB,MAAM,SAAA,WAAA,EADd,mBAIyB,QAAA;;MAFtB,IAAI;MACL,OAAM;wBACJ,MAAM,MAAK,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KACf,mBAUM,OAVN,YAUM,CATY,MAAM,SAAA,UAAA,KAAA,EACpB,mBAKuC,UAAA,EAAA,KAAA,GAAA,EAAA,WAJtB,MAAM,QAAd,SAAI;0BADb,YAKuC,eAAA;OAHpC,KAAK,KAAK;OACV,OAAO,KAAK;OACZ,UAAU,KAAK;;8BACa,CAAA,gBAAA,gBAA3B,KAAK,SAAS,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;iBAE9B,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA;KAGT,MAAM,eAAA,WAAA,EADd,mBAG+B,QAH/B,YAG+B,gBAA3B,MAAM,YAAW,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"SelectContent.js","names":[],"sources":["../../../src/components/select/SelectContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  SelectContent,\n  SelectViewport,\n  SelectPortal,\n  injectSelectRootContext,\n} from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { ref, watch } from 'vue'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  position?: 'item-aligned' | 'popper'\n  sideOffset?: number\n  class?: string\n}>(), {\n  position: 'popper',\n  sideOffset: 8,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst rootContext = injectSelectRootContext()\n\n// Suppress scroll-behavior:smooth for the first frame after open so Reka's\n// programmatic scrollTop jump to the selected item is instant.\nconst justOpened = ref(false)\nwatch(() => rootContext.open.value, (open) => {\n  if (open) {\n    justOpened.value = true\n    setTimeout(() => { justOpened.value = false }, 100)\n  }\n})\n</script>\n\n<template>\n  <SelectPortal>\n    <AnimatePresence>\n      <!--\n      No force-mount on SelectContent. With force-mount=true, Reka's\n      SelectContentImpl (which contains DismissableLayer with\n      disableOutsidePointerEvents=true) would mount immediately on page load and\n      block all pointer events — including clicks on the trigger button.\n\n      Without force-mount, when open=false, Reka teleports slot content into a\n      DocumentFragment (after SelectContent's own onMounted). Components inside\n      the slot (SelectItem) still get created and their setup() runs, so\n      textValue-based registrations fire at setup time.\n\n      v-show (not v-if) on the visual wrapper ensures SelectItem components are\n      always instantiated when inside the DocumentFragment — their setup() fires\n      and populates itemRegistry. The animated chrome is visually hidden via\n      v-show when closed; enter/exit animation runs via motion.div bindings.\n    -->\n      <SelectContent\n        :position=\"props.position\"\n        :side-offset=\"props.sideOffset\"\n        data-slot=\"popover\"\n      >\n        <motion.div\n          v-show=\"rootContext.open.value\"\n          :class=\"[ctx.slots.value.popover(), { 'select__popover--opening': justOpened }]\"\n          :animate=\"rootContext.open.value ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.95 }\"\n          :transition=\"{ duration: 0.15 }\"\n        >\n          <SelectViewport data-slot=\"list-box\">\n            <slot />\n          </SelectViewport>\n        </motion.div>\n      </SelectContent>\n    </AnimatePresence>\n  </SelectPortal>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SelectContent.js","names":[],"sources":["../../../src/components/select/SelectContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  SelectContent,\n  SelectViewport,\n  SelectPortal,\n  injectSelectRootContext,\n} from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { ref, watch } from 'vue'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  position?: 'item-aligned' | 'popper'\n  sideOffset?: number\n  class?: string\n}>(), {\n  position: 'popper',\n  sideOffset: 8,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst rootContext = injectSelectRootContext()\n\n// Suppress scroll-behavior:smooth for the first frame after open so Reka's\n// programmatic scrollTop jump to the selected item is instant.\nconst justOpened = ref(false)\nwatch(() => rootContext.open.value, (open) => {\n  if (open) {\n    justOpened.value = true\n    setTimeout(() => { justOpened.value = false }, 100)\n  }\n})\n\nfunction handleKeydown(e: KeyboardEvent) {\n  if (e.key === 'Tab') {\n    rootContext.onOpenChange(false)\n  }\n}\n</script>\n\n<template>\n  <SelectPortal>\n    <AnimatePresence>\n      <!--\n      No force-mount on SelectContent. With force-mount=true, Reka's\n      SelectContentImpl (which contains DismissableLayer with\n      disableOutsidePointerEvents=true) would mount immediately on page load and\n      block all pointer events — including clicks on the trigger button.\n\n      Without force-mount, when open=false, Reka teleports slot content into a\n      DocumentFragment (after SelectContent's own onMounted). Components inside\n      the slot (SelectItem) still get created and their setup() runs, so\n      textValue-based registrations fire at setup time.\n\n      v-show (not v-if) on the visual wrapper ensures SelectItem components are\n      always instantiated when inside the DocumentFragment — their setup() fires\n      and populates itemRegistry. The animated chrome is visually hidden via\n      v-show when closed; enter/exit animation runs via motion.div bindings.\n    -->\n      <SelectContent\n        :position=\"props.position\"\n        :side-offset=\"props.sideOffset\"\n        data-slot=\"popover\"\n      >\n        <motion.div\n          v-show=\"rootContext.open.value\"\n          :class=\"[ctx.slots.value.popover(), { 'select__popover--opening': justOpened }]\"\n          :animate=\"rootContext.open.value ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.95 }\"\n          :transition=\"{ duration: 0.15 }\"\n          @keydown=\"handleKeydown\"\n        >\n          <SelectViewport data-slot=\"list-box\">\n            <slot />\n          </SelectViewport>\n        </motion.div>\n      </SelectContent>\n    </AnimatePresence>\n  </SelectPortal>\n</template>\n"],"mappings":""}

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

@@ -24,6 +24,9 @@ var SelectContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				}, 100);
 			}
 		});
+		function handleKeydown(e) {
+			if (e.key === "Tab") rootContext.onOpenChange(false);
+		}
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(SelectPortal), null, {
 				default: withCtx(() => [createVNode(unref(AnimatePresence_default), null, {
@@ -41,7 +44,8 @@ var SelectContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 								opacity: 0,
 								scale: .95
 							},
-							transition: { duration: .15 }
+							transition: { duration: .15 },
+							onKeydown: handleKeydown
 						}, {
 							default: withCtx(() => [createVNode(unref(SelectViewport), { "data-slot": "list-box" }, {
 								default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),

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

@@ -1 +1 @@
-{"version":3,"file":"SelectContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  SelectContent,\n  SelectViewport,\n  SelectPortal,\n  injectSelectRootContext,\n} from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { ref, watch } from 'vue'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  position?: 'item-aligned' | 'popper'\n  sideOffset?: number\n  class?: string\n}>(), {\n  position: 'popper',\n  sideOffset: 8,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst rootContext = injectSelectRootContext()\n\n// Suppress scroll-behavior:smooth for the first frame after open so Reka's\n// programmatic scrollTop jump to the selected item is instant.\nconst justOpened = ref(false)\nwatch(() => rootContext.open.value, (open) => {\n  if (open) {\n    justOpened.value = true\n    setTimeout(() => { justOpened.value = false }, 100)\n  }\n})\n</script>\n\n<template>\n  <SelectPortal>\n    <AnimatePresence>\n      <!--\n      No force-mount on SelectContent. With force-mount=true, Reka's\n      SelectContentImpl (which contains DismissableLayer with\n      disableOutsidePointerEvents=true) would mount immediately on page load and\n      block all pointer events — including clicks on the trigger button.\n\n      Without force-mount, when open=false, Reka teleports slot content into a\n      DocumentFragment (after SelectContent's own onMounted). Components inside\n      the slot (SelectItem) still get created and their setup() runs, so\n      textValue-based registrations fire at setup time.\n\n      v-show (not v-if) on the visual wrapper ensures SelectItem components are\n      always instantiated when inside the DocumentFragment — their setup() fires\n      and populates itemRegistry. The animated chrome is visually hidden via\n      v-show when closed; enter/exit animation runs via motion.div bindings.\n    -->\n      <SelectContent\n        :position=\"props.position\"\n        :side-offset=\"props.sideOffset\"\n        data-slot=\"popover\"\n      >\n        <motion.div\n          v-show=\"rootContext.open.value\"\n          :class=\"[ctx.slots.value.popover(), { 'select__popover--opening': justOpened }]\"\n          :animate=\"rootContext.open.value ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.95 }\"\n          :transition=\"{ duration: 0.15 }\"\n        >\n          <SelectViewport data-slot=\"list-box\">\n            <slot />\n          </SelectViewport>\n        </motion.div>\n      </SelectContent>\n    </AnimatePresence>\n  </SelectPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAWA,MAAM,QAAQ;EAUd,MAAM,MAAM,iBAAgB;EAC5B,MAAM,cAAc,yBAAwB;EAI5C,MAAM,aAAa,IAAI,MAAK;AAC5B,cAAY,YAAY,KAAK,QAAQ,SAAS;AAC5C,OAAI,MAAM;AACR,eAAW,QAAQ;AACnB,qBAAiB;AAAE,gBAAW,QAAQ;OAAS,IAAG;;IAErD;;uBAIC,YAmCe,MAAA,aAAA,EAAA,MAAA;2BADK,CAjClB,YAiCkB,MAAA,wBAAA,EAAA,MAAA;4BADA,CAfhB,YAegB,MAAA,cAAA,EAAA;MAdb,UAAU,MAAM;MAChB,eAAa,MAAM;MACpB,aAAU;;6BAWG,CAAA,eATb,YASa,MAAA,OAAA,CAAA,KAAA;OAPV,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,MAAM,MAAM,SAAO,EAAA,EAAA,4BAAkC,WAAA,OAAU,CAAA,CAAA;OAC3E,SAAS,MAAA,YAAW,CAAC,KAAK,QAAK;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAAA,SAAA;QAAA,OAAA;QAAA;OAC/B,YAAY,EAAA,UAAA,KAAkB;;8BAId,CAFjB,YAEiB,MAAA,eAAA,EAAA,EAFD,aAAU,YAAU,EAAA;+BAC1B,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;;4CANF,MAAA,YAAW,CAAC,KAAK,MAAK,CAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"SelectContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/select/SelectContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport {\n  SelectContent,\n  SelectViewport,\n  SelectPortal,\n  injectSelectRootContext,\n} from 'reka-ui'\nimport { motion, AnimatePresence } from 'motion-v'\nimport { ref, watch } from 'vue'\nimport { useSelectInject } from './Select.context'\n\nconst props = withDefaults(defineProps<{\n  position?: 'item-aligned' | 'popper'\n  sideOffset?: number\n  class?: string\n}>(), {\n  position: 'popper',\n  sideOffset: 8,\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst rootContext = injectSelectRootContext()\n\n// Suppress scroll-behavior:smooth for the first frame after open so Reka's\n// programmatic scrollTop jump to the selected item is instant.\nconst justOpened = ref(false)\nwatch(() => rootContext.open.value, (open) => {\n  if (open) {\n    justOpened.value = true\n    setTimeout(() => { justOpened.value = false }, 100)\n  }\n})\n\nfunction handleKeydown(e: KeyboardEvent) {\n  if (e.key === 'Tab') {\n    rootContext.onOpenChange(false)\n  }\n}\n</script>\n\n<template>\n  <SelectPortal>\n    <AnimatePresence>\n      <!--\n      No force-mount on SelectContent. With force-mount=true, Reka's\n      SelectContentImpl (which contains DismissableLayer with\n      disableOutsidePointerEvents=true) would mount immediately on page load and\n      block all pointer events — including clicks on the trigger button.\n\n      Without force-mount, when open=false, Reka teleports slot content into a\n      DocumentFragment (after SelectContent's own onMounted). Components inside\n      the slot (SelectItem) still get created and their setup() runs, so\n      textValue-based registrations fire at setup time.\n\n      v-show (not v-if) on the visual wrapper ensures SelectItem components are\n      always instantiated when inside the DocumentFragment — their setup() fires\n      and populates itemRegistry. The animated chrome is visually hidden via\n      v-show when closed; enter/exit animation runs via motion.div bindings.\n    -->\n      <SelectContent\n        :position=\"props.position\"\n        :side-offset=\"props.sideOffset\"\n        data-slot=\"popover\"\n      >\n        <motion.div\n          v-show=\"rootContext.open.value\"\n          :class=\"[ctx.slots.value.popover(), { 'select__popover--opening': justOpened }]\"\n          :animate=\"rootContext.open.value ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.95 }\"\n          :transition=\"{ duration: 0.15 }\"\n          @keydown=\"handleKeydown\"\n        >\n          <SelectViewport data-slot=\"list-box\">\n            <slot />\n          </SelectViewport>\n        </motion.div>\n      </SelectContent>\n    </AnimatePresence>\n  </SelectPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;EAWA,MAAM,QAAQ;EAUd,MAAM,MAAM,iBAAgB;EAC5B,MAAM,cAAc,yBAAwB;EAI5C,MAAM,aAAa,IAAI,MAAK;AAC5B,cAAY,YAAY,KAAK,QAAQ,SAAS;AAC5C,OAAI,MAAM;AACR,eAAW,QAAQ;AACnB,qBAAiB;AAAE,gBAAW,QAAQ;OAAS,IAAG;;IAErD;EAED,SAAS,cAAc,GAAkB;AACvC,OAAI,EAAE,QAAQ,MACZ,aAAY,aAAa,MAAK;;;uBAMhC,YAoCe,MAAA,aAAA,EAAA,MAAA;2BADK,CAlClB,YAkCkB,MAAA,wBAAA,EAAA,MAAA;4BADA,CAhBhB,YAgBgB,MAAA,cAAA,EAAA;MAfb,UAAU,MAAM;MAChB,eAAa,MAAM;MACpB,aAAU;;6BAYG,CAAA,eAVb,YAUa,MAAA,OAAA,CAAA,KAAA;OARV,OAAK,eAAA,CAAG,MAAA,IAAG,CAAC,MAAM,MAAM,SAAO,EAAA,EAAA,4BAAkC,WAAA,OAAU,CAAA,CAAA;OAC3E,SAAS,MAAA,YAAW,CAAC,KAAK,QAAK;QAAA,SAAA;QAAA,OAAA;QAAA,GAAA;QAAA,SAAA;QAAA,OAAA;QAAA;OAC/B,YAAY,EAAA,UAAA,KAAkB;OAC9B,WAAS;;8BAIO,CAFjB,YAEiB,MAAA,eAAA,EAAA,EAFD,aAAU,YAAU,EAAA;+BAC1B,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;;4CAPF,MAAA,YAAW,CAAC,KAAK,MAAK,CAAA,CAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"SelectTrigger.js","names":[],"sources":["../../../src/components/select/SelectTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { SelectTrigger, SelectIcon, injectSelectRootContext } from 'reka-ui'\nimport { useSelectInject } from './Select.context'\n\nwithDefaults(defineProps<{\n  class?: string\n}>(), {\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst rootContext = injectSelectRootContext()\n\nconst isFilled = computed(() => {\n  const v = rootContext?.modelValue?.value\n  if (v == null) return false\n  if (Array.isArray(v)) return v.length > 0\n  return v !== ''\n})\n\nconst showInsideLabel = computed(\n  () => ctx.hasLabel.value && ctx.labelPlacement.value === 'inside',\n)\n</script>\n\n<template>\n  <SelectTrigger\n    :id=\"ctx.triggerId.value\"\n    :class=\"ctx.slots.value.trigger()\"\n    :data-filled=\"isFilled || undefined\"\n    :data-invalid=\"ctx.isInvalid.value || undefined\"\n    :data-readonly=\"ctx.isReadonly.value || undefined\"\n    :aria-invalid=\"ctx.isInvalid.value || undefined\"\n    :aria-describedby=\"ctx.ariaDescribedBy.value\"\n    data-slot=\"trigger\"\n  >\n    <label\n      v-if=\"showInsideLabel\"\n      :for=\"ctx.triggerId.value\"\n      :class=\"ctx.slots.value.label()\"\n    >{{ ctx.label.value }}<span\n      v-if=\"ctx.isRequired.value\"\n      aria-hidden=\"true\"\n    > *</span></label>\n    <span\n      v-if=\"$slots.startContent\"\n      :class=\"ctx.slots.value.startContent()\"\n      data-slot=\"start-content\"\n    >\n      <slot name=\"startContent\" />\n    </span>\n    <slot />\n    <SelectIcon\n      :class=\"ctx.slots.value.indicator()\"\n      data-slot=\"select-default-indicator\"\n    >\n      <slot name=\"selectorIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"6 9 12 15 18 9\" />\n        </svg>\n      </slot>\n    </SelectIcon>\n  </SelectTrigger>\n</template>\n"],"mappings":""}
+{"version":3,"file":"SelectTrigger.js","names":[],"sources":["../../../src/components/select/SelectTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, watch } from 'vue'\nimport { SelectTrigger, SelectIcon, injectSelectRootContext } from 'reka-ui'\nimport { useSelectInject } from './Select.context'\n\nwithDefaults(defineProps<{\n  class?: string\n}>(), {\n  class: undefined,\n})\n\nconst ctx = useSelectInject()\nconst rootContext = injectSelectRootContext()\n\nconst isFilled = computed(() => {\n  const v = rootContext?.modelValue?.value\n  if (v == null) return false\n  if (Array.isArray(v)) return v.length > 0\n  return v !== ''\n})\n\nconst showInsideLabel = computed(\n  () => ctx.hasLabel.value && ctx.labelPlacement.value === 'inside',\n)\n\n// Guard re-open when Reka returns focus to the trigger after close (value\n// selection, Escape, Tab). Set to true whenever open transitions true→false,\n// reset after a microtask once the focus-return event has been processed.\nconst skipNextFocus = ref(false)\n\n// flush:'sync' fires the moment open.value changes (synchronously, before any\n// Vue scheduling), so skipNextFocus is true before Reka's FocusScope can call\n// trigger.focus(). setTimeout defers the reset until after all pending\n// microtasks (render + focus-return) have flushed.\nwatch(() => rootContext.open.value, (open, wasOpen) => {\n  if (!open && wasOpen) {\n    skipNextFocus.value = true\n    setTimeout(() => { skipNextFocus.value = false }, 0)\n  }\n}, { flush: 'sync' })\n\nfunction handleFocus() {\n  if (ctx.isDisabled.value || ctx.isReadonly.value || skipNextFocus.value || rootContext.open.value) return\n  rootContext.onOpenChange(true)\n}\n</script>\n\n<template>\n  <SelectTrigger\n    :id=\"ctx.triggerId.value\"\n    :class=\"ctx.slots.value.trigger()\"\n    :data-filled=\"isFilled || undefined\"\n    :data-invalid=\"ctx.isInvalid.value || undefined\"\n    :data-readonly=\"ctx.isReadonly.value || undefined\"\n    :aria-invalid=\"ctx.isInvalid.value || undefined\"\n    :aria-describedby=\"ctx.ariaDescribedBy.value\"\n    data-slot=\"trigger\"\n    @focus=\"handleFocus\"\n  >\n    <label\n      v-if=\"showInsideLabel\"\n      :for=\"ctx.triggerId.value\"\n      :class=\"ctx.slots.value.label()\"\n    >{{ ctx.label.value }}<span\n      v-if=\"ctx.isRequired.value\"\n      aria-hidden=\"true\"\n    > *</span></label>\n    <span\n      v-if=\"$slots.startContent\"\n      :class=\"ctx.slots.value.startContent()\"\n      data-slot=\"start-content\"\n    >\n      <slot name=\"startContent\" />\n    </span>\n    <slot />\n    <SelectIcon\n      :class=\"ctx.slots.value.indicator()\"\n      data-slot=\"select-default-indicator\"\n    >\n      <slot name=\"selectorIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"16\"\n          height=\"16\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"6 9 12 15 18 9\" />\n        </svg>\n      </slot>\n    </SelectIcon>\n  </SelectTrigger>\n</template>\n"],"mappings":""}

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

@@ -1,5 +1,5 @@
 import { useSelectInject } from "./Select.context.js";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, renderSlot, toDisplayString, unref, withCtx } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, openBlock, ref, renderSlot, toDisplayString, unref, watch, withCtx } from "vue";
 import { SelectIcon, SelectTrigger, injectSelectRootContext } from "reka-ui";
 //#region src/components/select/SelectTrigger.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = ["for"];
@@ -20,6 +20,19 @@ var SelectTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 			return v !== "";
 		});
 		const showInsideLabel = computed(() => ctx.hasLabel.value && ctx.labelPlacement.value === "inside");
+		const skipNextFocus = ref(false);
+		watch(() => rootContext.open.value, (open, wasOpen) => {
+			if (!open && wasOpen) {
+				skipNextFocus.value = true;
+				setTimeout(() => {
+					skipNextFocus.value = false;
+				}, 0);
+			}
+		}, { flush: "sync" });
+		function handleFocus() {
+			if (ctx.isDisabled.value || ctx.isReadonly.value || skipNextFocus.value || rootContext.open.value) return;
+			rootContext.onOpenChange(true);
+		}
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(SelectTrigger), {
 				id: unref(ctx).triggerId.value,
@@ -29,7 +42,8 @@ var SelectTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				"data-readonly": unref(ctx).isReadonly.value || void 0,
 				"aria-invalid": unref(ctx).isInvalid.value || void 0,
 				"aria-describedby": unref(ctx).ariaDescribedBy.value,
-				"data-slot": "trigger"
+				"data-slot": "trigger",
+				onFocus: handleFocus
 			}, {
 				default: withCtx(() => [
 					showInsideLabel.value ? (openBlock(), createElementBlock("label", {