@auronui/vue 1.0.20 → 1.0.22

package/dist/components/time-field/TimeField.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeField.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/time-field/TimeField.vue"],"sourcesContent":["<!--\n  TimeField — form-field mirror of Input.vue for @internationalized/date Time values.\n\n  Anatomy, data-attributes, floating-label behavior, start/end content\n  slots, and a11y wiring all mirror Input.vue / DateInput.vue. See the\n  Input.vue docblock for the canonical contract.\n-->\n<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref, useAttrs, useId, watch } from 'vue'\nimport { TimeFieldRoot, TimeFieldInput } from 'reka-ui'\nimport type { TimeValue } from 'reka-ui'\nimport { timeFieldVariants, type TimeFieldVariants } 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<TimeValue | null | undefined>()\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: TimeFieldVariants['variant']\n  /** Field height. @default 'md' */\n  size?: TimeFieldVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: TimeFieldVariants['color']\n  /** Label placement relative to the field. @default 'inside' */\n  labelPlacement?: TimeFieldVariants['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. */\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    endContent: ClassValue\n    helperWrapper: ClassValue\n    errorMessage: ClassValue\n    description: ClassValue\n  }>\n\n  /* ─── TimeField-specific ──────────────────────────────────────── */\n  defaultValue?: TimeValue\n  placeholderValue?: TimeValue\n  minValue?: TimeValue\n  maxValue?: TimeValue\n  granularity?: 'hour' | 'minute' | 'second'\n  hourCycle?: 12 | 24\n  locale?: string\n  name?: string\n  hideTimeZone?: 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 != 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.\n// This prevents nested interactive children (e.g. a TimePickerTrigger button in\n// endContent) from flipping the field into the focused visual state.\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 a focus snap-back after an outside click. When the user\n// clicks outside the field, we mark a short-lived \"suppress segment focus\"\n// window. Any focusin landing on a segment inside that window gets blurred\n// immediately — kills the two-click-to-blur UX regardless of which internal\n// mechanism (Reka VisuallyHidden, label-for, contenteditable selection\n// restoration) tried to restore the focus.\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 synchronously from the rendered segments — defaultValue +\n// isFilled from modelValue misses the uncontrolled case and the partially-typed\n// case. After each value/segment render, sniff any non-literal segment that\n// carries data-placeholder=\"false\".\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\n// Only intervene on the INITIAL click that enters the field. Once a segment\n// already holds focus, leave subsequent mousedowns alone so the user can\n// blur naturally (clicking elsewhere) without focus snapping back to a\n// segment and requiring a second click.\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  timeFieldVariants({\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  >\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      <TimeFieldRoot\n        :id=\"fieldId\"\n        ref=\"fieldRef\"\n        v-model=\"modelValue\"\n        :default-value=\"defaultValue\"\n        :placeholder=\"placeholderValue\"\n        :min-value=\"minValue\"\n        :max-value=\"maxValue\"\n        :granularity=\"granularity\"\n        :hour-cycle=\"hourCycle\"\n        :locale=\"locale\"\n        :disabled=\"isDisabled\"\n        :readonly=\"isReadOnly\"\n        :name=\"name\"\n        :hide-time-zone=\"hideTimeZone\"\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          >\n            <template\n              v-for=\"(segment, _i) in segments\"\n              :key=\"_i\"\n            >\n              <TimeFieldInput\n                :part=\"segment.part\"\n                :class=\"composeClassName(slotFns.segment(), props.classNames?.segment)\"\n              >\n                {{ segment.value }}\n              </TimeFieldInput>\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      </TimeFieldRoot>\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":"TimeField.vue_vue_type_script_setup_true_lang.js","names":["$slots"],"sources":["../../../src/components/time-field/TimeField.vue"],"sourcesContent":["<!--\n  TimeField — form-field mirror of Input.vue for @internationalized/date Time values.\n\n  Anatomy, data-attributes, floating-label behavior, start/end content\n  slots, and a11y wiring all mirror Input.vue / DateInput.vue. See the\n  Input.vue docblock for the canonical contract.\n-->\n<script setup lang=\"ts\">\nimport { computed, onBeforeUnmount, onMounted, ref, useAttrs, useId, watch } from 'vue'\nimport { TimeFieldRoot, TimeFieldInput } from 'reka-ui'\nimport type { TimeValue } from 'reka-ui'\nimport { timeFieldVariants, type TimeFieldVariants } 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<TimeValue | null | undefined>()\n\ntype Props = {\n  /** Visual style of the field. @default 'flat' */\n  variant?: TimeFieldVariants['variant']\n  /** Field height. @default 'md' */\n  size?: TimeFieldVariants['size']\n  /** Accent color applied to focus ring + floating label. @default 'default' */\n  color?: TimeFieldVariants['color']\n  /** Label placement relative to the field. @default 'inside' */\n  labelPlacement?: TimeFieldVariants['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. */\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    endContent: ClassValue\n    helperWrapper: ClassValue\n    errorMessage: ClassValue\n    description: ClassValue\n  }>\n\n  /* ─── TimeField-specific ──────────────────────────────────────── */\n  defaultValue?: TimeValue\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  /** Enable step snapping behavior. */\n  stepSnapping?: boolean\n  locale?: string\n  name?: string\n  hideTimeZone?: boolean\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 != 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.\n// This prevents nested interactive children (e.g. a TimePickerTrigger button in\n// endContent) from flipping the field into the focused visual state.\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 a focus snap-back after an outside click. When the user\n// clicks outside the field, we mark a short-lived \"suppress segment focus\"\n// window. Any focusin landing on a segment inside that window gets blurred\n// immediately — kills the two-click-to-blur UX regardless of which internal\n// mechanism (Reka VisuallyHidden, label-for, contenteditable selection\n// restoration) tried to restore the focus.\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 synchronously from the rendered segments — defaultValue +\n// isFilled from modelValue misses the uncontrolled case and the partially-typed\n// case. After each value/segment render, sniff any non-literal segment that\n// carries data-placeholder=\"false\".\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\n// Only intervene on the INITIAL click that enters the field. Once a segment\n// already holds focus, leave subsequent mousedowns alone so the user can\n// blur naturally (clicking elsewhere) without focus snapping back to a\n// segment and requiring a second click.\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  timeFieldVariants({\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  >\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      <TimeFieldRoot\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        :step-snapping=\"stepSnapping\"\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          >\n            <template\n              v-for=\"(segment, _i) in segments\"\n              :key=\"_i\"\n            >\n              <TimeFieldInput\n                :part=\"segment.part\"\n                :class=\"composeClassName(slotFns.segment(), props.classNames?.segment)\"\n              >\n                {{ segment.value }}\n              </TimeFieldInput>\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      </TimeFieldRoot>\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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"}

package/dist/components/toast/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","names":[],"sources":["../../../src/components/toast/Toast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue'\nimport { ToastRoot } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  open?: boolean\n  duration?: number\n  position?: ToastPosition\n  variant?: ToastVariants['variant']\n  class?: string\n}>(), {\n  open: true,\n  duration: 5000,\n  position: 'bottom-right',\n  variant: 'default',\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n}>()\n\nconst internalOpen = ref(props.open)\n\nwatch(() => props.open, (val) => {\n  internalOpen.value = val\n})\n\nlet dismissTimer: ReturnType<typeof setTimeout> | null = null\n\nfunction startTimer() {\n  if (props.duration && props.duration > 0) {\n    dismissTimer = setTimeout(() => close(), props.duration)\n  }\n}\n\nfunction clearTimer() {\n  if (dismissTimer !== null) {\n    clearTimeout(dismissTimer)\n    dismissTimer = null\n  }\n}\n\nfunction close() {\n  internalOpen.value = false\n  emit('update:open', false)\n}\n\nonMounted(() => startTimer())\nonBeforeUnmount(() => clearTimer())\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position ?? 'bottom-right'] ?? 'bottom'\n})\n\nconst styles = computed(() =>\n  toastVariants({ placement: placementVariant.value, variant: props.variant }),\n)\n</script>\n\n<template>\n  <ToastRoot\n    :open=\"internalOpen\"\n    :duration=\"duration\"\n    :class=\"composeClassName(styles.toast(), props.class)\"\n    @update:open=\"(val) => { if (!val) close() }\"\n    @pause=\"clearTimer\"\n    @resume=\"startTimer\"\n  >\n    <slot />\n  </ToastRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Toast.js","names":[],"sources":["../../../src/components/toast/Toast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue'\nimport { ToastRoot } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  open?: boolean\n  duration?: number\n  position?: ToastPosition\n  variant?: ToastVariants['variant']\n  class?: string\n  /** Default open state for uncontrolled usage */\n  defaultOpen?: boolean\n  /** Keep mounted in DOM when closed */\n  forceMount?: boolean\n  /** Toast type: 'foreground' for urgent, 'background' for passive */\n  type?: 'foreground' | 'background'\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  open: true,\n  duration: 5000,\n  position: 'bottom-right',\n  variant: 'default',\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n  'escape-key-down': [event: KeyboardEvent]\n  'pause': []\n  'resume': []\n  'swipe-start': [event: Event]\n  'swipe-move': [event: Event]\n  'swipe-cancel': [event: Event]\n  'swipe-end': [event: Event]\n}>()\n\nconst internalOpen = ref(props.open)\n\nwatch(() => props.open, (val) => {\n  internalOpen.value = val\n})\n\nlet dismissTimer: ReturnType<typeof setTimeout> | null = null\n\nfunction startTimer() {\n  if (props.duration && props.duration > 0) {\n    dismissTimer = setTimeout(() => close(), props.duration)\n  }\n}\n\nfunction clearTimer() {\n  if (dismissTimer !== null) {\n    clearTimeout(dismissTimer)\n    dismissTimer = null\n  }\n}\n\nfunction close() {\n  internalOpen.value = false\n  emit('update:open', false)\n}\n\nonMounted(() => startTimer())\nonBeforeUnmount(() => clearTimer())\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position ?? 'bottom-right'] ?? 'bottom'\n})\n\nconst styles = computed(() =>\n  toastVariants({ placement: placementVariant.value, variant: props.variant }),\n)\n</script>\n\n<template>\n  <ToastRoot\n    :open=\"internalOpen\"\n    :duration=\"duration\"\n    :default-open=\"props.defaultOpen\"\n    :force-mount=\"props.forceMount\"\n    :type=\"props.type\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(styles.toast(), props.class)\"\n    @update:open=\"(val) => { if (!val) close() }\"\n    @escape-key-down=\"(e: KeyboardEvent) => emit('escape-key-down', e)\"\n    @pause=\"() => { clearTimer(); emit('pause') }\"\n    @resume=\"() => { startTimer(); emit('resume') }\"\n    @swipe-start=\"(e: Event) => emit('swipe-start', e)\"\n    @swipe-move=\"(e: Event) => emit('swipe-move', e)\"\n    @swipe-cancel=\"(e: Event) => emit('swipe-cancel', e)\"\n    @swipe-end=\"(e: Event) => emit('swipe-end', e)\"\n  >\n    <slot />\n  </ToastRoot>\n</template>\n"],"mappings":""}

package/dist/components/toast/Toast.vue_vue_type_script_setup_true_lang.js

@@ -13,9 +13,23 @@ var Toast_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 		duration: { default: 5e3 },
 		position: { default: "bottom-right" },
 		variant: { default: "default" },
-		class: {}
+		class: {},
+		defaultOpen: { type: Boolean },
+		forceMount: { type: Boolean },
+		type: {},
+		as: {},
+		asChild: { type: Boolean }
 	},
-	emits: ["update:open"],
+	emits: [
+		"update:open",
+		"escape-key-down",
+		"pause",
+		"resume",
+		"swipe-start",
+		"swipe-move",
+		"swipe-cancel",
+		"swipe-end"
+	],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -57,18 +71,39 @@ var Toast_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineCo
 			return openBlock(), createBlock(unref(ToastRoot), {
 				open: internalOpen.value,
 				duration: __props.duration,
+				"default-open": props.defaultOpen,
+				"force-mount": props.forceMount,
+				type: props.type,
+				as: props.as,
+				"as-child": props.asChild,
 				class: normalizeClass(unref(composeClassName)(styles.value.toast(), props.class)),
 				"onUpdate:open": _cache[0] || (_cache[0] = (val) => {
 					if (!val) close();
 				}),
-				onPause: clearTimer,
-				onResume: startTimer
+				onEscapeKeyDown: _cache[1] || (_cache[1] = (e) => emit("escape-key-down", e)),
+				onPause: _cache[2] || (_cache[2] = () => {
+					clearTimer();
+					emit("pause");
+				}),
+				onResume: _cache[3] || (_cache[3] = () => {
+					startTimer();
+					emit("resume");
+				}),
+				onSwipeStart: _cache[4] || (_cache[4] = (e) => emit("swipe-start", e)),
+				onSwipeMove: _cache[5] || (_cache[5] = (e) => emit("swipe-move", e)),
+				onSwipeCancel: _cache[6] || (_cache[6] = (e) => emit("swipe-cancel", e)),
+				onSwipeEnd: _cache[7] || (_cache[7] = (e) => emit("swipe-end", e))
 			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
 			}, 8, [
 				"open",
 				"duration",
+				"default-open",
+				"force-mount",
+				"type",
+				"as",
+				"as-child",
 				"class"
 			]);
 		};

package/dist/components/toast/Toast.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/Toast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue'\nimport { ToastRoot } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  open?: boolean\n  duration?: number\n  position?: ToastPosition\n  variant?: ToastVariants['variant']\n  class?: string\n}>(), {\n  open: true,\n  duration: 5000,\n  position: 'bottom-right',\n  variant: 'default',\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n}>()\n\nconst internalOpen = ref(props.open)\n\nwatch(() => props.open, (val) => {\n  internalOpen.value = val\n})\n\nlet dismissTimer: ReturnType<typeof setTimeout> | null = null\n\nfunction startTimer() {\n  if (props.duration && props.duration > 0) {\n    dismissTimer = setTimeout(() => close(), props.duration)\n  }\n}\n\nfunction clearTimer() {\n  if (dismissTimer !== null) {\n    clearTimeout(dismissTimer)\n    dismissTimer = null\n  }\n}\n\nfunction close() {\n  internalOpen.value = false\n  emit('update:open', false)\n}\n\nonMounted(() => startTimer())\nonBeforeUnmount(() => clearTimer())\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position ?? 'bottom-right'] ?? 'bottom'\n})\n\nconst styles = computed(() =>\n  toastVariants({ placement: placementVariant.value, variant: props.variant }),\n)\n</script>\n\n<template>\n  <ToastRoot\n    :open=\"internalOpen\"\n    :duration=\"duration\"\n    :class=\"composeClassName(styles.toast(), props.class)\"\n    @update:open=\"(val) => { if (!val) close() }\"\n    @pause=\"clearTimer\"\n    @resume=\"startTimer\"\n  >\n    <slot />\n  </ToastRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EAad,MAAM,OAAO;EAIb,MAAM,eAAe,IAAI,MAAM,KAAI;AAEnC,cAAY,MAAM,OAAO,QAAQ;AAC/B,gBAAa,QAAQ;IACtB;EAED,IAAI,eAAqD;EAEzD,SAAS,aAAa;AACpB,OAAI,MAAM,YAAY,MAAM,WAAW,EACrC,gBAAe,iBAAiB,OAAO,EAAE,MAAM,SAAQ;;EAI3D,SAAS,aAAa;AACpB,OAAI,iBAAiB,MAAM;AACzB,iBAAa,aAAY;AACzB,mBAAe;;;EAInB,SAAS,QAAQ;AACf,gBAAa,QAAQ;AACrB,QAAK,eAAe,MAAK;;AAG3B,kBAAgB,YAAY,CAAA;AAC5B,wBAAsB,YAAY,CAAA;EAElC,MAAM,mBAAmB,eAA2C;AASlE,UAR+D;IAC7D,aAAa;IACb,cAAc;IACd,YAAY;IACZ,gBAAgB;IAChB,iBAAiB;IACjB,eAAe;IACjB,CACW,MAAM,YAAY,mBAAmB;IACjD;EAED,MAAM,SAAS,eACb,cAAc;GAAE,WAAW,iBAAiB;GAAO,SAAS,MAAM;GAAS,CAAC,CAC9E;;uBAIE,YASY,MAAA,UAAA,EAAA;IART,MAAM,aAAA;IACN,UAAU,QAAA;IACV,OAAK,eAAE,MAAA,iBAAgB,CAAC,OAAA,MAAO,OAAK,EAAI,MAAM,MAAK,CAAA;IACnD,iBAAW,OAAA,OAAA,OAAA,MAAG,QAAG;AAAA,SAAA,CAAY,IAAK,QAAK;;IACvC,SAAO;IACP,UAAQ;;2BAED,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"Toast.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/Toast.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ref, computed, onMounted, onBeforeUnmount, watch } from 'vue'\nimport { ToastRoot } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  open?: boolean\n  duration?: number\n  position?: ToastPosition\n  variant?: ToastVariants['variant']\n  class?: string\n  /** Default open state for uncontrolled usage */\n  defaultOpen?: boolean\n  /** Keep mounted in DOM when closed */\n  forceMount?: boolean\n  /** Toast type: 'foreground' for urgent, 'background' for passive */\n  type?: 'foreground' | 'background'\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  open: true,\n  duration: 5000,\n  position: 'bottom-right',\n  variant: 'default',\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n  'escape-key-down': [event: KeyboardEvent]\n  'pause': []\n  'resume': []\n  'swipe-start': [event: Event]\n  'swipe-move': [event: Event]\n  'swipe-cancel': [event: Event]\n  'swipe-end': [event: Event]\n}>()\n\nconst internalOpen = ref(props.open)\n\nwatch(() => props.open, (val) => {\n  internalOpen.value = val\n})\n\nlet dismissTimer: ReturnType<typeof setTimeout> | null = null\n\nfunction startTimer() {\n  if (props.duration && props.duration > 0) {\n    dismissTimer = setTimeout(() => close(), props.duration)\n  }\n}\n\nfunction clearTimer() {\n  if (dismissTimer !== null) {\n    clearTimeout(dismissTimer)\n    dismissTimer = null\n  }\n}\n\nfunction close() {\n  internalOpen.value = false\n  emit('update:open', false)\n}\n\nonMounted(() => startTimer())\nonBeforeUnmount(() => clearTimer())\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position ?? 'bottom-right'] ?? 'bottom'\n})\n\nconst styles = computed(() =>\n  toastVariants({ placement: placementVariant.value, variant: props.variant }),\n)\n</script>\n\n<template>\n  <ToastRoot\n    :open=\"internalOpen\"\n    :duration=\"duration\"\n    :default-open=\"props.defaultOpen\"\n    :force-mount=\"props.forceMount\"\n    :type=\"props.type\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(styles.toast(), props.class)\"\n    @update:open=\"(val) => { if (!val) close() }\"\n    @escape-key-down=\"(e: KeyboardEvent) => emit('escape-key-down', e)\"\n    @pause=\"() => { clearTimer(); emit('pause') }\"\n    @resume=\"() => { startTimer(); emit('resume') }\"\n    @swipe-start=\"(e: Event) => emit('swipe-start', e)\"\n    @swipe-move=\"(e: Event) => emit('swipe-move', e)\"\n    @swipe-cancel=\"(e: Event) => emit('swipe-cancel', e)\"\n    @swipe-end=\"(e: Event) => emit('swipe-end', e)\"\n  >\n    <slot />\n  </ToastRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EASA,MAAM,QAAQ;EAuBd,MAAM,OAAO;EAWb,MAAM,eAAe,IAAI,MAAM,KAAI;AAEnC,cAAY,MAAM,OAAO,QAAQ;AAC/B,gBAAa,QAAQ;IACtB;EAED,IAAI,eAAqD;EAEzD,SAAS,aAAa;AACpB,OAAI,MAAM,YAAY,MAAM,WAAW,EACrC,gBAAe,iBAAiB,OAAO,EAAE,MAAM,SAAQ;;EAI3D,SAAS,aAAa;AACpB,OAAI,iBAAiB,MAAM;AACzB,iBAAa,aAAY;AACzB,mBAAe;;;EAInB,SAAS,QAAQ;AACf,gBAAa,QAAQ;AACrB,QAAK,eAAe,MAAK;;AAG3B,kBAAgB,YAAY,CAAA;AAC5B,wBAAsB,YAAY,CAAA;EAElC,MAAM,mBAAmB,eAA2C;AASlE,UAR+D;IAC7D,aAAa;IACb,cAAc;IACd,YAAY;IACZ,gBAAgB;IAChB,iBAAiB;IACjB,eAAe;IACjB,CACW,MAAM,YAAY,mBAAmB;IACjD;EAED,MAAM,SAAS,eACb,cAAc;GAAE,WAAW,iBAAiB;GAAO,SAAS,MAAM;GAAS,CAAC,CAC9E;;uBAIE,YAmBY,MAAA,UAAA,EAAA;IAlBT,MAAM,aAAA;IACN,UAAU,QAAA;IACV,gBAAc,MAAM;IACpB,eAAa,MAAM;IACnB,MAAM,MAAM;IACZ,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,OAAA,MAAO,OAAK,EAAI,MAAM,MAAK,CAAA;IACnD,iBAAW,OAAA,OAAA,OAAA,MAAG,QAAG;AAAA,SAAA,CAAY,IAAK,QAAK;;IACvC,iBAAe,OAAA,OAAA,OAAA,MAAG,MAAqB,KAAI,mBAAoB,EAAC;IAChE,SAAK,OAAA,OAAA,OAAA,WAAA;AAAU,iBAAU;AAAI,UAAI,QAAA;;IACjC,UAAM,OAAA,OAAA,OAAA,WAAA;AAAU,iBAAU;AAAI,UAAI,SAAA;;IAClC,cAAW,OAAA,OAAA,OAAA,MAAG,MAAa,KAAI,eAAgB,EAAC;IAChD,aAAU,OAAA,OAAA,OAAA,MAAG,MAAa,KAAI,cAAe,EAAC;IAC9C,eAAY,OAAA,OAAA,OAAA,MAAG,MAAa,KAAI,gBAAiB,EAAC;IAClD,YAAS,OAAA,OAAA,OAAA,MAAG,MAAa,KAAI,aAAc,EAAC;;2BAErC,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/toast/ToastAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastAction.js","names":[],"sources":["../../../src/components/toast/ToastAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastAction as RekaToastAction } from 'reka-ui'\nimport Button from '../button/Button.vue'\n\nconst props = withDefaults(defineProps<{\n  /** Required by Reka UI for screen reader announcements */\n  altText?: string\n  class?: string\n}>(), {\n  altText: 'Action',\n})\n</script>\n\n<template>\n  <RekaToastAction\n    as-child\n    :alt-text=\"altText\"\n  >\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      :class=\"props.class\"\n    >\n      <slot />\n    </Button>\n  </RekaToastAction>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToastAction.js","names":[],"sources":["../../../src/components/toast/ToastAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastAction as RekaToastAction } from 'reka-ui'\nimport Button from '../button/Button.vue'\n\nconst props = withDefaults(defineProps<{\n  /** Required by Reka UI for screen reader announcements */\n  altText?: string\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  altText: 'Action',\n})\n</script>\n\n<template>\n  <RekaToastAction\n    as-child\n    :alt-text=\"altText\"\n  >\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      :class=\"props.class\"\n    >\n      <slot />\n    </Button>\n  </RekaToastAction>\n</template>\n"],"mappings":""}

package/dist/components/toast/ToastAction.vue_vue_type_script_setup_true_lang.js

@@ -6,7 +6,9 @@ var ToastAction_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 	__name: "ToastAction",
 	props: {
 		altText: { default: "Action" },
-		class: {}
+		class: {},
+		as: {},
+		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;

package/dist/components/toast/ToastAction.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastAction.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastAction as RekaToastAction } from 'reka-ui'\nimport Button from '../button/Button.vue'\n\nconst props = withDefaults(defineProps<{\n  /** Required by Reka UI for screen reader announcements */\n  altText?: string\n  class?: string\n}>(), {\n  altText: 'Action',\n})\n</script>\n\n<template>\n  <RekaToastAction\n    as-child\n    :alt-text=\"altText\"\n  >\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      :class=\"props.class\"\n    >\n      <slot />\n    </Button>\n  </RekaToastAction>\n</template>\n"],"mappings":";;;;;;;;;;;EAIA,MAAM,QAAQ;;uBAUZ,YAWkB,MAAA,YAAA,EAAA;IAVhB,YAAA;IACC,YAAU,QAAA;;2BAQF,CANT,YAMS,gBAAA;KALP,MAAK;KACL,SAAQ;KACP,OAAK,eAAE,MAAM,MAAK;;4BAEX,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToastAction.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastAction.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastAction as RekaToastAction } from 'reka-ui'\nimport Button from '../button/Button.vue'\n\nconst props = withDefaults(defineProps<{\n  /** Required by Reka UI for screen reader announcements */\n  altText?: string\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  altText: 'Action',\n})\n</script>\n\n<template>\n  <RekaToastAction\n    as-child\n    :alt-text=\"altText\"\n  >\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      :class=\"props.class\"\n    >\n      <slot />\n    </Button>\n  </RekaToastAction>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAIA,MAAM,QAAQ;;uBAcZ,YAWkB,MAAA,YAAA,EAAA;IAVhB,YAAA;IACC,YAAU,QAAA;;2BAQF,CANT,YAMS,gBAAA;KALP,MAAK;KACL,SAAQ;KACP,OAAK,eAAE,MAAM,MAAK;;4BAEX,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/toast/ToastClose.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastClose.js","names":[],"sources":["../../../src/components/toast/ToastClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastClose as RekaToastClose } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport CloseButton from '../button/CloseButton.vue'\n\nconst props = defineProps<{\n  class?: string\n  ariaLabel?: string\n}>()\n\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastClose as-child>\n    <CloseButton\n      size=\"sm\"\n      :aria-label=\"ariaLabel ?? 'Close notification'\"\n      :class=\"composeClassName(styles.close(), props.class)\"\n    />\n  </RekaToastClose>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToastClose.js","names":[],"sources":["../../../src/components/toast/ToastClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastClose as RekaToastClose } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport CloseButton from '../button/CloseButton.vue'\n\nconst props = defineProps<{\n  class?: string\n  ariaLabel?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastClose as-child>\n    <CloseButton\n      size=\"sm\"\n      :aria-label=\"ariaLabel ?? 'Close notification'\"\n      :class=\"composeClassName(styles.close(), props.class)\"\n    />\n  </RekaToastClose>\n</template>\n"],"mappings":""}

package/dist/components/toast/ToastClose.vue_vue_type_script_setup_true_lang.js

@@ -8,7 +8,9 @@ var ToastClose_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ def
 	__name: "ToastClose",
 	props: {
 		class: {},
-		ariaLabel: {}
+		ariaLabel: {},
+		as: {},
+		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;

package/dist/components/toast/ToastClose.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastClose.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastClose as RekaToastClose } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport CloseButton from '../button/CloseButton.vue'\n\nconst props = defineProps<{\n  class?: string\n  ariaLabel?: string\n}>()\n\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastClose as-child>\n    <CloseButton\n      size=\"sm\"\n      :aria-label=\"ariaLabel ?? 'Close notification'\"\n      :class=\"composeClassName(styles.close(), props.class)\"\n    />\n  </RekaToastClose>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAKd,MAAM,SAAS,eAAc;;uBAI3B,YAMiB,MAAA,WAAA,EAAA,EAND,YAAA,IAAQ,EAAA;2BAKpB,CAJF,YAIE,qBAAA;KAHA,MAAK;KACJ,cAAY,QAAA,aAAS;KACrB,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAK,EAAI,MAAM,MAAK,CAAA"}
+{"version":3,"file":"ToastClose.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastClose as RekaToastClose } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport CloseButton from '../button/CloseButton.vue'\n\nconst props = defineProps<{\n  class?: string\n  ariaLabel?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastClose as-child>\n    <CloseButton\n      size=\"sm\"\n      :aria-label=\"ariaLabel ?? 'Close notification'\"\n      :class=\"composeClassName(styles.close(), props.class)\"\n    />\n  </RekaToastClose>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EASd,MAAM,SAAS,eAAc;;uBAI3B,YAMiB,MAAA,WAAA,EAAA,EAND,YAAA,IAAQ,EAAA;2BAKpB,CAJF,YAIE,qBAAA;KAHA,MAAK;KACJ,cAAY,QAAA,aAAS;KACrB,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAK,EAAI,MAAM,MAAK,CAAA"}

package/dist/components/toast/ToastDescription.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastDescription.js","names":[],"sources":["../../../src/components/toast/ToastDescription.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastDescription as RekaToastDescription } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{ class?: string }>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastDescription :class=\"composeClassName(styles.description(), props.class)\">\n    <slot />\n  </RekaToastDescription>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToastDescription.js","names":[],"sources":["../../../src/components/toast/ToastDescription.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastDescription as RekaToastDescription } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastDescription :as=\"props.as\" :as-child=\"props.asChild\" :class=\"composeClassName(styles.description(), props.class)\">\n    <slot />\n  </RekaToastDescription>\n</template>\n"],"mappings":""}

package/dist/components/toast/ToastDescription.vue_vue_type_script_setup_true_lang.js

@@ -5,15 +5,27 @@ import { ToastDescription } from "reka-ui";
 //#region src/components/toast/ToastDescription.vue?vue&type=script&setup=true&lang.ts
 var ToastDescription_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "ToastDescription",
-	props: { class: {} },
+	props: {
+		class: {},
+		as: {},
+		asChild: { type: Boolean }
+	},
 	setup(__props) {
 		const props = __props;
 		const styles = toastVariants();
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(ToastDescription), { class: normalizeClass(unref(composeClassName)(unref(styles).description(), props.class)) }, {
+			return openBlock(), createBlock(unref(ToastDescription), {
+				as: props.as,
+				"as-child": props.asChild,
+				class: normalizeClass(unref(composeClassName)(unref(styles).description(), props.class))
+			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["class"]);
+			}, 8, [
+				"as",
+				"as-child",
+				"class"
+			]);
 		};
 	}
 });

package/dist/components/toast/ToastDescription.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastDescription.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastDescription.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastDescription as RekaToastDescription } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{ class?: string }>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastDescription :class=\"composeClassName(styles.description(), props.class)\">\n    <slot />\n  </RekaToastDescription>\n</template>\n"],"mappings":";;;;;;;;;EAKA,MAAM,QAAQ;EACd,MAAM,SAAS,eAAc;;uBAI3B,YAEuB,MAAA,iBAAA,EAAA,EAFA,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,aAAW,EAAI,MAAM,MAAK,CAAA,EAAA,EAAA;2BACtE,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToastDescription.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastDescription.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastDescription as RekaToastDescription } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastDescription :as=\"props.as\" :as-child=\"props.asChild\" :class=\"composeClassName(styles.description(), props.class)\">\n    <slot />\n  </RekaToastDescription>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAKA,MAAM,QAAQ;EAOd,MAAM,SAAS,eAAc;;uBAI3B,YAEuB,MAAA,iBAAA,EAAA;IAFA,IAAI,MAAM;IAAK,YAAU,MAAM;IAAU,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,aAAW,EAAI,MAAM,MAAK,CAAA;;2BAC/G,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/toast/ToastTitle.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastTitle.js","names":[],"sources":["../../../src/components/toast/ToastTitle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastTitle as RekaToastTitle } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{ class?: string }>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastTitle :class=\"composeClassName(styles.title(), props.class)\">\n    <slot />\n  </RekaToastTitle>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToastTitle.js","names":[],"sources":["../../../src/components/toast/ToastTitle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastTitle as RekaToastTitle } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastTitle :as=\"props.as\" :as-child=\"props.asChild\" :class=\"composeClassName(styles.title(), props.class)\">\n    <slot />\n  </RekaToastTitle>\n</template>\n"],"mappings":""}

package/dist/components/toast/ToastTitle.vue_vue_type_script_setup_true_lang.js

@@ -5,15 +5,27 @@ import { ToastTitle } from "reka-ui";
 //#region src/components/toast/ToastTitle.vue?vue&type=script&setup=true&lang.ts
 var ToastTitle_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "ToastTitle",
-	props: { class: {} },
+	props: {
+		class: {},
+		as: {},
+		asChild: { type: Boolean }
+	},
 	setup(__props) {
 		const props = __props;
 		const styles = toastVariants();
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(ToastTitle), { class: normalizeClass(unref(composeClassName)(unref(styles).title(), props.class)) }, {
+			return openBlock(), createBlock(unref(ToastTitle), {
+				as: props.as,
+				"as-child": props.asChild,
+				class: normalizeClass(unref(composeClassName)(unref(styles).title(), props.class))
+			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["class"]);
+			}, 8, [
+				"as",
+				"as-child",
+				"class"
+			]);
 		};
 	}
 });

package/dist/components/toast/ToastTitle.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastTitle.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastTitle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastTitle as RekaToastTitle } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{ class?: string }>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastTitle :class=\"composeClassName(styles.title(), props.class)\">\n    <slot />\n  </RekaToastTitle>\n</template>\n"],"mappings":";;;;;;;;;EAKA,MAAM,QAAQ;EACd,MAAM,SAAS,eAAc;;uBAI3B,YAEiB,MAAA,WAAA,EAAA,EAFA,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAK,EAAI,MAAM,MAAK,CAAA,EAAA,EAAA;2BAC1D,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToastTitle.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastTitle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToastTitle as RekaToastTitle } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\nconst styles = toastVariants()\n</script>\n\n<template>\n  <RekaToastTitle :as=\"props.as\" :as-child=\"props.asChild\" :class=\"composeClassName(styles.title(), props.class)\">\n    <slot />\n  </RekaToastTitle>\n</template>\n"],"mappings":";;;;;;;;;;;;;EAKA,MAAM,QAAQ;EAOd,MAAM,SAAS,eAAc;;uBAI3B,YAEiB,MAAA,WAAA,EAAA;IAFA,IAAI,MAAM;IAAK,YAAU,MAAM;IAAU,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAK,EAAI,MAAM,MAAK,CAAA;;2BACnG,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/toast/ToastViewport.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastViewport.js","names":[],"sources":["../../../src/components/toast/ToastViewport.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * ToastViewport — Renders toasts for one screen position.\n *\n * Each viewport wraps its own RekaToastProvider so its ToastRoot children\n * teleport to THIS viewport, not a shared one. Without an isolated provider\n * per viewport, all ToastRoots teleport to whichever viewport mounted last.\n *\n * Usage:\n * ```vue\n * <ToastProvider>\n *   <ToastViewport position=\"top-right\" />\n *   <ToastViewport position=\"bottom-right\" />\n * </ToastProvider>\n * ```\n */\nimport { computed } from 'vue'\nimport { ToastProvider as RekaToastProvider, ToastViewport as RekaToastViewport } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToast } from '../../composables/useToast'\nimport Toast from './Toast.vue'\nimport ToastTitle from './ToastTitle.vue'\nimport ToastDescription from './ToastDescription.vue'\nimport ToastAction from './ToastAction.vue'\nimport ToastClose from './ToastClose.vue'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  position?: ToastPosition\n  class?: string\n  hotkey?: string[]\n  label?: string\n  swipeDirection?: 'up' | 'down' | 'left' | 'right'\n}>(), {\n  position: 'bottom-right',\n  hotkey: () => ['F8'],\n  label: 'Notifications ({hotkey})',\n  swipeDirection: 'right',\n})\n\nconst { toasts, dismiss, remove } = useToast()\n\nfunction handleOpenChange(id: string, open: boolean) {\n  if (!open) {\n    dismiss(id)\n    setTimeout(() => remove(id), 250)\n  }\n}\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position] ?? 'bottom end'\n})\n\nconst styles = computed(() => toastVariants({ placement: placementVariant.value }))\n\nconst viewportToasts = computed(() =>\n  toasts.value.filter((t) => (t.position ?? 'bottom-right') === props.position),\n)\n</script>\n\n<template>\n  <!-- Each viewport has its own isolated Reka provider so ToastRoot teleports here, not to a shared viewport -->\n  <RekaToastProvider :swipe-direction=\"swipeDirection\">\n    <RekaToastViewport\n      :hotkey=\"hotkey\"\n      :label=\"label\"\n      :class=\"composeClassName(styles.region(), props.class)\"\n    >\n      <Toast\n        v-for=\"toast in viewportToasts\"\n        :key=\"toast.id\"\n        :open=\"toast.open\"\n        :duration=\"toast.duration\"\n        :position=\"toast.position\"\n        :variant=\"toast.variant\"\n        @update:open=\"(open) => handleOpenChange(toast.id, open)\"\n      >\n        <div :class=\"styles.content()\">\n          <ToastTitle>{{ toast.title }}</ToastTitle>\n          <ToastDescription v-if=\"toast.description\">\n            {{ toast.description }}\n          </ToastDescription>\n        </div>\n        <div class=\"flex shrink-0 items-center gap-1 ml-auto\">\n          <ToastAction\n            v-if=\"toast.action\"\n            :alt-text=\"toast.action.label\"\n            @click=\"toast.action!.onClick\"\n          >\n            {{ toast.action.label }}\n          </ToastAction>\n          <ToastClose @click=\"dismiss(toast.id)\" />\n        </div>\n      </Toast>\n      <slot />\n    </RekaToastViewport>\n  </RekaToastProvider>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToastViewport.js","names":[],"sources":["../../../src/components/toast/ToastViewport.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * ToastViewport — Renders toasts for one screen position.\n *\n * Each viewport wraps its own RekaToastProvider so its ToastRoot children\n * teleport to THIS viewport, not a shared one. Without an isolated provider\n * per viewport, all ToastRoots teleport to whichever viewport mounted last.\n *\n * Usage:\n * ```vue\n * <ToastProvider>\n *   <ToastViewport position=\"top-right\" />\n *   <ToastViewport position=\"bottom-right\" />\n * </ToastProvider>\n * ```\n */\nimport { computed } from 'vue'\nimport { ToastProvider as RekaToastProvider, ToastViewport as RekaToastViewport } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToast } from '../../composables/useToast'\nimport Toast from './Toast.vue'\nimport ToastTitle from './ToastTitle.vue'\nimport ToastDescription from './ToastDescription.vue'\nimport ToastAction from './ToastAction.vue'\nimport ToastClose from './ToastClose.vue'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  position?: ToastPosition\n  class?: string\n  hotkey?: string[]\n  label?: string\n  swipeDirection?: 'up' | 'down' | 'left' | 'right'\n  /** Default duration for toasts in this provider (ms) */\n  duration?: number\n  /** Disable swipe gestures for all toasts in this provider */\n  disableSwipe?: boolean\n  /** Distance in pixels before a swipe is recognised */\n  swipeThreshold?: number\n  /** Render viewport as a different element */\n  as?: string\n  /** Merge viewport props onto child element */\n  asChild?: boolean\n}>(), {\n  position: 'bottom-right',\n  hotkey: () => ['F8'],\n  label: 'Notifications ({hotkey})',\n  swipeDirection: 'right',\n})\n\nconst { toasts, dismiss, remove } = useToast()\n\nfunction handleOpenChange(id: string, open: boolean) {\n  if (!open) {\n    dismiss(id)\n    setTimeout(() => remove(id), 250)\n  }\n}\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position] ?? 'bottom end'\n})\n\nconst styles = computed(() => toastVariants({ placement: placementVariant.value }))\n\nconst viewportToasts = computed(() =>\n  toasts.value.filter((t) => (t.position ?? 'bottom-right') === props.position),\n)\n</script>\n\n<template>\n  <!-- Each viewport has its own isolated Reka provider so ToastRoot teleports here, not to a shared viewport -->\n  <RekaToastProvider\n    :swipe-direction=\"swipeDirection\"\n    :duration=\"props.duration\"\n    :disable-swipe=\"props.disableSwipe\"\n    :swipe-threshold=\"props.swipeThreshold\"\n  >\n    <RekaToastViewport\n      :hotkey=\"hotkey\"\n      :label=\"label\"\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :class=\"composeClassName(styles.region(), props.class)\"\n    >\n      <Toast\n        v-for=\"toast in viewportToasts\"\n        :key=\"toast.id\"\n        :open=\"toast.open\"\n        :duration=\"toast.duration\"\n        :position=\"toast.position\"\n        :variant=\"toast.variant\"\n        @update:open=\"(open) => handleOpenChange(toast.id, open)\"\n      >\n        <div :class=\"styles.content()\">\n          <ToastTitle>{{ toast.title }}</ToastTitle>\n          <ToastDescription v-if=\"toast.description\">\n            {{ toast.description }}\n          </ToastDescription>\n        </div>\n        <div class=\"flex shrink-0 items-center gap-1 ml-auto\">\n          <ToastAction\n            v-if=\"toast.action\"\n            :alt-text=\"toast.action.label\"\n            @click=\"toast.action!.onClick\"\n          >\n            {{ toast.action.label }}\n          </ToastAction>\n          <ToastClose @click=\"dismiss(toast.id)\" />\n        </div>\n      </Toast>\n      <slot />\n    </RekaToastViewport>\n  </RekaToastProvider>\n</template>\n"],"mappings":""}

package/dist/components/toast/ToastViewport.vue_vue_type_script_setup_true_lang.js

@@ -17,7 +17,12 @@ var ToastViewport_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		class: {},
 		hotkey: { default: () => ["F8"] },
 		label: { default: "Notifications ({hotkey})" },
-		swipeDirection: { default: "right" }
+		swipeDirection: { default: "right" },
+		duration: {},
+		disableSwipe: { type: Boolean },
+		swipeThreshold: {},
+		as: {},
+		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		/**
@@ -56,10 +61,17 @@ var ToastViewport_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		const styles = computed(() => toastVariants({ placement: placementVariant.value }));
 		const viewportToasts = computed(() => toasts.value.filter((t) => (t.position ?? "bottom-right") === props.position));
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(ToastProvider), { "swipe-direction": __props.swipeDirection }, {
+			return openBlock(), createBlock(unref(ToastProvider), {
+				"swipe-direction": __props.swipeDirection,
+				duration: props.duration,
+				"disable-swipe": props.disableSwipe,
+				"swipe-threshold": props.swipeThreshold
+			}, {
 				default: withCtx(() => [createVNode(unref(ToastViewport), {
 					hotkey: __props.hotkey,
 					label: __props.label,
+					as: props.as,
+					"as-child": props.asChild,
 					class: normalizeClass(unref(composeClassName)(styles.value.region(), props.class))
 				}, {
 					default: withCtx(() => [(openBlock(true), createElementBlock(Fragment, null, renderList(viewportToasts.value, (toast) => {
@@ -98,10 +110,17 @@ var ToastViewport_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				}, 8, [
 					"hotkey",
 					"label",
+					"as",
+					"as-child",
 					"class"
 				])]),
 				_: 3
-			}, 8, ["swipe-direction"]);
+			}, 8, [
+				"swipe-direction",
+				"duration",
+				"disable-swipe",
+				"swipe-threshold"
+			]);
 		};
 	}
 });

package/dist/components/toast/ToastViewport.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"ToastViewport.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastViewport.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * ToastViewport — Renders toasts for one screen position.\n *\n * Each viewport wraps its own RekaToastProvider so its ToastRoot children\n * teleport to THIS viewport, not a shared one. Without an isolated provider\n * per viewport, all ToastRoots teleport to whichever viewport mounted last.\n *\n * Usage:\n * ```vue\n * <ToastProvider>\n *   <ToastViewport position=\"top-right\" />\n *   <ToastViewport position=\"bottom-right\" />\n * </ToastProvider>\n * ```\n */\nimport { computed } from 'vue'\nimport { ToastProvider as RekaToastProvider, ToastViewport as RekaToastViewport } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToast } from '../../composables/useToast'\nimport Toast from './Toast.vue'\nimport ToastTitle from './ToastTitle.vue'\nimport ToastDescription from './ToastDescription.vue'\nimport ToastAction from './ToastAction.vue'\nimport ToastClose from './ToastClose.vue'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  position?: ToastPosition\n  class?: string\n  hotkey?: string[]\n  label?: string\n  swipeDirection?: 'up' | 'down' | 'left' | 'right'\n}>(), {\n  position: 'bottom-right',\n  hotkey: () => ['F8'],\n  label: 'Notifications ({hotkey})',\n  swipeDirection: 'right',\n})\n\nconst { toasts, dismiss, remove } = useToast()\n\nfunction handleOpenChange(id: string, open: boolean) {\n  if (!open) {\n    dismiss(id)\n    setTimeout(() => remove(id), 250)\n  }\n}\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position] ?? 'bottom end'\n})\n\nconst styles = computed(() => toastVariants({ placement: placementVariant.value }))\n\nconst viewportToasts = computed(() =>\n  toasts.value.filter((t) => (t.position ?? 'bottom-right') === props.position),\n)\n</script>\n\n<template>\n  <!-- Each viewport has its own isolated Reka provider so ToastRoot teleports here, not to a shared viewport -->\n  <RekaToastProvider :swipe-direction=\"swipeDirection\">\n    <RekaToastViewport\n      :hotkey=\"hotkey\"\n      :label=\"label\"\n      :class=\"composeClassName(styles.region(), props.class)\"\n    >\n      <Toast\n        v-for=\"toast in viewportToasts\"\n        :key=\"toast.id\"\n        :open=\"toast.open\"\n        :duration=\"toast.duration\"\n        :position=\"toast.position\"\n        :variant=\"toast.variant\"\n        @update:open=\"(open) => handleOpenChange(toast.id, open)\"\n      >\n        <div :class=\"styles.content()\">\n          <ToastTitle>{{ toast.title }}</ToastTitle>\n          <ToastDescription v-if=\"toast.description\">\n            {{ toast.description }}\n          </ToastDescription>\n        </div>\n        <div class=\"flex shrink-0 items-center gap-1 ml-auto\">\n          <ToastAction\n            v-if=\"toast.action\"\n            :alt-text=\"toast.action.label\"\n            @click=\"toast.action!.onClick\"\n          >\n            {{ toast.action.label }}\n          </ToastAction>\n          <ToastClose @click=\"dismiss(toast.id)\" />\n        </div>\n      </Toast>\n      <slot />\n    </RekaToastViewport>\n  </RekaToastProvider>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8BA,MAAM,QAAQ;EAad,MAAM,EAAE,QAAQ,SAAS,WAAW,UAAS;EAE7C,SAAS,iBAAiB,IAAY,MAAe;AACnD,OAAI,CAAC,MAAM;AACT,YAAQ,GAAE;AACV,qBAAiB,OAAO,GAAG,EAAE,IAAG;;;EAIpC,MAAM,mBAAmB,eAA2C;AASlE,UAR+D;IAC7D,aAAa;IACb,cAAc;IACd,YAAY;IACZ,gBAAgB;IAChB,iBAAiB;IACjB,eAAe;IACjB,CACW,MAAM,aAAa;IAC/B;EAED,MAAM,SAAS,eAAe,cAAc,EAAE,WAAW,iBAAiB,OAAO,CAAC,CAAA;EAElF,MAAM,iBAAiB,eACrB,OAAO,MAAM,QAAQ,OAAO,EAAE,YAAY,oBAAoB,MAAM,SAAS,CAC/E;;uBAKE,YAkCoB,MAAA,cAAA,EAAA,EAlCA,mBAAiB,QAAA,gBAAc,EAAA;2BAiC7B,CAhCpB,YAgCoB,MAAA,cAAA,EAAA;KA/BjB,QAAQ,QAAA;KACR,OAAO,QAAA;KACP,OAAK,eAAE,MAAA,iBAAgB,CAAC,OAAA,MAAO,QAAM,EAAI,MAAM,MAAK,CAAA;;4BAGpB,EAAA,UAAA,KAAA,EADjC,mBAyBQ,UAAA,MAAA,WAxBU,eAAA,QAAT,UAAK;0BADd,YAyBQ,eAAA;OAvBL,KAAK,MAAM;OACX,MAAM,MAAM;OACZ,UAAU,MAAM;OAChB,UAAU,MAAM;OAChB,SAAS,MAAM;OACf,kBAAc,SAAS,iBAAiB,MAAM,IAAI,KAAI;;8BAOjD,CALN,mBAKM,OAAA,EALA,OAAK,eAAE,OAAA,MAAO,SAAO,CAAA,EAAA,EAAA,CACzB,YAA0C,oBAAA,MAAA;+BAAb,CAAA,gBAAA,gBAAd,MAAM,MAAK,EAAA,EAAA,CAAA,CAAA;;iBACF,MAAM,eAAA,WAAA,EAA9B,YAEmB,0BAAA,EAAA,KAAA,GAAA,EAAA;+BADM,CAAA,gBAAA,gBAApB,MAAM,YAAW,EAAA,EAAA,CAAA,CAAA;;sDAGxB,mBASM,OATN,YASM,CAPI,MAAM,UAAA,WAAA,EADd,YAMc,qBAAA;;QAJX,YAAU,MAAM,OAAO;QACvB,SAAO,MAAM,OAAQ;;+BAEE,CAAA,gBAAA,gBAArB,MAAM,OAAO,MAAK,EAAA,EAAA,CAAA,CAAA;;0EAEvB,YAAyC,oBAAA,EAA5B,UAAK,WAAE,MAAA,QAAO,CAAC,MAAM,GAAE,EAAA,EAAA,MAAA,GAAA,CAAA,UAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;;;;;;;;gBAGxC,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"ToastViewport.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toast/ToastViewport.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * ToastViewport — Renders toasts for one screen position.\n *\n * Each viewport wraps its own RekaToastProvider so its ToastRoot children\n * teleport to THIS viewport, not a shared one. Without an isolated provider\n * per viewport, all ToastRoots teleport to whichever viewport mounted last.\n *\n * Usage:\n * ```vue\n * <ToastProvider>\n *   <ToastViewport position=\"top-right\" />\n *   <ToastViewport position=\"bottom-right\" />\n * </ToastProvider>\n * ```\n */\nimport { computed } from 'vue'\nimport { ToastProvider as RekaToastProvider, ToastViewport as RekaToastViewport } from 'reka-ui'\nimport { toastVariants } from '@auronui/styles'\nimport type { ToastVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToast } from '../../composables/useToast'\nimport Toast from './Toast.vue'\nimport ToastTitle from './ToastTitle.vue'\nimport ToastDescription from './ToastDescription.vue'\nimport ToastAction from './ToastAction.vue'\nimport ToastClose from './ToastClose.vue'\n\ntype ToastPosition = 'top-right' | 'top-center' | 'top-left' | 'bottom-right' | 'bottom-center' | 'bottom-left'\n\nconst props = withDefaults(defineProps<{\n  position?: ToastPosition\n  class?: string\n  hotkey?: string[]\n  label?: string\n  swipeDirection?: 'up' | 'down' | 'left' | 'right'\n  /** Default duration for toasts in this provider (ms) */\n  duration?: number\n  /** Disable swipe gestures for all toasts in this provider */\n  disableSwipe?: boolean\n  /** Distance in pixels before a swipe is recognised */\n  swipeThreshold?: number\n  /** Render viewport as a different element */\n  as?: string\n  /** Merge viewport props onto child element */\n  asChild?: boolean\n}>(), {\n  position: 'bottom-right',\n  hotkey: () => ['F8'],\n  label: 'Notifications ({hotkey})',\n  swipeDirection: 'right',\n})\n\nconst { toasts, dismiss, remove } = useToast()\n\nfunction handleOpenChange(id: string, open: boolean) {\n  if (!open) {\n    dismiss(id)\n    setTimeout(() => remove(id), 250)\n  }\n}\n\nconst placementVariant = computed<ToastVariants['placement']>(() => {\n  const map: Record<ToastPosition, ToastVariants['placement']> = {\n    'top-right': 'top end',\n    'top-center': 'top',\n    'top-left': 'top start',\n    'bottom-right': 'bottom end',\n    'bottom-center': 'bottom',\n    'bottom-left': 'bottom start',\n  }\n  return map[props.position] ?? 'bottom end'\n})\n\nconst styles = computed(() => toastVariants({ placement: placementVariant.value }))\n\nconst viewportToasts = computed(() =>\n  toasts.value.filter((t) => (t.position ?? 'bottom-right') === props.position),\n)\n</script>\n\n<template>\n  <!-- Each viewport has its own isolated Reka provider so ToastRoot teleports here, not to a shared viewport -->\n  <RekaToastProvider\n    :swipe-direction=\"swipeDirection\"\n    :duration=\"props.duration\"\n    :disable-swipe=\"props.disableSwipe\"\n    :swipe-threshold=\"props.swipeThreshold\"\n  >\n    <RekaToastViewport\n      :hotkey=\"hotkey\"\n      :label=\"label\"\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :class=\"composeClassName(styles.region(), props.class)\"\n    >\n      <Toast\n        v-for=\"toast in viewportToasts\"\n        :key=\"toast.id\"\n        :open=\"toast.open\"\n        :duration=\"toast.duration\"\n        :position=\"toast.position\"\n        :variant=\"toast.variant\"\n        @update:open=\"(open) => handleOpenChange(toast.id, open)\"\n      >\n        <div :class=\"styles.content()\">\n          <ToastTitle>{{ toast.title }}</ToastTitle>\n          <ToastDescription v-if=\"toast.description\">\n            {{ toast.description }}\n          </ToastDescription>\n        </div>\n        <div class=\"flex shrink-0 items-center gap-1 ml-auto\">\n          <ToastAction\n            v-if=\"toast.action\"\n            :alt-text=\"toast.action.label\"\n            @click=\"toast.action!.onClick\"\n          >\n            {{ toast.action.label }}\n          </ToastAction>\n          <ToastClose @click=\"dismiss(toast.id)\" />\n        </div>\n      </Toast>\n      <slot />\n    </RekaToastViewport>\n  </RekaToastProvider>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8BA,MAAM,QAAQ;EAuBd,MAAM,EAAE,QAAQ,SAAS,WAAW,UAAS;EAE7C,SAAS,iBAAiB,IAAY,MAAe;AACnD,OAAI,CAAC,MAAM;AACT,YAAQ,GAAE;AACV,qBAAiB,OAAO,GAAG,EAAE,IAAG;;;EAIpC,MAAM,mBAAmB,eAA2C;AASlE,UAR+D;IAC7D,aAAa;IACb,cAAc;IACd,YAAY;IACZ,gBAAgB;IAChB,iBAAiB;IACjB,eAAe;IACjB,CACW,MAAM,aAAa;IAC/B;EAED,MAAM,SAAS,eAAe,cAAc,EAAE,WAAW,iBAAiB,OAAO,CAAC,CAAA;EAElF,MAAM,iBAAiB,eACrB,OAAO,MAAM,QAAQ,OAAO,EAAE,YAAY,oBAAoB,MAAM,SAAS,CAC/E;;uBAKE,YAyCoB,MAAA,cAAA,EAAA;IAxCjB,mBAAiB,QAAA;IACjB,UAAU,MAAM;IAChB,iBAAe,MAAM;IACrB,mBAAiB,MAAM;;2BAoCJ,CAlCpB,YAkCoB,MAAA,cAAA,EAAA;KAjCjB,QAAQ,QAAA;KACR,OAAO,QAAA;KACP,IAAI,MAAM;KACV,YAAU,MAAM;KAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,OAAA,MAAO,QAAM,EAAI,MAAM,MAAK,CAAA;;4BAGpB,EAAA,UAAA,KAAA,EADjC,mBAyBQ,UAAA,MAAA,WAxBU,eAAA,QAAT,UAAK;0BADd,YAyBQ,eAAA;OAvBL,KAAK,MAAM;OACX,MAAM,MAAM;OACZ,UAAU,MAAM;OAChB,UAAU,MAAM;OAChB,SAAS,MAAM;OACf,kBAAc,SAAS,iBAAiB,MAAM,IAAI,KAAI;;8BAOjD,CALN,mBAKM,OAAA,EALA,OAAK,eAAE,OAAA,MAAO,SAAO,CAAA,EAAA,EAAA,CACzB,YAA0C,oBAAA,MAAA;+BAAb,CAAA,gBAAA,gBAAd,MAAM,MAAK,EAAA,EAAA,CAAA,CAAA;;iBACF,MAAM,eAAA,WAAA,EAA9B,YAEmB,0BAAA,EAAA,KAAA,GAAA,EAAA;+BADM,CAAA,gBAAA,gBAApB,MAAM,YAAW,EAAA,EAAA,CAAA,CAAA;;sDAGxB,mBASM,OATN,YASM,CAPI,MAAM,UAAA,WAAA,EADd,YAMc,qBAAA;;QAJX,YAAU,MAAM,OAAO;QACvB,SAAO,MAAM,OAAQ;;+BAEE,CAAA,gBAAA,gBAArB,MAAM,OAAO,MAAK,EAAA,EAAA,CAAA,CAAA;;0EAEvB,YAAyC,oBAAA,EAA5B,UAAK,WAAE,MAAA,QAAO,CAAC,MAAM,GAAE,EAAA,EAAA,MAAA,GAAA,CAAA,UAAA,CAAA,CAAA,CAAA,CAAA,CAAA;;;;;;;;;gBAGxC,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.js","names":[],"sources":["../../../src/components/toolbar/Toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { ToolbarRoot } from 'reka-ui'\nimport { toolbarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarProvide } from './toolbar.context'\n\nconst props = withDefaults(defineProps<{\n  orientation?: 'horizontal' | 'vertical'\n  loop?: boolean\n  isAttached?: boolean\n  class?: string\n}>(), {\n  orientation: 'horizontal',\n  loop: true,\n  isAttached: false,\n})\n\nuseToolbarProvide({ orientation: toRef(props, 'orientation') })\n\nconst baseClass = computed(() =>\n  toolbarVariants({ orientation: props.orientation, isAttached: props.isAttached })\n)\n</script>\n\n<template>\n  <ToolbarRoot\n    :orientation=\"props.orientation\"\n    :loop=\"props.loop\"\n    :class=\"composeClassName(baseClass, props.class)\"\n    :data-orientation=\"props.orientation\"\n  >\n    <slot />\n  </ToolbarRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"Toolbar.js","names":[],"sources":["../../../src/components/toolbar/Toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { ToolbarRoot } from 'reka-ui'\nimport { toolbarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarProvide } from './toolbar.context'\n\nconst props = withDefaults(defineProps<{\n  orientation?: 'horizontal' | 'vertical'\n  loop?: boolean\n  isAttached?: boolean\n  class?: string\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  orientation: 'horizontal',\n  loop: true,\n  isAttached: false,\n})\n\nuseToolbarProvide({ orientation: toRef(props, 'orientation') })\n\nconst baseClass = computed(() =>\n  toolbarVariants({ orientation: props.orientation, isAttached: props.isAttached })\n)\n</script>\n\n<template>\n  <ToolbarRoot\n    :orientation=\"props.orientation\"\n    :loop=\"props.loop\"\n    :dir=\"props.dir\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(baseClass, props.class)\"\n    :data-orientation=\"props.orientation\"\n  >\n    <slot />\n  </ToolbarRoot>\n</template>\n"],"mappings":""}

package/dist/components/toolbar/Toolbar.vue_vue_type_script_setup_true_lang.js

@@ -16,7 +16,10 @@ var Toolbar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 			type: Boolean,
 			default: false
 		},
-		class: {}
+		class: {},
+		dir: {},
+		as: {},
+		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;
@@ -29,6 +32,9 @@ var Toolbar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 			return openBlock(), createBlock(unref(ToolbarRoot), {
 				orientation: props.orientation,
 				loop: props.loop,
+				dir: props.dir,
+				as: props.as,
+				"as-child": props.asChild,
 				class: normalizeClass(unref(composeClassName)(baseClass.value, props.class)),
 				"data-orientation": props.orientation
 			}, {
@@ -37,6 +43,9 @@ var Toolbar_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 			}, 8, [
 				"orientation",
 				"loop",
+				"dir",
+				"as",
+				"as-child",
 				"class",
 				"data-orientation"
 			]);

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

@@ -1 +1 @@
-{"version":3,"file":"Toolbar.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/Toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { ToolbarRoot } from 'reka-ui'\nimport { toolbarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarProvide } from './toolbar.context'\n\nconst props = withDefaults(defineProps<{\n  orientation?: 'horizontal' | 'vertical'\n  loop?: boolean\n  isAttached?: boolean\n  class?: string\n}>(), {\n  orientation: 'horizontal',\n  loop: true,\n  isAttached: false,\n})\n\nuseToolbarProvide({ orientation: toRef(props, 'orientation') })\n\nconst baseClass = computed(() =>\n  toolbarVariants({ orientation: props.orientation, isAttached: props.isAttached })\n)\n</script>\n\n<template>\n  <ToolbarRoot\n    :orientation=\"props.orientation\"\n    :loop=\"props.loop\"\n    :class=\"composeClassName(baseClass, props.class)\"\n    :data-orientation=\"props.orientation\"\n  >\n    <slot />\n  </ToolbarRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;AAWd,oBAAkB,EAAE,aAAa,MAAM,OAAO,cAAc,EAAE,CAAA;EAE9D,MAAM,YAAY,eAChB,gBAAgB;GAAE,aAAa,MAAM;GAAa,YAAY,MAAM;GAAY,CAAA,CAClF;;uBAIE,YAOc,MAAA,YAAA,EAAA;IANX,aAAa,MAAM;IACnB,MAAM,MAAM;IACZ,OAAK,eAAE,MAAA,iBAAgB,CAAC,UAAA,OAAW,MAAM,MAAK,CAAA;IAC9C,oBAAkB,MAAM;;2BAEjB,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"Toolbar.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/toolbar/Toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef } from 'vue'\nimport { ToolbarRoot } from 'reka-ui'\nimport { toolbarVariants } from '@auronui/styles'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useToolbarProvide } from './toolbar.context'\n\nconst props = withDefaults(defineProps<{\n  orientation?: 'horizontal' | 'vertical'\n  loop?: boolean\n  isAttached?: boolean\n  class?: string\n  /** Text direction */\n  dir?: 'ltr' | 'rtl'\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>(), {\n  orientation: 'horizontal',\n  loop: true,\n  isAttached: false,\n})\n\nuseToolbarProvide({ orientation: toRef(props, 'orientation') })\n\nconst baseClass = computed(() =>\n  toolbarVariants({ orientation: props.orientation, isAttached: props.isAttached })\n)\n</script>\n\n<template>\n  <ToolbarRoot\n    :orientation=\"props.orientation\"\n    :loop=\"props.loop\"\n    :dir=\"props.dir\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(baseClass, props.class)\"\n    :data-orientation=\"props.orientation\"\n  >\n    <slot />\n  </ToolbarRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;EAOA,MAAM,QAAQ;AAiBd,oBAAkB,EAAE,aAAa,MAAM,OAAO,cAAc,EAAE,CAAA;EAE9D,MAAM,YAAY,eAChB,gBAAgB;GAAE,aAAa,MAAM;GAAa,YAAY,MAAM;GAAY,CAAA,CAClF;;uBAIE,YAUc,MAAA,YAAA,EAAA;IATX,aAAa,MAAM;IACnB,MAAM,MAAM;IACZ,KAAK,MAAM;IACX,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,UAAA,OAAW,MAAM,MAAK,CAAA;IAC9C,oBAAkB,MAAM;;2BAEjB,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

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}>()\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    :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'\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":""}

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

@@ -10,7 +10,9 @@ var ToolbarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		size: {},
 		isIconOnly: { type: Boolean },
 		disabled: { type: Boolean },
-		class: {}
+		class: {},
+		as: {},
+		asChild: { type: Boolean }
 	},
 	setup(__props) {
 		const props = __props;
@@ -22,11 +24,18 @@ var ToolbarButton_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(ToolbarButton), {
 				disabled: props.disabled,
+				as: props.as,
+				"as-child": props.asChild,
 				class: normalizeClass(unref(composeClassName)(classes.value, props.class))
 			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["disabled", "class"]);
+			}, 8, [
+				"disabled",
+				"as",
+				"as-child",
+				"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}>()\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    :class=\"composeClassName(classes, props.class)\"\n  >\n    <slot />\n  </RekaToolbarButton>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAQd,MAAM,UAAU,eACd,qBAAqB;GACnB,SAAS,MAAM,WAAW;GAC1B,MAAM,MAAM,QAAQ;GACpB,YAAY,MAAM,cAAc;GACjC,CAAA,CACH;;uBAIE,YAKoB,MAAA,cAAA,EAAA;IAJjB,UAAU,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'\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"}

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

@@ -1 +1 @@
-{"version":3,"file":"ToolbarLink.js","names":[],"sources":["../../../src/components/toolbar/ToolbarLink.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToolbarLink as RekaToolbarLink } from 'reka-ui'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  href?: string\n  class?: string\n}>()\n</script>\n\n<template>\n  <RekaToolbarLink\n    :href=\"props.href\"\n    :class=\"composeClassName('link', props.class)\"\n  >\n    <slot />\n  </RekaToolbarLink>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ToolbarLink.js","names":[],"sources":["../../../src/components/toolbar/ToolbarLink.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { ToolbarLink as RekaToolbarLink } from 'reka-ui'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = defineProps<{\n  href?: string\n  class?: string\n  /** Render as a different element */\n  as?: string\n  /** Merge props onto child element */\n  asChild?: boolean\n}>()\n</script>\n\n<template>\n  <RekaToolbarLink\n    :href=\"props.href\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName('link', props.class)\"\n  >\n    <slot />\n  </RekaToolbarLink>\n</template>\n"],"mappings":""}