@auronui/vue 1.3.0 → 1.4.0

package/dist/components/time-range-field/TimeRangeField.vue_vue_type_script_setup_true_lang.js

@@ -1,28 +1,11 @@
 import { composeClassName } from "../../utils/composeClassName.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useAttrs, useId, useModel, watch, withCtx } from "vue";
+import { useFormField } from "../../composables/useFormField.js";
+import FieldLabel_default from "../_shared/FieldLabel.js";
+import FormFieldHelper_default from "../_shared/FormFieldHelper.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeModels, mergeProps, normalizeClass, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, toDisplayString, unref, useAttrs, useId, useModel, watch, withCtx } from "vue";
 import { timeRangeFieldVariants } from "@auronui/styles";
 import { TimeRangeFieldInput, TimeRangeFieldRoot } from "reka-ui";
 //#region src/components/time-range-field/TimeRangeField.vue?vue&type=script&setup=true&lang.ts
-var _hoisted_1 = [
-	"data-invalid",
-	"data-disabled",
-	"data-readonly",
-	"data-required",
-	"data-has-label",
-	"data-has-helper"
-];
-var _hoisted_2 = ["id", "for"];
-var _hoisted_3 = {
-	key: 0,
-	"aria-hidden": "true"
-};
-var _hoisted_4 = ["id", "for"];
-var _hoisted_5 = {
-	key: 0,
-	"aria-hidden": "true"
-};
-var _hoisted_6 = ["id"];
-var _hoisted_7 = ["id"];
 var TimeRangeField_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	inheritAttrs: false,
 	__name: "TimeRangeField",
@@ -92,16 +75,17 @@ var TimeRangeField_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		const generatedId = useId();
 		const fieldId = computed(() => attrs.id ?? `${generatedId}-field`);
 		const labelId = computed(() => `${generatedId}-label`);
-		const descriptionId = computed(() => `${generatedId}-description`);
-		const errorMessageId = computed(() => `${generatedId}-error`);
-		const hasLabel = computed(() => !!props.label);
 		const isFilled = computed(() => modelValue.value?.start != null || modelValue.value?.end != null);
-		const showError = computed(() => props.isInvalid && !!props.errorMessage);
-		const showDescription = computed(() => !!props.description && !showError.value);
-		const hasHelper = computed(() => showError.value || showDescription.value);
-		const ariaDescribedBy = computed(() => {
-			if (showError.value) return errorMessageId.value;
-			if (showDescription.value) return descriptionId.value;
+		const { descriptionId, errorMessageId, showError, showDescription, hasHelper, ariaDescribedBy, hasLabel, showOutsideLabel, showInsideLabel, rootDataAttrs } = useFormField({
+			fieldId: () => fieldId.value,
+			label: () => props.label,
+			description: () => props.description,
+			errorMessage: () => props.errorMessage,
+			isInvalid: () => props.isInvalid,
+			isDisabled: () => props.isDisabled,
+			isReadOnly: () => props.isReadOnly,
+			isRequired: () => props.isRequired,
+			labelPlacement: () => props.labelPlacement
 		});
 		const fieldRef = ref(null);
 		const fieldEl = computed(() => {
@@ -206,24 +190,21 @@ var TimeRangeField_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 			hasLabel: hasLabel.value,
 			labelPlacement: props.labelPlacement
 		}));
-		const showOutsideLabel = computed(() => hasLabel.value && props.labelPlacement !== "inside");
-		const showInsideLabel = computed(() => hasLabel.value && props.labelPlacement === "inside");
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock("div", {
-				class: normalizeClass(unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base)),
-				"data-invalid": __props.isInvalid || void 0,
-				"data-disabled": __props.isDisabled || void 0,
-				"data-readonly": __props.isReadOnly || void 0,
-				"data-required": __props.isRequired || void 0,
-				"data-has-label": hasLabel.value || void 0,
-				"data-has-helper": hasHelper.value || void 0,
-				"data-slot": "time-range-field"
-			}, [showOutsideLabel.value ? (openBlock(), createElementBlock("label", {
+			return openBlock(), createElementBlock("div", mergeProps({ class: unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base) }, unref(rootDataAttrs), { "data-slot": "time-range-field" }), [unref(showOutsideLabel) ? (openBlock(), createBlock(FieldLabel_default, {
 				key: 0,
 				id: labelId.value,
 				for: fieldId.value,
+				label: __props.label,
+				"is-required": __props.isRequired,
 				class: normalizeClass(unref(composeClassName)(slotFns.value.label(), props.classNames?.label))
-			}, [createTextVNode(toDisplayString(__props.label), 1), __props.isRequired ? (openBlock(), createElementBlock("span", _hoisted_3, " *")) : createCommentVNode("", true)], 10, _hoisted_2)) : createCommentVNode("", true), createElementVNode("div", { class: normalizeClass(unref(composeClassName)(slotFns.value.mainWrapper(), props.classNames?.mainWrapper)) }, [createVNode(unref(TimeRangeFieldRoot), {
+			}, null, 8, [
+				"id",
+				"for",
+				"label",
+				"is-required",
+				"class"
+			])) : createCommentVNode("", true), createElementVNode("div", { class: normalizeClass(unref(composeClassName)(slotFns.value.mainWrapper(), props.classNames?.mainWrapper)) }, [createVNode(unref(TimeRangeFieldRoot), {
 				id: fieldId.value,
 				ref_key: "fieldRef",
 				ref: fieldRef,
@@ -246,12 +227,12 @@ var TimeRangeField_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				dir: __props.dir,
 				as: __props.as,
 				"as-child": __props.asChild,
-				"aria-labelledby": hasLabel.value ? labelId.value : void 0,
-				"aria-describedby": ariaDescribedBy.value,
+				"aria-labelledby": unref(hasLabel) ? labelId.value : void 0,
+				"aria-describedby": unref(ariaDescribedBy),
 				"aria-required": __props.isRequired || void 0,
 				"aria-invalid": __props.isInvalid || void 0,
 				class: normalizeClass(unref(composeClassName)(slotFns.value.inputWrapper(), props.classNames?.inputWrapper)),
-				"data-filled": hasLabel.value ? effectiveFilled.value || void 0 : void 0,
+				"data-filled": unref(hasLabel) ? effectiveFilled.value || void 0 : void 0,
 				"data-focused": isFocused.value || void 0,
 				"data-invalid": __props.isInvalid || void 0,
 				"data-disabled": __props.isDisabled || void 0,
@@ -259,12 +240,20 @@ var TimeRangeField_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				onMousedown: handleFieldMousedown
 			}, {
 				default: withCtx(({ segments }) => [
-					showInsideLabel.value ? (openBlock(), createElementBlock("label", {
+					unref(showInsideLabel) ? (openBlock(), createBlock(FieldLabel_default, {
 						key: 0,
 						id: labelId.value,
 						for: fieldId.value,
+						label: __props.label,
+						"is-required": __props.isRequired,
 						class: normalizeClass(unref(composeClassName)(slotFns.value.label(), props.classNames?.label))
-					}, [createTextVNode(toDisplayString(__props.label), 1), __props.isRequired ? (openBlock(), createElementBlock("span", _hoisted_5, " *")) : createCommentVNode("", true)], 10, _hoisted_4)) : createCommentVNode("", true),
+					}, null, 8, [
+						"id",
+						"for",
+						"label",
+						"is-required",
+						"class"
+					])) : createCommentVNode("", true),
 					_ctx.$slots.startContent ? (openBlock(), createElementBlock("span", {
 						key: 1,
 						class: normalizeClass(unref(composeClassName)(slotFns.value.startContent(), props.classNames?.startContent)),
@@ -342,19 +331,30 @@ var TimeRangeField_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				"data-invalid",
 				"data-disabled",
 				"data-readonly"
-			]), hasHelper.value ? (openBlock(), createElementBlock("div", {
-				key: 0,
-				class: normalizeClass(unref(composeClassName)(slotFns.value.helperWrapper(), props.classNames?.helperWrapper))
-			}, [showError.value ? (openBlock(), createElementBlock("div", {
-				key: 0,
-				id: errorMessageId.value,
-				class: normalizeClass(unref(composeClassName)(slotFns.value.errorMessage(), props.classNames?.errorMessage)),
-				role: "alert"
-			}, toDisplayString(__props.errorMessage), 11, _hoisted_6)) : showDescription.value ? (openBlock(), createElementBlock("div", {
-				key: 1,
-				id: descriptionId.value,
-				class: normalizeClass(unref(composeClassName)(slotFns.value.description(), props.classNames?.description))
-			}, toDisplayString(__props.description), 11, _hoisted_7)) : createCommentVNode("", true)], 2)) : createCommentVNode("", true)], 2)], 10, _hoisted_1);
+			]), createVNode(FormFieldHelper_default, {
+				"has-helper": unref(hasHelper),
+				"show-error": unref(showError),
+				"show-description": unref(showDescription),
+				"error-message": __props.errorMessage,
+				description: __props.description,
+				"error-message-id": unref(errorMessageId),
+				"description-id": unref(descriptionId),
+				"error-role": "alert",
+				"wrapper-class": unref(composeClassName)(slotFns.value.helperWrapper(), props.classNames?.helperWrapper),
+				"error-class": unref(composeClassName)(slotFns.value.errorMessage(), props.classNames?.errorMessage),
+				"description-class": unref(composeClassName)(slotFns.value.description(), props.classNames?.description)
+			}, null, 8, [
+				"has-helper",
+				"show-error",
+				"show-description",
+				"error-message",
+				"description",
+				"error-message-id",
+				"description-id",
+				"wrapper-class",
+				"error-class",
+				"description-class"
+			])], 2)], 16);
 		};
 	}
 });

package/dist/components/time-range-field/TimeRangeField.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeRangeField.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/time-range-field/TimeRangeField.vue"],"sourcesContent":["<!--\n  TimeRangeField — form-field mirror of DateRangeField.vue for a time range.\n\n  Same prop surface, data-attribute contract, floating-label behavior,\n  start/end content slots, and a11y wiring as DateRangeField. Renders TWO\n  segment lists (start + end) separated by a visible \"–\" glyph, using\n  @internationalized/date TimeValue instead of DateValue.\n-->\n<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref, useAttrs, useId, watch } from 'vue'\nimport { TimeRangeFieldRoot, TimeRangeFieldInput } from 'reka-ui'\nimport type { TimeValue } from 'reka-ui'\nimport { timeRangeFieldVariants, type TimeRangeFieldVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'flat',\n  size: 'md',\n  color: 'default',\n  labelPlacement: 'inside',\n  fullWidth: false,\n  isInvalid: false,\n  isDisabled: false,\n  isReadOnly: false,\n  isRequired: false,\n  granularity: 'minute',\n  hideTimeZone: false,\n})\n\nconst modelValue = defineModel<TimeRange | null | undefined>()\n\nexport interface TimeRange {\n  start: TimeValue\n  end: TimeValue\n}\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: TimeRangeFieldVariants['variant']\n  /** Field height. @default 'md' */\n  size?: TimeRangeFieldVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: TimeRangeFieldVariants['color']\n  /** Label placement relative to the field. @default 'inside' */\n  labelPlacement?: TimeRangeFieldVariants['labelPlacement']\n  /** Stretches root wrapper to 100% width. @default false */\n  fullWidth?: boolean\n  /** Marks the field as invalid. @default false */\n  isInvalid?: boolean\n  /** Disables the field. @default false */\n  isDisabled?: boolean\n  /** Makes the field read-only. @default false */\n  isReadOnly?: boolean\n  /** Adds a required asterisk next to the label. @default false */\n  isRequired?: boolean\n  /** Field label. When omitted, floating-label behavior is skipped. */\n  label?: string\n  /** Helper text below the field. Suppressed when isInvalid && errorMessage is shown. */\n  description?: string\n  /** Error text below the field. Only rendered when isInvalid is true. */\n  errorMessage?: string\n  /** Extra classes merged onto the root wrapper. */\n  class?: ClassValue\n  /** Per-slot class overrides. Merged with tailwind-variants styles. */\n  classNames?: Partial<{\n    base: ClassValue\n    label: ClassValue\n    mainWrapper: ClassValue\n    inputWrapper: ClassValue\n    startContent: ClassValue\n    segmentList: ClassValue\n    segment: ClassValue\n    separator: ClassValue\n    endContent: ClassValue\n    helperWrapper: ClassValue\n    errorMessage: ClassValue\n    description: ClassValue\n  }>\n\n  /* ─── TimeRangeField-specific ─────────────────────────────────── */\n  defaultValue?: TimeRange\n  defaultPlaceholder?: TimeValue\n  placeholderValue?: TimeValue\n  minValue?: TimeValue\n  maxValue?: TimeValue\n  granularity?: 'hour' | 'minute' | 'second'\n  hourCycle?: 12 | 24\n  /** Steps for segment keyboard navigation. */\n  step?: Partial<Record<'hour' | 'minute' | 'second' | 'millisecond', number>>\n  hideTimeZone?: boolean\n  locale?: string\n  name?: string\n  /** Marks the field as required for form submission. */\n  required?: boolean\n  /** Text direction for the field. */\n  dir?: 'ltr' | 'rtl'\n  /** Render root as a different element or component. */\n  as?: string\n  /** Render root child as root element. */\n  asChild?: boolean\n}\n\nconst attrs = useAttrs()\nconst generatedId = useId()\nconst fieldId = computed(() => (attrs.id as string | undefined) ?? `${generatedId}-field`)\nconst labelId = computed(() => `${generatedId}-label`)\nconst descriptionId = computed(() => `${generatedId}-description`)\nconst errorMessageId = computed(() => `${generatedId}-error`)\n\nconst hasLabel = computed(() => !!props.label)\nconst isFilled = computed(() => modelValue.value?.start != null || modelValue.value?.end != null)\n\nconst showError = computed(() => props.isInvalid && !!props.errorMessage)\nconst showDescription = computed(() => !!props.description && !showError.value)\nconst hasHelper = computed(() => showError.value || showDescription.value)\nconst ariaDescribedBy = computed(() => {\n  if (showError.value) return errorMessageId.value\n  if (showDescription.value) return descriptionId.value\n  return undefined\n})\n\nconst fieldRef = ref<HTMLElement | null>(null)\n// Reka components expose their root DOM node via $el — unwrap before using DOM APIs.\nconst fieldEl = computed<HTMLElement | null>(() => {\n  const r = fieldRef.value as unknown as { $el?: HTMLElement } | HTMLElement | null\n  if (!r) return null\n  if (r instanceof HTMLElement) return r\n  return r.$el ?? null\n})\n\n// `isFocused` tracks focus on a TIME SEGMENT specifically — not any descendant.\nconst isFocused = ref(false)\nfunction updateSegmentFocus() {\n  const root = fieldEl.value\n  if (!root) { isFocused.value = false; return }\n  const active = (root.ownerDocument ?? document).activeElement as HTMLElement | null\n  isFocused.value = !!active\n    && root.contains(active)\n    && active.hasAttribute('data-reka-time-field-segment')\n}\nfunction onDocFocusIn() { updateSegmentFocus() }\nfunction onDocFocusOut() { queueMicrotask(updateSegmentFocus) }\n\n// Guard against focus snap-back after an outside click.\nlet suppressSegmentFocusUntil = 0\nfunction onDocPointerDown(e: PointerEvent) {\n  const root = fieldEl.value\n  if (!root) return\n  const target = e.target as Node | null\n  if (!target || root.contains(target)) return\n  suppressSegmentFocusUntil = performance.now() + 250\n  const active = (root.ownerDocument ?? document).activeElement as HTMLElement | null\n  if (active && root.contains(active) && active.hasAttribute('data-reka-time-field-segment')) {\n    active.blur()\n  }\n}\nfunction onDocFocusInGuard(e: FocusEvent) {\n  if (performance.now() >= suppressSegmentFocusUntil) return\n  const root = fieldEl.value\n  if (!root) return\n  const t = e.target as HTMLElement | null\n  if (t && root.contains(t) && t.hasAttribute?.('data-reka-time-field-segment')) {\n    t.blur()\n  }\n}\n\nonMounted(() => {\n  document.addEventListener('focusin', onDocFocusIn)\n  document.addEventListener('focusout', onDocFocusOut)\n  document.addEventListener('pointerdown', onDocPointerDown, true)\n  document.addEventListener('focusin', onDocFocusInGuard, true)\n})\nonBeforeUnmount(() => {\n  document.removeEventListener('focusin', onDocFocusIn)\n  document.removeEventListener('focusout', onDocFocusOut)\n  document.removeEventListener('pointerdown', onDocPointerDown, true)\n  document.removeEventListener('focusin', onDocFocusInGuard, true)\n})\n\n// Track data-filled by sniffing rendered segments across BOTH segment lists.\nconst segmentsFilled = ref(false)\nfunction recomputeFilled() {\n  const root = fieldEl.value\n  if (!root || typeof root.querySelectorAll !== 'function') {\n    segmentsFilled.value = false\n    return\n  }\n  const segs = root.querySelectorAll('[data-reka-time-field-segment]:not([data-reka-time-field-segment=\"literal\"])')\n  let anyFilled = false\n  segs.forEach((el) => {\n    if ((el as HTMLElement).dataset.placeholder === 'false') anyFilled = true\n  })\n  segmentsFilled.value = anyFilled\n}\nwatch([modelValue, () => props.defaultValue, () => props.granularity, () => props.hourCycle], () => {\n  queueMicrotask(recomputeFilled)\n}, { immediate: true })\n\nconst effectiveFilled = computed(() => isFilled.value || segmentsFilled.value)\n\nfunction handleFieldMousedown(e: MouseEvent) {\n  const target = e.target as HTMLElement | null\n  if (!target) return\n  if (target.closest('[data-reka-time-field-segment]')) return\n  if (target.closest('[data-slot=\"start-content\"]')) return\n  if (target.closest('[data-slot=\"end-content\"]')) return\n  if (target.closest('button, [role=\"button\"]')) return\n  const root = fieldEl.value\n  if (!root) return\n  const active = (root.ownerDocument ?? document).activeElement as HTMLElement | null\n  if (active && root.contains(active) && active.hasAttribute('data-reka-time-field-segment')) {\n    return\n  }\n  const first = root.querySelector<HTMLElement>(\n    '[data-reka-time-field-segment]:not([data-reka-time-field-segment=\"literal\"])',\n  )\n  if (first) {\n    e.preventDefault()\n    first.focus()\n  }\n}\n\nconst slotFns = computed(() =>\n  timeRangeFieldVariants({\n    variant: props.variant,\n    size: props.size,\n    color: props.color,\n    fullWidth: props.fullWidth,\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    isReadonly: props.isReadOnly,\n    hasLabel: hasLabel.value,\n    labelPlacement: props.labelPlacement,\n  }),\n)\n\nconst showOutsideLabel = computed(\n  () => hasLabel.value && props.labelPlacement !== 'inside',\n)\nconst showInsideLabel = computed(\n  () => hasLabel.value && props.labelPlacement === 'inside',\n)\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    :data-invalid=\"isInvalid || undefined\"\n    :data-disabled=\"isDisabled || undefined\"\n    :data-readonly=\"isReadOnly || undefined\"\n    :data-required=\"isRequired || undefined\"\n    :data-has-label=\"hasLabel || undefined\"\n    :data-has-helper=\"hasHelper || undefined\"\n    data-slot=\"time-range-field\"\n  >\n    <label\n      v-if=\"showOutsideLabel\"\n      :id=\"labelId\"\n      :for=\"fieldId\"\n      :class=\"composeClassName(slotFns.label(), props.classNames?.label)\"\n    >{{ label }}<span\n      v-if=\"isRequired\"\n      aria-hidden=\"true\"\n    > *</span></label>\n\n    <div :class=\"composeClassName(slotFns.mainWrapper(), props.classNames?.mainWrapper)\">\n      <TimeRangeFieldRoot\n        :id=\"fieldId\"\n        ref=\"fieldRef\"\n        v-model=\"modelValue\"\n        :default-value=\"defaultValue\"\n        :default-placeholder=\"defaultPlaceholder\"\n        :placeholder=\"placeholderValue\"\n        :min-value=\"minValue\"\n        :max-value=\"maxValue\"\n        :granularity=\"granularity\"\n        :hour-cycle=\"hourCycle\"\n        :step=\"step\"\n        :locale=\"locale\"\n        :disabled=\"isDisabled\"\n        :readonly=\"isReadOnly\"\n        :name=\"name\"\n        :hide-time-zone=\"hideTimeZone\"\n        :required=\"required\"\n        :dir=\"dir\"\n        :as=\"as\"\n        :as-child=\"asChild\"\n        :aria-labelledby=\"hasLabel ? labelId : undefined\"\n        :aria-describedby=\"ariaDescribedBy\"\n        :aria-required=\"isRequired || undefined\"\n        :aria-invalid=\"isInvalid || undefined\"\n        :class=\"composeClassName(slotFns.inputWrapper(), props.classNames?.inputWrapper)\"\n        :data-filled=\"hasLabel ? (effectiveFilled || undefined) : undefined\"\n        :data-focused=\"isFocused || undefined\"\n        :data-invalid=\"isInvalid || undefined\"\n        :data-disabled=\"isDisabled || undefined\"\n        :data-readonly=\"isReadOnly || undefined\"\n        @mousedown=\"handleFieldMousedown\"\n      >\n        <template #default=\"{ segments }\">\n          <label\n            v-if=\"showInsideLabel\"\n            :id=\"labelId\"\n            :for=\"fieldId\"\n            :class=\"composeClassName(slotFns.label(), props.classNames?.label)\"\n          >{{ label }}<span\n            v-if=\"isRequired\"\n            aria-hidden=\"true\"\n          > *</span></label>\n\n          <span\n            v-if=\"$slots.startContent\"\n            :class=\"composeClassName(slotFns.startContent(), props.classNames?.startContent)\"\n            data-slot=\"start-content\"\n          >\n            <slot name=\"startContent\" />\n          </span>\n\n          <div\n            :class=\"composeClassName(slotFns.segmentList(), props.classNames?.segmentList)\"\n            data-slot=\"segment-list\"\n            data-type=\"start\"\n          >\n            <template\n              v-for=\"(segment, _i) in segments.start\"\n              :key=\"`start-${_i}`\"\n            >\n              <TimeRangeFieldInput\n                :part=\"segment.part\"\n                type=\"start\"\n                :class=\"composeClassName(slotFns.segment(), props.classNames?.segment)\"\n              >\n                {{ segment.value }}\n              </TimeRangeFieldInput>\n            </template>\n          </div>\n\n          <span\n            :class=\"composeClassName(slotFns.separator(), props.classNames?.separator)\"\n            aria-hidden=\"true\"\n            data-slot=\"separator\"\n          >–</span>\n\n          <div\n            :class=\"composeClassName(slotFns.segmentList(), props.classNames?.segmentList)\"\n            data-slot=\"segment-list\"\n            data-type=\"end\"\n          >\n            <template\n              v-for=\"(segment, _i) in segments.end\"\n              :key=\"`end-${_i}`\"\n            >\n              <TimeRangeFieldInput\n                :part=\"segment.part\"\n                type=\"end\"\n                :class=\"composeClassName(slotFns.segment(), props.classNames?.segment)\"\n              >\n                {{ segment.value }}\n              </TimeRangeFieldInput>\n            </template>\n          </div>\n\n          <span\n            v-if=\"$slots.endContent\"\n            :class=\"composeClassName(slotFns.endContent(), props.classNames?.endContent)\"\n            data-slot=\"end-content\"\n          >\n            <slot name=\"endContent\" />\n          </span>\n        </template>\n      </TimeRangeFieldRoot>\n\n      <div\n        v-if=\"hasHelper\"\n        :class=\"composeClassName(slotFns.helperWrapper(), props.classNames?.helperWrapper)\"\n      >\n        <div\n          v-if=\"showError\"\n          :id=\"errorMessageId\"\n          :class=\"composeClassName(slotFns.errorMessage(), props.classNames?.errorMessage)\"\n          role=\"alert\"\n        >\n          {{ errorMessage }}\n        </div>\n        <div\n          v-else-if=\"showDescription\"\n          :id=\"descriptionId\"\n          :class=\"composeClassName(slotFns.description(), props.classNames?.description)\"\n        >\n          {{ description }}\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"TimeRangeField.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/time-range-field/TimeRangeField.vue"],"sourcesContent":["<!--\n  TimeRangeField — form-field mirror of DateRangeField.vue for a time range.\n\n  Same prop surface, data-attribute contract, floating-label behavior,\n  start/end content slots, and a11y wiring as DateRangeField. Renders TWO\n  segment lists (start + end) separated by a visible \"–\" glyph, using\n  @internationalized/date TimeValue instead of DateValue.\n-->\n<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref, useAttrs, useId, watch } from 'vue'\nimport { TimeRangeFieldRoot, TimeRangeFieldInput } from 'reka-ui'\nimport type { TimeValue } from 'reka-ui'\nimport { timeRangeFieldVariants, type TimeRangeFieldVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useFormField } from '../../composables/useFormField'\nimport FieldLabel from '../_shared/FieldLabel.vue'\nimport FormFieldHelper from '../_shared/FormFieldHelper.vue'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'flat',\n  size: 'md',\n  color: 'default',\n  labelPlacement: 'inside',\n  fullWidth: false,\n  isInvalid: false,\n  isDisabled: false,\n  isReadOnly: false,\n  isRequired: false,\n  granularity: 'minute',\n  hideTimeZone: false,\n})\n\nconst modelValue = defineModel<TimeRange | null | undefined>()\n\nexport interface TimeRange {\n  start: TimeValue\n  end: TimeValue\n}\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: TimeRangeFieldVariants['variant']\n  /** Field height. @default 'md' */\n  size?: TimeRangeFieldVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: TimeRangeFieldVariants['color']\n  /** Label placement relative to the field. @default 'inside' */\n  labelPlacement?: TimeRangeFieldVariants['labelPlacement']\n  /** Stretches root wrapper to 100% width. @default false */\n  fullWidth?: boolean\n  /** Marks the field as invalid. @default false */\n  isInvalid?: boolean\n  /** Disables the field. @default false */\n  isDisabled?: boolean\n  /** Makes the field read-only. @default false */\n  isReadOnly?: boolean\n  /** Adds a required asterisk next to the label. @default false */\n  isRequired?: boolean\n  /** Field label. When omitted, floating-label behavior is skipped. */\n  label?: string\n  /** Helper text below the field. Suppressed when isInvalid && errorMessage is shown. */\n  description?: string\n  /** Error text below the field. Only rendered when isInvalid is true. */\n  errorMessage?: string\n  /** Extra classes merged onto the root wrapper. */\n  class?: ClassValue\n  /** Per-slot class overrides. Merged with tailwind-variants styles. */\n  classNames?: Partial<{\n    base: ClassValue\n    label: ClassValue\n    mainWrapper: ClassValue\n    inputWrapper: ClassValue\n    startContent: ClassValue\n    segmentList: ClassValue\n    segment: ClassValue\n    separator: ClassValue\n    endContent: ClassValue\n    helperWrapper: ClassValue\n    errorMessage: ClassValue\n    description: ClassValue\n  }>\n\n  /* ─── TimeRangeField-specific ─────────────────────────────────── */\n  defaultValue?: TimeRange\n  defaultPlaceholder?: TimeValue\n  placeholderValue?: TimeValue\n  minValue?: TimeValue\n  maxValue?: TimeValue\n  granularity?: 'hour' | 'minute' | 'second'\n  hourCycle?: 12 | 24\n  /** Steps for segment keyboard navigation. */\n  step?: Partial<Record<'hour' | 'minute' | 'second' | 'millisecond', number>>\n  hideTimeZone?: boolean\n  locale?: string\n  name?: string\n  /** Marks the field as required for form submission. */\n  required?: boolean\n  /** Text direction for the field. */\n  dir?: 'ltr' | 'rtl'\n  /** Render root as a different element or component. */\n  as?: string\n  /** Render root child as root element. */\n  asChild?: boolean\n}\n\nconst attrs = useAttrs()\nconst generatedId = useId()\nconst fieldId = computed(() => (attrs.id as string | undefined) ?? `${generatedId}-field`)\nconst labelId = computed(() => `${generatedId}-label`)\n\nconst isFilled = computed(() => modelValue.value?.start != null || modelValue.value?.end != null)\n\nconst {\n  descriptionId,\n  errorMessageId,\n  showError,\n  showDescription,\n  hasHelper,\n  ariaDescribedBy,\n  hasLabel,\n  showOutsideLabel,\n  showInsideLabel,\n  rootDataAttrs,\n} = useFormField({\n  fieldId: () => fieldId.value,\n  label: () => props.label,\n  description: () => props.description,\n  errorMessage: () => props.errorMessage,\n  isInvalid: () => props.isInvalid,\n  isDisabled: () => props.isDisabled,\n  isReadOnly: () => props.isReadOnly,\n  isRequired: () => props.isRequired,\n  labelPlacement: () => props.labelPlacement,\n})\n\nconst fieldRef = ref<HTMLElement | null>(null)\n// Reka components expose their root DOM node via $el — unwrap before using DOM APIs.\nconst fieldEl = computed<HTMLElement | null>(() => {\n  const r = fieldRef.value as unknown as { $el?: HTMLElement } | HTMLElement | null\n  if (!r) return null\n  if (r instanceof HTMLElement) return r\n  return r.$el ?? null\n})\n\n// `isFocused` tracks focus on a TIME SEGMENT specifically — not any descendant.\nconst isFocused = ref(false)\nfunction updateSegmentFocus() {\n  const root = fieldEl.value\n  if (!root) { isFocused.value = false; return }\n  const active = (root.ownerDocument ?? document).activeElement as HTMLElement | null\n  isFocused.value = !!active\n    && root.contains(active)\n    && active.hasAttribute('data-reka-time-field-segment')\n}\nfunction onDocFocusIn() { updateSegmentFocus() }\nfunction onDocFocusOut() { queueMicrotask(updateSegmentFocus) }\n\n// Guard against focus snap-back after an outside click.\nlet suppressSegmentFocusUntil = 0\nfunction onDocPointerDown(e: PointerEvent) {\n  const root = fieldEl.value\n  if (!root) return\n  const target = e.target as Node | null\n  if (!target || root.contains(target)) return\n  suppressSegmentFocusUntil = performance.now() + 250\n  const active = (root.ownerDocument ?? document).activeElement as HTMLElement | null\n  if (active && root.contains(active) && active.hasAttribute('data-reka-time-field-segment')) {\n    active.blur()\n  }\n}\nfunction onDocFocusInGuard(e: FocusEvent) {\n  if (performance.now() >= suppressSegmentFocusUntil) return\n  const root = fieldEl.value\n  if (!root) return\n  const t = e.target as HTMLElement | null\n  if (t && root.contains(t) && t.hasAttribute?.('data-reka-time-field-segment')) {\n    t.blur()\n  }\n}\n\nonMounted(() => {\n  document.addEventListener('focusin', onDocFocusIn)\n  document.addEventListener('focusout', onDocFocusOut)\n  document.addEventListener('pointerdown', onDocPointerDown, true)\n  document.addEventListener('focusin', onDocFocusInGuard, true)\n})\nonBeforeUnmount(() => {\n  document.removeEventListener('focusin', onDocFocusIn)\n  document.removeEventListener('focusout', onDocFocusOut)\n  document.removeEventListener('pointerdown', onDocPointerDown, true)\n  document.removeEventListener('focusin', onDocFocusInGuard, true)\n})\n\n// Track data-filled by sniffing rendered segments across BOTH segment lists.\nconst segmentsFilled = ref(false)\nfunction recomputeFilled() {\n  const root = fieldEl.value\n  if (!root || typeof root.querySelectorAll !== 'function') {\n    segmentsFilled.value = false\n    return\n  }\n  const segs = root.querySelectorAll('[data-reka-time-field-segment]:not([data-reka-time-field-segment=\"literal\"])')\n  let anyFilled = false\n  segs.forEach((el) => {\n    if ((el as HTMLElement).dataset.placeholder === 'false') anyFilled = true\n  })\n  segmentsFilled.value = anyFilled\n}\nwatch([modelValue, () => props.defaultValue, () => props.granularity, () => props.hourCycle], () => {\n  queueMicrotask(recomputeFilled)\n}, { immediate: true })\n\nconst effectiveFilled = computed(() => isFilled.value || segmentsFilled.value)\n\nfunction handleFieldMousedown(e: MouseEvent) {\n  const target = e.target as HTMLElement | null\n  if (!target) return\n  if (target.closest('[data-reka-time-field-segment]')) return\n  if (target.closest('[data-slot=\"start-content\"]')) return\n  if (target.closest('[data-slot=\"end-content\"]')) return\n  if (target.closest('button, [role=\"button\"]')) return\n  const root = fieldEl.value\n  if (!root) return\n  const active = (root.ownerDocument ?? document).activeElement as HTMLElement | null\n  if (active && root.contains(active) && active.hasAttribute('data-reka-time-field-segment')) {\n    return\n  }\n  const first = root.querySelector<HTMLElement>(\n    '[data-reka-time-field-segment]:not([data-reka-time-field-segment=\"literal\"])',\n  )\n  if (first) {\n    e.preventDefault()\n    first.focus()\n  }\n}\n\nconst slotFns = computed(() =>\n  timeRangeFieldVariants({\n    variant: props.variant,\n    size: props.size,\n    color: props.color,\n    fullWidth: props.fullWidth,\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    isReadonly: props.isReadOnly,\n    hasLabel: hasLabel.value,\n    labelPlacement: props.labelPlacement,\n  }),\n)\n</script>\n\n<template>\n  <div\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    v-bind=\"rootDataAttrs\"\n    data-slot=\"time-range-field\"\n  >\n    <FieldLabel\n      v-if=\"showOutsideLabel\"\n      :id=\"labelId\"\n      :for=\"fieldId\"\n      :label=\"label\"\n      :is-required=\"isRequired\"\n      :class=\"composeClassName(slotFns.label(), props.classNames?.label)\"\n    />\n\n    <div :class=\"composeClassName(slotFns.mainWrapper(), props.classNames?.mainWrapper)\">\n      <TimeRangeFieldRoot\n        :id=\"fieldId\"\n        ref=\"fieldRef\"\n        v-model=\"modelValue\"\n        :default-value=\"defaultValue\"\n        :default-placeholder=\"defaultPlaceholder\"\n        :placeholder=\"placeholderValue\"\n        :min-value=\"minValue\"\n        :max-value=\"maxValue\"\n        :granularity=\"granularity\"\n        :hour-cycle=\"hourCycle\"\n        :step=\"step\"\n        :locale=\"locale\"\n        :disabled=\"isDisabled\"\n        :readonly=\"isReadOnly\"\n        :name=\"name\"\n        :hide-time-zone=\"hideTimeZone\"\n        :required=\"required\"\n        :dir=\"dir\"\n        :as=\"as\"\n        :as-child=\"asChild\"\n        :aria-labelledby=\"hasLabel ? labelId : undefined\"\n        :aria-describedby=\"ariaDescribedBy\"\n        :aria-required=\"isRequired || undefined\"\n        :aria-invalid=\"isInvalid || undefined\"\n        :class=\"composeClassName(slotFns.inputWrapper(), props.classNames?.inputWrapper)\"\n        :data-filled=\"hasLabel ? (effectiveFilled || undefined) : undefined\"\n        :data-focused=\"isFocused || undefined\"\n        :data-invalid=\"isInvalid || undefined\"\n        :data-disabled=\"isDisabled || undefined\"\n        :data-readonly=\"isReadOnly || undefined\"\n        @mousedown=\"handleFieldMousedown\"\n      >\n        <template #default=\"{ segments }\">\n          <FieldLabel\n            v-if=\"showInsideLabel\"\n            :id=\"labelId\"\n            :for=\"fieldId\"\n            :label=\"label\"\n            :is-required=\"isRequired\"\n            :class=\"composeClassName(slotFns.label(), props.classNames?.label)\"\n          />\n\n          <span\n            v-if=\"$slots.startContent\"\n            :class=\"composeClassName(slotFns.startContent(), props.classNames?.startContent)\"\n            data-slot=\"start-content\"\n          >\n            <slot name=\"startContent\" />\n          </span>\n\n          <div\n            :class=\"composeClassName(slotFns.segmentList(), props.classNames?.segmentList)\"\n            data-slot=\"segment-list\"\n            data-type=\"start\"\n          >\n            <template\n              v-for=\"(segment, _i) in segments.start\"\n              :key=\"`start-${_i}`\"\n            >\n              <TimeRangeFieldInput\n                :part=\"segment.part\"\n                type=\"start\"\n                :class=\"composeClassName(slotFns.segment(), props.classNames?.segment)\"\n              >\n                {{ segment.value }}\n              </TimeRangeFieldInput>\n            </template>\n          </div>\n\n          <span\n            :class=\"composeClassName(slotFns.separator(), props.classNames?.separator)\"\n            aria-hidden=\"true\"\n            data-slot=\"separator\"\n          >–</span>\n\n          <div\n            :class=\"composeClassName(slotFns.segmentList(), props.classNames?.segmentList)\"\n            data-slot=\"segment-list\"\n            data-type=\"end\"\n          >\n            <template\n              v-for=\"(segment, _i) in segments.end\"\n              :key=\"`end-${_i}`\"\n            >\n              <TimeRangeFieldInput\n                :part=\"segment.part\"\n                type=\"end\"\n                :class=\"composeClassName(slotFns.segment(), props.classNames?.segment)\"\n              >\n                {{ segment.value }}\n              </TimeRangeFieldInput>\n            </template>\n          </div>\n\n          <span\n            v-if=\"$slots.endContent\"\n            :class=\"composeClassName(slotFns.endContent(), props.classNames?.endContent)\"\n            data-slot=\"end-content\"\n          >\n            <slot name=\"endContent\" />\n          </span>\n        </template>\n      </TimeRangeFieldRoot>\n\n      <FormFieldHelper\n        :has-helper=\"hasHelper\"\n        :show-error=\"showError\"\n        :show-description=\"showDescription\"\n        :error-message=\"errorMessage\"\n        :description=\"description\"\n        :error-message-id=\"errorMessageId\"\n        :description-id=\"descriptionId\"\n        error-role=\"alert\"\n        :wrapper-class=\"composeClassName(slotFns.helperWrapper(), props.classNames?.helperWrapper)\"\n        :error-class=\"composeClassName(slotFns.errorMessage(), props.classNames?.errorMessage)\"\n        :description-class=\"composeClassName(slotFns.description(), props.classNames?.description)\"\n      />\n    </div>\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/components/toolbar/ToolbarButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarButton.js","names":[],"sources":["../../../src/components/toolbar/ToolbarButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarButton as RekaToolbarButton } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  disabled?: boolean\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarButton\n    :disabled=\"props.disabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarButton>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToolbarButton.js","names":[],"sources":["../../../src/components/toolbar/ToolbarButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarButton as RekaToolbarButton } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\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  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  isDisabled: undefined,\n  disabled: undefined,\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ToolbarButton', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarButton\n    :disabled=\"isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarButton>\n</template>\n"],"mappings":""}

package/dist/components/toolbar/ToolbarButton.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 { computed, createBlock, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
 import { toggleButtonVariants } from "@auronui/styles";
 import { ToolbarButton } from "reka-ui";
@@ -9,13 +10,21 @@ var ToolbarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		variant: {},
 		size: {},
 		isIconOnly: { type: Boolean },
-		disabled: { type: Boolean },
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
 		class: {},
 		as: {},
 		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;
+		const isDisabled = useDeprecatedBooleanProp("ToolbarButton", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
 		const classes = computed(() => toggleButtonVariants({
 			variant: props.variant ?? "ghost",
 			size: props.size ?? "md",
@@ -23,7 +32,7 @@ var ToolbarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		}));
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(ToolbarButton), {
-				disabled: props.disabled,
+				disabled: unref(isDisabled),
 				as: props.as,
 				"as-child": props.asChild,
 				class: normalizeClass(unref(composeClassName)(classes.value, props.class))

package/dist/components/toolbar/ToolbarButton.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarButton.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarButton as RekaToolbarButton } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  disabled?: boolean\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarButton\n    :disabled=\"props.disabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarButton>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAYd,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,MAAM,WAAW;GAC1B,MAAM,MAAM,QAAQ;GACpB,YAAY,MAAM,cAAc;GACjC,CAAA,CACH;;uBAIE,YAOoB,MAAA,cAAA,EAAA;IANjB,UAAU,MAAM;IAChB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;;2BAErC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToolbarButton.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarButton.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarButton as RekaToolbarButton } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\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  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  isDisabled: undefined,\n  disabled: undefined,\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ToolbarButton', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarButton\n    :disabled=\"isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarButton>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;EAiBd,MAAM,aAAa,yBACjB,iBAAiB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SACjF;EAEA,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,MAAM,WAAW;GAC1B,MAAM,MAAM,QAAQ;GACpB,YAAY,MAAM,cAAc;GACjC,CAAA,CACH;;uBAIE,YAOoB,MAAA,cAAA,EAAA;IANjB,UAAU,MAAA,WAAU;IACpB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;;2BAErC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/toolbar/ToolbarToggleGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleGroup.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\nimport ToolbarToggleItem from './ToolbarToggleItem.vue'\n\ntype Single = string\ntype Multi = string[]\ntype ToolbarToggleShorthandItem = { value: string; label?: string; variant?: ToggleButtonVariants['variant']; size?: ToggleButtonVariants['size']; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n  /** Shorthand API: render toggle items from an array instead of the compound slot API */\n  items?: ToolbarToggleShorthandItem[]\n  /** Whether to use roving focus for keyboard navigation */\n  rovingFocus?: boolean\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Whether keyboard navigation loops around */\n  loop?: boolean\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n  /** Form field name */\n  name?: string\n  /** Whether a value is required */\n  required?: boolean\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :roving-focus=\"props.rovingFocus\"\n    :dir=\"props.dir\"\n    :loop=\"props.loop\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :name=\"props.name\"\n    :required=\"props.required\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <template v-if=\"props.items\">\n      <ToolbarToggleItem\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n        :variant=\"item.variant\"\n        :size=\"item.size\"\n        :is-icon-only=\"item.isIconOnly\"\n        :disabled=\"item.disabled\"\n        :class=\"item.class\"\n      >{{ item.label }}</ToolbarToggleItem>\n    </template>\n    <slot v-else />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToolbarToggleGroup.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\nimport ToolbarToggleItem from './ToolbarToggleItem.vue'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\ntype Single = string\ntype Multi = string[]\ntype ToolbarToggleShorthandItem = { value: string; label?: string; variant?: ToggleButtonVariants['variant']; size?: ToggleButtonVariants['size']; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = withDefaults(defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n  /** Shorthand API: render toggle items from an array instead of the compound slot API */\n  items?: ToolbarToggleShorthandItem[]\n  /** Whether to use roving focus for keyboard navigation */\n  rovingFocus?: boolean\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Whether keyboard navigation loops around */\n  loop?: boolean\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n  /** Form field name */\n  name?: string\n  isRequired?: boolean\n  /**\n   * Whether a value is required\n   * @deprecated Use isRequired instead.\n   */\n  required?: boolean\n}>(), {\n  isDisabled: undefined,\n  disabled: undefined,\n  isRequired: undefined,\n  required: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ToolbarToggleGroup', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst isRequired = useDeprecatedBooleanProp(\n  'ToolbarToggleGroup', 'isRequired', () => props.isRequired, 'required', () => props.required,\n)\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"isDisabled\"\n    :roving-focus=\"props.rovingFocus\"\n    :dir=\"props.dir\"\n    :loop=\"props.loop\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :name=\"props.name\"\n    :required=\"isRequired\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <template v-if=\"props.items\">\n      <ToolbarToggleItem\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n        :variant=\"item.variant\"\n        :size=\"item.size\"\n        :is-icon-only=\"item.isIconOnly\"\n        :is-disabled=\"item.disabled\"\n        :class=\"item.class\"\n      >{{ item.label }}</ToolbarToggleItem>\n    </template>\n    <slot v-else />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":""}

package/dist/components/toolbar/ToolbarToggleGroup.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 { useToolbarInject } from "./toolbar.context.js";
 import ToolbarToggleItem_default from "./ToolbarToggleItem.js";
 import { Fragment, computed, createBlock, createElementBlock, createTextVNode, defineComponent, normalizeClass, openBlock, renderList, renderSlot, toDisplayString, unref, withCtx } from "vue";
@@ -11,7 +12,14 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 		type: {},
 		modelValue: {},
 		defaultValue: {},
-		disabled: { type: Boolean },
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
 		orientation: {},
 		isDetached: { type: Boolean },
 		class: {},
@@ -22,12 +30,21 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 		as: {},
 		asChild: { type: Boolean },
 		name: {},
-		required: { type: Boolean }
+		isRequired: {
+			type: Boolean,
+			default: void 0
+		},
+		required: {
+			type: Boolean,
+			default: void 0
+		}
 	},
 	emits: ["update:modelValue"],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
+		const isDisabled = useDeprecatedBooleanProp("ToolbarToggleGroup", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
+		const isRequired = useDeprecatedBooleanProp("ToolbarToggleGroup", "isRequired", () => props.isRequired, "required", () => props.required);
 		const ctx = useToolbarInject({ orientation: computed(() => "horizontal") });
 		const orientation = computed(() => props.orientation ?? ctx.orientation.value);
 		const classes = computed(() => toggleButtonGroupVariants({
@@ -39,14 +56,14 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 				type: props.type,
 				"model-value": props.modelValue,
 				"default-value": props.defaultValue,
-				disabled: props.disabled,
+				disabled: unref(isDisabled),
 				"roving-focus": props.rovingFocus,
 				dir: props.dir,
 				loop: props.loop,
 				as: props.as,
 				"as-child": props.asChild,
 				name: props.name,
-				required: props.required,
+				required: unref(isRequired),
 				class: normalizeClass(unref(composeClassName)(classes.value, props.class)),
 				"onUpdate:modelValue": _cache[0] || (_cache[0] = (v) => emit("update:modelValue", v))
 			}, {
@@ -57,7 +74,7 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 						variant: item.variant,
 						size: item.size,
 						"is-icon-only": item.isIconOnly,
-						disabled: item.disabled,
+						"is-disabled": item.disabled,
 						class: normalizeClass(item.class)
 					}, {
 						default: withCtx(() => [createTextVNode(toDisplayString(item.label), 1)]),
@@ -67,7 +84,7 @@ var ToolbarToggleGroup_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 						"variant",
 						"size",
 						"is-icon-only",
-						"disabled",
+						"is-disabled",
 						"class"
 					]);
 				}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),

package/dist/components/toolbar/ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\nimport ToolbarToggleItem from './ToolbarToggleItem.vue'\n\ntype Single = string\ntype Multi = string[]\ntype ToolbarToggleShorthandItem = { value: string; label?: string; variant?: ToggleButtonVariants['variant']; size?: ToggleButtonVariants['size']; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n  /** Shorthand API: render toggle items from an array instead of the compound slot API */\n  items?: ToolbarToggleShorthandItem[]\n  /** Whether to use roving focus for keyboard navigation */\n  rovingFocus?: boolean\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Whether keyboard navigation loops around */\n  loop?: boolean\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n  /** Form field name */\n  name?: string\n  /** Whether a value is required */\n  required?: boolean\n}>()\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"props.disabled\"\n    :roving-focus=\"props.rovingFocus\"\n    :dir=\"props.dir\"\n    :loop=\"props.loop\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :name=\"props.name\"\n    :required=\"props.required\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <template v-if=\"props.items\">\n      <ToolbarToggleItem\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n        :variant=\"item.variant\"\n        :size=\"item.size\"\n        :is-icon-only=\"item.isIconOnly\"\n        :disabled=\"item.disabled\"\n        :class=\"item.class\"\n      >{{ item.label }}</ToolbarToggleItem>\n    </template>\n    <slot v-else />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;EAYA,MAAM,QAAQ;EA0Bd,MAAM,OAAO;EAIb,MAAM,MAAM,iBAAiB,EAAE,aAAa,eAAe,aAAsB,EAAE,CAAA;EACnF,MAAM,cAAc,eAAe,MAAM,eAAe,IAAI,YAAY,MAAK;EAE7E,MAAM,UAAU,eACd,0BAA0B;GAAE,aAAa,YAAY;GAAO,YAAY,MAAM,cAAc;GAAO,CAAC,CAAC,MAAK,CAC5G;;uBAIE,YA4ByB,MAAA,mBAAA,EAAA;IA3BtB,MAAM,MAAM;IACZ,eAAa,MAAM;IACnB,iBAAe,MAAM;IACrB,UAAU,MAAM;IAChB,gBAAc,MAAM;IACpB,KAAK,MAAM;IACX,MAAM,MAAM;IACZ,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,MAAM,MAAM;IACZ,UAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;IAC5C,uBAAkB,OAAA,OAAA,OAAA,MAAG,MAAM,KAAI,qBAAsB,EAAC;;2BAa5C,CAXK,MAAM,SAAA,UAAA,KAAA,EACpB,mBASqC,UAAA,EAAA,KAAA,GAAA,EAAA,WARpB,MAAM,QAAd,SAAI;yBADb,YASqC,2BAAA;MAPlC,KAAK,KAAK;MACV,OAAO,KAAK;MACZ,SAAS,KAAK;MACd,MAAM,KAAK;MACX,gBAAc,KAAK;MACnB,UAAU,KAAK;MACf,OAAK,eAAE,KAAK,MAAK;;6BACH,CAAA,gBAAA,gBAAb,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;;;;gBAEhB,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"ToolbarToggleGroup.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleGroup.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleGroup as RekaToolbarToggleGroup } from 'reka-ui'\nimport { toggleButtonGroupVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarInject } from './toolbar.context'\nimport ToolbarToggleItem from './ToolbarToggleItem.vue'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\ntype Single = string\ntype Multi = string[]\ntype ToolbarToggleShorthandItem = { value: string; label?: string; variant?: ToggleButtonVariants['variant']; size?: ToggleButtonVariants['size']; isIconOnly?: boolean; disabled?: boolean; class?: string }\n\nconst props = withDefaults(defineProps<{\n  type: 'single' | 'multiple'\n  modelValue?: Single | Multi\n  defaultValue?: Single | Multi\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  orientation?: 'horizontal' | 'vertical'\n  isDetached?: boolean\n  class?: string\n  /** Shorthand API: render toggle items from an array instead of the compound slot API */\n  items?: ToolbarToggleShorthandItem[]\n  /** Whether to use roving focus for keyboard navigation */\n  rovingFocus?: boolean\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Whether keyboard navigation loops around */\n  loop?: boolean\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n  /** Form field name */\n  name?: string\n  isRequired?: boolean\n  /**\n   * Whether a value is required\n   * @deprecated Use isRequired instead.\n   */\n  required?: boolean\n}>(), {\n  isDisabled: undefined,\n  disabled: undefined,\n  isRequired: undefined,\n  required: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: Single | Multi]\n}>()\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ToolbarToggleGroup', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst isRequired = useDeprecatedBooleanProp(\n  'ToolbarToggleGroup', 'isRequired', () => props.isRequired, 'required', () => props.required,\n)\n\nconst ctx = useToolbarInject({ orientation: computed(() => 'horizontal' as const) })\nconst orientation = computed(() => props.orientation ?? ctx.orientation.value)\n\nconst classes = computed(() =>\n  toggleButtonGroupVariants({ orientation: orientation.value, isDetached: props.isDetached ?? false }).base()\n)\n</script>\n\n<template>\n  <RekaToolbarToggleGroup\n    :type=\"props.type\"\n    :model-value=\"props.modelValue\"\n    :default-value=\"props.defaultValue\"\n    :disabled=\"isDisabled\"\n    :roving-focus=\"props.rovingFocus\"\n    :dir=\"props.dir\"\n    :loop=\"props.loop\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :name=\"props.name\"\n    :required=\"isRequired\"\n    :class=\"composeClassName(classes, props.class)\"\n    @update:model-value=\"(v) => emit('update:modelValue', v as Single | Multi)\"\n  >\n    <template v-if=\"props.items\">\n      <ToolbarToggleItem\n        v-for=\"item in props.items\"\n        :key=\"item.value\"\n        :value=\"item.value\"\n        :variant=\"item.variant\"\n        :size=\"item.size\"\n        :is-icon-only=\"item.isIconOnly\"\n        :is-disabled=\"item.disabled\"\n        :class=\"item.class\"\n      >{{ item.label }}</ToolbarToggleItem>\n    </template>\n    <slot v-else />\n  </RekaToolbarToggleGroup>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAaA,MAAM,QAAQ;EAqCd,MAAM,OAAO;EAIb,MAAM,aAAa,yBACjB,sBAAsB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SACtF;EAEA,MAAM,aAAa,yBACjB,sBAAsB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SACtF;EAEA,MAAM,MAAM,iBAAiB,EAAE,aAAa,eAAe,aAAsB,EAAE,CAAA;EACnF,MAAM,cAAc,eAAe,MAAM,eAAe,IAAI,YAAY,MAAK;EAE7E,MAAM,UAAU,eACd,0BAA0B;GAAE,aAAa,YAAY;GAAO,YAAY,MAAM,cAAc;GAAO,CAAC,CAAC,MAAK,CAC5G;;uBAIE,YA4ByB,MAAA,mBAAA,EAAA;IA3BtB,MAAM,MAAM;IACZ,eAAa,MAAM;IACnB,iBAAe,MAAM;IACrB,UAAU,MAAA,WAAU;IACpB,gBAAc,MAAM;IACpB,KAAK,MAAM;IACX,MAAM,MAAM;IACZ,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,MAAM,MAAM;IACZ,UAAU,MAAA,WAAU;IACpB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;IAC5C,uBAAkB,OAAA,OAAA,OAAA,MAAG,MAAM,KAAI,qBAAsB,EAAC;;2BAa5C,CAXK,MAAM,SAAA,UAAA,KAAA,EACpB,mBASqC,UAAA,EAAA,KAAA,GAAA,EAAA,WARpB,MAAM,QAAd,SAAI;yBADb,YASqC,2BAAA;MAPlC,KAAK,KAAK;MACV,OAAO,KAAK;MACZ,SAAS,KAAK;MACd,MAAM,KAAK;MACX,gBAAc,KAAK;MACnB,eAAa,KAAK;MAClB,OAAK,eAAE,KAAK,MAAK;;6BACH,CAAA,gBAAA,gBAAb,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;;;;gBAEhB,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

package/dist/components/toolbar/ToolbarToggleItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleItem.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleItem as RekaToolbarToggleItem } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  value: string\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  disabled?: boolean\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarToggleItem\n    :value=\"props.value\"\n    :disabled=\"props.disabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarToggleItem>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToolbarToggleItem.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleItem as RekaToolbarToggleItem } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  isDisabled: undefined,\n  disabled: undefined,\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ToolbarToggleItem', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarToggleItem\n    :value=\"props.value\"\n    :disabled=\"isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarToggleItem>\n</template>\n"],"mappings":""}

package/dist/components/toolbar/ToolbarToggleItem.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 { computed, createBlock, defineComponent, normalizeClass, openBlock, renderSlot, unref, withCtx } from "vue";
 import { toggleButtonVariants } from "@auronui/styles";
 import { ToolbarToggleItem } from "reka-ui";
@@ -10,13 +11,21 @@ var ToolbarToggleItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		variant: {},
 		size: {},
 		isIconOnly: { type: Boolean },
-		disabled: { type: Boolean },
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
 		class: {},
 		as: {},
 		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;
+		const isDisabled = useDeprecatedBooleanProp("ToolbarToggleItem", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
 		const classes = computed(() => toggleButtonVariants({
 			variant: props.variant ?? "ghost",
 			size: props.size ?? "md",
@@ -25,7 +34,7 @@ var ToolbarToggleItem_vue_vue_type_script_setup_true_lang_default = /* @__PURE__
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(ToolbarToggleItem), {
 				value: props.value,
-				disabled: props.disabled,
+				disabled: unref(isDisabled),
 				as: props.as,
 				"as-child": props.asChild,
 				class: normalizeClass(unref(composeClassName)(classes.value, props.class))

package/dist/components/toolbar/ToolbarToggleItem.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarToggleItem.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleItem as RekaToolbarToggleItem } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  value: string\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  disabled?: boolean\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarToggleItem\n    :value=\"props.value\"\n    :disabled=\"props.disabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarToggleItem>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAad,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,MAAM,WAAW;GAC1B,MAAM,MAAM,QAAQ;GACpB,YAAY,MAAM,cAAc;GACjC,CAAA,CACH;;uBAIE,YAQwB,MAAA,kBAAA,EAAA;IAPrB,OAAO,MAAM;IACb,UAAU,MAAM;IAChB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;;2BAErC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToolbarToggleItem.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/ToolbarToggleItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { ToolbarToggleItem as RekaToolbarToggleItem } from 'reka-ui'\nimport { toggleButtonVariants, type ToggleButtonVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  variant?: ToggleButtonVariants['variant']\n  size?: ToggleButtonVariants['size']\n  isIconOnly?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  isDisabled: undefined,\n  disabled: undefined,\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'ToolbarToggleItem', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nconst classes = computed(() =>\n  toggleButtonVariants({\n    variant: props.variant ?? 'ghost',\n    size: props.size ?? 'md',\n    isIconOnly: props.isIconOnly ?? false,\n  })\n)\n</script>\n\n<template>\n  <RekaToolbarToggleItem\n    :value=\"props.value\"\n    :disabled=\"isDisabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarToggleItem>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;EAkBd,MAAM,aAAa,yBACjB,qBAAqB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SACrF;EAEA,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,MAAM,WAAW;GAC1B,MAAM,MAAM,QAAQ;GACpB,YAAY,MAAM,cAAc;GACjC,CAAA,CACH;;uBAIE,YAQwB,MAAA,kBAAA,EAAA;IAPrB,OAAO,MAAM;IACb,UAAU,MAAA,WAAU;IACpB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,MAAK,CAAA;;2BAErC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/tooltip/TooltipProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipProvider.js","names":[],"sources":["../../../src/components/tooltip/TooltipProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { TooltipProvider } from 'reka-ui'\n\nconst props = withDefaults(defineProps<{\n  delayDuration?: number\n  skipDelayDuration?: number\n  disableHoverableContent?: boolean\n  disableClosingTrigger?: boolean\n  disabled?: boolean\n  ignoreNonKeyboardFocus?: boolean\n  content?: object\n}>(), {\n  delayDuration: 700,\n  skipDelayDuration: 300,\n  disableHoverableContent: false,\n  disableClosingTrigger: false,\n  disabled: false,\n  ignoreNonKeyboardFocus: false,\n})\n</script>\n\n<template>\n  <TooltipProvider\n    :delay-duration=\"props.delayDuration\"\n    :skip-delay-duration=\"props.skipDelayDuration\"\n    :disable-hoverable-content=\"props.disableHoverableContent\"\n    :disable-closing-trigger=\"props.disableClosingTrigger\"\n    :disabled=\"props.disabled\"\n    :ignore-non-keyboard-focus=\"props.ignoreNonKeyboardFocus\"\n    :content=\"props.content\"\n  >\n    <slot />\n  </TooltipProvider>\n</template>\n"],"mappings":""}
+{"version":3,"file":"TooltipProvider.js","names":[],"sources":["../../../src/components/tooltip/TooltipProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { TooltipProvider } from 'reka-ui'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  delayDuration?: number\n  skipDelayDuration?: number\n  disableHoverableContent?: boolean\n  disableClosingTrigger?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  ignoreNonKeyboardFocus?: boolean\n  content?: object\n}>(), {\n  delayDuration: 700,\n  skipDelayDuration: 300,\n  disableHoverableContent: false,\n  disableClosingTrigger: false,\n  isDisabled: undefined,\n  disabled: undefined,\n  ignoreNonKeyboardFocus: false,\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'TooltipProvider', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n</script>\n\n<template>\n  <TooltipProvider\n    :delay-duration=\"props.delayDuration\"\n    :skip-delay-duration=\"props.skipDelayDuration\"\n    :disable-hoverable-content=\"props.disableHoverableContent\"\n    :disable-closing-trigger=\"props.disableClosingTrigger\"\n    :disabled=\"isDisabled\"\n    :ignore-non-keyboard-focus=\"props.ignoreNonKeyboardFocus\"\n    :content=\"props.content\"\n  >\n    <slot />\n  </TooltipProvider>\n</template>\n"],"mappings":""}

package/dist/components/tooltip/TooltipProvider.vue_vue_type_script_setup_true_lang.js

@@ -1,3 +1,4 @@
+import { useDeprecatedBooleanProp } from "../../composables/useDeprecatedBooleanProp.js";
 import { createBlock, defineComponent, openBlock, renderSlot, unref, withCtx } from "vue";
 import { TooltipProvider } from "reka-ui";
 //#region src/components/tooltip/TooltipProvider.vue?vue&type=script&setup=true&lang.ts
@@ -14,9 +15,13 @@ var TooltipProvider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 			type: Boolean,
 			default: false
 		},
+		isDisabled: {
+			type: Boolean,
+			default: void 0
+		},
 		disabled: {
 			type: Boolean,
-			default: false
+			default: void 0
 		},
 		ignoreNonKeyboardFocus: {
 			type: Boolean,
@@ -26,13 +31,14 @@ var TooltipProvider_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ *
 	},
 	setup(__props) {
 		const props = __props;
+		const isDisabled = useDeprecatedBooleanProp("TooltipProvider", "isDisabled", () => props.isDisabled, "disabled", () => props.disabled);
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(TooltipProvider), {
 				"delay-duration": props.delayDuration,
 				"skip-delay-duration": props.skipDelayDuration,
 				"disable-hoverable-content": props.disableHoverableContent,
 				"disable-closing-trigger": props.disableClosingTrigger,
-				disabled: props.disabled,
+				disabled: unref(isDisabled),
 				"ignore-non-keyboard-focus": props.ignoreNonKeyboardFocus,
 				content: props.content
 			}, {

package/dist/components/tooltip/TooltipProvider.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"TooltipProvider.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/tooltip/TooltipProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { TooltipProvider } from 'reka-ui'\n\nconst props = withDefaults(defineProps<{\n  delayDuration?: number\n  skipDelayDuration?: number\n  disableHoverableContent?: boolean\n  disableClosingTrigger?: boolean\n  disabled?: boolean\n  ignoreNonKeyboardFocus?: boolean\n  content?: object\n}>(), {\n  delayDuration: 700,\n  skipDelayDuration: 300,\n  disableHoverableContent: false,\n  disableClosingTrigger: false,\n  disabled: false,\n  ignoreNonKeyboardFocus: false,\n})\n</script>\n\n<template>\n  <TooltipProvider\n    :delay-duration=\"props.delayDuration\"\n    :skip-delay-duration=\"props.skipDelayDuration\"\n    :disable-hoverable-content=\"props.disableHoverableContent\"\n    :disable-closing-trigger=\"props.disableClosingTrigger\"\n    :disabled=\"props.disabled\"\n    :ignore-non-keyboard-focus=\"props.ignoreNonKeyboardFocus\"\n    :content=\"props.content\"\n  >\n    <slot />\n  </TooltipProvider>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;EAGA,MAAM,QAAQ;;uBAmBZ,YAUkB,MAAA,gBAAA,EAAA;IATf,kBAAgB,MAAM;IACtB,uBAAqB,MAAM;IAC3B,6BAA2B,MAAM;IACjC,2BAAyB,MAAM;IAC/B,UAAU,MAAM;IAChB,6BAA2B,MAAM;IACjC,SAAS,MAAM;;2BAER,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"TooltipProvider.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/tooltip/TooltipProvider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { TooltipProvider } from 'reka-ui'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  delayDuration?: number\n  skipDelayDuration?: number\n  disableHoverableContent?: boolean\n  disableClosingTrigger?: boolean\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  ignoreNonKeyboardFocus?: boolean\n  content?: object\n}>(), {\n  delayDuration: 700,\n  skipDelayDuration: 300,\n  disableHoverableContent: false,\n  disableClosingTrigger: false,\n  isDisabled: undefined,\n  disabled: undefined,\n  ignoreNonKeyboardFocus: false,\n})\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'TooltipProvider', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n</script>\n\n<template>\n  <TooltipProvider\n    :delay-duration=\"props.delayDuration\"\n    :skip-delay-duration=\"props.skipDelayDuration\"\n    :disable-hoverable-content=\"props.disableHoverableContent\"\n    :disable-closing-trigger=\"props.disableClosingTrigger\"\n    :disabled=\"isDisabled\"\n    :ignore-non-keyboard-focus=\"props.ignoreNonKeyboardFocus\"\n    :content=\"props.content\"\n  >\n    <slot />\n  </TooltipProvider>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIA,MAAM,QAAQ;EAoBd,MAAM,aAAa,yBACjB,mBAAmB,oBAAoB,MAAM,YAAY,kBAAkB,MAAM,SACnF;;uBAIE,YAUkB,MAAA,gBAAA,EAAA;IATf,kBAAgB,MAAM;IACtB,uBAAqB,MAAM;IAC3B,6BAA2B,MAAM;IACjC,2BAAyB,MAAM;IAC/B,UAAU,MAAA,WAAU;IACpB,6BAA2B,MAAM;IACjC,SAAS,MAAM;;2BAER,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/tree/Tree.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.js","names":[],"sources":["../../../src/components/tree/Tree.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T extends Record<string, any>\">\nimport { computed, provide } from 'vue'\nimport { TreeRoot } from 'reka-ui'\nimport { treeVariants, type TreeVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { treeContextKey } from './Tree.context'\n\nconst props = withDefaults(defineProps<{\n  items?: T[]\n  modelValue?: T | T[]\n  defaultValue?: T | T[]\n  expanded?: string[]\n  defaultExpanded?: string[]\n  getKey: (item: T) => string\n  getChildren?: (item: T) => T[] | undefined\n  multiple?: boolean\n  selectionBehavior?: 'toggle' | 'replace'\n  propagateSelect?: boolean\n  size?: TreeVariants['size']\n  class?: ClassValue\n  /** Per-slot class overrides */\n  classNames?: Partial<{\n    root: ClassValue\n  }>\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Whether the entire tree is disabled */\n  disabled?: boolean\n  /** Whether selection bubbles up to parent nodes */\n  bubbleSelect?: boolean\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  items: () => [],\n  modelValue: undefined,\n  defaultValue: undefined,\n  expanded: undefined,\n  defaultExpanded: () => [],\n  getChildren: (item: T) => item.children as T[] | undefined,\n  multiple: false,\n  selectionBehavior: 'toggle',\n  propagateSelect: false,\n  size: 'md',\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: T | T[]]\n  'update:expanded': [value: string[]]\n}>()\n\nconst slotFns = computed(() => treeVariants({ size: props.size }))\n\nprovide(treeContextKey, {\n  size: computed(() => props.size ?? 'md'),\n  getChildren: (item: unknown) => props.getChildren?.(item as T),\n})\n</script>\n\n<template>\n  <TreeRoot\n    :items=\"items\"\n    :get-key=\"getKey\"\n    :get-children=\"getChildren\"\n    :model-value=\"(modelValue as any)\"\n    :default-value=\"(defaultValue as any)\"\n    :expanded=\"expanded\"\n    :default-expanded=\"defaultExpanded\"\n    :multiple=\"multiple\"\n    :selection-behavior=\"selectionBehavior\"\n    :propagate-select=\"propagateSelect\"\n    :dir=\"props.dir\"\n    :disabled=\"props.disabled\"\n    :bubble-select=\"props.bubbleSelect\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.root(), props.class, props.classNames?.root)\"\n    data-slot=\"tree\"\n    @update:model-value=\"(v: any) => emit('update:modelValue', v)\"\n    @update:expanded=\"(v: string[]) => emit('update:expanded', v)\"\n  >\n    <template #default=\"slotProps\">\n      <slot v-bind=\"slotProps\" />\n    </template>\n  </TreeRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Tree.js","names":[],"sources":["../../../src/components/tree/Tree.vue"],"sourcesContent":["<script setup lang=\"ts\" generic=\"T extends Record<string, any>\">\nimport { computed, provide } from 'vue'\nimport { TreeRoot } from 'reka-ui'\nimport { treeVariants, type TreeVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { treeContextKey } from './Tree.context'\nimport { useDeprecatedBooleanProp } from '../../composables/useDeprecatedBooleanProp'\n\nconst props = withDefaults(defineProps<{\n  items?: T[]\n  modelValue?: T | T[]\n  defaultValue?: T | T[]\n  expanded?: string[]\n  defaultExpanded?: string[]\n  getKey: (item: T) => string\n  getChildren?: (item: T) => T[] | undefined\n  multiple?: boolean\n  selectionBehavior?: 'toggle' | 'replace'\n  propagateSelect?: boolean\n  size?: TreeVariants['size']\n  class?: ClassValue\n  /** Per-slot class overrides */\n  classNames?: Partial<{\n    root: ClassValue\n  }>\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Whether the entire tree is disabled */\n  isDisabled?: boolean\n  /** @deprecated Use isDisabled instead. */\n  disabled?: boolean\n  /** Whether selection bubbles up to parent nodes */\n  bubbleSelect?: boolean\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  items: () => [],\n  modelValue: undefined,\n  defaultValue: undefined,\n  expanded: undefined,\n  defaultExpanded: () => [],\n  getChildren: (item: T) => item.children as T[] | undefined,\n  multiple: false,\n  selectionBehavior: 'toggle',\n  propagateSelect: false,\n  size: 'md',\n  class: undefined,\n  isDisabled: undefined,\n  disabled: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: T | T[]]\n  'update:expanded': [value: string[]]\n}>()\n\nconst slotFns = computed(() => treeVariants({ size: props.size }))\n\nconst isDisabled = useDeprecatedBooleanProp(\n  'Tree', 'isDisabled', () => props.isDisabled, 'disabled', () => props.disabled,\n)\n\nprovide(treeContextKey, {\n  size: computed(() => props.size ?? 'md'),\n  getChildren: (item: unknown) => props.getChildren?.(item as T),\n})\n</script>\n\n<template>\n  <TreeRoot\n    :items=\"items\"\n    :get-key=\"getKey\"\n    :get-children=\"getChildren\"\n    :model-value=\"(modelValue as any)\"\n    :default-value=\"(defaultValue as any)\"\n    :expanded=\"expanded\"\n    :default-expanded=\"defaultExpanded\"\n    :multiple=\"multiple\"\n    :selection-behavior=\"selectionBehavior\"\n    :propagate-select=\"propagateSelect\"\n    :dir=\"props.dir\"\n    :disabled=\"isDisabled\"\n    :bubble-select=\"props.bubbleSelect\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.root(), props.class, props.classNames?.root)\"\n    data-slot=\"tree\"\n    @update:model-value=\"(v: any) => emit('update:modelValue', v)\"\n    @update:expanded=\"(v: string[]) => emit('update:expanded', v)\"\n  >\n    <template #default=\"slotProps\">\n      <slot v-bind=\"slotProps\" />\n    </template>\n  </TreeRoot>\n</template>\n"],"mappings":""}