@apisurf/wireui 0.1.2 → 0.1.4

package/dist/server/_ssr/router-ClsXvW-b.mjs

@@ -0,0 +1,1068 @@
+import { __toESM } from "../_runtime.mjs";
+import { HeadContent, Link, Outlet, Scripts, createFileRoute, createRootRoute, createRouter, getRouteApi, lazyRouteComponent, notFound, require_jsx_runtime, require_react, useNavigate, useRouterState } from "../_libs/@tanstack/react-router+[...].mjs";
+import { TSS_SERVER_FUNCTION, createServerFn, getServerFnById } from "./ssr.mjs";
+import { Dot, Empty, FilterInput, IconButton, IconChevronLeft, IconChevronRight, IconClose, IconDatabase, IconEnvironments, IconHistory, IconMonitor, IconMoon, IconOverview, IconRefresh, IconRequest, IconRun, IconSessions, IconSplitSide, IconSplitStacked, IconSun, MethodBadge, NotFound, PrefsProvider, RouteError, THEME_BOOT_SCRIPT, TabsProvider, basename, css, cx, formatAgo, formatBytes, formatCount, matchesEnv, mono, runTone, runVerdict, tabKey, truncate, useNow, usePrefs, useTabs } from "./prefs-iPvYd_Vz.mjs";
+//#region node_modules/.nitro/vite/services/ssr/assets/api-BM3HZHc4.js
+var createSsrRpc = (functionId) => {
+	const url = "/_serverFn/" + functionId;
+	const serverFnMeta = { id: functionId };
+	const fn = async (...args) => {
+		return (await getServerFnById(functionId, { origin: "server" }))(...args);
+	};
+	return Object.assign(fn, {
+		url,
+		serverFnMeta,
+		[TSS_SERVER_FUNCTION]: true
+	});
+};
+function record(input) {
+	return input && typeof input === "object" ? input : {};
+}
+function id(value, name) {
+	const n = typeof value === "string" ? Number(value) : value;
+	if (typeof n !== "number" || !Number.isInteger(n) || n <= 0) throw new Error(`${name} must be a positive integer`);
+	return n;
+}
+function optionalString(value) {
+	return typeof value === "string" ? value : void 0;
+}
+/** `undefined` → every environment, `null` → runs recorded without one. */
+function env(value) {
+	if (value === null) return null;
+	return typeof value === "string" ? value : void 0;
+}
+/** The open database when its schema is one these queries can read, else null. */
+var getWorkspace = createServerFn({ method: "GET" }).handler(createSsrRpc("65bc418eb60581304ebde68d2b8b775b58aa758789bcdd2e616a2bdd5657ef20"));
+var getOverview = createServerFn({ method: "GET" }).validator((input) => ({ env: env(record(input).env) })).handler(createSsrRpc("edb0cb28f3af0347a499a4c076ecc5f8247f0ace0fb524957f40f6a706d7224d"));
+var getHistory = createServerFn({ method: "GET" }).validator((input) => {
+	const r = record(input);
+	const kind = r.kind === "http" || r.kind === "stream" ? r.kind : void 0;
+	return {
+		q: optionalString(r.q),
+		env: env(r.env),
+		kind,
+		failed: r.failed === true,
+		bodies: r.bodies === true,
+		limit: typeof r.limit === "number" ? r.limit : void 0
+	};
+}).handler(createSsrRpc("c1e4e973ed505d1515bcb9192482c65b1680975a5daa6973befb704515a618e3"));
+var getScript = createServerFn({ method: "GET" }).validator((input) => {
+	const r = record(input);
+	const entry = optionalString(r.entry);
+	if (!entry) throw new Error("entry is required");
+	return {
+		entry,
+		env: env(r.env)
+	};
+}).handler(createSsrRpc("5eff62884e56f81742c81b44dc7dcd1afc2e67323a30591a8b94b8895eda0dc9"));
+var getRun = createServerFn({ method: "GET" }).validator((input) => ({ runId: id(record(input).runId, "runId") })).handler(createSsrRpc("56c165307cd91159eb72bfa882932f9552f05a5bbd6b5725f0fd5f4ad6b8295d"));
+var getRequest = createServerFn({ method: "GET" }).validator((input) => ({ requestId: id(record(input).requestId, "requestId") })).handler(createSsrRpc("3772b5ea3e53d85a63e4df11f128b1c907e508d82cca6e71e6ee48dba1664133"));
+var getSchema = createServerFn({ method: "GET" }).handler(createSsrRpc("06ff3639e7164884f56665ea621dc233dbfc78fa1557b1cb20105ff2fa90521e"));
+var runSql = createServerFn({ method: "POST" }).validator((input) => {
+	const sql = optionalString(record(input).sql)?.trim();
+	if (!sql) throw new Error("sql is required");
+	return { sql };
+}).handler(createSsrRpc("0f45629470ab3fbe618e9693d8685920d6ce48b2384512e5d9eb88f6b46ec2d9"));
+//#endregion
+//#region node_modules/.nitro/vite/services/ssr/assets/router-ClsXvW-b.js
+var import_react = /* @__PURE__ */ __toESM(require_react());
+var import_jsx_runtime = require_jsx_runtime();
+var __defProp = Object.defineProperty;
+var __exportAll = (all, no_symbols) => {
+	let target = {};
+	for (var name in all) __defProp(target, name, {
+		get: all[name],
+		enumerable: true
+	});
+	if (!no_symbols) __defProp(target, Symbol.toStringTag, { value: "Module" });
+	return target;
+};
+function useActiveEntry() {
+	return useRouterState({ select: (state) => {
+		let entry = null;
+		for (const match of state.matches) {
+			const data = match.loaderData;
+			if (!data || typeof data !== "object") continue;
+			if (data.run) entry = data.run.entry;
+			if (data.script) entry = data.script.entry;
+		}
+		return entry;
+	} });
+}
+var root$2 = getRouteApi("__root__");
+/** Every session in scope, most recently run first. */
+function useSessions() {
+	const ws = root$2.useLoaderData();
+	const { prefs } = usePrefs();
+	return import_react.useMemo(() => {
+		const byEntry = /* @__PURE__ */ new Map();
+		for (const row of ws.scriptEnvs) {
+			if (!matchesEnv(prefs.env, row.env)) continue;
+			const seen = byEntry.get(row.entry);
+			if (!seen) byEntry.set(row.entry, {
+				runCount: row.run_count,
+				latest: row
+			});
+			else {
+				seen.runCount += row.run_count;
+				if (row.last_started_at > seen.latest.last_started_at) seen.latest = row;
+			}
+		}
+		const out = [];
+		for (const script of ws.scripts) {
+			const scoped = byEntry.get(script.entry);
+			if (scoped) out.push({
+				script,
+				...scoped
+			});
+		}
+		return out.toSorted((a, b) => b.latest.last_started_at - a.latest.last_started_at);
+	}, [
+		ws.scripts,
+		ws.scriptEnvs,
+		prefs.env
+	]);
+}
+/** One session, or null when it has no runs in the selected environment. */
+function useSession(entry) {
+	return useSessions().find((c) => c.script.entry === entry) ?? null;
+}
+var root$1 = getRouteApi("__root__");
+var row = css({
+	display: "flex",
+	alignItems: "center",
+	gap: "1.5",
+	h: "26px",
+	pl: "2",
+	pr: "2",
+	rounded: "sm",
+	cursor: "pointer",
+	color: "fg",
+	textDecoration: "none",
+	userSelect: "none",
+	minW: "0",
+	_hover: { bg: "hover" },
+	"&[data-active=true]": { bg: "selected" }
+});
+var groupHeading = css({
+	fontSize: "10.5px",
+	color: "faint",
+	px: "2",
+	pt: "1.5",
+	pb: "0.5",
+	fontFamily: "mono"
+});
+function SessionsPanel({ filterRef }) {
+	const ws = root$1.useLoaderData();
+	const sessions = useSessions();
+	const active = useActiveEntry();
+	const [filter, setFilter] = import_react.useState("");
+	const needle = filter.trim().toLowerCase();
+	const groups = import_react.useMemo(() => {
+		const byDir = /* @__PURE__ */ new Map();
+		for (const session of sessions) {
+			const { script } = session;
+			if (needle && !script.rel.toLowerCase().includes(needle) && !(script.label ?? "").toLowerCase().includes(needle)) continue;
+			const list = byDir.get(script.dir) ?? [];
+			list.push(session);
+			byDir.set(script.dir, list);
+		}
+		return [...byDir.entries()];
+	}, [sessions, needle]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: css({
+			display: "flex",
+			flexDir: "column",
+			h: "full",
+			minH: "0"
+		}),
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+			className: css({
+				px: "2.5",
+				pb: "2",
+				flexShrink: 0
+			}),
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FilterInput, {
+				ref: filterRef,
+				placeholder: "Filter sessions",
+				shortcut: "/",
+				value: filter,
+				onChange: (e) => setFilter(e.target.value)
+			})
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+			className: css({
+				flex: "1",
+				minH: "0",
+				overflow: "auto",
+				px: "1.5",
+				pb: "3"
+			}),
+			children: groups.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Empty, {
+				title: ws.scripts.length === 0 ? "No sessions yet" : "No matches",
+				icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconSessions, { size: 20 }),
+				children: ws.scripts.length === 0 ? "Every script you record with wire execute becomes a session here." : "No script matches the filter in this environment."
+			}) : groups.map(([dir, list]) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: css({ mb: "2" }),
+				children: [dir ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+					title: dir,
+					className: cx(truncate, groupHeading),
+					children: dir
+				}) : null, list.map((session) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SessionRow, {
+					session,
+					active: active === session.script.entry
+				}, session.script.entry))]
+			}, dir))
+		})]
+	});
+}
+function SessionRow({ session, active }) {
+	const ws = root$1.useLoaderData();
+	const now = useNow(ws.now, 6e4);
+	const { pin } = useTabs();
+	const { script, runCount, latest } = session;
+	const tone = runTone(latest);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
+		to: "/sessions",
+		search: { entry: script.entry },
+		"data-active": active,
+		className: row,
+		onDoubleClick: () => pin(tabKey.script(script.entry)),
+		title: `${script.rel} · last ran ${formatAgo(now, latest.last_started_at)}`,
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: css({
+					color: "muted",
+					display: "inline-flex"
+				}),
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconSessions, { size: 14 })
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: cx(truncate, css({
+					flex: "1",
+					fontWeight: "500"
+				})),
+				children: script.file
+			}),
+			tone === "bad" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Dot, {
+				tone: "bad",
+				title: `Latest run: ${runVerdict(latest)}`
+			}) : null,
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: css({
+					fontSize: "11px",
+					color: "faint",
+					fontVariantNumeric: "tabular-nums"
+				}),
+				title: `${runCount} runs`,
+				children: runCount
+			})
+		]
+	});
+}
+var root = getRouteApi("__root__");
+function Shell({ children }) {
+	const { prefs } = usePrefs();
+	const filterRef = import_react.useRef(null);
+	useSlashToFilter(filterRef);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: css({
+			display: "flex",
+			flexDir: "column",
+			h: "100vh",
+			bg: "chrome"
+		}),
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TopBar, {}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: css({
+					display: "flex",
+					flex: "1",
+					minH: "0"
+				}),
+				children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Rail, {}),
+					prefs.sidebarOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Sidebar, { filterRef }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CollapsedSidebar, {}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("main", {
+						className: css({
+							display: "flex",
+							flexDir: "column",
+							flex: "1",
+							minW: "0",
+							bg: "canvas",
+							borderLeft: "1px solid",
+							borderTop: "1px solid",
+							borderColor: "line",
+							roundedTopLeft: "lg",
+							overflow: "hidden"
+						}),
+						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabStrip, {}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+							className: css({
+								flex: "1",
+								minH: "0",
+								display: "flex",
+								flexDir: "column"
+							}),
+							children
+						})]
+					})
+				]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusBar, {})
+		]
+	});
+}
+/**
+* `/` focuses a filter, as in most tools with one: the page's own when it has
+* one (History), else the session sidebar's.
+*/
+function useSlashToFilter(ref) {
+	const { prefs, set } = usePrefs();
+	import_react.useEffect(() => {
+		const onKey = (event) => {
+			if (event.key !== "/" || event.metaKey || event.ctrlKey || event.altKey) return;
+			const target = event.target;
+			if (target && (target.isContentEditable || /^(INPUT|TEXTAREA|SELECT)$/.test(target.tagName))) return;
+			event.preventDefault();
+			const own = document.querySelector("main input[data-page-filter]");
+			if (own) {
+				own.focus();
+				return;
+			}
+			if (!prefs.sidebarOpen) set("sidebarOpen", true);
+			window.requestAnimationFrame(() => ref.current?.focus());
+		};
+		window.addEventListener("keydown", onKey);
+		return () => window.removeEventListener("keydown", onKey);
+	}, [
+		prefs.sidebarOpen,
+		set,
+		ref
+	]);
+}
+var THEME_NEXT = {
+	system: "light",
+	light: "dark",
+	dark: "system"
+};
+function TopBar() {
+	const ws = root.useLoaderData();
+	const { prefs, set, refresh } = usePrefs();
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", {
+		className: css({
+			display: "flex",
+			alignItems: "center",
+			gap: "3",
+			h: "44px",
+			px: "3",
+			flexShrink: 0
+		}),
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
+				to: "/",
+				className: css({
+					display: "flex",
+					alignItems: "center",
+					gap: "2",
+					color: "fg",
+					textDecoration: "none"
+				}),
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("img", {
+					src: "/favicon.svg",
+					alt: "",
+					width: 22,
+					height: 22
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+					className: css({
+						fontWeight: "700",
+						letterSpacing: "-0.01em",
+						fontSize: "14px"
+					}),
+					children: ["wire", /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+						className: css({
+							color: "muted",
+							fontWeight: "500"
+						}),
+						children: "ui"
+					})]
+				})]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: css({ color: "lineStrong" }),
+				children: "/"
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				title: ws.path,
+				className: cx(mono, truncate, css({
+					color: "muted",
+					minW: "0"
+				})),
+				children: basename(ws.path)
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: css({
+					ml: "auto",
+					display: "flex",
+					alignItems: "center",
+					gap: "1.5"
+				}),
+				children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EnvSelect, {}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
+						type: "button",
+						"aria-pressed": prefs.live,
+						onClick: () => set("live", !prefs.live),
+						title: prefs.live ? "Live: re-reading the file every 2 s" : "Follow the file as runs write to it",
+						className: css({
+							display: "inline-flex",
+							alignItems: "center",
+							gap: "1.5",
+							h: "28px",
+							px: "2.5",
+							rounded: "md",
+							border: "1px solid",
+							borderColor: "line",
+							bg: "raised",
+							color: "muted",
+							cursor: "pointer",
+							fontSize: "12px",
+							fontWeight: "500",
+							_hover: { color: "fg" },
+							"&[aria-pressed=true]": {
+								color: "ok",
+								borderColor: "ok",
+								bg: "okSoft"
+							}
+						}),
+						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: cx(css({
+							w: "7px",
+							h: "7px",
+							rounded: "full",
+							bg: "faint"
+						}), prefs.live && css({
+							bg: "ok",
+							animation: "pulse 1.6s ease-in-out infinite"
+						})) }), "Live"]
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconButton, {
+						label: "Refresh",
+						onClick: refresh,
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconRefresh, {})
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconButton, {
+						label: prefs.layout === "side" ? "Stack request above response" : "Request and response side by side",
+						onClick: () => set("layout", prefs.layout === "side" ? "stacked" : "side"),
+						children: prefs.layout === "side" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconSplitSide, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconSplitStacked, {})
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconButton, {
+						label: `Theme: ${prefs.theme}`,
+						onClick: () => set("theme", THEME_NEXT[prefs.theme]),
+						children: prefs.theme === "system" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconMonitor, {}) : prefs.theme === "light" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconSun, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconMoon, {})
+					})
+				]
+			})
+		]
+	});
+}
+function EnvSelect() {
+	const ws = root.useLoaderData();
+	const { prefs, set } = usePrefs();
+	const known = ws.envs.map((e) => e.env ?? "");
+	const value = prefs.env === "*" || known.includes(prefs.env) ? prefs.env : "*";
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("label", {
+		className: css({
+			display: "inline-flex",
+			alignItems: "center",
+			gap: "1.5",
+			h: "28px",
+			pl: "2",
+			pr: "1",
+			rounded: "md",
+			border: "1px solid",
+			borderColor: value === "*" ? "line" : "accent",
+			bg: value === "*" ? "raised" : "accentSoft",
+			color: value === "*" ? "muted" : "accent"
+		}),
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconEnvironments, { size: 14 }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("select", {
+			"aria-label": "Environment",
+			value,
+			onChange: (e) => set("env", e.target.value),
+			className: css({
+				border: "none",
+				bg: "transparent",
+				outline: "none",
+				fontSize: "12px",
+				fontWeight: "500",
+				color: "fg",
+				cursor: "pointer",
+				maxW: "180px"
+			}),
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", {
+				value: "*",
+				children: "All environments"
+			}), ws.envs.map((e) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)("option", {
+				value: e.env ?? "",
+				children: e.env ?? "No environment"
+			}, e.env ?? ""))]
+		})]
+	});
+}
+var railButton = css({
+	display: "flex",
+	flexDir: "column",
+	alignItems: "center",
+	gap: "0.5",
+	w: "56px",
+	py: "1.5",
+	rounded: "md",
+	border: "none",
+	bg: "transparent",
+	color: "muted",
+	cursor: "pointer",
+	fontSize: "10px",
+	fontWeight: "500",
+	textDecoration: "none",
+	_hover: {
+		color: "fg",
+		bg: "hover"
+	},
+	"&[data-active=true]": {
+		color: "fg",
+		bg: "hover"
+	},
+	"&[data-active=true] svg": { color: "accent" }
+});
+/** The pages, in the order the rail lists them. */
+var PAGES = [
+	{
+		to: "/",
+		label: "Overview",
+		icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconOverview, { size: 18 }),
+		exact: true
+	},
+	{
+		to: "/history",
+		label: "History",
+		icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconHistory, { size: 18 }),
+		exact: false
+	},
+	{
+		to: "/environments",
+		label: "Envs",
+		icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconEnvironments, { size: 18 }),
+		exact: false
+	},
+	{
+		to: "/query",
+		label: "SQL",
+		icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconDatabase, { size: 18 }),
+		exact: false
+	}
+];
+function Rail() {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("nav", {
+		"aria-label": "Sections",
+		className: css({
+			display: "flex",
+			flexDir: "column",
+			alignItems: "center",
+			gap: "1",
+			w: "64px",
+			pt: "1",
+			pb: "2",
+			flexShrink: 0
+		}),
+		children: PAGES.map((page) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
+			to: page.to,
+			className: railButton,
+			activeProps: { "data-active": true },
+			activeOptions: {
+				exact: page.exact,
+				includeSearch: false
+			},
+			children: [page.icon, page.label]
+		}, page.to))
+	});
+}
+var MIN_SIDEBAR = 220;
+var MAX_SIDEBAR = 560;
+function Sidebar({ filterRef }) {
+	const { prefs, set } = usePrefs();
+	const [dragging, setDragging] = import_react.useState(false);
+	const [width, setWidth] = import_react.useState(prefs.sidebarWidth);
+	import_react.useEffect(() => setWidth(prefs.sidebarWidth), [prefs.sidebarWidth]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("aside", {
+		className: css({
+			position: "relative",
+			display: "flex",
+			flexDir: "column",
+			flexShrink: 0,
+			minH: "0",
+			pt: "1"
+		}),
+		style: { width },
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: css({
+					display: "flex",
+					alignItems: "center",
+					justifyContent: "space-between",
+					h: "30px",
+					pl: "3",
+					pr: "1.5",
+					flexShrink: 0
+				}),
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+					className: css({
+						fontWeight: "600",
+						fontSize: "12px"
+					}),
+					children: "Sessions"
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconButton, {
+					label: "Collapse sessions",
+					onClick: () => set("sidebarOpen", false),
+					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconChevronLeft, { size: 14 })
+				})]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: css({
+					flex: "1",
+					minH: "0"
+				}),
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SessionsPanel, { filterRef })
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				role: "separator",
+				"aria-orientation": "vertical",
+				"aria-label": "Resize sidebar",
+				onPointerDown: (e) => {
+					e.preventDefault();
+					e.target.setPointerCapture(e.pointerId);
+					setDragging(true);
+				},
+				onPointerMove: (e) => {
+					if (!dragging) return;
+					const aside = e.target.parentElement;
+					if (!aside) return;
+					const left = aside.getBoundingClientRect().left;
+					setWidth(Math.min(MAX_SIDEBAR, Math.max(MIN_SIDEBAR, e.clientX - left)));
+				},
+				onPointerUp: () => {
+					if (!dragging) return;
+					setDragging(false);
+					set("sidebarWidth", width);
+				},
+				className: cx(css({
+					position: "absolute",
+					top: "0",
+					bottom: "0",
+					right: "-3px",
+					w: "6px",
+					cursor: "col-resize",
+					zIndex: "2",
+					_hover: {
+						bg: "accent",
+						opacity: .4
+					}
+				}), dragging && css({
+					bg: "accent",
+					opacity: .4
+				}))
+			})
+		]
+	});
+}
+/** What the sidebar leaves when collapsed: a strip that expands it again. */
+function CollapsedSidebar() {
+	const { set } = usePrefs();
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("button", {
+		type: "button",
+		"aria-label": "Expand sessions",
+		title: "Expand sessions",
+		onClick: () => set("sidebarOpen", true),
+		className: css({
+			display: "flex",
+			flexDir: "column",
+			alignItems: "center",
+			gap: "2",
+			w: "28px",
+			pt: "2",
+			flexShrink: 0,
+			border: "none",
+			bg: "transparent",
+			color: "muted",
+			cursor: "pointer",
+			rounded: "md",
+			_hover: {
+				color: "fg",
+				bg: "hover"
+			}
+		}),
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconChevronRight, { size: 14 }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+			className: css({
+				writingMode: "vertical-rl",
+				fontSize: "12px",
+				fontWeight: "600",
+				letterSpacing: "0.02em"
+			}),
+			children: "Sessions"
+		})]
+	});
+}
+function TabStrip() {
+	const { tabs, activeKey, pin, close } = useTabs();
+	const navigate = useNavigate();
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+		role: "tablist",
+		"aria-label": "Open tabs",
+		className: css({
+			display: "flex",
+			alignItems: "stretch",
+			h: "36px",
+			flexShrink: 0,
+			bg: "chrome",
+			borderBottom: "1px solid",
+			borderColor: "line",
+			overflowX: "auto",
+			scrollbarWidth: "none"
+		}),
+		children: tabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			role: "tab",
+			tabIndex: 0,
+			"aria-selected": tab.key === activeKey,
+			"data-preview": tab.preview,
+			title: tab.preview ? `${tab.title} — preview; double-click to keep open` : tab.title,
+			onClick: () => void navigate({ href: tab.href }),
+			onKeyDown: (e) => {
+				if (e.key === "Enter") navigate({ href: tab.href });
+			},
+			onDoubleClick: () => pin(tab.key),
+			onAuxClick: (e) => {
+				if (e.button === 1) close(tab.key);
+			},
+			className: css({
+				position: "relative",
+				display: "flex",
+				alignItems: "center",
+				gap: "1.5",
+				pl: "3",
+				pr: "1",
+				minW: "0",
+				maxW: "220px",
+				flexShrink: 0,
+				borderRight: "1px solid",
+				borderColor: "line",
+				cursor: "pointer",
+				color: "muted",
+				userSelect: "none",
+				_hover: {
+					color: "fg",
+					bg: "hover"
+				},
+				"&[aria-selected=true]": {
+					bg: "canvas",
+					color: "fg",
+					_before: {
+						content: "\"\"",
+						position: "absolute",
+						left: "0",
+						right: "0",
+						top: "0",
+						h: "2px",
+						bg: "accent"
+					}
+				},
+				"&[data-preview=true] .tab-title": { fontStyle: "italic" },
+				"& .tab-close": { opacity: 0 },
+				"&:hover .tab-close, &[aria-selected=true] .tab-close": { opacity: 1 }
+			}),
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabGlyph, { tab }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+					className: cx("tab-title", truncate, css({ fontSize: "12px" }), tab.failed ? css({ color: "bad" }) : void 0),
+					children: tab.title
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconButton, {
+					label: "Close tab",
+					className: cx("tab-close", css({
+						w: "20px",
+						h: "20px"
+					})),
+					onClick: (e) => {
+						e.stopPropagation();
+						close(tab.key);
+					},
+					children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconClose, { size: 12 })
+				})
+			]
+		}, tab.key))
+	});
+}
+function TabGlyph({ tab }) {
+	if (tab.icon === "request" && tab.method) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MethodBadge, {
+		method: tab.method,
+		kind: tab.kind
+	});
+	const glyph = {
+		overview: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconOverview, { size: 13 }),
+		history: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconHistory, { size: 13 }),
+		environments: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconEnvironments, { size: 13 }),
+		session: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconSessions, { size: 13 }),
+		run: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconRun, { size: 12 }),
+		request: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconRequest, { size: 13 }),
+		query: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconDatabase, { size: 13 })
+	}[tab.icon];
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+		className: css({
+			display: "inline-flex",
+			color: "faint",
+			flexShrink: 0
+		}),
+		children: glyph
+	});
+}
+function StatusBar() {
+	const ws = root.useLoaderData();
+	const { prefs, lastRefresh } = usePrefs();
+	const now = useNow(ws.now, 1e3);
+	const c = ws.counts;
+	const item = css({
+		display: "inline-flex",
+		alignItems: "center",
+		gap: "1",
+		whiteSpace: "nowrap"
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("footer", {
+		className: css({
+			display: "flex",
+			alignItems: "center",
+			gap: "4",
+			h: "24px",
+			px: "3",
+			flexShrink: 0,
+			fontSize: "11px",
+			color: "muted",
+			borderTop: "1px solid",
+			borderColor: "line",
+			overflow: "hidden"
+		}),
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+				className: cx(item, mono, truncate, css({
+					minW: "0",
+					flexShrink: 1
+				})),
+				title: ws.path,
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(IconDatabase, { size: 12 }), ws.path]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: item,
+				children: formatBytes(ws.bytes)
+			}),
+			c ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+				className: item,
+				children: [
+					formatCount(c.runs),
+					" runs · ",
+					formatCount(c.requests + c.connections),
+					" requests"
+				]
+			}) : null,
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+				className: item,
+				children: ["schema v", ws.schema.file]
+			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+				className: cx(item, css({ ml: "auto" })),
+				children: [prefs.live ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+					className: css({ color: "ok" }),
+					children: "● Live"
+				}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { children: "Read-only" }), lastRefresh ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+					className: css({ color: "faint" }),
+					children: ["· read ", formatAgo(now, lastRefresh)]
+				}) : null]
+			})
+		]
+	});
+}
+var globals_default = "/assets/globals-D_ltS-iC.css";
+var Route$7 = createRootRoute({
+	head: () => ({
+		meta: [
+			{ charSet: "utf-8" },
+			{
+				name: "viewport",
+				content: "width=device-width, initial-scale=1"
+			},
+			{
+				name: "color-scheme",
+				content: "light dark"
+			},
+			{ title: "wireui" }
+		],
+		links: [{
+			rel: "stylesheet",
+			href: globals_default
+		}, {
+			rel: "icon",
+			href: "/favicon.svg",
+			type: "image/svg+xml"
+		}]
+	}),
+	loader: () => getWorkspace(),
+	staleTime: 0,
+	errorComponent: RouteError,
+	notFoundComponent: NotFound,
+	component: RootLayout,
+	shellComponent: RootDocument
+});
+function RootLayout() {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Frame, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Outlet, {}) });
+}
+function Frame({ children }) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PrefsProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TabsProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Shell, { children }) }) });
+}
+function RootDocument({ children }) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("html", {
+		lang: "en",
+		suppressHydrationWarning: true,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("head", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("script", { dangerouslySetInnerHTML: { __html: THEME_BOOT_SCRIPT } }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HeadContent, {})] }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("body", { children: [children, /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Scripts, {})] })]
+	});
+}
+var $$splitComponentImporter$6 = () => import("./routes-CrmwJhiA.mjs");
+var Route$6 = createFileRoute("/")({
+	loader: () => getOverview({ data: {} }),
+	component: lazyRouteComponent($$splitComponentImporter$6, "component")
+});
+var $$splitComponentImporter$5 = () => import("./environments-BFBtf7iL.mjs");
+var Route$5 = createFileRoute("/environments")({ component: lazyRouteComponent($$splitComponentImporter$5, "component") });
+var $$splitComponentImporter$4 = () => import("./history-57VNXvbE.mjs");
+var Route$4 = createFileRoute("/history")({
+	validateSearch: (search) => ({
+		q: typeof search.q === "string" && search.q ? search.q : void 0,
+		kind: search.kind === "http" || search.kind === "stream" ? search.kind : void 0,
+		failed: search.failed === true ? true : void 0,
+		bodies: search.bodies === true ? true : void 0
+	}),
+	loaderDeps: ({ search }) => search,
+	loader: ({ deps }) => getHistory({ data: {
+		...deps,
+		limit: 500
+	} }),
+	staleTime: 0,
+	component: lazyRouteComponent($$splitComponentImporter$4, "component")
+});
+var $$splitComponentImporter$3 = () => import("./query-D6nNoSN3.mjs");
+var Route$3 = createFileRoute("/query")({
+	validateSearch: (search) => ({ sql: typeof search.sql === "string" ? search.sql : void 0 }),
+	loader: () => getSchema(),
+	component: lazyRouteComponent($$splitComponentImporter$3, "component")
+});
+var $$splitComponentImporter$2 = () => import("./sessions-wsD0b1zm.mjs");
+var Route$2 = createFileRoute("/sessions")({
+	validateSearch: (search) => ({
+		entry: typeof search.entry === "string" ? search.entry : "",
+		tab: search.tab === "requests" || search.tab === "checks" ? search.tab : void 0
+	}),
+	loaderDeps: ({ search }) => ({ entry: search.entry }),
+	loader: async ({ deps }) => {
+		if (!deps.entry) throw notFound();
+		const page = await getScript({ data: { entry: deps.entry } });
+		if (!page) throw notFound();
+		return page;
+	},
+	component: lazyRouteComponent($$splitComponentImporter$2, "component")
+});
+/** Most recent {@link STRIP_RUNS} runs as bars, oldest on the left. */
+var $$splitComponentImporter$1 = () => import("./requests._requestId-bXoTBGVj.mjs");
+var REQ_TABS = [
+	"params",
+	"headers",
+	"body",
+	"cookies",
+	"tags"
+];
+var RES_TABS = [
+	"body",
+	"messages",
+	"headers",
+	"cookies",
+	"timeline"
+];
+var Route$1 = createFileRoute("/requests/$requestId")({
+	validateSearch: (search) => ({
+		req: REQ_TABS.includes(search.req) ? search.req : void 0,
+		res: RES_TABS.includes(search.res) ? search.res : void 0
+	}),
+	loader: async ({ params }) => {
+		const page = await getRequest({ data: { requestId: params.requestId } });
+		if (!page) throw notFound();
+		return page;
+	},
+	component: lazyRouteComponent($$splitComponentImporter$1, "component")
+});
+var $$splitComponentImporter = () => import("./runs._runId-DM5Y8e6b.mjs");
+var RUN_TABS = [
+	"requests",
+	"checks",
+	"details"
+];
+var Route = createFileRoute("/runs/$runId")({
+	validateSearch: (search) => ({ tab: search.tab === "insights" ? "requests" : RUN_TABS.includes(search.tab) ? search.tab : void 0 }),
+	loader: async ({ params }) => {
+		const page = await getRun({ data: { runId: params.runId } });
+		if (!page) throw notFound();
+		return page;
+	},
+	component: lazyRouteComponent($$splitComponentImporter, "component")
+});
+var rootRouteChildren = {
+	IndexRoute: Route$6.update({
+		id: "/",
+		path: "/",
+		getParentRoute: () => Route$7
+	}),
+	EnvironmentsRoute: Route$5.update({
+		id: "/environments",
+		path: "/environments",
+		getParentRoute: () => Route$7
+	}),
+	HistoryRoute: Route$4.update({
+		id: "/history",
+		path: "/history",
+		getParentRoute: () => Route$7
+	}),
+	QueryRoute: Route$3.update({
+		id: "/query",
+		path: "/query",
+		getParentRoute: () => Route$7
+	}),
+	SessionsRoute: Route$2.update({
+		id: "/sessions",
+		path: "/sessions",
+		getParentRoute: () => Route$7
+	}),
+	RequestsRequestIdRoute: Route$1.update({
+		id: "/requests/$requestId",
+		path: "/requests/$requestId",
+		getParentRoute: () => Route$7
+	}),
+	RunsRunIdRoute: Route.update({
+		id: "/runs/$runId",
+		path: "/runs/$runId",
+		getParentRoute: () => Route$7
+	})
+};
+var routeTree = Route$7._addFileChildren(rootRouteChildren)._addFileTypes();
+var router_exports = /* @__PURE__ */ __exportAll({ getRouter: () => getRouter });
+function getRouter() {
+	return createRouter({
+		routeTree,
+		defaultPreload: "intent",
+		defaultPreloadStaleTime: 0,
+		scrollRestoration: true,
+		defaultNotFoundComponent: NotFound,
+		defaultErrorComponent: RouteError
+	});
+}
+//#endregion
+export { Route, Route$1, Route$2, Route$3, Route$4, Route$6, getHistory, getOverview, getScript, router_exports, runSql, useSession };