@astryx-vue/core 0.1.0 → 0.1.3

package/dist/LayoutPanel-C34uOq3e.js

@@ -0,0 +1,358 @@
+import { a as supportsInternalContentWidth, i as spacingVariable, t as formatSize } from "./size-xcIqExkS.js";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, inject, mergeProps, normalizeStyle, openBlock, provide, renderSlot, unref, useAttrs, useSlots, useTemplateRef, withCtx } from "vue";
+import "../styles/layout.css";
+//#region src/Layout/context.ts
+const layoutSlotsKey = Symbol("astryx-layout-slots");
+const layoutAreaKey = Symbol("astryx-layout-area");
+const layoutDividerKey = Symbol("astryx-layout-dividers");
+const emptySlots = computed(() => ({
+	hasHeader: false,
+	hasFooter: false,
+	hasStart: false,
+	hasEnd: false
+}));
+function useLayoutSlots() {
+	return inject(layoutSlotsKey, emptySlots);
+}
+function useLayoutArea() {
+	return inject(layoutAreaKey, computed(() => null));
+}
+function useLayoutDividers() {
+	return inject(layoutDividerKey, computed(() => void 0));
+}
+//#endregion
+//#region src/Layout/LayoutRegion.vue
+const _sfc_main$4 = /*@__PURE__*/ defineComponent({
+	__name: "LayoutRegion",
+	props: { area: {} },
+	setup(__props) {
+		const props = __props;
+		provide(layoutAreaKey, computed(() => props.area));
+		return (_ctx, _cache) => {
+			return renderSlot(_ctx.$slots, "default");
+		};
+	}
+});
+//#endregion
+//#region src/Layout/Layout.vue
+const _hoisted_1$3 = ["data-height"];
+const _hoisted_2$1 = [
+	"data-full-bleed",
+	"data-panels",
+	"data-width-mode"
+];
+const _hoisted_3 = { class: "astryx-layout__middle" };
+const _hoisted_4 = { class: "astryx-layout__content-slot" };
+const _sfc_main$3 = /*@__PURE__*/ defineComponent({
+	name: "AstryxLayout",
+	inheritAttrs: false,
+	__name: "Layout",
+	props: {
+		contentWidth: {},
+		height: { default: "fill" },
+		padding: {},
+		defaultHasDividers: { type: Boolean }
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const attrs = useAttrs();
+		const slots = useSlots();
+		const root = useTemplateRef("root");
+		const parentDividers = useLayoutDividers();
+		__expose({ element: root });
+		const slotsState = computed(() => ({
+			hasHeader: slots.header != null,
+			hasFooter: slots.footer != null,
+			hasStart: slots.start != null,
+			hasEnd: slots.end != null
+		}));
+		provide(layoutSlotsKey, slotsState);
+		provide(layoutDividerKey, computed(() => props.defaultHasDividers ?? parentDividers.value));
+		const panelCount = computed(() => {
+			if (slotsState.value.hasStart && slotsState.value.hasEnd) return "both";
+			if (slotsState.value.hasStart) return "start";
+			if (slotsState.value.hasEnd) return "end";
+			return "none";
+		});
+		const widthMode = computed(() => {
+			if (props.contentWidth == null) return void 0;
+			return supportsInternalContentWidth(props.contentWidth) && panelCount.value !== "both" ? "internal" : "constrained";
+		});
+		const forwardedAttrs = computed(() => Object.fromEntries(Object.entries(attrs).filter(([key]) => key !== "class" && key !== "style")));
+		const rootClass = computed(() => ["astryx-layout", attrs.class]);
+		const rootStyle = computed(() => attrs.style);
+		const innerStyle = computed(() => {
+			const width = formatSize(props.contentWidth);
+			const style = {};
+			if (props.padding != null) {
+				const step = spacingVariable(props.padding);
+				if (step != null) {
+					style["--layout-padding-own-outer-x"] = step;
+					style["--layout-padding-own-outer-y"] = step;
+				}
+			}
+			if (width != null) {
+				style["--layout-content-width"] = width;
+				if (supportsInternalContentWidth(props.contentWidth)) style["--layout-alignment-width"] = width;
+			}
+			return style;
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				ref_key: "root",
+				ref: root
+			}, forwardedAttrs.value, {
+				class: rootClass.value,
+				"data-height": __props.height,
+				style: rootStyle.value
+			}), [createElementVNode("div", {
+				class: "astryx-layout__inner",
+				"data-full-bleed": __props.padding === 0 || void 0,
+				"data-panels": panelCount.value,
+				"data-width-mode": widthMode.value,
+				style: normalizeStyle(innerStyle.value)
+			}, [
+				unref(slots).header ? (openBlock(), createBlock(_sfc_main$4, {
+					key: 0,
+					area: "header"
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "header")]),
+					_: 3
+				})) : createCommentVNode("v-if", true),
+				createElementVNode("div", _hoisted_3, [
+					unref(slots).start ? (openBlock(), createBlock(_sfc_main$4, {
+						key: 0,
+						area: "start"
+					}, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "start")]),
+						_: 3
+					})) : createCommentVNode("v-if", true),
+					createElementVNode("div", _hoisted_4, [createVNode(_sfc_main$4, { area: "content" }, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "default")]),
+						_: 3
+					})]),
+					unref(slots).end ? (openBlock(), createBlock(_sfc_main$4, {
+						key: 1,
+						area: "end"
+					}, {
+						default: withCtx(() => [renderSlot(_ctx.$slots, "end")]),
+						_: 3
+					})) : createCommentVNode("v-if", true)
+				]),
+				unref(slots).footer ? (openBlock(), createBlock(_sfc_main$4, {
+					key: 1,
+					area: "footer"
+				}, {
+					default: withCtx(() => [renderSlot(_ctx.$slots, "footer")]),
+					_: 3
+				})) : createCommentVNode("v-if", true)
+			], 12, _hoisted_2$1)], 16, _hoisted_1$3);
+		};
+	}
+});
+//#endregion
+//#region src/Layout/regionPadding.ts
+function regionPaddingStyle(prefix, padding, paddingBlockEnd) {
+	if (padding == null && paddingBlockEnd == null) return {};
+	const style = {};
+	const set = (edge, step) => {
+		const value = spacingVariable(step);
+		if (value != null) style[`${prefix}-${edge}`] = value;
+	};
+	if (padding != null) {
+		set("inline", padding);
+		set("inline-start", padding);
+		set("inline-end", padding);
+		set("block-start", padding);
+		set("block-end", padding);
+	}
+	set("block-end", paddingBlockEnd);
+	return style;
+}
+//#endregion
+//#region src/Layout/LayoutContent.vue
+const _hoisted_1$2 = [
+	"role",
+	"aria-label",
+	"data-panels",
+	"data-edge-start",
+	"data-edge-end",
+	"data-edge-header",
+	"data-edge-footer",
+	"data-scrollable",
+	"data-explicit-padding",
+	"data-bleed"
+];
+const _sfc_main$2 = /*@__PURE__*/ defineComponent({
+	name: "AstryxLayoutContent",
+	inheritAttrs: false,
+	__name: "LayoutContent",
+	props: {
+		padding: {},
+		isScrollable: {
+			type: Boolean,
+			default: true
+		},
+		label: {},
+		role: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const attrs = useAttrs();
+		const root = useTemplateRef("root");
+		const slots = useLayoutSlots();
+		__expose({ element: root });
+		const panels = computed(() => {
+			if (slots.value.hasStart && slots.value.hasEnd) return "both";
+			if (slots.value.hasStart) return "start";
+			if (slots.value.hasEnd) return "end";
+			return "none";
+		});
+		const forwardedAttrs = computed(() => Object.fromEntries(Object.entries(attrs).filter(([key]) => key !== "class" && key !== "style")));
+		const rootClass = computed(() => ["astryx-layout-content", attrs.class]);
+		const rootStyle = computed(() => [regionPaddingStyle("--_layout-content", props.padding), attrs.style]);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				ref_key: "root",
+				ref: root
+			}, forwardedAttrs.value, {
+				class: rootClass.value,
+				style: rootStyle.value,
+				role: __props.role,
+				"aria-label": __props.label,
+				"data-panels": panels.value,
+				"data-edge-start": !unref(slots).hasStart || void 0,
+				"data-edge-end": !unref(slots).hasEnd || void 0,
+				"data-edge-header": !unref(slots).hasHeader || void 0,
+				"data-edge-footer": !unref(slots).hasFooter || void 0,
+				"data-scrollable": __props.isScrollable || void 0,
+				"data-explicit-padding": __props.padding != null || void 0,
+				"data-bleed": __props.padding === 0 || void 0
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1$2);
+		};
+	}
+});
+//#endregion
+//#region src/Layout/LayoutHeader.vue
+const _hoisted_1$1 = [
+	"role",
+	"aria-label",
+	"data-divider"
+];
+const _hoisted_2 = ["data-bleed"];
+const _sfc_main$1 = /*@__PURE__*/ defineComponent({
+	name: "AstryxLayoutHeader",
+	inheritAttrs: false,
+	__name: "LayoutHeader",
+	props: {
+		hasDivider: {
+			type: Boolean,
+			default: void 0
+		},
+		height: {},
+		padding: {},
+		paddingBlockEnd: {},
+		label: {},
+		role: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const attrs = useAttrs();
+		const root = useTemplateRef("root");
+		const dividers = useLayoutDividers();
+		__expose({ element: root });
+		const hasDivider = computed(() => props.hasDivider ?? dividers.value ?? false);
+		const forwardedAttrs = computed(() => Object.fromEntries(Object.entries(attrs).filter(([key]) => key !== "class" && key !== "style")));
+		const rootClass = computed(() => ["astryx-layout-header", attrs.class]);
+		const rootStyle = computed(() => [{ height: formatSize(props.height) }, attrs.style]);
+		const innerStyle = computed(() => regionPaddingStyle("--_layout-header", props.padding, props.paddingBlockEnd));
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				ref_key: "root",
+				ref: root
+			}, forwardedAttrs.value, {
+				class: rootClass.value,
+				style: rootStyle.value,
+				role: __props.role,
+				"aria-label": __props.label,
+				"data-divider": hasDivider.value || void 0
+			}), [createElementVNode("div", {
+				class: "astryx-layout-header__inner",
+				"data-bleed": __props.padding === 0 || void 0,
+				style: normalizeStyle(innerStyle.value)
+			}, [renderSlot(_ctx.$slots, "default")], 12, _hoisted_2)], 16, _hoisted_1$1);
+		};
+	}
+});
+//#endregion
+//#region src/Layout/LayoutPanel.vue
+const _hoisted_1 = [
+	"role",
+	"aria-label",
+	"data-area",
+	"data-divider",
+	"data-collapse",
+	"data-edge-header",
+	"data-edge-footer",
+	"data-scrollable",
+	"data-explicit-padding",
+	"data-bleed"
+];
+const _sfc_main = /*@__PURE__*/ defineComponent({
+	name: "AstryxLayoutPanel",
+	inheritAttrs: false,
+	__name: "LayoutPanel",
+	props: {
+		hasDivider: {
+			type: Boolean,
+			default: false
+		},
+		padding: {},
+		isScrollable: {
+			type: Boolean,
+			default: true
+		},
+		label: {},
+		role: {},
+		width: {},
+		resizable: {}
+	},
+	setup(__props, { expose: __expose }) {
+		const props = __props;
+		const attrs = useAttrs();
+		const root = useTemplateRef("root");
+		const area = useLayoutArea();
+		const slots = useLayoutSlots();
+		__expose({ element: root });
+		const width = computed(() => formatSize(props.resizable ? props.resizable._size : props.width));
+		const collapse = computed(() => !props.hasDivider && props.padding == null);
+		const forwardedAttrs = computed(() => Object.fromEntries(Object.entries(attrs).filter(([key]) => key !== "class" && key !== "style")));
+		const rootClass = computed(() => ["astryx-layout-panel", attrs.class]);
+		const rootStyle = computed(() => [
+			{ width: width.value },
+			regionPaddingStyle("--_layout-panel", props.padding),
+			attrs.style
+		]);
+		return (_ctx, _cache) => {
+			return openBlock(), createElementBlock("div", mergeProps({
+				ref_key: "root",
+				ref: root
+			}, forwardedAttrs.value, {
+				class: rootClass.value,
+				style: rootStyle.value,
+				role: __props.role,
+				"aria-label": __props.label,
+				"data-area": unref(area),
+				"data-divider": __props.hasDivider || void 0,
+				"data-collapse": collapse.value || void 0,
+				"data-edge-header": !unref(slots).hasHeader || void 0,
+				"data-edge-footer": !unref(slots).hasFooter || void 0,
+				"data-scrollable": __props.isScrollable || void 0,
+				"data-explicit-padding": __props.padding != null || void 0,
+				"data-bleed": __props.padding === 0 || void 0
+			}), [renderSlot(_ctx.$slots, "default")], 16, _hoisted_1);
+		};
+	}
+});
+//#endregion
+export { _sfc_main$3 as a, regionPaddingStyle as i, _sfc_main$1 as n, useLayoutDividers as o, _sfc_main$2 as r, _sfc_main as t };

package/dist/List/index.d.ts

@@ -1,3 +1,3 @@
 import { a as ItemLayout, c as ItemTarget, d as ListEdgeCompensation, f as ListItemProps, g as ListSlots, h as ListProps, i as ItemLabel, l as ItemText, m as ListMarkerStyle, n as ItemDensity, o as ItemProps, p as ListItemSlots, r as ItemElement, s as ItemSlots, t as ItemAlign, u as ListDensity } from "../types-CAZY4Xua.js";
-import { a as useListContext, i as useItemDescriptionId, n as _default$1, r as _default, t as _default$2 } from "../index-JeZ0YTyd.js";
+import { a as useListContext, i as useItemDescriptionId, n as _default$1, r as _default, t as _default$2 } from "../index-D-ZuubCK.js";
 export { _default as Item, type ItemAlign, type ItemDensity, type ItemElement, type ItemLabel, type ItemLayout, type ItemProps, type ItemSlots, type ItemTarget, type ItemText, _default$1 as List, type ListDensity, type ListEdgeCompensation, _default$2 as ListItem, type ListItemProps, type ListItemSlots, type ListMarkerStyle, type ListProps, type ListSlots, useItemDescriptionId, useListContext };

package/dist/Markdown/index.d.ts

@@ -1,2 +1,2 @@
-import { _ as MarkdownSlots, a as MarkdownAlign, c as MarkdownDensity, d as MarkdownHeadingProps, f as MarkdownImageProps, g as MarkdownProps, h as MarkdownListProps, i as _default, l as MarkdownDisplay, m as MarkdownLinkProps, n as uniqueSlug, o as MarkdownCodeProps, p as MarkdownInlineCodeProps, r as parseMarkdown, s as MarkdownComponents, t as slugify, u as MarkdownHeadingLevel } from "../index-DjOdQv5B.js";
+import { _ as MarkdownSlots, a as MarkdownAlign, c as MarkdownDensity, d as MarkdownHeadingProps, f as MarkdownImageProps, g as MarkdownProps, h as MarkdownListProps, i as _default, l as MarkdownDisplay, m as MarkdownLinkProps, n as uniqueSlug, o as MarkdownCodeProps, p as MarkdownInlineCodeProps, r as parseMarkdown, s as MarkdownComponents, t as slugify, u as MarkdownHeadingLevel } from "../index-DfgHJE7H.js";
 export { _default as Markdown, type MarkdownAlign, type MarkdownCodeProps, type MarkdownComponents, type MarkdownDensity, type MarkdownDisplay, type MarkdownHeadingLevel, type MarkdownHeadingProps, type MarkdownImageProps, type MarkdownInlineCodeProps, type MarkdownLinkProps, type MarkdownListProps, type MarkdownProps, type MarkdownSlots, parseMarkdown, slugify, uniqueSlug };

package/dist/Markdown/index.js

@@ -1,2 +1,2 @@
-import { i as parseMarkdown, n as slugify, r as uniqueSlug, t as _sfc_main } from "../Markdown-DyKIwAL_.js";
+import { i as parseMarkdown, n as slugify, r as uniqueSlug, t as _sfc_main } from "../Markdown-CwtLr3f_.js";
 export { _sfc_main as Markdown, parseMarkdown, slugify, uniqueSlug };

package/dist/{Markdown-DyKIwAL_.js → Markdown-CwtLr3f_.js}

@@ -1,9 +1,9 @@
 import { t as _sfc_main$1 } from "./VisuallyHidden-C7NN3VEP.js";
 import { t as _sfc_main$2 } from "./Heading-Dugosn6j.js";
+import { a as useAstryxMessages } from "./context-D6ECRdc5.js";
 import { t as _sfc_main$3 } from "./Blockquote-DFqBv_oJ.js";
-import { a as useAstryxMessages } from "./locale-56lkR7OK.js";
 import { t as _sfc_main$4 } from "./CheckboxIndicator-DdJmksHt.js";
-import { c as _sfc_main$5, t as _sfc_main$6 } from "./CodeBlock-CK-NWM_1.js";
+import { c as _sfc_main$5, t as _sfc_main$6 } from "./CodeBlock-BQdooQy2.js";
 import { t as _sfc_main$7 } from "./Link-CprjOuTI.js";
 import { Fragment, computed, defineComponent, h, ref } from "vue";
 import { fromMarkdown } from "mdast-util-from-markdown";

package/dist/MetadataList/index.d.ts

@@ -0,0 +1,2 @@
+import { a as MetadataListItemSlots, c as MetadataListOrientation, i as MetadataListItemProps, l as MetadataListProps, n as _default, o as MetadataListLabelConfig, r as MetadataListColumns, s as MetadataListLabelPosition, t as _default$1, u as MetadataListSlots } from "../index-utZGF4GR.js";
+export { _default as MetadataList, type MetadataListColumns, _default$1 as MetadataListItem, type MetadataListItemProps, type MetadataListItemSlots, type MetadataListLabelConfig, type MetadataListLabelPosition, type MetadataListOrientation, type MetadataListProps, type MetadataListSlots };

package/dist/MetadataList/index.js

@@ -0,0 +1,2 @@
+import { n as _sfc_main, t as _sfc_main$1 } from "../MetadataList-DlXQTLog.js";
+export { _sfc_main as MetadataList, _sfc_main$1 as MetadataListItem };

package/dist/MetadataList-DlXQTLog.js

@@ -0,0 +1,124 @@
+import { a as useAstryxMessages } from "./context-D6ECRdc5.js";
+import { Comment, Fragment, computed, defineComponent, h, inject, provide, ref, useId, useSlots } from "vue";
+import "../styles/metadata-list.css";
+//#region src/MetadataList/context.ts
+const metadataListKey = Symbol("astryx-metadata-list");
+function useMetadataListContext() {
+	return inject(metadataListKey, null);
+}
+//#endregion
+//#region src/MetadataList/MetadataList.vue
+function itemNodes(nodes) {
+	const result = [];
+	for (const node of nodes) {
+		if (node.type === Comment) continue;
+		if (node.type === Fragment && Array.isArray(node.children)) result.push(...itemNodes(node.children));
+		else result.push(node);
+	}
+	return result;
+}
+const _sfc_main$1 = defineComponent({
+	name: "AstryxMetadataList",
+	inheritAttrs: false,
+	props: {
+		columns: {
+			type: [String, Number],
+			default: "single"
+		},
+		label: {
+			type: Object,
+			default: void 0
+		},
+		maxNumOfItems: {
+			type: Number,
+			default: void 0
+		},
+		orientation: {
+			type: String,
+			default: "vertical"
+		},
+		title: {
+			type: String,
+			default: void 0
+		}
+	},
+	setup(props, { slots, attrs }) {
+		const messages = useAstryxMessages();
+		const expanded = ref(false);
+		const contentId = `astryx-metadata-list-${useId()}`;
+		const isMultiColumn = computed(() => props.columns === "multi" || typeof props.columns === "number" && props.columns > 1);
+		const labelPosition = computed(() => {
+			if (props.orientation === "horizontal") return "top";
+			return props.label?.position ?? (isMultiColumn.value ? "top" : "start");
+		});
+		provide(metadataListKey, {
+			get labelPosition() {
+				return labelPosition.value;
+			},
+			get orientation() {
+				return props.orientation ?? "vertical";
+			}
+		});
+		return () => {
+			const orientation = props.orientation ?? "vertical";
+			const stacked = labelPosition.value === "top";
+			const horizontal = orientation === "horizontal";
+			const layout = horizontal ? "horizontal" : stacked ? props.columns === "single" || props.columns === 1 ? "stacked-single" : "stacked-multi" : props.columns === "single" || props.columns === 1 ? "single" : "multi";
+			let gridTemplateColumns;
+			if (!horizontal && typeof props.columns === "number" && props.columns > 1) gridTemplateColumns = stacked ? `repeat(${props.columns}, 1fr)` : `repeat(${props.columns}, auto minmax(0, 1fr))`;
+			else if (!horizontal && !stacked && props.label?.width != null) gridTemplateColumns = `${typeof props.label.width === "number" ? `${props.label.width}px` : props.label.width} minmax(0, 1fr)`;
+			const nodes = itemNodes(slots.default?.() ?? []);
+			const limit = horizontal ? void 0 : props.maxNumOfItems;
+			const visible = limit != null && nodes.length > limit && !expanded.value ? nodes.slice(0, limit) : nodes;
+			const title = slots.title || props.title ? h("div", { class: "astryx-metadata-list__title" }, slots.title ? slots.title() : props.title) : null;
+			const list = h("dl", {
+				"id": contentId,
+				"class": "astryx-metadata-list__dl",
+				"data-layout": layout,
+				"style": gridTemplateColumns ? { gridTemplateColumns } : void 0
+			}, visible);
+			const toggle = limit != null && nodes.length > limit ? h("button", {
+				"type": "button",
+				"class": "astryx-metadata-list__toggle",
+				"aria-controls": contentId,
+				"aria-expanded": expanded.value ? "true" : "false",
+				"onClick": () => {
+					expanded.value = !expanded.value;
+				}
+			}, expanded.value ? messages.value.metadataList.showLess : messages.value.metadataList.showMore) : null;
+			return h("div", {
+				...attrs,
+				"class": ["astryx-metadata-list", attrs.class],
+				"data-columns": String(props.columns),
+				"data-orientation": orientation
+			}, [
+				title,
+				list,
+				toggle
+			]);
+		};
+	}
+});
+//#endregion
+//#region src/MetadataList/MetadataListItem.vue
+const _sfc_main = defineComponent({
+	name: "AstryxMetadataListItem",
+	props: { label: {
+		type: String,
+		required: true
+	} },
+	setup(props) {
+		const context = useMetadataListContext();
+		const slots = useSlots();
+		const stacked = computed(() => {
+			return (context?.labelPosition ?? "start") === "top" || context?.orientation === "horizontal";
+		});
+		return () => {
+			const icon = slots.icon ? h("span", { class: "astryx-metadata-list__icon" }, slots.icon()) : null;
+			if (stacked.value) return h("div", { class: "astryx-metadata-list__item" }, [h("dt", { class: "astryx-metadata-list__item-label" }, [icon, props.label]), h("dd", { class: "astryx-metadata-list__item-value" }, slots.default?.())]);
+			return [h("dt", { class: "astryx-metadata-list__label" }, [icon, props.label]), h("dd", { class: "astryx-metadata-list__value" }, slots.default?.())];
+		};
+	}
+});
+//#endregion
+export { _sfc_main$1 as n, _sfc_main as t };

package/dist/MobileNav/index.d.ts

@@ -1,2 +1,2 @@
-import { a as MobileNavSide, c as MobileNavToggleProps, i as MobileNavProps, l as mobileNavKey, n as _default, o as MobileNavSlots, r as MobileNavEmits, s as MobileNavToggleEmits, t as _default$1 } from "../index-Dbmgcm8a.js";
+import { a as MobileNavSide, c as MobileNavToggleProps, i as MobileNavProps, l as mobileNavKey, n as _default, o as MobileNavSlots, r as MobileNavEmits, s as MobileNavToggleEmits, t as _default$1 } from "../index-BeR-1LgF.js";
 export { _default as MobileNav, type MobileNavEmits, type MobileNavProps, type MobileNavSide, type MobileNavSlots, _default$1 as MobileNavToggle, type MobileNavToggleEmits, type MobileNavToggleProps, mobileNavKey };

package/dist/MobileNav/index.js

@@ -1,2 +1,2 @@
-import { n as _sfc_main, r as mobileNavKey, t as _sfc_main$1 } from "../MobileNavToggle-BK2iRJF-.js";
+import { n as _sfc_main, r as mobileNavKey, t as _sfc_main$1 } from "../MobileNavToggle-CgQamG6E.js";
 export { _sfc_main as MobileNav, _sfc_main$1 as MobileNavToggle, mobileNavKey };

package/dist/{MobileNavToggle-BK2iRJF-.js → MobileNavToggle-CgQamG6E.js}

@@ -1,5 +1,5 @@
 import { n as useFocusTrap, t as useRestoreFocus } from "./useRestoreFocus-BvMdXVX9.js";
-import { a as useAstryxMessages } from "./locale-56lkR7OK.js";
+import { a as useAstryxMessages } from "./context-D6ECRdc5.js";
 import { Fragment, computed, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, defineComponent, mergeModels, nextTick, normalizeClass, normalizeStyle, onMounted, openBlock, provide, ref, renderSlot, toDisplayString, unref, useId, useModel, watch } from "vue";
 import "../styles/mobile-nav.css";
 //#region src/MobileNav/context.ts
@@ -7,10 +7,15 @@ import "../styles/mobile-nav.css";
 const mobileNavKey = Symbol("astryx-mobile-nav");
 //#endregion
 //#region src/MobileNav/MobileNav.vue
-const _hoisted_1$1 = ["aria-labelledby", "aria-label"];
+const _hoisted_1$1 = [
+	"id",
+	"aria-labelledby",
+	"aria-label"
+];
 const _hoisted_2 = { class: "astryx-mobile-nav__drawer" };
-const _hoisted_3 = ["aria-label"];
-const _hoisted_4 = { class: "astryx-mobile-nav__body" };
+const _hoisted_3 = ["id"];
+const _hoisted_4 = ["aria-label"];
+const _hoisted_5 = { class: "astryx-mobile-nav__body" };
 const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 	name: "AstryxMobileNav",
 	__name: "MobileNav",
@@ -18,7 +23,8 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		header: {},
 		width: { default: 320 },
 		side: { default: "auto" },
-		label: {}
+		label: {},
+		id: {}
 	}, {
 		"isOpen": {
 			type: Boolean,
@@ -34,8 +40,9 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		const isOpen = useModel(__props, "isOpen");
 		const dialogRef = ref(null);
 		const resolvedSide = ref(props.side === "end" ? "end" : "start");
-		const dialogId = `astryx-mobile-nav-${useId()}`;
-		const labelId = `${dialogId}-label`;
+		const generatedId = `astryx-mobile-nav-${useId()}`;
+		const dialogId = computed(() => props.id || generatedId);
+		const labelId = computed(() => `${dialogId.value}-label`);
 		let previousOverflow = "";
 		const accessibleName = computed(() => props.label || props.header || messages.value.nav.mobileNav);
 		const trapEnabled = computed(() => isOpen.value);
@@ -101,21 +108,21 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock(Fragment, null, [createCommentVNode(" eslint-disable-next-line vue-a11y/click-events-have-key-events, vue-a11y/no-static-element-interactions -- 点在 dialog 自身上等于点遮罩；键盘用户走原生 cancel。 "), createElementVNode("dialog", {
-				id: dialogId,
+				id: dialogId.value,
 				ref_key: "dialogRef",
 				ref: dialogRef,
 				class: normalizeClass(["astryx-mobile-nav", sideIsStart.value ? "astryx-mobile-nav--start" : "astryx-mobile-nav--end"]),
 				style: normalizeStyle({ "--astryx-mobile-nav-width": `${__props.width}px` }),
 				"aria-modal": "true",
-				"aria-labelledby": _ctx.$slots.header || __props.header ? labelId : void 0,
+				"aria-labelledby": _ctx.$slots.header || __props.header ? labelId.value : void 0,
 				"aria-label": _ctx.$slots.header || __props.header ? void 0 : accessibleName.value,
 				onCancel,
 				onClick: onDialogClick
 			}, [createElementVNode("div", _hoisted_2, [createElementVNode("div", { class: normalizeClass(["astryx-mobile-nav__header", { "astryx-mobile-nav__header--end": !_ctx.$slots.header && !__props.header }]) }, [_ctx.$slots.header || __props.header ? (openBlock(), createElementBlock("div", {
 				key: 0,
-				id: labelId,
+				id: labelId.value,
 				class: "astryx-mobile-nav__title"
-			}, [renderSlot(_ctx.$slots, "header", {}, () => [createTextVNode(toDisplayString(__props.header), 1)])])) : createCommentVNode("v-if", true), createElementVNode("button", {
+			}, [renderSlot(_ctx.$slots, "header", {}, () => [createTextVNode(toDisplayString(__props.header), 1)])], 8, _hoisted_3)) : createCommentVNode("v-if", true), createElementVNode("button", {
 				type: "button",
 				class: "astryx-mobile-nav__close",
 				"aria-label": unref(messages).nav.close,
@@ -123,7 +130,7 @@ const _sfc_main$1 = /*@__PURE__*/ defineComponent({
 			}, [..._cache[1] || (_cache[1] = [createElementVNode("span", {
 				class: "astryx-mobile-nav__close-glyph",
 				"aria-hidden": "true"
-			}, null, -1)])], 8, _hoisted_3)], 2), createElementVNode("div", _hoisted_4, [renderSlot(_ctx.$slots, "default")])])], 46, _hoisted_1$1)], 2112);
+			}, null, -1)])], 8, _hoisted_4)], 2), createElementVNode("div", _hoisted_5, [renderSlot(_ctx.$slots, "default")])])], 46, _hoisted_1$1)], 2112);
 		};
 	}
 });

package/dist/MoreMenu/index.d.ts

@@ -1,2 +1,2 @@
-import { an as MoreMenuItem, cn as MoreMenuPresentation, dn as MoreMenuSection, en as _default, fn as MoreMenuSlots, in as MoreMenuInitialFocus, ln as MoreMenuProps, nn as MoreMenuEmits, on as MoreMenuItemVariant, rn as MoreMenuIcon, sn as MoreMenuOption, tn as MoreMenuDivider, un as MoreMenuResolvedPresentation } from "../index-CaHXYQ_E.js";
+import { An as MoreMenuIcon, Dn as _default, Fn as MoreMenuPresentation, In as MoreMenuProps, Ln as MoreMenuResolvedPresentation, Mn as MoreMenuItem, Nn as MoreMenuItemVariant, On as MoreMenuDivider, Pn as MoreMenuOption, Rn as MoreMenuSection, jn as MoreMenuInitialFocus, kn as MoreMenuEmits, zn as MoreMenuSlots } from "../index-Df2YvC8o.js";
 export { _default as MoreMenu, type MoreMenuDivider, type MoreMenuEmits, type MoreMenuIcon, type MoreMenuInitialFocus, type MoreMenuItem, type MoreMenuItemVariant, type MoreMenuOption, type MoreMenuPresentation, type MoreMenuProps, type MoreMenuResolvedPresentation, type MoreMenuSection, type MoreMenuSlots };

package/dist/MoreMenu/index.js

@@ -1,2 +1,2 @@
-import { t as _sfc_main } from "../MoreMenu-BjUsVWWk.js";
+import { t as _sfc_main } from "../MoreMenu-BXL6Dqsu.js";
 export { _sfc_main as MoreMenu };

package/dist/{MoreMenu-BjUsVWWk.js → MoreMenu-BXL6Dqsu.js}

@@ -2,10 +2,10 @@ import { n as getFocusables, t as focusElement } from "./focus-CpficIgf.js";
 import { n as useOverflow } from "./useOverflow-VrwF5oek.js";
 import { t as _sfc_main$5 } from "./Heading-Dugosn6j.js";
 import { t as _sfc_main$6 } from "./IconButton-BNQuz9W_.js";
-import { t as _sfc_main$7 } from "./Icon-B6qNgBP9.js";
+import { t as _sfc_main$7 } from "./Icon-5MdZQ18k.js";
 import { t as _sfc_main$8 } from "./Divider-BtwnL18I.js";
-import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
 import { n as _sfc_main$10, t as _sfc_main$9 } from "./ListItem-pGxvn6QJ.js";
+import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
 import { Fragment, Teleport, Transition, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, inject, mergeModels, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, openBlock, provide, ref, renderList, renderSlot, resolveComponent, resolveDynamicComponent, shallowRef, toDisplayString, unref, useId, useModel, useTemplateRef, watch, withCtx } from "vue";
 import "../styles/more-menu.css";
 //#region src/MoreMenu/context.ts

package/dist/MultiSelector/index.d.ts

@@ -1,2 +1,2 @@
-import { a as MultiSelectorDivider, c as MultiSelectorOptionData, d as MultiSelectorSection, f as MultiSelectorSize, g as MultiSelectorVariant, h as MultiSelectorTriggerDisplay, i as MultiSelectorCheckboxPosition, l as MultiSelectorPresentation, m as MultiSelectorStatus, n as flattenOptions, o as MultiSelectorEmits, p as MultiSelectorSlots, r as _default, s as MultiSelectorOption, t as SELECT_ALL_VALUE, u as MultiSelectorProps } from "../index-C8NW9xre.js";
+import { a as MultiSelectorDivider, c as MultiSelectorOptionData, d as MultiSelectorSection, f as MultiSelectorSize, g as MultiSelectorVariant, h as MultiSelectorTriggerDisplay, i as MultiSelectorCheckboxPosition, l as MultiSelectorPresentation, m as MultiSelectorStatus, n as flattenOptions, o as MultiSelectorEmits, p as MultiSelectorSlots, r as _default, s as MultiSelectorOption, t as SELECT_ALL_VALUE, u as MultiSelectorProps } from "../index-DGNqi2za.js";
 export { _default as MultiSelector, type MultiSelectorCheckboxPosition, type MultiSelectorDivider, type MultiSelectorEmits, type MultiSelectorOption, type MultiSelectorOptionData, type MultiSelectorPresentation, type MultiSelectorProps, type MultiSelectorSection, type MultiSelectorSize, type MultiSelectorSlots, type MultiSelectorStatus, type MultiSelectorTriggerDisplay, type MultiSelectorVariant, SELECT_ALL_VALUE, flattenOptions };

package/dist/MultiSelector/index.js

@@ -1,2 +1,2 @@
-import { n as SELECT_ALL_VALUE, r as flattenOptions, t as _sfc_main } from "../MultiSelector-CKTbTj1A.js";
+import { n as SELECT_ALL_VALUE, r as flattenOptions, t as _sfc_main } from "../MultiSelector-DT8ZccMI.js";
 export { _sfc_main as MultiSelector, SELECT_ALL_VALUE, flattenOptions };