@auronui/vue 1.0.21 → 1.0.22

package/dist/components/date-time-picker/DateTimePicker.vue_vue_type_script_setup_true_lang.js

@@ -81,10 +81,48 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		},
 		locale: {},
 		defaultValue: {},
+		defaultPlaceholder: {},
+		placeholder: {},
 		minValue: {},
 		maxValue: {},
 		isDateUnavailable: {},
-		isDateDisabled: {}
+		isDateDisabled: {},
+		step: {},
+		dir: {},
+		id: {},
+		modal: { type: Boolean },
+		required: { type: Boolean },
+		pagedNavigation: { type: Boolean },
+		weekStartsOn: {},
+		weekdayFormat: {},
+		fixedWeeks: { type: Boolean },
+		numberOfMonths: {},
+		preventDeselect: { type: Boolean },
+		triggerAs: {},
+		triggerAsChild: { type: Boolean },
+		portal: {},
+		forceMount: { type: Boolean },
+		side: {},
+		sideOffset: {},
+		sideFlip: { type: Boolean },
+		align: {},
+		alignOffset: {},
+		alignFlip: { type: Boolean },
+		avoidCollisions: { type: Boolean },
+		collisionBoundary: {},
+		collisionPadding: {},
+		arrowPadding: {},
+		hideShiftedArrow: { type: Boolean },
+		sticky: {},
+		hideWhenDetached: { type: Boolean },
+		positionStrategy: {},
+		updatePositionStrategy: {},
+		disableUpdateOnLayoutShift: { type: Boolean },
+		prioritizePosition: { type: Boolean },
+		reference: {},
+		contentAs: {},
+		contentAsChild: { type: Boolean },
+		disableOutsidePointerEvents: { type: Boolean }
 	}, {
 		"modelValue": {},
 		"modelModifiers": {},
@@ -94,9 +132,18 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		},
 		"openModifiers": {}
 	}),
-	emits: ["update:modelValue", "update:open"],
-	setup(__props) {
+	emits: /* @__PURE__ */ mergeModels([
+		"update:placeholder",
+		"escape-key-down",
+		"pointer-down-outside",
+		"focus-outside",
+		"interact-outside",
+		"open-auto-focus",
+		"close-auto-focus"
+	], ["update:modelValue", "update:open"]),
+	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const emit = __emit;
 		const modelValue = useModel(__props, "modelValue");
 		const openModel = useModel(__props, "open");
 		const STEP_TITLES = {
@@ -172,11 +219,13 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(DatePickerRoot), {
 				modelValue: modelValue.value,
-				"onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => modelValue.value = $event),
+				"onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => modelValue.value = $event),
 				open: openModel.value,
-				"onUpdate:open": _cache[3] || (_cache[3] = ($event) => openModel.value = $event),
+				"onUpdate:open": _cache[9] || (_cache[9] = ($event) => openModel.value = $event),
 				"default-value": __props.defaultValue,
 				"default-open": __props.defaultOpen,
+				"default-placeholder": __props.defaultPlaceholder,
+				placeholder: __props.placeholder,
 				"min-value": __props.minValue,
 				"max-value": __props.maxValue,
 				"is-date-unavailable": __props.isDateUnavailable,
@@ -184,9 +233,20 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				locale: __props.locale,
 				granularity: __props.granularity,
 				"hour-cycle": __props.hourCycle,
+				step: __props.step,
 				disabled: __props.isDisabled,
 				readonly: __props.isReadOnly,
 				name: __props.name,
+				dir: __props.dir,
+				id: __props.id,
+				required: __props.required,
+				modal: __props.modal,
+				"paged-navigation": __props.pagedNavigation,
+				"week-starts-on": __props.weekStartsOn,
+				"weekday-format": __props.weekdayFormat,
+				"fixed-weeks": __props.fixedWeeks,
+				"number-of-months": __props.numberOfMonths,
+				"prevent-deselect": __props.preventDeselect,
 				class: normalizeClass(unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base)),
 				"data-slot": "date-time-picker"
 			}, {
@@ -214,6 +274,8 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				}, {
 					endContent: withCtx(() => [createVNode(unref(DatePickerTrigger), {
 						class: normalizeClass(unref(composeClassName)(slotFns.value.trigger(), props.classNames?.trigger)),
+						as: __props.triggerAs,
+						"as-child": __props.triggerAsChild,
 						"aria-label": "Open date time picker",
 						onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {}, ["prevent"]))
 					}, {
@@ -230,7 +292,7 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 							"stroke-linejoin": "round",
 							"aria-hidden": "true",
 							focusable: "false"
-						}, [..._cache[4] || (_cache[4] = [
+						}, [..._cache[10] || (_cache[10] = [
 							createElementVNode("rect", {
 								x: "3",
 								y: "4",
@@ -259,7 +321,11 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 							}, null, -1)
 						])], 2))])]),
 						_: 3
-					}, 8, ["class"])]),
+					}, 8, [
+						"class",
+						"as",
+						"as-child"
+					])]),
 					_: 3
 				}, 8, [
 					"model-value",
@@ -284,7 +350,35 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				]), createVNode(unref(DatePickerContent), {
 					class: normalizeClass(unref(composeClassName)(slotFns.value.popover(), props.classNames?.popover)),
 					"data-slot": "popover",
-					"side-offset": 8
+					"side-offset": __props.sideOffset ?? 8,
+					portal: __props.portal != null ? { to: __props.portal } : void 0,
+					"force-mount": __props.forceMount,
+					side: __props.side,
+					"side-flip": __props.sideFlip,
+					align: __props.align,
+					"align-offset": __props.alignOffset,
+					"align-flip": __props.alignFlip,
+					"avoid-collisions": __props.avoidCollisions,
+					"collision-boundary": __props.collisionBoundary,
+					"collision-padding": __props.collisionPadding,
+					"arrow-padding": __props.arrowPadding,
+					"hide-shifted-arrow": __props.hideShiftedArrow,
+					sticky: __props.sticky,
+					"hide-when-detached": __props.hideWhenDetached,
+					"position-strategy": __props.positionStrategy,
+					"update-position-strategy": __props.updatePositionStrategy,
+					"disable-update-on-layout-shift": __props.disableUpdateOnLayoutShift,
+					"prioritize-position": __props.prioritizePosition,
+					reference: __props.reference,
+					as: __props.contentAs,
+					"as-child": __props.contentAsChild,
+					"disable-outside-pointer-events": __props.disableOutsidePointerEvents,
+					onEscapeKeyDown: _cache[2] || (_cache[2] = ($event) => emit("escape-key-down", $event)),
+					onPointerDownOutside: _cache[3] || (_cache[3] = ($event) => emit("pointer-down-outside", $event)),
+					onFocusOutside: _cache[4] || (_cache[4] = ($event) => emit("focus-outside", $event)),
+					onInteractOutside: _cache[5] || (_cache[5] = ($event) => emit("interact-outside", $event)),
+					onOpenAutoFocus: _cache[6] || (_cache[6] = ($event) => emit("open-auto-focus", $event)),
+					onCloseAutoFocus: _cache[7] || (_cache[7] = ($event) => emit("close-auto-focus", $event))
 				}, {
 					default: withCtx(() => [createElementVNode("div", {
 						class: normalizeClass(unref(composeClassName)(slotFns.value.stepHeader(), props.classNames?.stepHeader)),
@@ -297,7 +391,7 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 							"aria-label": "Previous step",
 							"data-slot": "back-button",
 							onClick: goBack
-						}, [..._cache[5] || (_cache[5] = [createElementVNode("svg", {
+						}, [..._cache[11] || (_cache[11] = [createElementVNode("svg", {
 							width: "14",
 							height: "14",
 							viewBox: "0 0 24 24",
@@ -318,7 +412,7 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 						}, [activeStep.value === "time" ? (openBlock(), createElementBlock("span", {
 							key: 0,
 							class: normalizeClass(unref(composeClassName)(slotFns.value.doneLabel(), props.classNames?.doneLabel))
-						}, "Done", 2)) : (openBlock(), createElementBlock("svg", _hoisted_3, [..._cache[6] || (_cache[6] = [createElementVNode("polyline", { points: "9 18 15 12 9 6" }, null, -1)])]))], 10, _hoisted_2)
+						}, "Done", 2)) : (openBlock(), createElementBlock("svg", _hoisted_3, [..._cache[12] || (_cache[12] = [createElementVNode("polyline", { points: "9 18 15 12 9 6" }, null, -1)])]))], 10, _hoisted_2)
 					], 2), createElementVNode("div", {
 						class: normalizeClass(unref(composeClassName)(slotFns.value.panelWrap(), props.classNames?.panelWrap)),
 						style: { "overflow": "hidden" }
@@ -377,13 +471,40 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 						_: 1
 					})], 2)]),
 					_: 1
-				}, 8, ["class"])]),
+				}, 8, [
+					"class",
+					"side-offset",
+					"portal",
+					"force-mount",
+					"side",
+					"side-flip",
+					"align",
+					"align-offset",
+					"align-flip",
+					"avoid-collisions",
+					"collision-boundary",
+					"collision-padding",
+					"arrow-padding",
+					"hide-shifted-arrow",
+					"sticky",
+					"hide-when-detached",
+					"position-strategy",
+					"update-position-strategy",
+					"disable-update-on-layout-shift",
+					"prioritize-position",
+					"reference",
+					"as",
+					"as-child",
+					"disable-outside-pointer-events"
+				])]),
 				_: 3
 			}, 8, [
 				"modelValue",
 				"open",
 				"default-value",
 				"default-open",
+				"default-placeholder",
+				"placeholder",
 				"min-value",
 				"max-value",
 				"is-date-unavailable",
@@ -391,9 +512,20 @@ var DateTimePicker_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				"locale",
 				"granularity",
 				"hour-cycle",
+				"step",
 				"disabled",
 				"readonly",
 				"name",
+				"dir",
+				"id",
+				"required",
+				"modal",
+				"paged-navigation",
+				"week-starts-on",
+				"weekday-format",
+				"fixed-weeks",
+				"number-of-months",
+				"prevent-deselect",
 				"class"
 			]);
 		};

package/dist/components/date-time-picker/DateTimePicker.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"DateTimePicker.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/date-time-picker/DateTimePicker.vue"],"sourcesContent":["<!-- packages/vue/src/components/date-time-picker/DateTimePicker.vue -->\n<script setup lang=\"ts\">\nimport { computed, ref, shallowRef, watch } from 'vue'\nimport {\n  DatePickerRoot,\n  DatePickerTrigger,\n  DatePickerContent,\n} from 'reka-ui'\nimport {\n  type DateValue,\n  CalendarDateTime,\n  toCalendarDate,\n  today,\n  getLocalTimeZone,\n} from '@internationalized/date'\nimport { AnimatePresence, motion } from 'motion-v'\nimport { dateTimePickerVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport Calendar from '../calendar/Calendar.vue'\nimport DateInput from '../date-input/DateInput.vue'\nimport DateTimePickerTimeScroller from './DateTimePickerTimeScroller.vue'\n\ntype Step = 'date' | 'time'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  variant?: 'flat' | 'bordered' | 'faded' | 'underlined'\n  size?: 'sm' | 'md' | 'lg'\n  color?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'\n  labelPlacement?: 'inside' | 'outside' | 'outside-left'\n  fullWidth?: boolean\n  label?: string\n  description?: string\n  errorMessage?: string\n  isInvalid?: boolean\n  isDisabled?: boolean\n  isReadOnly?: boolean\n  isRequired?: boolean\n  name?: string\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n    trigger: ClassValue\n    triggerIndicator: ClassValue\n    popover: ClassValue\n    stepHeader: ClassValue\n    navButton: ClassValue\n    stepTitle: ClassValue\n    doneLabel: ClassValue\n    panelWrap: ClassValue\n  }>\n  granularity?: 'minute' | 'second'\n  hourCycle?: 12 | 24\n  hideTimeZone?: boolean\n  defaultOpen?: boolean\n  closeOnSelect?: boolean\n  locale?: string\n  defaultValue?: CalendarDateTime\n  minValue?: CalendarDateTime\n  maxValue?: CalendarDateTime\n  isDateUnavailable?: (date: DateValue) => boolean\n  isDateDisabled?: (date: DateValue) => boolean\n}>(), {\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  hideTimeZone: false,\n  granularity: 'minute',\n  defaultOpen: false,\n  closeOnSelect: true,\n})\n\nconst modelValue = defineModel<CalendarDateTime | null | undefined>('modelValue')\nconst openModel = defineModel<boolean>('open', { default: undefined })\n\nconst STEP_TITLES: Record<Step, string> = {\n  date: 'Pick a date',\n  time: 'Pick a time',\n}\nconst STEP_ORDER: Step[] = ['date', 'time']\n\n// Seed controlled open state from defaultOpen so portal renders in uncontrolled mode too\nif (props.defaultOpen && openModel.value === undefined) {\n  openModel.value = true\n}\n\n// Seed controlled value from defaultValue so DateFieldRoot is always in controlled\n// mode from the start. Without this, an uncontrolled→controlled transition\n// happens mid-lifecycle and Reka's DateFieldRoot won't re-render segments.\nif (modelValue.value == null && props.defaultValue != null) {\n  modelValue.value = props.defaultValue\n}\n\n// Internal working value — always a CalendarDateTime, never null/undefined.\nconst _today = today(getLocalTimeZone())\nconst internalValue = shallowRef<CalendarDateTime>(\n  modelValue.value ?? props.defaultValue ?? new CalendarDateTime(_today.year, _today.month, _today.day, 0, 0),\n)\n\n// Sync inbound: parent resets the value → update internalValue.\n// Guard on CalendarDateTime: ignore CalendarDate emits (no time info).\nwatch(modelValue, (v) => {\n  if (v instanceof CalendarDateTime) internalValue.value = v\n})\n\n// Route segment edits from DateInput back to both internalValue and modelValue.\n// DateInput is bound to internalValue (not modelValue) so this is the only place\n// that propagates user-typed changes outward.\nfunction onInputChange(v: DateValue | null | undefined) {\n  if (!(v instanceof CalendarDateTime)) return\n  internalValue.value = v\n  modelValue.value = v\n}\n\n// ─── Step state ──────────────────────────────────────────────────────────\n\nconst activeStep = ref<Step>('date')\nconst direction = ref<1 | -1>(1)\n\nwatch(openModel, (open) => {\n  if (open) activeStep.value = 'date'\n})\n\nfunction goTo(step: Step) {\n  const from = STEP_ORDER.indexOf(activeStep.value)\n  const to = STEP_ORDER.indexOf(step)\n  direction.value = to > from ? 1 : -1\n  activeStep.value = step\n}\n\nfunction goBack() {\n  const idx = STEP_ORDER.indexOf(activeStep.value)\n  if (idx > 0) goTo(STEP_ORDER[idx - 1])\n}\n\nfunction goForward() {\n  const idx = STEP_ORDER.indexOf(activeStep.value)\n  if (idx < STEP_ORDER.length - 1) {\n    goTo(STEP_ORDER[idx + 1])\n  } else if (props.closeOnSelect) {\n    openModel.value = false\n  }\n}\n\n// ─── Panel animation variants ────────────────────────────────────────────\n\nconst panelInitial = computed(() => ({ x: direction.value > 0 ? '100%' : '-100%', opacity: 0 }))\nconst panelAnimate = { x: '0%', opacity: 1 }\nconst panelExit = computed(() => ({ x: direction.value > 0 ? '-100%' : '100%', opacity: 0 }))\n\n// ─── Calendar value sync ─────────────────────────────────────────────────\n\nconst calendarValue = computed<DateValue | undefined>({\n  // Pass CalendarDate to CalendarRoot — Reka always emits CalendarDate from\n  // onDateChange. The setter reconstructs the full CalendarDateTime.\n  get: () => toCalendarDate(internalValue.value),\n  set: (val) => {\n    if (!val) return\n    internalValue.value = internalValue.value.set({\n      year: val.year,\n      month: val.month,\n      day: val.day,\n    })\n    modelValue.value = internalValue.value\n    goTo('time')\n  },\n})\n\n// ─── Time update ─────────────────────────────────────────────────────────\n\nfunction onTimeUpdate(val: CalendarDateTime) {\n  internalValue.value = val\n  modelValue.value = val\n}\n\n// ─── Styles ──────────────────────────────────────────────────────────────\n\nconst slotFns = computed(() =>\n  dateTimePickerVariants({\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    fullWidth: props.fullWidth,\n  }),\n)\n</script>\n\n<template>\n  <DatePickerRoot\n    v-model=\"modelValue\"\n    v-model:open=\"openModel\"\n    :default-value=\"defaultValue\"\n    :default-open=\"defaultOpen\"\n    :min-value=\"minValue\"\n    :max-value=\"maxValue\"\n    :is-date-unavailable=\"isDateUnavailable\"\n    :is-date-disabled=\"isDateDisabled\"\n    :locale=\"locale\"\n    :granularity=\"granularity\"\n    :hour-cycle=\"hourCycle\"\n    :disabled=\"isDisabled\"\n    :readonly=\"isReadOnly\"\n    :name=\"name\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    data-slot=\"date-time-picker\"\n  >\n    <DateInput\n      :model-value=\"internalValue\"\n      :variant=\"variant\"\n      :size=\"size\"\n      :color=\"color\"\n      :label-placement=\"labelPlacement\"\n      :full-width=\"fullWidth\"\n      :default-value=\"defaultValue\"\n      :granularity=\"granularity\"\n      :hour-cycle=\"hourCycle\"\n      :locale=\"locale\"\n      :label=\"label\"\n      :description=\"description\"\n      :error-message=\"errorMessage\"\n      :is-invalid=\"isInvalid\"\n      :is-disabled=\"isDisabled\"\n      :is-read-only=\"isReadOnly\"\n      :is-required=\"isRequired\"\n      :name=\"name\"\n      :hide-time-zone=\"hideTimeZone\"\n      @update:model-value=\"onInputChange\"\n    >\n      <template #endContent>\n        <DatePickerTrigger\n          :class=\"composeClassName(slotFns.trigger(), props.classNames?.trigger)\"\n          aria-label=\"Open date time picker\"\n          @mousedown.prevent\n        >\n          <slot name=\"selectorIcon\">\n            <svg\n              :class=\"composeClassName(slotFns.triggerIndicator(), props.classNames?.triggerIndicator)\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              width=\"16\"\n              height=\"16\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              aria-hidden=\"true\"\n              focusable=\"false\"\n            >\n              <rect\n                x=\"3\"\n                y=\"4\"\n                width=\"18\"\n                height=\"18\"\n                rx=\"2\"\n                ry=\"2\"\n              />\n              <line\n                x1=\"16\"\n                y1=\"2\"\n                x2=\"16\"\n                y2=\"6\"\n              />\n              <line\n                x1=\"8\"\n                y1=\"2\"\n                x2=\"8\"\n                y2=\"6\"\n              />\n              <line\n                x1=\"3\"\n                y1=\"10\"\n                x2=\"21\"\n                y2=\"10\"\n              />\n            </svg>\n          </slot>\n        </DatePickerTrigger>\n      </template>\n    </DateInput>\n\n    <DatePickerContent\n      :class=\"composeClassName(slotFns.popover(), props.classNames?.popover)\"\n      data-slot=\"popover\"\n      :side-offset=\"8\"\n    >\n      <!-- Step header -->\n      <div\n        :class=\"composeClassName(slotFns.stepHeader(), props.classNames?.stepHeader)\"\n        data-slot=\"step-header\"\n      >\n        <button\n          type=\"button\"\n          :class=\"composeClassName(slotFns.navButton(), props.classNames?.navButton)\"\n          :data-hidden=\"activeStep === 'date' ? 'true' : undefined\"\n          aria-label=\"Previous step\"\n          data-slot=\"back-button\"\n          @click=\"goBack\"\n        >\n          <svg\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"15 18 9 12 15 6\" />\n          </svg>\n        </button>\n\n        <span :class=\"composeClassName(slotFns.stepTitle(), props.classNames?.stepTitle)\">{{ STEP_TITLES[activeStep] }}</span>\n\n        <button\n          type=\"button\"\n          :class=\"composeClassName(slotFns.navButton(), props.classNames?.navButton)\"\n          :aria-label=\"activeStep === 'time' ? 'Done' : 'Next step'\"\n          data-slot=\"forward-button\"\n          @click=\"goForward\"\n        >\n          <span\n            v-if=\"activeStep === 'time'\"\n            :class=\"composeClassName(slotFns.doneLabel(), props.classNames?.doneLabel)\"\n          >Done</span>\n          <svg\n            v-else\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"9 18 15 12 9 6\" />\n          </svg>\n        </button>\n      </div>\n\n      <!-- Sliding panels -->\n      <div\n        :class=\"composeClassName(slotFns.panelWrap(), props.classNames?.panelWrap)\"\n        style=\"overflow: hidden;\"\n      >\n        <AnimatePresence mode=\"popLayout\">\n          <motion.div\n            v-if=\"activeStep === 'date'\"\n            key=\"date\"\n            :initial=\"panelInitial\"\n            :animate=\"panelAnimate\"\n            :exit=\"panelExit\"\n            :transition=\"{ duration: 0.15 }\"\n            class=\"px-3 pb-3\"\n            data-slot=\"calendar-panel\"\n          >\n            <Calendar\n              v-model=\"calendarValue\"\n              :default-value=\"defaultValue\"\n              :min-value=\"minValue\"\n              :max-value=\"maxValue\"\n              :is-date-disabled=\"isDateDisabled\"\n              :is-date-unavailable=\"isDateUnavailable\"\n              :locale=\"locale\"\n              :readonly=\"isReadOnly\"\n              :disabled=\"isDisabled\"\n            />\n          </motion.div>\n\n          <motion.div\n            v-else-if=\"activeStep === 'time'\"\n            key=\"time\"\n            :initial=\"panelInitial\"\n            :animate=\"panelAnimate\"\n            :exit=\"panelExit\"\n            :transition=\"{ duration: 0.15 }\"\n          >\n            <DateTimePickerTimeScroller\n              :model-value=\"internalValue\"\n              :granularity=\"granularity\"\n              :hour-cycle=\"hourCycle\"\n              @update:model-value=\"onTimeUpdate\"\n            />\n          </motion.div>\n        </AnimatePresence>\n      </div>\n    </DatePickerContent>\n  </DatePickerRoot>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"DateTimePicker.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/date-time-picker/DateTimePicker.vue"],"sourcesContent":["<!-- packages/vue/src/components/date-time-picker/DateTimePicker.vue -->\n<script setup lang=\"ts\">\nimport { computed, ref, shallowRef, watch } from 'vue'\nimport {\n  DatePickerRoot,\n  DatePickerTrigger,\n  DatePickerContent,\n} from 'reka-ui'\nimport {\n  type DateValue,\n  CalendarDateTime,\n  toCalendarDate,\n  today,\n  getLocalTimeZone,\n} from '@internationalized/date'\nimport { AnimatePresence, motion } from 'motion-v'\nimport { dateTimePickerVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport Calendar from '../calendar/Calendar.vue'\nimport DateInput from '../date-input/DateInput.vue'\nimport DateTimePickerTimeScroller from './DateTimePickerTimeScroller.vue'\n\ntype Step = 'date' | 'time'\n\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  variant?: 'flat' | 'bordered' | 'faded' | 'underlined'\n  size?: 'sm' | 'md' | 'lg'\n  color?: 'default' | 'primary' | 'secondary' | 'success' | 'warning' | 'danger'\n  labelPlacement?: 'inside' | 'outside' | 'outside-left'\n  fullWidth?: boolean\n  label?: string\n  description?: string\n  errorMessage?: string\n  isInvalid?: boolean\n  isDisabled?: boolean\n  isReadOnly?: boolean\n  isRequired?: boolean\n  name?: string\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    base: ClassValue\n    trigger: ClassValue\n    triggerIndicator: ClassValue\n    popover: ClassValue\n    stepHeader: ClassValue\n    navButton: ClassValue\n    stepTitle: ClassValue\n    doneLabel: ClassValue\n    panelWrap: ClassValue\n  }>\n  granularity?: 'minute' | 'second'\n  hourCycle?: 12 | 24\n  hideTimeZone?: boolean\n  defaultOpen?: boolean\n  closeOnSelect?: boolean\n  locale?: string\n  defaultValue?: CalendarDateTime\n  /** Initial placeholder date for the calendar. */\n  defaultPlaceholder?: DateValue\n  /** Controlled placeholder date. */\n  placeholder?: DateValue\n  minValue?: CalendarDateTime\n  maxValue?: CalendarDateTime\n  isDateUnavailable?: (date: DateValue) => boolean\n  isDateDisabled?: (date: DateValue) => boolean\n  /** Steps for segment keyboard navigation. */\n  step?: Partial<Record<'hour' | 'minute' | 'second' | 'millisecond', number>>\n  /** Text direction. */\n  dir?: 'ltr' | 'rtl'\n  /** HTML id attribute forwarded to the root element. */\n  id?: string\n  /** Whether the calendar popover is modal (traps focus). */\n  modal?: boolean\n  /** Marks the field as required. */\n  required?: boolean\n  /** Use paged navigation in the calendar. */\n  pagedNavigation?: boolean\n  /** Day the week starts on. */\n  weekStartsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6\n  /** Format for weekday header cells. */\n  weekdayFormat?: 'narrow' | 'short' | 'long'\n  /** Always show 6 weeks per month. */\n  fixedWeeks?: boolean\n  /** Number of months shown in the calendar. */\n  numberOfMonths?: number\n  /** Prevent deselecting a selected date. */\n  preventDeselect?: boolean\n  /** Render trigger as a different element. */\n  triggerAs?: string\n  /** Render trigger child as root element. */\n  triggerAsChild?: boolean\n  /** Portal target for the content. */\n  portal?: string | HTMLElement\n  /** Force the content to stay mounted. */\n  forceMount?: boolean\n  /** Side of the anchor the content appears on. */\n  side?: 'top' | 'right' | 'bottom' | 'left'\n  /** Distance in px from the anchor. */\n  sideOffset?: number\n  /** Allow flipping to opposite side. */\n  sideFlip?: boolean\n  /** Alignment of the content relative to the anchor. */\n  align?: 'start' | 'center' | 'end'\n  /** Offset along the align axis. */\n  alignOffset?: number\n  /** Allow flipping alignment. */\n  alignFlip?: boolean\n  /** Avoid collisions with the viewport. */\n  avoidCollisions?: boolean\n  /** Elements to use as collision boundaries. */\n  collisionBoundary?: Element | null | Array<Element | null>\n  /** Padding for collision detection. */\n  collisionPadding?: number | Partial<Record<'top' | 'right' | 'bottom' | 'left', number>>\n  /** Padding between arrow and content edge. */\n  arrowPadding?: number\n  /** Hide the arrow when it is shifted. */\n  hideShiftedArrow?: boolean\n  /** Sticky behavior when overflowing. */\n  sticky?: 'partial' | 'always'\n  /** Hide content when anchor is detached. */\n  hideWhenDetached?: boolean\n  /** CSS position strategy. */\n  positionStrategy?: 'fixed' | 'absolute'\n  /** When to recalculate position. */\n  updatePositionStrategy?: 'always' | 'optimized'\n  /** Disable position update on layout shift. */\n  disableUpdateOnLayoutShift?: boolean\n  /** Prioritize keeping content in viewport. */\n  prioritizePosition?: boolean\n  /** Virtual reference element for positioning. */\n  reference?: object | null\n  /** Render content as a different element. */\n  contentAs?: string\n  /** Render content child as root element. */\n  contentAsChild?: boolean\n  /** Disable pointer events outside the content. */\n  disableOutsidePointerEvents?: boolean\n}>(), {\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  hideTimeZone: false,\n  granularity: 'minute',\n  defaultOpen: false,\n  closeOnSelect: true,\n})\n\nconst emit = defineEmits<{\n  'update:placeholder': [value: DateValue | undefined]\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'focus-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\nconst modelValue = defineModel<CalendarDateTime | null | undefined>('modelValue')\nconst openModel = defineModel<boolean>('open', { default: undefined })\n\nconst STEP_TITLES: Record<Step, string> = {\n  date: 'Pick a date',\n  time: 'Pick a time',\n}\nconst STEP_ORDER: Step[] = ['date', 'time']\n\n// Seed controlled open state from defaultOpen so portal renders in uncontrolled mode too\nif (props.defaultOpen && openModel.value === undefined) {\n  openModel.value = true\n}\n\n// Seed controlled value from defaultValue so DateFieldRoot is always in controlled\n// mode from the start. Without this, an uncontrolled→controlled transition\n// happens mid-lifecycle and Reka's DateFieldRoot won't re-render segments.\nif (modelValue.value == null && props.defaultValue != null) {\n  modelValue.value = props.defaultValue\n}\n\n// Internal working value — always a CalendarDateTime, never null/undefined.\nconst _today = today(getLocalTimeZone())\nconst internalValue = shallowRef<CalendarDateTime>(\n  modelValue.value ?? props.defaultValue ?? new CalendarDateTime(_today.year, _today.month, _today.day, 0, 0),\n)\n\n// Sync inbound: parent resets the value → update internalValue.\n// Guard on CalendarDateTime: ignore CalendarDate emits (no time info).\nwatch(modelValue, (v) => {\n  if (v instanceof CalendarDateTime) internalValue.value = v\n})\n\n// Route segment edits from DateInput back to both internalValue and modelValue.\n// DateInput is bound to internalValue (not modelValue) so this is the only place\n// that propagates user-typed changes outward.\nfunction onInputChange(v: DateValue | null | undefined) {\n  if (!(v instanceof CalendarDateTime)) return\n  internalValue.value = v\n  modelValue.value = v\n}\n\n// ─── Step state ──────────────────────────────────────────────────────────\n\nconst activeStep = ref<Step>('date')\nconst direction = ref<1 | -1>(1)\n\nwatch(openModel, (open) => {\n  if (open) activeStep.value = 'date'\n})\n\nfunction goTo(step: Step) {\n  const from = STEP_ORDER.indexOf(activeStep.value)\n  const to = STEP_ORDER.indexOf(step)\n  direction.value = to > from ? 1 : -1\n  activeStep.value = step\n}\n\nfunction goBack() {\n  const idx = STEP_ORDER.indexOf(activeStep.value)\n  if (idx > 0) goTo(STEP_ORDER[idx - 1])\n}\n\nfunction goForward() {\n  const idx = STEP_ORDER.indexOf(activeStep.value)\n  if (idx < STEP_ORDER.length - 1) {\n    goTo(STEP_ORDER[idx + 1])\n  } else if (props.closeOnSelect) {\n    openModel.value = false\n  }\n}\n\n// ─── Panel animation variants ────────────────────────────────────────────\n\nconst panelInitial = computed(() => ({ x: direction.value > 0 ? '100%' : '-100%', opacity: 0 }))\nconst panelAnimate = { x: '0%', opacity: 1 }\nconst panelExit = computed(() => ({ x: direction.value > 0 ? '-100%' : '100%', opacity: 0 }))\n\n// ─── Calendar value sync ─────────────────────────────────────────────────\n\nconst calendarValue = computed<DateValue | undefined>({\n  // Pass CalendarDate to CalendarRoot — Reka always emits CalendarDate from\n  // onDateChange. The setter reconstructs the full CalendarDateTime.\n  get: () => toCalendarDate(internalValue.value),\n  set: (val) => {\n    if (!val) return\n    internalValue.value = internalValue.value.set({\n      year: val.year,\n      month: val.month,\n      day: val.day,\n    })\n    modelValue.value = internalValue.value\n    goTo('time')\n  },\n})\n\n// ─── Time update ─────────────────────────────────────────────────────────\n\nfunction onTimeUpdate(val: CalendarDateTime) {\n  internalValue.value = val\n  modelValue.value = val\n}\n\n// ─── Styles ──────────────────────────────────────────────────────────────\n\nconst slotFns = computed(() =>\n  dateTimePickerVariants({\n    isInvalid: props.isInvalid,\n    isDisabled: props.isDisabled,\n    fullWidth: props.fullWidth,\n  }),\n)\n</script>\n\n<template>\n  <DatePickerRoot\n    v-model=\"modelValue\"\n    v-model:open=\"openModel\"\n    :default-value=\"defaultValue\"\n    :default-open=\"defaultOpen\"\n    :default-placeholder=\"defaultPlaceholder\"\n    :placeholder=\"placeholder\"\n    :min-value=\"minValue\"\n    :max-value=\"maxValue\"\n    :is-date-unavailable=\"isDateUnavailable\"\n    :is-date-disabled=\"isDateDisabled\"\n    :locale=\"locale\"\n    :granularity=\"granularity\"\n    :hour-cycle=\"hourCycle\"\n    :step=\"step\"\n    :disabled=\"isDisabled\"\n    :readonly=\"isReadOnly\"\n    :name=\"name\"\n    :dir=\"dir\"\n    :id=\"id\"\n    :required=\"required\"\n    :modal=\"modal\"\n    :paged-navigation=\"pagedNavigation\"\n    :week-starts-on=\"weekStartsOn\"\n    :weekday-format=\"weekdayFormat\"\n    :fixed-weeks=\"fixedWeeks\"\n    :number-of-months=\"numberOfMonths\"\n    :prevent-deselect=\"preventDeselect\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    data-slot=\"date-time-picker\"\n  >\n    <DateInput\n      :model-value=\"internalValue\"\n      :variant=\"variant\"\n      :size=\"size\"\n      :color=\"color\"\n      :label-placement=\"labelPlacement\"\n      :full-width=\"fullWidth\"\n      :default-value=\"defaultValue\"\n      :granularity=\"granularity\"\n      :hour-cycle=\"hourCycle\"\n      :locale=\"locale\"\n      :label=\"label\"\n      :description=\"description\"\n      :error-message=\"errorMessage\"\n      :is-invalid=\"isInvalid\"\n      :is-disabled=\"isDisabled\"\n      :is-read-only=\"isReadOnly\"\n      :is-required=\"isRequired\"\n      :name=\"name\"\n      :hide-time-zone=\"hideTimeZone\"\n      @update:model-value=\"onInputChange\"\n    >\n      <template #endContent>\n        <DatePickerTrigger\n          :class=\"composeClassName(slotFns.trigger(), props.classNames?.trigger)\"\n          :as=\"triggerAs\"\n          :as-child=\"triggerAsChild\"\n          aria-label=\"Open date time picker\"\n          @mousedown.prevent\n        >\n          <slot name=\"selectorIcon\">\n            <svg\n              :class=\"composeClassName(slotFns.triggerIndicator(), props.classNames?.triggerIndicator)\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              width=\"16\"\n              height=\"16\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n              stroke-linecap=\"round\"\n              stroke-linejoin=\"round\"\n              aria-hidden=\"true\"\n              focusable=\"false\"\n            >\n              <rect\n                x=\"3\"\n                y=\"4\"\n                width=\"18\"\n                height=\"18\"\n                rx=\"2\"\n                ry=\"2\"\n              />\n              <line\n                x1=\"16\"\n                y1=\"2\"\n                x2=\"16\"\n                y2=\"6\"\n              />\n              <line\n                x1=\"8\"\n                y1=\"2\"\n                x2=\"8\"\n                y2=\"6\"\n              />\n              <line\n                x1=\"3\"\n                y1=\"10\"\n                x2=\"21\"\n                y2=\"10\"\n              />\n            </svg>\n          </slot>\n        </DatePickerTrigger>\n      </template>\n    </DateInput>\n\n    <DatePickerContent\n      :class=\"composeClassName(slotFns.popover(), props.classNames?.popover)\"\n      data-slot=\"popover\"\n      :side-offset=\"sideOffset ?? 8\"\n      :portal=\"portal != null ? { to: portal } : undefined\"\n      :force-mount=\"forceMount\"\n      :side=\"side\"\n      :side-flip=\"sideFlip\"\n      :align=\"align\"\n      :align-offset=\"alignOffset\"\n      :align-flip=\"alignFlip\"\n      :avoid-collisions=\"avoidCollisions\"\n      :collision-boundary=\"collisionBoundary\"\n      :collision-padding=\"collisionPadding\"\n      :arrow-padding=\"arrowPadding\"\n      :hide-shifted-arrow=\"hideShiftedArrow\"\n      :sticky=\"sticky\"\n      :hide-when-detached=\"hideWhenDetached\"\n      :position-strategy=\"positionStrategy\"\n      :update-position-strategy=\"updatePositionStrategy\"\n      :disable-update-on-layout-shift=\"disableUpdateOnLayoutShift\"\n      :prioritize-position=\"prioritizePosition\"\n      :reference=\"(reference as any)\"\n      :as=\"contentAs\"\n      :as-child=\"contentAsChild\"\n      :disable-outside-pointer-events=\"disableOutsidePointerEvents\"\n      @escape-key-down=\"emit('escape-key-down', $event)\"\n      @pointer-down-outside=\"emit('pointer-down-outside', $event)\"\n      @focus-outside=\"emit('focus-outside', $event)\"\n      @interact-outside=\"emit('interact-outside', $event)\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <!-- Step header -->\n      <div\n        :class=\"composeClassName(slotFns.stepHeader(), props.classNames?.stepHeader)\"\n        data-slot=\"step-header\"\n      >\n        <button\n          type=\"button\"\n          :class=\"composeClassName(slotFns.navButton(), props.classNames?.navButton)\"\n          :data-hidden=\"activeStep === 'date' ? 'true' : undefined\"\n          aria-label=\"Previous step\"\n          data-slot=\"back-button\"\n          @click=\"goBack\"\n        >\n          <svg\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"15 18 9 12 15 6\" />\n          </svg>\n        </button>\n\n        <span :class=\"composeClassName(slotFns.stepTitle(), props.classNames?.stepTitle)\">{{ STEP_TITLES[activeStep] }}</span>\n\n        <button\n          type=\"button\"\n          :class=\"composeClassName(slotFns.navButton(), props.classNames?.navButton)\"\n          :aria-label=\"activeStep === 'time' ? 'Done' : 'Next step'\"\n          data-slot=\"forward-button\"\n          @click=\"goForward\"\n        >\n          <span\n            v-if=\"activeStep === 'time'\"\n            :class=\"composeClassName(slotFns.doneLabel(), props.classNames?.doneLabel)\"\n          >Done</span>\n          <svg\n            v-else\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2.5\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            aria-hidden=\"true\"\n          >\n            <polyline points=\"9 18 15 12 9 6\" />\n          </svg>\n        </button>\n      </div>\n\n      <!-- Sliding panels -->\n      <div\n        :class=\"composeClassName(slotFns.panelWrap(), props.classNames?.panelWrap)\"\n        style=\"overflow: hidden;\"\n      >\n        <AnimatePresence mode=\"popLayout\">\n          <motion.div\n            v-if=\"activeStep === 'date'\"\n            key=\"date\"\n            :initial=\"panelInitial\"\n            :animate=\"panelAnimate\"\n            :exit=\"panelExit\"\n            :transition=\"{ duration: 0.15 }\"\n            class=\"px-3 pb-3\"\n            data-slot=\"calendar-panel\"\n          >\n            <Calendar\n              v-model=\"calendarValue\"\n              :default-value=\"defaultValue\"\n              :min-value=\"minValue\"\n              :max-value=\"maxValue\"\n              :is-date-disabled=\"isDateDisabled\"\n              :is-date-unavailable=\"isDateUnavailable\"\n              :locale=\"locale\"\n              :readonly=\"isReadOnly\"\n              :disabled=\"isDisabled\"\n            />\n          </motion.div>\n\n          <motion.div\n            v-else-if=\"activeStep === 'time'\"\n            key=\"time\"\n            :initial=\"panelInitial\"\n            :animate=\"panelAnimate\"\n            :exit=\"panelExit\"\n            :transition=\"{ duration: 0.15 }\"\n          >\n            <DateTimePickerTimeScroller\n              :model-value=\"internalValue\"\n              :granularity=\"granularity\"\n              :hour-cycle=\"hourCycle\"\n              @update:model-value=\"onTimeUpdate\"\n            />\n          </motion.div>\n        </AnimatePresence>\n      </div>\n    </DatePickerContent>\n  </DatePickerRoot>\n</template>\n"],"mappings":"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"}

package/dist/components/drawer/DrawerClose.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerClose.js","names":[],"sources":["../../../src/components/drawer/DrawerClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogClose, Primitive } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\n\nconst props = withDefaults(defineProps<{\n  asChild?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n})\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n</script>\n\n<template>\n  <!-- dock mode: close open state directly (no Reka dialog context) -->\n  <Primitive\n    v-if=\"ctx.dock.value\"\n    :as-child=\"props.asChild\"\n    as=\"button\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n    @click=\"ctx.closeDock()\"\n  >\n    <slot />\n  </Primitive>\n\n  <!-- default / inline / hideBackdrop modes: Reka manages close -->\n  <DialogClose\n    v-else\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n  >\n    <slot />\n  </DialogClose>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DrawerClose.js","names":[],"sources":["../../../src/components/drawer/DrawerClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogClose, Primitive } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\n\nconst props = withDefaults(defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n})\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n</script>\n\n<template>\n  <!-- dock mode: close open state directly (no Reka dialog context) -->\n  <Primitive\n    v-if=\"ctx.dock.value\"\n    :as-child=\"props.asChild\"\n    :as=\"props.as ?? 'button'\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n    @click=\"ctx.closeDock()\"\n  >\n    <slot />\n  </Primitive>\n\n  <!-- default / inline / hideBackdrop modes: Reka manages close -->\n  <DialogClose\n    v-else\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n  >\n    <slot />\n  </DialogClose>\n</template>\n"],"mappings":""}

package/dist/components/drawer/DrawerClose.vue_vue_type_script_setup_true_lang.js

@@ -7,6 +7,7 @@ import { DialogClose, Primitive } from "reka-ui";
 var DrawerClose_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "DrawerClose",
 	props: {
+		as: {},
 		asChild: {
 			type: Boolean,
 			default: false
@@ -21,20 +22,29 @@ var DrawerClose_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ de
 			return unref(ctx).dock.value ? (openBlock(), createBlock(unref(Primitive), {
 				key: 0,
 				"as-child": props.asChild,
-				as: "button",
+				as: props.as ?? "button",
 				class: normalizeClass(unref(composeClassName)(unref(styles).closeTrigger(), props.class)),
 				onClick: _cache[0] || (_cache[0] = ($event) => unref(ctx).closeDock())
 			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["as-child", "class"])) : (openBlock(), createBlock(unref(DialogClose), {
+			}, 8, [
+				"as-child",
+				"as",
+				"class"
+			])) : (openBlock(), createBlock(unref(DialogClose), {
 				key: 1,
+				as: props.as,
 				"as-child": props.asChild,
 				class: normalizeClass(unref(composeClassName)(unref(styles).closeTrigger(), props.class))
 			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["as-child", "class"]));
+			}, 8, [
+				"as",
+				"as-child",
+				"class"
+			]));
 		};
 	}
 });

package/dist/components/drawer/DrawerClose.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerClose.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/drawer/DrawerClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogClose, Primitive } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\n\nconst props = withDefaults(defineProps<{\n  asChild?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n})\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n</script>\n\n<template>\n  <!-- dock mode: close open state directly (no Reka dialog context) -->\n  <Primitive\n    v-if=\"ctx.dock.value\"\n    :as-child=\"props.asChild\"\n    as=\"button\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n    @click=\"ctx.closeDock()\"\n  >\n    <slot />\n  </Primitive>\n\n  <!-- default / inline / hideBackdrop modes: Reka manages close -->\n  <DialogClose\n    v-else\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n  >\n    <slot />\n  </DialogClose>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAOd,MAAM,MAAM,iBAAgB;EAC5B,MAAM,SAAS,gBAAe;;UAMpB,MAAA,IAAG,CAAC,KAAK,SAAA,WAAA,EADjB,YAQY,MAAA,UAAA,EAAA;;IANT,YAAU,MAAM;IACjB,IAAG;IACF,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,cAAY,EAAI,MAAM,MAAK,CAAA;IAC1D,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAA,IAAG,CAAC,WAAS;;2BAEb,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;iDAIV,YAMc,MAAA,YAAA,EAAA;;IAJX,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,cAAY,EAAI,MAAM,MAAK,CAAA;;2BAEnD,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"DrawerClose.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/drawer/DrawerClose.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogClose, Primitive } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\n\nconst props = withDefaults(defineProps<{\n  as?: string\n  asChild?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n})\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n</script>\n\n<template>\n  <!-- dock mode: close open state directly (no Reka dialog context) -->\n  <Primitive\n    v-if=\"ctx.dock.value\"\n    :as-child=\"props.asChild\"\n    :as=\"props.as ?? 'button'\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n    @click=\"ctx.closeDock()\"\n  >\n    <slot />\n  </Primitive>\n\n  <!-- default / inline / hideBackdrop modes: Reka manages close -->\n  <DialogClose\n    v-else\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(styles.closeTrigger(), props.class)\"\n  >\n    <slot />\n  </DialogClose>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAQd,MAAM,MAAM,iBAAgB;EAC5B,MAAM,SAAS,gBAAe;;UAMpB,MAAA,IAAG,CAAC,KAAK,SAAA,WAAA,EADjB,YAQY,MAAA,UAAA,EAAA;;IANT,YAAU,MAAM;IAChB,IAAI,MAAM,MAAE;IACZ,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,cAAY,EAAI,MAAM,MAAK,CAAA;IAC1D,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,MAAA,IAAG,CAAC,WAAS;;2BAEb,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;;;;;uBAIV,YAOc,MAAA,YAAA,EAAA;;IALX,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,cAAY,EAAI,MAAM,MAAK,CAAA;;2BAEnD,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/drawer/DrawerContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.js","names":[],"sources":["../../../src/components/drawer/DrawerContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { DialogPortal, DialogContent } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\nimport DrawerOverlay from './DrawerOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  class?: string\n}>(), {})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n\nconst isHorizontal = computed(() =>\n  ctx.placement.value === 'left' || ctx.placement.value === 'right',\n)\nconst dockTransitionName = computed(() =>\n  isHorizontal.value ? 'drawer-dock-h' : 'drawer-dock-v',\n)\n\nfunction handlePointerDownOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('pointer-down-outside', event)\n}\n\nfunction handleInteractOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('interact-outside', event)\n}\n\nfunction handleEscapeKeyDown(event: KeyboardEvent) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('escape-key-down', event)\n}\n</script>\n\n<template>\n  <!--\n    dock mode: DOM-flow panel that pushes adjacent content aside.\n    The parent Drawer renders a flex container; this panel is a flex item.\n    Requires DrawerMain to wrap the main content area.\n  -->\n  <template v-if=\"ctx.dock.value\">\n    <Transition :name=\"dockTransitionName\">\n      <div\n        v-show=\"ctx.dockOpen.value\"\n        :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, dock: true }), props.class)\"\n        :data-placement=\"ctx.placement.value\"\n        :data-state=\"ctx.dockOpen.value ? 'open' : 'closed'\"\n      >\n        <slot />\n      </div>\n    </Transition>\n  </template>\n\n  <!--\n    inline mode: renders position:absolute within the nearest positioned container.\n    The parent element must have position:relative and overflow:hidden.\n  -->\n  <template v-else-if=\"ctx.inline.value\">\n    <DialogContent\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, inline: true }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </template>\n\n  <!-- default mode: teleported to <body>, optional backdrop -->\n  <DialogPortal v-else>\n    <DrawerOverlay v-if=\"!ctx.hideBackdrop.value\" />\n    <DialogContent\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </DialogPortal>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DrawerContent.js","names":[],"sources":["../../../src/components/drawer/DrawerContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { DialogPortal, DialogContent } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\nimport DrawerOverlay from './DrawerOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  as?: string\n  asChild?: boolean\n  forceMount?: boolean\n  disableOutsidePointerEvents?: boolean\n  to?: string | HTMLElement\n  disabled?: boolean\n  defer?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n  forceMount: false,\n  disableOutsidePointerEvents: false,\n  disabled: false,\n  defer: false,\n})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n  'focus-outside': [event: Event]\n}>()\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n\nconst isHorizontal = computed(() =>\n  ctx.placement.value === 'left' || ctx.placement.value === 'right',\n)\nconst dockTransitionName = computed(() =>\n  isHorizontal.value ? 'drawer-dock-h' : 'drawer-dock-v',\n)\n\nfunction handlePointerDownOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('pointer-down-outside', event)\n}\n\nfunction handleInteractOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('interact-outside', event)\n}\n\nfunction handleEscapeKeyDown(event: KeyboardEvent) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('escape-key-down', event)\n}\n</script>\n\n<template>\n  <!--\n    dock mode: DOM-flow panel that pushes adjacent content aside.\n    The parent Drawer renders a flex container; this panel is a flex item.\n    Requires DrawerMain to wrap the main content area.\n  -->\n  <template v-if=\"ctx.dock.value\">\n    <Transition :name=\"dockTransitionName\">\n      <div\n        v-show=\"ctx.dockOpen.value\"\n        :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, dock: true }), props.class)\"\n        :data-placement=\"ctx.placement.value\"\n        :data-state=\"ctx.dockOpen.value ? 'open' : 'closed'\"\n      >\n        <slot />\n      </div>\n    </Transition>\n  </template>\n\n  <!--\n    inline mode: renders position:absolute within the nearest positioned container.\n    The parent element must have position:relative and overflow:hidden.\n  -->\n  <template v-else-if=\"ctx.inline.value\">\n    <DialogContent\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :force-mount=\"props.forceMount\"\n      :disable-outside-pointer-events=\"props.disableOutsidePointerEvents\"\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, inline: true }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n      @focus-outside=\"emit('focus-outside', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </template>\n\n  <!-- default mode: teleported to <body>, optional backdrop -->\n  <DialogPortal v-else :to=\"props.to\" :disabled=\"props.disabled\" :defer=\"props.defer\" :force-mount=\"props.forceMount\">\n    <DrawerOverlay v-if=\"!ctx.hideBackdrop.value\" />\n    <DialogContent\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :force-mount=\"props.forceMount\"\n      :disable-outside-pointer-events=\"props.disableOutsidePointerEvents\"\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n      @focus-outside=\"emit('focus-outside', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </DialogPortal>\n</template>\n"],"mappings":""}

package/dist/components/drawer/DrawerContent.vue_vue_type_script_setup_true_lang.js

@@ -8,13 +8,38 @@ import { DialogContent, DialogPortal } from "reka-ui";
 var _hoisted_1 = ["data-placement", "data-state"];
 var DrawerContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "DrawerContent",
-	props: { class: {} },
+	props: {
+		as: {},
+		asChild: {
+			type: Boolean,
+			default: false
+		},
+		forceMount: {
+			type: Boolean,
+			default: false
+		},
+		disableOutsidePointerEvents: {
+			type: Boolean,
+			default: false
+		},
+		to: {},
+		disabled: {
+			type: Boolean,
+			default: false
+		},
+		defer: {
+			type: Boolean,
+			default: false
+		},
+		class: {}
+	},
 	emits: [
 		"escape-key-down",
 		"pointer-down-outside",
 		"interact-outside",
 		"open-auto-focus",
-		"close-auto-focus"
+		"close-auto-focus",
+		"focus-outside"
 	],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
@@ -60,6 +85,10 @@ var DrawerContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				_: 3
 			}, 8, ["name"])) : unref(ctx).inline.value ? (openBlock(), createBlock(unref(DialogContent), {
 				key: 1,
+				as: props.as,
+				"as-child": props.asChild,
+				"force-mount": props.forceMount,
+				"disable-outside-pointer-events": props.disableOutsidePointerEvents,
 				class: normalizeClass(unref(composeClassName)(unref(styles).dialog({
 					placement: unref(ctx).placement.value,
 					inline: true
@@ -69,25 +98,56 @@ var DrawerContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */
 				onInteractOutside: handleInteractOutside,
 				onEscapeKeyDown: handleEscapeKeyDown,
 				onOpenAutoFocus: _cache[0] || (_cache[0] = ($event) => emit("open-auto-focus", $event)),
-				onCloseAutoFocus: _cache[1] || (_cache[1] = ($event) => emit("close-auto-focus", $event))
+				onCloseAutoFocus: _cache[1] || (_cache[1] = ($event) => emit("close-auto-focus", $event)),
+				onFocusOutside: _cache[2] || (_cache[2] = ($event) => emit("focus-outside", $event))
 			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			}, 8, ["class", "data-placement"])) : (openBlock(), createBlock(unref(DialogPortal), { key: 2 }, {
+			}, 8, [
+				"as",
+				"as-child",
+				"force-mount",
+				"disable-outside-pointer-events",
+				"class",
+				"data-placement"
+			])) : (openBlock(), createBlock(unref(DialogPortal), {
+				key: 2,
+				to: props.to,
+				disabled: props.disabled,
+				defer: props.defer,
+				"force-mount": props.forceMount
+			}, {
 				default: withCtx(() => [!unref(ctx).hideBackdrop.value ? (openBlock(), createBlock(DrawerOverlay_default, { key: 0 })) : createCommentVNode("", true), createVNode(unref(DialogContent), {
+					as: props.as,
+					"as-child": props.asChild,
+					"force-mount": props.forceMount,
+					"disable-outside-pointer-events": props.disableOutsidePointerEvents,
 					class: normalizeClass(unref(composeClassName)(unref(styles).dialog({ placement: unref(ctx).placement.value }), props.class)),
 					"data-placement": unref(ctx).placement.value,
 					onPointerDownOutside: handlePointerDownOutside,
 					onInteractOutside: handleInteractOutside,
 					onEscapeKeyDown: handleEscapeKeyDown,
-					onOpenAutoFocus: _cache[2] || (_cache[2] = ($event) => emit("open-auto-focus", $event)),
-					onCloseAutoFocus: _cache[3] || (_cache[3] = ($event) => emit("close-auto-focus", $event))
+					onOpenAutoFocus: _cache[3] || (_cache[3] = ($event) => emit("open-auto-focus", $event)),
+					onCloseAutoFocus: _cache[4] || (_cache[4] = ($event) => emit("close-auto-focus", $event)),
+					onFocusOutside: _cache[5] || (_cache[5] = ($event) => emit("focus-outside", $event))
 				}, {
 					default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 					_: 3
-				}, 8, ["class", "data-placement"])]),
+				}, 8, [
+					"as",
+					"as-child",
+					"force-mount",
+					"disable-outside-pointer-events",
+					"class",
+					"data-placement"
+				])]),
 				_: 3
-			}));
+			}, 8, [
+				"to",
+				"disabled",
+				"defer",
+				"force-mount"
+			]));
 		};
 	}
 });

package/dist/components/drawer/DrawerContent.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/drawer/DrawerContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { DialogPortal, DialogContent } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\nimport DrawerOverlay from './DrawerOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  class?: string\n}>(), {})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n\nconst isHorizontal = computed(() =>\n  ctx.placement.value === 'left' || ctx.placement.value === 'right',\n)\nconst dockTransitionName = computed(() =>\n  isHorizontal.value ? 'drawer-dock-h' : 'drawer-dock-v',\n)\n\nfunction handlePointerDownOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('pointer-down-outside', event)\n}\n\nfunction handleInteractOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('interact-outside', event)\n}\n\nfunction handleEscapeKeyDown(event: KeyboardEvent) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('escape-key-down', event)\n}\n</script>\n\n<template>\n  <!--\n    dock mode: DOM-flow panel that pushes adjacent content aside.\n    The parent Drawer renders a flex container; this panel is a flex item.\n    Requires DrawerMain to wrap the main content area.\n  -->\n  <template v-if=\"ctx.dock.value\">\n    <Transition :name=\"dockTransitionName\">\n      <div\n        v-show=\"ctx.dockOpen.value\"\n        :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, dock: true }), props.class)\"\n        :data-placement=\"ctx.placement.value\"\n        :data-state=\"ctx.dockOpen.value ? 'open' : 'closed'\"\n      >\n        <slot />\n      </div>\n    </Transition>\n  </template>\n\n  <!--\n    inline mode: renders position:absolute within the nearest positioned container.\n    The parent element must have position:relative and overflow:hidden.\n  -->\n  <template v-else-if=\"ctx.inline.value\">\n    <DialogContent\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, inline: true }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </template>\n\n  <!-- default mode: teleported to <body>, optional backdrop -->\n  <DialogPortal v-else>\n    <DrawerOverlay v-if=\"!ctx.hideBackdrop.value\" />\n    <DialogContent\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </DialogPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;EAQA,MAAM,QAAQ;EAId,MAAM,OAAO;EAQb,MAAM,MAAM,iBAAgB;EAC5B,MAAM,SAAS,gBAAe;EAE9B,MAAM,eAAe,eACnB,IAAI,UAAU,UAAU,UAAU,IAAI,UAAU,UAAU,QAC5D;EACA,MAAM,qBAAqB,eACzB,aAAa,QAAQ,kBAAkB,gBACzC;EAEA,SAAS,yBAAyB,OAAc;AAC9C,OAAI,IAAI,aAAa,OAAO;AAE1B,UAAM,gBAAe;AACrB;;AAEF,QAAK,wBAAwB,MAAK;;EAGpC,SAAS,sBAAsB,OAAc;AAC3C,OAAI,IAAI,aAAa,OAAO;AAE1B,UAAM,gBAAe;AACrB;;AAEF,QAAK,oBAAoB,MAAK;;EAGhC,SAAS,oBAAoB,OAAsB;AACjD,OAAI,IAAI,aAAa,OAAO;AAE1B,UAAM,gBAAe;AACrB;;AAEF,QAAK,mBAAmB,MAAK;;;UAUb,MAAA,IAAG,CAAC,KAAK,SAAA,WAAA,EACvB,YASa,YAAA;;IATA,MAAM,mBAAA;;2BAQX,CAAA,eAPN,mBAOM,OAAA;KALH,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAM;MAAA,WAAc,MAAA,IAAG,CAAC,UAAU;MAAK,MAAA;MAAA,CAAA,EAAiB,MAAM,MAAK,CAAA;KAClG,kBAAgB,MAAA,IAAG,CAAC,UAAU;KAC9B,cAAY,MAAA,IAAG,CAAC,SAAS,QAAK,SAAA;QAE/B,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,IAAA,WAAA,EAAA,CAAA,CAAA,OALA,MAAA,IAAG,CAAC,SAAS,MAAK,CAAA,CAAA,CAAA,CAAA;;sBAcX,MAAA,IAAG,CAAC,OAAO,SAAA,WAAA,EAC9B,YAUgB,MAAA,cAAA,EAAA;;IATb,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAM;KAAA,WAAc,MAAA,IAAG,CAAC,UAAU;KAAK,QAAA;KAAA,CAAA,EAAmB,MAAM,MAAK,CAAA;IACpG,kBAAgB,MAAA,IAAG,CAAC,UAAU;IAC9B,sBAAsB;IACtB,mBAAkB;IAClB,iBAAiB;IACjB,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;IAC/C,kBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;;2BAE1C,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA;;uDAKZ,YAae,MAAA,aAAA,EAAA,EAAA,KAAA,GAAA,EAAA;2BAZmC,CAAA,CAA1B,MAAA,IAAG,CAAC,aAAa,SAAA,WAAA,EAAvC,YAAgD,uBAAA,EAAA,KAAA,GAAA,CAAA,IAAA,mBAAA,IAAA,KAAA,EAChD,YAUgB,MAAA,cAAA,EAAA;KATb,OAAK,eAAE,MAAA,iBAAgB,CAAC,MAAA,OAAM,CAAC,OAAM,EAAA,WAAc,MAAA,IAAG,CAAC,UAAU,OAAK,CAAA,EAAK,MAAM,MAAK,CAAA;KACtF,kBAAgB,MAAA,IAAG,CAAC,UAAU;KAC9B,sBAAsB;KACtB,mBAAkB;KAClB,iBAAiB;KACjB,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,kBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;;4BAE1C,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"DrawerContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/drawer/DrawerContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { DialogPortal, DialogContent } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\nimport { useDrawerInject } from './drawer.context'\nimport DrawerOverlay from './DrawerOverlay.vue'\n\nconst props = withDefaults(defineProps<{\n  as?: string\n  asChild?: boolean\n  forceMount?: boolean\n  disableOutsidePointerEvents?: boolean\n  to?: string | HTMLElement\n  disabled?: boolean\n  defer?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n  forceMount: false,\n  disableOutsidePointerEvents: false,\n  disabled: false,\n  defer: false,\n})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n  'focus-outside': [event: Event]\n}>()\n\nconst ctx = useDrawerInject()\nconst styles = drawerVariants()\n\nconst isHorizontal = computed(() =>\n  ctx.placement.value === 'left' || ctx.placement.value === 'right',\n)\nconst dockTransitionName = computed(() =>\n  isHorizontal.value ? 'drawer-dock-h' : 'drawer-dock-v',\n)\n\nfunction handlePointerDownOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('pointer-down-outside', event)\n}\n\nfunction handleInteractOutside(event: Event) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('interact-outside', event)\n}\n\nfunction handleEscapeKeyDown(event: KeyboardEvent) {\n  if (ctx.hideBackdrop.value) {\n    // Prevent close — user must use the close icon\n    event.preventDefault()\n    return\n  }\n  emit('escape-key-down', event)\n}\n</script>\n\n<template>\n  <!--\n    dock mode: DOM-flow panel that pushes adjacent content aside.\n    The parent Drawer renders a flex container; this panel is a flex item.\n    Requires DrawerMain to wrap the main content area.\n  -->\n  <template v-if=\"ctx.dock.value\">\n    <Transition :name=\"dockTransitionName\">\n      <div\n        v-show=\"ctx.dockOpen.value\"\n        :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, dock: true }), props.class)\"\n        :data-placement=\"ctx.placement.value\"\n        :data-state=\"ctx.dockOpen.value ? 'open' : 'closed'\"\n      >\n        <slot />\n      </div>\n    </Transition>\n  </template>\n\n  <!--\n    inline mode: renders position:absolute within the nearest positioned container.\n    The parent element must have position:relative and overflow:hidden.\n  -->\n  <template v-else-if=\"ctx.inline.value\">\n    <DialogContent\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :force-mount=\"props.forceMount\"\n      :disable-outside-pointer-events=\"props.disableOutsidePointerEvents\"\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value, inline: true }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n      @focus-outside=\"emit('focus-outside', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </template>\n\n  <!-- default mode: teleported to <body>, optional backdrop -->\n  <DialogPortal v-else :to=\"props.to\" :disabled=\"props.disabled\" :defer=\"props.defer\" :force-mount=\"props.forceMount\">\n    <DrawerOverlay v-if=\"!ctx.hideBackdrop.value\" />\n    <DialogContent\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :force-mount=\"props.forceMount\"\n      :disable-outside-pointer-events=\"props.disableOutsidePointerEvents\"\n      :class=\"composeClassName(styles.dialog({ placement: ctx.placement.value }), props.class)\"\n      :data-placement=\"ctx.placement.value\"\n      @pointer-down-outside=\"handlePointerDownOutside\"\n      @interact-outside=\"handleInteractOutside\"\n      @escape-key-down=\"handleEscapeKeyDown\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n      @focus-outside=\"emit('focus-outside', $event)\"\n    >\n      <slot />\n    </DialogContent>\n  </DialogPortal>\n</template>\n"],"mappings":"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"}

package/dist/components/drawer/DrawerOverlay.js.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerOverlay.js","names":[],"sources":["../../../src/components/drawer/DrawerOverlay.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogOverlay } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\n\nconst styles = drawerVariants()\n</script>\n\n<template>\n  <DialogOverlay :class=\"styles.backdrop()\" />\n</template>\n"],"mappings":""}
+{"version":3,"file":"DrawerOverlay.js","names":[],"sources":["../../../src/components/drawer/DrawerOverlay.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DialogOverlay } from 'reka-ui'\nimport { drawerVariants } from '@auronui/styles/components/drawer'\nimport { composeClassName } from '../../utils/composeClassName'\n\nconst props = withDefaults(defineProps<{\n  as?: string\n  asChild?: boolean\n  forceMount?: boolean\n  class?: string\n}>(), {\n  asChild: false,\n  forceMount: false,\n})\n\nconst styles = drawerVariants()\n</script>\n\n<template>\n  <DialogOverlay\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :force-mount=\"props.forceMount\"\n    :class=\"composeClassName(styles.backdrop(), props.class)\"\n  />\n</template>\n"],"mappings":""}