@gtsx/studio 0.0.1 → 0.0.3

package/dist/chunks/client-entry-6rzfPqgF.js

@@ -1,3973 +0,0 @@
-import { G_PREVIEW_PROTOCOL_VERSION as e, createGPreviewRenderMessage as t, createGPreviewRequestValuesMessage as n, createGScopeHook as r, defineGComponent as i } from "@gtsx/core";
-import a from "react";
-import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
-import { flushSync as l } from "react-dom";
-//#region src/preview-frame-layout.ts
-var u = 16;
-function d(e, t) {
-	if (!t) return e.height;
-	let n = h(e, t);
-	return Math.max(1, Math.ceil(t.height + n.top + n.bottom));
-}
-function f(e, t) {
-	if (!t) return e.width;
-	let n = h(e, t);
-	return Math.max(1, Math.ceil(t.width + n.left + n.right));
-}
-function p(e, t) {
-	return {
-		x: Math.max(0, Math.floor(e?.x ?? 0) - t.left),
-		y: Math.max(0, Math.floor(e?.y ?? 0) - t.top)
-	};
-}
-function m(e, t) {
-	if (e) return {
-		x: t.left,
-		y: t.top,
-		width: e.width,
-		height: e.height
-	};
-}
-function h(e, t) {
-	if (!t) return {
-		bottom: 0,
-		left: 0,
-		right: 0,
-		top: 0
-	};
-	let n = typeof e.width == "number" ? e.width : Infinity;
-	return {
-		bottom: Math.min(u, Math.max(0, (e.height ?? Infinity) - t.y - t.height)),
-		left: Math.min(u, Math.max(0, t.x)),
-		right: Math.min(u, Math.max(0, n - t.x - t.width)),
-		top: Math.min(u, Math.max(0, t.y))
-	};
-}
-//#endregion
-//#region src/client.tsx
-var g = "roots";
-function _(t, n) {
-	if (n.protocolVersion !== e || n.sessionId !== t.expectedSessionId) return t;
-	if (n.type === "gtsx:ready") {
-		if (t.ready && !t.error) return t;
-		let e = {
-			...t,
-			ready: !0
-		};
-		return delete e.error, e;
-	}
-	return n.type === "gtsx:tree" ? y(t.tree, n.tree) ? t : {
-		...t,
-		tree: n.tree
-	} : n.type === "gtsx:resize" ? t.size?.width === n.size.width && t.size.height === n.size.height ? t : {
-		...t,
-		size: n.size
-	} : n.type === "gtsx:error" ? t.error?.message === n.error.message && t.error.stack === n.error.stack ? t : {
-		...t,
-		error: n.error
-	} : n.type === "gtsx:values" ? {
-		...t,
-		valuesByBoundaryId: {
-			...t.valuesByBoundaryId,
-			[n.values.boundaryId]: n.values
-		}
-	} : t;
-}
-function v(e, t, n) {
-	if (!n.has(t.sessionId)) return e;
-	let r = e[t.sessionId] ?? {
-		expectedSessionId: t.sessionId,
-		ready: !1
-	}, i = _(r, t);
-	return i === r ? e : {
-		...e,
-		[t.sessionId]: i
-	};
-}
-function y(e, t) {
-	return e === t ? !0 : !e || !t || e.length !== t.length ? !1 : e.every((e, n) => b(e, t[n]));
-}
-function b(e, t) {
-	return t ? e.id === t.id && e.coordinate === t.coordinate && x(e.rect, t.rect) && y(e.children, t.children) : !1;
-}
-function x(e, t) {
-	return e === t || e?.x === t?.x && e?.y === t?.y && e?.width === t?.width && e?.height === t?.height;
-}
-function S(e, t) {
-	return {
-		canvasViewportPreset: "tablet",
-		columns: [{ components: U(e, t).components }],
-		selectedCaseByCoordinate: {},
-		selectedCoordinatePath: [],
-		selectedRuntimeInstanceByCoordinate: {},
-		selectedViewportPresetByCoordinate: {}
-	};
-}
-function C() {
-	return {
-		x: 40,
-		y: 40,
-		scale: 1
-	};
-}
-function w(e, t, n, r, i = {}) {
-	let a = T(e, n, i.columnIndex);
-	if (a < 0) return e;
-	let o = e.columns.slice(0, a + 1), s = [...e.selectedCoordinatePath.slice(0, a), n], c = le(t, ue(r), n);
-	return c.length > 0 && o.push({
-		components: c,
-		parentCoordinate: n
-	}), {
-		canvasViewportPreset: I(e),
-		columns: o,
-		selectedCaseByCoordinate: de(e.selectedCaseByCoordinate, s),
-		selectedCoordinatePath: s,
-		selectedRuntimeInstanceByCoordinate: e.selectedRuntimeInstanceByCoordinate,
-		selectedViewportPresetByCoordinate: e.selectedViewportPresetByCoordinate
-	};
-}
-function T(e, t, n) {
-	return n !== void 0 && e.columns[n]?.components.some((e) => e.coordinate === t) ? n : e.columns.findIndex((e) => e.components.some((e) => e.coordinate === t));
-}
-function E(e, t) {
-	return e.selectedCaseByCoordinate[t.coordinate] ?? t.cases[0]?.name ?? "No cases";
-}
-function D(e, t, n, r = {}) {
-	let i = e.columns.findIndex((e) => e.components.some((e) => e.coordinate === t)), a = r.keepDrilldown || i < 0 ? e.columns : e.columns.slice(0, i + 1);
-	return {
-		canvasViewportPreset: I(e),
-		columns: a,
-		selectedCaseByCoordinate: {
-			...e.selectedCaseByCoordinate,
-			[t]: n
-		},
-		selectedCoordinatePath: r.keepDrilldown || i < 0 ? e.selectedCoordinatePath : [...e.selectedCoordinatePath.slice(0, i), t],
-		selectedRuntimeInstanceByCoordinate: {},
-		selectedViewportPresetByCoordinate: e.selectedViewportPresetByCoordinate
-	};
-}
-function O(e, t, n) {
-	return {
-		...e,
-		selectedRuntimeInstanceByCoordinate: {
-			...e.selectedRuntimeInstanceByCoordinate,
-			[t]: n
-		}
-	};
-}
-function ee(e, t, n) {
-	return {
-		...e,
-		canvasViewportPreset: n,
-		selectedViewportPresetByCoordinate: {
-			...e.selectedViewportPresetByCoordinate,
-			[t]: n
-		}
-	};
-}
-function k(e, t) {
-	return {
-		...e,
-		canvasViewportPreset: t,
-		selectedViewportPresetByCoordinate: {}
-	};
-}
-function A(e, t, n) {
-	let r = new URLSearchParams();
-	e && e !== g && r.set("selection", e);
-	let i = I(t);
-	i !== "tablet" && r.set("canvasViewport", i), we(r, n);
-	for (let e of t.selectedCoordinatePath) r.append("path", e);
-	for (let e of t.selectedCoordinatePath) {
-		let n = t.selectedCaseByCoordinate[e];
-		n && r.append("case", `${e}:${n}`);
-		let i = t.selectedRuntimeInstanceByCoordinate[e];
-		i && r.append("instance", `${e}:${i}`);
-		let a = t.selectedViewportPresetByCoordinate[e];
-		a !== void 0 && r.append("viewport", `${e}:${a}`);
-	}
-	return r;
-}
-function j(e, t) {
-	let n = t.get("selection") ?? void 0, r = me(t), i = U(e, n), a = t.getAll("path"), o = a.filter((t) => !!L(e, t)), s = new Set(o), c = ne(e, t, s), l = M(e, t, s), u = re(e, t, s), d = ie(t, u, o), f = n && n !== i.id || a.length !== o.length || se(e, t, s) || ce(e, t, s) || oe(t) ? "Invalid Studio URL state was ignored." : void 0;
-	return o.length === 0 ? {
-		canvas: r,
-		selection: i.id,
-		workspace: {
-			canvasViewportPreset: d,
-			columns: [{ components: i.components }],
-			selectedCaseByCoordinate: c,
-			selectedCoordinatePath: [],
-			selectedRuntimeInstanceByCoordinate: l,
-			selectedViewportPresetByCoordinate: u
-		},
-		...f ? { warning: f } : {}
-	} : {
-		canvas: r,
-		selection: i.id,
-		workspace: {
-			canvasViewportPreset: d,
-			columns: [{ components: i.components }, ...o.slice(1).map((t) => {
-				let n = L(e, t), r = o.indexOf(t);
-				return {
-					components: n ? [n] : [],
-					parentCoordinate: r > 0 ? o[r - 1] : void 0
-				};
-			})],
-			selectedCaseByCoordinate: c,
-			selectedCoordinatePath: o,
-			selectedRuntimeInstanceByCoordinate: l,
-			selectedViewportPresetByCoordinate: u
-		},
-		...f ? { warning: f } : {}
-	};
-}
-function te(e, t, r) {
-	let i = t.selectedCoordinatePath.at(-1);
-	if (!i) return;
-	let a = L(e, t.selectedCoordinatePath.at(-2) ?? i);
-	if (!a) return;
-	let o = z(a, E(t, a), I(t));
-	return {
-		sessionId: o,
-		message: n(o, r)
-	};
-}
-function ne(e, t, n) {
-	let r = {};
-	for (let i of t.getAll("case")) {
-		let t = N(e, i);
-		if (!t) continue;
-		let a = L(e, t.coordinate);
-		n.has(t.coordinate) && a?.cases.some((e) => e.name === t.value) && (r[t.coordinate] = t.value);
-	}
-	return r;
-}
-function M(e, t, n) {
-	let r = {};
-	for (let i of t.getAll("instance")) {
-		let t = N(e, i);
-		t && n.has(t.coordinate) && L(e, t.coordinate) && (r[t.coordinate] = t.value);
-	}
-	return r;
-}
-function re(e, t, n) {
-	let r = {};
-	for (let i of t.getAll("viewport")) {
-		let t = N(e, i);
-		t && n.has(t.coordinate) && ae(t.value) && (r[t.coordinate] = t.value);
-	}
-	return r;
-}
-function ie(e, t, n) {
-	let r = e.get("canvasViewport");
-	if (r && ae(r)) return r;
-	let i = [...n].reverse().find((e) => t[e]);
-	return i ? t[i] : "tablet";
-}
-function ae(e) {
-	return e === "phone" || e === "tablet" || e === "desktop";
-}
-function oe(e) {
-	let t = e.get("canvasViewport");
-	return !!(t && !ae(t));
-}
-function se(e, t, n) {
-	return t.getAll("case").some((t) => {
-		let r = N(e, t);
-		return !r || !n.has(r.coordinate) ? !0 : !L(e, r.coordinate)?.cases.some((e) => e.name === r.value);
-	});
-}
-function ce(e, t, n) {
-	return t.getAll("instance").some((t) => {
-		let r = N(e, t);
-		return !r || !n.has(r.coordinate);
-	});
-}
-function N(e, t) {
-	let n = e.files.flatMap((e) => e.components).map((e) => e.coordinate).sort((e, t) => t.length - e.length).find((e) => t.startsWith(`${e}:`));
-	if (n) return {
-		coordinate: n,
-		value: t.slice(n.length + 1)
-	};
-}
-function le(e, t, n) {
-	let r = new Map(e.files.flatMap((e) => e.components).map((e) => [e.coordinate, e])), i = /* @__PURE__ */ new Set(), a = [];
-	for (let e of t) {
-		let t = fe(e, n);
-		if (t) for (let e of t.children) {
-			if (i.has(e.coordinate)) continue;
-			let t = r.get(e.coordinate);
-			t && (i.add(e.coordinate), a.push(t));
-		}
-	}
-	return a;
-}
-function ue(e) {
-	return e.length === 0 ? [] : Array.isArray(e[0]) ? e : [e];
-}
-function de(e, t) {
-	let n = new Set(t);
-	return Object.fromEntries(Object.entries(e).filter(([e]) => !n.has(e)));
-}
-function fe(e, t) {
-	for (let n of e) {
-		if (n.coordinate === t) return n;
-		let e = fe(n.children, t);
-		if (e) return e;
-	}
-}
-function pe(e, t) {
-	if (t !== void 0) return new URLSearchParams(t);
-	if (typeof window < "u" && window.location.search) return new URLSearchParams(window.location.search);
-	let n = new URLSearchParams();
-	return e && n.set("selection", e), n;
-}
-function me(e) {
-	let t = C();
-	return {
-		x: Te(e, "canvasX", t.x),
-		y: Te(e, "canvasY", t.y),
-		scale: P(Te(e, "canvasScale", t.scale), Se, Ce)
-	};
-}
-function he(e) {
-	if (typeof window > "u") return;
-	let t = new URLSearchParams(window.location.search);
-	we(t, e);
-	let n = t.toString(), r = `${window.location.pathname}${n ? `?${n}` : ""}`;
-	r !== `${window.location.pathname}${window.location.search}` && window.history.replaceState({ gtsxStudio: !0 }, "", r);
-}
-function ge(e, t, n = {}) {
-	if (typeof window > "u") return;
-	let r = A(e, t, n.canvas ?? me(new URLSearchParams(window.location.search)));
-	xe(r, new URLSearchParams(window.location.search));
-	let i = r.toString(), a = `${window.location.pathname}${i ? `?${i}` : ""}`;
-	a !== `${window.location.pathname}${window.location.search}` && window.history.pushState({ gtsxStudio: !0 }, "", a);
-}
-function _e(e) {
-	let t = be(e);
-	return t.includes("pool") || t.includes("preview-pool") || t.includes("no-pool") || t.includes("disable-pool") || e.get("debugPool") === "1" || ye(e);
-}
-function ve(e) {
-	let t = be(e);
-	return t.includes("queue") || t.includes("preview-queue");
-}
-function ye(e) {
-	let t = be(e), n = e.get("debugPool")?.trim().toLowerCase();
-	return t.includes("no-pool") || t.includes("disable-pool") || t.includes("without-pool") || n === "0" || n === "false" || n === "off";
-}
-function be(e) {
-	return e.getAll("debug").join(",").split(",").map((e) => e.trim()).filter(Boolean);
-}
-function xe(e, t) {
-	for (let n of /* @__PURE__ */ "debug.debugPool.debounce.maximumConcurrentRenderTasks.maximumConcurrentRenderTasksDuringCanvasMovement.maximumRenderTaskCount.minimumVisibleRenderTasksDuringCanvasMovement.previewQueueActiveRenderTimeout.previewQueueActiveRenderTimeoutMilliseconds.previewQueueActive.previewQueueActiveTimeout.previewQueueBufferRenderDelay.previewQueueBufferRenderDelayMilliseconds.previewQueueBuffer.previewQueueDebounce.previewQueueLength.previewQueueMaximumConcurrentRenderTasks.previewQueueMaximumConcurrentRenderTasksDuringCanvasMovement.previewQueueMaximumMountedPreviewSessions.previewQueueMaximumRenderTaskCount.previewQueueMinimumVisibleRenderTasksDuringCanvasMovement.previewQueueVisibleRenderFloor.previewQueueRenderBufferMargin.previewQueueRenderDebounce.previewQueueRenderDebounceMilliseconds.previewQueueRenderThrottle.previewQueueRenderThrottleMilliseconds.previewQueueSafety.previewQueueThrottle.queueActiveRenderTimeout.queueActive.queueActiveTimeout.queueBufferRenderDelay.queueBuffer.queueDebounce.queueLength.queueMaximumConcurrentRenderTasks.queueMaximumConcurrentRenderTasksDuringCanvasMovement.queueMaximumMountedPreviewSessions.queueMaximumRenderTaskCount.queueMinimumVisibleRenderTasksDuringCanvasMovement.queueRenderBufferMargin.queueRenderDebounce.queueRenderThrottle.queueSafety.queueThrottle.queueVisibleRenderFloor.previewBuffer.previewDebounce.previewRenderBufferMargin.previewRenderDebounce.previewRenderThrottle.previewThrottle.throttle".split(".")) {
-		e.delete(n);
-		for (let r of t.getAll(n)) e.append(n, r);
-	}
-}
-function P(e, t, n) {
-	return Math.min(n, Math.max(t, e));
-}
-var Se = .2, Ce = 2.5;
-function we(e, t) {
-	if (e.delete("canvasX"), e.delete("canvasY"), e.delete("canvasScale"), !t) return;
-	let n = C();
-	t.x !== n.x && e.set("canvasX", Ee(t.x)), t.y !== n.y && e.set("canvasY", Ee(t.y)), t.scale !== n.scale && e.set("canvasScale", Ee(t.scale));
-}
-function Te(e, t, n) {
-	let r = e.get(t);
-	if (!r) return n;
-	let i = Number(r);
-	return Number.isFinite(i) ? i : n;
-}
-function Ee(e) {
-	let t = Math.round(e * 1e3) / 1e3;
-	return String(Object.is(t, -0) ? 0 : t);
-}
-function De(e, t) {
-	if (!t.ctrlKey && !t.metaKey) return {
-		...e,
-		x: e.x - t.deltaX,
-		y: e.y - t.deltaY
-	};
-	let n = t.focalViewportX ?? t.clientX - t.viewportLeft, r = t.focalViewportY ?? t.clientY - t.viewportTop, i = (n - e.x) / e.scale, a = (r - e.y) / e.scale, o = -t.deltaY * je(t.deltaMode) * 10, s = P(e.scale * 2 ** o, Se, Ce);
-	return {
-		scale: s,
-		x: n - i * s,
-		y: r - a * s
-	};
-}
-function Oe(e, t) {
-	let n = t.margin ?? 24, r = Me(t.viewportRect, t.blockerRects ?? [], n), i = Ne(t.rect.left, t.rect.right, r.left, r.right), a = Ne(t.rect.top, t.rect.bottom, r.top, r.bottom);
-	return i === 0 && a === 0 ? e : {
-		...e,
-		x: e.x + i,
-		y: e.y + a
-	};
-}
-function ke(e) {
-	let t = e.margin ?? 40, n = {}, r = {};
-	return e.columns.forEach((i, a) => {
-		if (a === 0 || !i.parentCoordinate) n[a] = {
-			x: 0,
-			y: 0
-		};
-		else {
-			let o = Fe(r, a, i.parentCoordinate);
-			if (!o) n[a] = {
-				x: a * t,
-				y: 0
-			};
-			else {
-				let i = e.measurementsByIndex[a]?.height ?? 0, s = o.top;
-				n[a] = {
-					x: (Ie(r, a, s, s + i) ?? o.right) + t,
-					y: o.top
-				};
-			}
-		}
-		r[a] = Pe(e.measurementsByIndex[a]?.cardRectsByCoordinate ?? {}, n[a] ?? {
-			x: 0,
-			y: 0
-		}, i.componentCoordinates);
-	}), n;
-}
-function F(e) {
-	let t = e.gap ?? 14, n = e.caseChromeHeight ?? 20, r = e.maxSide ?? 760, i = e.minScale ?? .24, a = e.items.length > 0 ? e.items : [{
-		height: 160,
-		width: 280
-	}], o = a.length, s = Math.max(1, ...a.map((e) => e.width)), c = Math.max(1, ...a.map((e) => e.height)), l, u = Infinity;
-	for (let a = 1; a <= o; a += 1) {
-		let d = Math.ceil(o / a), f = a * s + (a - 1) * t, p = d * c, m = d * n + (d - 1) * t, h = Math.max(r * i, r - m), g = P(Math.min(1, r / f, h / p), i, 1), _ = e.previewScale === void 0 ? g : P(e.previewScale, i, 1), v = Math.ceil(s * _), y = Math.ceil(n + c * _), b = Math.ceil(a * v + (a - 1) * t), x = Math.ceil(d * y + (d - 1) * t), S = Math.abs(Math.log(b / x)), C = e.previewScale === void 0 ? (1 - _) * .35 : 0, w = (a * d - o) * .08, T = e.previewScale === void 0 ? 0 : Math.max(0, b - r, x - r) / r, E = S + C + w + T * 4;
-		E < u && (u = E, l = {
-			caseChromeHeight: n,
-			cellHeight: y,
-			cellWidth: v,
-			columns: a,
-			gap: t,
-			height: x,
-			previewScale: _,
-			rows: d,
-			width: b
-		});
-	}
-	return l ?? {
-		caseChromeHeight: n,
-		cellHeight: n + 160,
-		cellWidth: 280,
-		columns: 1,
-		gap: t,
-		height: n + 160,
-		previewScale: 1,
-		rows: 1,
-		width: 280
-	};
-}
-function Ae(e, t) {
-	if (t.type !== "clear" && t.source !== "keyboard") return t.coordinate === e ? e : t.coordinate;
-}
-function je(e) {
-	return e === 1 ? .05 : e === 2 ? 1 : .002;
-}
-function Me(e, t, n) {
-	let r = e.left + n, i = e.right - n, a = e.top + n, o = e.bottom - n;
-	for (let s of t) {
-		let t = s.bottom > a && s.top < o, c = s.right > r && s.left < i;
-		if (!t || !c) continue;
-		let l = s.right >= e.right - 1, u = s.left <= e.left + 1, d = s.bottom >= e.bottom - 1, f = s.top <= e.top + 1;
-		if (l || u) {
-			l && (i = Math.min(i, s.left - n)), u && (r = Math.max(r, s.right + n));
-			continue;
-		}
-		d && (o = Math.min(o, s.top - n)), f && (a = Math.max(a, s.bottom + n));
-	}
-	return {
-		bottom: Math.max(a, o),
-		left: r,
-		right: Math.max(r, i),
-		top: a
-	};
-}
-function Ne(e, t, n, r) {
-	return t - e > r - n ? t < n ? n - e : e > r ? r - t : 0 : e < n ? n - e : t > r ? r - t : 0;
-}
-function Pe(e, t, n) {
-	let r = {};
-	for (let i of n) {
-		let n = e[i];
-		n && (r[i] = {
-			bottom: n.bottom + t.y,
-			left: n.left + t.x,
-			right: n.right + t.x,
-			top: n.top + t.y
-		});
-	}
-	return r;
-}
-function Fe(e, t, n) {
-	for (let r = t - 1; r >= 0; --r) {
-		let t = e[r]?.[n];
-		if (t) return t;
-	}
-}
-function Ie(e, t, n, r) {
-	let i;
-	for (let a = 0; a < t; a += 1) for (let t of Object.values(e[a] ?? {})) t.bottom <= n || t.top >= r || (i = i === void 0 ? t.right : Math.max(i, t.right));
-	return i;
-}
-function Le(e, t, n) {
-	let r = t ? fe(t, n)?.rect : void 0;
-	return r ? Math.max(280, Math.ceil(Number(f(e, r)))) : typeof e.width == "number" ? e.width + 28 : 520;
-}
-function Re(e, t) {
-	if (!e) return;
-	let n = typeof t.width == "number" ? t.width : Infinity, r = P(e.x, 0, n), i = P(e.y, 0, t.height), a = P(e.x + e.width, 0, n), o = P(e.y + e.height, 0, t.height);
-	if (!(a <= r || o <= i)) return {
-		x: r,
-		y: i,
-		width: a - r,
-		height: o - i
-	};
-}
-function I(e) {
-	if (e.canvasViewportPreset) return e.canvasViewportPreset;
-	let t = e.selectedCoordinatePath.at(-1);
-	return t ? e.selectedViewportPresetByCoordinate[t] ?? "tablet" : Object.values(e.selectedViewportPresetByCoordinate)[0] ?? "tablet";
-}
-function ze(e) {
-	let t = /* @__PURE__ */ new Set(), n = [];
-	for (let r of e.columns.flatMap((e) => e.components)) t.has(r.coordinate) || (t.add(r.coordinate), n.push(r));
-	return n;
-}
-function L(e, t) {
-	return e.files.flatMap((e) => e.components).find((e) => e.coordinate === t);
-}
-function R(e, t, n, r = z(t, n), i = {}) {
-	let a = new URLSearchParams({
-		entry: t.coordinate,
-		case: n,
-		chrome: "0",
-		sessionId: r
-	});
-	return i.static && a.set("static", "1"), `${e.routes.preview}?${a.toString()}`;
-}
-function Be(e) {
-	return He(e.routes.preview, new URLSearchParams({
-		chrome: "0",
-		pool: "1"
-	}));
-}
-function Ve(e, t) {
-	let n = new URL(e, "http://gtsx.local"), r = n.searchParams.getAll("gcase").flatMap((e) => {
-		let t = e.lastIndexOf(":");
-		return t > 0 ? [[e.slice(0, t), e.slice(t + 1)]] : [];
-	});
-	return {
-		caseName: n.searchParams.get("case"),
-		...r.length > 0 ? { caseOverrides: r } : {},
-		chrome: n.searchParams.get("chrome"),
-		entry: n.searchParams.get("entry"),
-		sessionId: n.searchParams.get("sessionId") ?? t,
-		staticMode: n.searchParams.get("static") === "1"
-	};
-}
-function He(e, t) {
-	let n = t.toString();
-	return n ? `${e}${e.includes("?") ? "&" : "?"}${n}` : e;
-}
-function z(e, t, n) {
-	return `${e.coordinate}:${t}${n && n !== "tablet" ? `@${n}` : ""}`;
-}
-function B(e, t, n) {
-	return `${n}\n${e.sourceHash ?? "no-source-hash"}\n${e.coordinate}\n${t}`;
-}
-function V(e, t) {
-	return e === "phone" ? {
-		width: 390,
-		height: 844
-	} : e === "tablet" ? {
-		width: 768,
-		height: 1024
-	} : e === "desktop" ? {
-		width: 1280,
-		height: 900
-	} : {
-		width: 768,
-		height: P(t?.height ?? 1024, 160, 1200)
-	};
-}
-function H(e, t, n) {
-	if (!(!t && !n)) return {
-		expectedSessionId: e,
-		ready: t?.ready ?? !1,
-		...t?.tree ?? n?.tree ? { tree: t?.tree ?? n?.tree } : {},
-		...t?.size ?? n?.size ? { size: t?.size ?? n?.size } : {},
-		...t?.error ? { error: t.error } : {},
-		...t?.valuesByBoundaryId ? { valuesByBoundaryId: t.valuesByBoundaryId } : {}
-	};
-}
-function Ue(e) {
-	let t = I(e);
-	return new Set(e.columns.flatMap((e) => e.components.flatMap((e) => e.cases.map((n) => z(e, n.name, t)))));
-}
-function We(e, t) {
-	let n = I(t);
-	return ze(t).flatMap((t) => t.cases.map((r) => Ge(e, t, r.name, n, z(t, r.name, n))));
-}
-function Ge(e, t, n, r, i) {
-	return {
-		cacheKey: B(t, n, r),
-		previewUrl: R(e, t, n, i, { static: !0 }),
-		sessionId: i,
-		size: V(r, void 0),
-		title: `${t.componentName} ${n} preview`
-	};
-}
-function Ke(t) {
-	let n = t.type;
-	return typeof t == "object" && !!t && typeof n == "string" && qe(n) && t.protocolVersion === e && typeof t.sessionId == "string";
-}
-function qe(e) {
-	return e === "gtsx:ready" || e === "gtsx:tree" || e === "gtsx:resize" || e === "gtsx:error" || e === "gtsx:request-values" || e === "gtsx:values" || e === "gtsx:render";
-}
-function U(e, t) {
-	if (!t || t === g) return {
-		id: g,
-		components: Je(e)
-	};
-	if (t?.startsWith("component:")) {
-		let n = t.slice(10), r = e.files.flatMap((e) => e.components).find((e) => e.coordinate === n);
-		if (r) return {
-			id: t,
-			components: [r]
-		};
-	}
-	if (t?.startsWith("file:")) {
-		let n = t.slice(5), r = e.files.find((e) => e.path === n);
-		if (r) return {
-			id: t,
-			components: r.components
-		};
-	}
-	return {
-		id: g,
-		components: Je(e)
-	};
-}
-function Je(e) {
-	let t = e.files.flatMap((e) => e.components), n = new Set(t.flatMap((e) => e.dependencies ?? [])), r = t.filter((e) => !n.has(e.coordinate));
-	return r.length > 0 ? r : t;
-}
-//#endregion
-//#region src/preview-cache-indexeddb.ts
-var Ye = "gtsx-studio-preview-cache-v1", W = "previewFrames", Xe = 1;
-function Ze(e) {
-	let t = e.cache?.namespace?.trim();
-	return t ? `project:${t}` : `manifest:${ot(JSON.stringify({
-		files: e.files.map((e) => ({
-			path: e.path,
-			components: e.components.map((e) => ({
-				coordinate: e.coordinate,
-				exportName: e.exportName,
-				cases: e.cases.map((e) => e.name)
-			}))
-		})),
-		routes: e.routes,
-		version: e.version
-	}))}`;
-}
-async function Qe(e, t) {
-	if (!it() || t.length === 0) return {};
-	try {
-		let n = await tt(), r = n.transaction(W, "readonly"), i = r.objectStore(W), a = await Promise.all(t.map((t) => nt(i.get(at(e, t)))));
-		return await rt(r), n.close(), Object.fromEntries(a.flatMap((t) => t && t.namespace === e ? [[t.cacheKey, {
-			frameState: t.frameState,
-			lastUsedAt: t.updatedAt
-		}]] : []));
-	} catch {
-		return {};
-	}
-}
-async function $e(e, t) {
-	let n = Object.entries(t).flatMap(([t, n]) => {
-		let r = n ? et(n.frameState) : void 0;
-		return r ? [{
-			cacheKey: t,
-			frameState: r,
-			id: at(e, t),
-			namespace: e,
-			updatedAt: Date.now()
-		}] : [];
-	});
-	if (!(!it() || n.length === 0)) try {
-		let e = await tt(), t = e.transaction(W, "readwrite"), r = t.objectStore(W);
-		for (let e of n) r.put(e);
-		await rt(t), e.close();
-	} catch {}
-}
-function et(e) {
-	if (!(!e.tree && !e.size)) return {
-		expectedSessionId: e.expectedSessionId,
-		ready: e.ready,
-		...e.size ? { size: e.size } : {},
-		...e.tree ? { tree: e.tree } : {}
-	};
-}
-function tt() {
-	return new Promise((e, t) => {
-		let n = indexedDB.open(Ye, Xe);
-		n.onupgradeneeded = () => {
-			let e = n.result;
-			e.objectStoreNames.contains(W) || e.createObjectStore(W, { keyPath: "id" }).createIndex("namespace", "namespace", { unique: !1 });
-		}, n.onerror = () => t(n.error), n.onsuccess = () => e(n.result);
-	});
-}
-function nt(e) {
-	return new Promise((t, n) => {
-		e.onerror = () => n(e.error), e.onsuccess = () => t(e.result);
-	});
-}
-function rt(e) {
-	return new Promise((t, n) => {
-		e.onerror = () => n(e.error), e.onabort = () => n(e.error), e.oncomplete = () => t();
-	});
-}
-function it() {
-	return typeof indexedDB < "u";
-}
-function at(e, t) {
-	return `${e}\n${t}`;
-}
-function ot(e) {
-	let t = 2166136261;
-	for (let n = 0; n < e.length; n += 1) t ^= e.charCodeAt(n), t = Math.imul(t, 16777619);
-	return (t >>> 0).toString(36);
-}
-//#endregion
-//#region src/preview-geometry-cache-store.ts
-var st = [
-	"phone",
-	"tablet",
-	"desktop"
-];
-function ct(e) {
-	return ht(e.files.flatMap((e) => e.components.flatMap((e) => e.cases.flatMap((t) => st.map((n) => B(e, t.name, n))))));
-}
-function lt(e) {
-	let t = ht(e.cacheKeys), n = {}, r = {}, i = {}, a = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map(), s = (e) => {
-		if (e.size === 0) return;
-		let t = /* @__PURE__ */ new Set();
-		for (let n of e) {
-			o.set(n, (o.get(n) ?? 0) + 1);
-			for (let e of a.get(n) ?? []) t.add(e);
-		}
-		for (let e of t) e();
-	};
-	return {
-		cacheKeys: t,
-		getFrameState(e) {
-			return r[e];
-		},
-		getLayoutFrameState(e, t) {
-			let n = i[t]?.frameState;
-			return n ? H(e, void 0, n) : r[e];
-		},
-		getMergedFrameState(e, t) {
-			return H(e, r[e], n[t]?.frameState);
-		},
-		namespace: e.namespace,
-		getSnapshot() {
-			return n;
-		},
-		getVersionForKeys(e) {
-			return e.map((e) => `${e}:${o.get(e) ?? 0}`).join("|");
-		},
-		async hydrate() {
-			let r = {
-				...await Qe(e.namespace, t),
-				...n
-			}, a = gt(n, r);
-			return n = r, i = r, s(a), n;
-		},
-		markSessionRenderStarted(e) {
-			let t = r[e], n = {
-				expectedSessionId: e,
-				ready: !1
-			};
-			return t && vt(t, n) ? !1 : (r = {
-				...r,
-				[e]: n
-			}, s(new Set([e])), !0);
-		},
-		putMessages(e, t = /* @__PURE__ */ new Set()) {
-			let a = /* @__PURE__ */ new Set(), o = dt(r, e, t, a), c = ft(n, e, a), l = pt(i, e, a);
-			return o === r && c === n && l === i ? {
-				changed: !1,
-				entriesToWrite: {},
-				snapshot: n
-			} : (r = o, n = c, i = l, s(a), {
-				changed: !0,
-				entriesToWrite: mt(n, e),
-				snapshot: n
-			});
-		},
-		reset(e = {}) {
-			let t = new Set([
-				...Object.keys(r),
-				...gt(n, e),
-				...gt(i, e)
-			]);
-			r = {}, n = e, i = e, s(t);
-		},
-		subscribe(e, t) {
-			for (let n of e) {
-				let e = a.get(n);
-				e || (e = /* @__PURE__ */ new Set(), a.set(n, e)), e.add(t);
-			}
-			return () => {
-				for (let n of e) {
-					let e = a.get(n);
-					e && (e.delete(t), e.size === 0 && a.delete(n));
-				}
-			};
-		},
-		writeEntries(t) {
-			return $e(e.namespace, t);
-		}
-	};
-}
-function ut(e) {
-	return e.component.cases.flatMap((t) => [z(e.component, t.name, e.viewportPreset), B(e.component, t.name, e.viewportPreset)]);
-}
-function dt(e, t, n, r) {
-	let i = e;
-	for (let { message: a } of t) {
-		if (!n.has(a.sessionId)) continue;
-		let t = i[a.sessionId] ?? {
-			expectedSessionId: a.sessionId,
-			ready: !1
-		}, o = _(t, a);
-		o !== t && (i === e && (i = { ...e }), i[a.sessionId] = o, r.add(a.sessionId));
-	}
-	return i;
-}
-function ft(e, t, n) {
-	let r = Date.now(), i = e;
-	for (let { message: a, target: o } of t) {
-		let t = i[o.cacheKey]?.frameState ?? {
-			expectedSessionId: a.sessionId,
-			ready: !1
-		}, s = _(t, a);
-		s !== t && (i === e && (i = { ...e }), i[o.cacheKey] = {
-			frameState: s,
-			lastUsedAt: r
-		}, n.add(o.cacheKey));
-	}
-	return i;
-}
-function pt(e, t, n) {
-	let r = Date.now(), i = e;
-	for (let { message: a, target: o } of t) {
-		let t = i[o.cacheKey];
-		if (!_t(t)) continue;
-		let s = t?.frameState ?? {
-			expectedSessionId: a.sessionId,
-			ready: !1
-		}, c = _(s, a);
-		c !== s && (i === e && (i = { ...e }), i[o.cacheKey] = {
-			frameState: c,
-			lastUsedAt: r
-		}, n.add(o.cacheKey));
-	}
-	return i;
-}
-function mt(e, t) {
-	let n = {};
-	for (let { target: r } of t) n[r.cacheKey] = e[r.cacheKey];
-	return n;
-}
-function ht(e) {
-	return [...new Set(e)];
-}
-function gt(e, t) {
-	let n = new Set([...Object.keys(e), ...Object.keys(t)]), r = /* @__PURE__ */ new Set();
-	for (let i of n) e[i] !== t[i] && r.add(i);
-	return r;
-}
-function _t(e) {
-	return !e?.frameState.tree && !e?.frameState.error;
-}
-function vt(e, t) {
-	return e.expectedSessionId === t.expectedSessionId && e.ready === t.ready && e.tree === t.tree && e.size === t.size && e.error === t.error && e.valuesByBoundaryId === t.valuesByBoundaryId;
-}
-//#endregion
-//#region src/preview-lazy-loading.ts
-var yt = 3200;
-function bt(e, t) {
-	return {
-		bottom: e.y + t.bottom * e.scale,
-		left: e.x + t.left * e.scale,
-		right: e.x + t.right * e.scale,
-		top: e.y + t.top * e.scale
-	};
-}
-function xt(e, t, n) {
-	return e.bottom >= t.top - n && e.right >= t.left - n && e.top <= t.bottom + n && e.left <= t.right + n;
-}
-//#endregion
-//#region src/preview-render-queue.ts
-var St = 24, Ct = 4, wt = 4, Tt = 8192, Et = 5e3, Dt = 100, Ot = 120, kt = 1e3;
-function At(e) {
-	let t = /* @__PURE__ */ new Set(), n = 0, r = 0, i = 0, a = Gt(e.maximumRenderTaskCount, Tt), o = Math.min(Gt(e.maximumConcurrentRenderTasks, 24), a), s = Gt(e.maximumMountedPreviewSessions, 32), c = Math.min(Kt(e.minimumVisibleRenderTasks, 0), o);
-	for (let l of Ft(e)) if (!t.has(l.sessionId)) {
-		if (l.currentlyMounted && !l.active) {
-			if (t.size >= s) continue;
-			t.add(l.sessionId);
-			continue;
-		}
-		if (!(l.needsRenderTask && (r += 1, r > a))) {
-			if (jt(l)) {
-				if (!Mt(l, {
-					concurrentRenderTasks: n,
-					maximumConcurrentRenderTasks: o,
-					minimumVisibleRenderTasks: c,
-					visibleRenderTasks: i
-				})) continue;
-				n += 1, l.visible && (i += 1);
-			}
-			!l.visible && t.size >= s || t.add(l.sessionId);
-		}
-	}
-	return t;
-}
-function jt(e) {
-	return e.active || e.needsRenderTask;
-}
-function Mt(e, t) {
-	return !jt(e) || e.visible && e.active || e.visible && t.visibleRenderTasks < t.minimumVisibleRenderTasks ? !0 : t.concurrentRenderTasks < t.maximumConcurrentRenderTasks;
-}
-function Nt(e, t = At(e)) {
-	let n = /* @__PURE__ */ new Set();
-	for (let r of Ft(e)) r.visible && t.has(r.sessionId) && n.add(r.sessionId);
-	return n;
-}
-function Pt(e) {
-	return {
-		activeRenderTimeoutMilliseconds: G(e, [
-			"previewQueueActiveRenderTimeoutMilliseconds",
-			"previewQueueActiveRenderTimeout",
-			"queueActiveRenderTimeout",
-			"previewQueueActiveTimeout",
-			"queueActiveTimeout"
-		]),
-		bufferRenderDelayMilliseconds: K(e, [
-			"previewQueueBufferRenderDelayMilliseconds",
-			"previewQueueBufferRenderDelay",
-			"queueBufferRenderDelay",
-			"previewQueueBufferDelay",
-			"previewRenderBufferDelay",
-			"previewBufferDelay",
-			"queueBufferDelay",
-			"bufferDelay"
-		]),
-		renderDebounceMilliseconds: K(e, [
-			"previewQueueRenderDebounceMilliseconds",
-			"previewQueueRenderDebounce",
-			"queueRenderDebounce",
-			"previewQueueDebounce",
-			"previewRenderDebounce",
-			"previewDebounce",
-			"queueDebounce",
-			"debounce"
-		]),
-		maximumConcurrentRenderTasks: G(e, [
-			"previewQueueMaximumConcurrentRenderTasks",
-			"queueMaximumConcurrentRenderTasks",
-			"maximumConcurrentRenderTasks",
-			"previewQueueActive",
-			"queueActive"
-		]),
-		maximumConcurrentRenderTasksDuringCanvasMovement: G(e, [
-			"previewQueueMaximumConcurrentRenderTasksDuringCanvasMovement",
-			"queueMaximumConcurrentRenderTasksDuringCanvasMovement",
-			"maximumConcurrentRenderTasksDuringCanvasMovement"
-		]),
-		minimumVisibleRenderTasksDuringCanvasMovement: K(e, [
-			"previewQueueMinimumVisibleRenderTasksDuringCanvasMovement",
-			"queueMinimumVisibleRenderTasksDuringCanvasMovement",
-			"minimumVisibleRenderTasksDuringCanvasMovement",
-			"previewQueueVisibleRenderFloor",
-			"queueVisibleRenderFloor"
-		]),
-		renderBufferMargin: K(e, [
-			"previewQueueRenderBufferMargin",
-			"queueRenderBufferMargin",
-			"previewRenderBufferMargin",
-			"previewQueueBuffer",
-			"queueBuffer",
-			"previewBuffer"
-		]),
-		maximumRenderTaskCount: G(e, [
-			"previewQueueMaximumRenderTaskCount",
-			"queueMaximumRenderTaskCount",
-			"maximumRenderTaskCount",
-			"previewQueueSafety",
-			"queueSafety",
-			"previewQueueLength",
-			"queueLength"
-		]),
-		maximumMountedPreviewSessions: G(e, [
-			"previewQueueMaximumMountedPreviewSessions",
-			"queueMaximumMountedPreviewSessions",
-			"maximumMountedPreviewSessions",
-			"previewQueueMounted",
-			"queueMounted"
-		]),
-		renderThrottleMilliseconds: K(e, [
-			"previewQueueRenderThrottleMilliseconds",
-			"previewQueueRenderThrottle",
-			"queueRenderThrottle",
-			"previewQueueThrottle",
-			"previewRenderThrottle",
-			"previewThrottle",
-			"queueThrottle",
-			"throttle"
-		])
-	};
-}
-function Ft(e) {
-	let t = e.currentSessionIds ?? /* @__PURE__ */ new Set(), n = e.completedSessionIds ?? /* @__PURE__ */ new Set(), r = e.activeSessionIds ?? /* @__PURE__ */ new Set(), i = Kt(e.renderBufferMargin, yt), a = e.includeBufferedRenderTasks !== !1, o = Bt(e.canvasMovement), s = [], c = [];
-	return e.items.forEach((l, u) => {
-		let d = l.sessionIds.some((e) => t.has(e)), f = bt(e.canvas, l.rect), p = d || a ? i : 0;
-		if (!xt(f, e.viewport, p)) return;
-		let m = Wt(f, e.viewport), h = m > 0 ? Ut(f, e.viewport) : zt(f, e.viewport), g = l.sessionIds.map((i, a) => {
-			let s = t.has(i), c = n.has(i);
-			return {
-				active: r.has(i),
-				cardIndex: u,
-				completed: c,
-				currentlyMounted: s,
-				...Vt(f, e.viewport, o),
-				distance: h,
-				intersectionArea: m,
-				needsRenderTask: !s,
-				sessionId: i,
-				sessionIndex: a,
-				visible: m > 0
-			};
-		});
-		g.length !== 0 && (m > 0 ? s.push(g) : c.push(g));
-	}), [...Rt(s, It), ...Rt(c, Lt)];
-}
-function It(e, t) {
-	return e.distance - t.distance || t.intersectionArea - e.intersectionArea || Number(t.currentlyMounted) - Number(e.currentlyMounted) || Number(t.completed) - Number(e.completed) || e.cardIndex - t.cardIndex || e.sessionIndex - t.sessionIndex;
-}
-function Lt(e, t) {
-	return e.directionRank - t.directionRank || e.distance - t.distance || e.directionOffset - t.directionOffset || Number(t.currentlyMounted) - Number(e.currentlyMounted) || Number(t.completed) - Number(e.completed) || e.cardIndex - t.cardIndex || e.sessionIndex - t.sessionIndex;
-}
-function Rt(e, t) {
-	let n = e.sort((e, n) => t(e[0], n[0])), r = [], i = Math.max(0, ...n.map((e) => e.length));
-	for (let e = 0; e < i; e += 1) for (let t of n) {
-		let n = t[e];
-		n && r.push(n);
-	}
-	return r;
-}
-function zt(e, t) {
-	let n = e.right < t.left ? t.left - e.right : e.left > t.right ? e.left - t.right : 0, r = e.bottom < t.top ? t.top - e.bottom : e.top > t.bottom ? e.top - t.bottom : 0;
-	return Math.hypot(n, r);
-}
-function Bt(e) {
-	if (!e) return;
-	let t = Math.hypot(e.x, e.y);
-	if (!(t < .001)) return {
-		x: -e.x / t,
-		y: -e.y / t
-	};
-}
-function Vt(e, t, n) {
-	if (!n) return {
-		directionOffset: 0,
-		directionRank: 0
-	};
-	let r = Ht(e, t), i = r.x * n.x + r.y * n.y;
-	return {
-		directionOffset: Math.abs(r.x * n.y - r.y * n.x),
-		directionRank: i > 0 ? 0 : 1
-	};
-}
-function Ht(e, t) {
-	let n = (e.left + e.right) / 2, r = (e.top + e.bottom) / 2, i = (t.left + t.right) / 2, a = (t.top + t.bottom) / 2;
-	return {
-		x: n - i,
-		y: r - a
-	};
-}
-function Ut(e, t) {
-	let n = Ht(e, t);
-	return Math.hypot(n.x, n.y);
-}
-function Wt(e, t) {
-	return Math.max(0, Math.min(e.right, t.right) - Math.max(e.left, t.left)) * Math.max(0, Math.min(e.bottom, t.bottom) - Math.max(e.top, t.top));
-}
-function Gt(e, t) {
-	return typeof e == "number" && Number.isFinite(e) && e > 0 ? Math.floor(e) : t;
-}
-function Kt(e, t) {
-	return typeof e == "number" && Number.isFinite(e) && e >= 0 ? Math.floor(e) : t;
-}
-function G(e, t) {
-	for (let n of t) {
-		let t = e.get(n);
-		if (!t) continue;
-		let r = Number(t);
-		if (Number.isFinite(r) && r > 0) return Math.floor(r);
-	}
-}
-function K(e, t) {
-	for (let n of t) {
-		let t = e.get(n);
-		if (!t) continue;
-		let r = Number(t);
-		if (Number.isFinite(r) && r >= 0) return Math.floor(r);
-	}
-}
-//#endregion
-//#region src/studio-canvas-transform-event.ts
-var qt = "gtsx:studio-canvas-transform-changed";
-function Jt(e) {
-	typeof window > "u" || window.dispatchEvent(new CustomEvent(qt, { detail: e }));
-}
-//#endregion
-//#region src/preview-iframe-pool.tsx
-var Yt = a.createContext(null), Xt = 48, Zt = 48, Qt = 0, $t = 250, en = 12, tn = typeof window > "u" ? a.useEffect : a.useLayoutEffect;
-function nn(e) {
-	let t = a.useRef(null), n = a.useRef([]), r = a.useRef(0), i = a.useRef(0), o = a.useRef(0), l = a.useRef(0), u = a.useRef(0), d = a.useRef(0), f = a.useRef(0), p = a.useRef(0), m = a.useRef(0), h = a.useRef(0), g = a.useRef(0), _ = a.useRef(0), v = a.useRef(0), y = a.useRef(0), [b, x] = a.useState({
-		active: 0,
-		borrows: 0,
-		created: 0,
-		directRenderPosts: 0,
-		idle: 0,
-		newBorrows: 0,
-		acceptedRenderPosts: 0,
-		postMessageRenderPosts: 0,
-		readyIdle: 0,
-		renderEndpointWaits: 0,
-		redeliveredRenderPosts: 0,
-		renderPosts: 0,
-		reusedBorrows: 0,
-		total: 0
-	}), S = e.maximumIdleFrames ?? Xt, C = e.minimumIdleReserveFrames ?? Qt, w = e.maximumRetainedFrames ?? Zt, T = a.useCallback(() => {
-		e.debug && (d.current ||= window.requestAnimationFrame(() => {
-			d.current = 0, x(jn(n.current, {
-				acceptedRenderPosts: p.current,
-				borrows: r.current,
-				created: i.current,
-				directRenderPosts: m.current,
-				newBorrows: o.current,
-				postMessageRenderPosts: h.current,
-				redeliveredRenderPosts: g.current,
-				renderEndpointWaits: _.current,
-				renderPosts: v.current,
-				reusedBorrows: y.current
-			}));
-		}));
-	}, [e.debug]), E = a.useCallback((e, t = {}) => {
-		if (!e.pendingInput) return;
-		let n = bn(e.pendingInput);
-		if (!xn(e, n, t)) return;
-		let r = Ve(e.pendingInput.slot.previewUrl, e.pendingInput.slot.sessionId), i = yn(e.frame);
-		if (!i) {
-			_.current += 1, wn(e, n, E), T();
-			return;
-		}
-		i.render(r), e.pendingRenderDeliveryAttemptCount = Sn(e, n), e.lastPostedRenderKey = n, e.lastRenderedSessionId = r.sessionId ?? e.pendingInput.slot.sessionId, e.frame.dataset.gtsxPreviewPoolLastRenderSessionId = r.sessionId ?? "", e.frame.dataset.gtsxPreviewPoolRenderDeliveryAttemptCount = String(e.pendingRenderDeliveryAttemptCount), i.transport === "direct" ? m.current += 1 : h.current += 1, v.current += 1, t.redelivery && (g.current += 1), Cn(e, n, E), T();
-	}, [T]), D = a.useCallback((e) => {
-		e.ready && E(e);
-	}, [E]), O = a.useCallback(() => {
-		let t = document.createElement("iframe"), r = {
-			frame: t,
-			id: l.current++,
-			poolUrl: e.poolUrl,
-			ready: !1
-		};
-		return i.current += 1, t.setAttribute("aria-hidden", "true"), t.dataset.gtsxPooledPreviewFrame = "true", t.dataset.gtsxPreviewPoolReady = "false", t.loading = "eager", t.tabIndex = -1, Object.assign(t.style, {
-			background: "transparent",
-			border: "0",
-			height: "0",
-			left: "0",
-			pointerEvents: "none",
-			position: "fixed",
-			top: "0",
-			transformOrigin: "0 0",
-			visibility: "hidden",
-			width: "0",
-			zIndex: "1"
-		}), t.src = e.poolUrl, n.current.push(r), T(), r;
-	}, [e.poolUrl, T]), ee = a.useCallback(() => {
-		let e = t.current;
-		if (!e) return;
-		let n = O();
-		e.appendChild(n.frame);
-	}, [O]), k = a.useCallback(() => {
-		C <= 0 || t.current && (n.current.length >= w || Nn(n.current) >= C || ee());
-	}, [
-		ee,
-		w,
-		C
-	]), A = a.useCallback(() => {
-		typeof window > "u" || (f.current ||= window.requestAnimationFrame(() => {
-			f.current = 0, k();
-		}));
-	}, [k]), j = a.useCallback((t) => {
-		let r = sn(n.current, {
-			maximumRetainedFrames: w,
-			poolUrl: e.poolUrl,
-			sessionId: t.slot.sessionId
-		});
-		return r ? {
-			entry: r,
-			origin: "pool"
-		} : {
-			entry: O(),
-			origin: "new"
-		};
-	}, [
-		O,
-		w,
-		e.poolUrl
-	]), te = a.useCallback(() => {
-		let e = n.current.filter((e) => !e.owner), t = Math.max(0, e.length - S, n.current.length - w);
-		if (t <= 0) return;
-		let r = new Set(e.slice(0, t).map((e) => e.id));
-		n.current = n.current.filter((e) => r.has(e.id) ? (Y(e), e.frame.remove(), !1) : !0);
-	}, [S, w]), ne = a.useCallback(() => {
-		for (let e of n.current) e.owner && ln(e);
-	}, []), M = a.useCallback(() => {
-		u.current ||= window.requestAnimationFrame(() => {
-			u.current = 0, ne();
-		});
-	}, [ne]), re = a.useCallback((e, n) => {
-		let { entry: i, origin: a } = j(n), s = Symbol(n.slot.sessionId), c = t.current;
-		return r.current += 1, a === "new" ? o.current += 1 : y.current += 1, i.owner = s, i.container = e, c && i.frame.parentElement !== c && c.appendChild(i.frame), mn(i, n, D), T(), A(), M(), {
-			origin: a,
-			update(t) {
-				i.owner === s && (i.container = e, mn(i, t, D), M());
-			},
-			release() {
-				i.owner === s && (i.pendingInput?.onPreviewFrameMount?.(i.pendingInput.slot.sessionId, null), gn(i), i.owner = void 0, i.container = void 0, i.currentSessionId = void 0, i.pendingInput = void 0, Y(i), un(i), te(), T(), A());
-			}
-		};
-	}, [
-		j,
-		D,
-		te,
-		T,
-		M,
-		A
-	]);
-	a.useEffect(() => {
-		e.debug && x(jn(n.current, {
-			acceptedRenderPosts: p.current,
-			borrows: r.current,
-			created: i.current,
-			directRenderPosts: m.current,
-			newBorrows: o.current,
-			postMessageRenderPosts: h.current,
-			redeliveredRenderPosts: g.current,
-			renderEndpointWaits: _.current,
-			renderPosts: v.current,
-			reusedBorrows: y.current
-		}));
-	}, [e.debug]), a.useEffect(() => {
-		let e = () => M();
-		return window.addEventListener("resize", e), window.addEventListener("scroll", e, !0), window.addEventListener(qt, e), () => {
-			window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0), window.removeEventListener(qt, e);
-		};
-	}, [M]), a.useEffect(() => {
-		let e = (e) => {
-			if (On(e.data)) {
-				let t = n.current.find((t) => t.frame.contentWindow === e.source);
-				if (!t) return;
-				t.ready = !0, t.frame.dataset.gtsxPreviewPoolReady = "true", T(), A(), Y(t), E(t);
-				return;
-			}
-			if (kn(e.data)) {
-				let t = n.current.find((t) => t.frame.contentWindow === e.source);
-				if (!t || t.pendingInput?.slot.sessionId !== e.data.sessionId) return;
-				t.lastAcceptedRenderSessionId = e.data.sessionId, t.frame.dataset.gtsxPreviewPoolLastAcceptedRenderSessionId = e.data.sessionId, En(t), p.current += 1, T();
-				return;
-			}
-			if (An(e.data)) {
-				let t = n.current.find((t) => t.frame.contentWindow === e.source);
-				if (!t || t.pendingInput?.slot.sessionId !== e.data.sessionId) return;
-				t.lastCompletedSessionId = e.data.sessionId, t.lastCompletedPreviewUrl = t.pendingInput.slot.previewUrl, t.lastCompletedSize = t.pendingInput.size, Y(t), t.frame.style.opacity = "1";
-			}
-		};
-		return window.addEventListener("message", e), () => window.removeEventListener("message", e);
-	}, [
-		E,
-		T,
-		A
-	]), a.useEffect(() => {
-		A();
-	}, [A]), a.useEffect(() => () => {
-		for (let e of n.current) Y(e), e.frame.remove();
-		d.current && window.cancelAnimationFrame(d.current), u.current && window.cancelAnimationFrame(u.current), f.current && window.cancelAnimationFrame(f.current), n.current = [];
-	}, []);
-	let ie = a.useMemo(() => ({ borrow: re }), [re]);
-	return /* @__PURE__ */ c(Yt.Provider, {
-		value: ie,
-		children: [
-			e.children,
-			/* @__PURE__ */ s("div", {
-				"aria-hidden": "true",
-				"data-gtsx-preview-iframe-pool": "true",
-				ref: t,
-				style: {
-					inset: 0,
-					overflow: "visible",
-					pointerEvents: "none",
-					position: "fixed",
-					zIndex: 2
-				}
-			}),
-			e.debug ? /* @__PURE__ */ s(Pn, { stats: b }) : null
-		]
-	});
-}
-function rn(e) {
-	let t = on(), n = a.useRef(null), r = a.useRef(null), i = a.useRef(null), o = a.useRef(e.onPreviewFrameMount), c = a.useRef(e.onBorrowOriginChange);
-	o.current = e.onPreviewFrameMount, c.current = e.onBorrowOriginChange;
-	let l = a.useMemo(() => ({
-		size: e.size,
-		slot: e.slot,
-		onPreviewFrameMount(e, t, n) {
-			o.current?.(e, t, n);
-		}
-	}), [
-		e.size.height,
-		e.size.width,
-		e.slot.previewUrl,
-		e.slot.sessionId,
-		e.slot.title
-	]);
-	return r.current = l, tn(() => {
-		if (!t || !n.current) return;
-		let e = r.current;
-		if (!e) return;
-		let a = t.borrow(n.current, e);
-		return i.current = a, c.current?.(a.origin), () => an(i, c);
-	}, [t]), tn(() => {
-		i.current?.update(l), i.current && c.current?.(i.current.origin);
-	}, [l]), t ? /* @__PURE__ */ s("div", {
-		"data-gtsx-pooled-preview-slot": e.slot.sessionId,
-		ref: n,
-		style: {
-			height: e.size.height,
-			left: 0,
-			pointerEvents: "none",
-			position: "absolute",
-			top: 0,
-			width: e.size.width,
-			zIndex: 1
-		}
-	}) : null;
-}
-function an(e, t) {
-	t.current?.(null), e.current?.release(), e.current = null;
-}
-function on() {
-	return a.useContext(Yt);
-}
-function sn(e, t) {
-	let n = e.filter((e) => !e.owner && e.poolUrl === t.poolUrl), r = n.find((e) => e.ready && e.lastRenderedSessionId === t.sessionId);
-	if (r) return r;
-	let i = n.find((e) => e.ready && !e.lastRenderedSessionId);
-	if (i) return i;
-	let a = n.find((e) => e.ready);
-	if (a) return a;
-}
-function q(e) {
-	return typeof e == "number" ? `${e}px` : e;
-}
-function cn(e) {
-	if (e.anchorRect.width <= 0 || e.anchorRect.height <= 0) return dn(e.layoutSize);
-	let t = fn(e.layoutSize.width, e.anchorRect.width), n = fn(e.layoutSize.height, e.anchorRect.height), r = t > 0 ? e.anchorRect.width / t : 1, i = n > 0 ? e.anchorRect.height / n : 1, a = Math.max(0, e.clipRect.top - e.anchorRect.top) / i, o = Math.max(0, e.anchorRect.right - e.clipRect.right) / r, s = Math.max(0, e.anchorRect.bottom - e.clipRect.bottom) / i, c = Math.max(0, e.clipRect.left - e.anchorRect.left) / r;
-	return {
-		clipPath: `inset(${J(a)}px ${J(o)}px ${J(s)}px ${J(c)}px)`,
-		height: `${J(n)}px`,
-		transform: `translate3d(${J(e.anchorRect.left)}px, ${J(e.anchorRect.top)}px, 0) scale(${pn(r)}, ${pn(i)})`,
-		visibility: "visible",
-		width: `${J(t)}px`
-	};
-}
-function ln(e) {
-	let t = e.pendingInput, n = e.container;
-	if (!t || !n?.isConnected) {
-		un(e);
-		return;
-	}
-	let r = n.getBoundingClientRect(), i = n.closest("[data-gtsx-preview-clip]"), a = i instanceof HTMLElement ? i.getBoundingClientRect() : r;
-	Object.assign(e.frame.style, cn({
-		anchorRect: r,
-		clipRect: a,
-		layoutSize: t.size
-	}));
-}
-function un(e) {
-	Object.assign(e.frame.style, dn(e.pendingInput?.size ?? {
-		width: 0,
-		height: 0
-	}));
-}
-function dn(e) {
-	return {
-		clipPath: "inset(0px)",
-		height: q(e.height),
-		transform: "translate3d(-100000px, -100000px, 0)",
-		visibility: "hidden",
-		width: q(e.width)
-	};
-}
-function fn(e, t) {
-	if (typeof e == "number" && Number.isFinite(e) && e > 0) return e;
-	if (typeof e == "string" && e.endsWith("px")) {
-		let t = Number(e.slice(0, -2));
-		if (Number.isFinite(t) && t > 0) return t;
-	}
-	return Math.max(0, t);
-}
-function J(e) {
-	return Math.round(e * 100) / 100;
-}
-function pn(e) {
-	return Math.round(e * 1e4) / 1e4;
-}
-function mn(e, t, n) {
-	let r = e.pendingInput, i = r?.slot.sessionId, a = t.slot.sessionId, o = _n(e, t), s = Dn(r, t);
-	e.currentSessionId = a, e.pendingInput = t, hn(e, t), e.frame.title = t.slot.title, e.frame.style.height = q(t.size.height), e.frame.style.width = q(t.size.width), ln(e), o && (e.frame.style.opacity = "1"), i !== a && (o ? e.frame.dataset.gtsxPreviewPoolLastRenderSessionId = a : delete e.frame.dataset.gtsxPreviewPoolLastRenderSessionId, i && r?.onPreviewFrameMount?.(i, null), t.onPreviewFrameMount?.(a, e.frame, { retainedRender: o })), s && !o && (vn(e), Y(e), e.frame.style.opacity = "0", n(e));
-}
-function hn(e, t) {
-	e.frame.dataset.gtsxPreviewPoolEntryId = String(e.id), e.frame.dataset.gtsxPreviewPoolLeaseSessionId = t.slot.sessionId, e.frame.dataset.gtsxPreviewPoolReady = e.ready ? "true" : "false";
-}
-function gn(e) {
-	delete e.frame.dataset.gtsxPreviewPoolLeaseSessionId, delete e.frame.dataset.gtsxPreviewPoolLastAcceptedRenderSessionId, delete e.frame.dataset.gtsxPreviewPoolLastRenderSessionId, delete e.frame.dataset.gtsxPreviewPoolRenderDeliveryAttemptCount;
-}
-function _n(e, t) {
-	return e.lastCompletedSessionId === t.slot.sessionId && e.lastCompletedPreviewUrl === t.slot.previewUrl && e.lastCompletedSize?.height === t.size.height && e.lastCompletedSize.width === t.size.width;
-}
-function vn(e) {
-	delete e.lastCompletedSessionId, delete e.lastCompletedPreviewUrl, delete e.lastCompletedSize;
-}
-function yn(e) {
-	let n = e.contentWindow;
-	if (n) try {
-		let e = n.__gtsxPreviewRenderTargetMailbox;
-		return e ? {
-			render: e.render,
-			transport: "direct"
-		} : void 0;
-	} catch {
-		return {
-			render(e) {
-				n.postMessage(t(e), "*");
-			},
-			transport: "postMessage"
-		};
-	}
-}
-function bn(e) {
-	return JSON.stringify({
-		height: e.size.height,
-		previewUrl: e.slot.previewUrl,
-		sessionId: e.slot.sessionId,
-		width: e.size.width
-	});
-}
-function xn(e, t, n = {}) {
-	return n.force ? !0 : e.lastPostedRenderKey !== t;
-}
-function Sn(e, t) {
-	return e.lastPostedRenderKey === t ? (e.pendingRenderDeliveryAttemptCount ?? 0) + 1 : 1;
-}
-function Cn(e, t, n) {
-	En(e), !((e.pendingRenderDeliveryAttemptCount ?? 0) >= en) && (e.pendingRenderRedeliveryTimeout = window.setTimeout(() => {
-		e.pendingRenderRedeliveryTimeout = void 0, e.pendingInput && bn(e.pendingInput) === t && (_n(e, e.pendingInput) || n(e, {
-			force: !0,
-			redelivery: !0
-		}));
-	}, $t));
-}
-function wn(e, t, n) {
-	Tn(e), e.pendingRenderEndpointRetryTimeout = window.setTimeout(() => {
-		e.pendingRenderEndpointRetryTimeout = void 0, e.pendingInput && bn(e.pendingInput) === t && (_n(e, e.pendingInput) || n(e, { force: !0 }));
-	}, 50);
-}
-function Tn(e) {
-	e.pendingRenderEndpointRetryTimeout &&= (window.clearTimeout(e.pendingRenderEndpointRetryTimeout), void 0);
-}
-function En(e) {
-	e.pendingRenderRedeliveryTimeout &&= (window.clearTimeout(e.pendingRenderRedeliveryTimeout), void 0);
-}
-function Y(e) {
-	Tn(e), En(e), delete e.lastPostedRenderKey, delete e.pendingRenderDeliveryAttemptCount, delete e.frame.dataset.gtsxPreviewPoolRenderDeliveryAttemptCount;
-}
-function Dn(e, t) {
-	return !e || e.slot.sessionId !== t.slot.sessionId || e.slot.previewUrl !== t.slot.previewUrl || e.size.height !== t.size.height || e.size.width !== t.size.width;
-}
-function On(e) {
-	return typeof e == "object" && !!e && e.type === "gtsx:pool-ready" && e.protocolVersion === 1;
-}
-function kn(e) {
-	return typeof e == "object" && !!e && e.type === "gtsx:render-accepted" && e.protocolVersion === 1 && typeof e.sessionId == "string";
-}
-function An(e) {
-	return typeof e == "object" && !!e && (e.type === "gtsx:ready" || e.type === "gtsx:error") && typeof e.sessionId == "string";
-}
-function jn(e, t) {
-	let n = e.filter((e) => e.owner).length;
-	return {
-		active: n,
-		acceptedRenderPosts: t.acceptedRenderPosts,
-		borrows: t.borrows,
-		created: t.created,
-		directRenderPosts: t.directRenderPosts,
-		idle: e.length - n,
-		newBorrows: t.newBorrows,
-		postMessageRenderPosts: t.postMessageRenderPosts,
-		readyIdle: Mn(e),
-		redeliveredRenderPosts: t.redeliveredRenderPosts,
-		renderEndpointWaits: t.renderEndpointWaits,
-		renderPosts: t.renderPosts,
-		reusedBorrows: t.reusedBorrows,
-		total: e.length
-	};
-}
-function Mn(e) {
-	return e.filter((e) => !e.owner && e.ready).length;
-}
-function Nn(e) {
-	return e.filter((e) => !e.owner).length;
-}
-function Pn(e) {
-	return /* @__PURE__ */ c("div", {
-		"aria-label": "Preview iframe pool stats",
-		"data-gtsx-preview-iframe-pool-stats": "true",
-		"data-gtsx-preview-iframe-pool-active": e.stats.active,
-		"data-gtsx-preview-iframe-pool-borrows": e.stats.borrows,
-		"data-gtsx-preview-iframe-pool-created": e.stats.created,
-		"data-gtsx-preview-iframe-pool-direct-render-posts": e.stats.directRenderPosts,
-		"data-gtsx-preview-iframe-pool-idle": e.stats.idle,
-		"data-gtsx-preview-iframe-pool-new-borrows": e.stats.newBorrows,
-		"data-gtsx-preview-iframe-pool-post-message-render-posts": e.stats.postMessageRenderPosts,
-		"data-gtsx-preview-iframe-pool-accepted-render-posts": e.stats.acceptedRenderPosts,
-		"data-gtsx-preview-iframe-pool-ready-idle": e.stats.readyIdle,
-		"data-gtsx-preview-iframe-pool-render-endpoint-waits": e.stats.renderEndpointWaits,
-		"data-gtsx-preview-iframe-pool-redelivered-render-posts": e.stats.redeliveredRenderPosts,
-		"data-gtsx-preview-iframe-pool-render-posts": e.stats.renderPosts,
-		"data-gtsx-preview-iframe-pool-reused-borrows": e.stats.reusedBorrows,
-		"data-gtsx-preview-iframe-pool-total": e.stats.total,
-		style: {
-			background: "rgba(255,255,255,0.9)",
-			border: "1px solid rgba(216,222,232,0.95)",
-			borderRadius: 6,
-			bottom: 12,
-			boxShadow: "0 6px 20px rgba(31,35,40,0.12)",
-			color: "#1f2328",
-			display: "flex",
-			fontFamily: "ui-monospace, SFMono-Regular, Menlo, monospace",
-			fontSize: 11,
-			gap: 8,
-			left: 12,
-			lineHeight: 1.3,
-			padding: "6px 8px",
-			pointerEvents: "none",
-			position: "fixed",
-			zIndex: 10
-		},
-		children: [
-			/* @__PURE__ */ c("span", { children: ["pool ", e.stats.total] }),
-			/* @__PURE__ */ c("span", { children: ["active ", e.stats.active] }),
-			/* @__PURE__ */ c("span", { children: ["idle ", e.stats.idle] }),
-			/* @__PURE__ */ c("span", { children: ["ready idle ", e.stats.readyIdle] }),
-			/* @__PURE__ */ c("span", { children: ["created ", e.stats.created] }),
-			/* @__PURE__ */ c("span", { children: ["borrow ", e.stats.borrows] }),
-			/* @__PURE__ */ c("span", { children: ["new ", e.stats.newBorrows] }),
-			/* @__PURE__ */ c("span", { children: ["reuse ", e.stats.reusedBorrows] }),
-			/* @__PURE__ */ c("span", { children: ["render ", e.stats.renderPosts] }),
-			/* @__PURE__ */ c("span", { children: ["direct ", e.stats.directRenderPosts] }),
-			/* @__PURE__ */ c("span", { children: ["postMessage ", e.stats.postMessageRenderPosts] }),
-			/* @__PURE__ */ c("span", { children: ["wait endpoint ", e.stats.renderEndpointWaits] }),
-			/* @__PURE__ */ c("span", { children: ["accepted ", e.stats.acceptedRenderPosts] }),
-			/* @__PURE__ */ c("span", { children: ["redelivered ", e.stats.redeliveredRenderPosts] })
-		]
-	});
-}
-//#endregion
-//#region src/studio-preview-message-flush.ts
-function Fn(e) {
-	let t = /* @__PURE__ */ new Set(), n = [], r = [];
-	for (let i of e.messages) {
-		if (!In(i.message)) {
-			r.push(i);
-			continue;
-		}
-		let a = Rn(i.message);
-		t.has(a) || (t.add(a), !Ln(e.getFrameState(i.message.sessionId), i.message) && (r.push(i), n.push(i)));
-	}
-	return {
-		completionMessages: n,
-		messagesToApply: r
-	};
-}
-function In(e) {
-	return e.type === "gtsx:ready" || e.type === "gtsx:error";
-}
-function Ln(e, t) {
-	return e ? t.type === "gtsx:ready" ? e.ready === !0 && !e.error : e.error?.message === t.error.message && e.error.stack === t.error.stack : !1;
-}
-function Rn(e) {
-	return e.type === "gtsx:ready" ? `${e.sessionId}\n${e.type}` : `${e.sessionId}\n${e.type}\n${e.error.message}\n${e.error.stack ?? ""}`;
-}
-//#endregion
-//#region src/preview-render-session-store.tsx
-var zn = a.createContext(null);
-function Bn(e = /* @__PURE__ */ new Set()) {
-	let t = new Set(e), n = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map(), a = (e, t) => {
-		let n = e.get(t);
-		if (n) for (let e of n) e();
-	};
-	return {
-		getSessionIds() {
-			return t;
-		},
-		hasSessionId(e) {
-			return t.has(e);
-		},
-		isVisibleSessionId(e) {
-			return n.has(e);
-		},
-		setSessionIds(e, o = /* @__PURE__ */ new Set()) {
-			if (Gn(t, e) && Gn(n, o)) return !1;
-			let s = t, c = n;
-			t = new Set(e), n = new Set(o);
-			let l = /* @__PURE__ */ new Set();
-			for (let e of s) t.has(e) || l.add(e);
-			for (let e of t) s.has(e) || l.add(e);
-			let u = /* @__PURE__ */ new Set();
-			for (let e of c) n.has(e) || u.add(e);
-			for (let e of n) c.has(e) || u.add(e);
-			for (let e of l) a(r, e);
-			for (let e of u) a(i, e);
-			return !0;
-		},
-		subscribeToRenderSession(e, t) {
-			return Vn(r, e, t);
-		},
-		subscribeToVisibleSession(e, t) {
-			return Vn(i, e, t);
-		}
-	};
-}
-function Vn(e, t, n) {
-	let r = e.get(t);
-	return r || (r = /* @__PURE__ */ new Set(), e.set(t, r)), r.add(n), () => {
-		let r = e.get(t);
-		r && (r.delete(n), r.size === 0 && e.delete(t));
-	};
-}
-function Hn(e) {
-	return /* @__PURE__ */ s(zn.Provider, {
-		value: e.store,
-		children: e.children
-	});
-}
-function Un(e, t = !0) {
-	let n = a.useContext(zn);
-	return a.useSyncExternalStore(a.useCallback((r) => t ? n?.subscribeToVisibleSession(e, r) ?? (() => {}) : () => {}, [
-		t,
-		e,
-		n
-	]), a.useCallback(() => t ? n?.isVisibleSessionId(e) ?? !1 : !1, [
-		t,
-		e,
-		n
-	]), () => !1);
-}
-function Wn(e) {
-	let t = a.useContext(zn);
-	return a.useSyncExternalStore(a.useCallback((n) => t?.subscribeToRenderSession(e, n) ?? (() => {}), [e, t]), a.useCallback(() => t?.hasSessionId(e) ?? !1, [e, t]), () => !1);
-}
-function Gn(e, t) {
-	if (e.size !== t.size) return !1;
-	for (let n of e) if (!t.has(n)) return !1;
-	return !0;
-}
-//#endregion
-//#region src/case-grid-layout.ts
-var Kn = .18;
-function qn(e, t) {
-	let n = e === "desktop" ? 860 : e === "phone" ? 680 : 760;
-	return t <= 1 ? Math.min(n, 720) : n;
-}
-//#endregion
-//#region src/studio-component-preview-frame-states.ts
-function Jn(e, t, n, r, i) {
-	return Object.fromEntries(e.cases.map((a) => {
-		let o = z(e, a.name, t), s = B(e, a.name, t);
-		return [a.name, i ? i.getLayoutFrameState(o, s) : H(o, n?.[o], r?.[s]?.frameState)];
-	}));
-}
-function Yn(e, t, n, r, i) {
-	return Object.fromEntries(e.cases.map((a) => {
-		let o = z(e, a.name, t), s = B(e, a.name, t);
-		return [a.name, i ? i.getMergedFrameState(o, s) : H(o, n?.[o], r?.[s]?.frameState)];
-	}));
-}
-//#endregion
-//#region src/studio-canvas-geometry.ts
-function Xn(e) {
-	return {
-		bottom: e.bottom,
-		left: e.left,
-		right: e.right,
-		top: e.top
-	};
-}
-function Zn(e, t, n) {
-	return {
-		bottom: (e.bottom - t.top) / n,
-		left: (e.left - t.left) / n,
-		right: (e.right - t.left) / n,
-		top: (e.top - t.top) / n
-	};
-}
-function Qn(e) {
-	return `translate(${e.x}px, ${e.y}px) scale(${e.scale})`;
-}
-function $n(e, t, n) {
-	return [...e.selectedCoordinatePath.slice(0, t), n];
-}
-function er(e) {
-	return e.join("\n");
-}
-function tr(e, t) {
-	return `${e}\n${t}`;
-}
-function nr(e, t, n, r) {
-	return e.columns.map((e) => e.components.map((e) => e.cases.map((i) => {
-		let a = z(e, i.name, t), o = B(e, i.name, t), s = H(a, n?.[a], r?.[o]?.frameState);
-		return `${e.coordinate}:${i.name}:${dr(s)}`;
-	}).join(";")).join(",")).join("|");
-}
-function rr(e, t, n, r, i) {
-	let a = ze(e).map((e) => F({
-		caseChromeHeight: 21,
-		gap: 14,
-		items: sr(e, Jn(e, t, n, r, i), t),
-		maxSide: qn(t, e.cases.length),
-		minScale: Kn
-	}).previewScale);
-	return a.length > 0 ? Math.min(1, ...a) : 1;
-}
-function ir(e, t, n, r, i = {}) {
-	let a = [], o;
-	return e.columns.forEach((s, c) => {
-		let l = n[c] ?? {
-			x: 0,
-			y: 0
-		}, u = r[c]?.cardRectsByCoordinate ?? {}, d = r[c]?.previewFrameRectsBySessionId ?? {};
-		for (let n of s.components) {
-			let r = u[n.coordinate];
-			if (!r) continue;
-			let s = /* @__PURE__ */ new Set();
-			for (let e of n.cases) {
-				let r = z(n, e.name, t), i = d[r];
-				i && (s.add(r), a.push({
-					rect: {
-						bottom: l.y + i.bottom,
-						left: l.x + i.left,
-						right: l.x + i.right,
-						top: l.y + i.top
-					},
-					sessionIds: [r]
-				}));
-			}
-			s.size !== n.cases.length && (o ??= rr(e, t, i.frameStates, i.previewCache, i.previewGeometryStore), a.push(...cr({
-				cardRect: r,
-				casePreviewScale: o,
-				columnLayout: l,
-				component: n,
-				measuredSessionIds: s,
-				previewCache: i.previewCache,
-				previewGeometryStore: i.previewGeometryStore,
-				frameStates: i.frameStates,
-				viewportPreset: t
-			})));
-		}
-	}), a;
-}
-function ar(e, t) {
-	let n = Object.keys(e), r = Object.keys(t);
-	return n.length === r.length ? n.every((n) => {
-		let r = e[Number(n)], i = t[Number(n)];
-		return r?.x === i?.x && r?.y === i?.y;
-	}) : !1;
-}
-function or(e, t) {
-	let n = Object.keys(e), r = Object.keys(t);
-	return n.length === r.length ? n.every((n) => {
-		let r = Number(n), i = e[r], a = t[r];
-		return !i || !a || i.height !== a.height ? !1 : pr(i.cardRectsByCoordinate, a.cardRectsByCoordinate) && pr(i.previewFrameRectsBySessionId ?? {}, a.previewFrameRectsBySessionId ?? {});
-	}) : !1;
-}
-function sr(e, t, n) {
-	return e.cases.map((r) => {
-		let i = t[r.name], a = V(n, i?.size), o = Re(lr(i?.tree, e.coordinate), a);
-		return {
-			height: d(a, o),
-			width: Number(f(a, o))
-		};
-	});
-}
-function cr(e) {
-	let t = Jn(e.component, e.viewportPreset, e.frameStates, e.previewCache, e.previewGeometryStore), n = sr(e.component, t, e.viewportPreset), r = F({
-		caseChromeHeight: 21,
-		gap: 14,
-		items: n,
-		maxSide: qn(e.viewportPreset, e.component.cases.length),
-		minScale: Kn,
-		previewScale: e.casePreviewScale
-	}), i = e.cardRect.left, a = e.cardRect.bottom - r.height, o = [];
-	return e.component.cases.forEach((t, s) => {
-		let c = z(e.component, t.name, e.viewportPreset);
-		if (e.measuredSessionIds.has(c)) return;
-		let l = n[s];
-		if (!l) return;
-		let u = s % r.columns, d = Math.floor(s / r.columns), f = i + u * (r.cellWidth + r.gap), p = a + d * (r.cellHeight + r.gap), m = Math.ceil(l.width * r.previewScale), h = Math.ceil(l.height * r.previewScale), g = f + (r.cellWidth - m) / 2, _ = p + 21;
-		o.push({
-			rect: {
-				bottom: e.columnLayout.y + _ + h,
-				left: e.columnLayout.x + g,
-				right: e.columnLayout.x + g + m,
-				top: e.columnLayout.y + _
-			},
-			sessionIds: [c]
-		});
-	}), o;
-}
-function lr(e, t) {
-	return e ? ur(e, t)?.rect : void 0;
-}
-function ur(e, t) {
-	for (let n of e) {
-		if (n.coordinate === t) return n;
-		let e = ur(n.children, t);
-		if (e) return e;
-	}
-}
-function dr(e) {
-	return e ? `${e.size ? `${e.size.width}x${e.size.height}` : "-"}:${fr(e.tree)}` : "pending";
-}
-function fr(e) {
-	if (!e) return "-";
-	let t = [], n = (e) => {
-		let r = e.rect ? `${e.rect.x},${e.rect.y},${e.rect.width},${e.rect.height}` : "-";
-		t.push(`${e.coordinate}@${r}`);
-		for (let t of e.children) n(t);
-	};
-	for (let t of e) n(t);
-	return t.join(";");
-}
-function pr(e, t) {
-	let n = Object.keys(e), r = Object.keys(t);
-	return n.length === r.length ? n.every((n) => mr(e[n], t[n])) : !1;
-}
-function mr(e, t) {
-	return e?.bottom === t?.bottom && e?.left === t?.left && e?.right === t?.right && e?.top === t?.top;
-}
-//#endregion
-//#region src/studio-preview-render-observation.ts
-function hr(e) {
-	let t, n, r = 0, i = () => ({
-		fullRender: t ? yr(t) : void 0,
-		scrollResponse: n ? vr(n) : void 0,
-		sequence: r
-	});
-	return {
-		observePreviewTiming(a) {
-			let o = e.now(), s = !1;
-			return n && n.sessionIds.has(a.sessionId) && (s = _r(n, a.sessionId, o) || s), t && t.sessionIds.has(a.sessionId) && (s = _r(t, a.sessionId, o) || s), s && (r += 1), i();
-		},
-		observeQueueRun(a) {
-			let o = e.now();
-			if (a.renderBudget === "canvas-movement") {
-				let e = a.newVisibleSessionIds === void 0 ? a.visibleSessionIds ?? [] : a.newVisibleSessionIds;
-				(e.length > 0 || a.newVisibleSessionIds === void 0 && !n) && (n = gr(e, o));
-			}
-			if (a.renderBudget === "normal" && a.renderScope === "buffer") {
-				let e = a.newSessionIds === void 0 ? a.nextSessionIds ?? [] : a.newSessionIds;
-				(e.length > 0 || a.newSessionIds === void 0 && !t) && (t = gr(e, o));
-			}
-			return r += 1, i();
-		},
-		snapshot: i
-	};
-}
-function gr(e, t) {
-	return {
-		completedSessionIds: /* @__PURE__ */ new Set(),
-		sessionIds: new Set(e),
-		startedAtMilliseconds: t
-	};
-}
-function _r(e, t, n) {
-	if (e.completedSessionIds.has(t)) return !1;
-	e.completedSessionIds.add(t);
-	let r = Math.max(0, n - e.startedAtMilliseconds);
-	return e.firstCompletionMilliseconds ??= r, e.latestCompletionMilliseconds = r, !0;
-}
-function vr(e) {
-	return {
-		completedVisibleSessionCount: e.completedSessionIds.size,
-		firstVisibleCompletionMilliseconds: X(e.firstCompletionMilliseconds),
-		latestVisibleCompletionMilliseconds: X(e.latestCompletionMilliseconds),
-		pendingVisibleSessionCount: Math.max(0, e.sessionIds.size - e.completedSessionIds.size),
-		startedAtMilliseconds: X(e.startedAtMilliseconds) ?? 0,
-		visibleSessionCount: e.sessionIds.size
-	};
-}
-function yr(e) {
-	let t = X(e.latestCompletionMilliseconds);
-	return {
-		completedSessionCount: e.completedSessionIds.size,
-		firstCompletionMilliseconds: X(e.firstCompletionMilliseconds),
-		latestCompletionMilliseconds: t,
-		pendingSessionCount: Math.max(0, e.sessionIds.size - e.completedSessionIds.size),
-		renderCompletionsPerSecond: t && t > 0 ? br(e.completedSessionIds.size / (t / 1e3)) : void 0,
-		sessionCount: e.sessionIds.size,
-		startedAtMilliseconds: X(e.startedAtMilliseconds) ?? 0
-	};
-}
-function X(e) {
-	return typeof e == "number" && Number.isFinite(e) ? Math.round(e * 10) / 10 : void 0;
-}
-function br(e) {
-	return Math.round(e * 10) / 10;
-}
-//#endregion
-//#region src/use-studio-canvas-controller.ts
-var xr = typeof window > "u" ? a.useEffect : a.useLayoutEffect, Sr = 1500;
-function Cr(e) {
-	let [t, n] = a.useState(() => C()), [r, i] = a.useState(null), [o, s] = a.useState(null), c = e.canvas ?? t, l = a.useRef(c), u = a.useRef(null), d = a.useRef(null), f = a.useRef(null), p = a.useRef(e.onCanvasChange), m = a.useRef(e.onCanvasMove), h = a.useRef(e.onCanvasPanEnd), g = a.useRef(e.shouldHandleWheelTarget);
-	p.current = e.onCanvasChange, m.current = e.onCanvasMove, h.current = e.onCanvasPanEnd, g.current = e.shouldHandleWheelTarget;
-	let _ = a.useCallback((e) => {
-		let t = u.current;
-		t && (t.style.transform = Qn(e)), Jt(e);
-	}, []), v = a.useCallback((e) => {
-		let t = e(l.current);
-		Dr(l.current, t) || (l.current = t, _(t), m.current(t), p.current ? p.current(t) : n(t));
-	}, [_]), y = a.useCallback((e, t) => {
-		if (!o) return;
-		let n = o.getBoundingClientRect(), r = {
-			x: e - n.left,
-			y: t - n.top
-		};
-		Er(r, n) && (d.current = {
-			...r,
-			observedAtMilliseconds: Or()
-		});
-	}, [o]);
-	xr(() => {
-		Dr(l.current, c) || (l.current = c, _(c), m.current(c));
-	}, [c, _]);
-	let b = a.useCallback((e) => {
-		u.current = e, e && (e.style.transform = Qn(l.current)), i(e);
-	}, []), x = a.useCallback((e) => {
-		s(e);
-	}, []), S = a.useCallback((e) => {
-		f.current?.pointerId === e.pointerId && (f.current = null, h.current());
-	}, []), w = a.useCallback((e) => {
-		if (y(e.clientX, e.clientY), !e.target.closest("a,button,iframe")) {
-			f.current = {
-				pointerId: e.pointerId,
-				startX: e.clientX,
-				startY: e.clientY,
-				originX: l.current.x,
-				originY: l.current.y
-			};
-			try {
-				e.currentTarget.setPointerCapture(e.pointerId);
-			} catch {}
-		}
-	}, [y]), T = a.useCallback((e) => {
-		y(e.clientX, e.clientY);
-		let t = f.current;
-		!t || t.pointerId !== e.pointerId || v((n) => ({
-			...n,
-			x: t.originX + e.clientX - t.startX,
-			y: t.originY + e.clientY - t.startY
-		}));
-	}, [v, y]), E = a.useCallback((e) => {
-		y(e.clientX, e.clientY), f.current?.pointerId === e.pointerId && (f.current = null, h.current());
-	}, [y]);
-	return a.useEffect(() => {
-		if (!o) return;
-		let e = (e) => {
-			if (!g.current(e.target)) return;
-			e.preventDefault();
-			let t = o.getBoundingClientRect(), n = Tr(e, t), r = Or(), i = d.current, a = e.ctrlKey || e.metaKey ? wr({
-				eventViewportPoint: n,
-				lastKnownPointerAgeMilliseconds: i ? r - i.observedAtMilliseconds : void 0,
-				lastKnownPointerViewportPoint: i,
-				viewportSize: {
-					height: t.height,
-					width: t.width
-				}
-			}) : void 0;
-			n && Er(n, t) && (d.current = {
-				...n,
-				observedAtMilliseconds: r
-			}), v((n) => De(n, {
-				clientX: e.clientX,
-				clientY: e.clientY,
-				ctrlKey: e.ctrlKey,
-				deltaMode: e.deltaMode,
-				deltaX: e.deltaX,
-				deltaY: e.deltaY,
-				focalViewportX: a?.x,
-				focalViewportY: a?.y,
-				metaKey: e.metaKey,
-				viewportLeft: t.left,
-				viewportTop: t.top
-			}));
-		};
-		return o.addEventListener("wheel", e, { passive: !1 }), () => o.removeEventListener("wheel", e);
-	}, [o, v]), a.useMemo(() => ({
-		canvas: c,
-		canvasRef: l,
-		canvasSurfaceElement: r,
-		canvasViewportElement: o,
-		moveCanvas: v,
-		onCanvasPointerCancel: S,
-		onCanvasPointerDown: w,
-		onCanvasPointerMove: T,
-		onCanvasPointerUp: E,
-		setCanvasSurfaceElement: b,
-		setCanvasViewportElement: x
-	}), [
-		c,
-		r,
-		o,
-		v,
-		S,
-		w,
-		T,
-		E,
-		b,
-		x
-	]);
-}
-function wr(e) {
-	let t = e.lastKnownPointerViewportPoint, n = t !== null && Er(t, e.viewportSize), r = typeof e.lastKnownPointerAgeMilliseconds == "number" && e.lastKnownPointerAgeMilliseconds <= Sr;
-	return n && r ? t : e.eventViewportPoint && Er(e.eventViewportPoint, e.viewportSize) ? e.eventViewportPoint : n ? t : {
-		x: e.viewportSize.width / 2,
-		y: e.viewportSize.height / 2
-	};
-}
-function Tr(e, t) {
-	if (!(e.clientX === 0 && e.clientY === 0)) return {
-		x: e.clientX - t.left,
-		y: e.clientY - t.top
-	};
-}
-function Er(e, t) {
-	return e.x >= 0 && e.y >= 0 && e.x <= t.width && e.y <= t.height;
-}
-function Dr(e, t) {
-	return e.x === t.x && e.y === t.y && e.scale === t.scale;
-}
-function Or() {
-	return typeof performance < "u" ? performance.now() : Date.now();
-}
-//#endregion
-//#region src/use-studio-canvas-layout.ts
-var kr = typeof window > "u" ? a.useEffect : a.useLayoutEffect, Ar = 40;
-function jr(e) {
-	let [t, n] = a.useState({}), [r, i] = a.useState({}), [o, s] = a.useState(() => rr(e.workspace, e.canvasViewportPreset, e.frameStates, e.previewCache, e.previewGeometryStore)), c = a.useRef(/* @__PURE__ */ new Map()), l = a.useRef(/* @__PURE__ */ new Map()), u = a.useRef(/* @__PURE__ */ new Map()), d = a.useRef(t), f = a.useRef(r), p = a.useRef(0), m = a.useRef(e.onLayoutMeasured), h = a.useMemo(() => e.previewGeometryStore ? void 0 : nr(e.workspace, e.canvasViewportPreset, e.frameStates, e.previewCache), [
-		e.canvasViewportPreset,
-		e.frameStates,
-		e.previewCache,
-		e.previewGeometryStore,
-		e.workspace
-	]);
-	m.current = e.onLayoutMeasured;
-	let g = a.useCallback((e, t, n) => {
-		let r = tr(e, t);
-		n ? (c.current.set(t, n), l.current.set(r, n)) : (c.current.get(t) === l.current.get(r) && c.current.delete(t), l.current.delete(r));
-	}, []), _ = a.useCallback((e, t) => {
-		t ? u.current.set(e, t) : u.current.delete(e);
-	}, []), v = a.useCallback((e, t) => l.current.get(tr(e, t)) ?? c.current.get(t), []), y = a.useCallback(() => {
-		let t = rr(e.workspace, e.canvasViewportPreset, e.frameStates, e.previewCache, e.previewGeometryStore);
-		s((e) => e === t ? e : t);
-	}, [
-		e.canvasViewportPreset,
-		e.frameStates,
-		e.previewCache,
-		e.previewGeometryStore,
-		e.workspace
-	]), b = a.useCallback(() => {
-		if (!e.canvasSurfaceElement) return;
-		let t = {};
-		e.workspace.columns.forEach((n, r) => {
-			let i = u.current.get(r);
-			if (!i) return;
-			let a = i.getBoundingClientRect(), o = {}, s = {};
-			for (let t of n.components) {
-				let n = l.current.get(tr(r, t.coordinate));
-				if (n) {
-					o[t.coordinate] = Zn(n.getBoundingClientRect(), a, e.canvasRef.current.scale);
-					for (let t of n.querySelectorAll("[data-gtsx-preview-session-id]")) {
-						let n = t.dataset.gtsxPreviewSessionId;
-						n && (s[n] = Zn(t.getBoundingClientRect(), a, e.canvasRef.current.scale));
-					}
-				}
-			}
-			t[r] = {
-				cardRectsByCoordinate: o,
-				height: a.height / e.canvasRef.current.scale,
-				previewFrameRectsBySessionId: s
-			};
-		});
-		let r = ke({
-			columns: e.workspace.columns.map((e) => ({
-				componentCoordinates: e.components.map((e) => e.coordinate),
-				parentCoordinate: e.parentCoordinate
-			})),
-			margin: Ar,
-			measurementsByIndex: t
-		}), a = !or(f.current, t), o = !ar(d.current, r);
-		f.current = t, d.current = r, i((e) => or(e, t) ? e : t), n((e) => ar(e, r) ? e : r), (a || o) && m.current();
-	}, [
-		e.canvasRef,
-		e.canvasSurfaceElement,
-		e.workspace.columns
-	]), x = a.useCallback(() => {
-		if (y(), typeof window > "u") {
-			b();
-			return;
-		}
-		p.current ||= window.requestAnimationFrame(() => {
-			p.current = 0, b();
-		});
-	}, [b, y]);
-	return kr(() => {
-		y(), b();
-	}, [
-		e.canvasSurfaceElement,
-		h,
-		b,
-		y
-	]), a.useEffect(() => () => {
-		p.current && window.cancelAnimationFrame(p.current);
-	}, []), {
-		casePreviewScale: o,
-		columnLayoutByIndex: t,
-		columnLayoutByIndexRef: d,
-		columnMeasurementsByIndexRef: f,
-		getCardElement: v,
-		layoutMeasurementKey: h,
-		scheduleMeasurement: x,
-		setCardElement: g,
-		setColumnElement: _
-	};
-}
-//#endregion
-//#region src/studio-preview-render-request-policy.ts
-var Z = {
-	renderBudget: "normal",
-	renderScope: "buffer"
-}, Mr = {
-	renderBudget: "normal",
-	renderScope: "visible"
-}, Nr = {
-	renderBudget: "canvas-movement",
-	renderScope: "buffer"
-};
-function Pr(e, t) {
-	return Fr(e, Q(t));
-}
-function Fr(e, t) {
-	if (t.renderScope === Z.renderScope && t.renderBudget === Z.renderBudget) return e;
-	let n = { ...e };
-	return t.renderScope === "visible" && (n.includeBufferedRenderTasks = !1), t.renderBudget === "canvas-movement" && (n.maximumConcurrentRenderTasks = e?.maximumConcurrentRenderTasksDuringCanvasMovement ?? 4, n.minimumVisibleRenderTasks = e?.minimumVisibleRenderTasksDuringCanvasMovement ?? 4), n;
-}
-function Ir(e, t) {
-	return Rr(Lr(e ? Q(e) : null, Q(t)));
-}
-function Lr(e, t) {
-	return e ? {
-		renderBudget: e.renderBudget === "canvas-movement" && t.renderBudget === "canvas-movement" ? "canvas-movement" : "normal",
-		renderScope: e.renderScope === "buffer" || t.renderScope === "buffer" ? "buffer" : "visible"
-	} : t;
-}
-function Q(e) {
-	return {
-		renderBudget: e.useCanvasMovementRenderTaskLimit === !0 ? "canvas-movement" : "normal",
-		renderScope: e.includeBuffer === !1 ? "visible" : "buffer"
-	};
-}
-function Rr(e) {
-	return {
-		includeBuffer: e.renderScope === "buffer",
-		useCanvasMovementRenderTaskLimit: e.renderBudget === "canvas-movement"
-	};
-}
-//#endregion
-//#region src/studio-preview-render-request-clock.ts
-function zr(e) {
-	let t = e.scheduler ?? Ur(), n = 0, r = 0, i = 0, a = 0, o = 0, s, c, l = null, u = (e) => {
-		t && (e === "active" && n && (t.clearTimeout(n), n = 0), e === "bufferRenderDelay" && i && (t.clearTimeout(i), i = 0), e === "canvasThrottle" && a && (t.clearTimeout(a), a = 0), e === "idle" && o && (t.clearTimeout(o), o = 0));
-	}, d = () => Br(s, e.getRenderQueueOptions(), t), f = () => d() ? Nr : i ? Mr : Z, p = (t, n) => {
-		e.runRenderRequest(t, n) && g();
-	}, m = (n) => {
-		l = Lr(l, n), t && (r ||= t.requestAnimationFrame(() => {
-			r = 0;
-			let t = l ?? Z;
-			l = null, p(e.getCanvas(), t);
-		}));
-	}, h = () => {
-		m(f());
-	}, g = () => {
-		if (!t) return;
-		u("active");
-		let r = Vr(e.getRenderQueueOptions()?.activeRenderTimeoutMilliseconds ?? 5e3);
-		r !== void 0 && (n = t.setTimeout(() => {
-			n = 0, h();
-		}, r + 16));
-	}, _ = () => {
-		if (!t) return;
-		let n = $(e.getRenderQueueOptions()?.renderDebounceMilliseconds, 120), r = $(e.getRenderQueueOptions()?.bufferRenderDelayMilliseconds, kt);
-		if (n <= 0) {
-			u("idle"), u("bufferRenderDelay"), m(Z);
-			return;
-		}
-		u("idle"), u("bufferRenderDelay"), o = t.setTimeout(() => {
-			if (o = 0, m(Mr), r <= 0) {
-				m(Z);
-				return;
-			}
-			i = t.setTimeout(() => {
-				i = 0, m(Z);
-			}, r);
-		}, n);
-	}, v = () => {
-		if (!t) {
-			p(e.getCanvas(), Z);
-			return;
-		}
-		let n = $(e.getRenderQueueOptions()?.bufferRenderDelayMilliseconds, kt);
-		if (u("bufferRenderDelay"), m(Mr), n <= 0) {
-			m(Z);
-			return;
-		}
-		i = t.setTimeout(() => {
-			i = 0, m(Z);
-		}, n);
-	}, y = (e) => {
-		c = Hr(t), p(e, Nr);
-	}, b = (n) => {
-		if (!t) {
-			y(n);
-			return;
-		}
-		let r = $(e.getRenderQueueOptions()?.renderThrottleMilliseconds, 100);
-		if (r <= 0) {
-			u("canvasThrottle"), y(n);
-			return;
-		}
-		let i = t.now(), o = c === void 0 ? r : i - c;
-		if (o >= r) {
-			u("canvasThrottle"), y(n);
-			return;
-		}
-		a ||= t.setTimeout(() => {
-			a = 0, y(e.getCanvas());
-		}, Math.max(0, r - o));
-	};
-	return {
-		dispose() {
-			t && r && t.cancelAnimationFrame(r), r = 0, l = null, u("active"), u("bufferRenderDelay"), u("canvasThrottle"), u("idle");
-		},
-		flushRenderRequest(n = e.getCanvas(), i = {}) {
-			t && r && t.cancelAnimationFrame(r), r = 0, l = null, u("bufferRenderDelay"), p(n, Q(i));
-		},
-		requestBufferedRender() {
-			v();
-		},
-		requestCanvasMovementRender(n = e.getCanvas()) {
-			s = Hr(t), b(n), _();
-		},
-		requestRenderAfterPreviewCompletion() {
-			h();
-		}
-	};
-}
-function Br(e, t, n) {
-	if (e === void 0) return !1;
-	let r = $(t?.renderDebounceMilliseconds, 120);
-	return r > 0 && Hr(n) - e < r;
-}
-function Vr(e) {
-	return typeof e == "number" && Number.isFinite(e) && e > 0 ? e : void 0;
-}
-function $(e, t) {
-	return typeof e == "number" && Number.isFinite(e) && e >= 0 ? Math.floor(e) : t;
-}
-function Hr(e) {
-	return e ? e.now() : typeof performance < "u" ? performance.now() : Date.now();
-}
-function Ur() {
-	if (!(typeof window > "u")) return {
-		cancelAnimationFrame(e) {
-			window.cancelAnimationFrame(e);
-		},
-		clearTimeout(e) {
-			window.clearTimeout(e);
-		},
-		now() {
-			return Hr(void 0);
-		},
-		requestAnimationFrame(e) {
-			return window.requestAnimationFrame(e);
-		},
-		setTimeout(e, t) {
-			return window.setTimeout(e, t);
-		}
-	};
-}
-//#endregion
-//#region src/studio-preview-render-completion-source.ts
-function Wr(e) {
-	return e.previewGeometryStore ? Kr(e.previewGeometryStore) : Gr(e.frameStates);
-}
-function Gr(e) {
-	let t = qr(e);
-	return { completedSessionIdsFor() {
-		return new Set(t);
-	} };
-}
-function Kr(e) {
-	return { completedSessionIdsFor(t) {
-		return Jr(e, t);
-	} };
-}
-function qr(e) {
-	let t = /* @__PURE__ */ new Set();
-	if (!e) return t;
-	for (let [n, r] of Object.entries(e)) (r.ready || r.error) && t.add(n);
-	return t;
-}
-function Jr(e, t) {
-	let n = /* @__PURE__ */ new Set();
-	for (let r of t) {
-		let t = e.getFrameState(r);
-		(t?.ready || t?.error) && n.add(r);
-	}
-	return n;
-}
-//#endregion
-//#region src/studio-preview-render-plan.ts
-function Yr(e) {
-	let t = ir(e.workspace, e.canvasViewportPreset, e.columnLayoutByIndex, e.columnMeasurementsByIndex, {
-		frameStates: e.frameStates,
-		previewCache: e.previewCache,
-		previewGeometryStore: e.previewGeometryStore
-	}), n = Qr(e.currentSessionIds, e.completedSessionIds, e.mountedAtBySessionId, e.activeRenderTimeoutMilliseconds ?? 5e3), r = {
-		activeSessionIds: n,
-		canvas: e.canvas,
-		canvasMovement: e.canvasMovement,
-		completedSessionIds: e.completedSessionIds,
-		currentSessionIds: e.currentSessionIds,
-		items: t,
-		viewport: e.viewport,
-		...e.queueOptions
-	}, i = At(r), a = Nt(r, i), o = Xr(t, e.canvas, e.viewport);
-	return {
-		activeSessionIds: n,
-		allVisibleSessionIds: o,
-		completedSessionIds: e.completedSessionIds,
-		hasIncompleteVisibleRenderTasks: Zr(o, e.completedSessionIds),
-		nextSessionIds: i,
-		viewport: e.viewport,
-		visibleSessionIds: a,
-		visibilityItems: t,
-		visibleRects: $r(t, a, e.canvas)
-	};
-}
-function Xr(e, t, n) {
-	let r = /* @__PURE__ */ new Set();
-	for (let i of e) if (!(ei(bt(t, i.rect), n) <= 0)) for (let e of i.sessionIds) r.add(e);
-	return r;
-}
-function Zr(e, t) {
-	if (e.size === 0) return !1;
-	for (let n of e) if (!t.has(n)) return !0;
-	return !1;
-}
-function Qr(e, t, n, r) {
-	let i = /* @__PURE__ */ new Set(), a = ti();
-	for (let o of e) {
-		if (t.has(o)) continue;
-		let e = n.get(o) ?? a;
-		(r === void 0 || a - e < r) && i.add(o);
-	}
-	return i;
-}
-function $r(e, t, n) {
-	let r = [];
-	for (let i of e) for (let e of i.sessionIds) t.has(e) && r.push({
-		canvasRect: i.rect,
-		sessionId: e,
-		viewportRect: bt(n, i.rect)
-	});
-	return r;
-}
-function ei(e, t) {
-	return Math.max(0, Math.min(e.right, t.right) - Math.max(e.left, t.left)) * Math.max(0, Math.min(e.bottom, t.bottom) - Math.max(e.top, t.top));
-}
-function ti() {
-	return typeof performance < "u" ? performance.now() : Date.now();
-}
-//#endregion
-//#region src/use-studio-preview-render-scheduler.ts
-function ni(e) {
-	let t = a.useRef(void 0), n = a.useRef(e.canvasRef.current), r = a.useRef(/* @__PURE__ */ new Map()), i = a.useRef(e.previewRenderSessionStore.getSessionIds()), o = a.useCallback((a = e.canvasRef.current, o = Z) => {
-		if (!e.canvasViewportElement) return !1;
-		let s = Fr(e.previewRenderQueueRef.current, o), c = Wr({
-			frameStates: e.frameStatesRef.current,
-			previewGeometryStore: e.previewGeometryStore
-		}), l = li(n.current, a);
-		ui(l) && (t.current = l), n.current = a;
-		let u = ri({
-			activeRenderTimeoutMilliseconds: s?.activeRenderTimeoutMilliseconds ?? 5e3,
-			canvas: a,
-			canvasMovement: t.current,
-			canvasViewportElement: e.canvasViewportElement,
-			canvasViewportPreset: e.canvasViewportPresetRef.current,
-			columnLayoutByIndex: e.columnLayoutByIndexRef.current,
-			columnMeasurementsByIndex: e.columnMeasurementsByIndexRef.current,
-			completionSource: c,
-			frameStates: e.frameStatesRef.current,
-			mountedAtBySessionId: r.current,
-			previewGeometryStore: e.previewGeometryStore,
-			queueOptions: s,
-			sessionIds: i.current,
-			workspace: e.workspaceRef.current
-		});
-		if (!u) return !1;
-		let d = i.current, f = ci(u.nextSessionIds, d), p = ci(u.visibleSessionIds, d);
-		return mi({
-			canvas: a,
-			canvasMovement: t.current,
-			completedCount: u.completedSessionIds.size,
-			currentCount: i.current.size,
-			includeBuffer: o.renderScope === "buffer",
-			itemCount: u.visibilityItems.length,
-			maximumConcurrentRenderTasks: s?.maximumConcurrentRenderTasks ?? 24,
-			minimumVisibleRenderTasks: s?.minimumVisibleRenderTasks ?? 0,
-			nextCount: u.nextSessionIds.size,
-			nextSessionIds: [...u.nextSessionIds],
-			newSessionIds: f,
-			newVisibleSessionIds: p,
-			renderExpansionCenterViewportPoint: ai(u.viewport),
-			renderBudget: o.renderBudget,
-			renderScope: o.renderScope,
-			showRenderExpansionCenterPulse: oi(o),
-			visibleRects: u.visibleRects,
-			visibleCount: u.visibleSessionIds.size,
-			visibleSessionIds: [...u.visibleSessionIds],
-			viewportHeight: u.viewport.bottom,
-			viewportWidth: u.viewport.right,
-			useCanvasMovementRenderTaskLimit: o.renderBudget === "canvas-movement"
-		}), di(r.current, d, u.nextSessionIds), i.current = u.nextSessionIds, fi(e.previewRenderSessionStore, u.nextSessionIds, u.visibleSessionIds, { urgent: o.renderBudget === "canvas-movement" });
-	}, [
-		e.canvasRef,
-		e.canvasViewportElement,
-		e.canvasViewportPresetRef,
-		e.columnLayoutByIndexRef,
-		e.columnMeasurementsByIndexRef,
-		e.frameStatesRef,
-		e.previewGeometryStore,
-		e.previewRenderQueueRef,
-		e.previewRenderSessionStore,
-		e.workspaceRef
-	]), s = a.useCallback((t = e.canvasRef.current, n = Z) => o(t, n), [e.canvasRef, o]), c = a.useMemo(() => zr({
-		getCanvas: () => e.canvasRef.current,
-		getRenderQueueOptions: () => e.previewRenderQueueRef.current,
-		runRenderRequest: s
-	}), [
-		e.canvasRef,
-		e.previewRenderQueueRef,
-		s
-	]), l = a.useCallback((t = e.canvasRef.current) => {
-		c.requestBufferedRender(t);
-	}, [e.canvasRef, c]), u = a.useCallback((t = e.canvasRef.current, n = {}) => {
-		c.flushRenderRequest(t, n);
-	}, [e.canvasRef, c]), d = a.useCallback((t = e.canvasRef.current) => {
-		c.requestCanvasMovementRender(t);
-	}, [e.canvasRef, c]);
-	return a.useEffect(() => {
-		if (typeof window > "u") return;
-		let e = () => {
-			c.requestRenderAfterPreviewCompletion();
-		};
-		return window.addEventListener("gtsx:preview-timing", e), () => window.removeEventListener("gtsx:preview-timing", e);
-	}, [c]), a.useEffect(() => () => c.dispose(), [c]), {
-		flushPreviewRender: u,
-		requestCanvasPreviewRender: d,
-		requestPreviewRender: l
-	};
-}
-function ri(e) {
-	if (!e.canvasViewportElement) return;
-	let t = e.completionSource.completedSessionIdsFor(e.sessionIds), n = {
-		activeRenderTimeoutMilliseconds: e.activeRenderTimeoutMilliseconds,
-		canvas: e.canvas,
-		canvasMovement: e.canvasMovement,
-		canvasViewportPreset: e.canvasViewportPreset,
-		columnLayoutByIndex: e.columnLayoutByIndex,
-		columnMeasurementsByIndex: e.columnMeasurementsByIndex,
-		completedSessionIds: t,
-		currentSessionIds: e.sessionIds,
-		frameStates: e.frameStates,
-		mountedAtBySessionId: e.mountedAtBySessionId,
-		previewGeometryStore: e.previewGeometryStore,
-		queueOptions: e.queueOptions,
-		viewport: ii(e.canvasViewportElement),
-		workspace: e.workspace
-	}, r = Yr(n), i = new Set([...e.sessionIds, ...r.allVisibleSessionIds]), a = e.completionSource.completedSessionIdsFor(i);
-	return si(t, a) ? r : Yr({
-		...n,
-		completedSessionIds: a
-	});
-}
-function ii(e) {
-	let t = e.getBoundingClientRect();
-	return {
-		bottom: t.height,
-		left: 0,
-		right: t.width,
-		top: 0
-	};
-}
-function ai(e) {
-	return {
-		x: (e.left + e.right) / 2,
-		y: (e.top + e.bottom) / 2
-	};
-}
-function oi(e) {
-	return e.renderBudget === "normal" && e.renderScope === "buffer";
-}
-function si(e, t) {
-	if (e.size !== t.size) return !1;
-	for (let n of e) if (!t.has(n)) return !1;
-	return !0;
-}
-function ci(e, t) {
-	let n = [];
-	for (let r of e) t.has(r) || n.push(r);
-	return n;
-}
-function li(e, t) {
-	return {
-		x: t.x - e.x,
-		y: t.y - e.y
-	};
-}
-function ui(e) {
-	return Math.hypot(e.x, e.y) >= .001;
-}
-function di(e, t, n) {
-	let r = pi();
-	for (let i of n) !t.has(i) && !e.has(i) && e.set(i, r);
-	for (let t of e.keys()) n.has(t) || e.delete(t);
-}
-function fi(e, t, n, r) {
-	if (!r.urgent || typeof window > "u") return e.setSessionIds(t, n);
-	let i = !1;
-	return l(() => {
-		i = e.setSessionIds(t, n);
-	}), i;
-}
-function pi() {
-	return typeof performance < "u" ? performance.now() : Date.now();
-}
-function mi(e) {
-	if (typeof window > "u") return;
-	let t = new URLSearchParams(window.location.search).getAll("debug").join(",").split(",").map((e) => e.trim());
-	!t.includes("queue") && !t.includes("preview-queue") || (document.documentElement.setAttribute("data-gtsx-preview-queue-debug", JSON.stringify(e)), window.dispatchEvent(new CustomEvent("gtsx:preview-queue-debug", { detail: e })));
-}
-//#endregion
-//#region src/components/ComponentBoundsHitTarget.g.tsx
-function hi(e) {
-	return /* @__PURE__ */ s("div", {
-		"aria-hidden": "true",
-		"data-gtsx-card-select-coordinate": e.coordinate,
-		"data-gtsx-card-select-target": "component-bounds",
-		onClick: (t) => {
-			t.stopPropagation(), e.onSelect?.();
-		},
-		onPointerDown: (e) => e.stopPropagation(),
-		style: {
-			height: e.rect.height,
-			left: e.rect.x,
-			pointerEvents: "auto",
-			position: "absolute",
-			top: e.rect.y,
-			width: e.rect.width,
-			zIndex: 2
-		}
-	});
-}
-var gi = i("src/components/ComponentBoundsHitTarget.g.tsx#default", hi);
-gi.cases = { userCardBounds: { props: {
-	coordinate: "src/UserCard.g.tsx#default",
-	rect: {
-		x: 12,
-		y: 20,
-		width: 320,
-		height: 88
-	}
-} } };
-//#endregion
-//#region src/components/SelectedBoundaryOutline.g.tsx
-function _i(e) {
-	return /* @__PURE__ */ s("div", {
-		"aria-hidden": "true",
-		"data-gtsx-selection-outline": "true",
-		style: {
-			height: e.rect.height,
-			left: e.rect.x,
-			outline: "1px solid #0d99ff",
-			pointerEvents: "none",
-			position: "absolute",
-			top: e.rect.y,
-			width: e.rect.width,
-			zIndex: 1
-		}
-	});
-}
-var vi = i("src/components/SelectedBoundaryOutline.g.tsx#default", _i);
-vi.cases = { userCardSelected: { props: { rect: {
-	x: 12,
-	y: 20,
-	width: 320,
-	height: 88
-} } } };
-//#endregion
-//#region src/components/BufferedPreviewIframe.g.tsx
-function yi(e) {
-	return /* @__PURE__ */ s("iframe", {
-		"aria-hidden": "true",
-		loading: "eager",
-		ref: (t) => e.onPreviewFrameMount?.(e.slot.sessionId, t),
-		src: e.slot.previewUrl,
-		style: {
-			background: "transparent",
-			border: 0,
-			height: e.size.height,
-			left: 0,
-			pointerEvents: "none",
-			position: "absolute",
-			top: 0,
-			width: e.size.width,
-			zIndex: 1
-		},
-		tabIndex: -1,
-		title: e.slot.title
-	});
-}
-var bi = i("src/components/BufferedPreviewIframe.g.tsx#default", yi);
-bi.cases = { active: { props: {
-	size: {
-		width: 390,
-		height: 844
-	},
-	slot: {
-		previewUrl: "/gtsx?entry=src%2FUserCard.g.tsx%23default&case=ready&chrome=0",
-		sessionId: "src/UserCard.g.tsx#default:ready",
-		title: "UserCard preview"
-	}
-} } };
-//#endregion
-//#region src/components/StudioPreviewIframe.tsx
-function xi(e) {
-	let t = on();
-	return a.useEffect(() => {
-		if (!t) return e.onBorrowOriginChange?.("new"), () => e.onBorrowOriginChange?.(null);
-	}, [t, e.onBorrowOriginChange]), s(t ? rn : bi, { ...e });
-}
-//#endregion
-//#region src/components/LazyPreviewFrame.g.tsx
-function Si(e) {
-	return {
-		isVisibleRenderSession: Un(e.sessionId, e.debugPreviewQueue === !0),
-		shouldLoadFromRenderQueue: Wn(e.sessionId)
-	};
-}
-var Ci = r(Si);
-function wi(e) {
-	let [t, n] = a.useState(null), r = Ci(e), i = e.shouldLoad ?? r.shouldLoadFromRenderQueue, o = d(e.size, e.boundaryRect), l = f(e.size, e.boundaryRect), u = h(e.size, e.boundaryRect), g = p(e.boundaryRect, u), _ = m(e.boundaryRect, u), v = m(e.selectedBoundaryRect, u), y = 1 / Math.max(e.debugIndicatorScale ?? 1, .01), b = Di(e.frameState, i), x = t ?? "pending", S = Ei({
-		iframeOrigin: x,
-		isVisibleRenderSession: r.isVisibleRenderSession,
-		renderLifecycleState: b,
-		shouldLoad: i
-	});
-	return a.useEffect(() => {
-		i || n(null);
-	}, [i]), /* @__PURE__ */ c("div", {
-		"data-gtsx-preview-session-id": e["data-gtsx-preview-session-id"],
-		"data-gtsx-preview-src": e.previewUrl,
-		"data-gtsx-viewport-preset": e.viewportPreset,
-		style: {
-			height: o,
-			overflow: "visible",
-			position: "relative",
-			width: l
-		},
-		children: [
-			i ? /* @__PURE__ */ s("div", {
-				"data-gtsx-preview-clip": "true",
-				style: {
-					contain: "layout paint style",
-					height: o,
-					left: 0,
-					overflow: "hidden",
-					pointerEvents: "none",
-					position: "absolute",
-					top: 0,
-					width: l,
-					zIndex: 1
-				},
-				children: /* @__PURE__ */ s("div", {
-					style: {
-						height: e.size.height,
-						left: -g.x,
-						position: "absolute",
-						top: -g.y,
-						width: e.size.width
-					},
-					children: /* @__PURE__ */ s(xi, {
-						onBorrowOriginChange: e.debugPreviewPool || e.debugPreviewQueue ? n : void 0,
-						onPreviewFrameMount: e.onPreviewFrameMount,
-						size: e.size,
-						slot: {
-							previewUrl: e.previewUrl,
-							sessionId: e.sessionId,
-							title: e.title
-						}
-					})
-				})
-			}) : null,
-			e.debugPreviewQueue ? /* @__PURE__ */ c("span", {
-				"aria-label": "Preview render lifecycle",
-				"data-gtsx-preview-render-flow": S,
-				"data-gtsx-preview-render-iframe-origin": x,
-				"data-gtsx-preview-render-lifecycle": b,
-				"data-gtsx-preview-render-queued": i ? "true" : "false",
-				"data-gtsx-preview-render-visible": r.isVisibleRenderSession ? "true" : "false",
-				style: {
-					alignItems: "center",
-					background: "rgba(255,255,255,0.92)",
-					border: "1px solid rgba(216,222,232,0.96)",
-					borderRadius: 999,
-					bottom: 5,
-					boxShadow: "0 1px 5px rgba(31,35,40,0.16)",
-					display: "grid",
-					gap: 3,
-					gridTemplateColumns: "repeat(4, 6px)",
-					height: 12,
-					justifyContent: "center",
-					padding: "0 4px",
-					pointerEvents: "none",
-					position: "absolute",
-					right: 5,
-					transform: `scale(${y})`,
-					transformOrigin: "bottom right",
-					zIndex: 5
-				},
-				title: S,
-				children: [
-					/* @__PURE__ */ s(ki, {
-						active: i,
-						color: "#57606a"
-					}),
-					/* @__PURE__ */ s(ki, {
-						active: r.isVisibleRenderSession,
-						color: "#0d99ff"
-					}),
-					/* @__PURE__ */ s(ki, {
-						active: t !== null,
-						color: t === "new" ? "#fb8f2d" : "#2da44e"
-					}),
-					/* @__PURE__ */ s(ki, {
-						active: !0,
-						color: Oi(b)
-					})
-				]
-			}) : null,
-			e.debugPreviewQueue && i && r.isVisibleRenderSession ? /* @__PURE__ */ s("span", {
-				"aria-label": "Preview task dispatched from visible viewport",
-				"data-gtsx-preview-queue-origin": "visible",
-				style: {
-					background: "#0d99ff",
-					border: "1px solid rgba(255,255,255,0.92)",
-					borderRadius: 999,
-					boxShadow: "0 1px 5px rgba(31,35,40,0.25)",
-					height: 9,
-					pointerEvents: "none",
-					position: "absolute",
-					right: e.debugPreviewPool ? 18 : 5,
-					top: 5,
-					transform: `scale(${y})`,
-					transformOrigin: "top right",
-					width: 9,
-					zIndex: 4
-				},
-				title: "visible queue task"
-			}) : null,
-			e.debugPreviewPool && i && t ? /* @__PURE__ */ s("span", {
-				"aria-label": t === "pool" ? "Preview iframe reused from pool" : "Preview iframe created",
-				"data-gtsx-preview-pool-origin": t,
-				style: {
-					background: t === "pool" ? "#2da44e" : "#fb8f2d",
-					border: "1px solid rgba(255,255,255,0.92)",
-					borderRadius: 999,
-					boxShadow: "0 1px 5px rgba(31,35,40,0.25)",
-					height: 9,
-					pointerEvents: "none",
-					position: "absolute",
-					right: 5,
-					top: 5,
-					transform: `scale(${y})`,
-					transformOrigin: "top right",
-					width: 9,
-					zIndex: 4
-				},
-				title: t === "pool" ? "from pool" : "new iframe"
-			}) : null,
-			_ ? /* @__PURE__ */ s(gi, {
-				coordinate: e.coordinate,
-				onSelect: e.onSelect,
-				rect: _
-			}) : null,
-			v ? /* @__PURE__ */ s(vi, { rect: v }) : null
-		]
-	});
-}
-var Ti = i("src/components/LazyPreviewFrame.g.tsx#default", wi);
-Ti.cases = { loadedPhone: { props: {
-	"data-gtsx-preview-session-id": "src/UserCard.g.tsx#default:ready",
-	boundaryRect: {
-		x: 10,
-		y: 20,
-		width: 320,
-		height: 88
-	},
-	coordinate: "src/UserCard.g.tsx#default",
-	previewUrl: "/gtsx?entry=src%2FUserCard.g.tsx%23default&case=ready&chrome=0",
-	selectedBoundaryRect: {
-		x: 10,
-		y: 20,
-		width: 320,
-		height: 88
-	},
-	shouldLoad: !0,
-	size: {
-		width: 390,
-		height: 844
-	},
-	sessionId: "src/UserCard.g.tsx#default:ready",
-	title: "UserCard preview",
-	viewportPreset: "phone"
-} } };
-function Ei(e) {
-	return [
-		e.shouldLoad ? "queued" : "not-queued",
-		e.isVisibleRenderSession ? "visible" : "buffer",
-		`iframe-${e.iframeOrigin}`,
-		e.renderLifecycleState
-	].join(" -> ");
-}
-function Di(e, t) {
-	return e?.error ? "error" : e?.ready ? "ready" : t && e ? "rendering" : t ? "queued" : "idle";
-}
-function Oi(e) {
-	return e === "error" ? "#cf222e" : e === "ready" ? "#2da44e" : e === "rendering" ? "#bf8700" : e === "queued" ? "#0d99ff" : "#8c959f";
-}
-function ki(e) {
-	return /* @__PURE__ */ s("span", {
-		"aria-hidden": "true",
-		style: {
-			background: e.active ? e.color : "rgba(140,149,159,0.22)",
-			borderRadius: 999,
-			display: "block",
-			height: 6,
-			width: 6
-		}
-	});
-}
-//#endregion
-//#region src/components/PreviewError.g.tsx
-function Ai(e) {
-	return /* @__PURE__ */ c("div", {
-		role: "status",
-		style: {
-			background: "#fff8c5",
-			border: "1px solid #d4a72c",
-			borderRadius: 8,
-			color: "#5a1e02",
-			padding: 12
-		},
-		children: [
-			/* @__PURE__ */ s("strong", { children: "Preview unavailable" }),
-			/* @__PURE__ */ s("p", {
-				style: { margin: "6px 0 0" },
-				children: e.error.message
-			}),
-			e.error.stack ? /* @__PURE__ */ s("pre", {
-				style: { whiteSpace: "pre-wrap" },
-				children: e.error.stack
-			}) : null,
-			/* @__PURE__ */ c("dl", {
-				style: {
-					display: "grid",
-					gap: 4,
-					margin: "8px 0 0"
-				},
-				children: [
-					/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("dt", { children: "Entry" }), /* @__PURE__ */ s("dd", {
-						style: { margin: 0 },
-						children: e.coordinate
-					})] }),
-					/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("dt", { children: "Case" }), /* @__PURE__ */ s("dd", {
-						style: { margin: 0 },
-						children: e.caseName
-					})] }),
-					/* @__PURE__ */ c("div", { children: [/* @__PURE__ */ s("dt", { children: "Preview URL" }), /* @__PURE__ */ s("dd", {
-						style: { margin: 0 },
-						children: /* @__PURE__ */ s("code", { children: e.previewUrl })
-					})] })
-				]
-			})
-		]
-	});
-}
-var ji = i("src/components/PreviewError.g.tsx#default", Ai);
-ji.cases = { renderFailure: { props: {
-	caseName: "ready",
-	coordinate: "src/UserCard.g.tsx#default",
-	error: {
-		message: "Cannot read properties of undefined",
-		stack: "TypeError: Cannot read properties of undefined\n    at UserCard"
-	},
-	previewUrl: "/gtsx?entry=src%2FUserCard.g.tsx%23default&case=ready&chrome=0"
-} } };
-//#endregion
-//#region src/components/ComponentCard.g.tsx
-function Mi(e) {
-	let t = Ri(e.component), n = Object.fromEntries(e.component.cases.map((t) => [t.name, e.caseFrameStates?.[t.name] ?? (t.name === e.selectedCaseName ? e.frameState : void 0)])), r = Object.fromEntries(e.component.cases.map((t) => [t.name, e.caseLayoutFrameStates?.[t.name] ?? n[t.name]])), i = e.component.cases.map((t) => {
-		let i = n[t.name], a = r[t.name], o = z(e.component, t.name, e.viewportPreset), s = V(e.viewportPreset, a?.size), c = R(e.manifest, e.component, t.name, o, { static: !0 }), l = Re(Li(a?.tree, e.component.coordinate), s), u = Number(f(s, l));
-		return {
-			displaySize: s,
-			frameState: i,
-			layoutHeight: d(s, l),
-			layoutWidth: u,
-			name: t.name,
-			previewUrl: c,
-			sessionId: o,
-			visibleBoundaryRect: l
-		};
-	}), a = F({
-		caseChromeHeight: 21,
-		gap: 14,
-		items: i.map((e) => ({
-			height: e.layoutHeight,
-			width: e.layoutWidth
-		})),
-		maxSide: qn(e.viewportPreset, i.length),
-		minScale: Kn,
-		previewScale: e.casePreviewScale
-	}), o = Math.max(280, a.width), l = e.columnIndex ?? 0, u = e.component.cases[0]?.name ?? e.selectedCaseName;
-	return /* @__PURE__ */ c("article", {
-		"aria-label": e.component.componentName,
-		"data-gtsx-card-coordinate": e.component.coordinate,
-		"data-gtsx-card-selected": e.selected ? "true" : void 0,
-		style: {
-			display: "grid",
-			gap: 8,
-			width: o
-		},
-		children: [/* @__PURE__ */ s("strong", {
-			style: {
-				color: "inherit",
-				fontSize: 13,
-				letterSpacing: 0,
-				lineHeight: 1.2,
-				overflow: "hidden",
-				textOverflow: "ellipsis",
-				whiteSpace: "nowrap"
-			},
-			children: e.component.componentName
-		}), t ? /* @__PURE__ */ s(ji, {
-			caseName: u,
-			coordinate: e.component.coordinate,
-			error: { message: t },
-			previewUrl: R(e.manifest, e.component, u, void 0, { static: !0 })
-		}) : /* @__PURE__ */ s("div", {
-			"data-gtsx-case-grid": e.component.coordinate,
-			"data-gtsx-case-grid-columns": a.columns,
-			"data-gtsx-case-grid-preview-scale": a.previewScale,
-			"data-gtsx-case-grid-selected": e.selected ? "true" : void 0,
-			style: {
-				display: "grid",
-				gap: a.gap,
-				gridTemplateColumns: `repeat(${a.columns}, ${a.cellWidth}px)`,
-				outline: e.selected ? "1px solid #0d99ff" : void 0,
-				position: "relative",
-				width: a.width
-			},
-			children: i.map((t) => /* @__PURE__ */ c("div", {
-				"data-gtsx-case-tile": t.name,
-				onClick: () => e.onSelect?.(e.component, n, l, "pointer"),
-				onKeyDown: (t) => {
-					t.key !== "Enter" && t.key !== " " || (t.preventDefault(), e.onSelect?.(e.component, n, l, "keyboard"));
-				},
-				onPointerDown: (e) => e.stopPropagation(),
-				role: "button",
-				style: {
-					alignContent: "start",
-					cursor: e.onSelect ? "pointer" : "default",
-					display: "grid",
-					gap: 5,
-					minWidth: 0,
-					width: a.cellWidth
-				},
-				tabIndex: 0,
-				children: [/* @__PURE__ */ s("strong", {
-					style: {
-						color: "#57606a",
-						fontSize: 11,
-						lineHeight: "16px",
-						overflow: "hidden",
-						textOverflow: "ellipsis",
-						whiteSpace: "nowrap"
-					},
-					children: t.name
-				}), /* @__PURE__ */ s("div", {
-					"data-gtsx-case-preview-frame": t.name,
-					"data-gtsx-case-preview-frame-state": Ii(t.frameState),
-					style: {
-						height: Math.ceil(t.layoutHeight * a.previewScale),
-						justifySelf: "center",
-						overflow: "visible",
-						position: "relative",
-						width: Math.ceil(t.layoutWidth * a.previewScale)
-					},
-					children: /* @__PURE__ */ c("div", {
-						style: {
-							height: t.layoutHeight,
-							left: 0,
-							position: "absolute",
-							top: 0,
-							transform: `scale(${a.previewScale})`,
-							transformOrigin: "0 0",
-							width: t.layoutWidth
-						},
-						children: [/* @__PURE__ */ s(Ti, {
-							"data-gtsx-preview-session-id": t.sessionId,
-							boundaryRect: t.visibleBoundaryRect,
-							coordinate: e.component.coordinate,
-							debugIndicatorScale: a.previewScale,
-							debugPreviewPool: e.debugPreviewPool,
-							debugPreviewQueue: e.debugPreviewQueue,
-							frameState: t.frameState,
-							onSelect: () => e.onSelect?.(e.component, n, l, "pointer"),
-							onPreviewFrameMount: e.onPreviewFrameMount,
-							previewUrl: t.previewUrl,
-							size: t.displaySize,
-							sessionId: t.sessionId,
-							title: `${e.component.componentName} ${t.name} preview`,
-							viewportPreset: e.viewportPreset
-						}), t.frameState?.error ? /* @__PURE__ */ s("div", {
-							style: {
-								inset: 0,
-								overflow: "auto",
-								position: "absolute",
-								zIndex: 2
-							},
-							children: /* @__PURE__ */ s(ji, {
-								caseName: t.name,
-								coordinate: e.component.coordinate,
-								error: t.frameState.error,
-								previewUrl: t.previewUrl
-							})
-						}) : null]
-					})
-				})]
-			}, t.name))
-		})]
-	});
-}
-var Ni = a.memo(Mi, Pi);
-Ni.cases = { selectedReady: { props: {
-	component: {
-		coordinate: "src/UserCard.g.tsx#default",
-		filePath: "src/UserCard.g.tsx",
-		exportName: "default",
-		componentName: "UserCard",
-		mode: "scope",
-		cases: [{
-			kind: "scope",
-			name: "ready"
-		}],
-		providers: {},
-		diagnostics: []
-	},
-	frameState: {
-		expectedSessionId: "src/UserCard.g.tsx#default:ready",
-		ready: !0,
-		tree: [{
-			id: "root",
-			coordinate: "src/UserCard.g.tsx#default",
-			rect: {
-				x: 10,
-				y: 20,
-				width: 320,
-				height: 88
-			},
-			children: []
-		}]
-	},
-	caseFrameStates: { ready: {
-		expectedSessionId: "src/UserCard.g.tsx#default:ready",
-		ready: !0,
-		tree: [{
-			id: "root",
-			coordinate: "src/UserCard.g.tsx#default",
-			rect: {
-				x: 10,
-				y: 20,
-				width: 320,
-				height: 88
-			},
-			children: []
-		}]
-	} },
-	manifest: {
-		version: 1,
-		routes: {
-			preview: "/gtsx",
-			studio: "/gtsx/studio",
-			manifest: "/gtsx/studio/manifest"
-		},
-		preview: {
-			urlTemplate: "/gtsx?entry={entry}&case={case}{gcase}",
-			allUrlTemplate: "/gtsx?entry={entry}{gcase}"
-		},
-		files: [],
-		diagnostics: []
-	},
-	selected: !0,
-	selectedCaseName: "ready",
-	viewportPreset: "phone"
-} } };
-function Pi(e, t) {
-	if (e.casePreviewScale !== t.casePreviewScale || e.columnIndex !== t.columnIndex || e.component !== t.component || e.debugPreviewPool !== t.debugPreviewPool || e.debugPreviewQueue !== t.debugPreviewQueue || e.frameState !== t.frameState || e.manifest !== t.manifest || e.onPreviewFrameMount !== t.onPreviewFrameMount || e.onSelect !== t.onSelect || e.selected !== t.selected || e.selectedCaseName !== t.selectedCaseName || e.viewportPreset !== t.viewportPreset) return !1;
-	for (let n of t.component.cases) if (!Fi(e.caseFrameStates?.[n.name], t.caseFrameStates?.[n.name]) || !Fi(e.caseLayoutFrameStates?.[n.name], t.caseLayoutFrameStates?.[n.name])) return !1;
-	return !0;
-}
-function Fi(e, t) {
-	return e === t || e?.expectedSessionId === t?.expectedSessionId && e?.ready === t?.ready && e?.tree === t?.tree && e?.size?.height === t?.size?.height && e?.size?.width === t?.size?.width && e?.error?.message === t?.error?.message && e?.error?.stack === t?.error?.stack && e?.valuesByBoundaryId === t?.valuesByBoundaryId;
-}
-function Ii(e) {
-	return e?.error ? "error" : e?.ready ? "ready" : "loading";
-}
-function Li(e, t) {
-	return e ? zi(e, t)?.rect : void 0;
-}
-function Ri(e) {
-	if (e.diagnostics.length > 0) return e.diagnostics.map((e) => e.code).join(", ");
-	if (!e.cases[0]) return "missing-case";
-}
-function zi(e, t) {
-	for (let n of e) {
-		if (n.coordinate === t) return n;
-		let e = zi(n.children, t);
-		if (e) return e;
-	}
-}
-//#endregion
-//#region src/components/StudioComponentCardSlot.tsx
-var Bi = typeof window > "u" ? a.useEffect : a.useLayoutEffect;
-function Vi(e) {
-	let t = a.useRef(e.onPreviewGeometryChange), n = a.useRef(e.onSelect);
-	t.current = e.onPreviewGeometryChange, n.current = e.onSelect;
-	let r = Wi({
-		component: e.component,
-		previewGeometryStore: e.previewGeometryStore,
-		viewportPreset: e.viewportPreset
-	}), i = a.useMemo(() => Yn(e.component, e.viewportPreset, e.fallbackFrameStates, e.fallbackPreviewCache, e.previewGeometryStore), [
-		e.component,
-		e.fallbackFrameStates,
-		e.fallbackPreviewCache,
-		e.previewGeometryStore,
-		e.viewportPreset,
-		r
-	]), o = a.useMemo(() => Jn(e.component, e.viewportPreset, e.fallbackFrameStates, e.fallbackPreviewCache, e.previewGeometryStore), [
-		e.component,
-		e.fallbackFrameStates,
-		e.fallbackPreviewCache,
-		e.previewGeometryStore,
-		e.viewportPreset,
-		r
-	]), c = Gi(e.component, o), l = a.useCallback((e, t, r, i) => {
-		n.current(e, t, r, i);
-	}, []);
-	return Bi(() => {
-		t.current?.();
-	}, [c]), /* @__PURE__ */ s(Ni, {
-		caseFrameStates: i,
-		caseLayoutFrameStates: o,
-		casePreviewScale: e.casePreviewScale,
-		columnIndex: e.columnIndex,
-		component: e.component,
-		debugPreviewPool: e.debugPreviewPool,
-		debugPreviewQueue: e.debugPreviewQueue,
-		manifest: e.manifest,
-		onPreviewFrameMount: e.onPreviewFrameMount,
-		onSelect: l,
-		selected: e.selected,
-		selectedCaseName: e.selectedCaseName,
-		viewportPreset: e.viewportPreset
-	});
-}
-var Hi = a.memo(Vi, Ui);
-function Ui(e, t) {
-	return e.casePreviewScale === t.casePreviewScale && e.columnIndex === t.columnIndex && e.component === t.component && e.debugPreviewPool === t.debugPreviewPool && e.debugPreviewQueue === t.debugPreviewQueue && e.fallbackFrameStates === t.fallbackFrameStates && e.fallbackPreviewCache === t.fallbackPreviewCache && e.manifest === t.manifest && e.onPreviewGeometryChange === t.onPreviewGeometryChange && e.onPreviewFrameMount === t.onPreviewFrameMount && e.onSelect === t.onSelect && e.previewGeometryStore === t.previewGeometryStore && e.selected === t.selected && e.selectedCaseName === t.selectedCaseName && e.viewportPreset === t.viewportPreset;
-}
-function Wi(e) {
-	let t = a.useMemo(() => e.previewGeometryStore ? ut({
-		component: e.component,
-		viewportPreset: e.viewportPreset
-	}) : [], [
-		e.component,
-		e.previewGeometryStore,
-		e.viewportPreset
-	]);
-	return a.useSyncExternalStore(a.useCallback((n) => e.previewGeometryStore?.subscribe(t, n) ?? (() => {}), [e.previewGeometryStore, t]), a.useCallback(() => e.previewGeometryStore?.getVersionForKeys(t) ?? "", [e.previewGeometryStore, t]), () => "");
-}
-function Gi(e, t) {
-	return e.cases.map((e) => `${e.name}:${Ki(t[e.name])}`).join("|");
-}
-function Ki(e) {
-	return e ? `${e.size ? `${e.size.width}x${e.size.height}` : "-"}:${qi(e.tree)}` : "pending";
-}
-function qi(e) {
-	if (!e) return "-";
-	let t = [], n = (e) => {
-		let r = e.rect ? `${e.rect.x},${e.rect.y},${e.rect.width},${e.rect.height}` : "-";
-		t.push(`${e.coordinate}@${r}`);
-		for (let t of e.children) n(t);
-	};
-	for (let t of e) n(t);
-	return t.join(";");
-}
-//#endregion
-//#region src/components/ViewportPresetTabs.g.tsx
-var Ji = [
-	"phone",
-	"tablet",
-	"desktop"
-];
-function Yi(e) {
-	let t = Math.max(0, Ji.indexOf(e.selectedPreset));
-	return /* @__PURE__ */ c("div", {
-		"aria-label": "Viewport",
-		"data-gtsx-floating-viewport-controls": e.floating ? !0 : void 0,
-		style: {
-			background: "rgba(255,255,255,0.82)",
-			border: "1px solid rgba(216,222,232,0.92)",
-			borderRadius: 999,
-			boxShadow: "0 10px 30px rgba(31,35,40,0.12)",
-			display: "grid",
-			gridTemplateColumns: `repeat(${Ji.length}, 34px)`,
-			...e.floating ? {
-				left: "50%",
-				position: "absolute",
-				top: 16,
-				transform: "translateX(-50%)",
-				zIndex: 3
-			} : {},
-			padding: 3,
-			position: e.floating ? "absolute" : "relative",
-			width: "max-content"
-		},
-		children: [/* @__PURE__ */ s("span", {
-			"aria-hidden": "true",
-			"data-gtsx-viewport-tab-highlight": e.floating ? !0 : void 0,
-			style: {
-				background: "#ffffff",
-				border: "1px solid #d8dee8",
-				borderRadius: 999,
-				boxShadow: "0 3px 10px rgba(31,35,40,0.12)",
-				height: 28,
-				left: 3,
-				position: "absolute",
-				top: 3,
-				transform: `translateX(${t * 34}px)`,
-				transition: "transform 120ms ease",
-				width: 32
-			}
-		}), Ji.map((t) => /* @__PURE__ */ s("button", {
-			"aria-label": `Viewport ${t}`,
-			"data-gtsx-viewport-control": t,
-			onClick: () => e.onChange?.(t),
-			style: {
-				alignItems: "center",
-				background: "transparent",
-				border: 0,
-				color: e.selectedPreset === t ? "#0969da" : "#57606a",
-				cursor: e.onChange ? "pointer" : "default",
-				display: "grid",
-				height: 28,
-				justifyItems: "center",
-				padding: 0,
-				position: "relative",
-				width: 32,
-				zIndex: 1
-			},
-			title: t,
-			type: "button",
-			children: /* @__PURE__ */ s(Zi, { preset: t })
-		}, t))]
-	});
-}
-var Xi = i("src/components/ViewportPresetTabs.g.tsx#default", Yi);
-Xi.cases = {
-	tabletSelected: { props: { selectedPreset: "tablet" } },
-	floatingPhoneSelected: { props: {
-		floating: !0,
-		selectedPreset: "phone"
-	} }
-};
-function Zi(e) {
-	return e.preset === "phone" ? /* @__PURE__ */ s("span", {
-		"aria-hidden": "true",
-		style: {
-			border: "1.5px solid currentColor",
-			borderRadius: 3,
-			height: 16,
-			width: 9
-		}
-	}) : e.preset === "tablet" ? /* @__PURE__ */ s("span", {
-		"aria-hidden": "true",
-		style: {
-			border: "1.5px solid currentColor",
-			borderRadius: 3,
-			height: 15,
-			width: 12
-		}
-	}) : /* @__PURE__ */ s("span", {
-		"aria-hidden": "true",
-		style: {
-			border: "1.5px solid currentColor",
-			borderRadius: 2,
-			height: 11,
-			width: 18
-		}
-	});
-}
-//#endregion
-//#region src/components/StudioWorkspaceView.g.tsx
-var Qi = typeof window > "u" ? a.useEffect : a.useLayoutEffect, $i = "[data-gtsx-canvas-wheel-exempt]", ea = 24;
-function ta(e) {
-	return !(typeof Element < "u" && e instanceof Element && e.closest($i));
-}
-function na(e) {
-	return typeof Element > "u" || !(e instanceof Element) || !e.closest("a,button,iframe");
-}
-function ra(e) {
-	let t = U(e.manifest, e.selection), [n, r] = a.useState(), i = I(e.workspace), o = a.useMemo(() => Bn(), []), s = a.useRef(i), c = a.useRef(e.frameStates), l = a.useRef(() => {}), u = a.useRef(() => {}), [d, f] = a.useState(), [p, m] = a.useState(), h = a.useRef(e.onSelectComponent), g = a.useRef(hr({ now: () => typeof performance < "u" ? performance.now() : Date.now() })), _ = a.useRef(e.previewRenderQueue), v = a.useRef(() => {}), y = a.useRef(e.workspace);
-	s.current = i, c.current = e.frameStates, h.current = e.onSelectComponent, _.current = e.previewRenderQueue, y.current = e.workspace;
-	let b = Cr({
-		canvas: e.canvas,
-		onCanvasChange: e.onChangeCanvas,
-		onCanvasMove(e) {
-			v.current(e);
-		},
-		onCanvasPanEnd() {
-			l.current(void 0, { includeBuffer: !0 });
-		},
-		shouldHandleWheelTarget: ta
-	}), x = a.useCallback(() => {
-		u.current(b.canvasRef.current);
-	}, [b.canvasRef]), S = jr({
-		canvasRef: b.canvasRef,
-		canvasSurfaceElement: b.canvasSurfaceElement,
-		canvasViewportPreset: i,
-		frameStates: e.frameStates,
-		onLayoutMeasured: x,
-		previewCache: e.previewCache,
-		previewGeometryStore: e.previewGeometryStore,
-		workspace: e.workspace
-	}), { flushPreviewRender: C, requestCanvasPreviewRender: w, requestPreviewRender: T } = ni({
-		canvasRef: b.canvasRef,
-		canvasViewportElement: b.canvasViewportElement,
-		canvasViewportPresetRef: s,
-		columnLayoutByIndexRef: S.columnLayoutByIndexRef,
-		columnMeasurementsByIndexRef: S.columnMeasurementsByIndexRef,
-		frameStatesRef: c,
-		previewGeometryStore: e.previewGeometryStore,
-		previewRenderQueueRef: _,
-		previewRenderSessionStore: o,
-		workspaceRef: y
-	});
-	l.current = C, u.current = T, v.current = w, Qi(() => {
-		T(b.canvasRef.current);
-	}, [b.canvasViewportElement, T]), a.useEffect(() => {
-		T(b.canvasRef.current);
-	}, [
-		i,
-		S.layoutMeasurementKey,
-		T
-	]), a.useEffect(() => {
-		e.previewGeometryStore || T(b.canvasRef.current);
-	}, [
-		e.frameStates,
-		e.previewGeometryStore,
-		T
-	]), a.useEffect(() => {
-		if (!e.debugPreviewQueue || typeof window > "u") return;
-		let t = g.current, n = 0, r = (e) => {
-			m(e), document.documentElement.setAttribute("data-gtsx-preview-render-observation", JSON.stringify(e)), window.dispatchEvent(new CustomEvent("gtsx:preview-render-observation", { detail: e }));
-		}, i = () => {
-			n = 0, f(void 0);
-		}, a = (e) => {
-			let a = e.detail;
-			r(t.observeQueueRun(a)), !(!a?.showRenderExpansionCenterPulse || !a.renderExpansionCenterViewportPoint) && (n && window.clearTimeout(n), f({
-				id: Date.now(),
-				x: a.renderExpansionCenterViewportPoint.x,
-				y: a.renderExpansionCenterViewportPoint.y
-			}), n = window.setTimeout(i, 650));
-		}, o = (e) => {
-			let n = e.detail;
-			!n?.sessionId || n.type !== "gtsx:ready" && n.type !== "gtsx:error" || r(t.observePreviewTiming({
-				sessionId: n.sessionId,
-				type: n.type
-			}));
-		};
-		return window.addEventListener("gtsx:preview-queue-debug", a), window.addEventListener("gtsx:preview-timing", o), () => {
-			window.removeEventListener("gtsx:preview-queue-debug", a), window.removeEventListener("gtsx:preview-timing", o), document.documentElement.removeAttribute("data-gtsx-preview-render-observation"), n && window.clearTimeout(n);
-		};
-	}, [e.debugPreviewQueue]), a.useEffect(() => {
-		r(void 0);
-	}, [e.selection]);
-	let E = a.useCallback((e, t, n = {}) => {
-		if (!b.canvasViewportElement) return;
-		let r = S.getCardElement(e, t);
-		if (!r) return;
-		let i = b.canvasRef.current, a = Oe(i, {
-			margin: ea,
-			rect: Xn(r.getBoundingClientRect()),
-			viewportRect: Xn(b.canvasViewportElement.getBoundingClientRect())
-		}), o = n.preserveVerticalCanvasPosition ? {
-			...a,
-			y: i.y
-		} : a;
-		o !== i && b.moveCanvas(() => o);
-	}, [b, S.getCardElement]), D = a.useCallback((e, t, n = {}) => {
-		E(e, t, n), !(typeof window > "u") && window.requestAnimationFrame(() => E(e, t, n));
-	}, [E]), O = a.useCallback((e, t, n, i) => {
-		let a = er($n(y.current, n, e.coordinate));
-		r((t) => Ae(t === a ? e.coordinate : void 0, {
-			type: "activate-card",
-			coordinate: e.coordinate,
-			source: i
-		}) ? a : void 0), h.current?.(e, t, { columnIndex: n }), D(n, e.coordinate, { preserveVerticalCanvasPosition: i === "pointer" });
-	}, [D]);
-	return {
-		canvas: b.canvas,
-		canvasViewportPreset: i,
-		columnLayoutByIndex: S.columnLayoutByIndex,
-		onCanvasPointerCancel: b.onCanvasPointerCancel,
-		onCanvasPointerDown(e) {
-			na(e.target) && r(void 0), b.onCanvasPointerDown(e);
-		},
-		onCanvasPointerMove: b.onCanvasPointerMove,
-		onCanvasPointerUp: b.onCanvasPointerUp,
-		onChangeSelection: e.onChangeSelection ? (t) => {
-			r(void 0), e.onChangeSelection?.(t);
-		} : void 0,
-		onSelectCard: O,
-		onPreviewGeometryChange: S.scheduleMeasurement,
-		onViewportPresetChange(t) {
-			if (e.onChangeCanvasViewportPreset) e.onChangeCanvasViewportPreset(t);
-			else for (let n of ze(e.workspace)) e.onChangeViewportPreset?.(n, t);
-		},
-		casePreviewScale: S.casePreviewScale,
-		renderObservationSnapshot: p,
-		renderExpansionCenterPulse: d,
-		previewRenderSessionStore: o,
-		selected: t,
-		selectedCardPathKey: n,
-		setCanvasSurfaceElement: b.setCanvasSurfaceElement,
-		setCanvasViewportElement: b.setCanvasViewportElement,
-		setCardElement: S.setCardElement,
-		setColumnElement: S.setColumnElement
-	};
-}
-var ia = r(ra);
-function aa(e) {
-	let t = ia(e), n = e.previewCacheReady ?? !0, r = typeof window > "u" ? Qn(t.canvas) : void 0;
-	return /* @__PURE__ */ s(Hn, {
-		store: t.previewRenderSessionStore,
-		children: /* @__PURE__ */ s("main", {
-			style: {
-				display: "grid",
-				height: "100vh",
-				overflow: "hidden",
-				background: "#f5f6f8",
-				color: "#1f2328",
-				fontFamily: "ui-sans-serif, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif"
-			},
-			children: /* @__PURE__ */ s("section", {
-				style: {
-					display: "grid",
-					minHeight: 0,
-					minWidth: 0
-				},
-				children: /* @__PURE__ */ c("div", {
-					"aria-label": "GTSX Studio canvas viewport",
-					"data-gtsx-canvas-viewport": !0,
-					onPointerDown: t.onCanvasPointerDown,
-					onPointerMove: t.onCanvasPointerMove,
-					onPointerUp: t.onCanvasPointerUp,
-					onPointerCancel: t.onCanvasPointerCancel,
-					ref: t.setCanvasViewportElement,
-					"aria-busy": n ? void 0 : !0,
-					style: {
-						backgroundColor: "#f5f6f8",
-						backgroundImage: "radial-gradient(circle at 1px 1px, rgba(31,35,40,0.10) 1px, transparent 0)",
-						backgroundSize: "24px 24px",
-						cursor: "grab",
-						height: "100%",
-						minHeight: 0,
-						overscrollBehavior: "none",
-						overflow: "hidden",
-						position: "relative",
-						touchAction: "none"
-					},
-					role: "application",
-					tabIndex: 0,
-					children: [
-						/* @__PURE__ */ s(Xi, {
-							floating: !0,
-							onChange: t.onViewportPresetChange,
-							selectedPreset: t.canvasViewportPreset
-						}),
-						t.renderExpansionCenterPulse ? /* @__PURE__ */ s("span", {
-							"aria-label": "Preview render expansion center",
-							"data-gtsx-preview-render-expansion-center-pulse": "true",
-							style: {
-								background: "rgba(13,153,255,0.24)",
-								border: "2px solid #0d99ff",
-								borderRadius: 999,
-								boxShadow: "0 0 0 6px rgba(13,153,255,0.14)",
-								height: 18,
-								left: t.renderExpansionCenterPulse.x,
-								pointerEvents: "none",
-								position: "absolute",
-								top: t.renderExpansionCenterPulse.y,
-								transform: "translate(-50%, -50%)",
-								width: 18,
-								zIndex: 4
-							}
-						}, t.renderExpansionCenterPulse.id) : null,
-						e.urlWarning ? /* @__PURE__ */ s("p", {
-							role: "status",
-							style: {
-								background: "#fff8c5",
-								border: "1px solid #d4a72c",
-								borderRadius: 8,
-								color: "#5a1e02",
-								fontSize: 12,
-								left: 16,
-								lineHeight: 1.45,
-								margin: 0,
-								maxWidth: 280,
-								padding: "8px 10px",
-								position: "absolute",
-								top: 16,
-								zIndex: 3
-							},
-							children: e.urlWarning
-						}) : null,
-						e.debugPreviewQueue && t.renderObservationSnapshot ? /* @__PURE__ */ s(sa, { snapshot: t.renderObservationSnapshot }) : null,
-						n ? /* @__PURE__ */ s("div", {
-							"data-gtsx-canvas-surface": !0,
-							ref: t.setCanvasSurfaceElement,
-							style: {
-								display: "block",
-								left: 0,
-								padding: "0 80px 80px 0",
-								position: "absolute",
-								top: 0,
-								...r ? { transform: r } : {},
-								transformOrigin: "0 0"
-							},
-							children: e.workspace.columns.map((n, r) => /* @__PURE__ */ s("section", {
-								"data-gtsx-column-index": r,
-								"data-gtsx-column-layout-x": t.columnLayoutByIndex[r]?.x ?? 0,
-								"data-gtsx-column-layout-y": t.columnLayoutByIndex[r]?.y ?? 0,
-								"data-gtsx-column-parent-coordinate": n.parentCoordinate,
-								ref: (e) => t.setColumnElement(r, e),
-								style: {
-									display: "grid",
-									gap: 10,
-									left: t.columnLayoutByIndex[r]?.x ?? 0,
-									position: "absolute",
-									top: t.columnLayoutByIndex[r]?.y ?? 0,
-									width: "max-content"
-								},
-								children: n.components.map((n) => {
-									let i = er($n(e.workspace, r, n.coordinate));
-									return /* @__PURE__ */ s("div", {
-										ref: (e) => t.setCardElement(r, n.coordinate, e),
-										style: {
-											display: "grid",
-											justifySelf: "start",
-											width: "max-content"
-										},
-										children: /* @__PURE__ */ s(Hi, {
-											casePreviewScale: t.casePreviewScale,
-											columnIndex: r,
-											component: n,
-											debugPreviewPool: e.debugPreviewPool,
-											debugPreviewQueue: e.debugPreviewQueue,
-											fallbackFrameStates: e.frameStates,
-											fallbackPreviewCache: e.previewCache,
-											manifest: e.manifest,
-											onPreviewFrameMount: e.onPreviewFrameMount,
-											onPreviewGeometryChange: t.onPreviewGeometryChange,
-											onSelect: t.onSelectCard,
-											previewGeometryStore: e.previewGeometryStore,
-											selected: t.selectedCardPathKey === i,
-											selectedCaseName: E(e.workspace, n),
-											viewportPreset: t.canvasViewportPreset
-										})
-									}, n.coordinate);
-								})
-							}, r))
-						}) : null
-					]
-				})
-			})
-		})
-	});
-}
-var oa = i("src/components/StudioWorkspaceView.g.tsx#default", aa);
-function sa(e) {
-	let t = e.snapshot.scrollResponse, n = e.snapshot.fullRender;
-	return /* @__PURE__ */ c("aside", {
-		"aria-label": "Preview render observation",
-		"data-gtsx-preview-render-observation-panel": "true",
-		style: {
-			background: "rgba(255,255,255,0.92)",
-			border: "1px solid rgba(216,222,228,0.95)",
-			borderRadius: 6,
-			bottom: 12,
-			boxShadow: "0 3px 12px rgba(31,35,40,0.14)",
-			color: "#1f2328",
-			display: "grid",
-			fontFamily: "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",
-			fontSize: 11,
-			gap: 3,
-			left: 12,
-			lineHeight: 1.35,
-			padding: "7px 9px",
-			pointerEvents: "none",
-			position: "absolute",
-			zIndex: 5
-		},
-		children: [/* @__PURE__ */ c("span", {
-			"data-gtsx-preview-render-observation-scroll": "true",
-			children: [
-				"scroll",
-				" ",
-				t ? `${ca(t.firstVisibleCompletionMilliseconds)} ${t.completedVisibleSessionCount}/${t.visibleSessionCount}` : "idle"
-			]
-		}), /* @__PURE__ */ c("span", {
-			"data-gtsx-preview-render-observation-full": "true",
-			children: [
-				"full",
-				" ",
-				n ? `${ca(n.latestCompletionMilliseconds)} ${n.completedSessionCount}/${n.sessionCount} ${la(n.renderCompletionsPerSecond)}` : "idle"
-			]
-		})]
-	});
-}
-function ca(e) {
-	return typeof e == "number" ? `${e}ms` : "...";
-}
-function la(e) {
-	return typeof e == "number" ? `${e}/s` : ".../s";
-}
-oa.cases = { multiExportFile: {
-	props: {
-		manifest: {
-			version: 1,
-			routes: {
-				preview: "/gtsx",
-				studio: "/gtsx/studio",
-				manifest: "/gtsx/studio/manifest"
-			},
-			preview: {
-				urlTemplate: "/gtsx?entry={entry}&case={case}{gcase}",
-				allUrlTemplate: "/gtsx?entry={entry}{gcase}"
-			},
-			files: [{
-				path: "src/MultiExport.g.tsx",
-				groupId: "file:src/MultiExport.g.tsx",
-				components: [{
-					coordinate: "src/MultiExport.g.tsx#NamedBadge",
-					filePath: "src/MultiExport.g.tsx",
-					exportName: "NamedBadge",
-					componentName: "NamedBadge",
-					mode: "pure",
-					cases: [{
-						kind: "pure",
-						name: "ready"
-					}],
-					providers: {},
-					diagnostics: []
-				}],
-				diagnostics: []
-			}],
-			diagnostics: []
-		},
-		workspace: {
-			canvasViewportPreset: "tablet",
-			columns: [{ components: [{
-				coordinate: "src/MultiExport.g.tsx#NamedBadge",
-				filePath: "src/MultiExport.g.tsx",
-				exportName: "NamedBadge",
-				componentName: "NamedBadge",
-				mode: "pure",
-				cases: [{
-					kind: "pure",
-					name: "ready"
-				}],
-				providers: {},
-				diagnostics: []
-			}] }],
-			selectedCaseByCoordinate: {},
-			selectedCoordinatePath: [],
-			selectedRuntimeInstanceByCoordinate: {},
-			selectedViewportPresetByCoordinate: {}
-		}
-	},
-	scope: {
-		canvas: {
-			x: 40,
-			y: 40,
-			scale: 1
-		},
-		canvasViewportPreset: "tablet",
-		casePreviewScale: 1,
-		columnLayoutByIndex: {},
-		onCanvasPointerCancel() {},
-		onCanvasPointerDown() {},
-		onCanvasPointerMove() {},
-		onCanvasPointerUp() {},
-		onPreviewGeometryChange() {},
-		onSelectCard() {},
-		onViewportPresetChange() {},
-		previewRenderSessionStore: Bn(),
-		selected: {
-			id: "file:src/MultiExport.g.tsx",
-			components: []
-		},
-		setCanvasSurfaceElement() {},
-		setCanvasViewportElement() {},
-		setCardElement() {},
-		setColumnElement() {}
-	}
-} };
-//#endregion
-//#region src/components/StudioShell.tsx
-var ua = 120, da = typeof window > "u" ? a.useEffect : a.useLayoutEffect;
-function fa(e) {
-	let t = a.useMemo(() => pe(e.selection, e.urlSearch), [e.selection, e.urlSearch]), n = a.useMemo(() => j(e.manifest, t), [t, e.manifest]), r = a.useMemo(() => _e(t), [t]), i = a.useMemo(() => ve(t), [t]), o = a.useMemo(() => ye(t), [t]), s = a.useMemo(() => ({
-		...Pt(t),
-		...e.previewRenderQueue
-	}), [t, e.previewRenderQueue]), [c, l] = a.useState(n.selection), u = pa(n.canvas), [d, f] = a.useState(n.warning), [p, m] = a.useState(n.workspace), h = a.useRef(/* @__PURE__ */ new Map()), g = a.useRef(/* @__PURE__ */ new Map()), _ = a.useMemo(() => Ue(p), [p]), v = a.useMemo(() => We(e.manifest, p), [e.manifest, p]), y = a.useMemo(() => Ze(e.manifest), [e.manifest]), b = a.useMemo(() => ct(e.manifest), [e.manifest]), x = a.useMemo(() => lt({
-		cacheKeys: b,
-		namespace: y
-	}), [y, b]), S = ha(e.manifest), [C, T] = a.useState(!0), E = a.useMemo(() => new Map(v.map((e) => [e.sessionId, e])), [v]), D = a.useRef(c);
-	a.useEffect(() => {
-		D.current = c;
-	}, [c]), a.useEffect(() => {
-		x.reset();
-	}, [x]), da(() => {
-		let e = !1;
-		return T(S ? x.cacheKeys.length === 0 : !0), x.hydrate().then(() => {
-			e || S && T(!0);
-		}), () => {
-			e = !0;
-		};
-	}, [x, S]), a.useEffect(() => {
-		let e = [], t = 0, n = () => {
-			t = 0;
-			let n = e;
-			e = [], n.length !== 0 && a.startTransition(() => {
-				let e = Fn({
-					getFrameState: x.getFrameState,
-					messages: n
-				});
-				if (e.messagesToApply.length === 0) return;
-				let t = x.putMessages(e.messagesToApply, _);
-				for (let t of e.completionMessages) ga(t.target, t.message, t.mountedAt);
-				t.changed && x.writeEntries(t.entriesToWrite);
-			});
-		}, r = () => {
-			t ||= window.requestAnimationFrame(n);
-		}, i = (t) => {
-			let n = t.data;
-			if (!Ke(n)) return;
-			let i = E.get(n.sessionId);
-			i && (e.push({
-				message: n,
-				mountedAt: g.current.get(n.sessionId),
-				target: i
-			}), r());
-		};
-		return window.addEventListener("message", i), () => {
-			window.removeEventListener("message", i), t && window.cancelAnimationFrame(t);
-		};
-	}, [
-		x,
-		_,
-		E
-	]), a.useEffect(() => {
-		let t = () => {
-			let t = j(e.manifest, new URLSearchParams(window.location.search));
-			u.restoreCanvasFromUrl(t.canvas), l(t.selection), f(t.warning), m(t.workspace);
-		};
-		return window.addEventListener("popstate", t), () => window.removeEventListener("popstate", t);
-	}, [u, e.manifest]);
-	let O = a.useCallback((e) => {
-		m((t) => {
-			let n = e(t);
-			return ge(D.current, n, { canvas: u.liveCanvasRef.current }), n;
-		});
-	}, [u.liveCanvasRef]), A = a.useCallback((e, t, n) => {
-		t ? (h.current.set(e, t), g.current.set(e, performance.now()), n?.retainedRender || x.markSessionRenderStarted(e)) : (h.current.delete(e), g.current.delete(e));
-	}, [x]);
-	return {
-		canvas: u.restoredCanvas,
-		debugPreviewPool: r,
-		debugPreviewQueue: i,
-		disablePreviewPool: o,
-		onChangeCanvas: u.commitLiveCanvasChange,
-		onChangeCanvasViewportPreset(e) {
-			O((t) => k(t, e));
-		},
-		onChangeSelection(t) {
-			let n = new URLSearchParams();
-			n.set("selection", t);
-			let r = I(p);
-			r !== "tablet" && n.set("canvasViewport", r);
-			let i = j(e.manifest, n);
-			D.current = i.selection, l(i.selection), f(i.warning), m(i.workspace), ge(i.selection, i.workspace, { canvas: u.liveCanvasRef.current });
-		},
-		onChangeViewportPreset(e, t) {
-			O((n) => ee(n, e.coordinate, t));
-		},
-		onPreviewFrameMount: A,
-		onSelectComponent(t, n, r) {
-			O((i) => w(i, e.manifest, t.coordinate, Object.values(n).flatMap((e) => e?.tree ? [e.tree] : []), r));
-		},
-		previewCacheReady: C,
-		previewGeometryStore: x,
-		previewRenderQueue: s,
-		selection: c,
-		urlWarning: d,
-		workspace: p
-	};
-}
-function pa(e) {
-	let [t, n] = a.useState(e), r = a.useRef(t), i = a.useRef(null), o = a.useRef(0), s = a.useCallback(() => {
-		i.current = null, o.current &&= (window.clearTimeout(o.current), 0);
-	}, []), c = a.useCallback(() => {
-		o.current = 0;
-		let e = i.current;
-		e && (i.current = null, he(e));
-	}, []), l = a.useCallback((e) => {
-		r.current = e, i.current = e, o.current && window.clearTimeout(o.current), o.current = window.setTimeout(c, ua);
-	}, [c]), u = a.useCallback((e) => {
-		s(), r.current = e, n(e);
-	}, [s]);
-	return a.useEffect(() => () => s(), [s]), a.useMemo(() => ({
-		commitLiveCanvasChange: l,
-		liveCanvasRef: r,
-		restoreCanvasFromUrl: u,
-		restoredCanvas: t
-	}), [
-		l,
-		u,
-		t
-	]);
-}
-function ma(e) {
-	let t = fa(e), n = /* @__PURE__ */ s(o, { children: /* @__PURE__ */ s(oa, {
-		canvas: t.canvas,
-		debugPreviewPool: t.debugPreviewPool,
-		debugPreviewQueue: t.debugPreviewQueue,
-		manifest: e.manifest,
-		onChangeCanvas: t.onChangeCanvas,
-		onSelectComponent: t.onSelectComponent,
-		onChangeCanvasViewportPreset: t.onChangeCanvasViewportPreset,
-		onChangeSelection: t.onChangeSelection,
-		onChangeViewportPreset: t.onChangeViewportPreset,
-		onPreviewFrameMount: t.onPreviewFrameMount,
-		previewCacheReady: t.previewCacheReady,
-		previewGeometryStore: t.previewGeometryStore,
-		previewRenderQueue: t.previewRenderQueue,
-		selection: t.selection,
-		urlWarning: t.urlWarning,
-		workspace: t.workspace
-	}) });
-	return t.disablePreviewPool ? n : /* @__PURE__ */ s(nn, {
-		debug: t.debugPreviewPool,
-		poolUrl: Be(e.manifest),
-		children: n
-	});
-}
-function ha(e) {
-	return !!e.cache?.namespace || typeof window < "u";
-}
-function ga(e, t, n) {
-	t.type !== "gtsx:ready" && t.type !== "gtsx:error" || window.dispatchEvent(new CustomEvent("gtsx:preview-timing", { detail: {
-		cacheKey: e.cacheKey,
-		sessionId: t.sessionId,
-		type: t.type,
-		...typeof n == "number" ? { elapsedMs: Math.round((performance.now() - n) * 10) / 10 } : {}
-	} }));
-}
-//#endregion
-export { j as $, Dt as A, v as B, Et as C, Tt as D, Ct as E, ct as F, Le as G, D as H, ut as I, me as J, F as K, De as L, Pt as M, Nt as N, wt as O, lt as P, S as Q, Ae as R, Fn as S, St as T, ee as U, k as V, Re as W, R as X, Be as Y, te as Z, Q as _, V as _t, Zr as a, ye as at, ir as b, Kr as c, z as ct, Ir as d, Oe as dt, A as et, Nr as f, Je as ft, Pr as g, B as gt, Fr as h, E as ht, Yr as i, _e as it, At as j, Ot as k, zr as l, he as lt, Mr as m, O as mt, oa as n, C as nt, Wr as o, ve as ot, Z as p, w as pt, ke as q, Xr as r, Ke as rt, Gr as s, H as st, ma as t, We as tt, Lr as u, U as ut, Rr as v, Ve as vt, kt as w, Bn as x, hr as y, _ as z };