@astryx-vue/core 0.3.0 → 0.4.1

package/dist/{TopNav-Ciq0l1w7.js → TopNav-Dw0m387B.js}

@@ -1,15 +1,15 @@
 import { n as useLinkComponent } from "./context-C_peZbXf.js";
 import { t as useMediaQuery } from "./useMediaQuery-GMmgp28-.js";
 import { n as useAppShellMobile } from "./useAppShellMobile-DTsyuAJ4.js";
-import { o as useAstryxMessages } from "./context-iABt_ueM.js";
-import { t as useListFocus } from "./useListFocus-D0iOJl39.js";
-import { n as _sfc_main$9, r as mobileNavKey, t as _sfc_main$8 } from "./MobileNavToggle-DxGz0xKA.js";
-import { t as _sfc_main$10 } from "./Icon-bteSId7T.js";
-import { n as resolveNavRoot } from "./link-C4_WogdF.js";
-import { t as _sfc_main$11 } from "./NavItem-BBIGSvDj.js";
-import { n as navMenuCloseKey, t as _sfc_main$12 } from "./NavDisclosure-C_fugrQ3.js";
-import { n as _sfc_main$14, t as _sfc_main$13 } from "./NavMenuItem-BvJNsDFC.js";
-import { t as _sfc_main$15 } from "./NavHeadingSurface-B3yJspSN.js";
+import { t as _sfc_main$8 } from "./Icon-KDnUyY7f.js";
+import { s as useAstryxMessages } from "./context-CM-cjGg_.js";
+import { t as useListFocus } from "./useListFocus-ChxLg0b4.js";
+import { n as _sfc_main$10, r as mobileNavKey, t as _sfc_main$9 } from "./MobileNavToggle-DgJYyzT6.js";
+import { i as safeNavHref, n as isNavigableHref, r as resolveNavRoot } from "./link-DuuA2eCL.js";
+import { t as _sfc_main$11 } from "./NavItem-BPb3yfgz.js";
+import { n as navMenuCloseKey, t as _sfc_main$12 } from "./NavDisclosure-Bq9DTZLO.js";
+import { n as _sfc_main$14, t as _sfc_main$13 } from "./NavMenuItem-D3FO90GR.js";
+import { t as _sfc_main$15 } from "./NavHeadingSurface-DQXisuaX.js";
 import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, guardReactiveProps, inject, nextTick, normalizeClass, normalizeProps, onMounted, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useSlots, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
 import "../styles/top-nav.css";
 //#region src/TopNav/TopNav.vue
@@ -64,12 +64,12 @@ const _sfc_main$7 = /*@__PURE__*/ defineComponent({
 				}, [
 					createElementVNode("div", _hoisted_2$5, [unref(slots).heading ? (openBlock(), createElementBlock("div", _hoisted_3$5, [renderSlot(_ctx.$slots, "heading")])) : createCommentVNode("v-if", true), !isCompact.value ? (openBlock(), createElementBlock("div", _hoisted_4$4, [renderSlot(_ctx.$slots, "start"), renderSlot(_ctx.$slots, "default")])) : createCommentVNode("v-if", true)]),
 					hasCenter.value && !isCompact.value ? (openBlock(), createElementBlock("div", _hoisted_5$2, [renderSlot(_ctx.$slots, "center")])) : createCommentVNode("v-if", true),
-					createElementVNode("div", _hoisted_6, [renderSlot(_ctx.$slots, "end"), showShellToggle.value ? (openBlock(), createBlock(_sfc_main$8, {
+					createElementVNode("div", _hoisted_6, [renderSlot(_ctx.$slots, "end"), showShellToggle.value ? (openBlock(), createBlock(_sfc_main$9, {
 						key: 0,
 						"is-open": unref(shell).isMobileNavOpen,
 						controls: unref(shell).mobileNavId,
 						"onUpdate:isOpen": setShellOpen
-					}, null, 8, ["is-open", "controls"])) : ownsDrawer.value && hasDrawer.value ? (openBlock(), createBlock(_sfc_main$8, {
+					}, null, 8, ["is-open", "controls"])) : ownsDrawer.value && hasDrawer.value ? (openBlock(), createBlock(_sfc_main$9, {
 						key: 1,
 						"is-open": mobileOpen.value,
 						"onUpdate:isOpen": _cache[0] || (_cache[0] = ($event) => mobileOpen.value = $event),
@@ -84,7 +84,7 @@ const _sfc_main$7 = /*@__PURE__*/ defineComponent({
 					renderSlot(_ctx.$slots, "default"),
 					renderSlot(_ctx.$slots, "center")
 				])], 8, ["to"])) : createCommentVNode("v-if", true),
-				ownsDrawer.value && hasDrawer.value ? (openBlock(), createBlock(_sfc_main$9, {
+				ownsDrawer.value && hasDrawer.value ? (openBlock(), createBlock(_sfc_main$10, {
 					key: 1,
 					id: drawerId,
 					"is-open": mobileOpen.value,
@@ -307,7 +307,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 				"aria-controls": drawerItemsId,
 				"aria-expanded": expanded.value ? "true" : "false",
 				onClick: _cache[0] || (_cache[0] = ($event) => expanded.value = !expanded.value)
-			}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$10, {
+			}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$8, {
 				icon: "chevronDown",
 				size: "sm",
 				class: normalizeClass({ "astryx-top-nav-menu__chevron--open": expanded.value })
@@ -330,7 +330,7 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 					"aria-expanded": isOpen ? "true" : "false",
 					"aria-controls": panelId,
 					"aria-haspopup": "menu"
-				}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$10, {
+				}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$8, {
 					icon: "chevronDown",
 					size: "sm",
 					class: normalizeClass(["astryx-top-nav-menu__chevron", { "astryx-top-nav-menu__chevron--open": isOpen }])
@@ -385,9 +385,9 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 		const linkComponent = useLinkComponent();
 		const ctaHref = computed(() => {
 			if (!props.linkLabel) return void 0;
-			return props.linkHref || props.href;
+			return safeNavHref(props.linkHref || props.href);
 		});
-		const wholeHref = computed(() => ctaHref.value ? void 0 : props.href);
+		const wholeHref = computed(() => ctaHref.value ? void 0 : safeNavHref(props.href));
 		/** 自己的 `as` 优先，其次是 LinkProvider 给的默认链接组件。 */
 		const customLink = computed(() => props.as ?? linkComponent.value);
 		const root = computed(() => wholeHref.value ? resolveNavRoot(wholeHref.value, false, customLink.value) : "div");
@@ -467,16 +467,17 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		const linkComponent = useLinkComponent();
 		/** 自己的 `as` 优先，其次是 LinkProvider 给的默认链接组件。 */
 		const customLink = computed(() => props.as ?? linkComponent.value);
-		const root = computed(() => resolveNavRoot(props.href, false, customLink.value));
+		const navigableHref = computed(() => isNavigableHref(props.href) ? props.href : void 0);
+		const root = computed(() => resolveNavRoot(navigableHref.value, false, customLink.value));
 		function onClick() {
 			closeMenu?.();
 		}
 		return (_ctx, _cache) => {
 			return openBlock(), createBlock(resolveDynamicComponent(root.value), {
 				class: "astryx-top-nav-mega-item",
-				href: __props.href || void 0,
-				to: __props.href && customLink.value != null ? __props.href : void 0,
-				type: __props.href ? void 0 : "button",
+				href: navigableHref.value,
+				to: navigableHref.value && customLink.value != null ? navigableHref.value : void 0,
+				type: navigableHref.value ? void 0 : "button",
 				onClick
 			}, {
 				default: withCtx(() => [__props.iconClass || _ctx.$slots.icon ? (openBlock(), createElementBlock("span", _hoisted_1$1, [renderSlot(_ctx.$slots, "icon", {}, () => [__props.iconClass ? (openBlock(), createElementBlock("span", _hoisted_2$1, [createElementVNode("span", { class: normalizeClass(["astryx-top-nav-mega-item__glyph", __props.iconClass]) }, null, 2)])) : createCommentVNode("v-if", true)])])) : createCommentVNode("v-if", true), createElementVNode("span", _hoisted_3$1, [createElementVNode("span", _hoisted_4$1, toDisplayString(__props.title), 1), __props.description ? (openBlock(), createElementBlock("span", _hoisted_5, toDisplayString(__props.description), 1)) : createCommentVNode("v-if", true)])]),
@@ -522,7 +523,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				class: "astryx-top-nav-menu__drawer-trigger",
 				"aria-expanded": expanded.value ? "true" : "false",
 				onClick: _cache[0] || (_cache[0] = ($event) => expanded.value = !expanded.value)
-			}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$10, {
+			}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$8, {
 				icon: "chevronDown",
 				size: "sm",
 				class: normalizeClass({ "astryx-top-nav-menu__chevron--open": expanded.value })
@@ -557,7 +558,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 					"aria-expanded": isOpen ? "true" : "false",
 					"aria-controls": panelId,
 					"aria-haspopup": "menu"
-				}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$10, {
+				}, [createElementVNode("span", null, toDisplayString(__props.label), 1), createVNode(_sfc_main$8, {
 					icon: "chevronDown",
 					size: "sm",
 					class: normalizeClass(["astryx-top-nav-menu__chevron", { "astryx-top-nav-menu__chevron--open": isOpen }])

package/dist/TreeList/index.d.ts

@@ -1,2 +1,2 @@
-import { a as TreeListItemData, c as TreeListVariant, i as TreeListDensity, n as useTreeFocus, o as TreeListProps, r as _default, s as TreeListSlots, t as UseTreeFocusOptions } from "../index-DeQwYJbg.js";
+import { a as TreeListItemData, c as TreeListVariant, i as TreeListDensity, n as useTreeFocus, o as TreeListProps, r as _default, s as TreeListSlots, t as UseTreeFocusOptions } from "../index-BNaRK-s5.js";
 export { _default as TreeList, type TreeListDensity, type TreeListItemData, type TreeListProps, type TreeListSlots, type TreeListVariant, type UseTreeFocusOptions, useTreeFocus };

package/dist/TreeList/index.js

@@ -1,2 +1,2 @@
-import { n as useTreeFocus, t as _sfc_main } from "../TreeList-BUz-KZJd.js";
+import { n as useTreeFocus, t as _sfc_main } from "../TreeList-Bunn7u3T.js";
 export { _sfc_main as TreeList, useTreeFocus };

package/dist/{TreeList-BUz-KZJd.js → TreeList-Bunn7u3T.js}

@@ -1,8 +1,10 @@
+import { t as usePressFeedback } from "./usePressFeedback-BJCpjEpv.js";
+import { n as isSafeUrl } from "./safeUrl-CsvfcZ9m.js";
 import { n as useLinkComponent } from "./context-C_peZbXf.js";
-import { o as useAstryxMessages } from "./context-iABt_ueM.js";
-import { t as _sfc_main$2 } from "./Badge-CjDQPF5g.js";
-import { s as isIconGlyph, t as _sfc_main$3 } from "./Icon-bteSId7T.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, onMounted, openBlock, reactive, ref, renderList, renderSlot, resolveComponent, resolveDynamicComponent, toDisplayString, toRaw, unref, useId, vShow, withCtx, withDirectives } from "vue";
+import { s as isIconGlyph, t as _sfc_main$2 } from "./Icon-KDnUyY7f.js";
+import { s as useAstryxMessages } from "./context-CM-cjGg_.js";
+import { t as _sfc_main$3 } from "./Badge-CjDQPF5g.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, onMounted, openBlock, reactive, ref, renderList, renderSlot, resolveComponent, resolveDynamicComponent, toDisplayString, toRaw, unref, useAttrs, useId, useSlots, vShow, withCtx, withDirectives } from "vue";
 import "../styles/tree-list.css";
 //#region src/TreeList/TreeListItem.vue
 const _hoisted_1$1 = [
@@ -14,6 +16,8 @@ const _hoisted_1$1 = [
 	"aria-selected",
 	"aria-disabled",
 	"aria-expanded",
+	"aria-labelledby",
+	"aria-describedby",
 	"tabindex"
 ];
 const _hoisted_2$1 = ["data-span"];
@@ -39,26 +43,21 @@ const _hoisted_7 = {
 	key: 1,
 	class: "astryx-tree-list__icon"
 };
-const _hoisted_8 = { class: "astryx-tree-list__label" };
-const _hoisted_9 = {
-	key: 0,
-	class: "astryx-tree-list__description"
-};
-const _hoisted_10 = ["disabled"];
-const _hoisted_11 = { class: "astryx-tree-list__label" };
-const _hoisted_12 = {
-	key: 0,
-	class: "astryx-tree-list__description"
-};
+const _hoisted_8 = ["id"];
+const _hoisted_9 = ["id"];
+const _hoisted_10 = [
+	"disabled",
+	"aria-labelledby",
+	"aria-describedby"
+];
+const _hoisted_11 = ["id"];
+const _hoisted_12 = ["id"];
 const _hoisted_13 = {
 	key: 4,
 	class: "astryx-tree-list__main"
 };
-const _hoisted_14 = { class: "astryx-tree-list__label" };
-const _hoisted_15 = {
-	key: 0,
-	class: "astryx-tree-list__description"
-};
+const _hoisted_14 = ["id"];
+const _hoisted_15 = ["id"];
 const _hoisted_16 = {
 	key: 5,
 	class: "astryx-tree-list__end"
@@ -95,8 +94,16 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		const emit = __emit;
 		const messages = useAstryxMessages();
 		const linkComponent = useLinkComponent();
+		const labelId = useId();
+		const descriptionId = useId();
 		/** 有链接时用的根组件，没有 provider 时还是 `<a>`。 */
 		const linkRoot = computed(() => linkComponent.value == null ? "a" : toRaw(linkComponent.value));
+		const safeHref = computed(() => {
+			const href = props.item.href;
+			return href != null && href !== "" && isSafeUrl(href) ? href : void 0;
+		});
+		/** 新窗口打开时补上和列表行相同的关系标记。 */
+		const linkRel = computed(() => props.item.target === "_blank" ? "noopener noreferrer" : void 0);
 		const hasChildren = computed(() => (props.item.children?.length ?? 0) > 0);
 		const isExpanded = computed(() => hasChildren.value && props.expanded[props.item.id] === true);
 		const reservesChevron = computed(() => !hasChildren.value && props.hasExpandableItems);
@@ -116,19 +123,26 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 			event.stopPropagation();
 			emit("toggle", props.item.id);
 		}
+		const press = usePressFeedback();
+		const rowPress = computed(() => {
+			return (props.item.onClick != null || safeHref.value != null || hasChildren.value) && props.item.isDisabled !== true ? press.pressableProps : {};
+		});
 		return (_ctx, _cache) => {
 			const _component_TreeListItem = resolveComponent("TreeListItem", true);
 			return openBlock(), createElementBlock("li", {
-				class: "astryx-tree-list__item",
+				class: normalizeClass(["astryx-tree-list__item", __props.item.className]),
 				role: "treeitem",
 				"data-tree-id": __props.item.id,
 				"data-tree-disabled": __props.item.isDisabled ? "true" : void 0,
+				style: normalizeStyle(__props.item.style),
 				"aria-level": __props.nestedLevel + 1,
 				"aria-posinset": __props.posInSet,
 				"aria-setsize": __props.setSize,
 				"aria-selected": __props.item.isSelected || void 0,
 				"aria-disabled": __props.item.isDisabled || void 0,
 				"aria-expanded": hasChildren.value ? isExpanded.value : void 0,
+				"aria-labelledby": unref(labelId),
+				"aria-describedby": __props.item.description ? unref(descriptionId) : void 0,
 				tabindex: __props.item.id === __props.tabbableId ? 0 : -1
 			}, [
 				__props.variant === "lineGuides" ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.ancestorsIsLast, (ancestorIsLast, level) => {
@@ -148,16 +162,15 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 					class: "astryx-tree-list__guide-line",
 					"data-span": __props.isLast ? "last" : "full"
 				}, null, 8, _hoisted_2$1)], 4)) : createCommentVNode("v-if", true)], 64)) : createCommentVNode("v-if", true),
-				createElementVNode("div", _hoisted_3, [createCommentVNode(" eslint-disable-next-line vue-a11y/click-events-have-key-events, vue-a11y/no-static-element-interactions -- 键盘由外层 role=\"tree\" 处理，这一层只接指针点击。 "), createElementVNode("div", {
+				createElementVNode("div", _hoisted_3, [createCommentVNode(" eslint-disable-next-line vue-a11y/click-events-have-key-events, vue-a11y/no-static-element-interactions -- 键盘由外层 role=\"tree\" 处理，这一层只接指针点击。 "), createElementVNode("div", mergeProps({
 					class: "astryx-tree-list__content",
 					"data-density": __props.density,
 					"data-selected": __props.item.isSelected || void 0,
 					"data-disabled": __props.item.isDisabled || void 0,
-					"data-interactive": __props.item.onClick != null || __props.item.href != null || hasChildren.value || void 0,
+					"data-interactive": __props.item.onClick != null || safeHref.value != null || hasChildren.value || void 0,
 					"data-guide-inset": __props.variant === "lineGuides" && __props.nestedLevel > 0 && !reservesChevron.value || void 0,
-					style: normalizeStyle({ "--_tree-indent": indent.value }),
-					onClick: onRowClick
-				}, [
+					style: { "--_tree-indent": indent.value }
+				}, rowPress.value, { onClick: onRowClick }), [
 					hasChildren.value ? (openBlock(), createElementBlock("button", {
 						key: 0,
 						type: "button",
@@ -169,12 +182,12 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 						disabled: __props.item.isDisabled,
 						tabindex: "-1",
 						onClick: onToggle
-					}, [createVNode(_sfc_main$3, {
+					}, [createVNode(_sfc_main$2, {
 						icon: "chevronRight",
 						size: "sm",
 						color: "inherit"
 					})], 8, _hoisted_5)) : createCommentVNode("v-if", true),
-					__props.item.icon ? (openBlock(), createElementBlock("span", _hoisted_6, [unref(isIconGlyph)(__props.item.icon) ? (openBlock(), createBlock(_sfc_main$3, {
+					__props.item.icon ? (openBlock(), createElementBlock("span", _hoisted_6, [unref(isIconGlyph)(__props.item.icon) ? (openBlock(), createBlock(_sfc_main$2, {
 						key: 0,
 						icon: __props.item.icon,
 						size: "sm"
@@ -182,32 +195,61 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 						class: normalizeClass(__props.item.icon),
 						"aria-hidden": "true"
 					}, null, 2)]))])) : createCommentVNode("v-if", true),
-					__props.item.href ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
+					safeHref.value ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
 						key: 2,
 						class: "astryx-tree-list__action",
-						href: __props.item.href,
-						to: linkRoot.value === "a" ? void 0 : __props.item.href,
+						href: safeHref.value,
+						to: linkRoot.value === "a" ? void 0 : safeHref.value,
 						target: __props.item.target,
+						rel: linkRel.value,
+						"aria-labelledby": unref(labelId),
+						"aria-describedby": __props.item.description ? unref(descriptionId) : void 0,
 						tabindex: "-1"
 					}, {
-						default: withCtx(() => [createElementVNode("span", _hoisted_8, toDisplayString(__props.item.label), 1), __props.item.description ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(__props.item.description), 1)) : createCommentVNode("v-if", true)]),
+						default: withCtx(() => [createElementVNode("span", {
+							id: unref(labelId),
+							class: "astryx-tree-list__label"
+						}, toDisplayString(__props.item.label), 9, _hoisted_8), __props.item.description ? (openBlock(), createElementBlock("span", {
+							key: 0,
+							id: unref(descriptionId),
+							class: "astryx-tree-list__description"
+						}, toDisplayString(__props.item.description), 9, _hoisted_9)) : createCommentVNode("v-if", true)]),
 						_: 1
 					}, 8, [
 						"href",
 						"to",
-						"target"
+						"target",
+						"rel",
+						"aria-labelledby",
+						"aria-describedby"
 					])) : __props.item.onClick ? (openBlock(), createElementBlock("button", {
 						key: 3,
 						type: "button",
 						class: "astryx-tree-list__action",
 						disabled: __props.item.isDisabled,
+						"aria-labelledby": unref(labelId),
+						"aria-describedby": __props.item.description ? unref(descriptionId) : void 0,
 						tabindex: "-1",
 						onClick: _cache[0] || (_cache[0] = ($event) => __props.item.onClick($event))
-					}, [createElementVNode("span", _hoisted_11, toDisplayString(__props.item.label), 1), __props.item.description ? (openBlock(), createElementBlock("span", _hoisted_12, toDisplayString(__props.item.description), 1)) : createCommentVNode("v-if", true)], 8, _hoisted_10)) : (openBlock(), createElementBlock("span", _hoisted_13, [createElementVNode("span", _hoisted_14, toDisplayString(__props.item.label), 1), __props.item.description ? (openBlock(), createElementBlock("span", _hoisted_15, toDisplayString(__props.item.description), 1)) : createCommentVNode("v-if", true)])),
-					__props.item.badge || __props.item.endIcon ? (openBlock(), createElementBlock("span", _hoisted_16, [__props.item.badge ? (openBlock(), createBlock(_sfc_main$2, { key: 0 }, {
+					}, [createElementVNode("span", {
+						id: unref(labelId),
+						class: "astryx-tree-list__label"
+					}, toDisplayString(__props.item.label), 9, _hoisted_11), __props.item.description ? (openBlock(), createElementBlock("span", {
+						key: 0,
+						id: unref(descriptionId),
+						class: "astryx-tree-list__description"
+					}, toDisplayString(__props.item.description), 9, _hoisted_12)) : createCommentVNode("v-if", true)], 8, _hoisted_10)) : (openBlock(), createElementBlock("span", _hoisted_13, [createElementVNode("span", {
+						id: unref(labelId),
+						class: "astryx-tree-list__label"
+					}, toDisplayString(__props.item.label), 9, _hoisted_14), __props.item.description ? (openBlock(), createElementBlock("span", {
+						key: 0,
+						id: unref(descriptionId),
+						class: "astryx-tree-list__description"
+					}, toDisplayString(__props.item.description), 9, _hoisted_15)) : createCommentVNode("v-if", true)])),
+					__props.item.badge || __props.item.endIcon ? (openBlock(), createElementBlock("span", _hoisted_16, [__props.item.badge ? (openBlock(), createBlock(_sfc_main$3, { key: 0 }, {
 						default: withCtx(() => [createTextVNode(toDisplayString(__props.item.badge), 1)]),
 						_: 1
-					})) : __props.item.endIcon && unref(isIconGlyph)(__props.item.endIcon) ? (openBlock(), createBlock(_sfc_main$3, {
+					})) : __props.item.endIcon && unref(isIconGlyph)(__props.item.endIcon) ? (openBlock(), createBlock(_sfc_main$2, {
 						key: 1,
 						icon: __props.item.endIcon,
 						size: "sm"
@@ -215,7 +257,7 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 						class: normalizeClass(__props.item.endIcon),
 						"aria-hidden": "true"
 					}, null, 2)])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)
-				], 12, _hoisted_4)]),
+				], 16, _hoisted_4)]),
 				hasChildren.value && isExpanded.value ? (openBlock(), createElementBlock("ul", _hoisted_18, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.item.children, (child, index) => {
 					return openBlock(), createBlock(_component_TreeListItem, {
 						key: child.id,
@@ -245,7 +287,7 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 						"set-size"
 					]);
 				}), 128))])) : createCommentVNode("v-if", true)
-			], 8, _hoisted_1$1);
+			], 14, _hoisted_1$1);
 		};
 	}
 });
@@ -291,6 +333,17 @@ function useTreeFocus(options) {
 		if (options.getLevel != null) return options.getLevel(item);
 		return Number(item.getAttribute("aria-level") ?? "1");
 	}
+	/** typeahead 用的名字。指明时只读标签，否则用整行文字。 */
+	function matchText(item) {
+		if (options.matchLabelledBy === true) {
+			const ids = item.getAttribute("aria-labelledby")?.split(/\s+/).filter(Boolean) ?? [];
+			if (ids.length > 0) {
+				const doc = item.ownerDocument;
+				return ids.map((id) => doc.getElementById(id)?.textContent ?? "").join(" ").trim().toLowerCase();
+			}
+		}
+		return (item.textContent ?? "").trim().toLowerCase();
+	}
 	/** 树节点的 id：优先 `data-tree-id`，退回元素自己的 `id`。 */
 	function idOf(item) {
 		const id = item.dataset.treeId ?? item.id;
@@ -334,7 +387,7 @@ function useTreeFocus(options) {
 				typeahead.buffer = "";
 			}, TYPEAHEAD_RESET_MS);
 			const query = typeahead.buffer;
-			const match = [...list.slice(currentIndex + 1), ...list.slice(0, currentIndex + 1)].find((item) => !disabled(item) && (item.textContent ?? "").trim().toLowerCase().startsWith(query));
+			const match = [...list.slice(currentIndex + 1), ...list.slice(0, currentIndex + 1)].find((item) => !disabled(item) && matchText(item).startsWith(query));
 			if (match != null) {
 				event.preventDefault();
 				focusItem(match);
@@ -440,7 +493,30 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 	},
 	setup(__props) {
 		const props = __props;
+		const attrs = useAttrs();
+		const slots = useSlots();
 		const headerId = `astryx-tree-list-${useId()}`;
+		const hasHeader = computed(() => props.header != null || slots.header != null);
+		const rootAttrs = computed(() => {
+			const rest = {};
+			for (const [key, value] of Object.entries(attrs)) {
+				if (key === "class" || key === "style" || key === "onKeydown" || key === "onKeyDown") continue;
+				if (key === "aria-label" || key === "aria-labelledby") continue;
+				rest[key] = value;
+			}
+			return rest;
+		});
+		const treeLabel = computed(() => {
+			if (hasHeader.value) return void 0;
+			const fromAttr = attrs["aria-label"];
+			if (typeof fromAttr === "string") return fromAttr;
+			return props.label;
+		});
+		const treeLabelledBy = computed(() => {
+			if (hasHeader.value) return headerId;
+			const fromAttr = attrs["aria-labelledby"];
+			return typeof fromAttr === "string" ? fromAttr : void 0;
+		});
 		const expanded = reactive({});
 		function walk(items, visit) {
 			for (const item of items) {
@@ -490,6 +566,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 		const tabbableId = computed(() => initialTabbable(props.items));
 		const { treeRef, handleKeyDown, handleFocus } = useTreeFocus({
 			hasRovingTabIndex: true,
+			matchLabelledBy: true,
 			onToggleExpand: toggle,
 			onActivate: (current) => {
 				const candidates = current.querySelectorAll("a[href], button:not([data-tree-toggle])");
@@ -500,17 +577,23 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				return false;
 			}
 		});
+		function callKeydown(listener, event) {
+			if (typeof listener === "function") listener(event);
+			else if (Array.isArray(listener)) listener.forEach((entry) => callKeydown(entry, event));
+		}
 		function onKeyDown(event) {
+			callKeydown(attrs.onKeydown ?? attrs.onKeyDown, event);
+			if (event.defaultPrevented) return;
 			if (treeRef.value != null && event.target instanceof Node && treeRef.value.contains(event.target)) handleKeyDown(event);
 		}
 		return (_ctx, _cache) => {
-			return openBlock(), createElementBlock(Fragment, null, [createCommentVNode(" eslint-disable-next-line vue-a11y/no-static-element-interactions -- 方向键从内部 role=\"tree\" 冒泡上来，这一层只负责转发给树的键盘逻辑。 "), createElementVNode("div", {
-				class: normalizeClass(["astryx-tree-list", _ctx.$attrs.class]),
-				style: normalizeStyle(_ctx.$attrs.style),
+			return openBlock(), createElementBlock(Fragment, null, [createCommentVNode(" eslint-disable-next-line vue-a11y/no-static-element-interactions -- 方向键从内部 role=\"tree\" 冒泡上来，这一层只负责转发给树的键盘逻辑。 "), createElementVNode("div", mergeProps(rootAttrs.value, {
+				class: ["astryx-tree-list", unref(attrs).class],
+				style: unref(attrs).style,
 				"data-density": __props.density,
 				"data-variant": __props.variant,
 				onKeydown: onKeyDown
-			}, [__props.header || _ctx.$slots.header ? (openBlock(), createElementBlock("div", {
+			}), [hasHeader.value ? (openBlock(), createElementBlock("div", {
 				key: 0,
 				id: headerId,
 				class: "astryx-tree-list__header"
@@ -519,8 +602,8 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 				ref: treeRef,
 				class: "astryx-tree-list__list",
 				role: "tree",
-				"aria-label": __props.header || _ctx.$slots.header ? void 0 : __props.label,
-				"aria-labelledby": __props.header || _ctx.$slots.header ? headerId : void 0,
+				"aria-label": treeLabel.value,
+				"aria-labelledby": treeLabelledBy.value,
 				onFocus: _cache[0] || (_cache[0] = (...args) => unref(handleFocus) && unref(handleFocus)(...args))
 			}, [(openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item, index) => {
 				return openBlock(), createBlock(_sfc_main$1, {
@@ -548,7 +631,7 @@ const _sfc_main = /*@__PURE__*/ defineComponent({
 					"pos-in-set",
 					"set-size"
 				]);
-			}), 128))], 40, _hoisted_2)], 46, _hoisted_1)], 2112);
+			}), 128))], 40, _hoisted_2)], 16, _hoisted_1)], 2112);
 		};
 	}
 });

package/dist/Typeahead/index.d.ts

@@ -1,2 +1,2 @@
-import { a as TypeaheadEmits, c as TypeaheadSize, i as BaseTypeaheadProps, l as TypeaheadSlots, n as _default$1, o as TypeaheadItemProps, r as _default, s as TypeaheadProps, t as _default$2, u as TypeaheadStatus } from "../index-Bu8NA2SD.js";
+import { a as TypeaheadEmits, c as TypeaheadSize, i as BaseTypeaheadProps, l as TypeaheadSlots, n as _default$1, o as TypeaheadItemProps, r as _default, s as TypeaheadProps, t as _default$2, u as TypeaheadStatus } from "../index-BaxM-pFP.js";
 export { _default as BaseTypeahead, type BaseTypeaheadProps, _default$1 as Typeahead, type TypeaheadEmits, _default$2 as TypeaheadItem, type TypeaheadItemProps, type TypeaheadProps, type TypeaheadSize, type TypeaheadSlots, type TypeaheadStatus };

package/dist/Typeahead/index.js

@@ -1,3 +1,3 @@
-import { n as _sfc_main$2 } from "../TypeaheadMenu-DBW6rHeO.js";
-import { n as _sfc_main, t as _sfc_main$1 } from "../Typeahead-JP9RT87x.js";
+import { n as _sfc_main$2 } from "../TypeaheadMenu-BY5__sPC.js";
+import { n as _sfc_main, t as _sfc_main$1 } from "../Typeahead-DRyf2HEh.js";
 export { _sfc_main as BaseTypeahead, _sfc_main$1 as Typeahead, _sfc_main$2 as TypeaheadItem };