@mtngtools/frame-vue 0.0.10-experimental.0 → 0.0.12-experimental.0

package/dist/{LoggedInOut-CWlMf-Qv.js → LoggedInOut-BeHGjqd7.js}

@@ -1,5 +1,5 @@
-import { t as useSimpleLoggedIn } from "./useSimpleLoggedIn-Bz5zqTrQ.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, vShow, watch, withCtx, withDirectives } from "vue";
+import { t as useSimpleLoggedIn } from "./useSimpleLoggedIn-CSv5Xy3J.js";
+import { Comment, Fragment, Text, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, onUnmounted, openBlock, ref, renderList, renderSlot, resolveDynamicComponent, toDisplayString, unref, useSlots, vShow, watch, withCtx, withDirectives } from "vue";
 var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ */ defineComponent({
 	__name: "SidePanelControlButton",
 	props: {
@@ -19,26 +19,26 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 	},
 	emits: ["click"],
 	setup(e, { emit: t }) {
-		let r = e, i = t, o = {
+		let n = e, r = t, a = {
 			auto: "Auto",
 			right: "Right",
 			bottom: "Bottom",
 			full: "Full",
 			minimized: "Close"
-		}, c = computed(() => o[r.state]), l = computed(() => {
-			if (r.disabled) return "cursor-not-allowed border-neutral-700 text-neutral-500";
+		}, o = computed(() => a[n.state]), c = computed(() => {
+			if (n.disabled) return "cursor-not-allowed border-neutral-700 text-neutral-500";
 			{
 				let e = "cursor-pointer";
-				return r.activeResolved ? `${e} text-accent-400/80 bg-accent/20 border-accent-900/10` : `${e} text-accent-200 bg-accent/50 hover:bg-accent/90 border-accent hover:text-white hover:border-white`;
+				return n.activeResolved ? `${e} text-accent-400/80 bg-accent/20 border-accent-900/10` : `${e} text-accent-200 bg-accent/50 hover:bg-accent/90 border-accent hover:text-white hover:border-white`;
 			}
 		});
 		function u() {
-			r.disabled || i("click", r.state);
+			n.disabled || r("click", n.state);
 		}
 		return (t, n) => (openBlock(), createElementBlock("button", {
 			type: "button",
 			disabled: e.disabled,
-			class: normalizeClass(l.value),
+			class: normalizeClass(c.value),
 			style: {
 				display: "inline-flex",
 				alignItems: "center",
@@ -55,7 +55,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				textTransform: "uppercase"
 			},
 			onClick: u
-		}, [renderSlot(t.$slots, "icon", { state: e.state }), renderSlot(t.$slots, "label", { state: e.state }, () => [createTextVNode(toDisplayString(c.value), 1)])], 10, _hoisted_1$4));
+		}, [renderSlot(t.$slots, "icon", { state: e.state }), renderSlot(t.$slots, "label", { state: e.state }, () => [createTextVNode(toDisplayString(o.value), 1)])], 10, _hoisted_1$4));
 	}
 }), _hoisted_1$3 = {
 	class: "",
@@ -76,15 +76,15 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 		}
 	},
 	emits: ["setSidePanelMode", "closeSidePanel"],
-	setup(e, { emit: s }) {
-		let c = e, l = s, u = computed(() => c.sidePanelModeResolved !== "none"), d = computed(() => c.overlayOnly && c.sidePanelModeResolved === "full" ? c.availableStates.includes("minimized") ? ["minimized"] : [] : c.availableStates);
+	setup(e, { emit: t }) {
+		let r = e, l = t, u = computed(() => r.sidePanelModeResolved !== "none"), d = computed(() => r.overlayOnly && r.sidePanelModeResolved === "full" ? r.availableStates.includes("minimized") ? ["minimized"] : [] : r.availableStates);
 		function f(e) {
 			l("setSidePanelMode", e);
 		}
 		function p() {
 			l("closeSidePanel");
 		}
-		return (n, s) => u.value ? renderSlot(n.$slots, "default", {
+		return (t, r) => u.value ? renderSlot(t.$slots, "default", {
 			key: 0,
 			sidePanelMode: e.sidePanelMode,
 			sidePanelModeResolved: e.sidePanelModeResolved,
@@ -154,17 +154,17 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 		availableStates: { default: () => [] }
 	},
 	emits: ["setSidePanelMode", "closeSidePanel"],
-	setup(e, { emit: s }) {
-		let c = e, l = s, u = useSlots(), d = computed(() => c.sidePanelModeResolved !== "none"), p = computed(() => c.sidePanelModeResolved === "minimized"), m = computed(() => !!u.default), ee = computed(() => !!u.controls), h = computed(() => !p.value);
-		return (n, s) => d.value ? (openBlock(), createElementBlock("header", _hoisted_1$2, [createElementVNode("div", { style: normalizeStyle({
+	setup(e, { emit: t }) {
+		let r = e, l = t, u = useSlots(), d = computed(() => r.sidePanelModeResolved !== "none"), f = computed(() => r.sidePanelModeResolved === "minimized"), p = computed(() => !!u.default), m = computed(() => !!u.controls), h = computed(() => !f.value);
+		return (t, r) => d.value ? (openBlock(), createElementBlock("header", _hoisted_1$2, [createElementVNode("div", { style: normalizeStyle({
 			display: "flex",
-			flex: p.value && !m.value ? "1 1 auto" : "0 1 auto",
+			flex: f.value && !p.value ? "1 1 auto" : "0 1 auto",
 			minWidth: 0,
 			minHeight: 0,
 			alignItems: "center",
-			justifyContent: p.value && !m.value ? "center" : "flex-start",
+			justifyContent: f.value && !p.value ? "center" : "flex-start",
 			overflow: "hidden"
-		}) }, [m.value ? renderSlot(n.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [p.value ? (openBlock(), createElementBlock("button", {
+		}) }, [p.value ? renderSlot(t.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [f.value ? (openBlock(), createElementBlock("button", {
 			key: 0,
 			type: "button",
 			class: "text-accent-200 bg-accent/50 hover:bg-accent/90 border-accent hover:text-white hover:border-white",
@@ -183,15 +183,15 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				lineHeight: "1.2rem",
 				textTransform: "uppercase"
 			},
-			onClick: s[0] ||= (e) => l("setSidePanelMode", "auto")
-		}, toDisplayString(e.title), 1)) : e.showTitleLabel ? (openBlock(), createElementBlock("h2", _hoisted_2$1, toDisplayString(e.title) + ": ", 1)) : createCommentVNode("", !0)], 64))], 4), ee.value || h.value ? (openBlock(), createElementBlock("div", _hoisted_3$1, [renderSlot(n.$slots, "controls", {}, () => [h.value ? (openBlock(), createBlock(SidePanelButtonGroup_default, {
+			onClick: r[0] ||= (e) => l("setSidePanelMode", "auto")
+		}, toDisplayString(e.title), 1)) : e.showTitleLabel ? (openBlock(), createElementBlock("h2", _hoisted_2$1, toDisplayString(e.title) + ": ", 1)) : createCommentVNode("", !0)], 64))], 4), m.value || h.value ? (openBlock(), createElementBlock("div", _hoisted_3$1, [renderSlot(t.$slots, "controls", {}, () => [h.value ? (openBlock(), createBlock(SidePanelButtonGroup_default, {
 			key: 0,
 			"side-panel-mode": e.sidePanelMode,
 			"side-panel-mode-resolved": e.sidePanelModeResolved,
 			"available-states": e.availableStates,
 			"overlay-only": e.overlayOnly,
-			onSetSidePanelMode: s[1] ||= (e) => l("setSidePanelMode", e),
-			onCloseSidePanel: s[2] ||= (e) => l("closeSidePanel")
+			onSetSidePanelMode: r[1] ||= (e) => l("setSidePanelMode", e),
+			onCloseSidePanel: r[2] ||= (e) => l("closeSidePanel")
 		}, null, 8, [
 			"side-panel-mode",
 			"side-panel-mode-resolved",
@@ -248,7 +248,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 	},
 	emits: ["setSidePanelMode", "closeSidePanel"],
 	setup(e, { emit: t }) {
-		let r = e, s = t, l = computed(() => r.sidePanelModeResolved !== "none"), u = computed(() => r.sidePanelModeResolved === "minimized"), p = computed(() => {
+		let n = e, r = t, a = computed(() => n.sidePanelModeResolved !== "none"), l = computed(() => n.sidePanelModeResolved === "minimized"), d = computed(() => {
 			let e = {
 				width: "100%",
 				height: "100%",
@@ -256,27 +256,27 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				overflow: "hidden",
 				placeItems: "stretch"
 			};
-			return r.sidePanelModeResolved === "full" || r.sidePanelModeResolved === "right" || r.sidePanelModeResolved === "bottom" ? e : {
+			return n.sidePanelModeResolved === "full" || n.sidePanelModeResolved === "right" || n.sidePanelModeResolved === "bottom" ? e : {
 				...e,
 				placeItems: "end center"
 			};
-		}), m = computed(() => {
-			if (r.sidePanelModeResolved === "full") return {
+		}), f = computed(() => {
+			if (n.sidePanelModeResolved === "full") return {
 				width: "100%",
 				height: "100%"
 			};
-			if (r.sidePanelModeResolved === "right") return {
-				minWidth: r.minWidth,
-				maxWidth: r.maxWidth,
+			if (n.sidePanelModeResolved === "right") return {
+				minWidth: n.minWidth,
+				maxWidth: n.maxWidth,
 				width: "100%"
 			};
-			if (r.sidePanelModeResolved === "bottom") return {
-				minHeight: r.minHeight,
-				maxHeight: r.maxHeight,
+			if (n.sidePanelModeResolved === "bottom") return {
+				minHeight: n.minHeight,
+				maxHeight: n.maxHeight,
 				height: "100%",
 				width: "100%"
 			};
-		}), ee = computed(() => (r.sidePanelModeResolved === "full" && r.overlayOnly, {
+		}), m = computed(() => (n.sidePanelModeResolved === "full" && n.overlayOnly, {
 			maxWidth: "100%",
 			maxHeight: "100%",
 			minHeight: 0,
@@ -285,14 +285,14 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 		})), h = computed(() => ({
 			display: "grid",
 			gridTemplateColumns: "1fr",
-			gridTemplateRows: u.value ? "1.8rem" : "1.8rem minmax(0, 1fr)"
-		})), te = computed(() => r.overlayOnly ? "border-neutral-700 bg-black/95" : "");
-		return (t, n) => l.value ? (openBlock(), createElementBlock("div", _hoisted_1$1, [createElementVNode("div", { style: normalizeStyle(p.value) }, [createElementVNode("section", {
+			gridTemplateRows: l.value ? "1.8rem" : "1.8rem minmax(0, 1fr)"
+		})), g = computed(() => n.overlayOnly ? "border-neutral-700 bg-black/95" : "");
+		return (t, n) => a.value ? (openBlock(), createElementBlock("div", _hoisted_1$1, [createElementVNode("div", { style: normalizeStyle(d.value) }, [createElementVNode("section", {
 			"data-test": "side-panel-frame-shell",
-			class: normalizeClass(te.value),
+			class: normalizeClass(g.value),
 			style: normalizeStyle([
-				ee.value,
 				m.value,
+				f.value,
 				h.value
 			])
 		}, [createElementVNode("div", _hoisted_2, [createVNode(SidePanelHeader_default, {
@@ -301,15 +301,15 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			"side-panel-mode-resolved": e.sidePanelModeResolved,
 			"available-states": e.availableStates,
 			"overlay-only": e.overlayOnly,
-			onSetSidePanelMode: n[0] ||= (e) => s("setSidePanelMode", e),
-			onCloseSidePanel: n[1] ||= (e) => s("closeSidePanel")
+			onSetSidePanelMode: n[0] ||= (e) => r("setSidePanelMode", e),
+			onCloseSidePanel: n[1] ||= (e) => r("closeSidePanel")
 		}, null, 8, [
 			"show-title-label",
 			"side-panel-mode",
 			"side-panel-mode-resolved",
 			"available-states",
 			"overlay-only"
-		])]), withDirectives(createElementVNode("div", _hoisted_3, [renderSlot(t.$slots, "default")], 512), [[vShow, !u.value]])], 6)], 4)])) : createCommentVNode("", !0);
+		])]), withDirectives(createElementVNode("div", _hoisted_3, [renderSlot(t.$slots, "default")], 512), [[vShow, !l.value]])], 6)], 4)])) : createCommentVNode("", !0);
 	}
 }), _hoisted_1 = {
 	id: "header-outer",
@@ -349,36 +349,40 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 		"sidePanelAvailableStates",
 		"defaultSlotResize"
 	],
-	setup(e, { emit: t }) {
-		let l = e, d = t, h = useSlots(), g = ref(null), _ = ref(null), v = ref(null), y = ref(0), b = ref(0), x = ref(0), S = ref(0), C = ref(0);
-		function ne() {
-			let e = v.value;
+	setup(e, { emit: n }) {
+		let d = e, p = n, g = useSlots(), _ = ref(null), v = ref(null), y = ref(null), b = ref(0), x = ref(0), S = ref(0), C = ref(0), w = ref(0);
+		function ee() {
+			let e = y.value;
 			if (!e) return;
-			let t = Array.from(e.children), n = `${C.value}px`;
+			let t = Array.from(e.children), n = `${w.value}px`;
 			t.forEach((e) => {
 				e.style.height !== n && (e.style.height = n);
 			});
 		}
-		let w = ref("none"), T = ref("none"), E = ref([]), D = ref("none"), O = ref(!0), k = ref(!1), re = {
+		let T = ref("none"), E = ref("none"), D = ref([]), O = ref("none"), k = ref(!0), A = ref(!1), te = {
 			sm: 640,
 			md: 768,
 			lg: 1024,
 			xl: 1280,
 			"2xl": 1536
-		}, A = computed(() => !!h.sidePanelContent), j = computed(() => !!h.header), M = computed(() => E.value.filter((e) => e !== "auto")), N = computed(() => Math.max(0, b.value - x.value)), P = computed(() => y.value < G(l.controlsOverlayOnly)), ie = computed(() => y.value === 0 ? !1 : N.value / y.value > 1.1), ae = computed(() => T.value === "right" && D.value === "wide-right" ? l.sidePanelMaxRightWide : l.sidePanelMaxRight), oe = computed(() => ye(l.mainContentAspectRatio, 16 / 9)), se = computed(() => S.value > 0 ? S.value : Math.max(1, y.value)), ce = computed(() => se.value / oe.value + 20), le = computed(() => Math.max(1, y.value) / oe.value), ue = computed(() => K(l.sidePanelMinBottom, y.value, b.value)), de = computed(() => {
-			let e = le.value + ue.value;
-			return N.value >= e;
-		}), fe = computed(() => Math.max(0, N.value - ce.value)), pe = computed(() => {
-			if (T.value !== "bottom") return l.sidePanelMinBottom;
-			let e = K(l.sidePanelMinBottom, y.value, b.value), t = Math.min(e, F.value);
+		}, j = computed(() => {
+			if (!g.sidePanelContent) return !1;
+			let e = g.sidePanelContent();
+			return e.length > 0 && e.some((e) => !(e.type === Comment || Array.isArray(e.children) && e.children.length === 0 || e.type === Text && !String(e.children).trim()));
+		}), M = computed(() => !!g.header), N = computed(() => D.value.filter((e) => e !== "auto")), P = computed(() => Math.max(0, x.value - S.value)), F = computed(() => b.value < K(d.controlsOverlayOnly)), ne = computed(() => b.value === 0 ? !1 : P.value / b.value > 1.1), re = computed(() => E.value === "right" && O.value === "wide-right" ? d.sidePanelMaxRightWide : d.sidePanelMaxRight), ie = computed(() => _e(d.mainContentAspectRatio, 16 / 9)), ae = computed(() => C.value > 0 ? C.value : Math.max(1, b.value)), oe = computed(() => ae.value / ie.value + 20), se = computed(() => Math.max(1, b.value) / ie.value), ce = computed(() => q(d.sidePanelMinBottom, b.value, x.value)), le = computed(() => {
+			let e = se.value + ce.value;
+			return P.value >= e;
+		}), ue = computed(() => Math.max(0, P.value - oe.value)), de = computed(() => {
+			if (E.value !== "bottom") return d.sidePanelMinBottom;
+			let e = q(d.sidePanelMinBottom, b.value, x.value), t = Math.min(e, I.value);
 			return `${Math.max(0, Math.floor(t))}px`;
-		}), F = computed(() => {
-			let e = K(T.value === "bottom" && D.value === "tall-bottom" ? l.sidePanelMaxBottomTall : l.sidePanelMaxBottom, y.value, b.value);
-			return Math.max(0, Math.min(e, fe.value));
-		}), I = computed(() => T.value === "bottom" ? `${Math.max(0, Math.floor(F.value))}px` : l.sidePanelMaxBottom), me = computed(() => T.value === "right" || T.value === "bottom" ? {} : T.value === "full" && !P.value ? {
+		}), I = computed(() => {
+			let e = q(E.value === "bottom" && O.value === "tall-bottom" ? d.sidePanelMaxBottomTall : d.sidePanelMaxBottom, b.value, x.value);
+			return Math.max(0, Math.min(e, ue.value));
+		}), L = computed(() => E.value === "bottom" ? `${Math.max(0, Math.floor(I.value))}px` : d.sidePanelMaxBottom), fe = computed(() => E.value === "right" || E.value === "bottom" ? {} : E.value === "full" && !F.value ? {
 			opacity: 0,
 			pointerEvents: "none"
-		} : {}), L = computed(() => !A.value || P.value || T.value === "none" || T.value === "minimized" || T.value === "right" || T.value === "bottom" ? null : {
+		} : {}), R = computed(() => !j.value || F.value || E.value === "none" || E.value === "minimized" || E.value === "right" || E.value === "bottom" ? null : {
 			position: "absolute",
 			top: 0,
 			right: 0,
@@ -386,16 +390,16 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			left: 0,
 			zIndex: 10,
 			pointerEvents: "none"
-		}), R = computed(() => !A.value || T.value === "none" || T.value === "full" ? { gridTemplate: "1fr / 1fr" } : T.value === "right" ? {
+		}), z = computed(() => !j.value || E.value === "none" || E.value === "full" ? { gridTemplate: "1fr / 1fr" } : E.value === "right" ? {
 			gridTemplateRows: "1fr",
-			gridTemplateColumns: `minmax(0, 1fr) max(${l.sidePanelMinRight}, ${ae.value})`
-		} : T.value === "bottom" ? {
-			gridTemplateRows: `minmax(0, 1fr) ${I.value}`,
+			gridTemplateColumns: `minmax(0, 1fr) max(${d.sidePanelMinRight}, ${re.value})`
+		} : E.value === "bottom" ? {
+			gridTemplateRows: `minmax(0, 1fr) ${L.value}`,
 			gridTemplateColumns: "1fr"
-		} : T.value === "minimized" ? {
+		} : E.value === "minimized" ? {
 			gridTemplateRows: "1fr 34px",
 			gridTemplateColumns: "1fr"
-		} : { gridTemplate: "1fr / 1fr" }), he = computed(() => {
+		} : { gridTemplate: "1fr / 1fr" }), pe = computed(() => {
 			let e = {
 				minWidth: 0,
 				minHeight: 0,
@@ -404,13 +408,13 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				placeSelf: "stretch",
 				zIndex: 20
 			};
-			if (A.value) {
-				if (T.value === "right") return {
+			if (j.value) {
+				if (E.value === "right") return {
 					...e,
 					gridColumn: "2 / 3",
 					gridRow: "1 / 2"
 				};
-				if (T.value === "full") return {
+				if (E.value === "full") return {
 					...e,
 					gridColumn: "1 / 2",
 					gridRow: "1 / 2"
@@ -421,7 +425,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				gridColumn: "1 / 2",
 				gridRow: "2 / 3"
 			};
-		}), ge = computed(() => {
+		}), me = computed(() => {
 			let e = {
 				position: "fixed",
 				top: 0,
@@ -430,7 +434,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				left: 0,
 				overflow: "hidden"
 			};
-			return j.value ? {
+			return M.value ? {
 				...e,
 				display: "grid",
 				gridTemplateRows: "auto 1fr"
@@ -438,11 +442,11 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				...e,
 				display: "block"
 			};
-		}), _e = computed(() => j.value ? {
+		}), he = computed(() => M.value ? {
 			position: "relative",
 			zIndex: 0,
 			display: "grid",
-			...R.value,
+			...z.value,
 			gridRow: "2 / 3",
 			minWidth: 0,
 			minHeight: 0,
@@ -451,7 +455,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			position: "absolute",
 			zIndex: 0,
 			display: "grid",
-			...R.value,
+			...z.value,
 			minWidth: 0,
 			minHeight: 0,
 			overflow: "hidden",
@@ -459,9 +463,9 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			right: "0",
 			bottom: "0",
 			left: "0"
-		}), ve = computed(() => !P.value || O.value), z = null, B, V, H = null, U = "", W = !1;
-		function G(e) {
-			let t = re[e];
+		}), ge = computed(() => !F.value || k.value), B = null, V, H, U = null, W = "", G = !1;
+		function K(e) {
+			let t = te[e];
 			if (t !== void 0) return t;
 			if (e.endsWith("px")) {
 				let t = Number.parseFloat(e);
@@ -470,7 +474,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			let n = Number.parseFloat(e);
 			return Number.isFinite(n) ? n : 0;
 		}
-		function ye(e, t) {
+		function _e(e, t) {
 			if (typeof e == "number") return Number.isFinite(e) && e > 0 ? e : t;
 			let n = String(e).trim();
 			if (n.includes("/")) {
@@ -480,7 +484,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			let r = Number.parseFloat(n);
 			return Number.isFinite(r) && r > 0 ? r : t;
 		}
-		function K(e, t, n) {
+		function q(e, t, n) {
 			let r = e.trim();
 			if (r.endsWith("px")) {
 				let e = Number.parseFloat(r);
@@ -497,9 +501,9 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			let i = Number.parseFloat(r);
 			return Number.isFinite(i) ? i : 0;
 		}
-		function be() {
-			let e = Math.max(1, y.value), t = Math.max(1, N.value), n = e / t, r = e / t, i = G(l.sidePanelBreakpoint), a = de.value;
-			return n < l.autoBottomAspectRatioBreakpoint && a ? (D.value = "tall-bottom", {
+		function ve() {
+			let e = Math.max(1, b.value), t = Math.max(1, P.value), n = e / t, r = e / t, i = K(d.sidePanelBreakpoint), a = le.value;
+			return n < d.autoBottomAspectRatioBreakpoint && a ? (O.value = "tall-bottom", {
 				states: [
 					"auto",
 					"full",
@@ -507,7 +511,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 					"minimized"
 				],
 				resolved: "bottom"
-			}) : r > l.autoRightAspectRatioBreakpoint ? (D.value = "wide-right", {
+			}) : r > d.autoRightAspectRatioBreakpoint ? (O.value = "wide-right", {
 				states: [
 					"auto",
 					"full",
@@ -515,7 +519,7 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 					"minimized"
 				],
 				resolved: "right"
-			}) : (D.value = "mixed", e >= i ? {
+			}) : (O.value = "mixed", e >= i ? {
 				states: a ? [
 					"auto",
 					"full",
@@ -538,74 +542,74 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				resolved: "full"
 			});
 		}
-		function xe(e, t, n) {
-			e === t || t === "none" || !A.value || d("sidePanelTransition", {
+		function ye(e, t, n) {
+			e === t || t === "none" || !j.value || p("sidePanelTransition", {
 				from: e,
 				to: t,
 				reason: n
 			});
 		}
-		function q(e = !1) {
+		function J(e = !1) {
 			let t = {
-				availableStates: A.value ? [...M.value] : [],
-				sidePanelMode: A.value ? w.value : "none",
-				sidePanelModeResolved: A.value ? T.value : "none",
-				overlayOnly: P.value
+				availableStates: j.value ? [...N.value] : [],
+				sidePanelMode: j.value ? T.value : "none",
+				sidePanelModeResolved: j.value ? E.value : "none",
+				overlayOnly: F.value
 			};
-			if (!A.value) {
-				if (W) return;
-				W = !0, d("sidePanelAvailableStates", t);
+			if (!j.value) {
+				if (G) return;
+				G = !0, p("sidePanelAvailableStates", t);
 				return;
 			}
-			W = !1;
+			G = !1;
 			let n = JSON.stringify(t);
-			!e && n === U || (U = n, d("sidePanelAvailableStates", t));
+			!e && n === W || (W = n, p("sidePanelAvailableStates", t));
 		}
-		function J(e) {
-			let t = T.value;
-			if (!A.value) {
-				w.value = "none", T.value = "none", E.value = [], q();
+		function be(e) {
+			let t = E.value;
+			if (!j.value) {
+				T.value = "none", E.value = "none", D.value = [], J();
 				return;
 			}
-			let n = be();
-			E.value = n.states;
-			let r = w.value === "none" ? "auto" : w.value;
-			r !== "auto" && !E.value.includes(r) ? (w.value = "auto", d("update:sidePanelPosition", "auto")) : w.value = r, T.value = w.value === "auto" ? n.resolved : w.value, xe(t, T.value, e), q(k.value === !1);
+			let n = ve();
+			D.value = n.states;
+			let r = T.value === "none" ? "auto" : T.value;
+			r !== "auto" && !D.value.includes(r) ? (T.value = "auto", p("update:sidePanelPosition", "auto")) : T.value = r, E.value = T.value === "auto" ? n.resolved : T.value, ye(t, E.value, e), J(A.value === !1);
 		}
 		function Y(e, t = !1) {
-			if (B &&= (clearTimeout(B), void 0), t || !k.value) {
-				J(e);
+			if (V &&= (clearTimeout(V), void 0), t || !A.value) {
+				be(e);
 				return;
 			}
-			B = setTimeout(() => {
-				J(e);
-			}, l.layoutDebounceMs);
+			V = setTimeout(() => {
+				be(e);
+			}, d.layoutDebounceMs);
 		}
-		function Se(e) {
-			if (!A.value) return;
-			let t = E.value.includes(e) ? e : "auto";
-			t !== w.value && (w.value = t, d("update:sidePanelPosition", t)), Y("set-side-panel-mode", !0);
+		function xe(e) {
+			if (!j.value) return;
+			let t = D.value.includes(e) ? e : "auto";
+			t !== T.value && (T.value = t, p("update:sidePanelPosition", t)), Y("set-side-panel-mode", !0);
 		}
-		function Ce() {
-			!A.value || !P.value || Se("minimized");
+		function Se() {
+			!j.value || !F.value || xe("minimized");
 		}
 		function X() {
-			V &&= (clearTimeout(V), void 0);
+			H &&= (clearTimeout(H), void 0);
 		}
 		function Z() {
-			if (X(), !P.value || ie.value || T.value === "none") {
-				O.value = !0;
+			if (X(), !F.value || ne.value || E.value === "none") {
+				k.value = !0;
 				return;
 			}
-			V = setTimeout(() => {
-				O.value = !1;
-			}, l.autoHideTimeout);
+			H = setTimeout(() => {
+				k.value = !1;
+			}, d.autoHideTimeout);
 		}
 		function Q() {
-			O.value = !0, Z();
+			k.value = !0, Z();
 		}
-		function we() {
-			if (!g.value) return;
+		function Ce() {
+			if (!_.value) return;
 			let e = [
 				"mousemove",
 				"click",
@@ -615,67 +619,67 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			], t = () => {
 				Q();
 			};
-			for (let n of e) g.value.addEventListener(n, t, { passive: !0 });
-			H = () => {
-				if (g.value) for (let n of e) g.value.removeEventListener(n, t);
+			for (let n of e) _.value.addEventListener(n, t, { passive: !0 });
+			U = () => {
+				if (_.value) for (let n of e) _.value.removeEventListener(n, t);
 			};
 		}
 		function $() {
-			y.value = window.innerWidth, b.value = window.innerHeight, Y("viewport-resize");
+			b.value = window.innerWidth, x.value = window.innerHeight, Y("viewport-resize");
 		}
-		return watch(() => l.sidePanelPosition, (e) => {
-			if (!A.value) {
-				w.value = "none";
+		return watch(() => d.sidePanelPosition, (e) => {
+			if (!j.value) {
+				T.value = "none";
 				return;
 			}
-			w.value = e, Y("prop-sync");
-		}, { immediate: !0 }), watch(A, (e) => {
+			T.value = e, Y("prop-sync");
+		}, { immediate: !0 }), watch(j, (e) => {
 			if (!e) {
-				w.value = "none", T.value = "none", E.value = [], q();
+				T.value = "none", E.value = "none", D.value = [], J();
 				return;
 			}
-			w.value = l.sidePanelPosition, Y("slot-state-change", !0);
+			T.value = d.sidePanelPosition, Y("slot-state-change", !0);
 		}, { immediate: !0 }), watch(() => [
-			P.value,
-			l.autoHideTimeout,
-			T.value
+			F.value,
+			d.autoHideTimeout,
+			E.value
 		], () => {
-			if (T.value === "full") {
+			if (E.value === "full") {
 				Z();
 				return;
 			}
 			Q();
-		}), watch(ie, (e, t) => {
+		}), watch(ne, (e, t) => {
 			if (e) {
-				O.value = !0, X();
+				k.value = !0, X();
 				return;
 			}
 			t && Q();
 		}), watch(() => [
-			S.value,
 			C.value,
-			T.value,
-			A.value
+			w.value,
+			E.value,
+			j.value
 		], () => {
-			!A.value || T.value === "none" || d("defaultSlotResize", {
-				width: S.value,
-				height: C.value
+			!j.value || E.value === "none" || p("defaultSlotResize", {
+				width: C.value,
+				height: w.value
 			});
 		}), onMounted(async () => {
-			k.value = !0, $(), window.addEventListener("resize", $), we(), Q(), await nextTick(), z = new ResizeObserver(() => {
-				x.value = _.value?.offsetHeight ?? 0, S.value = v.value?.offsetWidth ?? 0, C.value = v.value?.offsetHeight ?? 0, ne(), Y("slot-measure");
-			}), _.value && z.observe(_.value), v.value && (z.observe(v.value), S.value = v.value.offsetWidth, C.value = v.value.offsetHeight), x.value = _.value?.offsetHeight ?? 0, Y("mounted", !0);
+			A.value = !0, $(), window.addEventListener("resize", $), Ce(), Q(), await nextTick(), B = new ResizeObserver(() => {
+				S.value = v.value?.offsetHeight ?? 0, C.value = y.value?.offsetWidth ?? 0, w.value = y.value?.offsetHeight ?? 0, ee(), Y("slot-measure");
+			}), v.value && B.observe(v.value), y.value && (B.observe(y.value), C.value = y.value.offsetWidth, w.value = y.value.offsetHeight), S.value = v.value?.offsetHeight ?? 0, Y("mounted", !0);
 		}), onBeforeUnmount(() => {
-			window.removeEventListener("resize", $), H?.(), H = null, z?.disconnect(), z = null, X(), B &&= (clearTimeout(B), void 0);
+			window.removeEventListener("resize", $), U?.(), U = null, B?.disconnect(), B = null, X(), V &&= (clearTimeout(V), void 0);
 		}), (t, n) => (openBlock(), createElementBlock("section", {
 			ref_key: "rootRef",
-			ref: g,
+			ref: _,
 			class: "bg-black text-neutral-100",
-			style: normalizeStyle({ ...ge.value })
-		}, [j.value ? withDirectives((openBlock(), createElementBlock("header", {
+			style: normalizeStyle({ ...me.value })
+		}, [M.value ? withDirectives((openBlock(), createElementBlock("header", {
 			key: 0,
 			ref_key: "headerRef",
-			ref: _,
+			ref: v,
 			class: "",
 			style: {
 				position: "relative",
@@ -684,15 +688,15 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 				zIndex: 40
 			}
 		}, [(openBlock(), createBlock(resolveDynamicComponent("style"), null, {
-			default: withCtx(() => [createTextVNode(" #header-outer { display: none; } @media (min-width: " + toDisplayString(l.headerHideWidthThreshold) + ") and (min-height: " + toDisplayString(l.headerHideHeightThreshold) + ") { #header-outer { display: block; } } ", 1)]),
+			default: withCtx(() => [createTextVNode(" #header-outer { display: none; } @media (min-width: " + toDisplayString(d.headerHideWidthThreshold) + ") and (min-height: " + toDisplayString(d.headerHideHeightThreshold) + ") { #header-outer { display: block; } } ", 1)]),
 			_: 1
-		})), createElementVNode("div", _hoisted_1, [renderSlot(t.$slots, "header")])], 512)), [[vShow, ve.value]]) : createCommentVNode("", !0), createElementVNode("article", {
+		})), createElementVNode("div", _hoisted_1, [renderSlot(t.$slots, "header")])], 512)), [[vShow, ge.value]]) : createCommentVNode("", !0), createElementVNode("article", {
 			class: "",
-			style: normalizeStyle({ ..._e.value })
+			style: normalizeStyle({ ...he.value })
 		}, [
 			createElementVNode("main", {
 				ref_key: "defaultRef",
-				ref: v,
+				ref: y,
 				class: "slot-content-container",
 				style: normalizeStyle({
 					position: "relative",
@@ -706,33 +710,33 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 					gridColumn: "1 / 2",
 					gridRow: "1 / 2",
 					zIndex: 0,
-					...me.value
+					...fe.value
 				})
 			}, [renderSlot(t.$slots, "default")], 4),
-			L.value ? (openBlock(), createElementBlock("div", {
+			R.value ? (openBlock(), createElementBlock("div", {
 				key: 0,
 				class: "bg-black",
 				style: normalizeStyle({
-					...L.value,
+					...R.value,
 					gridColumn: "1 / 2",
 					gridRow: "1 / 2"
 				})
 			}, null, 4)) : createCommentVNode("", !0),
-			t.$slots.sidePanelContent && T.value !== "none" ? (openBlock(), createElementBlock("div", {
+			j.value && E.value !== "none" ? (openBlock(), createElementBlock("div", {
 				key: 1,
 				class: "",
-				style: normalizeStyle(he.value)
+				style: normalizeStyle(pe.value)
 			}, [createVNode(SidePanelFrame_default, {
-				"side-panel-mode": w.value,
-				"side-panel-mode-resolved": T.value,
-				"available-states": M.value,
-				"overlay-only": P.value,
+				"side-panel-mode": T.value,
+				"side-panel-mode-resolved": E.value,
+				"available-states": N.value,
+				"overlay-only": F.value,
 				"min-width": e.sidePanelMinRight,
-				"max-width": ae.value,
-				"min-height": pe.value,
-				"max-height": I.value,
-				onSetSidePanelMode: Se,
-				onCloseSidePanel: Ce
+				"max-width": re.value,
+				"min-height": de.value,
+				"max-height": L.value,
+				onSetSidePanelMode: xe,
+				onCloseSidePanel: Se
 			}, {
 				default: withCtx(() => [renderSlot(t.$slots, "sidePanelContent")]),
 				_: 3
@@ -748,16 +752,46 @@ var _hoisted_1$4 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ *
 			])], 4)) : createCommentVNode("", !0)
 		], 4)], 4));
 	}
-}), [["__scopeId", "data-v-1dc710d8"]]), LoggedInOut_default = /* @__PURE__ */ defineComponent({
+}), [["__scopeId", "data-v-d0d55234"]]), LoggedInOut_default = /* @__PURE__ */ defineComponent({
 	__name: "LoggedInOut",
+	props: {
+		initiallyLoggedIn: { type: Boolean },
+		addWindowAccess: {
+			type: Boolean,
+			default: !1
+		},
+		windowAccessObjectName: { default: "loggedInOut" }
+	},
 	setup(t, { expose: n }) {
-		let { loggedIn: r, setToLoggedIn: i, setToLoggedOut: a, toggleLoggedIn: o } = useSimpleLoggedIn();
-		return n({
-			loggedIn: r,
-			setToLoggedIn: i,
-			setToLoggedOut: a,
-			toggleLoggedIn: o
-		}), (e, t) => unref(r) ? renderSlot(e.$slots, "loggedIn", { key: 0 }) : renderSlot(e.$slots, "loggedOut", { key: 1 });
+		let r = t, { loggedIn: i, setToLoggedIn: a, setToLoggedOut: o, toggleLoggedIn: s } = useSimpleLoggedIn(r.initiallyLoggedIn), c = () => i.value, l = (e) => {
+			i.value = e;
+		}, u = () => {
+			r.addWindowAccess && typeof window < "u" && (window[r.windowAccessObjectName] = {
+				setToLoggedIn: a,
+				setToLoggedOut: o,
+				toggleLoggedIn: s,
+				getLoggedIn: c,
+				setLoggedIn: l
+			});
+		}, d = (e = r.windowAccessObjectName) => {
+			typeof window < "u" && window[e] && delete window[e];
+		};
+		return onMounted(() => {
+			u();
+		}), onUnmounted(() => {
+			d();
+		}), watch(() => r.addWindowAccess, (e) => {
+			e ? u() : d();
+		}), watch(() => r.windowAccessObjectName, (e, t) => {
+			r.addWindowAccess && (d(t), u());
+		}), n({
+			loggedIn: i,
+			setToLoggedIn: a,
+			setToLoggedOut: o,
+			toggleLoggedIn: s,
+			getLoggedIn: c,
+			setLoggedIn: l
+		}), (e, t) => unref(i) ? renderSlot(e.$slots, "loggedIn", { key: 0 }) : renderSlot(e.$slots, "loggedOut", { key: 1 });
 	}
 });
 export { SidePanelButtonGroup_default as a, SidePanelHeader_default as i, LiveFrame_default as n, SidePanelControlButton_default as o, SidePanelFrame_default as r, LoggedInOut_default as t };