@auronui/vue 1.0.20 → 1.0.22

package/dist/components/dropdown/DropdownSubContent.vue_vue_type_script_setup_true_lang.js

@@ -7,27 +7,147 @@ var DropdownSubContent_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 	props: {
 		sideOffset: { default: 4 },
 		alignOffset: { default: -5 },
-		class: { default: void 0 }
+		class: { default: void 0 },
+		forceMount: {
+			type: Boolean,
+			default: void 0
+		},
+		loop: {
+			type: Boolean,
+			default: void 0
+		},
+		sideFlip: {
+			type: Boolean,
+			default: void 0
+		},
+		alignFlip: {
+			type: Boolean,
+			default: void 0
+		},
+		avoidCollisions: {
+			type: Boolean,
+			default: void 0
+		},
+		collisionBoundary: { default: void 0 },
+		collisionPadding: { default: void 0 },
+		arrowPadding: { default: void 0 },
+		hideShiftedArrow: {
+			type: Boolean,
+			default: void 0
+		},
+		sticky: { default: void 0 },
+		hideWhenDetached: {
+			type: Boolean,
+			default: void 0
+		},
+		positionStrategy: { default: void 0 },
+		updatePositionStrategy: { default: void 0 },
+		disableUpdateOnLayoutShift: {
+			type: Boolean,
+			default: void 0
+		},
+		prioritizePosition: {
+			type: Boolean,
+			default: void 0
+		},
+		reference: { default: void 0 },
+		as: { default: void 0 },
+		asChild: {
+			type: Boolean,
+			default: false
+		},
+		to: { default: void 0 },
+		portalDisabled: {
+			type: Boolean,
+			default: void 0
+		},
+		defer: {
+			type: Boolean,
+			default: void 0
+		}
 	},
-	setup(__props) {
+	emits: [
+		"escape-key-down",
+		"pointer-down-outside",
+		"focus-outside",
+		"interact-outside",
+		"entry-focus",
+		"open-auto-focus",
+		"close-auto-focus"
+	],
+	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const emit = __emit;
 		const slots = dropdownVariants();
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(DropdownMenuPortal), null, {
+			return openBlock(), createBlock(unref(DropdownMenuPortal), {
+				to: props.to,
+				disabled: props.portalDisabled,
+				defer: props.defer,
+				"force-mount": props.forceMount
+			}, {
 				default: withCtx(() => [createVNode(unref(DropdownMenuSubContent), {
 					"side-offset": props.sideOffset,
 					"align-offset": props.alignOffset,
-					class: normalizeClass([unref(slots).popover(), props.class])
+					"force-mount": props.forceMount,
+					loop: props.loop,
+					"side-flip": props.sideFlip,
+					"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.as,
+					"as-child": props.asChild,
+					class: normalizeClass([unref(slots).popover(), props.class]),
+					onEscapeKeyDown: _cache[0] || (_cache[0] = ($event) => emit("escape-key-down", $event)),
+					onPointerDownOutside: _cache[1] || (_cache[1] = ($event) => emit("pointer-down-outside", $event)),
+					onFocusOutside: _cache[2] || (_cache[2] = ($event) => emit("focus-outside", $event)),
+					onInteractOutside: _cache[3] || (_cache[3] = ($event) => emit("interact-outside", $event)),
+					onEntryFocus: _cache[4] || (_cache[4] = ($event) => emit("entry-focus", $event)),
+					onOpenAutoFocus: _cache[5] || (_cache[5] = ($event) => emit("open-auto-focus", $event)),
+					onCloseAutoFocus: _cache[6] || (_cache[6] = ($event) => emit("close-auto-focus", $event))
 				}, {
 					default: withCtx(() => [createElementVNode("div", { class: normalizeClass(unref(slots).menu()) }, [renderSlot(_ctx.$slots, "default")], 2)]),
 					_: 3
 				}, 8, [
 					"side-offset",
 					"align-offset",
+					"force-mount",
+					"loop",
+					"side-flip",
+					"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",
 					"class"
 				])]),
 				_: 3
-			});
+			}, 8, [
+				"to",
+				"disabled",
+				"defer",
+				"force-mount"
+			]);
 		};
 	}
 });

package/dist/components/dropdown/DropdownSubContent.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownSubContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/dropdown/DropdownSubContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DropdownMenuSubContent, DropdownMenuPortal } from 'reka-ui'\nimport { dropdownVariants } from '@auronui/styles'\n\nconst props = withDefaults(defineProps<{\n  sideOffset?: number\n  alignOffset?: number\n  class?: string\n}>(), {\n  sideOffset: 4,\n  alignOffset: -5,\n  class: undefined,\n})\n\nconst slots = dropdownVariants()\n</script>\n\n<template>\n  <DropdownMenuPortal>\n    <DropdownMenuSubContent\n      :side-offset=\"props.sideOffset\"\n      :align-offset=\"props.alignOffset\"\n      :class=\"[slots.popover(), props.class]\"\n    >\n      <div :class=\"slots.menu()\">\n        <slot />\n      </div>\n    </DropdownMenuSubContent>\n  </DropdownMenuPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;EAIA,MAAM,QAAQ;EAUd,MAAM,QAAQ,kBAAiB;;uBAI7B,YAUqB,MAAA,mBAAA,EAAA,MAAA;2BADM,CARzB,YAQyB,MAAA,uBAAA,EAAA;KAPtB,eAAa,MAAM;KACnB,gBAAc,MAAM;KACpB,OAAK,eAAA,CAAG,MAAA,MAAK,CAAC,SAAO,EAAI,MAAM,MAAK,CAAA;;4BAI/B,CAFN,mBAEM,OAAA,EAFA,OAAK,eAAE,MAAA,MAAK,CAAC,MAAI,CAAA,EAAA,EAAA,CACrB,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"DropdownSubContent.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/dropdown/DropdownSubContent.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DropdownMenuSubContent, DropdownMenuPortal } from 'reka-ui'\nimport { dropdownVariants } from '@auronui/styles'\n\nconst props = withDefaults(defineProps<{\n  sideOffset?: number\n  alignOffset?: number\n  class?: string\n  /** Keep sub-content mounted even when closed. */\n  forceMount?: boolean\n  /** Keep keyboard focus loop within the content. */\n  loop?: boolean\n  /** Flip to opposite side when there is not enough space. */\n  sideFlip?: boolean\n  /** Flip alignment when there is not enough space. */\n  alignFlip?: boolean\n  /** Avoid collisions with the viewport edges. */\n  avoidCollisions?: boolean\n  /** Boundary element(s) for collision detection. */\n  collisionBoundary?: Element | null | Array<Element | null>\n  /** Padding around collision boundary. */\n  collisionPadding?: number | Partial<Record<'top' | 'right' | 'bottom' | 'left', number>>\n  /** Padding between content and arrow. */\n  arrowPadding?: number\n  /** Hide the arrow when the content is shifted. */\n  hideShiftedArrow?: boolean\n  /** Sticky behavior when scrolling. */\n  sticky?: 'partial' | 'always'\n  /** Hide content when fully detached from trigger. */\n  hideWhenDetached?: boolean\n  /** CSS position strategy for the floating element. */\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 the content in view over alignment. */\n  prioritizePosition?: boolean\n  /** Virtual or DOM reference element to position against. */\n  reference?: object | null\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Portal target element or selector. */\n  to?: string | HTMLElement\n  /** Disable the portal. */\n  portalDisabled?: boolean\n  /** Defer portal rendering. */\n  defer?: boolean\n}>(), {\n  sideOffset: 4,\n  alignOffset: -5,\n  class: undefined,\n  forceMount: undefined,\n  loop: undefined,\n  sideFlip: undefined,\n  alignFlip: undefined,\n  avoidCollisions: undefined,\n  collisionBoundary: undefined,\n  collisionPadding: undefined,\n  arrowPadding: undefined,\n  hideShiftedArrow: undefined,\n  sticky: undefined,\n  hideWhenDetached: undefined,\n  positionStrategy: undefined,\n  updatePositionStrategy: undefined,\n  disableUpdateOnLayoutShift: undefined,\n  prioritizePosition: undefined,\n  reference: undefined,\n  as: undefined,\n  asChild: false,\n  to: undefined,\n  portalDisabled: undefined,\n  defer: undefined,\n})\n\nconst emit = defineEmits<{\n  'escape-key-down': [event: KeyboardEvent]\n  'pointer-down-outside': [event: Event]\n  'focus-outside': [event: Event]\n  'interact-outside': [event: Event]\n  'entry-focus': [event: Event]\n  'open-auto-focus': [event: Event]\n  'close-auto-focus': [event: Event]\n}>()\n\nconst slots = dropdownVariants()\n</script>\n\n<template>\n  <DropdownMenuPortal\n    :to=\"props.to\"\n    :disabled=\"props.portalDisabled\"\n    :defer=\"props.defer\"\n    :force-mount=\"props.forceMount\"\n  >\n    <DropdownMenuSubContent\n      :side-offset=\"props.sideOffset\"\n      :align-offset=\"props.alignOffset\"\n      :force-mount=\"props.forceMount\"\n      :loop=\"props.loop\"\n      :side-flip=\"props.sideFlip\"\n      :align-flip=\"props.alignFlip\"\n      :avoid-collisions=\"props.avoidCollisions\"\n      :collision-boundary=\"props.collisionBoundary\"\n      :collision-padding=\"props.collisionPadding\"\n      :arrow-padding=\"props.arrowPadding\"\n      :hide-shifted-arrow=\"props.hideShiftedArrow\"\n      :sticky=\"props.sticky\"\n      :hide-when-detached=\"props.hideWhenDetached\"\n      :position-strategy=\"props.positionStrategy\"\n      :update-position-strategy=\"props.updatePositionStrategy\"\n      :disable-update-on-layout-shift=\"props.disableUpdateOnLayoutShift\"\n      :prioritize-position=\"props.prioritizePosition\"\n      :reference=\"(props.reference as any)\"\n      :as=\"props.as\"\n      :as-child=\"props.asChild\"\n      :class=\"[slots.popover(), props.class]\"\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      @entry-focus=\"emit('entry-focus', $event)\"\n      @open-auto-focus=\"emit('open-auto-focus', $event)\"\n      @close-auto-focus=\"emit('close-auto-focus', $event)\"\n    >\n      <div :class=\"slots.menu()\">\n        <slot />\n      </div>\n    </DropdownMenuSubContent>\n  </DropdownMenuPortal>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIA,MAAM,QAAQ;EAyEd,MAAM,OAAO;EAUb,MAAM,QAAQ,kBAAiB;;uBAI7B,YAwCqB,MAAA,mBAAA,EAAA;IAvClB,IAAI,MAAM;IACV,UAAU,MAAM;IAChB,OAAO,MAAM;IACb,eAAa,MAAM;;2BAmCK,CAjCzB,YAiCyB,MAAA,uBAAA,EAAA;KAhCtB,eAAa,MAAM;KACnB,gBAAc,MAAM;KACpB,eAAa,MAAM;KACnB,MAAM,MAAM;KACZ,aAAW,MAAM;KACjB,cAAY,MAAM;KAClB,oBAAkB,MAAM;KACxB,sBAAoB,MAAM;KAC1B,qBAAmB,MAAM;KACzB,iBAAe,MAAM;KACrB,sBAAoB,MAAM;KAC1B,QAAQ,MAAM;KACd,sBAAoB,MAAM;KAC1B,qBAAmB,MAAM;KACzB,4BAA0B,MAAM;KAChC,kCAAgC,MAAM;KACtC,uBAAqB,MAAM;KAC3B,WAAY,MAAM;KAClB,IAAI,MAAM;KACV,YAAU,MAAM;KAChB,OAAK,eAAA,CAAG,MAAA,MAAK,CAAC,SAAO,EAAI,MAAM,MAAK,CAAA;KACpC,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,sBAAoB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,wBAAyB,OAAM;KACzD,gBAAa,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,iBAAkB,OAAM;KAC3C,mBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;KACjD,cAAW,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,eAAgB,OAAM;KACvC,iBAAe,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,mBAAoB,OAAM;KAC/C,kBAAgB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,oBAAqB,OAAM;;4BAI5C,CAFN,mBAEM,OAAA,EAFA,OAAK,eAAE,MAAA,MAAK,CAAC,MAAI,CAAA,EAAA,EAAA,CACrB,WAAQ,KAAA,QAAA,UAAA,CAAA,EAAA,EAAA,CAAA,CAAA"}

package/dist/components/dropdown/DropdownSubTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownSubTrigger.js","names":[],"sources":["../../../src/components/dropdown/DropdownSubTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTemplateRef, watchEffect, onUnmounted } from 'vue'\nimport { DropdownMenuSubTrigger } from 'reka-ui'\nimport { menuItemVariants } from '@auronui/styles'\nimport { useDropdownSubInject } from './DropdownSub.context'\n\nconst props = withDefaults(defineProps<{\n  isDisabled?: boolean\n  textValue?: string\n  class?: string\n}>(), {\n  isDisabled: false,\n  textValue: undefined,\n  class: undefined,\n})\n\nconst subCtx = useDropdownSubInject()\nconst slots = menuItemVariants({ variant: 'default' })\nconst triggerRef = useTemplateRef<InstanceType<typeof DropdownMenuSubTrigger>>('trigger')\n\nfunction blockHover(e: Event) {\n  e.stopImmediatePropagation()\n}\n\nlet cleanup: (() => void) | null = null\n\nwatchEffect(() => {\n  cleanup?.()\n  cleanup = null\n  if (!subCtx.openOnHover.value) {\n    const el = (triggerRef.value as { $el?: HTMLElement } | null)?.$el ?? triggerRef.value\n    if (el) {\n      (el as HTMLButtonElement).addEventListener('pointermove', blockHover, true)\n      cleanup = () => (el as HTMLButtonElement).removeEventListener('pointermove', blockHover, true)\n    }\n  }\n})\n\nonUnmounted(() => cleanup?.())\n\nfunction handleClick() {\n  if (!subCtx.openOnHover.value) subCtx.setOpen(!subCtx.open.value)\n}\n</script>\n\n<template>\n  <DropdownMenuSubTrigger\n    ref=\"trigger\"\n    :disabled=\"props.isDisabled\"\n    :text-value=\"props.textValue\"\n    :class=\"[slots.item(), props.class]\"\n    @click=\"handleClick\"\n  >\n    <slot />\n    <span\n      :class=\"slots.submenuIndicator()\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"12\"\n        height=\"12\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        data-slot=\"submenu-indicator\"\n      >\n        <polyline points=\"9 18 15 12 9 6\" />\n      </svg>\n    </span>\n  </DropdownMenuSubTrigger>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DropdownSubTrigger.js","names":[],"sources":["../../../src/components/dropdown/DropdownSubTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTemplateRef, watchEffect, onUnmounted } from 'vue'\nimport { DropdownMenuSubTrigger } from 'reka-ui'\nimport { menuItemVariants } from '@auronui/styles'\nimport { useDropdownSubInject } from './DropdownSub.context'\n\nconst props = withDefaults(defineProps<{\n  isDisabled?: boolean\n  textValue?: string\n  class?: string\n  /** Whether this trigger is disabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n}>(), {\n  isDisabled: false,\n  textValue: undefined,\n  class: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n})\n\nconst subCtx = useDropdownSubInject()\nconst slots = menuItemVariants({ variant: 'default' })\nconst triggerRef = useTemplateRef<InstanceType<typeof DropdownMenuSubTrigger>>('trigger')\n\nfunction blockHover(e: Event) {\n  e.stopImmediatePropagation()\n}\n\nlet cleanup: (() => void) | null = null\n\nwatchEffect(() => {\n  cleanup?.()\n  cleanup = null\n  if (!subCtx.openOnHover.value) {\n    const el = (triggerRef.value as { $el?: HTMLElement } | null)?.$el ?? triggerRef.value\n    if (el) {\n      (el as HTMLButtonElement).addEventListener('pointermove', blockHover, true)\n      cleanup = () => (el as HTMLButtonElement).removeEventListener('pointermove', blockHover, true)\n    }\n  }\n})\n\nonUnmounted(() => cleanup?.())\n\nfunction handleClick() {\n  if (!subCtx.openOnHover.value) subCtx.setOpen(!subCtx.open.value)\n}\n</script>\n\n<template>\n  <DropdownMenuSubTrigger\n    ref=\"trigger\"\n    :disabled=\"props.disabled ?? props.isDisabled\"\n    :text-value=\"props.textValue\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"[slots.item(), props.class]\"\n    @click=\"handleClick\"\n  >\n    <slot />\n    <span\n      :class=\"slots.submenuIndicator()\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"12\"\n        height=\"12\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        data-slot=\"submenu-indicator\"\n      >\n        <polyline points=\"9 18 15 12 9 6\" />\n      </svg>\n    </span>\n  </DropdownMenuSubTrigger>\n</template>\n"],"mappings":""}

package/dist/components/dropdown/DropdownSubTrigger.vue_vue_type_script_setup_true_lang.js

@@ -11,7 +11,16 @@ var DropdownSubTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 			default: false
 		},
 		textValue: { default: void 0 },
-		class: { default: void 0 }
+		class: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		as: { default: void 0 },
+		asChild: {
+			type: Boolean,
+			default: false
+		}
 	},
 	setup(__props) {
 		const props = __props;
@@ -40,8 +49,10 @@ var DropdownSubTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(unref(DropdownMenuSubTrigger), {
 				ref: "trigger",
-				disabled: props.isDisabled,
+				disabled: props.disabled ?? props.isDisabled,
 				"text-value": props.textValue,
+				as: props.as,
+				"as-child": props.asChild,
 				class: normalizeClass([unref(slots).item(), props.class]),
 				onClick: handleClick
 			}, {
@@ -64,6 +75,8 @@ var DropdownSubTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE_
 			}, 8, [
 				"disabled",
 				"text-value",
+				"as",
+				"as-child",
 				"class"
 			]);
 		};

package/dist/components/dropdown/DropdownSubTrigger.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownSubTrigger.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/dropdown/DropdownSubTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTemplateRef, watchEffect, onUnmounted } from 'vue'\nimport { DropdownMenuSubTrigger } from 'reka-ui'\nimport { menuItemVariants } from '@auronui/styles'\nimport { useDropdownSubInject } from './DropdownSub.context'\n\nconst props = withDefaults(defineProps<{\n  isDisabled?: boolean\n  textValue?: string\n  class?: string\n}>(), {\n  isDisabled: false,\n  textValue: undefined,\n  class: undefined,\n})\n\nconst subCtx = useDropdownSubInject()\nconst slots = menuItemVariants({ variant: 'default' })\nconst triggerRef = useTemplateRef<InstanceType<typeof DropdownMenuSubTrigger>>('trigger')\n\nfunction blockHover(e: Event) {\n  e.stopImmediatePropagation()\n}\n\nlet cleanup: (() => void) | null = null\n\nwatchEffect(() => {\n  cleanup?.()\n  cleanup = null\n  if (!subCtx.openOnHover.value) {\n    const el = (triggerRef.value as { $el?: HTMLElement } | null)?.$el ?? triggerRef.value\n    if (el) {\n      (el as HTMLButtonElement).addEventListener('pointermove', blockHover, true)\n      cleanup = () => (el as HTMLButtonElement).removeEventListener('pointermove', blockHover, true)\n    }\n  }\n})\n\nonUnmounted(() => cleanup?.())\n\nfunction handleClick() {\n  if (!subCtx.openOnHover.value) subCtx.setOpen(!subCtx.open.value)\n}\n</script>\n\n<template>\n  <DropdownMenuSubTrigger\n    ref=\"trigger\"\n    :disabled=\"props.isDisabled\"\n    :text-value=\"props.textValue\"\n    :class=\"[slots.item(), props.class]\"\n    @click=\"handleClick\"\n  >\n    <slot />\n    <span\n      :class=\"slots.submenuIndicator()\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"12\"\n        height=\"12\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        data-slot=\"submenu-indicator\"\n      >\n        <polyline points=\"9 18 15 12 9 6\" />\n      </svg>\n    </span>\n  </DropdownMenuSubTrigger>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAUd,MAAM,SAAS,sBAAqB;EACpC,MAAM,QAAQ,iBAAiB,EAAE,SAAS,WAAW,CAAA;EACrD,MAAM,aAAa,eAA4D,UAAS;EAExF,SAAS,WAAW,GAAU;AAC5B,KAAE,0BAAyB;;EAG7B,IAAI,UAA+B;AAEnC,oBAAkB;AAChB,cAAU;AACV,aAAU;AACV,OAAI,CAAC,OAAO,YAAY,OAAO;IAC7B,MAAM,KAAM,WAAW,OAAwC,OAAO,WAAW;AACjF,QAAI,IAAI;AACL,QAAyB,iBAAiB,eAAe,YAAY,KAAI;AAC1E,qBAAiB,GAAyB,oBAAoB,eAAe,YAAY,KAAI;;;IAGlG;AAED,oBAAkB,WAAW,CAAA;EAE7B,SAAS,cAAc;AACrB,OAAI,CAAC,OAAO,YAAY,MAAO,QAAO,QAAQ,CAAC,OAAO,KAAK,MAAK;;;uBAKhE,YA2ByB,MAAA,uBAAA,EAAA;IA1BvB,KAAI;IACH,UAAU,MAAM;IAChB,cAAY,MAAM;IAClB,OAAK,eAAA,CAAG,MAAA,MAAK,CAAC,MAAI,EAAI,MAAM,MAAK,CAAA;IACjC,SAAO;;2BAEA,CAAR,WAAQ,KAAA,QAAA,UAAA,EACR,mBAkBO,QAAA;KAjBJ,OAAK,eAAE,MAAA,MAAK,CAAC,kBAAgB,CAAA;KAC9B,eAAY;sCAEZ,mBAaM,OAAA;KAZJ,OAAM;KACN,OAAM;KACN,QAAO;KACP,SAAQ;KACR,MAAK;KACL,QAAO;KACP,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,aAAU;QAEV,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,EAAA,EAAA,CAAA,CAAA"}
+{"version":3,"file":"DropdownSubTrigger.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/dropdown/DropdownSubTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useTemplateRef, watchEffect, onUnmounted } from 'vue'\nimport { DropdownMenuSubTrigger } from 'reka-ui'\nimport { menuItemVariants } from '@auronui/styles'\nimport { useDropdownSubInject } from './DropdownSub.context'\n\nconst props = withDefaults(defineProps<{\n  isDisabled?: boolean\n  textValue?: string\n  class?: string\n  /** Whether this trigger is disabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n}>(), {\n  isDisabled: false,\n  textValue: undefined,\n  class: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n})\n\nconst subCtx = useDropdownSubInject()\nconst slots = menuItemVariants({ variant: 'default' })\nconst triggerRef = useTemplateRef<InstanceType<typeof DropdownMenuSubTrigger>>('trigger')\n\nfunction blockHover(e: Event) {\n  e.stopImmediatePropagation()\n}\n\nlet cleanup: (() => void) | null = null\n\nwatchEffect(() => {\n  cleanup?.()\n  cleanup = null\n  if (!subCtx.openOnHover.value) {\n    const el = (triggerRef.value as { $el?: HTMLElement } | null)?.$el ?? triggerRef.value\n    if (el) {\n      (el as HTMLButtonElement).addEventListener('pointermove', blockHover, true)\n      cleanup = () => (el as HTMLButtonElement).removeEventListener('pointermove', blockHover, true)\n    }\n  }\n})\n\nonUnmounted(() => cleanup?.())\n\nfunction handleClick() {\n  if (!subCtx.openOnHover.value) subCtx.setOpen(!subCtx.open.value)\n}\n</script>\n\n<template>\n  <DropdownMenuSubTrigger\n    ref=\"trigger\"\n    :disabled=\"props.disabled ?? props.isDisabled\"\n    :text-value=\"props.textValue\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"[slots.item(), props.class]\"\n    @click=\"handleClick\"\n  >\n    <slot />\n    <span\n      :class=\"slots.submenuIndicator()\"\n      aria-hidden=\"true\"\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"12\"\n        height=\"12\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        stroke-width=\"2\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n        data-slot=\"submenu-indicator\"\n      >\n        <polyline points=\"9 18 15 12 9 6\" />\n      </svg>\n    </span>\n  </DropdownMenuSubTrigger>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAmBd,MAAM,SAAS,sBAAqB;EACpC,MAAM,QAAQ,iBAAiB,EAAE,SAAS,WAAW,CAAA;EACrD,MAAM,aAAa,eAA4D,UAAS;EAExF,SAAS,WAAW,GAAU;AAC5B,KAAE,0BAAyB;;EAG7B,IAAI,UAA+B;AAEnC,oBAAkB;AAChB,cAAU;AACV,aAAU;AACV,OAAI,CAAC,OAAO,YAAY,OAAO;IAC7B,MAAM,KAAM,WAAW,OAAwC,OAAO,WAAW;AACjF,QAAI,IAAI;AACL,QAAyB,iBAAiB,eAAe,YAAY,KAAI;AAC1E,qBAAiB,GAAyB,oBAAoB,eAAe,YAAY,KAAI;;;IAGlG;AAED,oBAAkB,WAAW,CAAA;EAE7B,SAAS,cAAc;AACrB,OAAI,CAAC,OAAO,YAAY,MAAO,QAAO,QAAQ,CAAC,OAAO,KAAK,MAAK;;;uBAKhE,YA6ByB,MAAA,uBAAA,EAAA;IA5BvB,KAAI;IACH,UAAU,MAAM,YAAY,MAAM;IAClC,cAAY,MAAM;IAClB,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,OAAK,eAAA,CAAG,MAAA,MAAK,CAAC,MAAI,EAAI,MAAM,MAAK,CAAA;IACjC,SAAO;;2BAEA,CAAR,WAAQ,KAAA,QAAA,UAAA,EACR,mBAkBO,QAAA;KAjBJ,OAAK,eAAE,MAAA,MAAK,CAAC,kBAAgB,CAAA;KAC9B,eAAY;sCAEZ,mBAaM,OAAA;KAZJ,OAAM;KACN,OAAM;KACN,QAAO;KACP,SAAQ;KACR,MAAK;KACL,QAAO;KACP,gBAAa;KACb,kBAAe;KACf,mBAAgB;KAChB,aAAU;QAEV,mBAAoC,YAAA,EAA1B,QAAO,kBAAgB,CAAA,CAAA,EAAA,GAAA,CAAA,EAAA,EAAA,EAAA,CAAA,CAAA"}

package/dist/components/dropdown/DropdownTrigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownTrigger.js","names":[],"sources":["../../../src/components/dropdown/DropdownTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DropdownMenuTrigger } from 'reka-ui'\n</script>\n\n<template>\n  <DropdownMenuTrigger as-child>\n    <slot />\n  </DropdownMenuTrigger>\n</template>\n"],"mappings":""}
+{"version":3,"file":"DropdownTrigger.js","names":[],"sources":["../../../src/components/dropdown/DropdownTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DropdownMenuTrigger } from 'reka-ui'\n\nconst props = withDefaults(defineProps<{\n  /** Whether the trigger is disabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n}>(), {\n  disabled: undefined,\n  as: undefined,\n  asChild: true,\n})\n</script>\n\n<template>\n  <DropdownMenuTrigger\n    :disabled=\"props.disabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n  >\n    <slot />\n  </DropdownMenuTrigger>\n</template>\n"],"mappings":""}

package/dist/components/dropdown/DropdownTrigger.vue_vue_type_script_setup_true_lang.js

@@ -3,12 +3,32 @@ import { DropdownMenuTrigger } from "reka-ui";
 //#region src/components/dropdown/DropdownTrigger.vue?vue&type=script&setup=true&lang.ts
 var DropdownTrigger_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defineComponent({
 	__name: "DropdownTrigger",
+	props: {
+		disabled: {
+			type: Boolean,
+			default: void 0
+		},
+		as: { default: void 0 },
+		asChild: {
+			type: Boolean,
+			default: true
+		}
+	},
 	setup(__props) {
+		const props = __props;
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(unref(DropdownMenuTrigger), { "as-child": "" }, {
+			return openBlock(), createBlock(unref(DropdownMenuTrigger), {
+				disabled: props.disabled,
+				as: props.as,
+				"as-child": props.asChild
+			}, {
 				default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
 				_: 3
-			});
+			}, 8, [
+				"disabled",
+				"as",
+				"as-child"
+			]);
 		};
 	}
 });

package/dist/components/dropdown/DropdownTrigger.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownTrigger.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/dropdown/DropdownTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DropdownMenuTrigger } from 'reka-ui'\n</script>\n\n<template>\n  <DropdownMenuTrigger as-child>\n    <slot />\n  </DropdownMenuTrigger>\n</template>\n"],"mappings":";;;;;;;uBAKE,YAEsB,MAAA,oBAAA,EAAA,EAFD,YAAA,IAAQ,EAAA;2BACnB,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}
+{"version":3,"file":"DropdownTrigger.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/dropdown/DropdownTrigger.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { DropdownMenuTrigger } from 'reka-ui'\n\nconst props = withDefaults(defineProps<{\n  /** Whether the trigger is disabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n}>(), {\n  disabled: undefined,\n  as: undefined,\n  asChild: true,\n})\n</script>\n\n<template>\n  <DropdownMenuTrigger\n    :disabled=\"props.disabled\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n  >\n    <slot />\n  </DropdownMenuTrigger>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;EAGA,MAAM,QAAQ;;uBAeZ,YAMsB,MAAA,oBAAA,EAAA;IALnB,UAAU,MAAM;IAChB,IAAI,MAAM;IACV,YAAU,MAAM;;2BAET,CAAR,WAAQ,KAAA,QAAA,UAAA,CAAA,CAAA"}

package/dist/components/input-otp/InputOTP.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.js","names":[],"sources":["../../../src/components/input-otp/InputOTP.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { PinInputRoot, PinInputInput } from 'reka-ui'\nimport { inputOTPVariants, type InputOTPVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\n\nconst props = withDefaults(defineProps<{\n  length?: number\n  type?: 'text'\n  otp?: boolean\n  mask?: boolean\n  disabled?: boolean\n  placeholder?: string\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  variant?: InputOTPVariants['variant']\n  class?: ClassValue\n  /** Optional per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n    group: ClassValue\n    slot: ClassValue\n  }>\n}>(), {\n  length: 6,\n  type: 'text',\n  otp: true,\n  mask: false,\n  disabled: false,\n  placeholder: '',\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  variant: 'primary',\n  class: undefined,\n  classNames: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'complete': [value: string]\n}>()\n\nconst slotFns = computed(() => inputOTPVariants({ variant: props.variant }))\n\nconst modelValueArray = computed(() =>\n  (props.modelValue ?? '').split('')\n)\n\nconst handleUpdate = (arr: string[]) => emit('update:modelValue', arr.join(''))\nconst handleComplete = (arr: string[]) => emit('complete', arr.join(''))\n</script>\n\n<template>\n  <PinInputRoot\n    :model-value=\"modelValueArray\"\n    :disabled=\"disabled\"\n    :placeholder=\"placeholder\"\n    :type=\"type\"\n    :otp=\"otp\"\n    :mask=\"mask\"\n    :name=\"name\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    @update:model-value=\"handleUpdate\"\n    @complete=\"handleComplete\"\n  >\n    <div :class=\"composeClassName(slotFns.group(), props.classNames?.group)\">\n      <PinInputInput\n        v-for=\"i in length\"\n        :key=\"i - 1\"\n        :index=\"i - 1\"\n        :class=\"composeClassName(slotFns.slot(), props.classNames?.slot)\"\n      />\n    </div>\n  </PinInputRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"InputOTP.js","names":[],"sources":["../../../src/components/input-otp/InputOTP.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { PinInputRoot, PinInputInput } from 'reka-ui'\nimport { inputOTPVariants, type InputOTPVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\n\nconst props = withDefaults(defineProps<{\n  length?: number\n  type?: 'text'\n  otp?: boolean\n  mask?: boolean\n  disabled?: boolean\n  placeholder?: string\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  variant?: InputOTPVariants['variant']\n  /** Text direction forwarded to PinInputRoot. */\n  dir?: 'ltr' | 'rtl'\n  /** HTML id attribute forwarded to PinInputRoot. */\n  id?: string\n  /** Whether PinInputRoot renders as a child element. */\n  asChild?: boolean\n  /** Element or component to render PinInputRoot as. */\n  as?: string\n  /** Whether the input is required. */\n  required?: boolean\n  /** Whether each PinInputInput renders as a child element. */\n  inputAsChild?: boolean\n  /** Element or component to render each PinInputInput as. */\n  inputAs?: string\n  class?: ClassValue\n  /** Optional per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n    group: ClassValue\n    slot: ClassValue\n  }>\n}>(), {\n  length: 6,\n  type: 'text',\n  otp: true,\n  mask: false,\n  disabled: false,\n  placeholder: '',\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  variant: 'primary',\n  dir: undefined,\n  id: undefined,\n  asChild: false,\n  as: undefined,\n  required: false,\n  inputAsChild: false,\n  inputAs: undefined,\n  class: undefined,\n  classNames: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'complete': [value: string]\n}>()\n\nconst slotFns = computed(() => inputOTPVariants({ variant: props.variant }))\n\nconst modelValueArray = computed(() =>\n  (props.modelValue ?? '').split('')\n)\n\nconst handleUpdate = (arr: string[]) => emit('update:modelValue', arr.join(''))\nconst handleComplete = (arr: string[]) => emit('complete', arr.join(''))\n</script>\n\n<template>\n  <PinInputRoot\n    :model-value=\"modelValueArray\"\n    :disabled=\"disabled\"\n    :placeholder=\"placeholder\"\n    :type=\"type\"\n    :otp=\"otp\"\n    :mask=\"mask\"\n    :name=\"name\"\n    :dir=\"props.dir\"\n    :id=\"props.id\"\n    :as-child=\"props.asChild\"\n    :as=\"props.as\"\n    :required=\"props.required\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    @update:model-value=\"handleUpdate\"\n    @complete=\"handleComplete\"\n  >\n    <div :class=\"composeClassName(slotFns.group(), props.classNames?.group)\">\n      <PinInputInput\n        v-for=\"i in length\"\n        :key=\"i - 1\"\n        :index=\"i - 1\"\n        :as-child=\"props.inputAsChild\"\n        :as=\"props.inputAs\"\n        :class=\"composeClassName(slotFns.slot(), props.classNames?.slot)\"\n      />\n    </div>\n  </PinInputRoot>\n</template>\n"],"mappings":""}

package/dist/components/input-otp/InputOTP.vue_vue_type_script_setup_true_lang.js

@@ -25,6 +25,22 @@ var InputOTP_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
 		defaultValue: { default: void 0 },
 		name: { default: void 0 },
 		variant: { default: "primary" },
+		dir: { default: void 0 },
+		id: { default: void 0 },
+		asChild: {
+			type: Boolean,
+			default: false
+		},
+		as: { default: void 0 },
+		required: {
+			type: Boolean,
+			default: false
+		},
+		inputAsChild: {
+			type: Boolean,
+			default: false
+		},
+		inputAs: { default: void 0 },
 		class: {
 			type: [
 				String,
@@ -54,6 +70,11 @@ var InputOTP_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
 				otp: __props.otp,
 				mask: __props.mask,
 				name: __props.name,
+				dir: props.dir,
+				id: props.id,
+				"as-child": props.asChild,
+				as: props.as,
+				required: props.required,
 				class: normalizeClass(unref(composeClassName)(slotFns.value.base(), props.class, props.classNames?.base)),
 				"onUpdate:modelValue": handleUpdate,
 				onComplete: handleComplete
@@ -62,8 +83,15 @@ var InputOTP_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
 					return openBlock(), createBlock(unref(PinInputInput), {
 						key: i - 1,
 						index: i - 1,
+						"as-child": props.inputAsChild,
+						as: props.inputAs,
 						class: normalizeClass(unref(composeClassName)(slotFns.value.slot(), props.classNames?.slot))
-					}, null, 8, ["index", "class"]);
+					}, null, 8, [
+						"index",
+						"as-child",
+						"as",
+						"class"
+					]);
 				}), 128))], 2)]),
 				_: 1
 			}, 8, [
@@ -74,6 +102,11 @@ var InputOTP_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ defin
 				"otp",
 				"mask",
 				"name",
+				"dir",
+				"id",
+				"as-child",
+				"as",
+				"required",
 				"class"
 			]);
 		};

package/dist/components/input-otp/InputOTP.vue_vue_type_script_setup_true_lang.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/input-otp/InputOTP.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { PinInputRoot, PinInputInput } from 'reka-ui'\nimport { inputOTPVariants, type InputOTPVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\n\nconst props = withDefaults(defineProps<{\n  length?: number\n  type?: 'text'\n  otp?: boolean\n  mask?: boolean\n  disabled?: boolean\n  placeholder?: string\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  variant?: InputOTPVariants['variant']\n  class?: ClassValue\n  /** Optional per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n    group: ClassValue\n    slot: ClassValue\n  }>\n}>(), {\n  length: 6,\n  type: 'text',\n  otp: true,\n  mask: false,\n  disabled: false,\n  placeholder: '',\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  variant: 'primary',\n  class: undefined,\n  classNames: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'complete': [value: string]\n}>()\n\nconst slotFns = computed(() => inputOTPVariants({ variant: props.variant }))\n\nconst modelValueArray = computed(() =>\n  (props.modelValue ?? '').split('')\n)\n\nconst handleUpdate = (arr: string[]) => emit('update:modelValue', arr.join(''))\nconst handleComplete = (arr: string[]) => emit('complete', arr.join(''))\n</script>\n\n<template>\n  <PinInputRoot\n    :model-value=\"modelValueArray\"\n    :disabled=\"disabled\"\n    :placeholder=\"placeholder\"\n    :type=\"type\"\n    :otp=\"otp\"\n    :mask=\"mask\"\n    :name=\"name\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    @update:model-value=\"handleUpdate\"\n    @complete=\"handleComplete\"\n  >\n    <div :class=\"composeClassName(slotFns.group(), props.classNames?.group)\">\n      <PinInputInput\n        v-for=\"i in length\"\n        :key=\"i - 1\"\n        :index=\"i - 1\"\n        :class=\"composeClassName(slotFns.slot(), props.classNames?.slot)\"\n      />\n    </div>\n  </PinInputRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAiCd,MAAM,OAAO;EAKb,MAAM,UAAU,eAAe,iBAAiB,EAAE,SAAS,MAAM,SAAS,CAAC,CAAA;EAE3E,MAAM,kBAAkB,gBACrB,MAAM,cAAc,IAAI,MAAM,GAAE,CACnC;EAEA,MAAM,gBAAgB,QAAkB,KAAK,qBAAqB,IAAI,KAAK,GAAG,CAAA;EAC9E,MAAM,kBAAkB,QAAkB,KAAK,YAAY,IAAI,KAAK,GAAG,CAAA;;uBAIrE,YAoBe,MAAA,aAAA,EAAA;IAnBZ,eAAa,gBAAA;IACb,UAAU,QAAA;IACV,aAAa,QAAA;IACb,MAAM,QAAA;IACN,KAAK,QAAA;IACL,MAAM,QAAA;IACN,MAAM,QAAA;IACN,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA;IAC3E,uBAAoB;IACpB,YAAU;;2BASL,CAPN,mBAOM,OAAA,EAPA,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,OAAK,EAAI,MAAM,YAAY,MAAK,CAAA,EAAA,EAAA,EAAA,UAAA,KAAA,EACpE,mBAKE,UAAA,MAAA,WAJY,QAAA,SAAL,MAAC;yBADV,YAKE,MAAA,cAAA,EAAA;MAHC,KAAK,IAAC;MACN,OAAO,IAAC;MACR,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,YAAY,KAAI,CAAA"}
+{"version":3,"file":"InputOTP.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/input-otp/InputOTP.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from 'vue'\nimport { PinInputRoot, PinInputInput } from 'reka-ui'\nimport { inputOTPVariants, type InputOTPVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\n\nconst props = withDefaults(defineProps<{\n  length?: number\n  type?: 'text'\n  otp?: boolean\n  mask?: boolean\n  disabled?: boolean\n  placeholder?: string\n  modelValue?: string\n  defaultValue?: string\n  name?: string\n  variant?: InputOTPVariants['variant']\n  /** Text direction forwarded to PinInputRoot. */\n  dir?: 'ltr' | 'rtl'\n  /** HTML id attribute forwarded to PinInputRoot. */\n  id?: string\n  /** Whether PinInputRoot renders as a child element. */\n  asChild?: boolean\n  /** Element or component to render PinInputRoot as. */\n  as?: string\n  /** Whether the input is required. */\n  required?: boolean\n  /** Whether each PinInputInput renders as a child element. */\n  inputAsChild?: boolean\n  /** Element or component to render each PinInputInput as. */\n  inputAs?: string\n  class?: ClassValue\n  /** Optional per-slot class overrides */\n  classNames?: Partial<{\n    base: ClassValue\n    group: ClassValue\n    slot: ClassValue\n  }>\n}>(), {\n  length: 6,\n  type: 'text',\n  otp: true,\n  mask: false,\n  disabled: false,\n  placeholder: '',\n  modelValue: undefined,\n  defaultValue: undefined,\n  name: undefined,\n  variant: 'primary',\n  dir: undefined,\n  id: undefined,\n  asChild: false,\n  as: undefined,\n  required: false,\n  inputAsChild: false,\n  inputAs: undefined,\n  class: undefined,\n  classNames: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string]\n  'complete': [value: string]\n}>()\n\nconst slotFns = computed(() => inputOTPVariants({ variant: props.variant }))\n\nconst modelValueArray = computed(() =>\n  (props.modelValue ?? '').split('')\n)\n\nconst handleUpdate = (arr: string[]) => emit('update:modelValue', arr.join(''))\nconst handleComplete = (arr: string[]) => emit('complete', arr.join(''))\n</script>\n\n<template>\n  <PinInputRoot\n    :model-value=\"modelValueArray\"\n    :disabled=\"disabled\"\n    :placeholder=\"placeholder\"\n    :type=\"type\"\n    :otp=\"otp\"\n    :mask=\"mask\"\n    :name=\"name\"\n    :dir=\"props.dir\"\n    :id=\"props.id\"\n    :as-child=\"props.asChild\"\n    :as=\"props.as\"\n    :required=\"props.required\"\n    :class=\"composeClassName(slotFns.base(), props.class, props.classNames?.base)\"\n    @update:model-value=\"handleUpdate\"\n    @complete=\"handleComplete\"\n  >\n    <div :class=\"composeClassName(slotFns.group(), props.classNames?.group)\">\n      <PinInputInput\n        v-for=\"i in length\"\n        :key=\"i - 1\"\n        :index=\"i - 1\"\n        :as-child=\"props.inputAsChild\"\n        :as=\"props.inputAs\"\n        :class=\"composeClassName(slotFns.slot(), props.classNames?.slot)\"\n      />\n    </div>\n  </PinInputRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAMA,MAAM,QAAQ;EAsDd,MAAM,OAAO;EAKb,MAAM,UAAU,eAAe,iBAAiB,EAAE,SAAS,MAAM,SAAS,CAAC,CAAA;EAE3E,MAAM,kBAAkB,gBACrB,MAAM,cAAc,IAAI,MAAM,GAAE,CACnC;EAEA,MAAM,gBAAgB,QAAkB,KAAK,qBAAqB,IAAI,KAAK,GAAG,CAAA;EAC9E,MAAM,kBAAkB,QAAkB,KAAK,YAAY,IAAI,KAAK,GAAG,CAAA;;uBAIrE,YA2Be,MAAA,aAAA,EAAA;IA1BZ,eAAa,gBAAA;IACb,UAAU,QAAA;IACV,aAAa,QAAA;IACb,MAAM,QAAA;IACN,KAAK,QAAA;IACL,MAAM,QAAA;IACN,MAAM,QAAA;IACN,KAAK,MAAM;IACX,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,IAAI,MAAM;IACV,UAAU,MAAM;IAChB,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,OAAO,MAAM,YAAY,KAAI,CAAA;IAC3E,uBAAoB;IACpB,YAAU;;2BAWL,CATN,mBASM,OAAA,EATA,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,OAAK,EAAI,MAAM,YAAY,MAAK,CAAA,EAAA,EAAA,EAAA,UAAA,KAAA,EACpE,mBAOE,UAAA,MAAA,WANY,QAAA,SAAL,MAAC;yBADV,YAOE,MAAA,cAAA,EAAA;MALC,KAAK,IAAC;MACN,OAAO,IAAC;MACR,YAAU,MAAM;MAChB,IAAI,MAAM;MACV,OAAK,eAAE,MAAA,iBAAgB,CAAC,QAAA,MAAQ,MAAI,EAAI,MAAM,YAAY,KAAI,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"ListBox.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\nimport ListBoxItem from './ListBoxItem.vue'\n\ntype ListBoxShorthandItem = { value: string; label?: string; disabled?: boolean; textValue?: string }\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render list items from an array instead of the compound slot API */\n  items?: ListBoxShorthandItem[]\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionMode === 'multiple' ? 'toggle' : 'replace'\"\n    :disabled=\"props.isDisabled\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <template v-if=\"props.items\">\n        <ListBoxItem\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :is-disabled=\"item.disabled\"\n          :text-value=\"item.textValue\"\n        >{{ item.label ?? item.value }}</ListBoxItem>\n      </template>\n      <slot v-else />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ListBox.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\nimport ListBoxItem from './ListBoxItem.vue'\n\ntype ListBoxShorthandItem = { value: string; label?: string; disabled?: boolean; textValue?: string }\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render list items from an array instead of the compound slot API */\n  items?: ListBoxShorthandItem[]\n  /** Allow selecting multiple values (alias for selectionMode=\"multiple\"). */\n  multiple?: boolean\n  /** Orientation of the listbox for keyboard navigation. */\n  orientation?: 'horizontal' | 'vertical'\n  /** Reading direction for the component. */\n  dir?: 'ltr' | 'rtl'\n  /** Selection behavior when multiple is true. */\n  selectionBehavior?: 'toggle' | 'replace'\n  /** Highlight item on hover. */\n  highlightOnHover?: boolean\n  /** Key used to compare items for equality. */\n  by?: string\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Form field name for native form submission. */\n  name?: string\n  /** Mark the field as required. */\n  required?: boolean\n  /** Render the ListboxContent as a different element. */\n  contentAs?: string\n  /** Merge content props onto child element. */\n  contentAsChild?: boolean\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n  multiple: undefined,\n  orientation: undefined,\n  dir: undefined,\n  selectionBehavior: undefined,\n  highlightOnHover: undefined,\n  by: undefined,\n  as: undefined,\n  asChild: false,\n  name: undefined,\n  required: undefined,\n  contentAs: undefined,\n  contentAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n  'highlight': [context: unknown]\n  'entry-focus': [event: Event]\n  'leave': [event: Event]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.multiple ?? props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionBehavior ?? (props.selectionMode === 'multiple' ? 'toggle' : 'replace')\"\n    :disabled=\"props.isDisabled\"\n    :orientation=\"props.orientation\"\n    :dir=\"props.dir\"\n    :highlight-on-hover=\"props.highlightOnHover\"\n    :by=\"props.by\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :name=\"props.name\"\n    :required=\"props.required\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n    @highlight=\"emit('highlight', $event)\"\n    @entry-focus=\"emit('entry-focus', $event)\"\n    @leave=\"emit('leave', $event)\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :as=\"props.contentAs\"\n      :as-child=\"props.contentAsChild\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <template v-if=\"props.items\">\n        <ListBoxItem\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :is-disabled=\"item.disabled\"\n          :text-value=\"item.textValue\"\n        >{{ item.label ?? item.value }}</ListBoxItem>\n      </template>\n      <slot v-else />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":""}

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

@@ -28,9 +28,41 @@ var ListBox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 			default: void 0
 		},
 		classNames: {},
-		items: {}
+		items: {},
+		multiple: {
+			type: Boolean,
+			default: void 0
+		},
+		orientation: { default: void 0 },
+		dir: { default: void 0 },
+		selectionBehavior: { default: void 0 },
+		highlightOnHover: {
+			type: Boolean,
+			default: void 0
+		},
+		by: { default: void 0 },
+		as: { default: void 0 },
+		asChild: {
+			type: Boolean,
+			default: false
+		},
+		name: { default: void 0 },
+		required: {
+			type: Boolean,
+			default: void 0
+		},
+		contentAs: { default: void 0 },
+		contentAsChild: {
+			type: Boolean,
+			default: false
+		}
 	},
-	emits: ["update:modelValue"],
+	emits: [
+		"update:modelValue",
+		"highlight",
+		"entry-focus",
+		"leave"
+	],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -45,12 +77,27 @@ var ListBox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 			return openBlock(), createBlock(unref(ListboxRoot), {
 				"model-value": props.modelValue == null ? void 0 : [].concat(props.modelValue),
 				"default-value": props.defaultValue == null ? void 0 : [].concat(props.defaultValue),
-				multiple: props.selectionMode === "multiple",
-				"selection-behavior": props.selectionMode === "multiple" ? "toggle" : "replace",
+				multiple: props.multiple ?? props.selectionMode === "multiple",
+				"selection-behavior": props.selectionBehavior ?? (props.selectionMode === "multiple" ? "toggle" : "replace"),
 				disabled: props.isDisabled,
-				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", props.selectionMode === "single" ? Array.isArray($event) ? $event[0] : $event : $event))
+				orientation: props.orientation,
+				dir: props.dir,
+				"highlight-on-hover": props.highlightOnHover,
+				by: props.by,
+				as: props.as,
+				"as-child": props.asChild,
+				name: props.name,
+				required: props.required,
+				"onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => emit("update:modelValue", props.selectionMode === "single" ? Array.isArray($event) ? $event[0] : $event : $event)),
+				onHighlight: _cache[1] || (_cache[1] = ($event) => emit("highlight", $event)),
+				onEntryFocus: _cache[2] || (_cache[2] = ($event) => emit("entry-focus", $event)),
+				onLeave: _cache[3] || (_cache[3] = ($event) => emit("leave", $event))
 			}, {
-				default: withCtx(() => [createVNode(unref(ListboxContent), mergeProps(unref(attrs), { class: unref(composeClassName)(slotFns.value, props.class, props.classNames?.base) }), {
+				default: withCtx(() => [createVNode(unref(ListboxContent), mergeProps(unref(attrs), {
+					as: props.contentAs,
+					"as-child": props.contentAsChild,
+					class: unref(composeClassName)(slotFns.value, props.class, props.classNames?.base)
+				}), {
 					default: withCtx(() => [props.items ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(props.items, (item) => {
 						return openBlock(), createBlock(ListBoxItem_default, {
 							key: item.value,
@@ -67,14 +114,26 @@ var ListBox_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ define
 						]);
 					}), 128)) : renderSlot(_ctx.$slots, "default", { key: 1 })]),
 					_: 3
-				}, 16, ["class"])]),
+				}, 16, [
+					"as",
+					"as-child",
+					"class"
+				])]),
 				_: 3
 			}, 8, [
 				"model-value",
 				"default-value",
 				"multiple",
 				"selection-behavior",
-				"disabled"
+				"disabled",
+				"orientation",
+				"dir",
+				"highlight-on-hover",
+				"by",
+				"as",
+				"as-child",
+				"name",
+				"required"
 			]);
 		};
 	}

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

@@ -1 +1 @@
-{"version":3,"file":"ListBox.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\nimport ListBoxItem from './ListBoxItem.vue'\n\ntype ListBoxShorthandItem = { value: string; label?: string; disabled?: boolean; textValue?: string }\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render list items from an array instead of the compound slot API */\n  items?: ListBoxShorthandItem[]\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionMode === 'multiple' ? 'toggle' : 'replace'\"\n    :disabled=\"props.isDisabled\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <template v-if=\"props.items\">\n        <ListBoxItem\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :is-disabled=\"item.disabled\"\n          :text-value=\"item.textValue\"\n        >{{ item.label ?? item.value }}</ListBoxItem>\n      </template>\n      <slot v-else />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAaA,MAAM,QAAQ;EAyBd,MAAM,OAAO;EAIb,MAAM,QAAQ,UAAS;AAGvB,oBAAkB;GAChB,SAAS,MAAM,OAAO,UAAU;GAChC,aAAa,MAAM,OAAO,UAAU;GACpC,YAAY,MAAM,OAAO,aAAa;GACvC,CAAA;EAED,MAAM,UAAU,eACd,gBAAgB,EAAE,SAAS,MAAM,SAAS,CAAA,CAC5C;;uBAME,YAuBc,MAAA,YAAA,EAAA;IAtBX,eAAa,MAAM,cAAU,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,WAAU;IAC5F,iBAAe,MAAM,gBAAY,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,aAAY;IAClG,UAAU,MAAM,kBAAa;IAC7B,sBAAoB,MAAM,kBAAa,aAAA,WAAA;IACvC,UAAU,MAAM;IAChB,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,qBAAsB,MAAM,kBAAa,WAAiB,MAAM,QAAQ,OAAM,GAAK,OAAM,KAAmB,SAAoB,OAAM;;2BAgB9I,CAdjB,YAciB,MAAA,eAAA,EAdjB,WACU,MAaO,MAbF,EAAA,EACZ,OAAO,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,OAAO,MAAM,YAAY,KAAI,EAAA,CAAA,EAAA;4BAU1D,CARK,MAAM,SAAA,UAAA,KAAA,EACpB,mBAM6C,UAAA,EAAA,KAAA,GAAA,EAAA,WAL5B,MAAM,QAAd,SAAI;0BADb,YAM6C,qBAAA;OAJ1C,KAAK,KAAK;OACV,OAAO,KAAK;OACZ,eAAa,KAAK;OAClB,cAAY,KAAK;;8BACW,CAAA,gBAAA,gBAA3B,KAAK,SAAS,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;iBAE9B,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}
+{"version":3,"file":"ListBox.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../src/components/list-box/ListBox.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, toRef, useAttrs } from 'vue'\nimport { ListboxRoot, ListboxContent } from 'reka-ui'\nimport { listboxVariants, type ListBoxVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxProvide } from './ListBox.context'\nimport ListBoxItem from './ListBoxItem.vue'\n\ntype ListBoxShorthandItem = { value: string; label?: string; disabled?: boolean; textValue?: string }\n\n// Disable Vue attribute fallthrough — we manually forward ARIA attrs to ListboxContent\ndefineOptions({ inheritAttrs: false })\n\nconst props = withDefaults(defineProps<{\n  modelValue?: string | string[]\n  defaultValue?: string | string[]\n  selectionMode?: 'single' | 'multiple'\n  variant?: ListBoxVariants['variant']\n  isDisabled?: boolean\n  class?: ClassValue\n  /**\n   * Per-slot class overrides. Each key maps to a named slot in the anatomy;\n   * the value is merged with the generated variant classes via `composeClassName`.\n   */\n  classNames?: Partial<{\n    base: ClassValue\n  }>\n  /** Shorthand API: render list items from an array instead of the compound slot API */\n  items?: ListBoxShorthandItem[]\n  /** Allow selecting multiple values (alias for selectionMode=\"multiple\"). */\n  multiple?: boolean\n  /** Orientation of the listbox for keyboard navigation. */\n  orientation?: 'horizontal' | 'vertical'\n  /** Reading direction for the component. */\n  dir?: 'ltr' | 'rtl'\n  /** Selection behavior when multiple is true. */\n  selectionBehavior?: 'toggle' | 'replace'\n  /** Highlight item on hover. */\n  highlightOnHover?: boolean\n  /** Key used to compare items for equality. */\n  by?: string\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Form field name for native form submission. */\n  name?: string\n  /** Mark the field as required. */\n  required?: boolean\n  /** Render the ListboxContent as a different element. */\n  contentAs?: string\n  /** Merge content props onto child element. */\n  contentAsChild?: boolean\n}>(), {\n  modelValue: undefined,\n  defaultValue: undefined,\n  selectionMode: 'single',\n  variant: 'default',\n  isDisabled: false,\n  class: undefined,\n  multiple: undefined,\n  orientation: undefined,\n  dir: undefined,\n  selectionBehavior: undefined,\n  highlightOnHover: undefined,\n  by: undefined,\n  as: undefined,\n  asChild: false,\n  name: undefined,\n  required: undefined,\n  contentAs: undefined,\n  contentAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | string[] | undefined]\n  'highlight': [context: unknown]\n  'entry-focus': [event: Event]\n  'leave': [event: Event]\n}>()\n\nconst attrs = useAttrs()\n\n// Provide context for ListBoxItem and ListBoxSection children\nuseListBoxProvide({\n  variant: toRef(props, 'variant'),\n  itemVariant: toRef(props, 'variant'),\n  isDisabled: toRef(props, 'isDisabled'),\n})\n\nconst slotFns = computed(() =>\n  listboxVariants({ variant: props.variant })\n)\n</script>\n\n<template>\n  <!-- ListboxRoot is an invisible wrapper that manages state; ListboxContent carries role=\"listbox\" -->\n  <!-- We forward attrs (aria-label, aria-labelledby, etc.) to ListboxContent, not the root -->\n  <ListboxRoot\n    :model-value=\"props.modelValue == null ? undefined : ([] as string[]).concat(props.modelValue)\"\n    :default-value=\"props.defaultValue == null ? undefined : ([] as string[]).concat(props.defaultValue)\"\n    :multiple=\"props.multiple ?? props.selectionMode === 'multiple'\"\n    :selection-behavior=\"props.selectionBehavior ?? (props.selectionMode === 'multiple' ? 'toggle' : 'replace')\"\n    :disabled=\"props.isDisabled\"\n    :orientation=\"props.orientation\"\n    :dir=\"props.dir\"\n    :highlight-on-hover=\"props.highlightOnHover\"\n    :by=\"props.by\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :name=\"props.name\"\n    :required=\"props.required\"\n    @update:model-value=\"emit('update:modelValue', props.selectionMode === 'single' ? (Array.isArray($event) ? ($event as string[])[0] : $event as string) : $event as string[])\"\n    @highlight=\"emit('highlight', $event)\"\n    @entry-focus=\"emit('entry-focus', $event)\"\n    @leave=\"emit('leave', $event)\"\n  >\n    <ListboxContent\n      v-bind=\"attrs\"\n      :as=\"props.contentAs\"\n      :as-child=\"props.contentAsChild\"\n      :class=\"composeClassName(slotFns, props.class, props.classNames?.base)\"\n    >\n      <template v-if=\"props.items\">\n        <ListBoxItem\n          v-for=\"item in props.items\"\n          :key=\"item.value\"\n          :value=\"item.value\"\n          :is-disabled=\"item.disabled\"\n          :text-value=\"item.textValue\"\n        >{{ item.label ?? item.value }}</ListBoxItem>\n      </template>\n      <slot v-else />\n    </ListboxContent>\n  </ListboxRoot>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAaA,MAAM,QAAQ;EA6Dd,MAAM,OAAO;EAOb,MAAM,QAAQ,UAAS;AAGvB,oBAAkB;GAChB,SAAS,MAAM,OAAO,UAAU;GAChC,aAAa,MAAM,OAAO,UAAU;GACpC,YAAY,MAAM,OAAO,aAAa;GACvC,CAAA;EAED,MAAM,UAAU,eACd,gBAAgB,EAAE,SAAS,MAAM,SAAS,CAAA,CAC5C;;uBAME,YAoCc,MAAA,YAAA,EAAA;IAnCX,eAAa,MAAM,cAAU,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,WAAU;IAC5F,iBAAe,MAAM,gBAAY,OAAW,KAAA,IAAS,EAAA,CAAoB,OAAO,MAAM,aAAY;IAClG,UAAU,MAAM,YAAY,MAAM,kBAAa;IAC/C,sBAAoB,MAAM,sBAAsB,MAAM,kBAAa,aAAA,WAAA;IACnE,UAAU,MAAM;IAChB,aAAa,MAAM;IACnB,KAAK,MAAM;IACX,sBAAoB,MAAM;IAC1B,IAAI,MAAM;IACV,IAAI,MAAM;IACV,YAAU,MAAM;IAChB,MAAM,MAAM;IACZ,UAAU,MAAM;IAChB,uBAAkB,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,qBAAsB,MAAM,kBAAa,WAAiB,MAAM,QAAQ,OAAM,GAAK,OAAM,KAAmB,SAAoB,OAAM;IAC9J,aAAS,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,aAAc,OAAM;IACnC,cAAW,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,eAAgB,OAAM;IACvC,SAAK,OAAA,OAAA,OAAA,MAAA,WAAE,KAAI,SAAU,OAAM;;2BAkBX,CAhBjB,YAgBiB,MAAA,eAAA,EAhBjB,WACU,MAeO,MAfF,EAAA;KACZ,IAAI,MAAM;KACV,YAAU,MAAM;KAChB,OAAO,MAAA,iBAAgB,CAAC,QAAA,OAAS,MAAM,OAAO,MAAM,YAAY,KAAI;;4BAU1D,CARK,MAAM,SAAA,UAAA,KAAA,EACpB,mBAM6C,UAAA,EAAA,KAAA,GAAA,EAAA,WAL5B,MAAM,QAAd,SAAI;0BADb,YAM6C,qBAAA;OAJ1C,KAAK,KAAK;OACV,OAAO,KAAK;OACZ,eAAa,KAAK;OAClB,cAAY,KAAK;;8BACW,CAAA,gBAAA,gBAA3B,KAAK,SAAS,KAAK,MAAK,EAAA,EAAA,CAAA,CAAA;;;;;;;iBAE9B,WAAe,KAAA,QAAA,WAAA,EAAA,KAAA,GAAA,CAAA,CAAA,CAAA"}

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

@@ -1 +1 @@
-{"version":3,"file":"ListBoxItem.js","names":[],"sources":["../../../src/components/list-box/ListBoxItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { ListboxItem, ListboxItemIndicator } from 'reka-ui'\nimport { listboxItemVariants, type ListBoxItemVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxInject } from './ListBox.context'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  textValue?: string\n  isDisabled?: boolean\n  variant?: ListBoxItemVariants['variant']\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    item: ClassValue\n    indicator: ClassValue\n  }>\n}>(), {\n  textValue: undefined,\n  isDisabled: false,\n  variant: undefined,\n  class: undefined,\n  classNames: undefined,\n})\n\n// Inject context with fallback (standalone usage)\nconst ctx = useListBoxInject({\n  variant: ref('default'),\n  itemVariant: ref('default'),\n  isDisabled: ref(false),\n})\n\nconst finalVariant = computed(() => props.variant ?? ctx.itemVariant.value)\nconst finalDisabled = computed(() => ctx.isDisabled.value || props.isDisabled)\n\nconst slotFns = computed(() =>\n  listboxItemVariants({ variant: finalVariant.value as ListBoxItemVariants['variant'] })\n)\n</script>\n\n<template>\n  <ListboxItem\n    :value=\"props.value\"\n    :disabled=\"finalDisabled\"\n    :text-value=\"props.textValue ?? props.value\"\n    :class=\"composeClassName(slotFns.item(), props.class, props.classNames?.item)\"\n  >\n    <slot name=\"startContent\" />\n    <slot />\n    <slot name=\"endContent\" />\n    <ListboxItemIndicator :class=\"composeClassName(slotFns.indicator(), props.classNames?.indicator)\">\n      <slot name=\"selectedIcon\">\n        <!-- Default check icon -->\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </ListboxItemIndicator>\n  </ListboxItem>\n</template>\n"],"mappings":""}
+{"version":3,"file":"ListBoxItem.js","names":[],"sources":["../../../src/components/list-box/ListBoxItem.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { ListboxItem, ListboxItemIndicator } from 'reka-ui'\nimport { listboxItemVariants, type ListBoxItemVariants } from '@auronui/styles'\nimport { composeClassName , type ClassValue} from '../../utils/composeClassName'\nimport { useListBoxInject } from './ListBox.context'\n\nconst props = withDefaults(defineProps<{\n  value: string\n  textValue?: string\n  isDisabled?: boolean\n  variant?: ListBoxItemVariants['variant']\n  class?: ClassValue\n  /** Override classes for individual slots */\n  classNames?: Partial<{\n    item: ClassValue\n    indicator: ClassValue\n  }>\n  /** Whether the item is disabled. Alias for isDisabled. */\n  disabled?: boolean\n  /** Render as a different element or component. */\n  as?: string\n  /** Merge props onto child element instead of rendering a wrapper. */\n  asChild?: boolean\n  /** Render the ListboxItemIndicator as a different element. */\n  indicatorAs?: string\n  /** Merge indicator props onto child element. */\n  indicatorAsChild?: boolean\n}>(), {\n  textValue: undefined,\n  isDisabled: false,\n  variant: undefined,\n  class: undefined,\n  classNames: undefined,\n  disabled: undefined,\n  as: undefined,\n  asChild: false,\n  indicatorAs: undefined,\n  indicatorAsChild: false,\n})\n\nconst emit = defineEmits<{\n  'select': [event: Event]\n}>()\n\n// Inject context with fallback (standalone usage)\nconst ctx = useListBoxInject({\n  variant: ref('default'),\n  itemVariant: ref('default'),\n  isDisabled: ref(false),\n})\n\nconst finalVariant = computed(() => props.variant ?? ctx.itemVariant.value)\nconst finalDisabled = computed(() => ctx.isDisabled.value || props.isDisabled)\n\nconst slotFns = computed(() =>\n  listboxItemVariants({ variant: finalVariant.value as ListBoxItemVariants['variant'] })\n)\n</script>\n\n<template>\n  <ListboxItem\n    :value=\"props.value\"\n    :disabled=\"props.disabled ?? finalDisabled\"\n    :text-value=\"props.textValue ?? props.value\"\n    :as=\"props.as\"\n    :as-child=\"props.asChild\"\n    :class=\"composeClassName(slotFns.item(), props.class, props.classNames?.item)\"\n    @select=\"emit('select', $event)\"\n  >\n    <slot name=\"startContent\" />\n    <slot />\n    <slot name=\"endContent\" />\n    <ListboxItemIndicator\n      :as=\"props.indicatorAs\"\n      :as-child=\"props.indicatorAsChild\"\n      :class=\"composeClassName(slotFns.indicator(), props.classNames?.indicator)\"\n    >\n      <slot name=\"selectedIcon\">\n        <!-- Default check icon -->\n        <svg\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"12\"\n          height=\"12\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"3\"\n          stroke-linecap=\"round\"\n          stroke-linejoin=\"round\"\n          data-slot=\"list-box-item-indicator--checkmark\"\n          aria-hidden=\"true\"\n        >\n          <polyline points=\"20 6 9 17 4 12\" />\n        </svg>\n      </slot>\n    </ListboxItemIndicator>\n  </ListboxItem>\n</template>\n"],"mappings":""}