@mtngtools/frame-vue 0.0.25-experimental.0 → 0.0.27-experimental.0

package/dist/FetchCard-IAJlHt45.js

@@ -0,0 +1,1542 @@
+import { i as IconPanelRight_default, n as IconPanelFull_default, r as IconPanelBottom_default, t as IconClose_default } from "./IconClose-B7WnTow-.js";
+import { n as useSimpleLoggedIn } from "./useSimpleLoggedIn-DT4aMAWu.js";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, getCurrentInstance, getCurrentScope, isRef, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onMounted, onScopeDispose, onUnmounted, openBlock, readonly, ref, renderList, renderSlot, resolveDynamicComponent, shallowReadonly, shallowRef, toDisplayString, toRaw, toValue, unref, useSlots, vModelCheckbox, vShow, watch, withCtx, withDirectives, withModifiers } from "vue";
+function tryOnScopeDispose(e, t) {
+	return getCurrentScope() ? (onScopeDispose(e, t), !0) : !1;
+}
+var isClient = typeof window < "u" && typeof document < "u";
+typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
+var toString = Object.prototype.toString, isObject = (e) => toString.call(e) === "[object Object]";
+function createSingletonPromise(e) {
+	let t;
+	function n() {
+		return t ||= e(), t;
+	}
+	return n.reset = async () => {
+		let e = t;
+		t = void 0, e && await e;
+	}, n;
+}
+function toArray(e) {
+	return Array.isArray(e) ? e : [e];
+}
+function useIntervalFn(e, t = 1e3, n = {}) {
+	let { immediate: r = !0, immediateCallback: i = !1 } = n, a = null, o = shallowRef(!1);
+	function s() {
+		a &&= (clearInterval(a), null);
+	}
+	function c() {
+		o.value = !1, s();
+	}
+	function l() {
+		let n = toValue(t);
+		n <= 0 || (o.value = !0, i && e(), s(), o.value && (a = setInterval(e, n)));
+	}
+	return r && isClient && l(), (isRef(t) || typeof t == "function") && tryOnScopeDispose(watch(t, () => {
+		o.value && isClient && l();
+	})), tryOnScopeDispose(c), {
+		isActive: shallowReadonly(o),
+		pause: c,
+		resume: l
+	};
+}
+function useTimeoutFn(e, t, n = {}) {
+	let { immediate: r = !0, immediateCallback: i = !1 } = n, a = shallowRef(!1), o;
+	function s() {
+		o &&= (clearTimeout(o), void 0);
+	}
+	function c() {
+		a.value = !1, s();
+	}
+	function l(...n) {
+		i && e(), s(), a.value = !0, o = setTimeout(() => {
+			a.value = !1, o = void 0, e(...n);
+		}, toValue(t));
+	}
+	return r && (a.value = !0, isClient && l()), tryOnScopeDispose(c), {
+		isPending: shallowReadonly(a),
+		start: l,
+		stop: c
+	};
+}
+function watchImmediate(e, t, n) {
+	return watch(e, t, {
+		...n,
+		immediate: !0
+	});
+}
+var defaultWindow = isClient ? window : void 0;
+isClient && window.document;
+var defaultNavigator = isClient ? window.navigator : void 0;
+isClient && window.location;
+function unrefElement(e) {
+	let t = toValue(e);
+	return t?.$el ?? t;
+}
+function useEventListener(...e) {
+	let t = (e, t, n, r) => (e.addEventListener(t, n, r), () => e.removeEventListener(t, n, r)), n = computed(() => {
+		let t = toArray(toValue(e[0])).filter((e) => e != null);
+		return t.every((e) => typeof e != "string") ? t : void 0;
+	});
+	return watchImmediate(() => [
+		n.value?.map((e) => unrefElement(e)) ?? [defaultWindow].filter((e) => e != null),
+		toArray(toValue(n.value ? e[1] : e[0])),
+		toArray(unref(n.value ? e[2] : e[1])),
+		toValue(n.value ? e[3] : e[2])
+	], ([e, n, r, i], a, o) => {
+		if (!e?.length || !n?.length || !r?.length) return;
+		let s = isObject(i) ? { ...i } : i, c = e.flatMap((e) => n.flatMap((n) => r.map((r) => t(e, n, r, s))));
+		o(() => {
+			c.forEach((e) => e());
+		});
+	}, { flush: "post" });
+}
+function useMounted() {
+	let e = shallowRef(!1), t = getCurrentInstance();
+	return t && onMounted(() => {
+		e.value = !0;
+	}, t), e;
+}
+/* @__NO_SIDE_EFFECTS__ */
+function useSupported(e) {
+	let t = useMounted();
+	return computed(() => (t.value, !!e()));
+}
+function usePermission(e, t = {}) {
+	let { controls: n = !1, navigator: r = defaultNavigator } = t, i = /* @__PURE__ */ useSupported(() => r && "permissions" in r), a = shallowRef(), o = typeof e == "string" ? { name: e } : e, s = shallowRef(), c = () => {
+		s.value = a.value?.state ?? "prompt";
+	};
+	useEventListener(a, "change", c, { passive: !0 });
+	let l = createSingletonPromise(async () => {
+		if (i.value) {
+			if (!a.value) try {
+				a.value = await r.permissions.query(o);
+			} catch {
+				a.value = void 0;
+			} finally {
+				c();
+			}
+			if (n) return toRaw(a.value);
+		}
+	});
+	return l(), n ? {
+		state: s,
+		isSupported: i,
+		query: l
+	} : s;
+}
+function useClipboard(e = {}) {
+	let { navigator: t = defaultNavigator, read: n = !1, source: r, copiedDuring: i = 1500, legacy: a = !1 } = e, s = /* @__PURE__ */ useSupported(() => t && "clipboard" in t), c = usePermission("clipboard-read"), l = usePermission("clipboard-write"), u = computed(() => s.value || a), d = shallowRef(""), f = shallowRef(!1), p = useTimeoutFn(() => f.value = !1, i, { immediate: !1 });
+	async function m() {
+		let e = !(s.value && v(c.value));
+		if (!e) try {
+			d.value = await t.clipboard.readText();
+		} catch {
+			e = !0;
+		}
+		e && (d.value = _());
+	}
+	u.value && n && useEventListener(["copy", "cut"], m, { passive: !0 });
+	async function h(e = toValue(r)) {
+		if (u.value && e != null) {
+			let n = !(s.value && v(l.value));
+			if (!n) try {
+				await t.clipboard.writeText(e);
+			} catch {
+				n = !0;
+			}
+			n && g(e), d.value = e, f.value = !0, p.start();
+		}
+	}
+	function g(e) {
+		let t = document.createElement("textarea");
+		t.value = e, t.style.position = "absolute", t.style.opacity = "0", t.setAttribute("readonly", ""), document.body.appendChild(t), t.select(), document.execCommand("copy"), t.remove();
+	}
+	function _() {
+		var e, t;
+		return ((e = document) == null || (t = e.getSelection) == null || (t = t.call(e)) == null ? void 0 : t.toString()) ?? "";
+	}
+	function v(e) {
+		return e === "granted" || e === "prompt";
+	}
+	return {
+		isSupported: u,
+		text: readonly(d),
+		copied: readonly(f),
+		copy: h
+	};
+}
+var _hoisted_1$5 = ["disabled"], SidePanelControlButton_default = /* @__PURE__ */ defineComponent({
+	__name: "SidePanelControlButton",
+	props: {
+		state: {},
+		active: {
+			type: Boolean,
+			default: !1
+		},
+		activeResolved: {
+			type: Boolean,
+			default: !1
+		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		hideIcon: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["click"],
+	setup(i, { emit: a }) {
+		let u = i, f = a, p = {
+			auto: "Auto",
+			right: "Right",
+			bottom: "Bottom",
+			full: "Full",
+			minimized: "Close"
+		}, m = {
+			auto: null,
+			right: IconPanelRight_default,
+			bottom: IconPanelBottom_default,
+			full: IconPanelFull_default,
+			minimized: IconClose_default
+		}, h = computed(() => p[u.state]), g = computed(() => {
+			if (u.disabled) return "cursor-not-allowed border-neutral-700 text-neutral-500";
+			{
+				let e = "cursor-pointer";
+				return u.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.disabled || f("click", u.state);
+		}
+		return (e, t) => (openBlock(), createElementBlock("button", {
+			type: "button",
+			disabled: i.disabled,
+			class: normalizeClass(g.value),
+			style: {
+				display: "inline-flex",
+				alignItems: "center",
+				gap: "0.25rem",
+				borderRadius: "0.375rem",
+				borderWidth: "1px",
+				borderStyle: "solid",
+				paddingLeft: "0.375rem",
+				paddingRight: "0.375rem",
+				paddingTop: "0.125rem",
+				paddingBottom: "0.125rem",
+				fontSize: "0.70rem",
+				lineHeight: "1.2rem",
+				textTransform: "uppercase"
+			},
+			onClick: _
+		}, [renderSlot(e.$slots, "icon", { state: i.state }, () => [!i.hideIcon && m[i.state] ? (openBlock(), createBlock(resolveDynamicComponent(m[i.state]), {
+			key: 0,
+			style: {
+				width: ".85em",
+				height: ".85em"
+			}
+		})) : createCommentVNode("", !0)]), renderSlot(e.$slots, "label", { state: i.state }, () => [createTextVNode(toDisplayString(h.value), 1)])], 10, _hoisted_1$5));
+	}
+}), _hoisted_1$4 = {
+	class: "",
+	style: {
+		display: "flex",
+		alignItems: "center",
+		gap: "0.5rem"
+	}
+}, SidePanelButtonGroup_default = /* @__PURE__ */ defineComponent({
+	__name: "SidePanelButtonGroup",
+	props: {
+		sidePanelMode: { default: "none" },
+		sidePanelModeResolved: { default: "none" },
+		availableStates: { default: () => [] },
+		overlayOnly: {
+			type: Boolean,
+			default: !1
+		},
+		hideIcons: {
+			type: Boolean,
+			default: !1
+		}
+	},
+	emits: ["setSidePanelMode", "closeSidePanel"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = computed(() => n.sidePanelModeResolved !== "none"), d = computed(() => n.overlayOnly && n.sidePanelModeResolved === "full" ? n.availableStates.includes("minimized") ? ["minimized"] : [] : n.availableStates);
+		function f(e) {
+			r("setSidePanelMode", e);
+		}
+		function p() {
+			r("closeSidePanel");
+		}
+		return (t, n) => i.value ? renderSlot(t.$slots, "default", {
+			key: 0,
+			sidePanelMode: e.sidePanelMode,
+			sidePanelModeResolved: e.sidePanelModeResolved,
+			availableStates: e.availableStates,
+			overlayOnly: e.overlayOnly,
+			setSidePanelMode: f,
+			closeSidePanel: p
+		}, () => [createElementVNode("div", _hoisted_1$4, [(openBlock(!0), createElementBlock(Fragment, null, renderList(d.value, (t) => (openBlock(), createBlock(SidePanelControlButton_default, {
+			key: t,
+			state: t,
+			active: t === e.sidePanelMode,
+			"active-resolved": t === e.sidePanelModeResolved,
+			"hide-icon": e.hideIcons,
+			onClick: f
+		}, null, 8, [
+			"state",
+			"active",
+			"active-resolved",
+			"hide-icon"
+		]))), 128))])]) : createCommentVNode("", !0);
+	}
+}), _hoisted_1$3 = {
+	key: 0,
+	class: "",
+	style: {
+		display: "flex",
+		height: "100%",
+		minHeight: 0,
+		minWidth: 0,
+		alignItems: "center",
+		justifyContent: "space-between",
+		gap: "0.5rem",
+		overflow: "hidden",
+		padding: "0.5rem 0.5rem"
+	}
+}, _hoisted_2$2 = {
+	key: 1,
+	class: "text-sm font-medium text-neutral-100",
+	style: {
+		minWidth: 0,
+		minHeight: 0,
+		margin: 0,
+		textAlign: "left"
+	}
+}, _hoisted_3$2 = {
+	key: 0,
+	style: {
+		display: "flex",
+		alignItems: "center",
+		justifyContent: "flex-end",
+		minWidth: 0,
+		minHeight: 0,
+		marginLeft: "auto"
+	}
+}, SidePanelHeader_default = /* @__PURE__ */ defineComponent({
+	__name: "SidePanelHeader",
+	props: {
+		title: { default: "Submit Questions" },
+		showTitleLabel: {
+			type: Boolean,
+			default: !0
+		},
+		sidePanelMode: { default: "none" },
+		sidePanelModeResolved: { default: "none" },
+		overlayOnly: {
+			type: Boolean,
+			default: !1
+		},
+		availableStates: { default: () => [] }
+	},
+	emits: ["setSidePanelMode", "closeSidePanel"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = useSlots(), d = computed(() => n.sidePanelModeResolved !== "none"), f = computed(() => n.sidePanelModeResolved === "minimized"), p = computed(() => !!i.default), m = computed(() => !!i.controls), h = computed(() => !f.value);
+		return (t, n) => d.value ? (openBlock(), createElementBlock("header", _hoisted_1$3, [createElementVNode("div", { style: normalizeStyle({
+			display: "flex",
+			flex: f.value && !p.value ? "1 1 auto" : "0 1 auto",
+			minWidth: 0,
+			minHeight: 0,
+			alignItems: "center",
+			justifyContent: f.value && !p.value ? "center" : "flex-start",
+			overflow: "hidden"
+		}) }, [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",
+			style: {
+				display: "inline-flex",
+				alignItems: "center",
+				gap: "0.25rem",
+				borderRadius: "0.375rem 0.375rem 0 0",
+				borderWidth: "1px",
+				borderStyle: "solid",
+				paddingLeft: "0.375rem",
+				paddingRight: "0.375rem",
+				paddingTop: "0.125rem",
+				paddingBottom: "0.125rem",
+				fontSize: "0.70rem",
+				lineHeight: "1.2rem",
+				textTransform: "uppercase"
+			},
+			onClick: n[0] ||= (e) => r("setSidePanelMode", "auto")
+		}, toDisplayString(e.title), 1)) : e.showTitleLabel ? (openBlock(), createElementBlock("h2", _hoisted_2$2, toDisplayString(e.title) + ": ", 1)) : createCommentVNode("", !0)], 64))], 4), m.value || h.value ? (openBlock(), createElementBlock("div", _hoisted_3$2, [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: n[1] ||= (e) => r("setSidePanelMode", e),
+			onCloseSidePanel: n[2] ||= (e) => r("closeSidePanel")
+		}, null, 8, [
+			"side-panel-mode",
+			"side-panel-mode-resolved",
+			"available-states",
+			"overlay-only"
+		])) : createCommentVNode("", !0)])])) : createCommentVNode("", !0)])) : createCommentVNode("", !0);
+	}
+}), _hoisted_1$2 = {
+	key: 0,
+	class: "",
+	style: {
+		width: "100%",
+		height: "100%"
+	}
+}, _hoisted_2$1 = {
+	class: "",
+	style: {
+		gridColumn: "1 / 2",
+		gridRow: "1 / 2",
+		minWidth: 0,
+		minHeight: 0,
+		overflow: "hidden"
+	}
+}, _hoisted_3$1 = {
+	class: "",
+	style: {
+		gridColumn: "1 / 2",
+		gridRow: "2 / 3",
+		minWidth: 0,
+		minHeight: 0,
+		width: "100%",
+		height: "100%",
+		display: "grid",
+		placeContent: "stretch"
+	}
+}, SidePanelFrame_default = /* @__PURE__ */ defineComponent({
+	__name: "SidePanelFrame",
+	props: {
+		sidePanelMode: { default: "none" },
+		sidePanelModeResolved: { default: "none" },
+		availableStates: { default: () => [] },
+		overlayOnly: {
+			type: Boolean,
+			default: !1
+		},
+		showTitleLabel: {
+			type: Boolean,
+			default: !1
+		},
+		hideIcons: {
+			type: Boolean,
+			default: !1
+		},
+		minWidth: { default: "320px" },
+		maxWidth: { default: "30vw" },
+		minHeight: { default: "200px" },
+		maxHeight: { default: "30vh" }
+	},
+	emits: ["setSidePanelMode", "closeSidePanel"],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = computed(() => n.sidePanelModeResolved !== "none"), a = computed(() => n.sidePanelModeResolved === "minimized"), s = computed(() => {
+			let e = {
+				width: "100%",
+				height: "100%",
+				display: "grid",
+				overflow: "hidden",
+				placeItems: "stretch"
+			};
+			return n.sidePanelModeResolved === "full" || n.sidePanelModeResolved === "right" || n.sidePanelModeResolved === "bottom" ? e : {
+				...e,
+				placeItems: "end center"
+			};
+		}), d = computed(() => {
+			if (n.sidePanelModeResolved === "full") return {
+				width: "100%",
+				height: "100%"
+			};
+			if (n.sidePanelModeResolved === "right") return {
+				minWidth: n.minWidth,
+				maxWidth: n.maxWidth,
+				width: "100%"
+			};
+			if (n.sidePanelModeResolved === "bottom") return {
+				minHeight: n.minHeight,
+				maxHeight: n.maxHeight,
+				height: "100%",
+				width: "100%"
+			};
+		}), p = computed(() => (n.sidePanelModeResolved === "full" && n.overlayOnly, {
+			maxWidth: "100%",
+			maxHeight: "100%",
+			minHeight: 0,
+			minWidth: 0,
+			overflow: "hidden"
+		})), m = computed(() => ({
+			display: "grid",
+			gridTemplateColumns: "1fr",
+			gridTemplateRows: a.value ? "max-content" : "max-content minmax(0, 1fr)"
+		})), h = computed(() => n.overlayOnly ? "border-neutral-700 bg-black/95" : "");
+		return (t, n) => i.value ? (openBlock(), createElementBlock("div", _hoisted_1$2, [createElementVNode("div", { style: normalizeStyle(s.value) }, [createElementVNode("section", {
+			"data-test": "side-panel-frame-shell",
+			class: normalizeClass(h.value),
+			style: normalizeStyle([
+				p.value,
+				d.value,
+				m.value
+			])
+		}, [createElementVNode("div", _hoisted_2$1, [createVNode(SidePanelHeader_default, {
+			"show-title-label": e.showTitleLabel,
+			"side-panel-mode": e.sidePanelMode,
+			"side-panel-mode-resolved": e.sidePanelModeResolved,
+			"available-states": e.availableStates,
+			"overlay-only": e.overlayOnly,
+			"hide-icons": e.hideIcons,
+			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",
+			"hide-icons"
+		])]), withDirectives(createElementVNode("div", _hoisted_3$1, [renderSlot(t.$slots, "default")], 512), [[vShow, !a.value]])], 6)], 4)])) : createCommentVNode("", !0);
+	}
+}), _hoisted_1$1 = {
+	id: "header-outer",
+	style: {
+		position: "relative",
+		width: "100%",
+		margin: 0,
+		padding: 0
+	}
+}, LiveFrame_default = /* @__PURE__ */ ((e, t) => {
+	let n = e.__vccOpts || e;
+	for (let [e, r] of t) n[e] = r;
+	return n;
+})(/* @__PURE__ */ defineComponent({
+	__name: "LiveFrame",
+	props: {
+		sidePanelPosition: { default: "minimized" },
+		mainContentAspectRatio: { default: "16/9" },
+		autoBottomAspectRatioBreakpoint: { default: .9 },
+		autoRightAspectRatioBreakpoint: { default: 3.2 },
+		sidePanelBreakpoint: { default: "md" },
+		controlsOverlayOnly: { default: "sm" },
+		autoHideTimeout: { default: 5e3 },
+		layoutDebounceMs: { default: 50 },
+		sidePanelMinRight: { default: "20rem" },
+		sidePanelMaxRight: { default: "30vw" },
+		sidePanelMaxRightWide: { default: "40vw" },
+		sidePanelMinBottom: { default: "12.5rem" },
+		sidePanelMaxBottom: { default: "30vh" },
+		sidePanelMaxBottomTall: { default: "60vh" },
+		headerHideWidthThreshold: { default: "50rem" },
+		headerHideHeightThreshold: { default: "40rem" },
+		displaySidePanel: {
+			type: [
+				Boolean,
+				Function,
+				Object
+			],
+			default: !0
+		},
+		displaySidePanelWindowFn: {},
+		hideSidePanelIcons: {
+			type: Boolean,
+			default: !1
+		},
+		enforceSlotSizingQuerySelector: {},
+		autoRefresh: {
+			type: Boolean,
+			default: !1
+		},
+		autoRefreshInterval: { default: 2e3 }
+	},
+	emits: [
+		"update:sidePanelPosition",
+		"sidePanelTransition",
+		"sidePanelAvailableStates",
+		"defaultSlotResize"
+	],
+	setup(e, { expose: t, emit: n }) {
+		let r = e, i = n, a = useSlots(), p = ref(null), m = ref(null), h = ref(null), g = ref(0), v = ref(0), y = ref(0), b = ref(0), x = ref(0);
+		function S() {
+			let e = h.value;
+			if (!e) return;
+			let t = r.enforceSlotSizingQuerySelector ? Array.from(e.querySelectorAll(r.enforceSlotSizingQuerySelector)) : Array.from(e.children), n = `${x.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), A = {
+			sm: 640,
+			md: 768,
+			lg: 1024,
+			xl: 1280,
+			"2xl": 1536
+		}, j = computed(() => {
+			if (typeof window < "u" && r.displaySidePanelWindowFn && typeof window[r.displaySidePanelWindowFn] == "function") return !!window[r.displaySidePanelWindowFn]();
+			let e = unref(r.displaySidePanel);
+			return typeof e == "function" ? e() : !!e;
+		}), M = computed(() => !!a.sidePanelContent && j.value), N = computed(() => !!a.header), oe = computed(() => E.value.filter((e) => e !== "auto")), P = computed(() => Math.max(0, v.value - y.value)), F = computed(() => g.value < Se(r.controlsOverlayOnly)), se = computed(() => g.value === 0 ? !1 : P.value / g.value > 1.1), ce = computed(() => T.value === "right" && D.value === "wide-right" ? r.sidePanelMaxRightWide : r.sidePanelMaxRight), le = computed(() => Ce(r.mainContentAspectRatio, 16 / 9)), ue = computed(() => b.value > 0 ? b.value : Math.max(1, g.value)), de = computed(() => ue.value / le.value + 20), fe = computed(() => Math.max(1, g.value) / le.value), pe = computed(() => K(r.sidePanelMinBottom, g.value, v.value)), me = computed(() => {
+			let e = fe.value + pe.value;
+			return P.value >= e;
+		}), he = computed(() => Math.max(0, P.value - de.value)), ge = computed(() => {
+			if (T.value !== "bottom") return r.sidePanelMinBottom;
+			let e = K(r.sidePanelMinBottom, g.value, v.value), t = Math.min(e, I.value);
+			return `${Math.max(0, Math.floor(t))}px`;
+		}), I = computed(() => {
+			let e = K(T.value === "bottom" && D.value === "tall-bottom" ? r.sidePanelMaxBottomTall : r.sidePanelMaxBottom, g.value, v.value);
+			return Math.max(0, Math.min(e, he.value));
+		}), L = computed(() => T.value === "bottom" ? `${Math.max(0, Math.floor(I.value))}px` : r.sidePanelMaxBottom), _e = computed(() => T.value === "right" || T.value === "bottom" ? {} : T.value === "full" && !F.value ? {
+			opacity: 0,
+			pointerEvents: "none"
+		} : {}), R = computed(() => !M.value || F.value || T.value === "none" || T.value === "minimized" || T.value === "right" || T.value === "bottom" ? null : {
+			position: "absolute",
+			top: 0,
+			right: 0,
+			bottom: 0,
+			left: 0,
+			zIndex: 10,
+			pointerEvents: "none"
+		}), z = computed(() => !M.value || T.value === "none" || T.value === "full" ? { gridTemplate: "1fr / 1fr" } : T.value === "right" ? {
+			gridTemplateRows: "1fr",
+			gridTemplateColumns: `minmax(0, 1fr) max(${r.sidePanelMinRight}, ${ce.value})`
+		} : T.value === "bottom" ? {
+			gridTemplateRows: `minmax(0, 1fr) ${L.value}`,
+			gridTemplateColumns: "1fr"
+		} : T.value === "minimized" ? {
+			gridTemplateRows: "1fr max-content",
+			gridTemplateColumns: "1fr"
+		} : { gridTemplate: "1fr / 1fr" }), ve = computed(() => {
+			let e = {
+				minWidth: 0,
+				minHeight: 0,
+				width: "100%",
+				height: "100%",
+				placeSelf: "stretch",
+				zIndex: 20
+			};
+			if (M.value) {
+				if (T.value === "right") return {
+					...e,
+					gridColumn: "2 / 3",
+					gridRow: "1 / 2"
+				};
+				if (T.value === "full") return {
+					...e,
+					gridColumn: "1 / 2",
+					gridRow: "1 / 2"
+				};
+			}
+			return {
+				...e,
+				gridColumn: "1 / 2",
+				gridRow: "2 / 3"
+			};
+		}), ye = computed(() => {
+			let e = {
+				position: "fixed",
+				top: 0,
+				right: 0,
+				bottom: 0,
+				left: 0,
+				overflow: "hidden"
+			};
+			return N.value ? {
+				...e,
+				display: "grid",
+				gridTemplateRows: "auto 1fr"
+			} : {
+				...e,
+				display: "block"
+			};
+		}), be = computed(() => N.value ? {
+			position: "relative",
+			zIndex: 0,
+			display: "grid",
+			...z.value,
+			gridRow: "2 / 3",
+			minWidth: 0,
+			minHeight: 0,
+			overflow: "hidden"
+		} : {
+			position: "absolute",
+			zIndex: 0,
+			display: "grid",
+			...z.value,
+			minWidth: 0,
+			minHeight: 0,
+			overflow: "hidden",
+			top: "0",
+			right: "0",
+			bottom: "0",
+			left: "0"
+		}), xe = computed(() => !F.value || O.value), B = null, V, H, U = null, W = "", G = !1;
+		function Se(e) {
+			let t = A[e];
+			if (t !== void 0) return t;
+			if (e.endsWith("px")) {
+				let t = Number.parseFloat(e);
+				return Number.isFinite(t) ? t : 0;
+			}
+			let n = Number.parseFloat(e);
+			return Number.isFinite(n) ? n : 0;
+		}
+		function Ce(e, t) {
+			if (typeof e == "number") return Number.isFinite(e) && e > 0 ? e : t;
+			let n = String(e).trim();
+			if (n.includes("/")) {
+				let e = n.split("/", 2), r = e[0] ?? "", i = e[1] ?? "", a = Number.parseFloat(r), o = Number.parseFloat(i);
+				return Number.isFinite(a) && Number.isFinite(o) && a > 0 && o > 0 ? a / o : t;
+			}
+			let r = Number.parseFloat(n);
+			return Number.isFinite(r) && r > 0 ? r : t;
+		}
+		function K(e, t, n) {
+			let r = e.trim();
+			if (r.endsWith("px")) {
+				let e = Number.parseFloat(r);
+				return Number.isFinite(e) ? e : 0;
+			}
+			if (r.endsWith("vh")) {
+				let e = Number.parseFloat(r);
+				return Number.isFinite(e) ? n * e / 100 : 0;
+			}
+			if (r.endsWith("vw")) {
+				let e = Number.parseFloat(r);
+				return Number.isFinite(e) ? t * e / 100 : 0;
+			}
+			let i = Number.parseFloat(r);
+			return Number.isFinite(i) ? i : 0;
+		}
+		function we() {
+			let e = Math.max(1, g.value), t = Math.max(1, P.value), n = e / t, i = e / t, a = Se(r.sidePanelBreakpoint), o = me.value;
+			return n < r.autoBottomAspectRatioBreakpoint && o ? (D.value = "tall-bottom", {
+				states: [
+					"auto",
+					"full",
+					"bottom",
+					"minimized"
+				],
+				resolved: "bottom"
+			}) : i > r.autoRightAspectRatioBreakpoint ? (D.value = "wide-right", {
+				states: [
+					"auto",
+					"full",
+					"right",
+					"minimized"
+				],
+				resolved: "right"
+			}) : (D.value = "mixed", e >= a ? {
+				states: o ? [
+					"auto",
+					"full",
+					"bottom",
+					"right",
+					"minimized"
+				] : [
+					"auto",
+					"full",
+					"right",
+					"minimized"
+				],
+				resolved: "right"
+			} : {
+				states: [
+					"auto",
+					"full",
+					"minimized"
+				],
+				resolved: "full"
+			});
+		}
+		function Te(e, t, n) {
+			e === t || t === "none" || !M.value || i("sidePanelTransition", {
+				from: e,
+				to: t,
+				reason: n
+			});
+		}
+		function q(e = !1) {
+			let t = {
+				availableStates: M.value ? [...oe.value] : [],
+				sidePanelMode: M.value ? w.value : "none",
+				sidePanelModeResolved: M.value ? T.value : "none",
+				overlayOnly: F.value
+			};
+			if (!M.value) {
+				if (G) return;
+				G = !0, i("sidePanelAvailableStates", t);
+				return;
+			}
+			G = !1;
+			let n = JSON.stringify(t);
+			!e && n === W || (W = n, i("sidePanelAvailableStates", t));
+		}
+		function J(e) {
+			let t = T.value;
+			if (!M.value) {
+				w.value = "none", T.value = "none", E.value = [], q();
+				return;
+			}
+			let n = we();
+			E.value = n.states;
+			let r = w.value === "none" ? "auto" : w.value;
+			r !== "auto" && !E.value.includes(r) ? (w.value = "auto", i("update:sidePanelPosition", "auto")) : w.value = r, T.value = w.value === "auto" ? n.resolved : w.value, Te(t, T.value, e), q(k.value === !1);
+		}
+		function Y(e, t = !1) {
+			if (V &&= (clearTimeout(V), void 0), t || !k.value) {
+				J(e);
+				return;
+			}
+			V = setTimeout(() => {
+				J(e);
+			}, r.layoutDebounceMs);
+		}
+		function Ee(e) {
+			if (!M.value) return;
+			let t = E.value.includes(e) ? e : "auto";
+			t !== w.value && (w.value = t, i("update:sidePanelPosition", t)), Y("set-side-panel-mode", !0);
+		}
+		function De() {
+			!M.value || !F.value || Ee("minimized");
+		}
+		function X() {
+			H &&= (clearTimeout(H), void 0);
+		}
+		function Oe() {
+			if (X(), !F.value || se.value || T.value === "none") {
+				O.value = !0;
+				return;
+			}
+			H = setTimeout(() => {
+				O.value = !1;
+			}, r.autoHideTimeout);
+		}
+		function Z() {
+			O.value = !0, Oe();
+		}
+		function ke() {
+			if (!p.value) return;
+			let e = [
+				"mousemove",
+				"click",
+				"scroll",
+				"keydown",
+				"touchstart"
+			], t = () => {
+				Z();
+			};
+			for (let n of e) p.value.addEventListener(n, t, { passive: !0 });
+			U = () => {
+				if (p.value) for (let n of e) p.value.removeEventListener(n, t);
+			};
+		}
+		function Q() {
+			g.value = window.innerWidth, v.value = window.innerHeight, Y("viewport-resize");
+		}
+		function $() {
+			try {
+				if (typeof window > "u") return;
+				g.value = window.innerWidth, v.value = window.innerHeight, y.value = m.value?.offsetHeight ?? 0, b.value = h.value?.offsetWidth ?? 0, x.value = h.value?.offsetHeight ?? 0, S(), Y("manual-refresh", !0);
+			} catch (e) {
+				console.warn("[LiveFrame] Error during refresh cycle:", e);
+			}
+		}
+		t({ refresh: $ });
+		let { pause: Ae, resume: je } = useIntervalFn($, () => r.autoRefreshInterval, {
+			immediate: r.autoRefresh,
+			immediateCallback: !1
+		});
+		return watch(() => r.autoRefresh, (e) => {
+			e ? je() : Ae();
+		}), watch(() => r.sidePanelPosition, (e) => {
+			if (!M.value) {
+				w.value = "none";
+				return;
+			}
+			w.value = e, Y("prop-sync");
+		}, { immediate: !0 }), watch(M, (e) => {
+			if (!e) {
+				w.value = "none", T.value = "none", E.value = [], q();
+				return;
+			}
+			w.value = r.sidePanelPosition, Y("slot-state-change", !0);
+		}, { immediate: !0 }), watch(() => [
+			F.value,
+			r.autoHideTimeout,
+			T.value
+		], () => {
+			if (T.value === "full") {
+				Oe();
+				return;
+			}
+			Z();
+		}), watch(se, (e, t) => {
+			if (e) {
+				O.value = !0, X();
+				return;
+			}
+			t && Z();
+		}), watch(() => [
+			b.value,
+			x.value,
+			T.value,
+			M.value
+		], () => {
+			!M.value || T.value === "none" || i("defaultSlotResize", {
+				width: b.value,
+				height: x.value
+			});
+		}), onMounted(async () => {
+			k.value = !0, Q(), window.addEventListener("resize", Q), ke(), Z(), await nextTick(), B = new ResizeObserver(() => {
+				y.value = m.value?.offsetHeight ?? 0, b.value = h.value?.offsetWidth ?? 0, x.value = h.value?.offsetHeight ?? 0, S(), Y("slot-measure");
+			}), m.value && B.observe(m.value), h.value && (B.observe(h.value), b.value = h.value.offsetWidth, x.value = h.value.offsetHeight), y.value = m.value?.offsetHeight ?? 0, Y("mounted", !0);
+		}), onBeforeUnmount(() => {
+			window.removeEventListener("resize", Q), U?.(), U = null, B?.disconnect(), B = null, X(), V &&= (clearTimeout(V), void 0);
+		}), (t, n) => (openBlock(), createElementBlock("section", {
+			ref_key: "rootRef",
+			ref: p,
+			class: "bg-black text-neutral-100",
+			style: normalizeStyle({ ...ye.value })
+		}, [N.value ? withDirectives((openBlock(), createElementBlock("header", {
+			key: 0,
+			ref_key: "headerRef",
+			ref: m,
+			class: "",
+			style: {
+				position: "relative",
+				width: "100%",
+				gridRow: "1 / 2",
+				zIndex: 40
+			}
+		}, [(openBlock(), createBlock(resolveDynamicComponent("style"), null, {
+			default: withCtx(() => [createTextVNode(" #header-outer { display: none; } @media (min-width: " + toDisplayString(r.headerHideWidthThreshold) + ") and (min-height: " + toDisplayString(r.headerHideHeightThreshold) + ") { #header-outer { display: block; } } ", 1)]),
+			_: 1
+		})), createElementVNode("div", _hoisted_1$1, [renderSlot(t.$slots, "header")])], 512)), [[vShow, xe.value]]) : createCommentVNode("", !0), createElementVNode("article", {
+			class: "",
+			style: normalizeStyle({ ...be.value })
+		}, [
+			createElementVNode("main", {
+				ref_key: "defaultRef",
+				ref: h,
+				class: "slot-content-container",
+				style: normalizeStyle({
+					position: "relative",
+					boxSizing: "border-box",
+					width: "100%",
+					height: "100%",
+					display: "grid",
+					placeItems: "stretch",
+					minHeight: 0,
+					overflow: "hidden",
+					gridColumn: "1 / 2",
+					gridRow: "1 / 2",
+					zIndex: 0,
+					..._e.value
+				})
+			}, [renderSlot(t.$slots, "default")], 4),
+			R.value ? (openBlock(), createElementBlock("div", {
+				key: 0,
+				class: "bg-black",
+				style: normalizeStyle({
+					...R.value,
+					gridColumn: "1 / 2",
+					gridRow: "1 / 2"
+				})
+			}, null, 4)) : createCommentVNode("", !0),
+			M.value && T.value !== "none" ? (openBlock(), createElementBlock("div", {
+				key: 1,
+				class: "",
+				style: normalizeStyle(ve.value)
+			}, [createVNode(SidePanelFrame_default, {
+				"side-panel-mode": w.value,
+				"side-panel-mode-resolved": T.value,
+				"available-states": oe.value,
+				"overlay-only": F.value,
+				"hide-icons": e.hideSidePanelIcons,
+				"min-width": e.sidePanelMinRight,
+				"max-width": ce.value,
+				"min-height": ge.value,
+				"max-height": L.value,
+				onSetSidePanelMode: Ee,
+				onCloseSidePanel: De
+			}, {
+				default: withCtx(() => [renderSlot(t.$slots, "sidePanelContent")]),
+				_: 3
+			}, 8, [
+				"side-panel-mode",
+				"side-panel-mode-resolved",
+				"available-states",
+				"overlay-only",
+				"hide-icons",
+				"min-width",
+				"max-width",
+				"min-height",
+				"max-height"
+			])], 4)) : createCommentVNode("", !0)
+		], 4)], 4));
+	}
+}), [["__scopeId", "data-v-f7a0b92e"]]), LoggedInOut_default = /* @__PURE__ */ defineComponent({
+	__name: "LoggedInOut",
+	props: {
+		initiallyLoggedIn: { type: Boolean },
+		addWindowAccess: {
+			type: Boolean,
+			default: !1
+		},
+		windowAccessObjectName: { default: "loggedInOut" },
+		initializeFromWindowAccessObject: {
+			type: Boolean,
+			default: !1
+		},
+		initializeWindowAccessObjectName: { default: "initialLoggedIn" },
+		waitBehavior: {
+			type: Boolean,
+			default: void 0
+		}
+	},
+	setup(e, { expose: t }) {
+		let n = e, { loggedIn: r, isInitialized: s, setToLoggedIn: u, setToLoggedOut: d, toggleLoggedIn: f, getLoggedIn: p, setLoggedIn: m, setupWindowAccess: h, cleanupWindowAccess: g } = useSimpleLoggedIn({
+			initialValue: n.initiallyLoggedIn,
+			addWindowAccess: n.addWindowAccess,
+			windowAccessObjectName: n.windowAccessObjectName,
+			initializeFromWindowAccessObject: n.initializeFromWindowAccessObject,
+			initializeWindowAccessObjectName: n.initializeWindowAccessObjectName
+		}), _ = computed(() => n.waitBehavior === void 0 ? n.initializeFromWindowAccessObject : n.waitBehavior);
+		return onMounted(() => {
+			n.addWindowAccess && h(n.windowAccessObjectName);
+		}), onUnmounted(() => {
+			g(n.windowAccessObjectName);
+		}), watch(() => n.addWindowAccess, (e) => {
+			e ? h(n.windowAccessObjectName) : g(n.windowAccessObjectName);
+		}), watch(() => n.windowAccessObjectName, (e, t) => {
+			n.addWindowAccess && (t && g(t), h(n.windowAccessObjectName));
+		}), t({
+			loggedIn: r,
+			setToLoggedIn: u,
+			setToLoggedOut: d,
+			toggleLoggedIn: f,
+			getLoggedIn: p,
+			setLoggedIn: m
+		}), (e, t) => !_.value || unref(s) ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [unref(r) ? renderSlot(e.$slots, "loggedIn", { key: 0 }) : renderSlot(e.$slots, "loggedOut", { key: 1 })], 64)) : createCommentVNode("", !0);
+	}
+}), VanillaIf_default = /* @__PURE__ */ defineComponent({
+	__name: "VanillaIf",
+	props: {
+		show: { type: [
+			Boolean,
+			Function,
+			Object
+		] },
+		showWindowFn: {}
+	},
+	setup(e) {
+		let t = e, n = ref(!1), r = ref(!1), i = null;
+		function o() {
+			i &&= (clearInterval(i), null);
+		}
+		function s() {
+			let e;
+			if (e = typeof window < "u" && t.showWindowFn ? window[t.showWindowFn] : unref(t.show), typeof e == "function") try {
+				let t = e();
+				return typeof t == "boolean" ? {
+					ready: !0,
+					value: t
+				} : {
+					ready: !1,
+					value: !1
+				};
+			} catch (e) {
+				if (e instanceof ReferenceError || e instanceof TypeError) return {
+					ready: !1,
+					value: !1
+				};
+				throw e;
+			}
+			return t.showWindowFn ? {
+				ready: !1,
+				value: !1
+			} : typeof e == "boolean" ? {
+				ready: !0,
+				value: e
+			} : e == null ? {
+				ready: !1,
+				value: !1
+			} : {
+				ready: !0,
+				value: !!e
+			};
+		}
+		function u() {
+			let { ready: e, value: t } = s();
+			e ? (r.value = t, n.value = !0, o()) : i ||= setInterval(() => {
+				let e = s();
+				e.ready && (r.value = e.value, n.value = !0, o());
+			}, 50);
+		}
+		let d = s();
+		return d.ready && (n.value = !0, r.value = d.value), watch(() => [t.show, t.showWindowFn], () => {
+			n.value = !1, o(), u();
+		}, { deep: !0 }), onMounted(() => {
+			n.value || u();
+		}), onUnmounted(() => {
+			o();
+		}), (e, t) => n.value ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [r.value ? renderSlot(e.$slots, "default", { key: 0 }) : renderSlot(e.$slots, "else", { key: 1 })], 64)) : createCommentVNode("", !0);
+	}
+}), suspectProtoRx = /"(?:_|\\u0{2}5[Ff]){2}(?:p|\\u0{2}70)(?:r|\\u0{2}72)(?:o|\\u0{2}6[Ff])(?:t|\\u0{2}74)(?:o|\\u0{2}6[Ff])(?:_|\\u0{2}5[Ff]){2}"\s*:/, suspectConstructorRx = /"(?:c|\\u0063)(?:o|\\u006[Ff])(?:n|\\u006[Ee])(?:s|\\u0073)(?:t|\\u0074)(?:r|\\u0072)(?:u|\\u0075)(?:c|\\u0063)(?:t|\\u0074)(?:o|\\u006[Ff])(?:r|\\u0072)"\s*:/, JsonSigRx = /^\s*["[{]|^\s*-?\d{1,16}(\.\d{1,17})?([Ee][+-]?\d+)?\s*$/;
+function jsonParseTransform(e, t) {
+	if (e === "__proto__" || e === "constructor" && t && typeof t == "object" && "prototype" in t) {
+		warnKeyDropped(e);
+		return;
+	}
+	return t;
+}
+function warnKeyDropped(e) {
+	console.warn(`[destr] Dropping "${e}" key to prevent prototype pollution.`);
+}
+function destr(e, t = {}) {
+	if (typeof e != "string") return e;
+	if (e[0] === "\"" && e[e.length - 1] === "\"" && e.indexOf("\\") === -1) return e.slice(1, -1);
+	let n = e.trim();
+	if (n.length <= 9) switch (n.toLowerCase()) {
+		case "true": return !0;
+		case "false": return !1;
+		case "undefined": return;
+		case "null": return null;
+		case "nan": return NaN;
+		case "infinity": return Infinity;
+		case "-infinity": return -Infinity;
+	}
+	if (!JsonSigRx.test(e)) {
+		if (t.strict) throw SyntaxError("[destr] Invalid JSON");
+		return e;
+	}
+	try {
+		if (suspectProtoRx.test(e) || suspectConstructorRx.test(e)) {
+			if (t.strict) throw Error("[destr] Possible prototype pollution");
+			return JSON.parse(e, jsonParseTransform);
+		}
+		return JSON.parse(e);
+	} catch (n) {
+		if (t.strict) throw n;
+		return e;
+	}
+}
+String.fromCharCode;
+var HASH_RE = /#/g, AMPERSAND_RE = /&/g, SLASH_RE = /\//g, EQUAL_RE = /=/g, PLUS_RE = /\+/g, ENC_CARET_RE = /%5e/gi, ENC_BACKTICK_RE = /%60/gi, ENC_PIPE_RE = /%7c/gi, ENC_SPACE_RE = /%20/gi;
+function encode(e) {
+	return encodeURI("" + e).replace(ENC_PIPE_RE, "|");
+}
+function encodeQueryValue(e) {
+	return encode(typeof e == "string" ? e : JSON.stringify(e)).replace(PLUS_RE, "%2B").replace(ENC_SPACE_RE, "+").replace(HASH_RE, "%23").replace(AMPERSAND_RE, "%26").replace(ENC_BACKTICK_RE, "`").replace(ENC_CARET_RE, "^").replace(SLASH_RE, "%2F");
+}
+function encodeQueryKey(e) {
+	return encodeQueryValue(e).replace(EQUAL_RE, "%3D");
+}
+function decode(e = "") {
+	try {
+		return decodeURIComponent("" + e);
+	} catch {
+		return "" + e;
+	}
+}
+function decodeQueryKey(e) {
+	return decode(e.replace(PLUS_RE, " "));
+}
+function decodeQueryValue(e) {
+	return decode(e.replace(PLUS_RE, " "));
+}
+function parseQuery(e = "") {
+	let t = /* @__PURE__ */ Object.create(null);
+	e[0] === "?" && (e = e.slice(1));
+	for (let n of e.split("&")) {
+		let e = n.match(/([^=]+)=?(.*)/) || [];
+		if (e.length < 2) continue;
+		let r = decodeQueryKey(e[1]);
+		if (r === "__proto__" || r === "constructor") continue;
+		let i = decodeQueryValue(e[2] || "");
+		t[r] === void 0 ? t[r] = i : Array.isArray(t[r]) ? t[r].push(i) : t[r] = [t[r], i];
+	}
+	return t;
+}
+function encodeQueryItem(e, t) {
+	return (typeof t == "number" || typeof t == "boolean") && (t = String(t)), t ? Array.isArray(t) ? t.map((t) => `${encodeQueryKey(e)}=${encodeQueryValue(t)}`).join("&") : `${encodeQueryKey(e)}=${encodeQueryValue(t)}` : encodeQueryKey(e);
+}
+function stringifyQuery(e) {
+	return Object.keys(e).filter((t) => e[t] !== void 0).map((t) => encodeQueryItem(t, e[t])).filter(Boolean).join("&");
+}
+var PROTOCOL_STRICT_REGEX = /^[\s\w\0+.-]{2,}:([/\\]{1,2})/, PROTOCOL_REGEX = /^[\s\w\0+.-]{2,}:([/\\]{2})?/, PROTOCOL_RELATIVE_REGEX = /^([/\\]\s*){2,}[^/\\]/, TRAILING_SLASH_RE = /\/$|\/\?|\/#/, JOIN_LEADING_SLASH_RE = /^\.?\//;
+function hasProtocol(e, t = {}) {
+	return typeof t == "boolean" && (t = { acceptRelative: t }), t.strict ? PROTOCOL_STRICT_REGEX.test(e) : PROTOCOL_REGEX.test(e) || (t.acceptRelative ? PROTOCOL_RELATIVE_REGEX.test(e) : !1);
+}
+function hasTrailingSlash(e = "", t) {
+	return t ? TRAILING_SLASH_RE.test(e) : e.endsWith("/");
+}
+function withoutTrailingSlash(e = "", t) {
+	if (!t) return (hasTrailingSlash(e) ? e.slice(0, -1) : e) || "/";
+	if (!hasTrailingSlash(e, !0)) return e || "/";
+	let n = e, r = "", i = e.indexOf("#");
+	i !== -1 && (n = e.slice(0, i), r = e.slice(i));
+	let [a, ...o] = n.split("?");
+	return ((a.endsWith("/") ? a.slice(0, -1) : a) || "/") + (o.length > 0 ? `?${o.join("?")}` : "") + r;
+}
+function withTrailingSlash(e = "", t) {
+	if (!t) return e.endsWith("/") ? e : e + "/";
+	if (hasTrailingSlash(e, !0)) return e || "/";
+	let n = e, r = "", i = e.indexOf("#");
+	if (i !== -1 && (n = e.slice(0, i), r = e.slice(i), !n)) return r;
+	let [a, ...o] = n.split("?");
+	return a + "/" + (o.length > 0 ? `?${o.join("?")}` : "") + r;
+}
+function withBase(e, t) {
+	if (isEmptyURL(t) || hasProtocol(e)) return e;
+	let n = withoutTrailingSlash(t);
+	if (e.startsWith(n)) {
+		let t = e[n.length];
+		if (!t || t === "/" || t === "?") return e;
+	}
+	return joinURL(n, e);
+}
+function withQuery(e, t) {
+	let n = parseURL(e);
+	return n.search = stringifyQuery({
+		...parseQuery(n.search),
+		...t
+	}), stringifyParsedURL(n);
+}
+function isEmptyURL(e) {
+	return !e || e === "/";
+}
+function isNonEmptyURL(e) {
+	return e && e !== "/";
+}
+function joinURL(e, ...t) {
+	let n = e || "";
+	for (let e of t.filter((e) => isNonEmptyURL(e))) if (n) {
+		let t = e.replace(JOIN_LEADING_SLASH_RE, "");
+		n = withTrailingSlash(n) + t;
+	} else n = e;
+	return n;
+}
+var protocolRelative = Symbol.for("ufo:protocolRelative");
+function parseURL(e = "", t) {
+	let n = e.match(/^[\s\0]*(blob:|data:|javascript:|vbscript:)(.*)/i);
+	if (n) {
+		let [, e, t = ""] = n;
+		return {
+			protocol: e.toLowerCase(),
+			pathname: t,
+			href: e + t,
+			auth: "",
+			host: "",
+			search: "",
+			hash: ""
+		};
+	}
+	if (!hasProtocol(e, { acceptRelative: !0 })) return t ? parseURL(t + e) : parsePath(e);
+	let [, r = "", i, a = ""] = e.replace(/\\/g, "/").match(/^[\s\0]*([\w+.-]{2,}:)?\/\/([^/@]+@)?(.*)/) || [], [, o = "", s = ""] = a.match(/([^#/?]*)(.*)?/) || [];
+	r === "file:" && (s = s.replace(/\/(?=[A-Za-z]:)/, ""));
+	let { pathname: c, search: l, hash: u } = parsePath(s);
+	return {
+		protocol: r.toLowerCase(),
+		auth: i ? i.slice(0, Math.max(0, i.length - 1)) : "",
+		host: o,
+		pathname: c,
+		search: l,
+		hash: u,
+		[protocolRelative]: !r
+	};
+}
+function parsePath(e = "") {
+	let [t = "", n = "", r = ""] = (e.match(/([^#?]*)(\?[^#]*)?(#.*)?/) || []).splice(1);
+	return {
+		pathname: t,
+		search: n,
+		hash: r
+	};
+}
+function stringifyParsedURL(e) {
+	let t = e.pathname || "", n = e.search ? (e.search.startsWith("?") ? "" : "?") + e.search : "", r = e.hash || "", i = e.auth ? e.auth + "@" : "", a = e.host || "";
+	return (e.protocol || e[protocolRelative] ? (e.protocol || "") + "//" : "") + i + a + t + n + r;
+}
+var FetchError = class extends Error {
+	constructor(e, t) {
+		super(e, t), this.name = "FetchError", t?.cause && !this.cause && (this.cause = t.cause);
+	}
+};
+function createFetchError(e) {
+	let t = e.error?.message || e.error?.toString() || "", n = e.request?.method || e.options?.method || "GET", r = e.request?.url || String(e.request) || "/", i = new FetchError(`${`[${n}] ${JSON.stringify(r)}`}: ${e.response ? `${e.response.status} ${e.response.statusText}` : "<no response>"}${t ? ` ${t}` : ""}`, e.error ? { cause: e.error } : void 0);
+	for (let t of [
+		"request",
+		"options",
+		"response"
+	]) Object.defineProperty(i, t, { get() {
+		return e[t];
+	} });
+	for (let [t, n] of [
+		["data", "_data"],
+		["status", "status"],
+		["statusCode", "status"],
+		["statusText", "statusText"],
+		["statusMessage", "statusText"]
+	]) Object.defineProperty(i, t, { get() {
+		return e.response && e.response[n];
+	} });
+	return i;
+}
+var payloadMethods = new Set(Object.freeze([
+	"PATCH",
+	"POST",
+	"PUT",
+	"DELETE"
+]));
+function isPayloadMethod(e = "GET") {
+	return payloadMethods.has(e.toUpperCase());
+}
+function isJSONSerializable(e) {
+	if (e === void 0) return !1;
+	let t = typeof e;
+	return t === "string" || t === "number" || t === "boolean" || t === null ? !0 : t === "object" ? Array.isArray(e) ? !0 : e.buffer || e instanceof FormData || e instanceof URLSearchParams ? !1 : e.constructor && e.constructor.name === "Object" || typeof e.toJSON == "function" : !1;
+}
+var textTypes = /* @__PURE__ */ new Set([
+	"image/svg",
+	"application/xml",
+	"application/xhtml",
+	"application/html"
+]), JSON_RE = /^application\/(?:[\w!#$%&*.^`~-]*\+)?json(;.+)?$/i;
+function detectResponseType(e = "") {
+	if (!e) return "json";
+	let t = e.split(";").shift() || "";
+	return JSON_RE.test(t) ? "json" : t === "text/event-stream" ? "stream" : textTypes.has(t) || t.startsWith("text/") ? "text" : "blob";
+}
+function resolveFetchOptions(e, t, n, r) {
+	let i = mergeHeaders(t?.headers ?? e?.headers, n?.headers, r), a;
+	return (n?.query || n?.params || t?.params || t?.query) && (a = {
+		...n?.params,
+		...n?.query,
+		...t?.params,
+		...t?.query
+	}), {
+		...n,
+		...t,
+		query: a,
+		params: a,
+		headers: i
+	};
+}
+function mergeHeaders(e, t, n) {
+	if (!t) return new n(e);
+	let r = new n(t);
+	if (e) for (let [t, i] of Symbol.iterator in e || Array.isArray(e) ? e : new n(e)) r.set(t, i);
+	return r;
+}
+async function callHooks(e, t) {
+	if (t) if (Array.isArray(t)) for (let n of t) await n(e);
+	else await t(e);
+}
+var retryStatusCodes = /* @__PURE__ */ new Set([
+	408,
+	409,
+	425,
+	429,
+	500,
+	502,
+	503,
+	504
+]), nullBodyResponses = /* @__PURE__ */ new Set([
+	101,
+	204,
+	205,
+	304
+]);
+function createFetch(e = {}) {
+	let { fetch: t = globalThis.fetch, Headers: n = globalThis.Headers, AbortController: r = globalThis.AbortController } = e;
+	async function i(e) {
+		let t = e.error && e.error.name === "AbortError" && !e.options.timeout || !1;
+		if (e.options.retry !== !1 && !t) {
+			let t;
+			t = typeof e.options.retry == "number" ? e.options.retry : isPayloadMethod(e.options.method) ? 0 : 1;
+			let n = e.response && e.response.status || 500;
+			if (t > 0 && (Array.isArray(e.options.retryStatusCodes) ? e.options.retryStatusCodes.includes(n) : retryStatusCodes.has(n))) {
+				let n = typeof e.options.retryDelay == "function" ? e.options.retryDelay(e) : e.options.retryDelay || 0;
+				return n > 0 && await new Promise((e) => setTimeout(e, n)), a(e.request, {
+					...e.options,
+					retry: t - 1
+				});
+			}
+		}
+		let n = createFetchError(e);
+		throw Error.captureStackTrace && Error.captureStackTrace(n, a), n;
+	}
+	let a = async function(a, o = {}) {
+		let s = {
+			request: a,
+			options: resolveFetchOptions(a, o, e.defaults, n),
+			response: void 0,
+			error: void 0
+		};
+		if (s.options.method && (s.options.method = s.options.method.toUpperCase()), s.options.onRequest && (await callHooks(s, s.options.onRequest), s.options.headers instanceof n || (s.options.headers = new n(s.options.headers || {}))), typeof s.request == "string" && (s.options.baseURL && (s.request = withBase(s.request, s.options.baseURL)), s.options.query && (s.request = withQuery(s.request, s.options.query), delete s.options.query), "query" in s.options && delete s.options.query, "params" in s.options && delete s.options.params), s.options.body && isPayloadMethod(s.options.method)) if (isJSONSerializable(s.options.body)) {
+			let e = s.options.headers.get("content-type");
+			typeof s.options.body != "string" && (s.options.body = e === "application/x-www-form-urlencoded" ? new URLSearchParams(s.options.body).toString() : JSON.stringify(s.options.body)), e || s.options.headers.set("content-type", "application/json"), s.options.headers.has("accept") || s.options.headers.set("accept", "application/json");
+		} else ("pipeTo" in s.options.body && typeof s.options.body.pipeTo == "function" || typeof s.options.body.pipe == "function") && ("duplex" in s.options || (s.options.duplex = "half"));
+		let c;
+		if (!s.options.signal && s.options.timeout) {
+			let e = new r();
+			c = setTimeout(() => {
+				let t = /* @__PURE__ */ Error("[TimeoutError]: The operation was aborted due to timeout");
+				t.name = "TimeoutError", t.code = 23, e.abort(t);
+			}, s.options.timeout), s.options.signal = e.signal;
+		}
+		try {
+			s.response = await t(s.request, s.options);
+		} catch (e) {
+			return s.error = e, s.options.onRequestError && await callHooks(s, s.options.onRequestError), await i(s);
+		} finally {
+			c && clearTimeout(c);
+		}
+		if ((s.response.body || s.response._bodyInit) && !nullBodyResponses.has(s.response.status) && s.options.method !== "HEAD") {
+			let e = (s.options.parseResponse ? "json" : s.options.responseType) || detectResponseType(s.response.headers.get("content-type") || "");
+			switch (e) {
+				case "json": {
+					let e = await s.response.text(), t = s.options.parseResponse || destr;
+					s.response._data = t(e);
+					break;
+				}
+				case "stream":
+					s.response._data = s.response.body || s.response._bodyInit;
+					break;
+				default: s.response._data = await s.response[e]();
+			}
+		}
+		return s.options.onResponse && await callHooks(s, s.options.onResponse), !s.options.ignoreResponseError && s.response.status >= 400 && s.response.status < 600 ? (s.options.onResponseError && await callHooks(s, s.options.onResponseError), await i(s)) : s.response;
+	}, o = async function(e, t) {
+		return (await a(e, t))._data;
+	};
+	return o.raw = a, o.native = (...e) => t(...e), o.create = (t = {}, n = {}) => createFetch({
+		...e,
+		...n,
+		defaults: {
+			...e.defaults,
+			...n.defaults,
+			...t
+		}
+	}), o;
+}
+var _globalThis = (function() {
+	if (typeof globalThis < "u") return globalThis;
+	if (typeof self < "u") return self;
+	if (typeof window < "u") return window;
+	if (typeof global < "u") return global;
+	throw Error("unable to locate global object");
+})(), fetch = _globalThis.fetch ? (...e) => _globalThis.fetch(...e) : () => Promise.reject(/* @__PURE__ */ Error("[ofetch] global.fetch is not supported!")), Headers$1 = _globalThis.Headers, AbortController$1 = _globalThis.AbortController, ofetch = createFetch({
+	fetch,
+	Headers: Headers$1,
+	AbortController: AbortController$1
+}), _hoisted_1 = { class: "border border-neutral-300 rounded-lg bg-white shadow-sm grid grid-rows-[min-content_auto_min-content] overflow-hidden" }, _hoisted_2 = { class: "flex items-center justify-between px-3 py-1 bg-neutral-900 border-b border-neutral-800" }, _hoisted_3 = { class: "px-2 py-0.5 bg-neutral-800 text-neutral-300 font-mono text-[10px] uppercase font-bold rounded" }, _hoisted_4 = {
+	key: 0,
+	class: "flex items-center gap-2"
+}, _hoisted_5 = { class: "flex items-center gap-4 px-4 py-3 bg-white" }, _hoisted_6 = ["disabled"], _hoisted_7 = { key: 0 }, _hoisted_8 = { key: 1 }, _hoisted_9 = { class: "grid grid-cols-[10rem_1fr] bg-neutral-900 border-t border-neutral-800 group h-auto" }, _hoisted_10 = { class: "flex flex-col w-full min-w-0 p-3 relative h-max" }, _hoisted_11 = { class: "absolute top-2 right-2 flex justify-end z-10" }, _hoisted_12 = {
+	key: 0,
+	class: "text-sm text-neutral-300 font-mono m-0 whitespace-pre-wrap break-words"
+}, _hoisted_13 = {
+	key: 1,
+	class: "text-sm text-neutral-300 font-mono m-0 whitespace-pre-wrap break-words"
+}, _hoisted_14 = {
+	key: 2,
+	class: "text-sm text-neutral-500 font-mono italic h-full flex items-center"
+}, FetchCard_default = /* @__PURE__ */ defineComponent({
+	__name: "FetchCard",
+	props: {
+		requireCheckboxToEnable: {},
+		fetchOptions: {},
+		responseDisplayTimeout: {},
+		fetchOnMount: {},
+		fetchButtonText: {},
+		fetchButtonClass: {},
+		responseClass: {},
+		responseMaxHeight: {},
+		url: {},
+		urlClass: {},
+		urlCommonClass: {},
+		urlParts: {},
+		urlPartsClasses: {},
+		urlPartsDirection: {}
+	},
+	emits: [
+		"fetching",
+		"onResult",
+		"onSuccess",
+		"onError"
+	],
+	setup(e, { emit: t }) {
+		let n = e, r = t, i = ref(!1), s = ref(!1), d = ref(null), f = ref(null), p = ref(null), m = computed(() => toValue(n.requireCheckboxToEnable) ?? !1), h = computed(() => toValue(n.fetchOptions) ?? {}), g = computed(() => toValue(n.responseDisplayTimeout) ?? 2e4), _ = computed(() => toValue(n.fetchOnMount) ?? !1), ee = computed(() => toValue(n.fetchButtonText) ?? "Fetch"), y = computed(() => toValue(n.fetchButtonClass) ?? ""), b = computed(() => toValue(n.responseClass)), x = computed(() => toValue(n.responseMaxHeight) ?? "40vh"), te = computed(() => h.value.method || "GET"), C = computed(() => n.url === void 0 ? n.urlParts === void 0 ? "" : toValue(n.urlParts).join("") : toValue(n.url)), w = computed(() => m.value && !i.value ? !0 : s.value || !C.value), T = ref("neutral"), E = null, ne = () => {
+			E && clearTimeout(E), E = setTimeout(() => {
+				T.value = "neutral";
+			}, g.value);
+		}, re = async () => {
+			if (!w.value) {
+				s.value = !0, T.value = "yellow", d.value = null, p.value = null, f.value = null, m.value && (i.value = !1), r("fetching", n);
+				try {
+					let e = await ofetch.raw(C.value, h.value);
+					d.value = e._data, f.value = e.status, T.value = "green", r("onResult", n, e), r("onSuccess", n, e);
+				} catch (e) {
+					p.value = e.data || e.message || "Unknown error", f.value = e.status || 500, T.value = "red", r("onResult", n, e), r("onError", n, e);
+				} finally {
+					s.value = !1, ne();
+				}
+			}
+		}, ie = computed(() => {
+			switch (T.value) {
+				case "yellow": return "text-yellow-400 bg-yellow-900/30 border-yellow-700/50";
+				case "green": return "text-green-400 bg-green-900/30 border-green-700/50";
+				case "red": return "text-red-400 bg-red-900/30 border-red-700/50";
+				default: return "text-neutral-500 bg-neutral-800/50 border-neutral-700";
+			}
+		}), { copy: ae, copied: A, isSupported: j } = useClipboard({ legacy: !0 }), M = () => {
+			let e = d.value || p.value;
+			e && ae(JSON.stringify(e, null, 2));
+		};
+		return onMounted(() => {
+			C.value && _.value && (!m.value || i.value) && re();
+		}), (e, t) => (openBlock(), createElementBlock("div", _hoisted_1, [
+			createElementVNode("div", _hoisted_2, [createElementVNode("span", _hoisted_3, toDisplayString(te.value), 1), m.value ? (openBlock(), createElementBlock("div", _hoisted_4, [t[1] ||= createElementVNode("label", {
+				for: "enable-fetch",
+				class: "text-xs font-medium text-neutral-300 cursor-pointer select-none"
+			}, " Enable Request ", -1), withDirectives(createElementVNode("input", {
+				id: "enable-fetch",
+				type: "checkbox",
+				"onUpdate:modelValue": t[0] ||= (e) => i.value = e,
+				class: "w-3.5 h-3.5 rounded border-neutral-600 bg-neutral-800 text-indigo-500 focus:ring-indigo-500 cursor-pointer"
+			}, null, 512), [[vModelCheckbox, i.value]])])) : createCommentVNode("", !0)]),
+			createElementVNode("div", _hoisted_5, [createElementVNode("div", { class: normalizeClass(["flex-1 min-w-0", toValue(n.urlCommonClass)]) }, [n.url === void 0 ? n.urlParts === void 0 ? createCommentVNode("", !0) : (openBlock(), createElementBlock("div", {
+				key: 1,
+				class: normalizeClass(["flex flex-wrap font-mono break-all text-neutral-800", toValue(n.urlPartsDirection) === "column" ? "flex-col items-start gap-1" : "flex-row items-baseline"])
+			}, [(openBlock(!0), createElementBlock(Fragment, null, renderList(toValue(n.urlParts), (e, t) => (openBlock(), createElementBlock("div", {
+				key: t,
+				class: normalizeClass(toValue(n.urlPartsClasses)?.[t] ?? (toValue(n.urlParts).length > 2 ? t === 0 ? "hidden" : t === 1 ? "text-sm font-medium mr-1" : "text-2xl font-bold" : toValue(n.urlParts).length > 1 ? t === 0 ? "hidden" : "text-sm font-medium" : "text-sm"))
+			}, toDisplayString(e), 3))), 128))], 2)) : (openBlock(), createElementBlock("span", {
+				key: 0,
+				class: normalizeClass(["font-mono text-sm break-all text-neutral-600", toValue(n.urlClass)])
+			}, toDisplayString(C.value), 3))], 2), createElementVNode("button", {
+				onClick: re,
+				disabled: w.value,
+				class: normalizeClass(["shrink-0 px-4 py-2 text-sm font-medium rounded disabled:opacity-50 disabled:cursor-not-allowed transition-colors", y.value || "bg-indigo-600 text-white hover:bg-indigo-700"])
+			}, [s.value ? (openBlock(), createElementBlock("span", _hoisted_7, "Fetching...")) : (openBlock(), createElementBlock("span", _hoisted_8, toDisplayString(ee.value), 1))], 10, _hoisted_6)]),
+			createElementVNode("div", _hoisted_9, [createElementVNode("div", { class: normalizeClass(["flex items-center justify-center font-mono text-2xl font-black shadow-sm transition-colors duration-300 h-16", ie.value]) }, toDisplayString(f.value || "---"), 3), createElementVNode("div", _hoisted_10, [createElementVNode("div", _hoisted_11, [(d.value || p.value) && unref(j) ? (openBlock(), createElementBlock("button", {
+				key: 0,
+				onClick: withModifiers(M, ["prevent"]),
+				class: normalizeClass(["px-2.5 py-1.5 rounded-md text-xs font-bold font-mono border backdrop-blur-sm transition-all duration-200 opacity-0 transform -translate-y-1 group-hover:opacity-100 group-hover:translate-y-0 shadow shadow-neutral-900", unref(A) ? "bg-emerald-900/80 text-emerald-300 border-emerald-700/50" : "bg-neutral-800/90 text-neutral-300 border-neutral-700 hover:bg-neutral-700"])
+			}, toDisplayString(unref(A) ? "COPIED!" : "COPY"), 3)) : createCommentVNode("", !0)]), createElementVNode("div", {
+				class: normalizeClass(["w-full overflow-y-auto transition-all duration-300 custom-scrollbar mt-1 overflow-x-hidden pr-16", b.value ? b.value : "max-h-12 hover:max-h-[var(--hover-max-h)]"]),
+				style: normalizeStyle({ "--hover-max-h": x.value })
+			}, [d.value ? (openBlock(), createElementBlock("pre", _hoisted_12, toDisplayString(JSON.stringify(d.value, null, 2)), 1)) : p.value ? (openBlock(), createElementBlock("pre", _hoisted_13, toDisplayString(JSON.stringify(p.value, null, 2)), 1)) : (openBlock(), createElementBlock("div", _hoisted_14, "Awaiting request..."))], 6)])])
+		]));
+	}
+});
+export { SidePanelFrame_default as a, SidePanelControlButton_default as c, LiveFrame_default as i, VanillaIf_default as n, SidePanelHeader_default as o, LoggedInOut_default as r, SidePanelButtonGroup_default as s, FetchCard_default as t };