@pgcorp/ui-kit 0.10.0 → 0.10.1

package/dist/src/components/shared/containers/SPopover.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,326 @@
+import { lastItem as e } from "../../../internal/es2020.js";
+import { findRelativeTabTarget as t, getFocusableElements as n } from "../../../internal/focusNavigation.js";
+import { registerLayer as r } from "../../../internal/layerStack.js";
+import { useFloatingPosition as i } from "../../../composables/useFloatingPosition.js";
+import { useUiKitLocale as a } from "../../../composables/useUiKitLocale.js";
+import { useOwnedAttrs as o } from "../../../internal/ownedAttrs.js";
+import { useInteractiveLeafRegistration as s } from "../../../internal/passiveContentContract.js";
+import c from "../controls/SButton.vue.js";
+import { resolveInteractiveElement as l } from "../../../internal/interactiveElement.js";
+import { Teleport as u, Transition as d, computed as f, createBlock as p, createCommentVNode as ee, createElementBlock as m, createElementVNode as h, createVNode as te, defineComponent as g, mergeProps as _, nextTick as v, normalizeStyle as ne, onBeforeUnmount as re, onMounted as ie, onUpdated as ae, openBlock as y, ref as b, renderSlot as x, unref as S, useId as oe, useSlots as se, watch as ce, withCtx as C, withKeys as le } from "vue";
+//#region src/components/shared/containers/SPopover.vue?vue&type=script&setup=true&lang.ts
+var ue = { class: "s-popover relative block w-full" }, de = [
+	"data-placement",
+	"data-surface",
+	"data-width",
+	"aria-label"
+], fe = { class: "s-popover-content" }, pe = "built-in", w = /*@__PURE__*/ g({
+	inheritAttrs: !1,
+	__name: "SPopover",
+	props: {
+		align: { default: "right" },
+		surface: { default: "default" },
+		width: { default: "trigger" },
+		ariaLabel: { default: void 0 },
+		triggerAppearance: { default: "ghost" },
+		triggerSize: { default: "md" },
+		triggerWidth: { default: "full" },
+		triggerContentAlign: { default: "center" },
+		triggerShape: { default: "default" },
+		triggerLabel: { default: void 0 },
+		triggerLeadingIcon: { default: void 0 },
+		triggerTrailingIcon: { default: void 0 },
+		triggerIconOnly: {
+			type: Boolean,
+			default: !1
+		},
+		triggerSeverity: { default: "secondary" },
+		triggerBadge: { default: void 0 },
+		triggerTitle: { default: void 0 },
+		triggerAriaLabel: { default: void 0 },
+		triggerTestId: { default: void 0 },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		open: {
+			type: Boolean,
+			default: void 0
+		}
+	},
+	emits: ["update:open"],
+	setup(g, { expose: w, emit: me }) {
+		let T = g, { t: he } = a(), E = f(() => T.ariaLabel ?? he("dialog.moreActions")), D = me, O = se(), ge = o({
+			component: "SPopover",
+			owner: "root wrapper"
+		});
+		if (O.trigger && O.default) throw Error("SPopover: default slot is reserved for built-in SButton content and cannot be combined with #trigger; move popover content to #panel");
+		if (!O.panel) throw Error("SPopover: #panel slot is required");
+		let k = T.open !== void 0, A = b(!1), j = f(() => T.open ?? A.value);
+		s({
+			owner: "SPopover",
+			active: () => j.value
+		});
+		let M = `s-popover-panel-${oe()}`, N = b(null), P = b("var(--s-layer-root-floating)"), _e = f(() => T.triggerAriaLabel ?? (T.triggerIconOnly || !T.triggerLabel && !O.default ? E.value : void 0)), F = null, I = null, ve = f(() => T.align === "left" ? "bottom-start" : T.align === "center" ? "bottom-center" : "bottom-end"), { anchorRef: L, panelRef: R, floatingStyle: ye, resolvedPlacement: be, updatePosition: z } = i({
+			active: j,
+			placement: () => ve.value,
+			offset: () => 6,
+			boundaryPadding: () => 8,
+			flip: () => !0,
+			shift: () => !0,
+			constrainMainAxis: () => !0,
+			widthMatch: () => T.width === "trigger" ? "min" : "none",
+			zIndex: () => P.value,
+			scrollStrategy: "reposition"
+		});
+		class xe {
+			constructor(e, t) {
+				this.id = e, this.activation = t, this.target = null, this.binding = {
+					ref: (e) => Ce(this, e),
+					get "aria-expanded"() {
+						return j.value && N.value === e;
+					},
+					get disclosure() {
+						return {
+							expanded: j.value && N.value === e,
+							controls: M,
+							iconPlacement: "none"
+						};
+					},
+					"aria-haspopup": "dialog",
+					"aria-controls": M,
+					onClick: (e) => ke(this, e)
+				};
+			}
+			element() {
+				return Se(this.target, this.id);
+			}
+		}
+		let B = /* @__PURE__ */ new Map();
+		function V(e) {
+			if (e.length === 0 || e.trim() !== e) throw Error("SPopover: trigger id must be a non-empty string without surrounding whitespace");
+		}
+		function Se(e, t) {
+			return l(`SPopover: trigger "${t}"`, e);
+		}
+		function Ce(e, t) {
+			if (t === null) {
+				e.target = null;
+				return;
+			}
+			if (e.target && e.target !== t) throw Error(`SPopover: trigger id "${e.id}" is bound to multiple elements`);
+			for (let n of B.values()) if (n !== e && n.target === t) throw Error(`SPopover: one trigger element cannot use both "${n.id}" and "${e.id}" ids`);
+			e.target = t;
+		}
+		function H(e, t = "toggle") {
+			V(e);
+			let n = B.get(e);
+			if (n) {
+				if (n.activation !== t) throw Error(`SPopover: trigger "${e}" activation cannot change from "${n.activation}" to "${t}"`);
+				return n.binding;
+			}
+			let r = new xe(e, t);
+			return B.set(e, r), r.binding;
+		}
+		let we = O.trigger ? void 0 : H(pe);
+		function U(e) {
+			return /* @__PURE__ */ Error(`SPopover: custom trigger "${e}" must apply the complete object returned by bindTrigger()`);
+		}
+		function W(e) {
+			let t = e.element();
+			if (!t) throw U(e.id);
+			if (O.trigger && !(t instanceof HTMLButtonElement)) throw Error(`SPopover: custom trigger "${e.id}" must bind directly to a button element, not to a wrapper`);
+			if (t.getAttribute("aria-haspopup") !== "dialog" || t.getAttribute("aria-controls") !== M || t.getAttribute("aria-expanded") !== String(j.value && N.value === e.id)) throw U(e.id);
+			return t;
+		}
+		function Te() {
+			if (B.size === 0) throw Error("SPopover: #trigger must apply a binding returned by bindTrigger()");
+			for (let e of B.values()) W(e);
+		}
+		function Ee() {
+			return [...B.values()].filter((e) => e.element()?.isConnected).map((e) => e.id).sort((e, t) => e.localeCompare(t));
+		}
+		function G(e) {
+			if (e !== void 0) {
+				V(e);
+				let t = B.get(e);
+				if (!t?.element()?.isConnected) throw Error(`SPopover: programmatic open requires a registered trigger with id "${e}"`);
+				return W(t), t;
+			}
+			let t = Ee();
+			if (t.length === 0) throw Error("SPopover: programmatic open requires one registered trigger anchor");
+			if (t.length > 1) throw Error(`SPopover: programmatic open is ambiguous; pass one of the registered trigger ids: ${t.map((e) => `"${e}"`).join(", ")}`);
+			let [n] = t;
+			if (!n) throw Error("SPopover: registered trigger inventory is unexpectedly empty");
+			let r = B.get(n);
+			if (!r) throw Error("SPopover: registered trigger invariant failed");
+			return W(r), r;
+		}
+		function K(e) {
+			let t = W(e);
+			return N.value = e.id, L.value = t, t;
+		}
+		function q(e) {
+			F?.unregister({ restoreFocus: !1 }), F = r({
+				kind: "popover",
+				root: () => R.value,
+				anchor: () => L.value,
+				branches: () => [...B.values()].map((e) => e.element()).filter((e) => !!e?.isConnected),
+				restoreTarget: e,
+				requestDismiss: (e) => Q(e === "escape" ? "escape" : "outside")
+			}), P.value = F.zIndex;
+		}
+		function De() {
+			if (N.value !== null) {
+				let e = B.get(N.value);
+				if (e?.element()?.isConnected) return e;
+			}
+			return G();
+		}
+		function J(e = De()) {
+			q(K(e)), v(z);
+		}
+		function Oe(e) {
+			if (!(e instanceof HTMLElement)) throw Error("SPopover: transition enter target must be an HTMLElement");
+			j.value && e.focus();
+		}
+		function Y(e) {
+			let t = e === "explicit" || e === "escape" || e === "trigger";
+			F?.unregister({ restoreFocus: t }), F = null, P.value = "var(--s-layer-root-floating)";
+		}
+		function X() {
+			if (T.open !== void 0 !== k) throw Error("SPopover: open control mode cannot change after mount");
+		}
+		function ke(e, t) {
+			if (e.activation === "manual") {
+				K(e), j.value && v(z);
+				return;
+			}
+			if (j.value && N.value === e.id) {
+				Q("trigger");
+				return;
+			}
+			if (j.value) {
+				q(K(e)), v(z);
+				return;
+			}
+			Z(e.id);
+		}
+		function Z(e) {
+			if (!j.value && !T.disabled) {
+				let t = G(e);
+				if (K(t), D("update:open", !0), k) return;
+				J(t), A.value = !0;
+				return;
+			}
+			j.value && e !== void 0 && e !== N.value && (q(K(G(e))), v(z));
+		}
+		function Q(e = "explicit") {
+			if (j.value) {
+				if (I = e, D("update:open", !1), k) return;
+				A.value = !1, Y(e), I = null;
+			}
+		}
+		function $() {
+			Q("explicit");
+		}
+		function Ae(r) {
+			let i = R.value, a = L.value;
+			if (!i || !a) return;
+			let o = n(i), s = document.activeElement, c = o[0], l = e(o);
+			if (!(o.length === 0 || (r.shiftKey ? s === i || s === c : s === l))) return;
+			let u = F?.focusScope() ?? document, d = t(a, u, i, r.shiftKey);
+			r.preventDefault(), Q("tab"), d && v(() => d.focus());
+		}
+		function je(e) {
+			if (!j.value) return;
+			let t = e.relatedTarget;
+			t instanceof Node && (R.value?.contains(t) || [...B.values()].some((e) => e.element()?.contains(t))) || Q("outside");
+		}
+		return ie(() => {
+			Te(), j.value && J();
+		}), ae(() => {
+			X();
+		}), ce(() => T.open, (e) => {
+			if (X(), e) {
+				J();
+				return;
+			}
+			Y(I ?? "explicit"), I = null;
+		}, { flush: "post" }), re(() => {
+			F?.unregister({ restoreFocus: !1 }), F = null;
+		}), w({
+			open: Z,
+			close: $
+		}), (e, t) => (y(), m("div", _(S(ge).bindings(), { class: "s-popover-wrapper" }), [h("div", ue, [e.$slots.trigger ? x(e.$slots, "trigger", {
+			bindTrigger: H,
+			open: Z,
+			close: $,
+			isOpen: j.value
+		}, void 0, !0, 0) : (y(), p(c, _({ key: 1 }, S(we), {
+			"data-s-popover-trigger": "",
+			label: g.triggerLabel,
+			"leading-icon": g.triggerLeadingIcon,
+			"trailing-icon": g.triggerTrailingIcon,
+			"icon-only": g.triggerIconOnly,
+			appearance: g.triggerAppearance,
+			size: g.triggerSize,
+			width: g.triggerWidth,
+			"content-align": g.triggerContentAlign,
+			shape: g.triggerShape,
+			severity: g.triggerSeverity,
+			badge: g.triggerBadge,
+			disabled: g.disabled,
+			title: g.triggerTitle,
+			"aria-label": _e.value,
+			"data-testid": g.triggerTestId
+		}), {
+			default: C(() => [x(e.$slots, "default", { isOpen: j.value }, void 0, !0)]),
+			_: 3
+		}, 16, [
+			"label",
+			"leading-icon",
+			"trailing-icon",
+			"icon-only",
+			"appearance",
+			"size",
+			"width",
+			"content-align",
+			"shape",
+			"severity",
+			"badge",
+			"disabled",
+			"title",
+			"aria-label",
+			"data-testid"
+		])), te(d, {
+			"enter-active-class": "transition duration-[var(--s-motion-standard)] ease-out",
+			"enter-from-class": "translate-y-1 opacity-0",
+			"enter-to-class": "translate-y-0 opacity-100",
+			"leave-active-class": "pointer-events-none transition duration-[var(--s-motion-fast)] ease-in",
+			"leave-from-class": "translate-y-0 opacity-100",
+			"leave-to-class": "translate-y-1 opacity-0",
+			onEnter: Oe
+		}, {
+			default: C(() => [(y(), p(u, { to: "body" }, [j.value ? (y(), m("div", {
+				key: 0,
+				ref_key: "panelRef",
+				ref: R,
+				class: "s-popover-panel",
+				style: ne(S(ye)),
+				"data-placement": S(be),
+				"data-surface": g.surface,
+				"data-width": g.width,
+				tabindex: "-1",
+				role: "dialog",
+				id: M,
+				"aria-label": E.value,
+				onKeydown: le(Ae, ["tab"]),
+				onFocusout: je
+			}, [h("div", fe, [x(e.$slots, "panel", { close: $ }, void 0, !0)])], 44, de)) : ee("", !0)]))]),
+			_: 3
+		})])], 16));
+	}
+});
+//#endregion
+export { w as default };

package/dist/src/components/shared/containers/SSidebarGroup.vue.d.ts

@@ -0,0 +1,23 @@
+import { SectionState, SidebarSectionsState } from './sidebar';
+type __VLS_Props = {
+    sectionsState: SidebarSectionsState;
+};
+declare var __VLS_1: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_1) => any;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update-sections": (state: Readonly<Record<string, Readonly<SectionState>>>) => any;
+    "toggle-section": (key: string) => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    "onUpdate-sections"?: ((state: Readonly<Record<string, Readonly<SectionState>>>) => any) | undefined;
+    "onToggle-section"?: ((key: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/shared/containers/SSidebarGroup.vue.js

@@ -0,0 +1,8 @@
+import "../../../../assets/src/components/shared/containers/SSidebarGroup.css_vue_type_style_index_0_src_3e8bc2d7_scoped_3e8bc2d7_lang.css";
+import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+import t from "./SSidebarGroup.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                           */
+//#region src/components/shared/containers/SSidebarGroup.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-3e8bc2d7"]]);
+//#endregion
+export { n as default };

package/dist/src/components/shared/containers/SSidebarGroup.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,272 @@
+import { hasOwn as e, lastItem as t } from "../../../internal/es2020.js";
+import { assertSidebarSectionsState as n, createSidebarSectionsTransition as r, sidebarSectionsStateEqual as i } from "./sidebar.js";
+import { useOwnedAttrs as a } from "../../../internal/ownedAttrs.js";
+import { sidebarGroupContextKey as o } from "../_internal/sidebarGroupContext.js";
+import { computed as s, createElementBlock as c, defineComponent as l, mergeProps as u, onBeforeUnmount as d, onMounted as f, openBlock as p, provide as m, ref as h, renderSlot as g, shallowRef as _, unref as v, watch as y } from "vue";
+//#region src/components/shared/containers/SSidebarGroup.vue?vue&type=script&setup=true&lang.ts
+var b = /*@__PURE__*/ l({
+	inheritAttrs: !1,
+	__name: "SSidebarGroup",
+	props: { sectionsState: {} },
+	emits: ["update-sections", "toggle-section"],
+	setup(l, { emit: b }) {
+		let x = l, S = b, C = a({
+			component: "SSidebarGroup",
+			owner: "sidebar group root"
+		}), w = h(null), T = _([]), E = /* @__PURE__ */ new Map(), D = null, O = !1, k = h(0), A = null;
+		n(x.sectionsState);
+		function j() {
+			return n(x.sectionsState), x.sectionsState;
+		}
+		function M(e, t) {
+			let n = e.offsetHeight;
+			if (!Number.isFinite(n) || n < 0) throw RangeError(`SSidebarGroup: ${t}.offsetHeight must be a non-negative finite number`);
+			return n;
+		}
+		function N() {
+			let e = w.value;
+			if (!e) throw Error("SSidebarGroup: mounted group element is unavailable");
+			let t = e.clientHeight;
+			if (!Number.isFinite(t) || t < 0) throw RangeError("SSidebarGroup: group clientHeight must be a non-negative finite number");
+			return t;
+		}
+		function P(e, t) {
+			let n = e.element.compareDocumentPosition(t.element);
+			if (n & Node.DOCUMENT_POSITION_DISCONNECTED) throw Error(`SSidebarGroup: registered sections '${e.key}' and '${t.key}' are not in one DOM tree`);
+			if (n & Node.DOCUMENT_POSITION_FOLLOWING) return -1;
+			if (n & Node.DOCUMENT_POSITION_PRECEDING) return 1;
+			throw Error(`SSidebarGroup: registered sections '${e.key}' and '${t.key}' have ambiguous DOM order`);
+		}
+		let F = s(() => {
+			let e = j();
+			return [...T.value].sort(P).map((t) => {
+				let n = e[t.key];
+				if (!n) throw Error(`SSidebarGroup: registered section '${t.key}' has no controlled state`);
+				return {
+					key: t.key,
+					element: t.element,
+					state: n
+				};
+			});
+		});
+		function I(e) {
+			let t = F.value.find((t) => t.key === e);
+			if (!t) throw Error(`SSidebarGroup: mounted geometry is unavailable for section '${e}'`);
+			return t;
+		}
+		function L(e) {
+			let t = j(), n = r(t, e);
+			i(n, t) || S("update-sections", n);
+		}
+		function R() {
+			let e = ++k.value;
+			queueMicrotask(() => {
+				O && e === k.value && A === null && B();
+			});
+		}
+		function z(e, n) {
+			let r = e.reduce((e, t) => e + t.state.minSize, 0), i = Math.max(r, n), a = e.find((e) => e.state.size === null), o = /* @__PURE__ */ new Map();
+			for (let t of e) {
+				let e = E.get(t.key) ?? t.state.size ?? t.state.minSize;
+				o.set(t.key, Math.max(t.state.minSize, e));
+			}
+			let s = i - [...o.values()].reduce((e, t) => e + t, 0);
+			if (s > 0) {
+				let n = a ?? t(e);
+				n && o.set(n.key, o.get(n.key) + s), s = 0;
+			}
+			if (s < 0) {
+				let t = a ? e.findIndex((e) => e.key === a.key) : e.length - 1, n = e.map((e, n) => ({
+					section: e,
+					distance: Math.abs(n - t)
+				})).sort((e, t) => e.distance - t.distance), r = -s;
+				for (let { section: e } of n) {
+					if (r <= 0) break;
+					let t = o.get(e.key), n = Math.min(t - e.state.minSize, r);
+					o.set(e.key, t - n), r -= n;
+				}
+			}
+			return o;
+		}
+		function B() {
+			let e = N();
+			if (e === 0) return;
+			let t = F.value, n = t.filter((e) => e.state.isOpen);
+			if (n.length === 0) return;
+			let r = z(n, e - t.filter((e) => !e.state.isOpen).reduce((e, t) => e + M(t.element, `sections.${t.key}`), 0)), i = !1;
+			for (let e of n) {
+				let t = r.get(e.key);
+				E.get(e.key) !== t && (i = !0), E.set(e.key, t);
+			}
+			i && (k.value += 1);
+		}
+		function V(t) {
+			if (typeof t.key != "string" || t.key.trim().length === 0) throw TypeError("SSidebarGroup: registered section key must be non-empty");
+			if (!(t.element instanceof HTMLElement)) throw TypeError("SSidebarGroup: registered section element must be an HTMLElement");
+			if (!e(j(), t.key)) throw Error(`SSidebarGroup: registered section '${t.key}' has no controlled state`);
+			if (T.value.some((e) => e.key === t.key)) throw Error(`SSidebarGroup: duplicate registered section key '${t.key}'`);
+			if (T.value.some((e) => e.element === t.element)) throw Error("SSidebarGroup: one section element cannot be registered under multiple keys");
+			let n = Object.freeze({ ...t });
+			T.value = Object.freeze([...T.value, n]), R();
+			let r = !0;
+			return () => {
+				r && (r = !1, T.value = Object.freeze(T.value.filter((e) => e !== n)), R());
+			};
+		}
+		function H(e, t) {
+			let n = F.value, r = n.findIndex((t) => t.key === e.key), i = [...t].sort((e, t) => Math.abs(n.findIndex((t) => t.key === e.key) - r) - Math.abs(n.findIndex((e) => e.key === t.key) - r))[0];
+			if (!i) throw Error(`SSidebarGroup: no open neighbor exists for section '${e.key}'`);
+			return i;
+		}
+		function U(e) {
+			let t = j(), n = t[e];
+			if (!n) throw Error(`SSidebarGroup: cannot toggle unknown section '${e}'`);
+			let r = Object.entries(t).filter(([, e]) => e.isOpen).map(([e]) => e);
+			if (n.isOpen) {
+				if (n.size === null && r.length > 1) {
+					let t = I(e), r = H(t, F.value.filter((t) => t.key !== e && t.state.isOpen));
+					L([{
+						key: e,
+						state: {
+							...n,
+							size: Math.max(n.minSize, M(t.element, `sections.${e}`))
+						}
+					}, {
+						key: r.key,
+						state: {
+							...r.state,
+							size: null
+						}
+					}]);
+				}
+				S("toggle-section", e);
+				return;
+			}
+			if (r.length === 0) {
+				n.size !== null && L([{
+					key: e,
+					state: {
+						...n,
+						size: null
+					}
+				}]), S("toggle-section", e);
+				return;
+			}
+			I(e);
+			let i = n.size ?? n.minSize, a = N();
+			if (a > 0) {
+				let t = F.value.reduce((t, n) => n.key === e ? t : n.state.isOpen ? t + n.state.minSize : t + M(n.element, `sections.${n.key}`), 0);
+				i = Math.min(i, Math.max(n.minSize, a - t));
+			}
+			n.size !== i && L([{
+				key: e,
+				state: {
+					...n,
+					size: i
+				}
+			}]), S("toggle-section", e);
+		}
+		function W(e) {
+			k.value;
+			let t = j()[e];
+			if (!t) throw Error(`SSidebarGroup: cannot style unknown section '${e}'`);
+			if (!t.isOpen) return Object.freeze({
+				flexGrow: 0,
+				flexShrink: 0,
+				flexBasis: "auto",
+				overflow: "hidden"
+			});
+			let n = E.get(e) ?? t.size ?? t.minSize;
+			return Object.freeze({
+				flexGrow: 0,
+				flexShrink: 0,
+				flexBasis: `${n}px`,
+				minHeight: "var(--s-sidebar-collapsed-section-height)"
+			});
+		}
+		function G(e) {
+			k.value;
+			let t = I(e);
+			return t.state.isOpen ? E.get(e) ?? t.state.size ?? t.state.minSize : M(t.element, `sections.${e}`);
+		}
+		function K(e, t) {
+			let n = F.value, r = n.findIndex((t) => t.key === e);
+			if (r < 0) throw Error(`SSidebarGroup: unknown resize top section '${e}'`);
+			let i = n.findIndex((e) => e.key === t);
+			if (i < 0) throw Error(`SSidebarGroup: unknown resize bottom section '${t}'`);
+			let a = n[r], o = n[i];
+			if (!a.state.isOpen || !o.state.isOpen) throw Error("SSidebarGroup: both resize sections must be open");
+			let s = n.find((e, t) => t > r && e.state.isOpen);
+			if (!s || s.key !== t || i <= r) throw Error(`SSidebarGroup: '${e}' and '${t}' must be consecutive open sections`);
+			return [a, o];
+		}
+		function q(e, t) {
+			if (K(e, t), A !== null) throw Error(`SSidebarGroup: resize '${A.topKey}'/'${A.bottomKey}' is already active`);
+			A = Object.freeze({
+				topKey: e,
+				bottomKey: t
+			}), k.value += 1;
+		}
+		function J(e, n, r) {
+			if (!Number.isFinite(r)) throw RangeError("SSidebarGroup: requestedTopSize must be a finite number");
+			if (A !== null && (A.topKey !== e || A.bottomKey !== n)) throw Error("SSidebarGroup: resize update does not match the active section pair");
+			K(e, n);
+			let i = F.value.filter((e) => e.state.isOpen), a = i.findIndex((t) => t.key === e), o = i.slice(0, a + 1), s = i.slice(a + 1), c = r - o.reduce((e, t) => e + (E.get(t.key) ?? M(t.element, `sections.${t.key}`)), 0), l = c > 0 ? [...s] : [...o].reverse(), u = c > 0 ? t(o) : s[0], d = Math.abs(c);
+			if (d = Math.min(d, l.reduce((e, t) => {
+				let n = E.get(t.key) ?? M(t.element, `sections.${t.key}`);
+				return e + Math.max(0, n - t.state.minSize);
+			}, 0)), d === 0 || !u) return;
+			let f = d;
+			for (let e of l) {
+				if (f <= 0) break;
+				let t = E.get(e.key) ?? M(e.element, `sections.${e.key}`), n = Math.min(t - e.state.minSize, f);
+				E.set(e.key, t - n), f -= n;
+			}
+			let p = E.get(u.key) ?? M(u.element, `sections.${u.key}`);
+			E.set(u.key, p + d), k.value += 1;
+			let m = i.filter((e) => e.state.size !== null).map((e) => ({
+				key: e.key,
+				state: {
+					...e.state,
+					size: E.get(e.key)
+				}
+			}));
+			m.length > 0 && L(m);
+		}
+		function Y(e, t) {
+			if (A === null) throw Error("SSidebarGroup: cannot finish a resize that is not active");
+			if (A.topKey !== e || A.bottomKey !== t) throw Error("SSidebarGroup: resize end does not match the active section pair");
+			A = null, R();
+		}
+		return m(o, {
+			sectionsState: s(j),
+			orderedSections: F,
+			geometryRevision: k,
+			registerSection: V,
+			toggleSection: U,
+			getSectionStyle: W,
+			getSectionSize: G,
+			beginResize: q,
+			resizeSections: J,
+			finishResize: Y
+		}), y(() => x.sectionsState, () => {
+			j(), R();
+		}, {
+			deep: !0,
+			flush: "post"
+		}), f(() => {
+			O = !0;
+			let e = w.value;
+			if (!e) throw Error("SSidebarGroup: group element is unavailable during mount");
+			D = new ResizeObserver(R), D.observe(e), R();
+		}), d(() => {
+			O = !1, k.value += 1, A = null, D?.disconnect(), D = null, T.value = Object.freeze([]);
+		}), (e, t) => (p(), c("div", u(v(C).bindings(), {
+			ref_key: "groupRef",
+			ref: w,
+			class: "s-sidebar-group"
+		}), [g(e.$slots, "default", {}, void 0, !0)], 16));
+	}
+});
+//#endregion
+export { b as default };

package/dist/src/components/shared/containers/SSidebarSection.vue.d.ts

@@ -0,0 +1,35 @@
+import { SDisclosureSummaryBadge, SDisclosureSummaryCase, SDisclosureSummaryFact, SDisclosureSummaryState, SDisclosureSummaryStatus, SDisclosureSummaryTypography } from './disclosureSummary';
+type __VLS_Props = {
+    summary: string;
+    summaryTypography?: SDisclosureSummaryTypography;
+    summaryCase?: SDisclosureSummaryCase;
+    summaryState?: SDisclosureSummaryState;
+    summaryFacts?: readonly SDisclosureSummaryFact[];
+    summaryBadges?: readonly SDisclosureSummaryBadge[];
+    summaryStatus?: SDisclosureSummaryStatus;
+    stateKey: string;
+    layout?: 'desktop' | 'mobile';
+    disabled?: boolean;
+};
+type __VLS_Slots = {
+    default(): unknown;
+    actions?(): unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    layout: "desktop" | "mobile";
+    disabled: boolean;
+    summaryTypography: SDisclosureSummaryTypography;
+    summaryCase: SDisclosureSummaryCase;
+    summaryState: SDisclosureSummaryState;
+    summaryFacts: readonly SDisclosureSummaryFact[];
+    summaryBadges: readonly SDisclosureSummaryBadge[];
+    summaryStatus: SDisclosureSummaryStatus;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/src/components/shared/containers/SSidebarSection.vue.js

@@ -0,0 +1,8 @@
+import "../../../../assets/src/components/shared/containers/SSidebarSection.css_vue_type_style_index_0_src_96f51ac6_scoped_96f51ac6_lang.css";
+import e from "../../../../_virtual/_plugin-vue_export-helper.js";
+import t from "./SSidebarSection.vue_vue_type_script_setup_true_lang.js";
+/* empty css                                                                             */
+//#region src/components/shared/containers/SSidebarSection.vue
+var n = /*#__PURE__*/ e(t, [["__scopeId", "data-v-96f51ac6"]]);
+//#endregion
+export { n as default };