@astryx-vue/core 0.1.0 → 0.1.3

package/dist/ComplexSelector-BHmGWml0.js

@@ -0,0 +1,293 @@
+import { a as useAstryxMessages } from "./context-D6ECRdc5.js";
+import { t as _sfc_main$1 } from "./Icon-5MdZQ18k.js";
+import { t as _sfc_main$2 } from "./Spinner-9cYUCnDy.js";
+import { t as _sfc_main$3 } from "./Field-8zRxzDHE.js";
+import { t as _sfc_main$4 } from "./Popover-Crhk9PNP.js";
+import { computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, normalizeProps, onBeforeUnmount, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, useId, useModel, useSlots, watch, withCtx } from "vue";
+import "../styles/complex-selector.css";
+//#region src/ComplexSelector/ComplexSelector.vue
+const _hoisted_1 = [
+	"data-placeholder",
+	"data-size",
+	"data-status",
+	"data-variant",
+	"aria-busy",
+	"aria-expanded",
+	"aria-invalid",
+	"aria-required",
+	"disabled"
+];
+const _hoisted_2 = { class: "astryx-complex-selector-value" };
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	name: "AstryxComplexSelector",
+	__name: "ComplexSelector",
+	props: /*@__PURE__*/ mergeModels({
+		label: {},
+		modelValue: {},
+		triggerLabel: {},
+		placeholder: {},
+		isLabelHidden: {
+			type: Boolean,
+			default: false
+		},
+		description: {},
+		isOptional: {
+			type: Boolean,
+			default: false
+		},
+		isRequired: {
+			type: Boolean,
+			default: false
+		},
+		isDisabled: {
+			type: Boolean,
+			default: false
+		},
+		isLoading: {
+			type: Boolean,
+			default: false
+		},
+		status: {},
+		statusVariant: { default: "attached" },
+		labelTooltip: {},
+		size: { default: "md" },
+		width: {},
+		placement: { default: "below" },
+		alignment: { default: "start" },
+		startIcon: {},
+		variant: { default: "input" },
+		renderTrigger: {},
+		handleRef: {},
+		changeAction: {}
+	}, {
+		"modelValue": { required: true },
+		"modelModifiers": {}
+	}),
+	emits: /*@__PURE__*/ mergeModels(["change"], ["update:modelValue"]),
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const props = __props;
+		const emit = __emit;
+		const slots = useSlots();
+		const model = useModel(__props, "modelValue");
+		const messages = useAstryxMessages();
+		const isOpen = ref(false);
+		const isPending = ref(false);
+		const optimistic = ref(void 0);
+		const triggerId = `astryx-complex-selector-${useId()}`;
+		const labelId = `${triggerId}-label`;
+		const contentId = `${triggerId}-content`;
+		const placeholder = computed(() => props.placeholder ?? messages.value.selector.placeholder);
+		const isBusy = computed(() => props.isLoading || isPending.value);
+		const displayValue = computed(() => isPending.value && optimistic.value !== void 0 ? optimistic.value : model.value);
+		const hasTriggerLabel = computed(() => props.triggerLabel != null && props.triggerLabel !== "");
+		const state = computed(() => ({
+			isOpen: isOpen.value,
+			isBusy: isBusy.value,
+			triggerId,
+			contentId
+		}));
+		function setOpen(next) {
+			if (props.isDisabled) return;
+			isOpen.value = next;
+		}
+		async function commit(next) {
+			model.value = next;
+			emit("change", next);
+			if (props.changeAction == null) return;
+			optimistic.value = next;
+			isPending.value = true;
+			try {
+				await props.changeAction(next);
+			} finally {
+				isPending.value = false;
+			}
+		}
+		function close() {
+			isOpen.value = false;
+		}
+		function open() {
+			if (props.isDisabled) return;
+			isOpen.value = true;
+		}
+		function toggle() {
+			if (isOpen.value) close();
+			else open();
+		}
+		function onTriggerKeyDown(event) {
+			if (event.key === "ArrowDown" && !isOpen.value && !props.isDisabled) {
+				event.preventDefault();
+				isOpen.value = true;
+			}
+		}
+		function onCustomClick(event) {
+			event.stopImmediatePropagation();
+			toggle();
+		}
+		const hasCustomTrigger = computed(() => props.renderTrigger != null || slots.trigger != null);
+		const triggerProps = computed(() => ({
+			"id": triggerId,
+			"onClick": onCustomClick,
+			"onKeydown": onTriggerKeyDown,
+			"aria-haspopup": "dialog",
+			"aria-expanded": isOpen.value,
+			"aria-controls": isOpen.value ? contentId : void 0,
+			"aria-busy": isBusy.value ? true : void 0,
+			"aria-label": props.label
+		}));
+		const triggerView = () => props.renderTrigger?.(triggerProps.value) ?? null;
+		const handle = {
+			open,
+			close,
+			toggle,
+			isOpen: () => isOpen.value
+		};
+		function publishHandle(value) {
+			const target = props.handleRef;
+			if (target == null) return;
+			if (typeof target === "function") target(value);
+			else target.value = value;
+		}
+		watch(() => props.handleRef, (_next, previous) => {
+			if (previous != null && previous !== props.handleRef) {
+				if (typeof previous === "function") previous(null);
+				else previous.value = null;
+			}
+			publishHandle(handle);
+		}, { immediate: true });
+		onBeforeUnmount(() => publishHandle(null));
+		__expose(handle);
+		return (_ctx, _cache) => {
+			return hasCustomTrigger.value ? (openBlock(), createBlock(_sfc_main$4, {
+				key: 0,
+				alignment: __props.alignment,
+				"has-auto-focus": true,
+				"has-close-button": false,
+				"is-enabled": !__props.isDisabled,
+				"is-open": isOpen.value,
+				label: __props.label,
+				padding: 3,
+				placement: __props.placement,
+				role: "dialog",
+				onOpenChange: setOpen
+			}, {
+				content: withCtx(() => [createElementVNode("div", {
+					id: contentId,
+					class: "astryx-complex-selector-content"
+				}, [renderSlot(_ctx.$slots, "default", {
+					close,
+					commit,
+					state: state.value,
+					value: displayValue.value
+				})])]),
+				default: withCtx(() => [renderSlot(_ctx.$slots, "trigger", normalizeProps(guardReactiveProps(triggerProps.value)), () => [(openBlock(), createBlock(resolveDynamicComponent(triggerView)))])]),
+				_: 3
+			}, 8, [
+				"alignment",
+				"is-enabled",
+				"is-open",
+				"label",
+				"placement"
+			])) : (openBlock(), createBlock(_sfc_main$3, {
+				key: 1,
+				class: "astryx-complex-selector-field",
+				"data-variant": __props.variant,
+				description: __props.description,
+				"input-id": triggerId,
+				"is-disabled": __props.isDisabled,
+				"is-label-hidden": __props.isLabelHidden,
+				"is-optional": __props.isOptional,
+				"is-required": __props.isRequired,
+				label: __props.label,
+				"label-id": labelId,
+				"label-tooltip": __props.labelTooltip,
+				status: __props.status,
+				"status-variant": __props.statusVariant,
+				width: __props.width
+			}, {
+				default: withCtx(() => [createVNode(_sfc_main$4, {
+					alignment: __props.alignment,
+					"has-auto-focus": true,
+					"has-close-button": false,
+					"is-enabled": !__props.isDisabled,
+					"is-open": isOpen.value,
+					label: __props.label,
+					padding: 3,
+					placement: __props.placement,
+					role: "dialog",
+					onOpenChange: setOpen
+				}, {
+					content: withCtx(() => [createElementVNode("div", {
+						id: contentId,
+						class: "astryx-complex-selector-content"
+					}, [renderSlot(_ctx.$slots, "default", {
+						close,
+						commit,
+						state: state.value,
+						value: displayValue.value
+					})])]),
+					default: withCtx(() => [createElementVNode("button", {
+						id: triggerId,
+						class: "astryx-complex-selector",
+						"data-placeholder": hasTriggerLabel.value ? void 0 : "",
+						"data-size": __props.size,
+						"data-status": __props.status?.type,
+						"data-variant": __props.variant,
+						"aria-busy": isBusy.value || void 0,
+						"aria-expanded": isOpen.value,
+						"aria-invalid": __props.status?.type === "error" || void 0,
+						"aria-labelledby": labelId,
+						"aria-required": __props.isRequired || void 0,
+						disabled: __props.isDisabled,
+						type: "button",
+						onKeydown: onTriggerKeyDown
+					}, [
+						__props.startIcon ? (openBlock(), createBlock(_sfc_main$1, {
+							key: 0,
+							class: "astryx-complex-selector-start",
+							color: "secondary",
+							icon: __props.startIcon,
+							size: "sm"
+						}, null, 8, ["icon"])) : createCommentVNode("v-if", true),
+						createElementVNode("span", _hoisted_2, toDisplayString(hasTriggerLabel.value ? __props.triggerLabel : placeholder.value), 1),
+						isBusy.value ? (openBlock(), createBlock(_sfc_main$2, {
+							key: 1,
+							size: "sm"
+						})) : createCommentVNode("v-if", true),
+						createVNode(_sfc_main$1, {
+							class: "astryx-complex-selector-chevron",
+							"data-state": isOpen.value ? "expanded" : "collapsed",
+							color: "secondary",
+							icon: "chevronDown",
+							size: "sm"
+						}, null, 8, ["data-state"])
+					], 40, _hoisted_1)]),
+					_: 3
+				}, 8, [
+					"alignment",
+					"is-enabled",
+					"is-open",
+					"label",
+					"placement"
+				])]),
+				_: 3
+			}, 8, [
+				"data-variant",
+				"description",
+				"is-disabled",
+				"is-label-hidden",
+				"is-optional",
+				"is-required",
+				"label",
+				"label-tooltip",
+				"status",
+				"status-variant",
+				"width"
+			]));
+		};
+	}
+});
+//#endregion
+//#region src/ComplexSelector/index.ts
+var ComplexSelector_default = _sfc_main;
+//#endregion
+export { _sfc_main as n, ComplexSelector_default as t };

package/dist/ContextMenu/index.d.ts

@@ -1,2 +1,2 @@
-import { C as ContextMenuSlots, D as ContextMenuTriggerElement, E as ContextMenuSubMenuSlots, O as ContextMenuVariant, S as ContextMenuSize, T as ContextMenuSubMenuProps, _ as ContextMenuItemSlots, a as _default, b as ContextMenuProps, c as ContextMenuDividerData, d as ContextMenuGroupProps, f as ContextMenuGroupSlots, g as ContextMenuItemProps, h as ContextMenuItemIcon, i as _default$1, k as ContextMenuWidth, l as ContextMenuDividerProps, m as ContextMenuItemEmits, n as _default$3, o as useContextMenu, p as ContextMenuItemData, r as _default$2, s as useContextMenuSize, t as _default$4, u as ContextMenuEmits, v as ContextMenuItemTarget, w as ContextMenuSubMenuEmits, x as ContextMenuSection, y as ContextMenuOption } from "../index-CxspvLBl.js";
+import { C as ContextMenuSlots, D as ContextMenuTriggerElement, E as ContextMenuSubMenuSlots, O as ContextMenuVariant, S as ContextMenuSize, T as ContextMenuSubMenuProps, _ as ContextMenuItemSlots, a as _default, b as ContextMenuProps, c as ContextMenuDividerData, d as ContextMenuGroupProps, f as ContextMenuGroupSlots, g as ContextMenuItemProps, h as ContextMenuItemIcon, i as _default$1, k as ContextMenuWidth, l as ContextMenuDividerProps, m as ContextMenuItemEmits, n as _default$3, o as useContextMenu, p as ContextMenuItemData, r as _default$2, s as useContextMenuSize, t as _default$4, u as ContextMenuEmits, v as ContextMenuItemTarget, w as ContextMenuSubMenuEmits, x as ContextMenuSection, y as ContextMenuOption } from "../index-CTolyeii.js";
 export { _default as ContextMenu, _default$1 as ContextMenuDivider, type ContextMenuDividerData, type ContextMenuDividerProps, type ContextMenuEmits, _default$2 as ContextMenuGroup, type ContextMenuGroupProps, type ContextMenuGroupSlots, _default$3 as ContextMenuItem, type ContextMenuItemData, type ContextMenuItemEmits, type ContextMenuItemIcon, type ContextMenuItemProps, type ContextMenuItemSlots, type ContextMenuItemTarget, type ContextMenuOption, type ContextMenuProps, type ContextMenuSection, type ContextMenuSize, type ContextMenuSlots, _default$4 as ContextMenuSubMenu, type ContextMenuSubMenuEmits, type ContextMenuSubMenuProps, type ContextMenuSubMenuSlots, type ContextMenuTriggerElement, type ContextMenuVariant, type ContextMenuWidth, useContextMenu, useContextMenuSize };

package/dist/ContextMenu/index.js

@@ -1,2 +1,2 @@
-import { a as _sfc_main$1, i as _sfc_main$2, n as _sfc_main$4, o as useContextMenu, r as _sfc_main$3, s as useContextMenuSize, t as _sfc_main } from "../ContextMenu-BJh99Exj.js";
+import { a as _sfc_main$1, i as _sfc_main$2, n as _sfc_main$4, o as useContextMenu, r as _sfc_main$3, s as useContextMenuSize, t as _sfc_main } from "../ContextMenu-dA-ppaRQ.js";
 export { _sfc_main as ContextMenu, _sfc_main$1 as ContextMenuDivider, _sfc_main$2 as ContextMenuGroup, _sfc_main$3 as ContextMenuItem, _sfc_main$4 as ContextMenuSubMenu, useContextMenu, useContextMenuSize };

package/dist/{ContextMenu-BJh99Exj.js → ContextMenu-dA-ppaRQ.js}

@@ -1,13 +1,22 @@
+import { t as useMediaQuery } from "./useMediaQuery-GMmgp28-.js";
 import { t as useDismiss } from "./useDismiss-CAiHU6QD.js";
 import { t as useLongPress } from "./useLongPress-Cyxwa73s.js";
 import { n as useOverflow } from "./useOverflow-VrwF5oek.js";
-import { t as _sfc_main$6 } from "./Icon-B6qNgBP9.js";
+import { t as _sfc_main$6 } from "./Icon-5MdZQ18k.js";
 import { t as _sfc_main$7 } from "./Divider-BtwnL18I.js";
 import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
-import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, openBlock, provide, ref, renderList, renderSlot, resolveComponent, resolveDynamicComponent, toDisplayString, unref, useAttrs, useId, useModel, useTemplateRef, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
+import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, onScopeDispose, openBlock, provide, ref, renderList, renderSlot, resolveComponent, resolveDynamicComponent, toDisplayString, unref, useAttrs, useId, useModel, useTemplateRef, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
 import "../styles/context-menu.css";
 //#region src/ContextMenu/context.ts
 const contextMenuContextKey = Symbol("astryx-context-menu");
+/**
+* Whether the submenu flyout that contains this one is showing.
+*
+* Nested flyouts are teleported to `body`, so hiding an ancestor's DOM does
+* not hide them. Each submenu provides its own `showsFlyout` for the next
+* level; a row with no ancestor submenu reads as open.
+*/
+const submenuAncestorOpenKey = Symbol("astryx-submenu-ancestor-open");
 /** The surrounding menu, or `undefined` when the row stands alone. */
 function useContextMenu() {
 	return inject(contextMenuContextKey, void 0);
@@ -385,6 +394,229 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		};
 	}
 });
+function sign(p1, p2, p3) {
+	return (p1.x - p3.x) * (p2.y - p3.y) - (p2.x - p3.x) * (p1.y - p3.y);
+}
+function isPointInTriangle(p, a, b, c) {
+	const d1 = sign(p, a, b);
+	const d2 = sign(p, b, c);
+	const d3 = sign(p, c, a);
+	return !((d1 < 0 || d2 < 0 || d3 < 0) && (d1 > 0 || d2 > 0 || d3 > 0));
+}
+/**
+* Whether `point` lies inside the triangle from `origin` (where the pointer
+* left the row) to the flyout's near edge — the edge facing the origin.
+*/
+function isPointInSafeTriangle(point, origin, flyout) {
+	const pad = 8;
+	let edgeStart;
+	let edgeEnd;
+	if (origin.x <= flyout.left) {
+		edgeStart = {
+			x: flyout.left,
+			y: flyout.top - pad
+		};
+		edgeEnd = {
+			x: flyout.left,
+			y: flyout.bottom + pad
+		};
+	} else if (origin.x >= flyout.right) {
+		edgeStart = {
+			x: flyout.right,
+			y: flyout.top - pad
+		};
+		edgeEnd = {
+			x: flyout.right,
+			y: flyout.bottom + pad
+		};
+	} else if (origin.y <= flyout.top) {
+		edgeStart = {
+			x: flyout.left - pad,
+			y: flyout.top
+		};
+		edgeEnd = {
+			x: flyout.right + pad,
+			y: flyout.top
+		};
+	} else if (origin.y >= flyout.bottom) {
+		edgeStart = {
+			x: flyout.left - pad,
+			y: flyout.bottom
+		};
+		edgeEnd = {
+			x: flyout.right + pad,
+			y: flyout.bottom
+		};
+	} else return false;
+	return isPointInTriangle(point, origin, edgeStart, edgeEnd);
+}
+function useSubmenuHover(options) {
+	const hasHover = useMediaQuery("(hover: hover)");
+	let showTimer;
+	let hideTimer;
+	let stopTriangle = null;
+	/** Hover opened this flyout, so leaving may close it. */
+	let provenance = null;
+	let hoverOpenedAt = 0;
+	/** When the flyout last closed. A pointer enter inside the suppress window is ignored. */
+	let closedAt = 0;
+	/** While true, a point inside `isInsideTriangle` is still heading for the flyout. */
+	let isTracking = false;
+	let isInsideTriangle = () => false;
+	function clearShowTimer() {
+		if (showTimer != null) clearTimeout(showTimer);
+		showTimer = void 0;
+	}
+	function clearHideTimer() {
+		if (hideTimer != null) clearTimeout(hideTimer);
+		hideTimer = void 0;
+	}
+	function clearTriangle() {
+		stopTriangle?.();
+		stopTriangle = null;
+		isTracking = false;
+		isInsideTriangle = () => false;
+	}
+	function cancelTimers() {
+		clearShowTimer();
+		clearHideTimer();
+		clearTriangle();
+	}
+	function markClosed() {
+		const shouldStamp = options.isOpen() || provenance != null;
+		cancelTimers();
+		provenance = null;
+		hoverOpenedAt = 0;
+		if (shouldStamp) closedAt = Date.now();
+	}
+	function closeNow() {
+		cancelTimers();
+		provenance = null;
+		hoverOpenedAt = 0;
+		if (options.isOpen()) options.closeFromPointer();
+	}
+	function notePinned() {
+		cancelTimers();
+		provenance = "pinned";
+		hoverOpenedAt = 0;
+		closedAt = 0;
+	}
+	function noteHoverOpened() {
+		provenance = "hover";
+		hoverOpenedAt = Date.now();
+		closedAt = 0;
+	}
+	function scheduleHide(event) {
+		if (provenance !== "hover") return;
+		clearHideTimer();
+		clearTriangle();
+		let lastPoint = null;
+		const arm = () => {
+			clearHideTimer();
+			hideTimer = setTimeout(() => {
+				if (isTracking && lastPoint != null && isInsideTriangle(lastPoint)) {
+					arm();
+					return;
+				}
+				closeNow();
+			}, 200);
+		};
+		arm();
+		const menu = unref(options.flyout);
+		const apex = event != null ? {
+			x: event.clientX,
+			y: event.clientY
+		} : null;
+		if (menu == null || apex == null || !options.isOpen()) return;
+		const rect = menu.getBoundingClientRect();
+		if (rect.width <= 0 || rect.height <= 0) return;
+		const doc = menu.ownerDocument;
+		isInsideTriangle = (point) => isPointInSafeTriangle(point, apex, rect);
+		isTracking = true;
+		lastPoint = apex;
+		const onPointerMove = (move) => {
+			const point = {
+				x: move.clientX,
+				y: move.clientY
+			};
+			lastPoint = point;
+			if (isInsideTriangle(point)) {
+				arm();
+				return;
+			}
+			isTracking = false;
+			clearTriangle();
+		};
+		doc.addEventListener("pointermove", onPointerMove, true);
+		stopTriangle = () => {
+			doc.removeEventListener("pointermove", onPointerMove, true);
+		};
+	}
+	function onTriggerPointerEnter(event) {
+		if (event.pointerType !== "mouse" || !hasHover.value) return;
+		if (options.isOpen()) {
+			clearHideTimer();
+			clearTriangle();
+			return;
+		}
+		if (closedAt > 0 && Date.now() - closedAt < 300) return;
+		clearShowTimer();
+		if (!options.isEnabled()) return;
+		showTimer = setTimeout(() => {
+			showTimer = void 0;
+			if (!options.isEnabled() || options.isOpen()) return;
+			options.openFromHover();
+		}, 150);
+	}
+	function onTriggerPointerLeave(event) {
+		if (event.pointerType !== "mouse") return;
+		closedAt = 0;
+		clearShowTimer();
+		scheduleHide(event);
+	}
+	function onFlyoutPointerEnter(event) {
+		if (event.pointerType !== "mouse") return;
+		clearShowTimer();
+		clearHideTimer();
+		clearTriangle();
+	}
+	function onFlyoutPointerLeave(event) {
+		if (event.pointerType !== "mouse") return;
+		closedAt = 0;
+		scheduleHide(event);
+	}
+	function onTriggerClick(event) {
+		if (!options.isEnabled()) return;
+		if (event.detail === 0) {
+			if (!options.isOpen()) options.openPinned();
+			return;
+		}
+		cancelTimers();
+		if (!options.isOpen()) {
+			options.openPinned();
+			return;
+		}
+		if (provenance === "hover" && hoverOpenedAt > 0 && Date.now() - hoverOpenedAt < 500) {
+			provenance = "pinned";
+			hoverOpenedAt = 0;
+			return;
+		}
+		options.closeFromPointer();
+	}
+	onScopeDispose(cancelTimers);
+	return {
+		cancel: cancelTimers,
+		isHoverDriven: () => provenance === "hover",
+		markClosed,
+		noteHoverOpened,
+		notePinned,
+		onFlyoutPointerEnter,
+		onFlyoutPointerLeave,
+		onTriggerClick,
+		onTriggerPointerEnter,
+		onTriggerPointerLeave
+	};
+}
 //#endregion
 //#region src/ContextMenu/ContextMenuSubMenu.vue
 const _hoisted_1$1 = [
@@ -441,7 +673,9 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 		const isOpen = ref(false);
 		const flyoutId = `astryx-context-menu-submenu-${useId()}`;
 		const flyoutLabel = computed(() => typeof props.label === "string" ? props.label : menu?.menuLabel.value ?? "Submenu");
-		const showsFlyout = computed(() => isOpen.value && (menu?.isOpen.value ?? true));
+		const ancestorOpen = inject(submenuAncestorOpenKey, computed(() => true));
+		const showsFlyout = computed(() => isOpen.value && (menu?.isOpen.value ?? true) && ancestorOpen.value);
+		provide(submenuAncestorOpenKey, showsFlyout);
 		const { position } = usePositionedLayer({
 			anchor: row,
 			layer: flyout,
@@ -469,6 +703,14 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 			enableEscape: computed(() => true),
 			onDismiss: () => close(true)
 		});
+		const hover = useSubmenuHover({
+			isEnabled: () => !props.isDisabled,
+			isOpen: () => isOpen.value,
+			flyout,
+			openFromHover,
+			openPinned: () => open(false),
+			closeFromPointer: () => close(false)
+		});
 		function open(focusFirstRow) {
 			if (props.isDisabled) return;
 			if (isOpen.value) {
@@ -477,10 +719,19 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 			}
 			isOpen.value = true;
 			emit("openChange", true);
+			hover.notePinned();
 			if (focusFirstRow) nextTick(() => nav.focusFirst());
 		}
+		function openFromHover() {
+			if (props.isDisabled || isOpen.value) return;
+			isOpen.value = true;
+			emit("openChange", true);
+			hover.noteHoverOpened();
+		}
 		function close(focusRow) {
-			if (!isOpen.value) return;
+			const wasOpen = isOpen.value;
+			hover.markClosed();
+			if (!wasOpen) return;
 			isOpen.value = false;
 			nav.resetTypeahead();
 			emit("openChange", false);
@@ -496,12 +747,22 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 			close(false);
 		}
 		function onRowFocusOut() {
-			if (!isOpen.value) return;
+			if (!isOpen.value || hover.isHoverDriven()) return;
 			nextTick(() => {
+				if (!isOpen.value || hover.isHoverDriven()) return;
 				const active = row.value?.ownerDocument.activeElement;
 				if (!(active instanceof Node && (row.value?.contains(active) === true || flyout.value?.contains(active) === true))) close(false);
 			});
 		}
+		function onRowClick(event) {
+			hover.onTriggerClick(event);
+		}
+		function onRowPointerMove(event) {
+			if (props.isDisabled || event.pointerType !== "mouse") return;
+			const element = row.value;
+			if (element == null || element === element.ownerDocument.activeElement) return;
+			element.focus({ preventScroll: true });
+		}
 		function onFlyoutKeyDown(event) {
 			if (event.isComposing) return;
 			if (event.key === "ArrowLeft") {
@@ -515,11 +776,18 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 			emit("select", item, event);
 		}
 		function onRowPointerEnter(event) {
-			if (event.pointerType !== "mouse") return;
-			open(false);
+			hover.onTriggerPointerEnter(event);
 		}
-		watch(() => menu?.isOpen.value, (open) => {
-			if (open === false) close(false);
+		watch(() => menu?.isOpen.value, (menuOpen) => {
+			if (menuOpen === false) {
+				hover.cancel();
+				close(false);
+			}
+		});
+		watch(ancestorOpen, (visible) => {
+			if (visible) return;
+			hover.cancel();
+			close(false);
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock(Fragment, null, [
@@ -538,10 +806,12 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 					role: "menuitem",
 					style: unref(attrs).style,
 					tabindex: __props.isDisabled ? void 0 : -1,
-					onClick: _cache[0] || (_cache[0] = ($event) => open(false)),
+					onClick: onRowClick,
 					onFocusout: onRowFocusOut,
 					onKeydown: onRowKeyDown,
-					onPointerenter: onRowPointerEnter
+					onPointerenter: onRowPointerEnter,
+					onPointerleave: _cache[0] || (_cache[0] = (...args) => unref(hover).onTriggerPointerLeave && unref(hover).onTriggerPointerLeave(...args)),
+					onPointermove: onRowPointerMove
 				}), [
 					__props.icon != null || _ctx.$slots.icon ? (openBlock(), createElementBlock("span", _hoisted_2, [renderSlot(_ctx.$slots, "icon", {}, () => [createVNode(_sfc_main$6, {
 						icon: __props.icon,
@@ -573,7 +843,9 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 						style: normalizeStyle(flyoutStyle.value),
 						tabindex: "-1",
 						onContextmenu: _cache[1] || (_cache[1] = withModifiers(() => {}, ["prevent"])),
-						onKeydown: onFlyoutKeyDown
+						onKeydown: onFlyoutKeyDown,
+						onPointerenter: _cache[2] || (_cache[2] = (...args) => unref(hover).onFlyoutPointerEnter && unref(hover).onFlyoutPointerEnter(...args)),
+						onPointerleave: _cache[3] || (_cache[3] = (...args) => unref(hover).onFlyoutPointerLeave && unref(hover).onFlyoutPointerLeave(...args))
 					}, [renderSlot(_ctx.$slots, "default", {}, () => [createVNode(_sfc_main$1, {
 						items: __props.items ?? [],
 						onSelect: onNestedSelect

package/dist/DateInput/index.d.ts

@@ -1,2 +1,2 @@
-import { i as DateInputSlots, n as DateInputEmits, r as DateInputProps, t as _default } from "../index-Cdi82rTW.js";
+import { i as DateInputSlots, n as DateInputEmits, r as DateInputProps, t as _default } from "../index-ZJyk8RtQ.js";
 export { _default as DateInput, type DateInputEmits, type DateInputProps, type DateInputSlots };

package/dist/DateInput/index.js

@@ -1,2 +1,2 @@
-import { t as _sfc_main } from "../DateInput-zJAdXByM.js";
+import { t as _sfc_main } from "../DateInput-D2ErjXYO.js";
 export { _sfc_main as DateInput };