@auronui/vue 1.2.2 → 1.4.0

package/dist/components/autocomplete/AutocompleteItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteItem.js","names":[],"sources":["../../../src/components/autocomplete/AutocompleteItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, useSlots, type Slots, type VNode } from 'vue'\nimport { AutocompleteItem, ComboboxItemIndicator } from 'reka-ui'\nimport { useAutocompleteInject } from './Autocomplete.context'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  isDisabled?: boolean\n  class?: string\n  /** A string value for typeahead matching. Defaults to display text. */\n  textValue?: string\n  /** Whether the item is disabled. Alias for isDisabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Render the ComboboxItemIndicator as a different element. */\n  indicatorAs?: string\n  /** Merge indicator props onto child element. */\n  indicatorAsChild?: boolean\n}>(), {\n  isDisabled: false,\n  class: undefined,\n  textValue: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n  indicatorAs: undefined,\n  indicatorAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'select': [event: Event]\n}>()\n\nconst slots: Slots = useSlots()\nconst ctx = useAutocompleteInject()\n\nfunction extractText(nodes: VNode[]): string {\n  return nodes.map(n => {\n    if (typeof n.children === 'string') return n.children\n    if (Array.isArray(n.children)) return extractText(n.children as VNode[])\n    return ''\n  }).join('')\n}\n\nconst displayText = computed((): string => {\n  const vnodes: VNode[] | undefined = (slots.default as (() => VNode[]) | undefined)?.()\n  if (!vnodes) return props.value\n  return extractText(vnodes).trim() || props.value\n})\n\n// In multiple mode, track whether this item is in the selected array\nconst isChecked = computed(() => ctx.multiple.value && ctx.isSelected(props.value))\n\nonMounted(() => {\n  ctx.registerItem(props.value, displayText.value)\n})\n\nonUnmounted(() => {\n  ctx.unregisterItem(props.value)\n})\n\nfunction handleSelect(event: Event) {\n  emit('select', event)\n  if (ctx.multiple.value) {\n    // Prevent Reka from overwriting the combobox value with the selected item's text.\n    // Without this, Reka's internal handler fires after ours and sets searchTerm = displayText.\n    event.preventDefault()\n    ctx.onMultipleSelect(props.value)\n  }\n}\n</script>\n\n<template>\n  <AutocompleteItem\n    :value=\"displayText\"\n    :text-value=\"props.textValue ?? displayText\"\n    :disabled=\"props.disabled ?? props.isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :data-item-value=\"props.value\"\n    :data-selected=\"isChecked || undefined\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n    @select=\"handleSelect\"\n  >\n    <slot name=\"startContent\" />\n    <span\n      class=\"autocomplete-item__text\"\n      data-slot=\"item-text\"\n    ><slot /></span>\n    <!-- Single mode: Reka's ComboboxItemIndicator handles the checkmark natively -->\n    <ComboboxItemIndicator\n      v-if=\"!ctx.multiple.value\"\n      :as=\"props.indicatorAs\"\n      :as-child=\"props.indicatorAsChild\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </ComboboxItemIndicator>\n    <!-- Multiple mode: check against our selectedValues array instead -->\n    <span\n      v-else-if=\"isChecked\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </span>\n    <slot name=\"endContent\" />\n  </AutocompleteItem>\n</template>\n"],"mappings":""}
+{"version":3,"file":"AutocompleteItem.js","names":[],"sources":["../../../src/components/autocomplete/AutocompleteItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, useSlots, type Slots, type VNode } from 'vue'\nimport { AutocompleteItem, ComboboxItemIndicator } from 'reka-ui'\nimport { useAutocompleteInject } from './Autocomplete.context'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  isDisabled?: boolean\n  class?: string\n  /** A string value for typeahead matching. Defaults to display text. */\n  textValue?: string\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Render the ComboboxItemIndicator as a different element. */\n  indicatorAs?: string\n  /** Merge indicator props onto child element. */\n  indicatorAsChild?: boolean\n}>(), {\n  isDisabled: undefined,\n  class: undefined,\n  textValue: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n  indicatorAs: undefined,\n  indicatorAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'select': [event: Event]\n}>()\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'AutocompleteItem', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst slots: Slots = useSlots()\nconst ctx = useAutocompleteInject()\n\nfunction extractText(nodes: VNode[]): string {\n  return nodes.map(n => {\n    if (typeof n.children === 'string') return n.children\n    if (Array.isArray(n.children)) return extractText(n.children as VNode[])\n    return ''\n  }).join('')\n}\n\nconst displayText = computed((): string => {\n  const vnodes: VNode[] | undefined = (slots.default as (() => VNode[]) | undefined)?.()\n  if (!vnodes) return props.value\n  return extractText(vnodes).trim() || props.value\n})\n\n// In multiple mode, track whether this item is in the selected array\nconst isChecked = computed(() => ctx.multiple.value && ctx.isSelected(props.value))\n\nonMounted(() => {\n  ctx.registerItem(props.value, displayText.value)\n})\n\nonUnmounted(() => {\n  ctx.unregisterItem(props.value)\n})\n\nfunction handleSelect(event: Event) {\n  emit('select', event)\n  if (ctx.multiple.value) {\n    // Prevent Reka from overwriting the combobox value with the selected item's text.\n    // Without this, Reka's internal handler fires after ours and sets searchTerm = displayText.\n    event.preventDefault()\n    ctx.onMultipleSelect(props.value)\n  }\n}\n</script>\n\n<template>\n  <AutocompleteItem\n    :value=\"displayText\"\n    :text-value=\"props.textValue ?? displayText\"\n    :disabled=\"isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :data-item-value=\"props.value\"\n    :data-selected=\"isChecked || undefined\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n    @select=\"handleSelect\"\n  >\n    <slot name=\"startContent\" />\n    <span\n      class=\"autocomplete-item__text\"\n      data-slot=\"item-text\"\n    ><slot /></span>\n    <!-- Single mode: Reka's ComboboxItemIndicator handles the checkmark natively -->\n    <ComboboxItemIndicator\n      v-if=\"!ctx.multiple.value\"\n      :as=\"props.indicatorAs\"\n      :as-child=\"props.indicatorAsChild\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </ComboboxItemIndicator>\n    <!-- Multiple mode: check against our selectedValues array instead -->\n    <span\n      v-else-if=\"isChecked\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </span>\n    <slot name=\"endContent\" />\n  </AutocompleteItem>\n</template>\n"],"mappings":""}

package/dist/components/autocomplete/AutocompleteItem.vue_vue_type_script_setup_true_lang.js

@@ -1,3 +1,4 @@
+import { useDeprecatedBooleanProp } from "../../composables/useDeprecatedBooleanProp.js";
 import { useAutocompleteInject } from "./Autocomplete.context.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, defineComponent, onMounted, onUnmounted, openBlock, renderSlot, unref, useSlots, withCtx } from "vue";
 import { AutocompleteItem, ComboboxItemIndicator } from "reka-ui";
@@ -17,7 +18,7 @@ var AutocompleteItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		value: {},
 		isDisabled: {
 			type: Boolean,
-			default: false
+			default: void 0
 		},
 		class: { default: void 0 },
 		textValue: { default: void 0 },
@@ -40,6 +41,7 @@ var AutocompleteItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
+		const isDisabled = useDeprecatedBooleanProp("AutocompleteItem", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
 		const slots = useSlots();
 		const ctx = useAutocompleteInject();
 		function extractText(nodes) {
@@ -72,7 +74,7 @@ var AutocompleteItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 			return openBlock(), createBlock(unref(AutocompleteItem), {
 				value: displayText.value,
 				"text-value": props.textValue ?? displayText.value,
-				disabled: props.disabled ?? props.isDisabled,
+				disabled: unref(isDisabled),
 				as: props.as,
 				"as-child": props.asChild,
 				"data-item-value": props.value,

package/dist/components/autocomplete/AutocompleteItem.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"AutocompleteItem.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/autocomplete/AutocompleteItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, useSlots, type Slots, type VNode } from 'vue'\nimport { AutocompleteItem, ComboboxItemIndicator } from 'reka-ui'\nimport { useAutocompleteInject } from './Autocomplete.context'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  isDisabled?: boolean\n  class?: string\n  /** A string value for typeahead matching. Defaults to display text. */\n  textValue?: string\n  /** Whether the item is disabled. Alias for isDisabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Render the ComboboxItemIndicator as a different element. */\n  indicatorAs?: string\n  /** Merge indicator props onto child element. */\n  indicatorAsChild?: boolean\n}>(), {\n  isDisabled: false,\n  class: undefined,\n  textValue: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n  indicatorAs: undefined,\n  indicatorAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'select': [event: Event]\n}>()\n\nconst slots: Slots = useSlots()\nconst ctx = useAutocompleteInject()\n\nfunction extractText(nodes: VNode[]): string {\n  return nodes.map(n => {\n    if (typeof n.children === 'string') return n.children\n    if (Array.isArray(n.children)) return extractText(n.children as VNode[])\n    return ''\n  }).join('')\n}\n\nconst displayText = computed((): string => {\n  const vnodes: VNode[] | undefined = (slots.default as (() => VNode[]) | undefined)?.()\n  if (!vnodes) return props.value\n  return extractText(vnodes).trim() || props.value\n})\n\n// In multiple mode, track whether this item is in the selected array\nconst isChecked = computed(() => ctx.multiple.value && ctx.isSelected(props.value))\n\nonMounted(() => {\n  ctx.registerItem(props.value, displayText.value)\n})\n\nonUnmounted(() => {\n  ctx.unregisterItem(props.value)\n})\n\nfunction handleSelect(event: Event) {\n  emit('select', event)\n  if (ctx.multiple.value) {\n    // Prevent Reka from overwriting the combobox value with the selected item's text.\n    // Without this, Reka's internal handler fires after ours and sets searchTerm = displayText.\n    event.preventDefault()\n    ctx.onMultipleSelect(props.value)\n  }\n}\n</script>\n\n<template>\n  <AutocompleteItem\n    :value=\"displayText\"\n    :text-value=\"props.textValue ?? displayText\"\n    :disabled=\"props.disabled ?? props.isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :data-item-value=\"props.value\"\n    :data-selected=\"isChecked || undefined\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n    @select=\"handleSelect\"\n  >\n    <slot name=\"startContent\" />\n    <span\n      class=\"autocomplete-item__text\"\n      data-slot=\"item-text\"\n    ><slot /></span>\n    <!-- Single mode: Reka's ComboboxItemIndicator handles the checkmark natively -->\n    <ComboboxItemIndicator\n      v-if=\"!ctx.multiple.value\"\n      :as=\"props.indicatorAs\"\n      :as-child=\"props.indicatorAsChild\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </ComboboxItemIndicator>\n    <!-- Multiple mode: check against our selectedValues array instead -->\n    <span\n      v-else-if=\"isChecked\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </span>\n    <slot name=\"endContent\" />\n  </AutocompleteItem>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAKA,MAAM,QAAQ;EA2Bd,MAAM,OAAO;EAIb,MAAM,QAAe,UAAS;EAC9B,MAAM,MAAM,uBAAsB;EAElC,SAAS,YAAY,OAAwB;AAC3C,UAAO,MAAM,KAAI,MAAK;AACpB,QAAI,OAAO,EAAE,aAAa,SAAU,QAAO,EAAE;AAC7C,QAAI,MAAM,QAAQ,EAAE,SAAS,CAAE,QAAO,YAAY,EAAE,SAAmB;AACvE,WAAO;KACP,CAAC,KAAK,GAAE;;EAGZ,MAAM,cAAc,eAAuB;GACzC,MAAM,SAA+B,MAAM,WAA0C;AACrF,OAAI,CAAC,OAAQ,QAAO,MAAM;AAC1B,UAAO,YAAY,OAAO,CAAC,MAAM,IAAI,MAAM;IAC5C;EAGD,MAAM,YAAY,eAAe,IAAI,SAAS,SAAS,IAAI,WAAW,MAAM,MAAM,CAAA;AAElF,kBAAgB;AACd,OAAI,aAAa,MAAM,OAAO,YAAY,MAAK;IAChD;AAED,oBAAkB;AAChB,OAAI,eAAe,MAAM,MAAK;IAC/B;EAED,SAAS,aAAa,OAAc;AAClC,QAAK,UAAU,MAAK;AACpB,OAAI,IAAI,SAAS,OAAO;AAGtB,UAAM,gBAAe;AACrB,QAAI,iBAAiB,MAAM,MAAK;;;;uBAMlC,YAoEmB,MAAA,iBAAA,EAAA;IAnEhB,OAAO,YAAA;IACP,cAAY,MAAM,aAAa,YAAA;IAC/B,UAAU,MAAM,YAAY,MAAM;IAClC,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,mBAAiB,MAAM;IACvB,iBAAe,UAAA,SAAa,KAAA;IAC7B,OAAM;IACN,aAAU;IACT,UAAQ;;2BAEmB;KAA5B,WAA4B,KAAA,QAAA,eAAA;KAC5B,mBAGgB,QAHhB,YAGgB,CAAf,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;MAGA,MAAA,IAAG,CAAC,SAAS,SAAA,WAAA,EADtB,YAwBwB,MAAA,sBAAA,EAAA;;MAtBrB,IAAI,MAAM;MACV,YAAU,MAAM;MACjB,OAAM;MACN,aAAU;;6BAkBH,CAhBP,WAgBO,KAAA,QAAA,gBAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAfL,mBAcM,OAAA;OAbJ,OAAM;OACN,OAAM;OACN,QAAO;OACP,SAAQ;OACR,MAAK;OACL,QAAO;OACP,gBAAa;OACb,kBAAe;OACf,mBAAgB;OAChB,aAAU;OACV,eAAY;UAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA;;kCAM1B,UAAA,SAAA,WAAA,EADb,mBAsBO,QAtBP,YAsBO,CAjBL,WAgBO,KAAA,QAAA,gBAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAfL,mBAcM,OAAA;MAbJ,OAAM;MACN,OAAM;MACN,QAAO;MACP,SAAQ;MACR,MAAK;MACL,QAAO;MACP,gBAAa;MACb,kBAAe;MACf,mBAAgB;MAChB,aAAU;MACV,eAAY;SAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;KAIvC,WAA0B,KAAA,QAAA,aAAA"}
+{"version":3,"file":"AutocompleteItem.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/autocomplete/AutocompleteItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, onMounted, onUnmounted, useSlots, type Slots, type VNode } from 'vue'\nimport { AutocompleteItem, ComboboxItemIndicator } from 'reka-ui'\nimport { useAutocompleteInject } from './Autocomplete.context'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  isDisabled?: boolean\n  class?: string\n  /** A string value for typeahead matching. Defaults to display text. */\n  textValue?: string\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Render the ComboboxItemIndicator as a different element. */\n  indicatorAs?: string\n  /** Merge indicator props onto child element. */\n  indicatorAsChild?: boolean\n}>(), {\n  isDisabled: undefined,\n  class: undefined,\n  textValue: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n  indicatorAs: undefined,\n  indicatorAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'select': [event: Event]\n}>()\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'AutocompleteItem', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst slots: Slots = useSlots()\nconst ctx = useAutocompleteInject()\n\nfunction extractText(nodes: VNode[]): string {\n  return nodes.map(n => {\n    if (typeof n.children === 'string') return n.children\n    if (Array.isArray(n.children)) return extractText(n.children as VNode[])\n    return ''\n  }).join('')\n}\n\nconst displayText = computed((): string => {\n  const vnodes: VNode[] | undefined = (slots.default as (() => VNode[]) | undefined)?.()\n  if (!vnodes) return props.value\n  return extractText(vnodes).trim() || props.value\n})\n\n// In multiple mode, track whether this item is in the selected array\nconst isChecked = computed(() => ctx.multiple.value && ctx.isSelected(props.value))\n\nonMounted(() => {\n  ctx.registerItem(props.value, displayText.value)\n})\n\nonUnmounted(() => {\n  ctx.unregisterItem(props.value)\n})\n\nfunction handleSelect(event: Event) {\n  emit('select', event)\n  if (ctx.multiple.value) {\n    // Prevent Reka from overwriting the combobox value with the selected item's text.\n    // Without this, Reka's internal handler fires after ours and sets searchTerm = displayText.\n    event.preventDefault()\n    ctx.onMultipleSelect(props.value)\n  }\n}\n</script>\n\n<template>\n  <AutocompleteItem\n    :value=\"displayText\"\n    :text-value=\"props.textValue ?? displayText\"\n    :disabled=\"isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :data-item-value=\"props.value\"\n    :data-selected=\"isChecked || undefined\"\n    class=\"list-box-item list-box-item--default\"\n    data-slot=\"list-box-item\"\n    @select=\"handleSelect\"\n  >\n    <slot name=\"startContent\" />\n    <span\n      class=\"autocomplete-item__text\"\n      data-slot=\"item-text\"\n    ><slot /></span>\n    <!-- Single mode: Reka's ComboboxItemIndicator handles the checkmark natively -->\n    <ComboboxItemIndicator\n      v-if=\"!ctx.multiple.value\"\n      :as=\"props.indicatorAs\"\n      :as-child=\"props.indicatorAsChild\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </ComboboxItemIndicator>\n    <!-- Multiple mode: check against our selectedValues array instead -->\n    <span\n      v-else-if=\"isChecked\"\n      class=\"list-box-item__indicator\"\n      data-slot=\"list-box-item-indicator\"\n    >\n      <slot name=\"selectedIcon\">\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </span>\n    <slot name=\"endContent\" />\n  </AutocompleteItem>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EA2Bd,MAAM,OAAO;EAIb,MAAM,aAAa,yBACjB,oBAAoB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SACpF;EAEA,MAAM,QAAe,UAAS;EAC9B,MAAM,MAAM,uBAAsB;EAElC,SAAS,YAAY,OAAwB;AAC3C,UAAO,MAAM,KAAI,MAAK;AACpB,QAAI,OAAO,EAAE,aAAa,SAAU,QAAO,EAAE;AAC7C,QAAI,MAAM,QAAQ,EAAE,SAAS,CAAE,QAAO,YAAY,EAAE,SAAmB;AACvE,WAAO;KACP,CAAC,KAAK,GAAE;;EAGZ,MAAM,cAAc,eAAuB;GACzC,MAAM,SAA+B,MAAM,WAA0C;AACrF,OAAI,CAAC,OAAQ,QAAO,MAAM;AAC1B,UAAO,YAAY,OAAO,CAAC,MAAM,IAAI,MAAM;IAC5C;EAGD,MAAM,YAAY,eAAe,IAAI,SAAS,SAAS,IAAI,WAAW,MAAM,MAAM,CAAA;AAElF,kBAAgB;AACd,OAAI,aAAa,MAAM,OAAO,YAAY,MAAK;IAChD;AAED,oBAAkB;AAChB,OAAI,eAAe,MAAM,MAAK;IAC/B;EAED,SAAS,aAAa,OAAc;AAClC,QAAK,UAAU,MAAK;AACpB,OAAI,IAAI,SAAS,OAAO;AAGtB,UAAM,gBAAe;AACrB,QAAI,iBAAiB,MAAM,MAAK;;;;uBAMlC,YAoEmB,MAAA,iBAAA,EAAA;IAnEhB,OAAO,YAAA;IACP,cAAY,MAAM,aAAa,YAAA;IAC/B,UAAU,MAAA,WAAU;IACpB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,mBAAiB,MAAM;IACvB,iBAAe,UAAA,SAAa,KAAA;IAC7B,OAAM;IACN,aAAU;IACT,UAAQ;;2BAEmB;KAA5B,WAA4B,KAAA,QAAA,eAAA;KAC5B,mBAGgB,QAHhB,YAGgB,CAAf,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;MAGA,MAAA,IAAG,CAAC,SAAS,SAAA,WAAA,EADtB,YAwBwB,MAAA,sBAAA,EAAA;;MAtBrB,IAAI,MAAM;MACV,YAAU,MAAM;MACjB,OAAM;MACN,aAAU;;6BAkBH,CAhBP,WAgBO,KAAA,QAAA,gBAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAfL,mBAcM,OAAA;OAbJ,OAAM;OACN,OAAM;OACN,QAAO;OACP,SAAQ;OACR,MAAK;OACL,QAAO;OACP,gBAAa;OACb,kBAAe;OACf,mBAAgB;OAChB,aAAU;OACV,eAAY;UAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA;;kCAM1B,UAAA,SAAA,WAAA,EADb,mBAsBO,QAtBP,YAsBO,CAjBL,WAgBO,KAAA,QAAA,gBAAA,EAAA,QAAA,CAAA,OAAA,OAAA,OAAA,KAfL,mBAcM,OAAA;MAbJ,OAAM;MACN,OAAM;MACN,QAAO;MACP,SAAQ;MACR,MAAK;MACL,QAAO;MACP,gBAAa;MACb,kBAAe;MACf,mBAAgB;MAChB,aAAU;MACV,eAAY;SAEZ,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,EAAA,CAAA,CAAA,CAAA,IAAA,mBAAA,IAAA,KAAA;KAIvC,WAA0B,KAAA,QAAA,aAAA"}

package/dist/components/avatar/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","names":[],"sources":["../../../src/components/avatar/AvatarGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, ref, h, Fragment, type VNode } from 'vue'\nimport { type AvatarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useAvatarGroupProvide } from './avatar-group.context'\nimport Avatar from './Avatar.vue'\n\ntype AvatarShorthandItem = {\n  src?: string\n  alt?: string\n  name?: string\n  color?: AvatarVariants['color']\n  variant?: AvatarVariants['variant']\n  isBordered?: boolean\n  isDisabled?: boolean\n  showFallback?: boolean\n}\n\nconst props = withDefaults(defineProps<{\n  size?: 'sm' | 'md' | 'lg'\n  isBordered?: boolean\n  isDisabled?: boolean\n  isGrid?: boolean\n  max?: number\n  total?: number\n  renderCount?: (count: number) => string\n  class?: string\n  /** Shorthand API: render avatars from an array instead of the compound slot API */\n  avatars?: AvatarShorthandItem[]\n}>(), {\n  size: 'md',\n\n  isBordered: false,\n  isDisabled: false,\n  isGrid: false,\n})\n\nconst slots = defineSlots<{\n  default?(): VNode[];\n}>()\n\n// Provide context using toRef() for reactivity (canonical pattern from ButtonGroup)\nuseAvatarGroupProvide({\n  size: toRef(props, 'size'),\n  isBordered: toRef(props, 'isBordered'),\n  isDisabled: toRef(props, 'isDisabled'),\n  isGrid: toRef(props, 'isGrid'),\n  isInGroup: ref(true),\n})\n\nconst containerClass = computed(() =>\n  composeClassName('flex items-center flex-row', props.class)\n)\n\nconst visibleAvatars = computed(() => {\n  if (!props.avatars) return []\n  return props.max !== undefined ? props.avatars.slice(0, props.max) : props.avatars\n})\nconst avatarOverflowCount = computed(() => {\n  if (!props.avatars || props.max === undefined) return 0\n  const total = props.total ?? props.avatars.length\n  return total - props.max\n})\nconst avatarOverflowLabel = computed(() => {\n  if (avatarOverflowCount.value <= 0) return ''\n  return props.renderCount ? props.renderCount(avatarOverflowCount.value) : `+${avatarOverflowCount.value}`\n})\n\n// Flatten slot vnodes (handles Fragments from v-for etc.)\nfunction flattenVNodes(vnodes: VNode[]): VNode[] {\n  const result: VNode[] = []\n  for (const vnode of vnodes) {\n    if (vnode.type === Fragment && Array.isArray(vnode.children)) {\n      result.push(...flattenVNodes(vnode.children as VNode[]))\n    } else {\n      result.push(vnode)\n    }\n  }\n  return result\n}\n\n// Determine which vnodes to render when max is set\nfunction getSlicedNodes(): VNode[] {\n  const defaultSlot = slots.default?.()\n  if (!defaultSlot) return []\n\n  const allNodes = flattenVNodes(defaultSlot)\n\n  if (props.max === undefined) {\n    return allNodes\n  }\n\n  const visibleNodes = allNodes.slice(0, props.max)\n  const totalCount = props.total ?? allNodes.length\n  const overflowCount = totalCount - props.max\n\n  if (overflowCount <= 0) {\n    return visibleNodes\n  }\n\n  const counterLabel = props.renderCount\n    ? props.renderCount(overflowCount)\n    : `+${overflowCount}`\n\n  // Render counter avatar with a fallback slot so the full label string is shown\n  const counterNode = h(Avatar, {}, {\n    fallback: () => h('span', { class: 'avatar__name text-xs font-medium leading-none' }, counterLabel),\n  })\n\n  return [...visibleNodes, counterNode]\n}\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :class=\"containerClass\"\n  >\n    <template v-if=\"props.avatars\">\n      <Avatar\n        v-for=\"(avatar, idx) in visibleAvatars\"\n        :key=\"idx\"\n        v-bind=\"avatar\"\n      />\n      <Avatar v-if=\"avatarOverflowCount > 0\">\n        <template #fallback>\n          <span class=\"avatar__name text-xs font-medium leading-none\">{{ avatarOverflowLabel }}</span>\n        </template>\n      </Avatar>\n    </template>\n    <template v-else-if=\"props.max !== undefined\">\n      <!-- Use render function output for sliced vnodes -->\n      <template\n        v-for=\"(node, _i) in getSlicedNodes()\"\n        :key=\"_i\"\n      >\n        <component :is=\"node\" />\n      </template>\n    </template>\n    <template v-else>\n      <slot />\n    </template>\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"AvatarGroup.js","names":[],"sources":["../../../src/components/avatar/AvatarGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, ref, h, Fragment, type VNode } from 'vue'\nimport { type AvatarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useAvatarGroupProvide } from './avatar-group.context'\nimport Avatar from './Avatar.vue'\n\ntype AvatarShorthandItem = {\n  src?: string\n  alt?: string\n  name?: string\n  color?: AvatarVariants['color']\n  variant?: AvatarVariants['variant']\n  isBordered?: boolean\n  isDisabled?: boolean\n  showFallback?: boolean\n}\n\nconst props = withDefaults(defineProps<{\n  size?: AvatarVariants['size']\n  isBordered?: boolean\n  isDisabled?: boolean\n  isGrid?: boolean\n  max?: number\n  total?: number\n  renderCount?: (count: number) => string\n  class?: string\n  /** Shorthand API: render avatars from an array instead of the compound slot API */\n  avatars?: AvatarShorthandItem[]\n}>(), {\n  size: 'md',\n\n  isBordered: false,\n  isDisabled: false,\n  isGrid: false,\n})\n\nconst slots = defineSlots<{\n  default?(): VNode[];\n}>()\n\n// Provide context using toRef() for reactivity (canonical pattern from ButtonGroup)\nuseAvatarGroupProvide({\n  size: toRef(props, 'size'),\n  isBordered: toRef(props, 'isBordered'),\n  isDisabled: toRef(props, 'isDisabled'),\n  isGrid: toRef(props, 'isGrid'),\n  isInGroup: ref(true),\n})\n\nconst containerClass = computed(() =>\n  composeClassName('flex items-center flex-row', props.class)\n)\n\nconst visibleAvatars = computed(() => {\n  if (!props.avatars) return []\n  return props.max !== undefined ? props.avatars.slice(0, props.max) : props.avatars\n})\nconst avatarOverflowCount = computed(() => {\n  if (!props.avatars || props.max === undefined) return 0\n  const total = props.total ?? props.avatars.length\n  return total - props.max\n})\nconst avatarOverflowLabel = computed(() => {\n  if (avatarOverflowCount.value <= 0) return ''\n  return props.renderCount ? props.renderCount(avatarOverflowCount.value) : `+${avatarOverflowCount.value}`\n})\n\n// Flatten slot vnodes (handles Fragments from v-for etc.)\nfunction flattenVNodes(vnodes: VNode[]): VNode[] {\n  const result: VNode[] = []\n  for (const vnode of vnodes) {\n    if (vnode.type === Fragment && Array.isArray(vnode.children)) {\n      result.push(...flattenVNodes(vnode.children as VNode[]))\n    } else {\n      result.push(vnode)\n    }\n  }\n  return result\n}\n\n// Determine which vnodes to render when max is set\nfunction getSlicedNodes(): VNode[] {\n  const defaultSlot = slots.default?.()\n  if (!defaultSlot) return []\n\n  const allNodes = flattenVNodes(defaultSlot)\n\n  if (props.max === undefined) {\n    return allNodes\n  }\n\n  const visibleNodes = allNodes.slice(0, props.max)\n  const totalCount = props.total ?? allNodes.length\n  const overflowCount = totalCount - props.max\n\n  if (overflowCount <= 0) {\n    return visibleNodes\n  }\n\n  const counterLabel = props.renderCount\n    ? props.renderCount(overflowCount)\n    : `+${overflowCount}`\n\n  // Render counter avatar with a fallback slot so the full label string is shown\n  const counterNode = h(Avatar, {}, {\n    fallback: () => h('span', { class: 'avatar__name text-xs font-medium leading-none' }, counterLabel),\n  })\n\n  return [...visibleNodes, counterNode]\n}\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :class=\"containerClass\"\n  >\n    <template v-if=\"props.avatars\">\n      <Avatar\n        v-for=\"(avatar, idx) in visibleAvatars\"\n        :key=\"idx\"\n        v-bind=\"avatar\"\n      />\n      <Avatar v-if=\"avatarOverflowCount > 0\">\n        <template #fallback>\n          <span class=\"avatar__name text-xs font-medium leading-none\">{{ avatarOverflowLabel }}</span>\n        </template>\n      </Avatar>\n    </template>\n    <template v-else-if=\"props.max !== undefined\">\n      <!-- Use render function output for sliced vnodes -->\n      <template\n        v-for=\"(node, _i) in getSlicedNodes()\"\n        :key=\"_i\"\n      >\n        <component :is=\"node\" />\n      </template>\n    </template>\n    <template v-else>\n      <slot />\n    </template>\n  </div>\n</template>\n"],"mappings":""}

package/dist/components/avatar/AvatarGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/avatar/AvatarGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, ref, h, Fragment, type VNode } from 'vue'\nimport { type AvatarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useAvatarGroupProvide } from './avatar-group.context'\nimport Avatar from './Avatar.vue'\n\ntype AvatarShorthandItem = {\n  src?: string\n  alt?: string\n  name?: string\n  color?: AvatarVariants['color']\n  variant?: AvatarVariants['variant']\n  isBordered?: boolean\n  isDisabled?: boolean\n  showFallback?: boolean\n}\n\nconst props = withDefaults(defineProps<{\n  size?: 'sm' | 'md' | 'lg'\n  isBordered?: boolean\n  isDisabled?: boolean\n  isGrid?: boolean\n  max?: number\n  total?: number\n  renderCount?: (count: number) => string\n  class?: string\n  /** Shorthand API: render avatars from an array instead of the compound slot API */\n  avatars?: AvatarShorthandItem[]\n}>(), {\n  size: 'md',\n\n  isBordered: false,\n  isDisabled: false,\n  isGrid: false,\n})\n\nconst slots = defineSlots<{\n  default?(): VNode[];\n}>()\n\n// Provide context using toRef() for reactivity (canonical pattern from ButtonGroup)\nuseAvatarGroupProvide({\n  size: toRef(props, 'size'),\n  isBordered: toRef(props, 'isBordered'),\n  isDisabled: toRef(props, 'isDisabled'),\n  isGrid: toRef(props, 'isGrid'),\n  isInGroup: ref(true),\n})\n\nconst containerClass = computed(() =>\n  composeClassName('flex items-center flex-row', props.class)\n)\n\nconst visibleAvatars = computed(() => {\n  if (!props.avatars) return []\n  return props.max !== undefined ? props.avatars.slice(0, props.max) : props.avatars\n})\nconst avatarOverflowCount = computed(() => {\n  if (!props.avatars || props.max === undefined) return 0\n  const total = props.total ?? props.avatars.length\n  return total - props.max\n})\nconst avatarOverflowLabel = computed(() => {\n  if (avatarOverflowCount.value <= 0) return ''\n  return props.renderCount ? props.renderCount(avatarOverflowCount.value) : `+${avatarOverflowCount.value}`\n})\n\n// Flatten slot vnodes (handles Fragments from v-for etc.)\nfunction flattenVNodes(vnodes: VNode[]): VNode[] {\n  const result: VNode[] = []\n  for (const vnode of vnodes) {\n    if (vnode.type === Fragment && Array.isArray(vnode.children)) {\n      result.push(...flattenVNodes(vnode.children as VNode[]))\n    } else {\n      result.push(vnode)\n    }\n  }\n  return result\n}\n\n// Determine which vnodes to render when max is set\nfunction getSlicedNodes(): VNode[] {\n  const defaultSlot = slots.default?.()\n  if (!defaultSlot) return []\n\n  const allNodes = flattenVNodes(defaultSlot)\n\n  if (props.max === undefined) {\n    return allNodes\n  }\n\n  const visibleNodes = allNodes.slice(0, props.max)\n  const totalCount = props.total ?? allNodes.length\n  const overflowCount = totalCount - props.max\n\n  if (overflowCount <= 0) {\n    return visibleNodes\n  }\n\n  const counterLabel = props.renderCount\n    ? props.renderCount(overflowCount)\n    : `+${overflowCount}`\n\n  // Render counter avatar with a fallback slot so the full label string is shown\n  const counterNode = h(Avatar, {}, {\n    fallback: () => h('span', { class: 'avatar__name text-xs font-medium leading-none' }, counterLabel),\n  })\n\n  return [...visibleNodes, counterNode]\n}\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :class=\"containerClass\"\n  >\n    <template v-if=\"props.avatars\">\n      <Avatar\n        v-for=\"(avatar, idx) in visibleAvatars\"\n        :key=\"idx\"\n        v-bind=\"avatar\"\n      />\n      <Avatar v-if=\"avatarOverflowCount > 0\">\n        <template #fallback>\n          <span class=\"avatar__name text-xs font-medium leading-none\">{{ avatarOverflowLabel }}</span>\n        </template>\n      </Avatar>\n    </template>\n    <template v-else-if=\"props.max !== undefined\">\n      <!-- Use render function output for sliced vnodes -->\n      <template\n        v-for=\"(node, _i) in getSlicedNodes()\"\n        :key=\"_i\"\n      >\n        <component :is=\"node\" />\n      </template>\n    </template>\n    <template v-else>\n      <slot />\n    </template>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkBA,MAAM,QAAQ;EAmBd,MAAM,QAAQ,UAAA;AAKd,wBAAsB;GACpB,MAAM,MAAM,OAAO,OAAO;GAC1B,YAAY,MAAM,OAAO,aAAa;GACtC,YAAY,MAAM,OAAO,aAAa;GACtC,QAAQ,MAAM,OAAO,SAAS;GAC9B,WAAW,IAAI,KAAK;GACrB,CAAA;EAED,MAAM,iBAAiB,eACrB,iBAAiB,8BAA8B,MAAM,MAAK,CAC5D;EAEA,MAAM,iBAAiB,eAAe;AACpC,OAAI,CAAC,MAAM,QAAS,QAAO,EAAC;AAC5B,UAAO,MAAM,QAAQ,KAAA,IAAY,MAAM,QAAQ,MAAM,GAAG,MAAM,IAAI,GAAG,MAAM;IAC5E;EACD,MAAM,sBAAsB,eAAe;AACzC,OAAI,CAAC,MAAM,WAAW,MAAM,QAAQ,KAAA,EAAW,QAAO;AAEtD,WADc,MAAM,SAAS,MAAM,QAAQ,UAC5B,MAAM;IACtB;EACD,MAAM,sBAAsB,eAAe;AACzC,OAAI,oBAAoB,SAAS,EAAG,QAAO;AAC3C,UAAO,MAAM,cAAc,MAAM,YAAY,oBAAoB,MAAM,GAAG,IAAI,oBAAoB;IACnG;EAGD,SAAS,cAAc,QAA0B;GAC/C,MAAM,SAAkB,EAAC;AACzB,QAAK,MAAM,SAAS,OAClB,KAAI,MAAM,SAAS,YAAY,MAAM,QAAQ,MAAM,SAAS,CAC1D,QAAO,KAAK,GAAG,cAAc,MAAM,SAAoB,CAAA;OAEvD,QAAO,KAAK,MAAK;AAGrB,UAAO;;EAIT,SAAS,iBAA0B;GACjC,MAAM,cAAc,MAAM,WAAU;AACpC,OAAI,CAAC,YAAa,QAAO,EAAC;GAE1B,MAAM,WAAW,cAAc,YAAW;AAE1C,OAAI,MAAM,QAAQ,KAAA,EAChB,QAAO;GAGT,MAAM,eAAe,SAAS,MAAM,GAAG,MAAM,IAAG;GAEhD,MAAM,iBADa,MAAM,SAAS,SAAS,UACR,MAAM;AAEzC,OAAI,iBAAiB,EACnB,QAAO;GAGT,MAAM,eAAe,MAAM,cACvB,MAAM,YAAY,cAAa,GAC/B,IAAI;GAGR,MAAM,cAAc,EAAE,gBAAQ,EAAE,EAAE,EAChC,gBAAgB,EAAE,QAAQ,EAAE,OAAO,iDAAiD,EAAE,aAAa,EACpG,CAAA;AAED,UAAO,CAAC,GAAG,cAAc,YAAW;;;uBAKpC,mBA4BM,OAAA;IA3BJ,MAAK;IACJ,OAAK,eAAE,eAAA,MAAc;OAEN,MAAM,WAAA,WAAA,EAAtB,mBAWW,UAAA,EAAA,KAAA,GAAA,EAAA,EAAA,UAAA,KAAA,EAVT,mBAIE,UAAA,MAAA,WAHwB,eAAA,QAAhB,QAAQ,QAAG;wBADrB,YAIE,gBAJF,WAIE,EAFC,KAAK,KAAG,EAAA,EAAA,SAAA,MAAA,EACD,OAAM,EAAA,MAAA,GAAA;cAEF,oBAAA,QAAmB,KAAA,WAAA,EAAjC,YAIS,gBAAA,EAAA,KAAA,GAAA,EAAA;IAHI,UAAQ,cAC2E,CAA5F,mBAA4F,QAA5F,YAA4F,gBAA7B,oBAAA,MAAmB,EAAA,EAAA,CAAA,CAAA;;+CAInE,MAAM,QAAQ,KAAA,KAAA,UAAA,KAAA,EAEjC,mBAKW,UAAA,EAAA,KAAA,GAAA,EAAA,WAJY,gBAAc,GAA3B,MAAM,OAAE;wBAGhB,YAAwB,wBAAR,KAAI,EAAA,EAAA,KAFd,IAAE,CAAA;eAMV,WAAQ,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,EAAA,EAAA"}
+{"version":3,"file":"AvatarGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/avatar/AvatarGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, ref, h, Fragment, type VNode } from 'vue'\nimport { type AvatarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useAvatarGroupProvide } from './avatar-group.context'\nimport Avatar from './Avatar.vue'\n\ntype AvatarShorthandItem = {\n  src?: string\n  alt?: string\n  name?: string\n  color?: AvatarVariants['color']\n  variant?: AvatarVariants['variant']\n  isBordered?: boolean\n  isDisabled?: boolean\n  showFallback?: boolean\n}\n\nconst props = withDefaults(defineProps<{\n  size?: AvatarVariants['size']\n  isBordered?: boolean\n  isDisabled?: boolean\n  isGrid?: boolean\n  max?: number\n  total?: number\n  renderCount?: (count: number) => string\n  class?: string\n  /** Shorthand API: render avatars from an array instead of the compound slot API */\n  avatars?: AvatarShorthandItem[]\n}>(), {\n  size: 'md',\n\n  isBordered: false,\n  isDisabled: false,\n  isGrid: false,\n})\n\nconst slots = defineSlots<{\n  default?(): VNode[];\n}>()\n\n// Provide context using toRef() for reactivity (canonical pattern from ButtonGroup)\nuseAvatarGroupProvide({\n  size: toRef(props, 'size'),\n  isBordered: toRef(props, 'isBordered'),\n  isDisabled: toRef(props, 'isDisabled'),\n  isGrid: toRef(props, 'isGrid'),\n  isInGroup: ref(true),\n})\n\nconst containerClass = computed(() =>\n  composeClassName('flex items-center flex-row', props.class)\n)\n\nconst visibleAvatars = computed(() => {\n  if (!props.avatars) return []\n  return props.max !== undefined ? props.avatars.slice(0, props.max) : props.avatars\n})\nconst avatarOverflowCount = computed(() => {\n  if (!props.avatars || props.max === undefined) return 0\n  const total = props.total ?? props.avatars.length\n  return total - props.max\n})\nconst avatarOverflowLabel = computed(() => {\n  if (avatarOverflowCount.value <= 0) return ''\n  return props.renderCount ? props.renderCount(avatarOverflowCount.value) : `+${avatarOverflowCount.value}`\n})\n\n// Flatten slot vnodes (handles Fragments from v-for etc.)\nfunction flattenVNodes(vnodes: VNode[]): VNode[] {\n  const result: VNode[] = []\n  for (const vnode of vnodes) {\n    if (vnode.type === Fragment && Array.isArray(vnode.children)) {\n      result.push(...flattenVNodes(vnode.children as VNode[]))\n    } else {\n      result.push(vnode)\n    }\n  }\n  return result\n}\n\n// Determine which vnodes to render when max is set\nfunction getSlicedNodes(): VNode[] {\n  const defaultSlot = slots.default?.()\n  if (!defaultSlot) return []\n\n  const allNodes = flattenVNodes(defaultSlot)\n\n  if (props.max === undefined) {\n    return allNodes\n  }\n\n  const visibleNodes = allNodes.slice(0, props.max)\n  const totalCount = props.total ?? allNodes.length\n  const overflowCount = totalCount - props.max\n\n  if (overflowCount <= 0) {\n    return visibleNodes\n  }\n\n  const counterLabel = props.renderCount\n    ? props.renderCount(overflowCount)\n    : `+${overflowCount}`\n\n  // Render counter avatar with a fallback slot so the full label string is shown\n  const counterNode = h(Avatar, {}, {\n    fallback: () => h('span', { class: 'avatar__name text-xs font-medium leading-none' }, counterLabel),\n  })\n\n  return [...visibleNodes, counterNode]\n}\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    :class=\"containerClass\"\n  >\n    <template v-if=\"props.avatars\">\n      <Avatar\n        v-for=\"(avatar, idx) in visibleAvatars\"\n        :key=\"idx\"\n        v-bind=\"avatar\"\n      />\n      <Avatar v-if=\"avatarOverflowCount > 0\">\n        <template #fallback>\n          <span class=\"avatar__name text-xs font-medium leading-none\">{{ avatarOverflowLabel }}</span>\n        </template>\n      </Avatar>\n    </template>\n    <template v-else-if=\"props.max !== undefined\">\n      <!-- Use render function output for sliced vnodes -->\n      <template\n        v-for=\"(node, _i) in getSlicedNodes()\"\n        :key=\"_i\"\n      >\n        <component :is=\"node\" />\n      </template>\n    </template>\n    <template v-else>\n      <slot />\n    </template>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkBA,MAAM,QAAQ;EAmBd,MAAM,QAAQ,UAAA;AAKd,wBAAsB;GACpB,MAAM,MAAM,OAAO,OAAO;GAC1B,YAAY,MAAM,OAAO,aAAa;GACtC,YAAY,MAAM,OAAO,aAAa;GACtC,QAAQ,MAAM,OAAO,SAAS;GAC9B,WAAW,IAAI,KAAK;GACrB,CAAA;EAED,MAAM,iBAAiB,eACrB,iBAAiB,8BAA8B,MAAM,MAAK,CAC5D;EAEA,MAAM,iBAAiB,eAAe;AACpC,OAAI,CAAC,MAAM,QAAS,QAAO,EAAC;AAC5B,UAAO,MAAM,QAAQ,KAAA,IAAY,MAAM,QAAQ,MAAM,GAAG,MAAM,IAAI,GAAG,MAAM;IAC5E;EACD,MAAM,sBAAsB,eAAe;AACzC,OAAI,CAAC,MAAM,WAAW,MAAM,QAAQ,KAAA,EAAW,QAAO;AAEtD,WADc,MAAM,SAAS,MAAM,QAAQ,UAC5B,MAAM;IACtB;EACD,MAAM,sBAAsB,eAAe;AACzC,OAAI,oBAAoB,SAAS,EAAG,QAAO;AAC3C,UAAO,MAAM,cAAc,MAAM,YAAY,oBAAoB,MAAM,GAAG,IAAI,oBAAoB;IACnG;EAGD,SAAS,cAAc,QAA0B;GAC/C,MAAM,SAAkB,EAAC;AACzB,QAAK,MAAM,SAAS,OAClB,KAAI,MAAM,SAAS,YAAY,MAAM,QAAQ,MAAM,SAAS,CAC1D,QAAO,KAAK,GAAG,cAAc,MAAM,SAAoB,CAAA;OAEvD,QAAO,KAAK,MAAK;AAGrB,UAAO;;EAIT,SAAS,iBAA0B;GACjC,MAAM,cAAc,MAAM,WAAU;AACpC,OAAI,CAAC,YAAa,QAAO,EAAC;GAE1B,MAAM,WAAW,cAAc,YAAW;AAE1C,OAAI,MAAM,QAAQ,KAAA,EAChB,QAAO;GAGT,MAAM,eAAe,SAAS,MAAM,GAAG,MAAM,IAAG;GAEhD,MAAM,iBADa,MAAM,SAAS,SAAS,UACR,MAAM;AAEzC,OAAI,iBAAiB,EACnB,QAAO;GAGT,MAAM,eAAe,MAAM,cACvB,MAAM,YAAY,cAAa,GAC/B,IAAI;GAGR,MAAM,cAAc,EAAE,gBAAQ,EAAE,EAAE,EAChC,gBAAgB,EAAE,QAAQ,EAAE,OAAO,iDAAiD,EAAE,aAAa,EACpG,CAAA;AAED,UAAO,CAAC,GAAG,cAAc,YAAW;;;uBAKpC,mBA4BM,OAAA;IA3BJ,MAAK;IACJ,OAAK,eAAE,eAAA,MAAc;OAEN,MAAM,WAAA,WAAA,EAAtB,mBAWW,UAAA,EAAA,KAAA,GAAA,EAAA,EAAA,UAAA,KAAA,EAVT,mBAIE,UAAA,MAAA,WAHwB,eAAA,QAAhB,QAAQ,QAAG;wBADrB,YAIE,gBAJF,WAIE,EAFC,KAAK,KAAG,EAAA,EAAA,SAAA,MAAA,EACD,OAAM,EAAA,MAAA,GAAA;cAEF,oBAAA,QAAmB,KAAA,WAAA,EAAjC,YAIS,gBAAA,EAAA,KAAA,GAAA,EAAA;IAHI,UAAQ,cAC2E,CAA5F,mBAA4F,QAA5F,YAA4F,gBAA7B,oBAAA,MAAmB,EAAA,EAAA,CAAA,CAAA;;+CAInE,MAAM,QAAQ,KAAA,KAAA,UAAA,KAAA,EAEjC,mBAKW,UAAA,EAAA,KAAA,GAAA,EAAA,WAJY,gBAAc,GAA3B,MAAM,OAAE;wBAGhB,YAAwB,wBAAR,KAAI,EAAA,EAAA,KAFd,IAAE,CAAA;eAMV,WAAQ,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,EAAA,EAAA"}

package/dist/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/button/Button.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Primitive } from 'reka-ui'\nimport { buttonVariants, type ButtonVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupInject } from './button-group.context'\nimport Spinner from '../spinner/Spinner.vue'\nimport { warnDeprecatedVariant } from '../../utils/warnDeprecated'\n\nconst props = withDefaults(defineProps<{\n  /**\n   * Visual style of the button.\n   * @deprecated 'outline' — use 'bordered' instead.\n   */\n  variant?: ButtonVariants['variant'] | 'outline'\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  radius?: ButtonVariants['radius']\n  isIconOnly?: boolean\n  fullWidth?: boolean\n  disabled?: boolean\n  isLoading?: boolean\n  as?: string | object\n  class?: ClassValue\n  /** Override classes for individual slots (base, startContent, label, endContent, spinner) */\n  classNames?: Partial<{\n    base: ClassValue\n    startContent: ClassValue\n    label: ClassValue\n    endContent: ClassValue\n    spinner: ClassValue\n  }>\n  value?: string | number\n}>(), {\n  variant: undefined,\n  color: undefined,\n  size: undefined,\n  radius: undefined,\n  isIconOnly: false,\n  fullWidth: false,\n  disabled: false,\n  isLoading: false,\n  as: 'button',\n  value: undefined,\n})\n\n// Inject ButtonGroup context unconditionally with fallback defaults (D-12)\n// When no ButtonGroup is present, inject returns these fallback values (no-op)\nconst groupCtx = useButtonGroupInject({\n  variant: ref('solid'),\n  color: ref('primary'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('single'),\n  selectedValue: ref(null),\n  isValueSelected: () => false,\n  selectValue: () => {},\n})\n\nconst isSelected = computed(() => groupCtx.isValueSelected(props.value))\n\nfunction handleClick() {\n  if (props.value !== undefined) groupCtx.selectValue(props.value)\n}\n\n// Prop precedence rules (D-13):\n// - group disabled ALWAYS wins over child prop\n// - all other props: child prop wins over group value (child ?? group)\nconst isDisabled = computed(() => groupCtx.disabled.value || props.disabled)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalColor = computed(() => props.color ?? groupCtx.color.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\nconst finalFullWidth = computed(() => props.fullWidth || groupCtx.fullWidth.value)\n\n// Map legacy variant names to new variant+color so old usage keeps working\nconst LEGACY_VARIANTS: Record<string, { variant: string; color: string }> = {\n  primary:       { variant: 'solid',   color: 'primary' },\n  secondary:     { variant: 'default', color: 'default' },\n  tertiary:      { variant: 'default', color: 'default' },\n  danger:        { variant: 'solid',   color: 'danger' },\n  'danger-soft': { variant: 'soft',    color: 'danger' },\n  success:       { variant: 'solid',   color: 'success' },\n  'success-soft':{ variant: 'soft',    color: 'success' },\n  warning:       { variant: 'solid',   color: 'warning' },\n  'warning-soft':{ variant: 'soft',    color: 'warning' },\n}\n\nconst resolvedVariant = computed(() => {\n  const v = finalVariant.value\n  if (!v) return v\n  if (v === 'outline') {\n    warnDeprecatedVariant('Button', 'outline', 'bordered')\n    return 'bordered' as ButtonVariants['variant']\n  }\n  return (LEGACY_VARIANTS[v]?.variant ?? v) as ButtonVariants['variant']\n})\n\nconst resolvedColor = computed(() => {\n  const v = finalVariant.value\n  // If caller explicitly set color, respect it; otherwise infer from legacy variant\n  if (props.color === undefined && v && LEGACY_VARIANTS[v]) return LEGACY_VARIANTS[v].color as ButtonVariants['color']\n  return finalColor.value\n})\n\nconst slotFns = computed(() =>\n  buttonVariants({\n    variant: resolvedVariant.value,\n    color: resolvedColor.value,\n    size: finalSize.value,\n    radius: props.radius,\n    isIconOnly: props.isIconOnly,\n    fullWidth: finalFullWidth.value,\n    isLoading: props.isLoading,\n  })\n)\n\n// Spinner size scales with button size\nconst spinnerSize = computed(() => {\n  if (finalSize.value === 'xs' || finalSize.value === 'sm') return 'sm' as const\n  if (finalSize.value === 'lg' || finalSize.value === 'xl') return 'lg' as const\n  return 'md' as const\n})\n</script>\n\n<template>\n  <Primitive\n    :as=\"props.as\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :disabled=\"isDisabled || props.isLoading || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-loading=\"props.isLoading || undefined\"\n    :data-orientation=\"groupCtx.orientation.value\"\n    :data-selected=\"isSelected || undefined\"\n    v-bind=\"$attrs\"\n    @click=\"handleClick\"\n  >\n    <!-- startContent named slot -->\n    <span\n      v-if=\"$slots.startContent\"\n      :class=\"composeClassName(slotFns.startContent(), props.classNames?.startContent)\"\n    >\n      <slot name=\"startContent\" />\n    </span>\n\n    <!-- default (label) slot -->\n    <span :class=\"composeClassName(slotFns.label(), props.classNames?.label)\">\n      <slot />\n    </span>\n\n    <!-- endContent named slot -->\n    <span\n      v-if=\"$slots.endContent\"\n      :class=\"composeClassName(slotFns.endContent(), props.classNames?.endContent)\"\n    >\n      <slot name=\"endContent\" />\n    </span>\n\n    <!-- Loading spinner: absolute-centered, only rendered when isLoading=true (D-08, D-09) -->\n    <!-- color=\"current\" inherits --button-fg so spinner contrasts with the button background -->\n    <span\n      v-if=\"props.isLoading\"\n      :class=\"composeClassName(slotFns.spinner(), props.classNames?.spinner)\"\n      aria-hidden=\"true\"\n      data-slot=\"spinner\"\n    >\n      <Spinner\n        :size=\"spinnerSize\"\n        color=\"current\"\n      />\n    </span>\n  </Primitive>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Button.js","names":[],"sources":["../../../src/components/button/Button.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Primitive } from 'reka-ui'\nimport { buttonVariants, type ButtonVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupInject } from './button-group.context'\nimport Spinner from '../spinner/Spinner.vue'\nimport { warnDeprecatedVariant } from '../../utils/warnDeprecated'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  /**\n   * Visual style of the button.\n   * @deprecated 'outline' — use 'bordered' instead.\n   */\n  variant?: ButtonVariants['variant'] | 'outline'\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  radius?: ButtonVariants['radius']\n  isIconOnly?: boolean\n  fullWidth?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  isLoading?: boolean\n  as?: string | object\n  class?: ClassValue\n  /** Override classes for individual slots (base, startContent, label, endContent, spinner) */\n  classNames?: Partial<{\n    base: ClassValue\n    startContent: ClassValue\n    label: ClassValue\n    endContent: ClassValue\n    spinner: ClassValue\n  }>\n  value?: string | number\n}>(), {\n  variant: undefined,\n  color: undefined,\n  size: undefined,\n  radius: undefined,\n  isIconOnly: false,\n  fullWidth: false,\n  isDisabled: undefined,\n  disabled: undefined,\n  isLoading: false,\n  as: 'button',\n  value: undefined,\n})\n\n// Inject ButtonGroup context unconditionally with fallback defaults (D-12)\n// When no ButtonGroup is present, inject returns these fallback values (no-op)\nconst groupCtx = useButtonGroupInject({\n  variant: ref('solid'),\n  color: ref('primary'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('single'),\n  selectedValue: ref(null),\n  isValueSelected: () => false,\n  selectValue: () => {},\n})\n\nconst isSelected = computed(() => groupCtx.isValueSelected(props.value))\n\nfunction handleClick() {\n  if (props.value !== undefined) groupCtx.selectValue(props.value)\n}\n\n// Resolve this button's own isDisabled/disabled prop pair before combining with group state.\nconst resolvedDisabled = useDeprecatedBooleanProp(\n  'Button', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\n// Prop precedence rules (D-13):\n// - group disabled ALWAYS wins over child prop\n// - all other props: child prop wins over group value (child ?? group)\nconst effectiveDisabled = computed(() => groupCtx.disabled.value || resolvedDisabled.value)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalColor = computed(() => props.color ?? groupCtx.color.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\nconst finalFullWidth = computed(() => props.fullWidth || groupCtx.fullWidth.value)\n\n// Map legacy variant names to new variant+color so old usage keeps working\nconst LEGACY_VARIANTS: Record<string, { variant: string; color: string }> = {\n  primary:       { variant: 'solid',   color: 'primary' },\n  secondary:     { variant: 'default', color: 'default' },\n  tertiary:      { variant: 'default', color: 'default' },\n  danger:        { variant: 'solid',   color: 'danger' },\n  'danger-soft': { variant: 'soft',    color: 'danger' },\n  success:       { variant: 'solid',   color: 'success' },\n  'success-soft':{ variant: 'soft',    color: 'success' },\n  warning:       { variant: 'solid',   color: 'warning' },\n  'warning-soft':{ variant: 'soft',    color: 'warning' },\n}\n\nconst resolvedVariant = computed(() => {\n  const v = finalVariant.value\n  if (!v) return v\n  if (v === 'outline') {\n    warnDeprecatedVariant('Button', 'outline', 'bordered')\n    return 'bordered' as ButtonVariants['variant']\n  }\n  return (LEGACY_VARIANTS[v]?.variant ?? v) as ButtonVariants['variant']\n})\n\nconst resolvedColor = computed(() => {\n  const v = finalVariant.value\n  // If caller explicitly set color, respect it; otherwise infer from legacy variant\n  if (props.color === undefined && v && LEGACY_VARIANTS[v]) return LEGACY_VARIANTS[v].color as ButtonVariants['color']\n  return finalColor.value\n})\n\nconst slotFns = computed(() =>\n  buttonVariants({\n    variant: resolvedVariant.value,\n    color: resolvedColor.value,\n    size: finalSize.value,\n    radius: props.radius,\n    isIconOnly: props.isIconOnly,\n    fullWidth: finalFullWidth.value,\n    isLoading: props.isLoading,\n  })\n)\n\n// Spinner size scales with button size\nconst spinnerSize = computed(() => {\n  if (finalSize.value === 'xs' || finalSize.value === 'sm') return 'sm' as const\n  if (finalSize.value === 'lg' || finalSize.value === 'xl') return 'lg' as const\n  return 'md' as const\n})\n</script>\n\n<template>\n  <Primitive\n    :as=\"props.as\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :disabled=\"effectiveDisabled || props.isLoading || undefined\"\n    :data-disabled=\"effectiveDisabled || undefined\"\n    :data-loading=\"props.isLoading || undefined\"\n    :data-orientation=\"groupCtx.orientation.value\"\n    :data-selected=\"isSelected || undefined\"\n    v-bind=\"$attrs\"\n    @click=\"handleClick\"\n  >\n    <!-- startContent named slot -->\n    <span\n      v-if=\"$slots.startContent\"\n      :class=\"composeClassName(slotFns.startContent(), props.classNames?.startContent)\"\n    >\n      <slot name=\"startContent\" />\n    </span>\n\n    <!-- default (label) slot -->\n    <span :class=\"composeClassName(slotFns.label(), props.classNames?.label)\">\n      <slot />\n    </span>\n\n    <!-- endContent named slot -->\n    <span\n      v-if=\"$slots.endContent\"\n      :class=\"composeClassName(slotFns.endContent(), props.classNames?.endContent)\"\n    >\n      <slot name=\"endContent\" />\n    </span>\n\n    <!-- Loading spinner: absolute-centered, only rendered when isLoading=true (D-08, D-09) -->\n    <!-- color=\"current\" inherits --button-fg so spinner contrasts with the button background -->\n    <span\n      v-if=\"props.isLoading\"\n      :class=\"composeClassName(slotFns.spinner(), props.classNames?.spinner)\"\n      aria-hidden=\"true\"\n      data-slot=\"spinner\"\n    >\n      <Spinner\n        :size=\"spinnerSize\"\n        color=\"current\"\n      />\n    </span>\n  </Primitive>\n</template>\n"],"mappings":""}

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

@@ -2,6 +2,7 @@ import { composeClassName } from "../../utils/composeClassName.js";
 import Spinner_default from "../spinner/Spinner.js";
 import "../../utils/warnDeprecated.js";
 import { useButtonGroupInject } from "./button-group.context.js";
+import { useDeprecatedBooleanProp } from "../../composables/useDeprecatedBooleanProp.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, ref, renderSlot, unref, withCtx } from "vue";
 import { buttonVariants } from "@auronui/styles";
 import { Primitive } from "reka-ui";
@@ -21,9 +22,13 @@ var Button_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 			type: Boolean,
 			default: false
 		},
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
-			default: false
+			default: void 0
 		},
 		isLoading: {
 			type: Boolean,
@@ -58,7 +63,8 @@ var Button_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 		function handleClick() {
 			if (props.value !== void 0) groupCtx.selectValue(props.value);
 		}
-		const isDisabled = computed(() => groupCtx.disabled.value || props.disabled);
+		const resolvedDisabled = useDeprecatedBooleanProp("Button", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
+		const effectiveDisabled = computed(() => groupCtx.disabled.value || resolvedDisabled.value);
 		const finalVariant = computed(() => props.variant ?? groupCtx.variant.value);
 		const finalColor = computed(() => props.color ?? groupCtx.color.value);
 		const finalSize = computed(() => props.size ?? groupCtx.size.value);
@@ -130,8 +136,8 @@ var Button_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineC
 			return openBlock(), createBlock(unref(Primitive), mergeProps({
 				as: props.as,
 				class: unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base),
-				disabled: isDisabled.value || props.isLoading || void 0,
-				"data-disabled": isDisabled.value || void 0,
+				disabled: effectiveDisabled.value || props.isLoading || void 0,
+				"data-disabled": effectiveDisabled.value || void 0,
 				"data-loading": props.isLoading || void 0,
 				"data-orientation": unref(groupCtx).orientation.value,
 				"data-selected": isSelected.value || void 0

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

@@ -1 +1 @@
-{"version":3,"file":"Button.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../src/components/button/Button.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Primitive } from 'reka-ui'\nimport { buttonVariants, type ButtonVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupInject } from './button-group.context'\nimport Spinner from '../spinner/Spinner.vue'\nimport { warnDeprecatedVariant } from '../../utils/warnDeprecated'\n\nconst props = withDefaults(defineProps<{\n  /**\n   * Visual style of the button.\n   * @deprecated 'outline' — use 'bordered' instead.\n   */\n  variant?: ButtonVariants['variant'] | 'outline'\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  radius?: ButtonVariants['radius']\n  isIconOnly?: boolean\n  fullWidth?: boolean\n  disabled?: boolean\n  isLoading?: boolean\n  as?: string | object\n  class?: ClassValue\n  /** Override classes for individual slots (base, startContent, label, endContent, spinner) */\n  classNames?: Partial<{\n    base: ClassValue\n    startContent: ClassValue\n    label: ClassValue\n    endContent: ClassValue\n    spinner: ClassValue\n  }>\n  value?: string | number\n}>(), {\n  variant: undefined,\n  color: undefined,\n  size: undefined,\n  radius: undefined,\n  isIconOnly: false,\n  fullWidth: false,\n  disabled: false,\n  isLoading: false,\n  as: 'button',\n  value: undefined,\n})\n\n// Inject ButtonGroup context unconditionally with fallback defaults (D-12)\n// When no ButtonGroup is present, inject returns these fallback values (no-op)\nconst groupCtx = useButtonGroupInject({\n  variant: ref('solid'),\n  color: ref('primary'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('single'),\n  selectedValue: ref(null),\n  isValueSelected: () => false,\n  selectValue: () => {},\n})\n\nconst isSelected = computed(() => groupCtx.isValueSelected(props.value))\n\nfunction handleClick() {\n  if (props.value !== undefined) groupCtx.selectValue(props.value)\n}\n\n// Prop precedence rules (D-13):\n// - group disabled ALWAYS wins over child prop\n// - all other props: child prop wins over group value (child ?? group)\nconst isDisabled = computed(() => groupCtx.disabled.value || props.disabled)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalColor = computed(() => props.color ?? groupCtx.color.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\nconst finalFullWidth = computed(() => props.fullWidth || groupCtx.fullWidth.value)\n\n// Map legacy variant names to new variant+color so old usage keeps working\nconst LEGACY_VARIANTS: Record<string, { variant: string; color: string }> = {\n  primary:       { variant: 'solid',   color: 'primary' },\n  secondary:     { variant: 'default', color: 'default' },\n  tertiary:      { variant: 'default', color: 'default' },\n  danger:        { variant: 'solid',   color: 'danger' },\n  'danger-soft': { variant: 'soft',    color: 'danger' },\n  success:       { variant: 'solid',   color: 'success' },\n  'success-soft':{ variant: 'soft',    color: 'success' },\n  warning:       { variant: 'solid',   color: 'warning' },\n  'warning-soft':{ variant: 'soft',    color: 'warning' },\n}\n\nconst resolvedVariant = computed(() => {\n  const v = finalVariant.value\n  if (!v) return v\n  if (v === 'outline') {\n    warnDeprecatedVariant('Button', 'outline', 'bordered')\n    return 'bordered' as ButtonVariants['variant']\n  }\n  return (LEGACY_VARIANTS[v]?.variant ?? v) as ButtonVariants['variant']\n})\n\nconst resolvedColor = computed(() => {\n  const v = finalVariant.value\n  // If caller explicitly set color, respect it; otherwise infer from legacy variant\n  if (props.color === undefined && v && LEGACY_VARIANTS[v]) return LEGACY_VARIANTS[v].color as ButtonVariants['color']\n  return finalColor.value\n})\n\nconst slotFns = computed(() =>\n  buttonVariants({\n    variant: resolvedVariant.value,\n    color: resolvedColor.value,\n    size: finalSize.value,\n    radius: props.radius,\n    isIconOnly: props.isIconOnly,\n    fullWidth: finalFullWidth.value,\n    isLoading: props.isLoading,\n  })\n)\n\n// Spinner size scales with button size\nconst spinnerSize = computed(() => {\n  if (finalSize.value === 'xs' || finalSize.value === 'sm') return 'sm' as const\n  if (finalSize.value === 'lg' || finalSize.value === 'xl') return 'lg' as const\n  return 'md' as const\n})\n</script>\n\n<template>\n  <Primitive\n    :as=\"props.as\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :disabled=\"isDisabled || props.isLoading || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-loading=\"props.isLoading || undefined\"\n    :data-orientation=\"groupCtx.orientation.value\"\n    :data-selected=\"isSelected || undefined\"\n    v-bind=\"$attrs\"\n    @click=\"handleClick\"\n  >\n    <!-- startContent named slot -->\n    <span\n      v-if=\"$slots.startContent\"\n      :class=\"composeClassName(slotFns.startContent(), props.classNames?.startContent)\"\n    >\n      <slot name=\"startContent\" />\n    </span>\n\n    <!-- default (label) slot -->\n    <span :class=\"composeClassName(slotFns.label(), props.classNames?.label)\">\n      <slot />\n    </span>\n\n    <!-- endContent named slot -->\n    <span\n      v-if=\"$slots.endContent\"\n      :class=\"composeClassName(slotFns.endContent(), props.classNames?.endContent)\"\n    >\n      <slot name=\"endContent\" />\n    </span>\n\n    <!-- Loading spinner: absolute-centered, only rendered when isLoading=true (D-08, D-09) -->\n    <!-- color=\"current\" inherits --button-fg so spinner contrasts with the button background -->\n    <span\n      v-if=\"props.isLoading\"\n      :class=\"composeClassName(slotFns.spinner(), props.classNames?.spinner)\"\n      aria-hidden=\"true\"\n      data-slot=\"spinner\"\n    >\n      <Spinner\n        :size=\"spinnerSize\"\n        color=\"current\"\n      />\n    </span>\n  </Primitive>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EAuCd,MAAM,WAAW,qBAAqB;GACpC,SAAS,IAAI,QAAQ;GACrB,OAAO,IAAI,UAAU;GACrB,MAAM,IAAI,KAAK;GACf,UAAU,IAAI,MAAM;GACpB,WAAW,IAAI,MAAM;GACrB,aAAa,IAAI,aAAa;GAC9B,eAAe,IAAI,SAAS;GAC5B,eAAe,IAAI,KAAK;GACxB,uBAAuB;GACvB,mBAAmB;GACpB,CAAA;EAED,MAAM,aAAa,eAAe,SAAS,gBAAgB,MAAM,MAAM,CAAA;EAEvE,SAAS,cAAc;AACrB,OAAI,MAAM,UAAU,KAAA,EAAW,UAAS,YAAY,MAAM,MAAK;;EAMjE,MAAM,aAAa,eAAe,SAAS,SAAS,SAAS,MAAM,SAAQ;EAC3E,MAAM,eAAe,eAAe,MAAM,WAAW,SAAS,QAAQ,MAAK;EAC3E,MAAM,aAAa,eAAe,MAAM,SAAS,SAAS,MAAM,MAAK;EACrE,MAAM,YAAY,eAAe,MAAM,QAAQ,SAAS,KAAK,MAAK;EAClE,MAAM,iBAAiB,eAAe,MAAM,aAAa,SAAS,UAAU,MAAK;EAGjF,MAAM,kBAAsE;GAC1E,SAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,WAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,UAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,QAAe;IAAE,SAAS;IAAW,OAAO;IAAU;GACtD,eAAe;IAAE,SAAS;IAAW,OAAO;IAAU;GACtD,SAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,gBAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,SAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,gBAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACzD;EAEA,MAAM,kBAAkB,eAAe;GACrC,MAAM,IAAI,aAAa;AACvB,OAAI,CAAC,EAAG,QAAO;AACf,OAAI,MAAM,UAER,QAAO;AAET,UAAQ,gBAAgB,IAAI,WAAW;IACxC;EAED,MAAM,gBAAgB,eAAe;GACnC,MAAM,IAAI,aAAa;AAEvB,OAAI,MAAM,UAAU,KAAA,KAAa,KAAK,gBAAgB,GAAI,QAAO,gBAAgB,GAAG;AACpF,UAAO,WAAW;IACnB;EAED,MAAM,UAAU,eACd,eAAe;GACb,SAAS,gBAAgB;GACzB,OAAO,cAAc;GACrB,MAAM,UAAU;GAChB,QAAQ,MAAM;GACd,YAAY,MAAM;GAClB,WAAW,eAAe;GAC1B,WAAW,MAAM;GAClB,CAAA,CACH;EAGA,MAAM,cAAc,eAAe;AACjC,OAAI,UAAU,UAAU,QAAQ,UAAU,UAAU,KAAM,QAAO;AACjE,OAAI,UAAU,UAAU,QAAQ,UAAU,UAAU,KAAM,QAAO;AACjE,UAAO;IACR;;uBAIC,YA6CY,MAAA,UAAA,EA7CZ,WA6CY;IA5CT,IAAI,MAAM;IACV,OAAO,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI;IAC3E,UAAU,WAAA,SAAc,MAAM,aAAa,KAAA;IAC3C,iBAAe,WAAA,SAAc,KAAA;IAC7B,gBAAc,MAAM,aAAa,KAAA;IACjC,oBAAkB,MAAA,SAAQ,CAAC,YAAY;IACvC,iBAAe,WAAA,SAAc,KAAA;MACtBA,KAAAA,QAAM,EACb,SAAO,aAAW,CAAA,EAAA;2BAQZ;KAJCC,KAAAA,OAAO,gBAAA,WAAA,EADf,mBAKO,QAAA;;MAHJ,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,cAAY,EAAI,MAAM,YAAY,aAAY,CAAA;SAE/E,WAA4B,KAAA,QAAA,eAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KAI9B,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,OAAK,EAAI,MAAM,YAAY,MAAK,CAAA,EAAA,EAAA,CACrE,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA;KAKFA,KAAAA,OAAO,cAAA,WAAA,EADf,mBAKO,QAAA;;MAHJ,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,YAAU,EAAI,MAAM,YAAY,WAAU,CAAA;SAE3E,WAA0B,KAAA,QAAA,aAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KAMpB,MAAM,aAAA,WAAA,EADd,mBAUO,QAAA;;MARJ,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,SAAO,EAAI,MAAM,YAAY,QAAO,CAAA;MACrE,eAAY;MACZ,aAAU;SAEV,YAGE,iBAAA;MAFC,MAAM,YAAA;MACP,OAAM"}
+{"version":3,"file":"Button.vue_vue_type_script_setup_true_lang.js","names":["$attrs","$slots"],"sources":["../../../src/components/button/Button.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Primitive } from 'reka-ui'\nimport { buttonVariants, type ButtonVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupInject } from './button-group.context'\nimport Spinner from '../spinner/Spinner.vue'\nimport { warnDeprecatedVariant } from '../../utils/warnDeprecated'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  /**\n   * Visual style of the button.\n   * @deprecated 'outline' — use 'bordered' instead.\n   */\n  variant?: ButtonVariants['variant'] | 'outline'\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  radius?: ButtonVariants['radius']\n  isIconOnly?: boolean\n  fullWidth?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  isLoading?: boolean\n  as?: string | object\n  class?: ClassValue\n  /** Override classes for individual slots (base, startContent, label, endContent, spinner) */\n  classNames?: Partial<{\n    base: ClassValue\n    startContent: ClassValue\n    label: ClassValue\n    endContent: ClassValue\n    spinner: ClassValue\n  }>\n  value?: string | number\n}>(), {\n  variant: undefined,\n  color: undefined,\n  size: undefined,\n  radius: undefined,\n  isIconOnly: false,\n  fullWidth: false,\n  isDisabled: undefined,\n  disabled: undefined,\n  isLoading: false,\n  as: 'button',\n  value: undefined,\n})\n\n// Inject ButtonGroup context unconditionally with fallback defaults (D-12)\n// When no ButtonGroup is present, inject returns these fallback values (no-op)\nconst groupCtx = useButtonGroupInject({\n  variant: ref('solid'),\n  color: ref('primary'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('single'),\n  selectedValue: ref(null),\n  isValueSelected: () => false,\n  selectValue: () => {},\n})\n\nconst isSelected = computed(() => groupCtx.isValueSelected(props.value))\n\nfunction handleClick() {\n  if (props.value !== undefined) groupCtx.selectValue(props.value)\n}\n\n// Resolve this button's own isDisabled/disabled prop pair before combining with group state.\nconst resolvedDisabled = useDeprecatedBooleanProp(\n  'Button', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\n// Prop precedence rules (D-13):\n// - group disabled ALWAYS wins over child prop\n// - all other props: child prop wins over group value (child ?? group)\nconst effectiveDisabled = computed(() => groupCtx.disabled.value || resolvedDisabled.value)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalColor = computed(() => props.color ?? groupCtx.color.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\nconst finalFullWidth = computed(() => props.fullWidth || groupCtx.fullWidth.value)\n\n// Map legacy variant names to new variant+color so old usage keeps working\nconst LEGACY_VARIANTS: Record<string, { variant: string; color: string }> = {\n  primary:       { variant: 'solid',   color: 'primary' },\n  secondary:     { variant: 'default', color: 'default' },\n  tertiary:      { variant: 'default', color: 'default' },\n  danger:        { variant: 'solid',   color: 'danger' },\n  'danger-soft': { variant: 'soft',    color: 'danger' },\n  success:       { variant: 'solid',   color: 'success' },\n  'success-soft':{ variant: 'soft',    color: 'success' },\n  warning:       { variant: 'solid',   color: 'warning' },\n  'warning-soft':{ variant: 'soft',    color: 'warning' },\n}\n\nconst resolvedVariant = computed(() => {\n  const v = finalVariant.value\n  if (!v) return v\n  if (v === 'outline') {\n    warnDeprecatedVariant('Button', 'outline', 'bordered')\n    return 'bordered' as ButtonVariants['variant']\n  }\n  return (LEGACY_VARIANTS[v]?.variant ?? v) as ButtonVariants['variant']\n})\n\nconst resolvedColor = computed(() => {\n  const v = finalVariant.value\n  // If caller explicitly set color, respect it; otherwise infer from legacy variant\n  if (props.color === undefined && v && LEGACY_VARIANTS[v]) return LEGACY_VARIANTS[v].color as ButtonVariants['color']\n  return finalColor.value\n})\n\nconst slotFns = computed(() =>\n  buttonVariants({\n    variant: resolvedVariant.value,\n    color: resolvedColor.value,\n    size: finalSize.value,\n    radius: props.radius,\n    isIconOnly: props.isIconOnly,\n    fullWidth: finalFullWidth.value,\n    isLoading: props.isLoading,\n  })\n)\n\n// Spinner size scales with button size\nconst spinnerSize = computed(() => {\n  if (finalSize.value === 'xs' || finalSize.value === 'sm') return 'sm' as const\n  if (finalSize.value === 'lg' || finalSize.value === 'xl') return 'lg' as const\n  return 'md' as const\n})\n</script>\n\n<template>\n  <Primitive\n    :as=\"props.as\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :disabled=\"effectiveDisabled || props.isLoading || undefined\"\n    :data-disabled=\"effectiveDisabled || undefined\"\n    :data-loading=\"props.isLoading || undefined\"\n    :data-orientation=\"groupCtx.orientation.value\"\n    :data-selected=\"isSelected || undefined\"\n    v-bind=\"$attrs\"\n    @click=\"handleClick\"\n  >\n    <!-- startContent named slot -->\n    <span\n      v-if=\"$slots.startContent\"\n      :class=\"composeClassName(slotFns.startContent(), props.classNames?.startContent)\"\n    >\n      <slot name=\"startContent\" />\n    </span>\n\n    <!-- default (label) slot -->\n    <span :class=\"composeClassName(slotFns.label(), props.classNames?.label)\">\n      <slot />\n    </span>\n\n    <!-- endContent named slot -->\n    <span\n      v-if=\"$slots.endContent\"\n      :class=\"composeClassName(slotFns.endContent(), props.classNames?.endContent)\"\n    >\n      <slot name=\"endContent\" />\n    </span>\n\n    <!-- Loading spinner: absolute-centered, only rendered when isLoading=true (D-08, D-09) -->\n    <!-- color=\"current\" inherits --button-fg so spinner contrasts with the button background -->\n    <span\n      v-if=\"props.isLoading\"\n      :class=\"composeClassName(slotFns.spinner(), props.classNames?.spinner)\"\n      aria-hidden=\"true\"\n      data-slot=\"spinner\"\n    >\n      <Spinner\n        :size=\"spinnerSize\"\n        color=\"current\"\n      />\n    </span>\n  </Primitive>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAUA,MAAM,QAAQ;EA0Cd,MAAM,WAAW,qBAAqB;GACpC,SAAS,IAAI,QAAQ;GACrB,OAAO,IAAI,UAAU;GACrB,MAAM,IAAI,KAAK;GACf,UAAU,IAAI,MAAM;GACpB,WAAW,IAAI,MAAM;GACrB,aAAa,IAAI,aAAa;GAC9B,eAAe,IAAI,SAAS;GAC5B,eAAe,IAAI,KAAK;GACxB,uBAAuB;GACvB,mBAAmB;GACpB,CAAA;EAED,MAAM,aAAa,eAAe,SAAS,gBAAgB,MAAM,MAAM,CAAA;EAEvE,SAAS,cAAc;AACrB,OAAI,MAAM,UAAU,KAAA,EAAW,UAAS,YAAY,MAAM,MAAK;;EAIjE,MAAM,mBAAmB,yBACvB,UAAU,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SAC1E;EAKA,MAAM,oBAAoB,eAAe,SAAS,SAAS,SAAS,iBAAiB,MAAK;EAC1F,MAAM,eAAe,eAAe,MAAM,WAAW,SAAS,QAAQ,MAAK;EAC3E,MAAM,aAAa,eAAe,MAAM,SAAS,SAAS,MAAM,MAAK;EACrE,MAAM,YAAY,eAAe,MAAM,QAAQ,SAAS,KAAK,MAAK;EAClE,MAAM,iBAAiB,eAAe,MAAM,aAAa,SAAS,UAAU,MAAK;EAGjF,MAAM,kBAAsE;GAC1E,SAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,WAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,UAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,QAAe;IAAE,SAAS;IAAW,OAAO;IAAU;GACtD,eAAe;IAAE,SAAS;IAAW,OAAO;IAAU;GACtD,SAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,gBAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,SAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACvD,gBAAe;IAAE,SAAS;IAAW,OAAO;IAAW;GACzD;EAEA,MAAM,kBAAkB,eAAe;GACrC,MAAM,IAAI,aAAa;AACvB,OAAI,CAAC,EAAG,QAAO;AACf,OAAI,MAAM,UAER,QAAO;AAET,UAAQ,gBAAgB,IAAI,WAAW;IACxC;EAED,MAAM,gBAAgB,eAAe;GACnC,MAAM,IAAI,aAAa;AAEvB,OAAI,MAAM,UAAU,KAAA,KAAa,KAAK,gBAAgB,GAAI,QAAO,gBAAgB,GAAG;AACpF,UAAO,WAAW;IACnB;EAED,MAAM,UAAU,eACd,eAAe;GACb,SAAS,gBAAgB;GACzB,OAAO,cAAc;GACrB,MAAM,UAAU;GAChB,QAAQ,MAAM;GACd,YAAY,MAAM;GAClB,WAAW,eAAe;GAC1B,WAAW,MAAM;GAClB,CAAA,CACH;EAGA,MAAM,cAAc,eAAe;AACjC,OAAI,UAAU,UAAU,QAAQ,UAAU,UAAU,KAAM,QAAO;AACjE,OAAI,UAAU,UAAU,QAAQ,UAAU,UAAU,KAAM,QAAO;AACjE,UAAO;IACR;;uBAIC,YA6CY,MAAA,UAAA,EA7CZ,WA6CY;IA5CT,IAAI,MAAM;IACV,OAAO,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI;IAC3E,UAAU,kBAAA,SAAqB,MAAM,aAAa,KAAA;IAClD,iBAAe,kBAAA,SAAqB,KAAA;IACpC,gBAAc,MAAM,aAAa,KAAA;IACjC,oBAAkB,MAAA,SAAQ,CAAC,YAAY;IACvC,iBAAe,WAAA,SAAc,KAAA;MACtBA,KAAAA,QAAM,EACb,SAAO,aAAW,CAAA,EAAA;2BAQZ;KAJCC,KAAAA,OAAO,gBAAA,WAAA,EADf,mBAKO,QAAA;;MAHJ,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,cAAY,EAAI,MAAM,YAAY,aAAY,CAAA;SAE/E,WAA4B,KAAA,QAAA,eAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KAI9B,mBAEO,QAAA,EAFA,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,OAAK,EAAI,MAAM,YAAY,MAAK,CAAA,EAAA,EAAA,CACrE,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA;KAKFA,KAAAA,OAAO,cAAA,WAAA,EADf,mBAKO,QAAA;;MAHJ,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,YAAU,EAAI,MAAM,YAAY,WAAU,CAAA;SAE3E,WAA0B,KAAA,QAAA,aAAA,CAAA,EAAA,EAAA,IAAA,mBAAA,IAAA,KAAA;KAMpB,MAAM,aAAA,WAAA,EADd,mBAUO,QAAA;;MARJ,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,SAAO,EAAI,MAAM,YAAY,QAAO,CAAA;MACrE,eAAY;MACZ,aAAU;SAEV,YAGE,iBAAA;MAFC,MAAM,YAAA;MACP,OAAM"}

package/dist/components/button/ButtonGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ButtonGroup.js","names":[],"sources":["../../../src/components/button/ButtonGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { buttonGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupProvide } from './button-group.context'\nimport type { ButtonGroupSelectionMode, ButtonGroupValue } from './button-group.context'\nimport type { ButtonVariants } from '@auronui/styles'\nimport Button from './Button.vue'\n\ntype ButtonShorthandItem = {\n  label: string\n  value?: string | number\n  disabled?: boolean\n  isLoading?: boolean\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  class?: string\n}\n\nconst props = withDefaults(defineProps<{\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  disabled?: boolean\n  fullWidth?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  class?: ClassValue\n  /** Per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  selectionMode?: ButtonGroupSelectionMode\n  modelValue?: ButtonGroupValue\n  /** Shorthand API: render buttons from an array instead of the compound slot API */\n  buttons?: ButtonShorthandItem[]\n}>(), {\n  variant: 'solid',\n  color: 'primary',\n  size: 'md',\n  disabled: false,\n  fullWidth: false,\n  orientation: 'horizontal',\n  selectionMode: 'single',\n  modelValue: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: ButtonGroupValue]\n}>()\n\n// Selected value: controlled if modelValue prop is provided, otherwise uncontrolled.\n// Single mode: scalar (string|number|null). Multiple mode: array of scalars.\nconst internalSelected = ref<ButtonGroupValue>(props.selectionMode === 'multiple' ? [] : null)\nconst selectedValue = computed<ButtonGroupValue>({\n  get: () => (props.modelValue !== undefined ? props.modelValue : internalSelected.value),\n  set: (v) => {\n    if (props.modelValue === undefined) internalSelected.value = v\n    emit('update:modelValue', v)\n  },\n})\n\nfunction isValueSelected(value: string | number | undefined): boolean {\n  if (value === undefined) return false\n  const current = selectedValue.value\n  if (Array.isArray(current)) return current.includes(value)\n  return current === value\n}\n\nfunction selectValue(value: string | number) {\n  if (props.selectionMode === 'multiple') {\n    const current = Array.isArray(selectedValue.value) ? selectedValue.value : []\n    selectedValue.value = current.includes(value)\n      ? current.filter((v) => v !== value)\n      : [...current, value]\n  } else {\n    // Single mode: clicking the already-selected button deselects it\n    selectedValue.value = selectedValue.value === value ? null : value\n  }\n}\n\n// Provide context using toRef() for reactivity (D-11)\nuseButtonGroupProvide({\n  variant: toRef(props, 'variant'),\n  color: toRef(props, 'color'),\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  selectedValue,\n  isValueSelected,\n  selectValue,\n})\n\nconst slotFns = computed(() =>\n  buttonGroupVariants({\n    fullWidth: props.fullWidth,\n    orientation: props.orientation,\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      <Button\n        v-for=\"(btn, idx) in props.buttons\"\n        :key=\"idx\"\n        :value=\"btn.value\"\n        :disabled=\"btn.disabled\"\n        :is-loading=\"btn.isLoading\"\n        :variant=\"btn.variant\"\n        :color=\"btn.color\"\n        :class=\"btn.class\"\n      >{{ btn.label }}</Button>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ButtonGroup.js","names":[],"sources":["../../../src/components/button/ButtonGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { buttonGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupProvide } from './button-group.context'\nimport type { ButtonGroupSelectionMode, ButtonGroupValue } from './button-group.context'\nimport type { ButtonVariants } from '@auronui/styles'\nimport Button from './Button.vue'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\ntype ButtonShorthandItem = {\n  label: string\n  value?: string | number\n  disabled?: boolean\n  isLoading?: boolean\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  class?: string\n}\n\nconst props = withDefaults(defineProps<{\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  fullWidth?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  class?: ClassValue\n  /** Per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  selectionMode?: ButtonGroupSelectionMode\n  modelValue?: ButtonGroupValue\n  /** Shorthand API: render buttons from an array instead of the compound slot API */\n  buttons?: ButtonShorthandItem[]\n}>(), {\n  variant: 'solid',\n  color: 'primary',\n  size: 'md',\n  isDisabled: undefined,\n  disabled: undefined,\n  fullWidth: false,\n  orientation: 'horizontal',\n  selectionMode: 'single',\n  modelValue: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: ButtonGroupValue]\n}>()\n\n// Selected value: controlled if modelValue prop is provided, otherwise uncontrolled.\n// Single mode: scalar (string|number|null). Multiple mode: array of scalars.\nconst internalSelected = ref<ButtonGroupValue>(props.selectionMode === 'multiple' ? [] : null)\nconst selectedValue = computed<ButtonGroupValue>({\n  get: () => (props.modelValue !== undefined ? props.modelValue : internalSelected.value),\n  set: (v) => {\n    if (props.modelValue === undefined) internalSelected.value = v\n    emit('update:modelValue', v)\n  },\n})\n\nfunction isValueSelected(value: string | number | undefined): boolean {\n  if (value === undefined) return false\n  const current = selectedValue.value\n  if (Array.isArray(current)) return current.includes(value)\n  return current === value\n}\n\nfunction selectValue(value: string | number) {\n  if (props.selectionMode === 'multiple') {\n    const current = Array.isArray(selectedValue.value) ? selectedValue.value : []\n    selectedValue.value = current.includes(value)\n      ? current.filter((v) => v !== value)\n      : [...current, value]\n  } else {\n    // Single mode: clicking the already-selected button deselects it\n    selectedValue.value = selectedValue.value === value ? null : value\n  }\n}\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ButtonGroup', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\n// Provide context using toRef() for reactivity (D-11)\nuseButtonGroupProvide({\n  variant: toRef(props, 'variant'),\n  color: toRef(props, 'color'),\n  size: toRef(props, 'size'),\n  disabled: isDisabled,\n  fullWidth: toRef(props, 'fullWidth'),\n  orientation: toRef(props, 'orientation'),\n  selectionMode: toRef(props, 'selectionMode'),\n  selectedValue,\n  isValueSelected,\n  selectValue,\n})\n\nconst slotFns = computed(() =>\n  buttonGroupVariants({\n    fullWidth: props.fullWidth,\n    orientation: props.orientation,\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      <Button\n        v-for=\"(btn, idx) in props.buttons\"\n        :key=\"idx\"\n        :value=\"btn.value\"\n        :is-disabled=\"btn.disabled\"\n        :is-loading=\"btn.isLoading\"\n        :variant=\"btn.variant\"\n        :color=\"btn.color\"\n        :class=\"btn.class\"\n      >{{ btn.label }}</Button>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":""}

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

@@ -1,5 +1,6 @@
 import { composeClassName } from "../../utils/composeClassName.js";
 import { useButtonGroupProvide } from "./button-group.context.js";
+import { useDeprecatedBooleanProp } from "../../composables/useDeprecatedBooleanProp.js";
 import Button_default from "./Button.js";
 import { Fragment, computed, createBlock, createElementBlock, createTextVNode, defineComponent, normalizeClass, openBlock, ref, renderList, renderSlot, toDisplayString, toRef, unref, withCtx } from "vue";
 import { buttonGroupVariants } from "@auronui/styles";
@@ -11,9 +12,13 @@ var ButtonGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 		variant: { default: "solid" },
 		color: { default: "primary" },
 		size: { default: "md" },
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
-			default: false
+			default: void 0
 		},
 		fullWidth: {
 			type: Boolean,
@@ -56,11 +61,12 @@ var ButtonGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				selectedValue.value = current.includes(value) ? current.filter((v) => v !== value) : [...current, value];
 			} else selectedValue.value = selectedValue.value === value ? null : value;
 		}
+		const isDisabled = useDeprecatedBooleanProp("ButtonGroup", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
 		useButtonGroupProvide({
 			variant: toRef(props, "variant"),
 			color: toRef(props, "color"),
 			size: toRef(props, "size"),
-			disabled: toRef(props, "disabled"),
+			disabled: isDisabled,
 			fullWidth: toRef(props, "fullWidth"),
 			orientation: toRef(props, "orientation"),
 			selectionMode: toRef(props, "selectionMode"),
@@ -81,7 +87,7 @@ var ButtonGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				return openBlock(), createBlock(Button_default, {
 					key: idx,
 					value: btn.value,
-					disabled: btn.disabled,
+					"is-disabled": btn.disabled,
 					"is-loading": btn.isLoading,
 					variant: btn.variant,
 					color: btn.color,
@@ -91,7 +97,7 @@ var ButtonGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 					_: 2
 				}, 1032, [
 					"value",
-					"disabled",
+					"is-disabled",
 					"is-loading",
 					"variant",
 					"color",

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

@@ -1 +1 @@
-{"version":3,"file":"ButtonGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/ButtonGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { buttonGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupProvide } from './button-group.context'\nimport type { ButtonGroupSelectionMode, ButtonGroupValue } from './button-group.context'\nimport type { ButtonVariants } from '@auronui/styles'\nimport Button from './Button.vue'\n\ntype ButtonShorthandItem = {\n  label: string\n  value?: string | number\n  disabled?: boolean\n  isLoading?: boolean\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  class?: string\n}\n\nconst props = withDefaults(defineProps<{\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  disabled?: boolean\n  fullWidth?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  class?: ClassValue\n  /** Per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  selectionMode?: ButtonGroupSelectionMode\n  modelValue?: ButtonGroupValue\n  /** Shorthand API: render buttons from an array instead of the compound slot API */\n  buttons?: ButtonShorthandItem[]\n}>(), {\n  variant: 'solid',\n  color: 'primary',\n  size: 'md',\n  disabled: false,\n  fullWidth: false,\n  orientation: 'horizontal',\n  selectionMode: 'single',\n  modelValue: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: ButtonGroupValue]\n}>()\n\n// Selected value: controlled if modelValue prop is provided, otherwise uncontrolled.\n// Single mode: scalar (string|number|null). Multiple mode: array of scalars.\nconst internalSelected = ref<ButtonGroupValue>(props.selectionMode === 'multiple' ? [] : null)\nconst selectedValue = computed<ButtonGroupValue>({\n  get: () => (props.modelValue !== undefined ? props.modelValue : internalSelected.value),\n  set: (v) => {\n    if (props.modelValue === undefined) internalSelected.value = v\n    emit('update:modelValue', v)\n  },\n})\n\nfunction isValueSelected(value: string | number | undefined): boolean {\n  if (value === undefined) return false\n  const current = selectedValue.value\n  if (Array.isArray(current)) return current.includes(value)\n  return current === value\n}\n\nfunction selectValue(value: string | number) {\n  if (props.selectionMode === 'multiple') {\n    const current = Array.isArray(selectedValue.value) ? selectedValue.value : []\n    selectedValue.value = current.includes(value)\n      ? current.filter((v) => v !== value)\n      : [...current, value]\n  } else {\n    // Single mode: clicking the already-selected button deselects it\n    selectedValue.value = selectedValue.value === value ? null : value\n  }\n}\n\n// Provide context using toRef() for reactivity (D-11)\nuseButtonGroupProvide({\n  variant: toRef(props, 'variant'),\n  color: toRef(props, 'color'),\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  selectedValue,\n  isValueSelected,\n  selectValue,\n})\n\nconst slotFns = computed(() =>\n  buttonGroupVariants({\n    fullWidth: props.fullWidth,\n    orientation: props.orientation,\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      <Button\n        v-for=\"(btn, idx) in props.buttons\"\n        :key=\"idx\"\n        :value=\"btn.value\"\n        :disabled=\"btn.disabled\"\n        :is-loading=\"btn.isLoading\"\n        :variant=\"btn.variant\"\n        :color=\"btn.color\"\n        :class=\"btn.class\"\n      >{{ btn.label }}</Button>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmBA,MAAM,QAAQ;EA2Bd,MAAM,OAAO;EAMb,MAAM,mBAAmB,IAAsB,MAAM,kBAAkB,aAAa,EAAE,GAAG,KAAI;EAC7F,MAAM,gBAAgB,SAA2B;GAC/C,WAAY,MAAM,eAAe,KAAA,IAAY,MAAM,aAAa,iBAAiB;GACjF,MAAM,MAAM;AACV,QAAI,MAAM,eAAe,KAAA,EAAW,kBAAiB,QAAQ;AAC7D,SAAK,qBAAqB,EAAC;;GAE9B,CAAA;EAED,SAAS,gBAAgB,OAA6C;AACpE,OAAI,UAAU,KAAA,EAAW,QAAO;GAChC,MAAM,UAAU,cAAc;AAC9B,OAAI,MAAM,QAAQ,QAAQ,CAAE,QAAO,QAAQ,SAAS,MAAK;AACzD,UAAO,YAAY;;EAGrB,SAAS,YAAY,OAAwB;AAC3C,OAAI,MAAM,kBAAkB,YAAY;IACtC,MAAM,UAAU,MAAM,QAAQ,cAAc,MAAM,GAAG,cAAc,QAAQ,EAAC;AAC5E,kBAAc,QAAQ,QAAQ,SAAS,MAAK,GACxC,QAAQ,QAAQ,MAAM,MAAM,MAAK,GACjC,CAAC,GAAG,SAAS,MAAK;SAGtB,eAAc,QAAQ,cAAc,UAAU,QAAQ,OAAO;;AAKjE,wBAAsB;GACpB,SAAS,MAAM,OAAO,UAAU;GAChC,OAAO,MAAM,OAAO,QAAQ;GAC5B,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;GACA;GACD,CAAA;EAED,MAAM,UAAU,eACd,oBAAoB;GAClB,WAAW,MAAM;GACjB,aAAa,MAAM;GACpB,CAAA,CACH;;uBAIE,mBAkBM,OAAA;IAjBH,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,mBASyB,UAAA,EAAA,KAAA,GAAA,EAAA,WARF,MAAM,UAAnB,KAAK,QAAG;wBADlB,YASyB,gBAAA;KAPtB,KAAK;KACL,OAAO,IAAI;KACX,UAAU,IAAI;KACd,cAAY,IAAI;KAChB,SAAS,IAAI;KACb,OAAO,IAAI;KACX,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"}
+{"version":3,"file":"ButtonGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/ButtonGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref, toRef } from 'vue'\nimport { buttonGroupVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useButtonGroupProvide } from './button-group.context'\nimport type { ButtonGroupSelectionMode, ButtonGroupValue } from './button-group.context'\nimport type { ButtonVariants } from '@auronui/styles'\nimport Button from './Button.vue'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\ntype ButtonShorthandItem = {\n  label: string\n  value?: string | number\n  disabled?: boolean\n  isLoading?: boolean\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  class?: string\n}\n\nconst props = withDefaults(defineProps<{\n  variant?: ButtonVariants['variant']\n  color?: ButtonVariants['color']\n  size?: ButtonVariants['size']\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  fullWidth?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  class?: ClassValue\n  /** Per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  selectionMode?: ButtonGroupSelectionMode\n  modelValue?: ButtonGroupValue\n  /** Shorthand API: render buttons from an array instead of the compound slot API */\n  buttons?: ButtonShorthandItem[]\n}>(), {\n  variant: 'solid',\n  color: 'primary',\n  size: 'md',\n  isDisabled: undefined,\n  disabled: undefined,\n  fullWidth: false,\n  orientation: 'horizontal',\n  selectionMode: 'single',\n  modelValue: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: ButtonGroupValue]\n}>()\n\n// Selected value: controlled if modelValue prop is provided, otherwise uncontrolled.\n// Single mode: scalar (string|number|null). Multiple mode: array of scalars.\nconst internalSelected = ref<ButtonGroupValue>(props.selectionMode === 'multiple' ? [] : null)\nconst selectedValue = computed<ButtonGroupValue>({\n  get: () => (props.modelValue !== undefined ? props.modelValue : internalSelected.value),\n  set: (v) => {\n    if (props.modelValue === undefined) internalSelected.value = v\n    emit('update:modelValue', v)\n  },\n})\n\nfunction isValueSelected(value: string | number | undefined): boolean {\n  if (value === undefined) return false\n  const current = selectedValue.value\n  if (Array.isArray(current)) return current.includes(value)\n  return current === value\n}\n\nfunction selectValue(value: string | number) {\n  if (props.selectionMode === 'multiple') {\n    const current = Array.isArray(selectedValue.value) ? selectedValue.value : []\n    selectedValue.value = current.includes(value)\n      ? current.filter((v) => v !== value)\n      : [...current, value]\n  } else {\n    // Single mode: clicking the already-selected button deselects it\n    selectedValue.value = selectedValue.value === value ? null : value\n  }\n}\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ButtonGroup', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\n// Provide context using toRef() for reactivity (D-11)\nuseButtonGroupProvide({\n  variant: toRef(props, 'variant'),\n  color: toRef(props, 'color'),\n  size: toRef(props, 'size'),\n  disabled: isDisabled,\n  fullWidth: toRef(props, 'fullWidth'),\n  orientation: toRef(props, 'orientation'),\n  selectionMode: toRef(props, 'selectionMode'),\n  selectedValue,\n  isValueSelected,\n  selectValue,\n})\n\nconst slotFns = computed(() =>\n  buttonGroupVariants({\n    fullWidth: props.fullWidth,\n    orientation: props.orientation,\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      <Button\n        v-for=\"(btn, idx) in props.buttons\"\n        :key=\"idx\"\n        :value=\"btn.value\"\n        :is-disabled=\"btn.disabled\"\n        :is-loading=\"btn.isLoading\"\n        :variant=\"btn.variant\"\n        :color=\"btn.color\"\n        :class=\"btn.class\"\n      >{{ btn.label }}</Button>\n    </template>\n    <slot v-else />\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoBA,MAAM,QAAQ;EA8Bd,MAAM,OAAO;EAMb,MAAM,mBAAmB,IAAsB,MAAM,kBAAkB,aAAa,EAAE,GAAG,KAAI;EAC7F,MAAM,gBAAgB,SAA2B;GAC/C,WAAY,MAAM,eAAe,KAAA,IAAY,MAAM,aAAa,iBAAiB;GACjF,MAAM,MAAM;AACV,QAAI,MAAM,eAAe,KAAA,EAAW,kBAAiB,QAAQ;AAC7D,SAAK,qBAAqB,EAAC;;GAE9B,CAAA;EAED,SAAS,gBAAgB,OAA6C;AACpE,OAAI,UAAU,KAAA,EAAW,QAAO;GAChC,MAAM,UAAU,cAAc;AAC9B,OAAI,MAAM,QAAQ,QAAQ,CAAE,QAAO,QAAQ,SAAS,MAAK;AACzD,UAAO,YAAY;;EAGrB,SAAS,YAAY,OAAwB;AAC3C,OAAI,MAAM,kBAAkB,YAAY;IACtC,MAAM,UAAU,MAAM,QAAQ,cAAc,MAAM,GAAG,cAAc,QAAQ,EAAC;AAC5E,kBAAc,QAAQ,QAAQ,SAAS,MAAK,GACxC,QAAQ,QAAQ,MAAM,MAAM,MAAK,GACjC,CAAC,GAAG,SAAS,MAAK;SAGtB,eAAc,QAAQ,cAAc,UAAU,QAAQ,OAAO;;EAIjE,MAAM,aAAa,yBACjB,eAAe,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SAC/E;AAGA,wBAAsB;GACpB,SAAS,MAAM,OAAO,UAAU;GAChC,OAAO,MAAM,OAAO,QAAQ;GAC5B,MAAM,MAAM,OAAO,OAAO;GAC1B,UAAU;GACV,WAAW,MAAM,OAAO,YAAY;GACpC,aAAa,MAAM,OAAO,cAAc;GACxC,eAAe,MAAM,OAAO,gBAAgB;GAC5C;GACA;GACA;GACD,CAAA;EAED,MAAM,UAAU,eACd,oBAAoB;GAClB,WAAW,MAAM;GACjB,aAAa,MAAM;GACpB,CAAA,CACH;;uBAIE,mBAkBM,OAAA;IAjBH,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,mBASyB,UAAA,EAAA,KAAA,GAAA,EAAA,WARF,MAAM,UAAnB,KAAK,QAAG;wBADlB,YASyB,gBAAA;KAPtB,KAAK;KACL,OAAO,IAAI;KACX,eAAa,IAAI;KACjB,cAAY,IAAI;KAChB,SAAS,IAAI;KACb,OAAO,IAAI;KACX,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/CloseButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"CloseButton.js","names":[],"sources":["../../../src/components/button/CloseButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport Button from './Button.vue'\nimport type { ButtonVariants } from '@auronui/styles'\n\nconst props = withDefaults(defineProps<{\n  size?: ButtonVariants['size']\n  disabled?: boolean\n  isLoading?: boolean\n  ariaLabel?: string\n  class?: string\n}>(), {\n  size: 'md',\n  disabled: false,\n  isLoading: false,\n  ariaLabel: 'Close',\n})\n</script>\n\n<template>\n  <Button\n    variant=\"ghost\"\n    :is-icon-only=\"true\"\n    :size=\"props.size\"\n    :disabled=\"props.disabled\"\n    :is-loading=\"props.isLoading\"\n    :aria-label=\"props.ariaLabel\"\n    :class=\"props.class\"\n  >\n    <!-- D-16: Inline SVG X glyph — 16×16 viewBox, 2px stroke, currentColor -->\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      focusable=\"false\"\n    >\n      <line\n        x1=\"18\"\n        y1=\"6\"\n        x2=\"6\"\n        y2=\"18\"\n      />\n      <line\n        x1=\"6\"\n        y1=\"6\"\n        x2=\"18\"\n        y2=\"18\"\n      />\n    </svg>\n  </Button>\n</template>\n"],"mappings":""}
+{"version":3,"file":"CloseButton.js","names":[],"sources":["../../../src/components/button/CloseButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport Button from './Button.vue'\nimport type { ButtonVariants } from '@auronui/styles'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  size?: ButtonVariants['size']\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  isLoading?: boolean\n  ariaLabel?: string\n  class?: string\n}>(), {\n  size: 'md',\n  isDisabled: undefined,\n  disabled: undefined,\n  isLoading: false,\n  ariaLabel: 'Close',\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'CloseButton', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n</script>\n\n<template>\n  <Button\n    variant=\"ghost\"\n    :is-icon-only=\"true\"\n    :size=\"props.size\"\n    :is-disabled=\"isDisabled\"\n    :is-loading=\"props.isLoading\"\n    :aria-label=\"props.ariaLabel\"\n    :class=\"props.class\"\n  >\n    <!-- D-16: Inline SVG X glyph — 16×16 viewBox, 2px stroke, currentColor -->\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      focusable=\"false\"\n    >\n      <line\n        x1=\"18\"\n        y1=\"6\"\n        x2=\"6\"\n        y2=\"18\"\n      />\n      <line\n        x1=\"6\"\n        y1=\"6\"\n        x2=\"18\"\n        y2=\"18\"\n      />\n    </svg>\n  </Button>\n</template>\n"],"mappings":""}

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

@@ -1,13 +1,18 @@
+import { useDeprecatedBooleanProp } from "../../composables/useDeprecatedBooleanProp.js";
 import Button_default from "./Button.js";
-import { createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, withCtx } from "vue";
+import { createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, unref, withCtx } from "vue";
 //#region src/components/button/CloseButton.vue?vue&type=script&setup=true&lang.ts
 var CloseButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "CloseButton",
 	props: {
 		size: { default: "md" },
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
-			default: false
+			default: void 0
 		},
 		isLoading: {
 			type: Boolean,
@@ -18,12 +23,13 @@ var CloseButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 	},
 	setup(__props) {
 		const props = __props;
+		const isDisabled = useDeprecatedBooleanProp("CloseButton", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(Button_default, {
 				variant: "ghost",
 				"is-icon-only": true,
 				size: props.size,
-				disabled: props.disabled,
+				"is-disabled": unref(isDisabled),
 				"is-loading": props.isLoading,
 				"aria-label": props.ariaLabel,
 				class: normalizeClass(props.class)
@@ -54,7 +60,7 @@ var CloseButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 				_: 1
 			}, 8, [
 				"size",
-				"disabled",
+				"is-disabled",
 				"is-loading",
 				"aria-label",
 				"class"

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

@@ -1 +1 @@
-{"version":3,"file":"CloseButton.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/CloseButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport Button from './Button.vue'\nimport type { ButtonVariants } from '@auronui/styles'\n\nconst props = withDefaults(defineProps<{\n  size?: ButtonVariants['size']\n  disabled?: boolean\n  isLoading?: boolean\n  ariaLabel?: string\n  class?: string\n}>(), {\n  size: 'md',\n  disabled: false,\n  isLoading: false,\n  ariaLabel: 'Close',\n})\n</script>\n\n<template>\n  <Button\n    variant=\"ghost\"\n    :is-icon-only=\"true\"\n    :size=\"props.size\"\n    :disabled=\"props.disabled\"\n    :is-loading=\"props.isLoading\"\n    :aria-label=\"props.ariaLabel\"\n    :class=\"props.class\"\n  >\n    <!-- D-16: Inline SVG X glyph — 16×16 viewBox, 2px stroke, currentColor -->\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      focusable=\"false\"\n    >\n      <line\n        x1=\"18\"\n        y1=\"6\"\n        x2=\"6\"\n        y2=\"18\"\n      />\n      <line\n        x1=\"6\"\n        y1=\"6\"\n        x2=\"18\"\n        y2=\"18\"\n      />\n    </svg>\n  </Button>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAIA,MAAM,QAAQ;;uBAeZ,YAoCS,gBAAA;IAnCP,SAAQ;IACP,gBAAc;IACd,MAAM,MAAM;IACZ,UAAU,MAAM;IAChB,cAAY,MAAM;IAClB,cAAY,MAAM;IAClB,OAAK,eAAE,MAAM,MAAK;;2BA4Bb,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAzBN,mBAyBM,OAAA;KAxBJ,OAAM;KACN,OAAM;KACN,QAAO;KACP,SAAQ;KACR,MAAK;KACL,QAAO;KACP,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,eAAY;KACZ,WAAU;QAEV,mBAKE,QAAA;KAJA,IAAG;KACH,IAAG;KACH,IAAG;KACH,IAAG;QAEL,mBAKE,QAAA;KAJA,IAAG;KACH,IAAG;KACH,IAAG;KACH,IAAG"}
+{"version":3,"file":"CloseButton.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/CloseButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport Button from './Button.vue'\nimport type { ButtonVariants } from '@auronui/styles'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  size?: ButtonVariants['size']\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  isLoading?: boolean\n  ariaLabel?: string\n  class?: string\n}>(), {\n  size: 'md',\n  isDisabled: undefined,\n  disabled: undefined,\n  isLoading: false,\n  ariaLabel: 'Close',\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'CloseButton', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n</script>\n\n<template>\n  <Button\n    variant=\"ghost\"\n    :is-icon-only=\"true\"\n    :size=\"props.size\"\n    :is-disabled=\"isDisabled\"\n    :is-loading=\"props.isLoading\"\n    :aria-label=\"props.ariaLabel\"\n    :class=\"props.class\"\n  >\n    <!-- D-16: Inline SVG X glyph — 16×16 viewBox, 2px stroke, currentColor -->\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      focusable=\"false\"\n    >\n      <line\n        x1=\"18\"\n        y1=\"6\"\n        x2=\"6\"\n        y2=\"18\"\n      />\n      <line\n        x1=\"6\"\n        y1=\"6\"\n        x2=\"18\"\n        y2=\"18\"\n      />\n    </svg>\n  </Button>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAKA,MAAM,QAAQ;EAgBd,MAAM,aAAa,yBACjB,eAAe,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SAC/E;;uBAIE,YAoCS,gBAAA;IAnCP,SAAQ;IACP,gBAAc;IACd,MAAM,MAAM;IACZ,eAAa,MAAA,WAAU;IACvB,cAAY,MAAM;IAClB,cAAY,MAAM;IAClB,OAAK,eAAE,MAAM,MAAK;;2BA4Bb,CAAA,GAAA,OAAA,OAAA,OAAA,KAAA,CAzBN,mBAyBM,OAAA;KAxBJ,OAAM;KACN,OAAM;KACN,QAAO;KACP,SAAQ;KACR,MAAK;KACL,QAAO;KACP,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,eAAY;KACZ,WAAU;QAEV,mBAKE,QAAA;KAJA,IAAG;KACH,IAAG;KACH,IAAG;KACH,IAAG;QAEL,mBAKE,QAAA;KAJA,IAAG;KACH,IAAG;KACH,IAAG;KACH,IAAG"}

package/dist/components/button/ToggleButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.js","names":[],"sources":["../../../src/components/button/ToggleButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Toggle } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToggleButtonGroupInject } from './toggle-button-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  disabled?: boolean\n  modelValue?: boolean\n  defaultValue?: boolean\n  value?: string\n  class?: string\n  as?: string\n  asChild?: boolean\n  name?: string\n  required?: boolean\n}>(), {\n  variant: undefined,\n  size: undefined,\n  isIconOnly: false,\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: false,\n  value: undefined,\n  as: undefined,\n  asChild: false,\n  name: undefined,\n  required: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n}>()\n\n// Inject ToggleButtonGroup context with fallback defaults (mirrors Button → ButtonGroup pattern)\nconst groupCtx = useToggleButtonGroupInject({\n  variant: ref('default'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('multiple'),\n  selectedValues: ref([]),\n  toggleValue: () => {},\n})\n\n// Prop precedence: group disabled wins; child prop wins for variant/size\nconst isDisabled = computed(() => groupCtx.disabled.value || props.disabled)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\n\n// When inside a group with selectionMode and a value prop, derive pressed from group state\nconst isGroupManaged = computed(() => props.value !== undefined)\nconst isPressed = computed(() => {\n  if (isGroupManaged.value) {\n    return groupCtx.selectedValues.value.includes(props.value!)\n  }\n  return props.modelValue\n})\n\nfunction handleUpdate(val: boolean) {\n  if (isGroupManaged.value) {\n    groupCtx.toggleValue(props.value!)\n  } else {\n    emit('update:modelValue', val)\n  }\n}\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: finalVariant.value,\n    size: finalSize.value,\n    isIconOnly: props.isIconOnly,\n  })\n)\n</script>\n\n<template>\n  <!--\n    Use as-child so Reka's Toggle merges data-state / aria-pressed / onClick directly\n    onto OUR <button> element instead of relying on a 2-level inheritAttrs chain\n    (Toggle → Primitive → button). This guarantees the toggle-button CSS class and\n    data-state=\"on\" are always on the same DOM element, so [data-state=\"on\"] selectors\n    apply correctly.\n  -->\n  <Toggle\n    as-child\n    :disabled=\"isDisabled\"\n    :model-value=\"isPressed\"\n    :default-value=\"props.defaultValue\"\n    :name=\"props.name\"\n    :required=\"props.required\"\n    @update:model-value=\"handleUpdate\"\n  >\n    <button\n      :class=\"composeClassName(classes, props.class)\"\n      :disabled=\"isDisabled || undefined\"\n      :data-orientation=\"groupCtx.orientation.value\"\n      :type=\"'button'\"\n    >\n      <slot />\n    </button>\n  </Toggle>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToggleButton.js","names":[],"sources":["../../../src/components/button/ToggleButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Toggle } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToggleButtonGroupInject } from './toggle-button-group.context'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  modelValue?: boolean\n  defaultValue?: boolean\n  value?: string\n  class?: string\n  as?: string\n  asChild?: boolean\n  name?: string\n  isRequired?: boolean\n  /** @deprecated Use isRequired instead. */\n  required?: boolean\n}>(), {\n  variant: undefined,\n  size: undefined,\n  isIconOnly: false,\n  isDisabled: undefined,\n  disabled: undefined,\n  modelValue: undefined,\n  defaultValue: false,\n  value: undefined,\n  as: undefined,\n  asChild: false,\n  name: undefined,\n  isRequired: undefined,\n  required: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n}>()\n\n// Inject ToggleButtonGroup context with fallback defaults (mirrors Button → ButtonGroup pattern)\nconst groupCtx = useToggleButtonGroupInject({\n  variant: ref('default'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('multiple'),\n  selectedValues: ref([]),\n  toggleValue: () => {},\n})\n\n// Resolve this button's own isDisabled/disabled prop pair before combining with group state.\nconst resolvedDisabled = useDeprecatedBooleanProp(\n  'ToggleButton', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst isRequired = useDeprecatedBooleanProp(\n  'ToggleButton', 'isRequired', () => props.isRequired, 'required', () => props.required,\n)\n\n// Prop precedence: group disabled wins; child prop wins for variant/size\nconst effectiveDisabled = computed(() => groupCtx.disabled.value || resolvedDisabled.value)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\n\n// When inside a group with selectionMode and a value prop, derive pressed from group state\nconst isGroupManaged = computed(() => props.value !== undefined)\nconst isPressed = computed(() => {\n  if (isGroupManaged.value) {\n    return groupCtx.selectedValues.value.includes(props.value!)\n  }\n  return props.modelValue\n})\n\nfunction handleUpdate(val: boolean) {\n  if (isGroupManaged.value) {\n    groupCtx.toggleValue(props.value!)\n  } else {\n    emit('update:modelValue', val)\n  }\n}\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: finalVariant.value,\n    size: finalSize.value,\n    isIconOnly: props.isIconOnly,\n  })\n)\n</script>\n\n<template>\n  <!--\n    Use as-child so Reka's Toggle merges data-state / aria-pressed / onClick directly\n    onto OUR <button> element instead of relying on a 2-level inheritAttrs chain\n    (Toggle → Primitive → button). This guarantees the toggle-button CSS class and\n    data-state=\"on\" are always on the same DOM element, so [data-state=\"on\"] selectors\n    apply correctly.\n  -->\n  <Toggle\n    as-child\n    :disabled=\"effectiveDisabled\"\n    :model-value=\"isPressed\"\n    :default-value=\"props.defaultValue\"\n    :name=\"props.name\"\n    :required=\"isRequired\"\n    @update:model-value=\"handleUpdate\"\n  >\n    <button\n      :class=\"composeClassName(classes, props.class)\"\n      :disabled=\"effectiveDisabled || undefined\"\n      :data-orientation=\"groupCtx.orientation.value\"\n      :type=\"'button'\"\n    >\n      <slot />\n    </button>\n  </Toggle>\n</template>\n"],"mappings":""}

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

@@ -1,4 +1,5 @@
 import { composeClassName } from "../../utils/composeClassName.js";
+import { useDeprecatedBooleanProp } from "../../composables/useDeprecatedBooleanProp.js";
 import { useToggleButtonGroupInject } from "./toggle-button-group.context.js";
 import { computed, createBlock, createElementVNode, defineComponent, normalizeClass, openBlock, ref, renderSlot, unref, withCtx } from "vue";
 import { toggleButtonVariants } from "@auronui/styles";
@@ -14,9 +15,13 @@ var ToggleButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 			type: Boolean,
 			default: false
 		},
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
-			default: false
+			default: void 0
 		},
 		modelValue: {
 			type: Boolean,
@@ -34,9 +39,13 @@ var ToggleButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 			default: false
 		},
 		name: { default: void 0 },
+		isRequired: {
+			type: Boolean,
+			default: void 0
+		},
 		required: {
 			type: Boolean,
-			default: false
+			default: void 0
 		}
 	},
 	emits: ["update:modelValue"],
@@ -53,7 +62,9 @@ var ToggleButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 			selectedValues: ref([]),
 			toggleValue: () => {}
 		});
-		const isDisabled = computed(() => groupCtx.disabled.value || props.disabled);
+		const resolvedDisabled = useDeprecatedBooleanProp("ToggleButton", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
+		const isRequired = useDeprecatedBooleanProp("ToggleButton", "isRequired", () => props.isRequired, "required", () => props.required);
+		const effectiveDisabled = computed(() => groupCtx.disabled.value || resolvedDisabled.value);
 		const finalVariant = computed(() => props.variant ?? groupCtx.variant.value);
 		const finalSize = computed(() => props.size ?? groupCtx.size.value);
 		const isGroupManaged = computed(() => props.value !== void 0);
@@ -73,16 +84,16 @@ var ToggleButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ d
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(Toggle), {
 				"as-child": "",
-				disabled: isDisabled.value,
+				disabled: effectiveDisabled.value,
 				"model-value": isPressed.value,
 				"default-value": props.defaultValue,
 				name: props.name,
-				required: props.required,
+				required: unref(isRequired),
 				"onUpdate:modelValue": handleUpdate
 			}, {
 				default: withCtx(() => [createElementVNode("button", {
 					class: normalizeClass(unref(composeClassName)(classes.value, props.class)),
-					disabled: isDisabled.value || void 0,
+					disabled: effectiveDisabled.value || void 0,
 					"data-orientation": unref(groupCtx).orientation.value,
 					type: "button"
 				}, [renderSlot(_ctx.$slots, "default")], 10, _hoisted_1)]),

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

@@ -1 +1 @@
-{"version":3,"file":"ToggleButton.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/ToggleButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Toggle } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToggleButtonGroupInject } from './toggle-button-group.context'\n\nconst props = withDefaults(defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  disabled?: boolean\n  modelValue?: boolean\n  defaultValue?: boolean\n  value?: string\n  class?: string\n  as?: string\n  asChild?: boolean\n  name?: string\n  required?: boolean\n}>(), {\n  variant: undefined,\n  size: undefined,\n  isIconOnly: false,\n  disabled: false,\n  modelValue: undefined,\n  defaultValue: false,\n  value: undefined,\n  as: undefined,\n  asChild: false,\n  name: undefined,\n  required: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n}>()\n\n// Inject ToggleButtonGroup context with fallback defaults (mirrors Button → ButtonGroup pattern)\nconst groupCtx = useToggleButtonGroupInject({\n  variant: ref('default'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('multiple'),\n  selectedValues: ref([]),\n  toggleValue: () => {},\n})\n\n// Prop precedence: group disabled wins; child prop wins for variant/size\nconst isDisabled = computed(() => groupCtx.disabled.value || props.disabled)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\n\n// When inside a group with selectionMode and a value prop, derive pressed from group state\nconst isGroupManaged = computed(() => props.value !== undefined)\nconst isPressed = computed(() => {\n  if (isGroupManaged.value) {\n    return groupCtx.selectedValues.value.includes(props.value!)\n  }\n  return props.modelValue\n})\n\nfunction handleUpdate(val: boolean) {\n  if (isGroupManaged.value) {\n    groupCtx.toggleValue(props.value!)\n  } else {\n    emit('update:modelValue', val)\n  }\n}\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: finalVariant.value,\n    size: finalSize.value,\n    isIconOnly: props.isIconOnly,\n  })\n)\n</script>\n\n<template>\n  <!--\n    Use as-child so Reka's Toggle merges data-state / aria-pressed / onClick directly\n    onto OUR <button> element instead of relying on a 2-level inheritAttrs chain\n    (Toggle → Primitive → button). This guarantees the toggle-button CSS class and\n    data-state=\"on\" are always on the same DOM element, so [data-state=\"on\"] selectors\n    apply correctly.\n  -->\n  <Toggle\n    as-child\n    :disabled=\"isDisabled\"\n    :model-value=\"isPressed\"\n    :default-value=\"props.defaultValue\"\n    :name=\"props.name\"\n    :required=\"props.required\"\n    @update:model-value=\"handleUpdate\"\n  >\n    <button\n      :class=\"composeClassName(classes, props.class)\"\n      :disabled=\"isDisabled || undefined\"\n      :data-orientation=\"groupCtx.orientation.value\"\n      :type=\"'button'\"\n    >\n      <slot />\n    </button>\n  </Toggle>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;EA2Bd,MAAM,OAAO;EAKb,MAAM,WAAW,2BAA2B;GAC1C,SAAS,IAAI,UAAU;GACvB,MAAM,IAAI,KAAK;GACf,UAAU,IAAI,MAAM;GACpB,WAAW,IAAI,MAAM;GACrB,aAAa,IAAI,aAAa;GAC9B,eAAe,IAAI,WAAW;GAC9B,gBAAgB,IAAI,EAAE,CAAC;GACvB,mBAAmB;GACpB,CAAA;EAGD,MAAM,aAAa,eAAe,SAAS,SAAS,SAAS,MAAM,SAAQ;EAC3E,MAAM,eAAe,eAAe,MAAM,WAAW,SAAS,QAAQ,MAAK;EAC3E,MAAM,YAAY,eAAe,MAAM,QAAQ,SAAS,KAAK,MAAK;EAGlE,MAAM,iBAAiB,eAAe,MAAM,UAAU,KAAA,EAAS;EAC/D,MAAM,YAAY,eAAe;AAC/B,OAAI,eAAe,MACjB,QAAO,SAAS,eAAe,MAAM,SAAS,MAAM,MAAM;AAE5D,UAAO,MAAM;IACd;EAED,SAAS,aAAa,KAAc;AAClC,OAAI,eAAe,MACjB,UAAS,YAAY,MAAM,MAAM;OAEjC,MAAK,qBAAqB,IAAG;;EAIjC,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,aAAa;GACtB,MAAM,UAAU;GAChB,YAAY,MAAM;GACnB,CAAA,CACH;;uBAWE,YAiBS,MAAA,OAAA,EAAA;IAhBP,YAAA;IACC,UAAU,WAAA;IACV,eAAa,UAAA;IACb,iBAAe,MAAM;IACrB,MAAM,MAAM;IACZ,UAAU,MAAM;IAChB,uBAAoB;;2BASZ,CAPT,mBAOS,UAAA;KANN,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;KAC5C,UAAU,WAAA,SAAc,KAAA;KACxB,oBAAkB,MAAA,SAAQ,CAAC,YAAY;KACvC,MAAM;QAEP,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,IAAA,WAAA,CAAA,CAAA"}
+{"version":3,"file":"ToggleButton.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/button/ToggleButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Toggle } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToggleButtonGroupInject } from './toggle-button-group.context'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  modelValue?: boolean\n  defaultValue?: boolean\n  value?: string\n  class?: string\n  as?: string\n  asChild?: boolean\n  name?: string\n  isRequired?: boolean\n  /** @deprecated Use isRequired instead. */\n  required?: boolean\n}>(), {\n  variant: undefined,\n  size: undefined,\n  isIconOnly: false,\n  isDisabled: undefined,\n  disabled: undefined,\n  modelValue: undefined,\n  defaultValue: false,\n  value: undefined,\n  as: undefined,\n  asChild: false,\n  name: undefined,\n  isRequired: undefined,\n  required: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n}>()\n\n// Inject ToggleButtonGroup context with fallback defaults (mirrors Button → ButtonGroup pattern)\nconst groupCtx = useToggleButtonGroupInject({\n  variant: ref('default'),\n  size: ref('md'),\n  disabled: ref(false),\n  fullWidth: ref(false),\n  orientation: ref('horizontal'),\n  selectionMode: ref('multiple'),\n  selectedValues: ref([]),\n  toggleValue: () => {},\n})\n\n// Resolve this button's own isDisabled/disabled prop pair before combining with group state.\nconst resolvedDisabled = useDeprecatedBooleanProp(\n  'ToggleButton', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst isRequired = useDeprecatedBooleanProp(\n  'ToggleButton', 'isRequired', () => props.isRequired, 'required', () => props.required,\n)\n\n// Prop precedence: group disabled wins; child prop wins for variant/size\nconst effectiveDisabled = computed(() => groupCtx.disabled.value || resolvedDisabled.value)\nconst finalVariant = computed(() => props.variant ?? groupCtx.variant.value)\nconst finalSize = computed(() => props.size ?? groupCtx.size.value)\n\n// When inside a group with selectionMode and a value prop, derive pressed from group state\nconst isGroupManaged = computed(() => props.value !== undefined)\nconst isPressed = computed(() => {\n  if (isGroupManaged.value) {\n    return groupCtx.selectedValues.value.includes(props.value!)\n  }\n  return props.modelValue\n})\n\nfunction handleUpdate(val: boolean) {\n  if (isGroupManaged.value) {\n    groupCtx.toggleValue(props.value!)\n  } else {\n    emit('update:modelValue', val)\n  }\n}\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: finalVariant.value,\n    size: finalSize.value,\n    isIconOnly: props.isIconOnly,\n  })\n)\n</script>\n\n<template>\n  <!--\n    Use as-child so Reka's Toggle merges data-state / aria-pressed / onClick directly\n    onto OUR <button> element instead of relying on a 2-level inheritAttrs chain\n    (Toggle → Primitive → button). This guarantees the toggle-button CSS class and\n    data-state=\"on\" are always on the same DOM element, so [data-state=\"on\"] selectors\n    apply correctly.\n  -->\n  <Toggle\n    as-child\n    :disabled=\"effectiveDisabled\"\n    :model-value=\"isPressed\"\n    :default-value=\"props.defaultValue\"\n    :name=\"props.name\"\n    :required=\"isRequired\"\n    @update:model-value=\"handleUpdate\"\n  >\n    <button\n      :class=\"composeClassName(classes, props.class)\"\n      :disabled=\"effectiveDisabled || undefined\"\n      :data-orientation=\"groupCtx.orientation.value\"\n      :type=\"'button'\"\n    >\n      <slot />\n    </button>\n  </Toggle>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EAiCd,MAAM,OAAO;EAKb,MAAM,WAAW,2BAA2B;GAC1C,SAAS,IAAI,UAAU;GACvB,MAAM,IAAI,KAAK;GACf,UAAU,IAAI,MAAM;GACpB,WAAW,IAAI,MAAM;GACrB,aAAa,IAAI,aAAa;GAC9B,eAAe,IAAI,WAAW;GAC9B,gBAAgB,IAAI,EAAE,CAAC;GACvB,mBAAmB;GACpB,CAAA;EAGD,MAAM,mBAAmB,yBACvB,gBAAgB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SAChF;EAEA,MAAM,aAAa,yBACjB,gBAAgB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SAChF;EAGA,MAAM,oBAAoB,eAAe,SAAS,SAAS,SAAS,iBAAiB,MAAK;EAC1F,MAAM,eAAe,eAAe,MAAM,WAAW,SAAS,QAAQ,MAAK;EAC3E,MAAM,YAAY,eAAe,MAAM,QAAQ,SAAS,KAAK,MAAK;EAGlE,MAAM,iBAAiB,eAAe,MAAM,UAAU,KAAA,EAAS;EAC/D,MAAM,YAAY,eAAe;AAC/B,OAAI,eAAe,MACjB,QAAO,SAAS,eAAe,MAAM,SAAS,MAAM,MAAM;AAE5D,UAAO,MAAM;IACd;EAED,SAAS,aAAa,KAAc;AAClC,OAAI,eAAe,MACjB,UAAS,YAAY,MAAM,MAAM;OAEjC,MAAK,qBAAqB,IAAG;;EAIjC,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,aAAa;GACtB,MAAM,UAAU;GAChB,YAAY,MAAM;GACnB,CAAA,CACH;;uBAWE,YAiBS,MAAA,OAAA,EAAA;IAhBP,YAAA;IACC,UAAU,kBAAA;IACV,eAAa,UAAA;IACb,iBAAe,MAAM;IACrB,MAAM,MAAM;IACZ,UAAU,MAAA,WAAU;IACpB,uBAAoB;;2BASZ,CAPT,mBAOS,UAAA;KANN,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;KAC5C,UAAU,kBAAA,SAAqB,KAAA;KAC/B,oBAAkB,MAAA,SAAQ,CAAC,YAAY;KACvC,MAAM;QAEP,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,IAAA,WAAA,CAAA,CAAA"}