@astryx-vue/core 0.2.3 → 0.2.4

package/dist/{Selector-BpPnuWH3.js → Selector-5N-hq2nF.js}

@@ -2,15 +2,15 @@ import { t as useAnnounce } from "./announce-Cnio10Wk.js";
 import { t as useCombobox } from "./useCombobox-CTo5C-gc.js";
 import { t as useDismiss } from "./useDismiss-Cj8x_51F.js";
 import { t as useFieldControlState } from "./useFieldControlState-voICDrys.js";
-import { a as useAstryxMessages } from "./context-DmOLCubj.js";
+import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
 import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
-import { t as _sfc_main$1 } from "./BottomSheet-Dg95HB1s.js";
+import { t as _sfc_main$1 } from "./BottomSheet-BV6vfgGu.js";
 import { t as _sfc_main$2 } from "./Icon-bteSId7T.js";
 import { t as _sfc_main$3 } from "./Spinner-9cYUCnDy.js";
 import { t as useIndicator } from "./useIndicator-i1NORM7W.js";
 import { t as _sfc_main$4 } from "./Field-8zRxzDHE.js";
 import { t as INPUT_GROUP_KEY } from "./context-D5-MwxnN.js";
-import { n as fieldStatusPlacement, r as _sfc_main$5, t as searchResultMessage } from "./searchResultMessage-DN0HeRRB.js";
+import { n as fieldStatusPlacement, r as _sfc_main$5, t as searchResultMessage } from "./searchResultMessage-CCnq-_ce.js";
 import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, normalizeStyle, onMounted, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useSlots, useTemplateRef, vShow, watch, withCtx, withDirectives, withKeys, withModifiers } from "vue";
 import "../styles/visually-hidden-utility.css";
 import "../styles/selector.css";

package/dist/SideNav/index.d.ts

@@ -1,2 +1,2 @@
-import { Bt as _default$1, Gt as SideNavHeadingProps, Ht as SideNavCollapseButtonProps, Jt as SideNavProps, Kt as SideNavItemEmits, Lt as _default$4, Rt as _default$3, Ut as SideNavCollapsible, Vt as _default, Wt as SideNavEmits, Xt as SideNavCollapseContext, Yt as SideNavSectionProps, Zt as useSideNavCollapse, qt as SideNavItemProps, zt as _default$2 } from "../index-BTAgQRP0.js";
-export { _default as SideNav, _default$1 as SideNavCollapseButton, type SideNavCollapseButtonProps, type SideNavCollapseContext, type SideNavCollapsible, type SideNavEmits, _default$2 as SideNavHeading, type SideNavHeadingProps, _default$3 as SideNavItem, type SideNavItemEmits, type SideNavItemProps, type SideNavProps, _default$4 as SideNavSection, type SideNavSectionProps, useSideNavCollapse };
+import { $t as useSideNavCollapse, Bt as _default$1, Gt as SideNavHandle, Ht as SideNavCollapseButtonProps, Jt as SideNavItemProps, Kt as SideNavHeadingProps, Lt as _default$4, Qt as SideNavCollapseContext, Rt as _default$3, Ut as SideNavCollapsible, Vt as _default, Wt as SideNavEmits, Xt as SideNavResizable, Yt as SideNavProps, Zt as SideNavSectionProps, qt as SideNavItemEmits, zt as _default$2 } from "../index-EtZgovdH.js";
+export { _default as SideNav, _default$1 as SideNavCollapseButton, type SideNavCollapseButtonProps, type SideNavCollapseContext, type SideNavCollapsible, type SideNavEmits, type SideNavHandle, _default$2 as SideNavHeading, type SideNavHeadingProps, _default$3 as SideNavItem, type SideNavItemEmits, type SideNavItemProps, type SideNavProps, type SideNavResizable, _default$4 as SideNavSection, type SideNavSectionProps, useSideNavCollapse };

package/dist/SideNav/index.js

@@ -1,3 +1,3 @@
 import { r as useSideNavCollapse } from "../context-BjNya0v8.js";
-import { a as _sfc_main$1, i as _sfc_main, n as _sfc_main$3, r as _sfc_main$2, t as _sfc_main$4 } from "../SideNav-D4TupqgE.js";
+import { a as _sfc_main$1, i as _sfc_main, n as _sfc_main$3, r as _sfc_main$2, t as _sfc_main$4 } from "../SideNav-CT9lfspi.js";
 export { _sfc_main as SideNav, _sfc_main$1 as SideNavCollapseButton, _sfc_main$2 as SideNavHeading, _sfc_main$3 as SideNavItem, _sfc_main$4 as SideNavSection, useSideNavCollapse };

package/dist/{SideNav-D4TupqgE.js → SideNav-CT9lfspi.js}

@@ -1,12 +1,15 @@
-import { t as useHotkeys } from "./useHotkeys-dABSK1o9.js";
-import { a as useAstryxMessages } from "./context-DmOLCubj.js";
+import { t as useHandleRef } from "./useHandleRef-6cdKugm8.js";
+import { n as useResizable, r as useHotkeys } from "./useResizable-B3ahKLoZ.js";
+import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
+import { t as _sfc_main$5 } from "./Tooltip-C2fh9anJ.js";
 import { i as useSideNavRenderMode, r as useSideNavCollapse, t as sideNavCollapseKey } from "./context-BjNya0v8.js";
-import { t as _sfc_main$5 } from "./Tooltip-mp0NMh_Y.js";
 import { t as _sfc_main$6 } from "./Icon-bteSId7T.js";
 import { n as resolveNavRoot } from "./link-CdcUSxAj.js";
 import { t as _sfc_main$7 } from "./NavItem-FFOisITc.js";
-import { t as _sfc_main$8 } from "./NavDisclosure-DbYLDXK0.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, getCurrentInstance, normalizeClass, openBlock, provide, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useSlots, watch, withCtx, withModifiers } from "vue";
+import { t as _sfc_main$8 } from "./NavDisclosure-C6sPZ89n.js";
+import { t as _sfc_main$9 } from "./ResizeHandle-DYy0e3v9.js";
+import { t as _sfc_main$10 } from "./NavHeadingSurface-Cb3x9iDx.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createVNode, defineComponent, getCurrentInstance, guardReactiveProps, normalizeClass, normalizeProps, normalizeStyle, openBlock, provide, reactive, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useId, useSlots, watch, watchEffect, withCtx, withModifiers } from "vue";
 import "../styles/visually-hidden.css";
 import "../styles/side-nav.css";
 //#region src/SideNav/SideNavCollapseButton.vue
@@ -64,6 +67,102 @@ const _sfc_main$4 = /*@__PURE__*/ defineComponent({
 	}
 });
 //#endregion
+//#region src/SideNav/useSideNavResize.ts
+/** 拖到这条宽度以下就收起。收起后的视觉宽度仍由图标栏样式决定。 */
+const COLLAPSE_THRESHOLD = 160;
+function resizeConfig(value) {
+	return typeof value === "object" && value != null ? value : {};
+}
+function collapseConfig(value) {
+	return typeof value === "object" && value != null ? value : {};
+}
+function ownsCollapseState(config) {
+	return config.defaultIsCollapsed !== void 0 || config.isCollapsed !== void 0 || config.onCollapseChange !== void 0;
+}
+function describeCollapseConflict(collapsible, resizable) {
+	const fromCollapsible = [collapsible.defaultIsCollapsed !== void 0 && "defaultIsCollapsed", collapsible.isCollapsed !== void 0 && "isCollapsed"].filter((key) => key !== false);
+	const fromResizable = [
+		resizable.defaultIsCollapsed !== void 0 && "defaultIsCollapsed",
+		resizable.isCollapsed !== void 0 && "isCollapsed",
+		resizable.onCollapseChange !== void 0 && "onCollapseChange"
+	].filter((key) => key !== false);
+	if (fromCollapsible.length === 0 || fromResizable.length === 0) return null;
+	return `collapsible 和 resizable 都写了收起状态（${fromResizable.join("、")}）。拖拽这边生效。`;
+}
+function useSideNavResize(source) {
+	const initialResize = resizeConfig(source.resizable());
+	const initialCollapse = collapseConfig(source.collapsible());
+	const initialOwns = ownsCollapseState(initialResize);
+	const controlled = source.isCollapsed();
+	const input = reactive({
+		defaultSize: initialResize.defaultWidth ?? 260,
+		minSize: initialResize.minWidth ?? 180,
+		maxSize: initialResize.maxWidth ?? 480,
+		collapsible: Boolean(source.collapsible()) || initialOwns,
+		collapsedSize: COLLAPSE_THRESHOLD,
+		autoSaveId: initialResize.autoSaveId,
+		defaultIsCollapsed: (initialOwns ? initialResize.defaultIsCollapsed : initialCollapse.defaultIsCollapsed) ?? false,
+		isCollapsed: controlled,
+		onSizeChange(width) {
+			resizeConfig(source.resizable()).onWidthChange?.(width);
+			source.onWidthChange(width);
+		},
+		onCollapseChange(next) {
+			resizeConfig(source.resizable()).onCollapseChange?.(next);
+			source.onCollapseChange(next);
+		}
+	});
+	const region = useResizable(input);
+	const resizing = ref(false);
+	const enabled = computed(() => Boolean(source.resizable()));
+	const ownsCollapse = computed(() => ownsCollapseState(resizeConfig(source.resizable())));
+	watch(() => source.isCollapsed(), (value) => {
+		input.isCollapsed = value;
+	});
+	let warnedConflict = false;
+	watchEffect(() => {
+		if (warnedConflict) return;
+		const message = describeCollapseConflict(collapseConfig(source.collapsible()), resizeConfig(source.resizable()));
+		if (!message) return;
+		warnedConflict = true;
+		console.warn(`[SideNav] ${message}`);
+	});
+	const handleProps = computed(() => {
+		const current = region.props;
+		return {
+			...current,
+			_onResizeStart() {
+				resizing.value = true;
+				current._onResizeStart();
+			},
+			_onResizeEnd() {
+				resizing.value = false;
+				current._onResizeEnd();
+			},
+			_onResizeCancel() {
+				resizing.value = false;
+				current._onResizeCancel?.();
+			}
+		};
+	});
+	const widthStyle = computed(() => {
+		if (!enabled.value || region.isCollapsed) return void 0;
+		return { width: `${region.size}px` };
+	});
+	return {
+		enabled,
+		ownsCollapse,
+		isCollapsed: computed(() => region.isCollapsed),
+		widthStyle,
+		resizing,
+		handleProps,
+		setCollapsed(next) {
+			if (next) region.collapse();
+			else region.expand();
+		}
+	};
+}
+//#endregion
 //#region src/SideNav/SideNav.vue
 const _hoisted_1$3 = {
 	key: 0,
@@ -88,29 +187,29 @@ const _hoisted_6$2 = {
 	key: 1,
 	class: "astryx-side-nav__bottom"
 };
-const _hoisted_7$2 = {
+const _hoisted_7$1 = {
 	key: 0,
 	class: "astryx-side-nav__footer-icons"
 };
-const _hoisted_8$2 = ["aria-label", "data-collapsed"];
-const _hoisted_9$1 = {
+const _hoisted_8$1 = ["aria-label", "data-collapsed"];
+const _hoisted_9 = {
 	key: 0,
 	class: "astryx-side-nav__top"
 };
-const _hoisted_10$1 = {
+const _hoisted_10 = {
 	key: 0,
 	class: "astryx-side-nav__heading-row"
 };
-const _hoisted_11$1 = {
+const _hoisted_11 = {
 	key: 1,
 	class: "astryx-side-nav__top-content"
 };
-const _hoisted_12$1 = { class: "astryx-side-nav__body" };
-const _hoisted_13$1 = {
+const _hoisted_12 = { class: "astryx-side-nav__body" };
+const _hoisted_13 = {
 	key: 1,
 	class: "astryx-side-nav__bottom"
 };
-const _hoisted_14$1 = {
+const _hoisted_14 = {
 	key: 0,
 	class: "astryx-side-nav__footer-icons"
 };
@@ -126,9 +225,18 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		isCollapsed: {
 			type: Boolean,
 			default: void 0
-		}
+		},
+		resizable: {
+			type: [Boolean, Object],
+			default: false
+		},
+		handleRef: {}
 	},
-	emits: ["update:isCollapsed", "collapsedChange"],
+	emits: [
+		"update:isCollapsed",
+		"collapsedChange",
+		"widthChange"
+	],
 	setup(__props, { emit: __emit }) {
 		const props = __props;
 		const emit = __emit;
@@ -137,13 +245,35 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		const navId = `astryx-side-nav-${useId()}`;
 		const localCollapsed = ref(false);
 		const config = computed(() => typeof props.collapsible === "object" ? props.collapsible : {});
-		const isCollapsible = computed(() => Boolean(props.collapsible));
+		function controlledCollapsed() {
+			if (props.isCollapsed !== void 0) return props.isCollapsed;
+			if (typeof props.resizable === "object") {
+				const resizable = props.resizable;
+				if (resizable.defaultIsCollapsed !== void 0 || resizable.isCollapsed !== void 0 || resizable.onCollapseChange !== void 0) return resizable.isCollapsed;
+			}
+			return config.value.isCollapsed;
+		}
+		const resize = useSideNavResize({
+			collapsible: () => props.collapsible,
+			isCollapsed: controlledCollapsed,
+			onCollapseChange(next) {
+				emit("update:isCollapsed", next);
+				emit("collapsedChange", next);
+			},
+			onWidthChange(width) {
+				emit("widthChange", width);
+			},
+			resizable: () => props.resizable
+		});
+		const isCollapsible = computed(() => Boolean(props.collapsible) || resize.ownsCollapse.value);
 		const isCollapsed = computed(() => {
 			if (!isCollapsible.value) return false;
-			if (props.isCollapsed !== void 0) return props.isCollapsed;
-			if (config.value.isCollapsed !== void 0) return config.value.isCollapsed;
+			const controlled = controlledCollapsed();
+			if (controlled !== void 0) return controlled;
+			if (resize.enabled.value) return resize.isCollapsed.value;
 			return localCollapsed.value;
 		});
+		const showResizeHandle = computed(() => resize.enabled.value && !isCollapsed.value);
 		const showButton = computed(() => isCollapsible.value && (config.value.hasButton ?? true));
 		const hasTop = computed(() => slots.header != null || slots.top != null || showButton.value);
 		const hasBottom = computed(() => slots.footer != null || slots.footerIcons != null);
@@ -154,6 +284,10 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		}, { immediate: true });
 		function setCollapsed(next) {
 			if (!isCollapsible.value || next === isCollapsed.value) return;
+			if (resize.enabled.value) {
+				resize.setCollapsed(next);
+				return;
+			}
 			if (props.isCollapsed === void 0 && config.value.isCollapsed === void 0) localCollapsed.value = next;
 			emit("update:isCollapsed", next);
 			emit("collapsedChange", next);
@@ -161,6 +295,14 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 		function toggle() {
 			setCollapsed(!isCollapsed.value);
 		}
+		useHandleRef(() => props.handleRef, {
+			collapse: () => setCollapsed(true),
+			expand: () => setCollapsed(false),
+			get isCollapsed() {
+				return isCollapsed.value;
+			},
+			toggle
+		});
 		useHotkeys(computed(() => {
 			const keys = config.value.hotkey;
 			if (!isCollapsible.value || keys == null || keys === "") return [];
@@ -179,21 +321,37 @@ const _sfc_main$3 = /*@__PURE__*/ defineComponent({
 			return unref(renderMode) === "topbar" ? (openBlock(), createElementBlock("div", _hoisted_1$3, [renderSlot(_ctx.$slots, "header"), slots.footerIcons ? (openBlock(), createElementBlock("div", _hoisted_2$3, [renderSlot(_ctx.$slots, "footerIcons")])) : createCommentVNode("v-if", true)])) : unref(renderMode) === "drawer" || unref(renderMode) === "drawer-content" ? (openBlock(), createElementBlock("div", _hoisted_3$3, [
 				slots.top ? (openBlock(), createElementBlock("div", _hoisted_4$3, [renderSlot(_ctx.$slots, "top")])) : createCommentVNode("v-if", true),
 				createElementVNode("div", _hoisted_5$2, [renderSlot(_ctx.$slots, "default")]),
-				hasBottom.value ? (openBlock(), createElementBlock("div", _hoisted_6$2, [renderSlot(_ctx.$slots, "footer"), slots.footerIcons ? (openBlock(), createElementBlock("div", _hoisted_7$2, [renderSlot(_ctx.$slots, "footerIcons")])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)
-			])) : (openBlock(), createElementBlock("nav", {
+				hasBottom.value ? (openBlock(), createElementBlock("div", _hoisted_6$2, [renderSlot(_ctx.$slots, "footer"), slots.footerIcons ? (openBlock(), createElementBlock("div", _hoisted_7$1, [renderSlot(_ctx.$slots, "footerIcons")])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)
+			])) : (openBlock(), createElementBlock("div", {
 				key: 2,
+				class: normalizeClass(["astryx-side-nav-frame", { "astryx-side-nav-frame--resizable": showResizeHandle.value }])
+			}, [createElementVNode("nav", {
 				id: navId,
-				class: normalizeClass(["astryx-side-nav", { "astryx-side-nav--collapsed": isCollapsed.value }]),
+				class: normalizeClass(["astryx-side-nav", {
+					"astryx-side-nav--collapsed": isCollapsed.value,
+					"astryx-side-nav--resizing": unref(resize).resizing.value
+				}]),
+				style: normalizeStyle(unref(resize).widthStyle.value),
 				"aria-label": label.value,
 				"data-collapsed": isCollapsed.value || void 0
 			}, [
-				hasTop.value ? (openBlock(), createElementBlock("div", _hoisted_9$1, [slots.header || showButton.value ? (openBlock(), createElementBlock("div", _hoisted_10$1, [renderSlot(_ctx.$slots, "header"), showButton.value ? (openBlock(), createBlock(_sfc_main$4, {
+				hasTop.value ? (openBlock(), createElementBlock("div", _hoisted_9, [slots.header || showButton.value ? (openBlock(), createElementBlock("div", _hoisted_10, [renderSlot(_ctx.$slots, "header"), showButton.value ? (openBlock(), createBlock(_sfc_main$4, {
 					key: 0,
 					label: config.value.buttonLabel
-				}, null, 8, ["label"])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true), slots.top ? (openBlock(), createElementBlock("div", _hoisted_11$1, [renderSlot(_ctx.$slots, "top")])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true),
-				createElementVNode("div", _hoisted_12$1, [renderSlot(_ctx.$slots, "default")]),
-				hasBottom.value ? (openBlock(), createElementBlock("div", _hoisted_13$1, [renderSlot(_ctx.$slots, "footer"), slots.footerIcons ? (openBlock(), createElementBlock("div", _hoisted_14$1, [renderSlot(_ctx.$slots, "footerIcons")])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)
-			], 10, _hoisted_8$2));
+				}, null, 8, ["label"])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true), slots.top ? (openBlock(), createElementBlock("div", _hoisted_11, [renderSlot(_ctx.$slots, "top")])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true),
+				createElementVNode("div", _hoisted_12, [renderSlot(_ctx.$slots, "default")]),
+				hasBottom.value ? (openBlock(), createElementBlock("div", _hoisted_13, [renderSlot(_ctx.$slots, "footer"), slots.footerIcons ? (openBlock(), createElementBlock("div", _hoisted_14, [renderSlot(_ctx.$slots, "footerIcons")])) : createCommentVNode("v-if", true)])) : createCommentVNode("v-if", true)
+			], 14, _hoisted_8$1), showResizeHandle.value ? (openBlock(), createBlock(_sfc_main$9, {
+				key: 0,
+				"data-testid": "astryx-sidenav-resize-handle",
+				direction: "horizontal",
+				position: "overlay",
+				"pill-placement": "end",
+				"is-always-visible": false,
+				resizable: unref(resize).handleProps.value,
+				label: unref(messages).nav.resizeSidebar,
+				"aria-controls": navId
+			}, null, 8, ["resizable", "label"])) : createCommentVNode("v-if", true)], 2));
 		};
 	}
 });
@@ -212,78 +370,6 @@ const _hoisted_5$1 = {
 	class: "astryx-side-nav-heading astryx-side-nav-heading--collapsed"
 };
 const _hoisted_6$1 = { class: "astryx-side-nav-heading__icon" };
-const _hoisted_7$1 = {
-	key: 0,
-	class: "astryx-side-nav-heading__icon"
-};
-const _hoisted_8$1 = { class: "astryx-side-nav-heading__text" };
-const _hoisted_9 = {
-	key: 0,
-	class: "astryx-side-nav-heading__super"
-};
-const _hoisted_10 = { class: "astryx-side-nav-heading__title" };
-const _hoisted_11 = {
-	key: 1,
-	class: "astryx-side-nav-heading__sub"
-};
-const _hoisted_12 = {
-	key: 1,
-	class: "astryx-side-nav-heading__end"
-};
-const _hoisted_13 = ["data-open"];
-const _hoisted_14 = {
-	key: 1,
-	class: "astryx-side-nav-heading__icon"
-};
-const _hoisted_15 = { class: "astryx-side-nav-heading__text" };
-const _hoisted_16 = {
-	key: 1,
-	class: "astryx-side-nav-heading__super"
-};
-const _hoisted_17 = { class: "astryx-side-nav-heading__row" };
-const _hoisted_18 = {
-	key: 1,
-	class: "astryx-side-nav-heading__title"
-};
-const _hoisted_19 = [
-	"aria-label",
-	"aria-expanded",
-	"aria-controls"
-];
-const _hoisted_20 = {
-	key: 3,
-	class: "astryx-side-nav-heading__sub"
-};
-const _hoisted_21 = {
-	key: 2,
-	class: "astryx-side-nav-heading__end"
-};
-const _hoisted_22 = { class: "astryx-side-nav-heading__menu" };
-const _hoisted_23 = {
-	key: 3,
-	class: "astryx-side-nav-heading"
-};
-const _hoisted_24 = {
-	key: 1,
-	class: "astryx-side-nav-heading__icon"
-};
-const _hoisted_25 = { class: "astryx-side-nav-heading__text" };
-const _hoisted_26 = {
-	key: 1,
-	class: "astryx-side-nav-heading__super"
-};
-const _hoisted_27 = {
-	key: 3,
-	class: "astryx-side-nav-heading__title"
-};
-const _hoisted_28 = {
-	key: 5,
-	class: "astryx-side-nav-heading__sub"
-};
-const _hoisted_29 = {
-	key: 2,
-	class: "astryx-side-nav-heading__end"
-};
 const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 	name: "AstryxSideNavHeading",
 	__name: "SideNavHeading",
@@ -294,17 +380,16 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 		superheadingHref: {},
 		subheading: {},
 		subheadingHref: {},
+		logoLabel: {},
 		as: {}
 	},
 	setup(__props) {
 		const props = __props;
 		const slots = useSlots();
 		const collapse = useSideNavCollapse();
-		const messages = useAstryxMessages();
 		const collapsed = computed(() => collapse.isCollapsed.value);
 		const hasIcon = computed(() => slots.icon != null);
 		const hasMenu = computed(() => slots.menu != null);
-		const wholeLink = computed(() => Boolean(props.headingHref) && !hasMenu.value && !props.superheadingHref && !props.subheadingHref);
 		const linkRoot = computed(() => resolveNavRoot(props.headingHref, false, props.as));
 		return (_ctx, _cache) => {
 			return collapsed.value && hasIcon.value ? (openBlock(), createBlock(_sfc_main$5, {
@@ -326,7 +411,10 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 						"aria-controls": panelId,
 						"aria-haspopup": "menu"
 					}, [createElementVNode("span", _hoisted_2$2, [renderSlot(_ctx.$slots, "icon")])], 8, _hoisted_1$2)]),
-					default: withCtx(({ close }) => [createElementVNode("div", _hoisted_3$2, [renderSlot(_ctx.$slots, "menu", { close })])]),
+					default: withCtx(({ close, focusRequest }) => [createElementVNode("div", _hoisted_3$2, [renderSlot(_ctx.$slots, "menu", {
+						close,
+						focusRequest
+					})])]),
 					_: 3
 				}, 8, ["label"])) : __props.headingHref ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
 					key: 1,
@@ -343,135 +431,43 @@ const _sfc_main$2 = /*@__PURE__*/ defineComponent({
 					"aria-label"
 				])) : (openBlock(), createElementBlock("div", _hoisted_5$1, [createElementVNode("span", _hoisted_6$1, [renderSlot(_ctx.$slots, "icon")])]))]),
 				_: 3
-			}, 8, ["content"])) : !collapsed.value && wholeLink.value ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
+			}, 8, ["content"])) : (openBlock(), createBlock(_sfc_main$10, {
 				key: 1,
-				class: "astryx-side-nav-heading astryx-side-nav-heading--link",
-				href: __props.headingHref,
-				to: __props.as != null ? __props.headingHref : void 0
-			}, {
-				default: withCtx(() => [
-					hasIcon.value ? (openBlock(), createElementBlock("span", _hoisted_7$1, [renderSlot(_ctx.$slots, "icon")])) : createCommentVNode("v-if", true),
-					createElementVNode("span", _hoisted_8$1, [
-						__props.superheading ? (openBlock(), createElementBlock("span", _hoisted_9, toDisplayString(__props.superheading), 1)) : createCommentVNode("v-if", true),
-						createElementVNode("span", _hoisted_10, toDisplayString(__props.heading), 1),
-						__props.subheading ? (openBlock(), createElementBlock("span", _hoisted_11, toDisplayString(__props.subheading), 1)) : createCommentVNode("v-if", true)
-					]),
-					_ctx.$slots.end ? (openBlock(), createElementBlock("span", _hoisted_12, [renderSlot(_ctx.$slots, "end")])) : createCommentVNode("v-if", true)
-				]),
-				_: 3
-			}, 8, ["href", "to"])) : !collapsed.value && hasMenu.value ? (openBlock(), createBlock(_sfc_main$8, {
-				key: 2,
-				hover: "",
-				label: __props.heading
-			}, {
-				trigger: withCtx(({ isOpen, panelId }) => [createElementVNode("div", {
-					class: "astryx-side-nav-heading",
-					"data-open": isOpen || void 0
-				}, [
-					__props.headingHref ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
-						key: 0,
-						class: "astryx-side-nav-heading__icon",
-						href: __props.headingHref,
-						to: __props.as != null ? __props.headingHref : void 0,
-						"aria-label": __props.heading
-					}, {
-						default: withCtx(() => [renderSlot(_ctx.$slots, "icon")]),
-						_: 3
-					}, 8, [
-						"href",
-						"to",
-						"aria-label"
-					])) : hasIcon.value ? (openBlock(), createElementBlock("span", _hoisted_14, [renderSlot(_ctx.$slots, "icon")])) : createCommentVNode("v-if", true),
-					createElementVNode("span", _hoisted_15, [
-						__props.superheading && __props.superheadingHref ? (openBlock(), createBlock(resolveDynamicComponent(unref(resolveNavRoot)(__props.superheadingHref, false, __props.as)), {
-							key: 0,
-							class: "astryx-side-nav-heading__super astryx-side-nav-heading__link",
-							href: __props.superheadingHref,
-							to: __props.as != null ? __props.superheadingHref : void 0
-						}, {
-							default: withCtx(() => [createTextVNode(toDisplayString(__props.superheading), 1)]),
-							_: 1
-						}, 8, ["href", "to"])) : __props.superheading ? (openBlock(), createElementBlock("span", _hoisted_16, toDisplayString(__props.superheading), 1)) : createCommentVNode("v-if", true),
-						createElementVNode("span", _hoisted_17, [__props.headingHref ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
-							key: 0,
-							class: "astryx-side-nav-heading__title astryx-side-nav-heading__link",
-							href: __props.headingHref,
-							to: __props.as != null ? __props.headingHref : void 0
-						}, {
-							default: withCtx(() => [createTextVNode(toDisplayString(__props.heading), 1)]),
-							_: 1
-						}, 8, ["href", "to"])) : (openBlock(), createElementBlock("span", _hoisted_18, toDisplayString(__props.heading), 1)), createElementVNode("button", {
-							type: "button",
-							class: "astryx-side-nav-heading__chevron",
-							"aria-label": unref(messages).nav.openMenu,
-							"aria-expanded": isOpen ? "true" : "false",
-							"aria-controls": panelId,
-							"aria-haspopup": "menu"
-						}, [createVNode(_sfc_main$6, {
-							icon: "chevronDown",
-							size: "sm",
-							class: normalizeClass({ "astryx-side-nav-heading__chevron-icon--open": isOpen })
-						}, null, 8, ["class"])], 8, _hoisted_19)]),
-						__props.subheading && __props.subheadingHref ? (openBlock(), createBlock(resolveDynamicComponent(unref(resolveNavRoot)(__props.subheadingHref, false, __props.as)), {
-							key: 2,
-							class: "astryx-side-nav-heading__sub astryx-side-nav-heading__link",
-							href: __props.subheadingHref,
-							to: __props.as != null ? __props.subheadingHref : void 0
-						}, {
-							default: withCtx(() => [createTextVNode(toDisplayString(__props.subheading), 1)]),
-							_: 1
-						}, 8, ["href", "to"])) : __props.subheading ? (openBlock(), createElementBlock("span", _hoisted_20, toDisplayString(__props.subheading), 1)) : createCommentVNode("v-if", true)
-					]),
-					_ctx.$slots.end ? (openBlock(), createElementBlock("span", _hoisted_21, [renderSlot(_ctx.$slots, "end")])) : createCommentVNode("v-if", true)
-				], 8, _hoisted_13)]),
-				default: withCtx(({ close }) => [createElementVNode("div", _hoisted_22, [renderSlot(_ctx.$slots, "menu", { close })])]),
-				_: 3
-			}, 8, ["label"])) : !collapsed.value ? (openBlock(), createElementBlock("div", _hoisted_23, [
-				hasIcon.value && __props.headingHref ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
-					key: 0,
-					class: "astryx-side-nav-heading__icon",
-					href: __props.headingHref,
-					to: __props.as != null ? __props.headingHref : void 0,
-					"aria-label": __props.heading
-				}, {
-					default: withCtx(() => [renderSlot(_ctx.$slots, "icon")]),
-					_: 3
-				}, 8, [
-					"href",
-					"to",
-					"aria-label"
-				])) : hasIcon.value ? (openBlock(), createElementBlock("span", _hoisted_24, [renderSlot(_ctx.$slots, "icon")])) : createCommentVNode("v-if", true),
-				createElementVNode("span", _hoisted_25, [
-					__props.superheading && __props.superheadingHref ? (openBlock(), createBlock(resolveDynamicComponent(unref(resolveNavRoot)(__props.superheadingHref, false, __props.as)), {
-						key: 0,
-						class: "astryx-side-nav-heading__super astryx-side-nav-heading__link",
-						href: __props.superheadingHref,
-						to: __props.as != null ? __props.superheadingHref : void 0
-					}, {
-						default: withCtx(() => [createTextVNode(toDisplayString(__props.superheading), 1)]),
-						_: 1
-					}, 8, ["href", "to"])) : __props.superheading ? (openBlock(), createElementBlock("span", _hoisted_26, toDisplayString(__props.superheading), 1)) : createCommentVNode("v-if", true),
-					__props.headingHref ? (openBlock(), createBlock(resolveDynamicComponent(linkRoot.value), {
-						key: 2,
-						class: "astryx-side-nav-heading__title astryx-side-nav-heading__link",
-						href: __props.headingHref,
-						to: __props.as != null ? __props.headingHref : void 0
-					}, {
-						default: withCtx(() => [createTextVNode(toDisplayString(__props.heading), 1)]),
-						_: 1
-					}, 8, ["href", "to"])) : (openBlock(), createElementBlock("span", _hoisted_27, toDisplayString(__props.heading), 1)),
-					__props.subheading && __props.subheadingHref ? (openBlock(), createBlock(resolveDynamicComponent(unref(resolveNavRoot)(__props.subheadingHref, false, __props.as)), {
-						key: 4,
-						class: "astryx-side-nav-heading__sub astryx-side-nav-heading__link",
-						href: __props.subheadingHref,
-						to: __props.as != null ? __props.subheadingHref : void 0
-					}, {
-						default: withCtx(() => [createTextVNode(toDisplayString(__props.subheading), 1)]),
-						_: 1
-					}, 8, ["href", "to"])) : __props.subheading ? (openBlock(), createElementBlock("span", _hoisted_28, toDisplayString(__props.subheading), 1)) : createCommentVNode("v-if", true)
-				]),
-				_ctx.$slots.end ? (openBlock(), createElementBlock("span", _hoisted_29, [renderSlot(_ctx.$slots, "end")])) : createCommentVNode("v-if", true)
-			])) : createCommentVNode("v-if", true);
+				kind: "side",
+				as: __props.as,
+				heading: __props.heading,
+				"heading-href": __props.headingHref,
+				"logo-label": __props.logoLabel,
+				subheading: __props.subheading,
+				"subheading-href": __props.subheadingHref,
+				superheading: __props.superheading,
+				"superheading-href": __props.superheadingHref
+			}, createSlots({ _: 2 }, [
+				hasIcon.value ? {
+					name: "icon",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "icon")]),
+					key: "0"
+				} : void 0,
+				unref(slots).end ? {
+					name: "end",
+					fn: withCtx(() => [renderSlot(_ctx.$slots, "end")]),
+					key: "1"
+				} : void 0,
+				hasMenu.value ? {
+					name: "menu",
+					fn: withCtx((scope) => [renderSlot(_ctx.$slots, "menu", normalizeProps(guardReactiveProps(scope)))]),
+					key: "2"
+				} : void 0
+			]), 1032, [
+				"as",
+				"heading",
+				"heading-href",
+				"logo-label",
+				"subheading",
+				"subheading-href",
+				"superheading",
+				"superheading-href"
+			]));
 		};
 	}
 });

package/dist/Stack/index.d.ts

@@ -1,3 +1,3 @@
 import { a as StackDirection, c as StackItemProps, d as StackProps, f as StackSizeValue, i as StackCrossAlignment, l as StackItemSize, m as VStackProps, n as SpacingStep, o as StackElement, p as StackWrap, r as StackAlignment, s as StackItemCrossAlignSelf, t as HStackProps, u as StackMainAlignment } from "../types-D7QNSqoN.js";
-import { i as _default, n as _default$2, r as _default$1, t as _default$3 } from "../index-MPcg1Pm4.js";
+import { i as _default, n as _default$2, r as _default$1, t as _default$3 } from "../index-BKr7yvVv.js";
 export { _default as HStack, type HStackProps, type SpacingStep, _default$1 as Stack, type StackAlignment, type StackCrossAlignment, type StackDirection, type StackElement, _default$2 as StackItem, type StackItemCrossAlignSelf, type StackItemProps, type StackItemSize, type StackMainAlignment, type StackProps, type StackSizeValue, type StackWrap, _default$3 as VStack, type VStackProps };

package/dist/Stepper/index.d.ts

@@ -1,2 +1,2 @@
-import { a as StepProps, c as StepperCollapsedVariant, d as StepperIndicatorPosition, f as StepperOrientation, i as StepProgress, l as StepperDensity, m as StepperSlots, n as _default, o as StepSlots, p as StepperProps, r as StepIndicator, s as StepStatus, t as _default$1, u as StepperHorizontalOptions } from "../index-Ca8VIE4l.js";
+import { a as StepProps, c as StepperCollapsedVariant, d as StepperIndicatorPosition, f as StepperOrientation, i as StepProgress, l as StepperDensity, m as StepperSlots, n as _default, o as StepSlots, p as StepperProps, r as StepIndicator, s as StepStatus, t as _default$1, u as StepperHorizontalOptions } from "../index-CVn0GBdB.js";
 export { _default as Step, type StepIndicator, type StepProgress, type StepProps, type StepSlots, type StepStatus, _default$1 as Stepper, type StepperCollapsedVariant, type StepperDensity, type StepperHorizontalOptions, type StepperIndicatorPosition, type StepperOrientation, type StepperProps, type StepperSlots };

package/dist/Stepper/index.js

@@ -1,2 +1,2 @@
-import { n as _sfc_main, t as _sfc_main$1 } from "../Stepper-H-6-T5Ps.js";
+import { n as _sfc_main, t as _sfc_main$1 } from "../Stepper-BqhVCgC-.js";
 export { _sfc_main as Step, _sfc_main$1 as Stepper };

package/dist/{Stepper-H-6-T5Ps.js → Stepper-BqhVCgC-.js}

@@ -1,5 +1,5 @@
 import { t as _sfc_main$3 } from "./VisuallyHidden-C7NN3VEP.js";
-import { a as useAstryxMessages } from "./context-DmOLCubj.js";
+import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
 import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, onMounted, onUnmounted, openBlock, provide, ref, renderSlot, resolveDynamicComponent, toDisplayString, unref, useTemplateRef, watch, withCtx } from "vue";
 import "../styles/stepper.css";
 //#region src/Stepper/context.ts

package/dist/Switch/index.d.ts

@@ -1,2 +1,2 @@
-import { At as SwitchChangeEvent, Ft as SwitchStatus, It as SwitchStatusType, Mt as SwitchProps, Nt as SwitchSize, Ot as _default, Pt as SwitchSlots, jt as SwitchEmits, kt as SwitchChangeAction } from "../index-BTAgQRP0.js";
+import { At as SwitchChangeEvent, Ft as SwitchStatus, It as SwitchStatusType, Mt as SwitchProps, Nt as SwitchSize, Ot as _default, Pt as SwitchSlots, jt as SwitchEmits, kt as SwitchChangeAction } from "../index-EtZgovdH.js";
 export { _default as Switch, type SwitchChangeAction, type SwitchChangeEvent, type SwitchEmits, type SwitchProps, type SwitchSize, type SwitchSlots, type SwitchStatus, type SwitchStatusType };

package/dist/TabList/index.d.ts

@@ -1,2 +1,2 @@
-import { a as TabListProps, c as TabMenuOption, i as TabListLayout, l as TabMenuProps, n as _default$1, o as TabListSize, r as _default, s as TabListTab, t as _default$2, u as TabProps } from "../index-C-QpeUlQ.js";
+import { a as TabListProps, c as TabMenuOption, i as TabListLayout, l as TabMenuProps, n as _default$1, o as TabListSize, r as _default, s as TabListTab, t as _default$2, u as TabProps } from "../index-CNjbOgty.js";
 export { _default as Tab, _default$1 as TabList, type TabListLayout, type TabListProps, type TabListSize, type TabListTab, _default$2 as TabMenu, type TabMenuOption, type TabMenuProps, type TabProps };