@astryx-vue/core 0.2.2 → 0.2.4

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-DonEfiAx.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-DonEfiAx.js → SideNav-CT9lfspi.js}

@@ -1,12 +1,15 @@
-import { t as useHotkeys } from "./useHotkeys-dABSK1o9.js";
-import { a as useAstryxMessages } from "./context-CiKncNSH.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-CJKjdJy-.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-DHrSNRDR.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/Stepper/index.js

@@ -1,2 +1,2 @@
-import { n as _sfc_main, t as _sfc_main$1 } from "../Stepper-D2ZIcUNx.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-D2ZIcUNx.js → Stepper-BqhVCgC-.js}

@@ -1,5 +1,5 @@
 import { t as _sfc_main$3 } from "./VisuallyHidden-C7NN3VEP.js";
-import { a as useAstryxMessages } from "./context-CiKncNSH.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-DNRBbwp_.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.js

@@ -1,2 +1,2 @@
-import { n as _sfc_main$1, r as _sfc_main, t as _sfc_main$2 } from "../TabList-D3F-stq-.js";
+import { n as _sfc_main$1, r as _sfc_main, t as _sfc_main$2 } from "../TabList-BlzkrObv.js";
 export { _sfc_main as Tab, _sfc_main$1 as TabList, _sfc_main$2 as TabMenu };

package/dist/{TabList-D3F-stq-.js → TabList-BlzkrObv.js}

@@ -1,7 +1,7 @@
-import { t as useDismiss } from "./useDismiss-CAiHU6QD.js";
+import { t as useDismiss } from "./useDismiss-Cj8x_51F.js";
 import { t as useListFocus } from "./useListFocus-D0iOJl39.js";
 import { t as usePositionedLayer } from "./usePositionedLayer-C1NBOsVT.js";
-import { t as _sfc_main$3 } from "./Icon-CJKjdJy-.js";
+import { t as _sfc_main$3 } from "./Icon-bteSId7T.js";
 import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, inject, nextTick, normalizeClass, normalizeStyle, onMounted, onUnmounted, openBlock, provide, reactive, ref, renderList, renderSlot, toDisplayString, unref, useId, watch } from "vue";
 import "../styles/tab-list.css";
 import "../styles/tab-menu.css";

package/dist/Table/index.js

@@ -1,2 +1,2 @@
-import { A as useTableColumnSettings, B as resolveColumnWidths, C as isInteractiveRowClick, D as applyTableFilters, E as useTableGroupedRows, F as generateColumns, I as paginateData, L as pixel, M as useTableColumnResize, N as capitalize, O as useTableFilterState, P as cellText, R as proportional, S as useTablePagination, T as isTableGroupHeader, V as sortRows, _ as useTableSelection, a as _sfc_main$3, b as useTableRowIndex, c as _sfc_main, d as useTableTreeState, f as resolveStickySide, g as useTableSortableState, h as useTableSortable, i as _sfc_main$4, j as useTableColumnSettingsState, k as useTableFiltering, l as flattenTree, m as useTableStickyColumns, n as _sfc_main$6, o as _sfc_main$2, p as stickyOffsets, r as _sfc_main$5, s as _sfc_main$1, t as _sfc_main$7, u as useTableTreeData, v as useTableSelectionState, w as buildGroupedRows, x as useTableRowExpansion, y as useTableRowStatus, z as resolveColumnFloorWidths } from "../Table-CrP2Uffq.js";
+import { A as useTableColumnSettings, B as resolveColumnWidths, C as isInteractiveRowClick, D as applyTableFilters, E as useTableGroupedRows, F as generateColumns, I as paginateData, L as pixel, M as useTableColumnResize, N as capitalize, O as useTableFilterState, P as cellText, R as proportional, S as useTablePagination, T as isTableGroupHeader, V as sortRows, _ as useTableSelection, a as _sfc_main$3, b as useTableRowIndex, c as _sfc_main, d as useTableTreeState, f as resolveStickySide, g as useTableSortableState, h as useTableSortable, i as _sfc_main$4, j as useTableColumnSettingsState, k as useTableFiltering, l as flattenTree, m as useTableStickyColumns, n as _sfc_main$6, o as _sfc_main$2, p as stickyOffsets, r as _sfc_main$5, s as _sfc_main$1, t as _sfc_main$7, u as useTableTreeData, v as useTableSelectionState, w as buildGroupedRows, x as useTableRowExpansion, y as useTableRowStatus, z as resolveColumnFloorWidths } from "../Table-CsdH8fCB.js";
 export { _sfc_main as Table, _sfc_main$1 as TableBody, _sfc_main$2 as TableCell, _sfc_main$3 as TableFooter, _sfc_main$4 as TableHeader, _sfc_main$5 as TableHeaderCell, _sfc_main$6 as TableRow, _sfc_main$7 as TableSelectionToolbar, applyTableFilters, buildGroupedRows, capitalize, cellText, flattenTree, generateColumns, isInteractiveRowClick, isTableGroupHeader, paginateData, paginateData as paginateTableData, pixel, proportional, resolveColumnFloorWidths, resolveColumnWidths, resolveStickySide, sortRows, stickyOffsets, useTableColumnResize, useTableColumnSettings, useTableColumnSettingsState, useTableFilterState, useTableFiltering, useTableGroupedRows, useTablePagination, useTableRowExpansion, useTableRowIndex, useTableRowStatus, useTableSelection, useTableSelectionState, useTableSortable, useTableSortableState, useTableStickyColumns, useTableTreeData, useTableTreeState };

package/dist/{Table-CrP2Uffq.js → Table-CsdH8fCB.js}

@@ -1,13 +1,13 @@
 import { t as _sfc_main$14 } from "./VisuallyHidden-C7NN3VEP.js";
 import { t as _sfc_main$15 } from "./Button-DrqeomlE.js";
-import { a as useAstryxMessages } from "./context-CiKncNSH.js";
-import { t as _sfc_main$16 } from "./Tooltip-mp0NMh_Y.js";
+import { o as useAstryxMessages } from "./context-CPh7kE-a.js";
+import { t as _sfc_main$16 } from "./Tooltip-C2fh9anJ.js";
 import { t as _sfc_main$17 } from "./IconButton-BNQuz9W_.js";
-import { t as _sfc_main$18 } from "./Icon-CJKjdJy-.js";
-import { t as _sfc_main$19 } from "./CheckboxInput-CMsEE1_4.js";
-import { t as _sfc_main$20 } from "./Popover-Crhk9PNP.js";
-import { t as _sfc_main$21 } from "./Pagination-Cb66HMEf.js";
-import { t as _sfc_main$22 } from "./Selector-DE2IEFML.js";
+import { t as _sfc_main$18 } from "./Icon-bteSId7T.js";
+import { t as _sfc_main$19 } from "./CheckboxInput-25Q8ItH-.js";
+import { t as _sfc_main$20 } from "./Popover-D7zqpFwU.js";
+import { t as _sfc_main$21 } from "./Pagination-CNe9F6Fl.js";
+import { t as _sfc_main$22 } from "./Selector-5N-hq2nF.js";
 import { t as _sfc_main$23 } from "./TextInput-BasnjVvy.js";
 import { Fragment, Teleport, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, h, mergeProps, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, onScopeDispose, openBlock, ref, renderList, renderSlot, toDisplayString, toValue, unref, watch, withCtx, withModifiers } from "vue";
 import "../styles/table.css";