@astryx-vue/core 0.2.5 → 0.3.0

package/dist/{Collapsible-3YerR-FO.js → Collapsible-Cov3Pyq5.js}

@@ -1,10 +1,61 @@
 import { t as _sfc_main$2 } from "./Icon-bteSId7T.js";
-import { Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, mergeModels, openBlock, provide, renderSlot, shallowRef, toDisplayString, useId, useModel, useTemplateRef, vShow, withCtx, withDirectives } from "vue";
+import { Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, getCurrentInstance, inject, mergeModels, openBlock, provide, renderSlot, shallowRef, toDisplayString, toValue, unref, useId, useModel, useTemplateRef, vShow, withCtx, withDirectives } from "vue";
 import "../styles/collapsible.css";
 //#region src/Collapsible/context.ts
 const collapsibleGroupKey = Symbol("collapsibleGroup");
 const collapsibleGroupPresentationKey = Symbol("collapsibleGroupPresentation");
 //#endregion
+//#region src/Collapsible/useCollapsible.ts
+function resolveConfig(value) {
+	if (value === false) return null;
+	if (value === true || value === void 0) return { defaultIsOpen: true };
+	return value;
+}
+/**
+* 对应原版 Astryx 的 `hooks/useCollapsible`：折叠面板的状态机。
+* 支持三种模式——组管理（在 `CollapsibleGroup` 里带 `value`）、受控（`isOpen`）、不受控。
+* `Collapsible` 组件内部也用它，所以自定义折叠 UI 和组件本身的行为一致。
+*
+* ```ts
+* const { isOpen, toggle } = useCollapsible({ isCollapsible: true })
+* ```
+*/
+function useCollapsible(options = {}) {
+	const config = computed(() => resolveConfig(toValue(options.isCollapsible)));
+	const isEnabled = computed(() => config.value != null);
+	const group = options.group !== void 0 ? options.group : getCurrentInstance() ? inject(collapsibleGroupKey, null) : null;
+	const initialIsOpen = toValue(config.value?.defaultIsOpen) ?? true;
+	const localIsOpen = shallowRef(initialIsOpen);
+	function groupKey() {
+		const key = toValue(options.value);
+		return key != null && key !== "" ? key : null;
+	}
+	const isOpen = computed(() => {
+		if (!isEnabled.value) return false;
+		const key = groupKey();
+		if (group != null && key != null) return group.isOpen(key);
+		return config.value?.isOpen?.value ?? localIsOpen.value;
+	});
+	function toggle() {
+		if (!isEnabled.value) return;
+		const key = groupKey();
+		if (group != null && key != null) {
+			group.toggle(key);
+			return;
+		}
+		const next = !isOpen.value;
+		localIsOpen.value = next;
+		const controlled = config.value?.isOpen;
+		if (controlled != null) controlled.value = next;
+		config.value?.onOpenChange?.(next);
+	}
+	return {
+		isEnabled,
+		isOpen,
+		toggle
+	};
+}
+//#endregion
 //#region src/Collapsible/Collapsible.vue
 const _hoisted_1$1 = ["data-density", "data-dividers"];
 const _hoisted_2 = [
@@ -44,15 +95,16 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
-		const open = useModel(__props, "isOpen");
-		const localIsOpen = shallowRef(props.defaultIsOpen);
-		const group = inject(collapsibleGroupKey, null);
-		const presentation = inject(collapsibleGroupPresentationKey, null);
-		const isGrouped = computed(() => group != null && props.value != null && props.value !== "");
-		const isOpen = computed(() => {
-			if (isGrouped.value && group != null && props.value != null) return group.isOpen(props.value);
-			return open.value ?? localIsOpen.value;
+		const collapsible = useCollapsible({
+			value: () => props.value,
+			isCollapsible: {
+				isOpen: useModel(__props, "isOpen"),
+				defaultIsOpen: () => props.defaultIsOpen,
+				onOpenChange: (isOpen) => emit("openChange", isOpen)
+			}
 		});
+		const isOpen = collapsible.isOpen;
+		const presentation = inject(collapsibleGroupPresentationKey, null);
 		const density = computed(() => presentation?.density.value ?? null);
 		const hasDividers = computed(() => presentation?.hasDividers.value ?? false);
 		const chevronPosition = computed(() => props.chevronPosition ?? presentation?.chevronPosition.value ?? "end");
@@ -62,14 +114,7 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		__expose({ element: computed(() => root.value ?? null) });
 		function toggle() {
 			if (props.isDisabled) return;
-			if (isGrouped.value && group != null && props.value != null) {
-				group.toggle(props.value);
-				return;
-			}
-			const next = !isOpen.value;
-			localIsOpen.value = next;
-			open.value = next;
-			emit("openChange", next);
+			collapsible.toggle();
 		}
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
@@ -82,9 +127,9 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 				type: "button",
 				class: "astryx-collapsible-trigger",
 				"data-chevron-position": chevronPosition.value,
-				"data-open": isOpen.value ? "open" : void 0,
+				"data-open": unref(isOpen) ? "open" : void 0,
 				"data-disabled": __props.isDisabled ? "disabled" : void 0,
-				"aria-expanded": isOpen.value,
+				"aria-expanded": unref(isOpen),
 				"aria-controls": contentId,
 				"aria-disabled": __props.isDisabled || void 0,
 				tabindex: __props.isDisabled ? -1 : void 0,
@@ -112,8 +157,8 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 				default: withCtx(() => [withDirectives(createElementVNode("div", {
 					id: contentId,
 					class: "astryx-collapsible-content",
-					"data-open": isOpen.value ? "open" : void 0
-				}, [createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "default")])], 8, _hoisted_4), [[vShow, isOpen.value]])]),
+					"data-open": unref(isOpen) ? "open" : void 0
+				}, [createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "default")])], 8, _hoisted_4), [[vShow, unref(isOpen)]])]),
 				_: 3
 			})], 8, _hoisted_1$1);
 		};
@@ -189,4 +234,4 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 	}
 });
 //#endregion
-export { _sfc_main$1 as n, _sfc_main as t };
+export { _sfc_main$1 as n, useCollapsible as r, _sfc_main as t };

package/dist/CommandPalette/index.d.ts

@@ -1,2 +1,2 @@
-import { a as _default$2, c as CommandPaletteEmits, d as CommandPaletteItemProps, f as CommandPaletteItemSlotProps, h as CommandPaletteSlots, i as _default$3, l as CommandPaletteGroupProps, m as CommandPaletteProps, n as _default$5, o as _default$1, p as CommandPaletteListProps, r as _default$4, s as _default, t as _default$6, u as CommandPaletteInputProps } from "../index-Be1czg3M.js";
-export { _default as CommandPalette, type CommandPaletteEmits, _default$1 as CommandPaletteEmpty, _default$2 as CommandPaletteFooter, _default$3 as CommandPaletteGroup, type CommandPaletteGroupProps, _default$4 as CommandPaletteInput, type CommandPaletteInputProps, _default$5 as CommandPaletteItem, type CommandPaletteItemProps, type CommandPaletteItemSlotProps, _default$6 as CommandPaletteList, type CommandPaletteListProps, type CommandPaletteProps, type CommandPaletteSlots };
+import { _ as CommandPaletteSlots, a as _default$2, c as CommandPaletteEmits, d as CommandPaletteInputProps, f as CommandPaletteItemEmits, g as CommandPaletteProps, h as CommandPaletteListProps, i as _default$3, l as CommandPaletteGroupProps, m as CommandPaletteItemSlotProps, n as _default$5, o as _default$1, p as CommandPaletteItemProps, r as _default$4, s as _default, t as _default$6, u as CommandPaletteInputEmits } from "../index-BhpAUzUr.js";
+export { _default as CommandPalette, type CommandPaletteEmits, _default$1 as CommandPaletteEmpty, _default$2 as CommandPaletteFooter, _default$3 as CommandPaletteGroup, type CommandPaletteGroupProps, _default$4 as CommandPaletteInput, type CommandPaletteInputEmits, type CommandPaletteInputProps, _default$5 as CommandPaletteItem, type CommandPaletteItemEmits, type CommandPaletteItemProps, type CommandPaletteItemSlotProps, _default$6 as CommandPaletteList, type CommandPaletteListProps, type CommandPaletteProps, type CommandPaletteSlots };

package/dist/CommandPalette/index.js

@@ -1,2 +1,2 @@
-import { a as _sfc_main$3, i as _sfc_main$4, n as _sfc_main$6, o as _sfc_main$2, r as _sfc_main$5, s as _sfc_main$1, t as _sfc_main } from "../CommandPalette-DKgHzmJk.js";
+import { a as _sfc_main$3, i as _sfc_main$4, n as _sfc_main$6, o as _sfc_main$2, r as _sfc_main$5, s as _sfc_main$1, t as _sfc_main } from "../CommandPalette-YHsUNg3V.js";
 export { _sfc_main as CommandPalette, _sfc_main$1 as CommandPaletteEmpty, _sfc_main$2 as CommandPaletteFooter, _sfc_main$3 as CommandPaletteGroup, _sfc_main$4 as CommandPaletteInput, _sfc_main$5 as CommandPaletteItem, _sfc_main$6 as CommandPaletteList };

package/dist/{CommandPalette-DKgHzmJk.js → CommandPalette-YHsUNg3V.js}

@@ -1,10 +1,11 @@
 import { t as useAnnounce } from "./announce-Cnio10Wk.js";
 import { n as useAsyncSource } from "./useAsyncSource-Gk0VtE7_.js";
 import { t as _sfc_main$7 } from "./Kbd-BB-Dw6zE.js";
-import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
-import { n as DIALOG_CONTEXT_KEY, t as _sfc_main$8 } from "./Dialog-rfUt3y8P.js";
+import { o as useAstryxMessages } from "./context-iABt_ueM.js";
+import { n as DIALOG_CONTEXT_KEY, t as _sfc_main$8 } from "./Dialog-FGHfDu5M.js";
+import { t as useScrollbars } from "./useScrollbars-C2NJ6Qwq.js";
 import { t as _sfc_main$9 } from "./Spinner-9cYUCnDy.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, mergeModels, onMounted, openBlock, provide, ref, renderList, renderSlot, toDisplayString, unref, useId, useModel, useTemplateRef, watch, withCtx } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, getCurrentInstance, inject, mergeModels, onMounted, openBlock, provide, ref, renderList, renderSlot, toDisplayString, unref, useId, useModel, useTemplateRef, watch, withCtx } from "vue";
 import "../styles/command-palette.css";
 //#region src/CommandPalette/CommandPaletteEmpty.vue
 const _hoisted_1$6 = { class: "astryx-command-palette-empty" };
@@ -86,17 +87,20 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		hasAutoFocus: {
 			type: Boolean,
 			default: true
-		}
+		},
+		value: {}
 	},
-	setup(__props) {
+	emits: ["valueChange", "update:value"],
+	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const emit = __emit;
 		const palette = inject(commandPaletteKey, null);
 		const dialog = inject(DIALOG_CONTEXT_KEY, null);
 		const messages = useAstryxMessages();
 		const inputRef = useTemplateRef("input");
 		const placeholder = computed(() => props.placeholder ?? messages.value.commandPalette.placeholder);
-		const label = computed(() => props.label ?? placeholder.value);
-		const value = computed(() => palette?.search.value ?? "");
+		const label = computed(() => props.label ?? messages.value.commandPalette.inputLabel);
+		const value = computed(() => props.value ?? palette?.search.value ?? "");
 		const activeDescendant = computed(() => {
 			const index = palette?.highlightedIndex.value ?? -1;
 			if (palette == null || index < 0) return void 0;
@@ -104,7 +108,13 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		});
 		const shouldFocus = computed(() => props.hasAutoFocus && dialog?.isInline.value !== true);
 		function onInput(event) {
-			palette?.setSearch(event.target.value);
+			const next = event.target.value;
+			if (props.value == null) {
+				palette?.setSearch(next);
+				return;
+			}
+			emit("valueChange", next);
+			emit("update:value", next);
 		}
 		onMounted(() => {
 			if (shouldFocus.value) requestAnimationFrame(() => inputRef.value?.focus());
@@ -119,7 +129,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 					ref: "input",
 					"aria-activedescendant": activeDescendant.value,
 					"aria-autocomplete": "list",
-					"aria-controls": unref(palette)?.listId,
+					"aria-controls": unref(palette) && unref(palette).items.value.length > 0 ? unref(palette).listId : void 0,
 					"aria-expanded": unref(palette) ? true : void 0,
 					"aria-label": label.value,
 					class: "astryx-command-palette-field",
@@ -134,7 +144,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 					key: 0,
 					class: "astryx-command-palette-spinner",
 					size: "sm"
-				})) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "end")])
+				})) : createCommentVNode("v-if", true), renderSlot(_ctx.$slots, "end", {}, () => [renderSlot(_ctx.$slots, "endContent")])])
 			]);
 		};
 	}
@@ -158,21 +168,42 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 		isDisabled: {
 			type: Boolean,
 			default: false
-		}
+		},
+		isHighlighted: { type: Boolean },
+		isSelected: { type: Boolean }
 	},
-	setup(__props) {
+	emits: ["select"],
+	setup(__props, { emit: __emit }) {
 		const props = __props;
+		const emit = __emit;
 		const palette = inject(commandPaletteKey, null);
+		const instance = getCurrentInstance();
+		/**
+		* Vue turns an omitted boolean prop into `false`, so a `??` fallback cannot
+		* tell "not passed" from "passed false". The vnode props can.
+		*/
+		function wasPassed(name) {
+			const vnodeProps = instance?.vnode.props;
+			if (vnodeProps == null) return false;
+			if (Object.hasOwn(vnodeProps, name)) return true;
+			const kebab = name.replace(/[A-Z]/g, (letter) => `-${letter.toLowerCase()}`);
+			return Object.hasOwn(vnodeProps, kebab);
+		}
 		const index = computed(() => palette?.items.value.findIndex((item) => item.id === props.value) ?? -1);
-		const isHighlighted = computed(() => index.value >= 0 && palette?.highlightedIndex.value === index.value);
-		const isSelected = computed(() => palette?.value.value != null && palette.value.value === props.value);
+		const derivedHighlighted = computed(() => index.value >= 0 && palette?.highlightedIndex.value === index.value);
+		const derivedSelected = computed(() => palette?.value.value != null && palette.value.value === props.value);
+		/** An explicit prop wins; without it the state comes from the surrounding palette. */
+		const isHighlighted = computed(() => wasPassed("isHighlighted") ? props.isHighlighted : derivedHighlighted.value);
+		const isSelected = computed(() => wasPassed("isSelected") ? props.isSelected : derivedSelected.value);
 		function onKeyDown(event) {
 			if (event.key !== "Enter" && event.key !== " ") return;
 			event.preventDefault();
 			select();
 		}
 		function select() {
-			if (props.isDisabled || palette == null || index.value < 0) return;
+			if (props.isDisabled) return;
+			emit("select", props.value);
+			if (palette == null || index.value < 0) return;
 			const item = palette.items.value[index.value];
 			if (item != null) palette.selectItem(item);
 		}
@@ -184,7 +215,6 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 			if (palette?.isInline.value && palette.highlightedIndex.value === index.value && index.value === 0) return;
 			element.scrollIntoView({ block: "nearest" });
 		}
-		onMounted(() => {});
 		watch(isHighlighted, (highlighted, _previous, onCleanup) => {
 			if (!highlighted) return;
 			const id = `${palette?.listId}-item-${index.value}`;
@@ -215,7 +245,11 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 });
 //#endregion
 //#region src/CommandPalette/CommandPaletteList.vue
-const _hoisted_1$1 = ["id", "aria-label"];
+const _hoisted_1$1 = [
+	"id",
+	"role",
+	"aria-label"
+];
 const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 	name: "AstryxCommandPaletteList",
 	__name: "CommandPaletteList",
@@ -225,12 +259,17 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		const palette = inject(commandPaletteKey, null);
 		const messages = useAstryxMessages();
 		const label = computed(() => props.label ?? messages.value.commandPalette.listLabel);
+		/** 没有可选项时它只是个空容器，不再当作 listbox 暴露给读屏。 */
+		const hasOptions = computed(() => palette == null || palette.items.value.length > 0);
+		const listEl = useTemplateRef("list");
+		useScrollbars(listEl);
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				id: unref(palette)?.listId,
+				ref: "list",
 				class: "astryx-command-palette-list",
-				role: "listbox",
-				"aria-label": label.value
+				role: hasOptions.value ? "listbox" : void 0,
+				"aria-label": hasOptions.value ? label.value : void 0
 			}, [renderSlot(_ctx.$slots, "default")], 8, _hoisted_1$1);
 		};
 	}
@@ -282,7 +321,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		"value": { default: void 0 },
 		"valueModifiers": {}
 	}),
-	emits: /*@__PURE__*/ mergeModels(["openChange"], ["update:value"]),
+	emits: /*@__PURE__*/ mergeModels(["openChange", "valueChange"], ["update:value"]),
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -353,6 +392,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		function selectItem(item) {
 			if (item.disabled) return;
 			value.value = item.id;
+			emit("valueChange", item.id);
 			close();
 		}
 		function onKeyDown(event) {

package/dist/ComplexSelector/index.d.ts

@@ -1,2 +1,2 @@
-import { a as ComplexSelectorProps, c as ComplexSelectorState, i as ComplexSelectorHandleRef, l as ComplexSelectorTriggerProps, n as ComplexSelectorEmits, o as ComplexSelectorSlotProps, r as ComplexSelectorHandle, s as ComplexSelectorSlots, t as _default, u as ComplexSelectorVariant } from "../index-ChWlKHjc.js";
+import { a as ComplexSelectorProps, c as ComplexSelectorState, i as ComplexSelectorHandleRef, l as ComplexSelectorTriggerProps, n as ComplexSelectorEmits, o as ComplexSelectorSlotProps, r as ComplexSelectorHandle, s as ComplexSelectorSlots, t as _default, u as ComplexSelectorVariant } from "../index-Cde5JvtX.js";
 export { _default as ComplexSelector, _default as default, type ComplexSelectorEmits, type ComplexSelectorHandle, type ComplexSelectorHandleRef, type ComplexSelectorProps, type ComplexSelectorSlotProps, type ComplexSelectorSlots, type ComplexSelectorState, type ComplexSelectorTriggerProps, type ComplexSelectorVariant };

package/dist/ComplexSelector/index.js

@@ -1,2 +1,2 @@
-import { n as _sfc_main, t as ComplexSelector_default } from "../ComplexSelector-Dv44FFhN.js";
+import { n as _sfc_main, t as ComplexSelector_default } from "../ComplexSelector-DWLdKPGI.js";
 export { _sfc_main as ComplexSelector, ComplexSelector_default as default };

package/dist/{ComplexSelector-Dv44FFhN.js → ComplexSelector-DWLdKPGI.js}

@@ -1,9 +1,10 @@
-import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
+import { o as useAstryxMessages } from "./context-iABt_ueM.js";
+import { t as useScrollbars } from "./useScrollbars-C2NJ6Qwq.js";
 import { t as _sfc_main$1 } from "./Icon-bteSId7T.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-D7zqpFwU.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 { t as _sfc_main$3 } from "./Field-D5gUEGw4.js";
+import { t as _sfc_main$4 } from "./Popover-DJf8POzL.js";
+import { computed, createBlock, createCommentVNode, createElementVNode, createVNode, defineComponent, guardReactiveProps, mergeModels, normalizeProps, onBeforeUnmount, openBlock, ref, renderSlot, resolveDynamicComponent, toDisplayString, useId, useModel, useSlots, useTemplateRef, watch, withCtx } from "vue";
 import "../styles/complex-selector.css";
 //#region src/ComplexSelector/ComplexSelector.vue
 const _hoisted_1 = [
@@ -63,7 +64,12 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		"modelValue": { required: true },
 		"modelModifiers": {}
 	}),
-	emits: /*@__PURE__*/ mergeModels(["change"], ["update:modelValue"]),
+	emits: /*@__PURE__*/ mergeModels([
+		"change",
+		"click",
+		"keydown",
+		"openChange"
+	], ["update:modelValue"]),
 	setup(__props, { expose: __expose, emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -72,6 +78,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		const messages = useAstryxMessages();
 		const isOpen = ref(false);
 		const isPending = ref(false);
+		const contentEl = useTemplateRef("contentEl");
+		useScrollbars(contentEl);
 		const optimistic = ref(void 0);
 		const triggerId = `astryx-complex-selector-${useId()}`;
 		const labelId = `${triggerId}-label`;
@@ -119,15 +127,31 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				isOpen.value = true;
 			}
 		}
+		/** 内置触发器：先让调用方有机会取消打开，再走自己的开关。 */
+		function onBuiltinClick(event) {
+			emit("click", event);
+			if (event.defaultPrevented) event.stopImmediatePropagation();
+		}
+		/** 内置触发器：内置处理完再透出，每个键都收到。 */
+		function onBuiltinKeyDown(event) {
+			onTriggerKeyDown(event);
+			emit("keydown", event);
+		}
+		/** 自定义触发器：开关已经做完，点不能取消；内置处理取消的键不外透。 */
 		function onCustomClick(event) {
 			event.stopImmediatePropagation();
 			toggle();
+			emit("click", event);
+		}
+		function onCustomKeyDown(event) {
+			onTriggerKeyDown(event);
+			if (!event.defaultPrevented) emit("keydown", event);
 		}
 		const hasCustomTrigger = computed(() => props.renderTrigger != null || slots.trigger != null);
 		const triggerProps = computed(() => ({
 			"id": triggerId,
 			"onClick": onCustomClick,
-			"onKeydown": onTriggerKeyDown,
+			"onKeydown": onCustomKeyDown,
 			"aria-haspopup": "dialog",
 			"aria-expanded": isOpen.value,
 			"aria-controls": isOpen.value ? contentId : void 0,
@@ -141,6 +165,9 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			toggle,
 			isOpen: () => isOpen.value
 		};
+		watch(isOpen, (open) => {
+			emit("openChange", open);
+		});
 		function publishHandle(value) {
 			const target = props.handleRef;
 			if (target == null) return;
@@ -172,13 +199,15 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 			}, {
 				content: withCtx(() => [createElementVNode("div", {
 					id: contentId,
+					ref_key: "contentEl",
+					ref: contentEl,
 					class: "astryx-complex-selector-content"
 				}, [renderSlot(_ctx.$slots, "default", {
 					close,
 					commit,
 					state: state.value,
 					value: displayValue.value
-				})])]),
+				})], 512)]),
 				default: withCtx(() => [renderSlot(_ctx.$slots, "trigger", normalizeProps(guardReactiveProps(triggerProps.value)), () => [(openBlock(), createBlock(resolveDynamicComponent(triggerView)))])]),
 				_: 3
 			}, 8, [
@@ -218,13 +247,15 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				}, {
 					content: withCtx(() => [createElementVNode("div", {
 						id: contentId,
+						ref_key: "contentEl",
+						ref: contentEl,
 						class: "astryx-complex-selector-content"
 					}, [renderSlot(_ctx.$slots, "default", {
 						close,
 						commit,
 						state: state.value,
 						value: displayValue.value
-					})])]),
+					})], 512)]),
 					default: withCtx(() => [createElementVNode("button", {
 						id: triggerId,
 						class: "astryx-complex-selector",
@@ -239,7 +270,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 						"aria-required": __props.isRequired || void 0,
 						disabled: __props.isDisabled,
 						type: "button",
-						onKeydown: onTriggerKeyDown
+						onClick: onBuiltinClick,
+						onKeydown: onBuiltinKeyDown
 					}, [
 						__props.startIcon ? (openBlock(), createBlock(_sfc_main$1, {
 							key: 0,

package/dist/ContextMenu/index.d.ts

@@ -1,3 +1,3 @@
-import { Ar as ContextMenuItemIcon, Br as ContextMenuSize, Cr as ContextMenuDividerProps, Dr as ContextMenuGroupSlots, Er as ContextMenuGroupProps, Fr as ContextMenuPresentation, Gr as ContextMenuTriggerElement, Hr as ContextMenuSubMenuEmits, Ir as ContextMenuProps, Kr as ContextMenuVariant, Lr as ContextMenuRadioData, Mr as ContextMenuItemSlots, Nr as ContextMenuItemTarget, Or as ContextMenuItemData, Pr as ContextMenuOption, Rr as ContextMenuRadioOptionData, Sr as ContextMenuDividerData, Tr as ContextMenuEntry, Ur as ContextMenuSubMenuProps, Vr as ContextMenuSlots, Wr as ContextMenuSubMenuSlots, _r as _default$2, br as useContextMenuSize, gr as _default$3, hr as _default$4, jr as ContextMenuItemProps, kr as ContextMenuItemEmits, mr as _default$7, qr as ContextMenuWidth, vr as _default, wr as ContextMenuEmits, xr as ContextMenuCheckboxData, yr as useContextMenu, zr as ContextMenuSection } from "../index-B9rqmYxh.js";
+import { $i as ContextMenuItemProps, Bi as _default, Gi as ContextMenuDividerProps, Hi as useContextMenuSize, Ii as _default$7, Ji as ContextMenuGroupProps, Ki as ContextMenuEmits, Li as _default$4, Qi as ContextMenuItemIcon, Ri as _default$3, Ui as ContextMenuCheckboxData, Vi as useContextMenu, Wi as ContextMenuDividerData, Xi as ContextMenuItemData, Yi as ContextMenuGroupSlots, Zi as ContextMenuItemEmits, aa as ContextMenuRadioData, ca as ContextMenuSize, da as ContextMenuSubMenuProps, ea as ContextMenuItemSlots, fa as ContextMenuSubMenuSlots, ha as ContextMenuWidth, ia as ContextMenuProps, la as ContextMenuSlots, ma as ContextMenuVariant, na as ContextMenuOption, oa as ContextMenuRadioOptionData, pa as ContextMenuTriggerElement, qi as ContextMenuEntry, ra as ContextMenuPresentation, sa as ContextMenuSection, ta as ContextMenuItemTarget, ua as ContextMenuSubMenuEmits, zi as _default$2 } from "../index-DUaLJO7l.js";
 import { n as _default$5, r as _default$1, t as _default$6 } from "../DropdownMenuRadioItem.vue-CXEURBcq.js";
 export { _default as ContextMenu, type ContextMenuCheckboxData, _default$1 as ContextMenuCheckboxItem, _default$2 as ContextMenuDivider, type ContextMenuDividerData, type ContextMenuDividerProps, type ContextMenuEmits, type ContextMenuEntry, _default$3 as ContextMenuGroup, type ContextMenuGroupProps, type ContextMenuGroupSlots, _default$4 as ContextMenuItem, type ContextMenuItemData, type ContextMenuItemEmits, type ContextMenuItemIcon, type ContextMenuItemProps, type ContextMenuItemSlots, type ContextMenuItemTarget, type ContextMenuOption, type ContextMenuPresentation, type ContextMenuProps, type ContextMenuRadioData, _default$5 as ContextMenuRadioGroup, _default$6 as ContextMenuRadioItem, type ContextMenuRadioOptionData, type ContextMenuSection, type ContextMenuSize, type ContextMenuSlots, _default$7 as ContextMenuSubMenu, type ContextMenuSubMenuEmits, type ContextMenuSubMenuProps, type ContextMenuSubMenuSlots, type ContextMenuTriggerElement, type ContextMenuVariant, type ContextMenuWidth, useContextMenu, useContextMenuSize };

package/dist/ContextMenu/index.js

@@ -1,3 +1,3 @@
-import { d as useContextMenuSize, i as _sfc_main$1, n as _sfc_main$6, r as _sfc_main$5, u as useContextMenu } from "../useMenuDrillIn-BgjJcY3K.js";
-import { a as _sfc_main$2, i as _sfc_main$3, n as _sfc_main$7, r as _sfc_main$4, t as _sfc_main } from "../ContextMenu-BeJO5HYx.js";
+import { d as useContextMenuSize, i as _sfc_main$1, n as _sfc_main$6, r as _sfc_main$5, u as useContextMenu } from "../useMenuDrillIn-DzKGkTho.js";
+import { a as _sfc_main$2, i as _sfc_main$3, n as _sfc_main$7, r as _sfc_main$4, t as _sfc_main } from "../ContextMenu-Bq9b3Ti5.js";
 export { _sfc_main as ContextMenu, _sfc_main$1 as ContextMenuCheckboxItem, _sfc_main$2 as ContextMenuDivider, _sfc_main$3 as ContextMenuGroup, _sfc_main$4 as ContextMenuItem, _sfc_main$5 as ContextMenuRadioGroup, _sfc_main$6 as ContextMenuRadioItem, _sfc_main$7 as ContextMenuSubMenu, useContextMenu, useContextMenuSize };

package/dist/{ContextMenu-BeJO5HYx.js → ContextMenu-Bq9b3Ti5.js}

@@ -1,16 +1,17 @@
+import { n as useLinkComponent } from "./context-C_peZbXf.js";
 import { t as useMediaQuery } from "./useMediaQuery-GMmgp28-.js";
-import { t as useDismiss } from "./useDismiss-Cj8x_51F.js";
-import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
-import { a as useLongPress, i as useMenuNav, n as useMenuPress, r as isModifiedClick, t as resetMenuPress } from "./useMenuPress-DUmEy4TB.js";
+import { n as useDismiss, t as usePositionedLayer } from "./usePositionedLayer-Cru9_00b.js";
+import { o as useAstryxMessages } from "./context-iABt_ueM.js";
+import { a as useLongPress, i as useMenuNav, n as useMenuPress, r as isModifiedClick, t as resetMenuPress } from "./useMenuPress-D-FRNrBW.js";
 import { n as useOverflow } from "./useOverflow-VrwF5oek.js";
-import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
-import { t as _sfc_main$6 } from "./BottomSheet-BV6vfgGu.js";
+import { t as useScrollbars } from "./useScrollbars-C2NJ6Qwq.js";
+import { t as _sfc_main$6 } from "./BottomSheet-pt7m4CvC.js";
 import { t as _sfc_main$7 } from "./Icon-bteSId7T.js";
-import { c as contextMenuContextKey, d as useContextMenuSize, i as _sfc_main$8, l as submenuAncestorOpenKey, n as _sfc_main$10, r as _sfc_main$9, t as useMenuDrillIn, u as useContextMenu } from "./useMenuDrillIn-BgjJcY3K.js";
+import { c as contextMenuContextKey, d as useContextMenuSize, i as _sfc_main$8, l as submenuAncestorOpenKey, n as _sfc_main$10, r as _sfc_main$9, t as useMenuDrillIn, u as useContextMenu } from "./useMenuDrillIn-DzKGkTho.js";
 import { t as _sfc_main$11 } from "./Divider-BtwnL18I.js";
 import { t as _sfc_main$12 } from "./Spinner-9cYUCnDy.js";
 import { t as useSubmenuMode } from "./useSubmenuMode-CZN9qrUo.js";
-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, shallowRef, 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, shallowRef, toDisplayString, toRaw, unref, useAttrs, useId, useModel, useTemplateRef, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
 import "../styles/context-menu.css";
 //#region src/ContextMenu/ContextMenuDivider.vue
 const _sfc_main$5 = /*@__PURE__*/ defineComponent({
@@ -95,6 +96,9 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		const props = __props;
 		const emit = __emit;
 		const menu = useContextMenu();
+		const linkComponent = useLinkComponent();
+		/** 有链接时用的根组件，没有 provider 时还是 `<a>`。 */
+		const linkRoot = computed(() => linkComponent.value == null ? "a" : toRaw(linkComponent.value));
 		const size = useContextMenuSize();
 		const root = useTemplateRef("root");
 		const isDestructive = computed(() => props.variant === "destructive");
@@ -122,7 +126,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 			element.focus({ preventScroll: true });
 		}
 		return (_ctx, _cache) => {
-			return openBlock(), createBlock(resolveDynamicComponent(__props.href != null ? "a" : "div"), {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.href != null ? linkRoot.value : "div"), {
 				ref_key: "root",
 				ref: root,
 				"aria-disabled": __props.isDisabled || void 0,
@@ -131,6 +135,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 				"data-size": unref(size),
 				"data-variant": __props.variant,
 				href: __props.href,
+				to: __props.href != null && linkRoot.value !== "a" ? __props.href : void 0,
 				rel: __props.rel,
 				role: "menuitem",
 				tabindex: __props.isDisabled ? void 0 : -1,
@@ -156,6 +161,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 				"data-size",
 				"data-variant",
 				"href",
+				"to",
 				"rel",
 				"tabindex",
 				"target"
@@ -898,6 +904,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		const trigger = useTemplateRef("trigger");
 		const cursorAnchor = useTemplateRef("cursorAnchor");
 		const panel = useTemplateRef("panel");
+		useScrollbars(panel);
 		const cursorPoint = ref({
 			x: 0,
 			y: 0

package/dist/DateInput/index.d.ts

@@ -1,2 +1,2 @@
-import { ar as DateInputEmits, cr as DateInputNativePicker, dr as DateInputSlots, fr as DateInputStatus, ir as _default, lr as DateInputPresentation, or as DateInputFormat, pr as DateInputStatusType, sr as DateInputFormatName, ur as DateInputProps } from "../index-B9rqmYxh.js";
+import { Ai as DateInputNativePicker, Di as DateInputEmits, Ei as _default, Fi as DateInputStatusType, Mi as DateInputProps, Ni as DateInputSlots, Oi as DateInputFormat, Pi as DateInputStatus, ji as DateInputPresentation, ki as DateInputFormatName } from "../index-DUaLJO7l.js";
 export { _default as DateInput, type DateInputEmits, type DateInputFormat, type DateInputFormatName, type DateInputNativePicker, type DateInputPresentation, type DateInputProps, type DateInputSlots, type DateInputStatus, type DateInputStatusType };

package/dist/DateInput/index.js

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