little-actors-observer 0.1.0

package/dist/index.js

@@ -0,0 +1,1318 @@
+import { useEffect as e, useId as t, useMemo as n, useRef as r, useState as i } from "react";
+import { Box as a, CircleHelp as o, Pause as s, Play as c, RefreshCw as l, Search as u, Unplug as d, X as f } from "lucide-react";
+import { cva as p } from "class-variance-authority";
+import { clsx as m } from "clsx";
+import { extendTailwindMerge as h } from "tailwind-merge";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Slot as y } from "@radix-ui/react-slot";
+import * as b from "@radix-ui/react-dialog";
+import { createParser as x } from "eventsource-parser";
+//#region src/lib/utils.ts
+var S = h({ prefix: "la" });
+function C(...e) {
+	return S(m(e));
+}
+//#endregion
+//#region src/components/ui/badge.tsx
+var w = p("la:inline-flex la:items-center la:justify-center la:gap-1.5 la:rounded-md la:border la:px-2 la:py-0.5 la:text-xs la:font-medium la:whitespace-nowrap", {
+	variants: { variant: {
+		default: "la:border-transparent la:bg-muted la:text-muted-foreground",
+		outline: "la:border-border la:text-muted-foreground"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function T({ className: e, variant: t, ...n }) {
+	return /* @__PURE__ */ _("span", {
+		"data-slot": "badge",
+		className: C(w({ variant: t }), e),
+		...n
+	});
+}
+//#endregion
+//#region src/components/ui/button.tsx
+var E = p("la:inline-flex la:shrink-0 la:items-center la:justify-center la:gap-2 la:whitespace-nowrap la:rounded-md la:text-sm la:font-medium la:outline-none la:transition-[background-color,border-color,color,box-shadow,transform] la:duration-150 la:ease-out la:active:translate-y-px la:disabled:pointer-events-none la:disabled:translate-y-0 la:disabled:opacity-45 la:focus-visible:ring-2 la:focus-visible:ring-ring la:focus-visible:ring-offset-2 la:focus-visible:ring-offset-background la:aria-invalid:border-destructive la:aria-invalid:ring-destructive/25 la:[&_svg]:pointer-events-none la:[&_svg]:shrink-0 la:[&_svg:not([class*='size-'])]:size-4", {
+	variants: {
+		variant: {
+			default: "la:bg-primary la:text-primary-foreground la:shadow-[var(--shadow-control)] la:hover:bg-primary/88",
+			destructive: "la:bg-destructive la:text-white la:hover:bg-destructive/90 la:focus-visible:ring-destructive/20 la:dark:focus-visible:ring-destructive/40 la:dark:bg-destructive/60",
+			outline: "la:border la:border-input la:bg-card la:hover:border-foreground/20 la:hover:bg-accent la:hover:text-accent-foreground la:dark:bg-card",
+			secondary: "la:bg-secondary la:text-secondary-foreground la:hover:bg-secondary/80",
+			ghost: "la:bg-transparent la:hover:bg-accent la:hover:text-accent-foreground la:dark:hover:bg-accent/50",
+			link: "la:bg-transparent la:text-primary la:underline-offset-4 la:hover:underline"
+		},
+		size: {
+			default: "la:h-9 la:px-4 la:py-2 la:max-md:min-h-11 la:has-[>svg]:px-3",
+			sm: "la:h-8 la:gap-1.5 la:px-3 la:max-md:min-h-11 la:has-[>svg]:px-2.5",
+			lg: "la:h-10 la:px-5 la:max-md:min-h-11 la:has-[>svg]:px-4",
+			icon: "la:size-9 la:max-md:size-11",
+			"icon-sm": "la:size-8 la:max-md:size-11",
+			"icon-lg": "la:size-10 la:max-md:size-11"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function D({ className: e, variant: t, size: n, asChild: r = !1, ...i }) {
+	return /* @__PURE__ */ _(r ? y : "button", {
+		"data-slot": "button",
+		className: C(E({
+			variant: t,
+			size: n,
+			className: e
+		})),
+		...i
+	});
+}
+//#endregion
+//#region src/components/ui/input.tsx
+function O({ className: e, type: t, ...n }) {
+	return /* @__PURE__ */ _("input", {
+		type: t,
+		"data-slot": "input",
+		className: C("la:flex la:h-9 la:w-full la:min-w-0 la:rounded-md la:border la:border-input la:bg-card la:px-3 la:py-1 la:text-sm la:text-foreground la:outline-none la:transition-colors la:placeholder:text-muted-foreground la:focus-visible:border-ring la:focus-visible:ring-2 la:focus-visible:ring-ring/20 la:disabled:cursor-not-allowed la:disabled:opacity-50 la:max-md:min-h-11", e),
+		...n
+	});
+}
+//#endregion
+//#region src/components/ui/sheet.tsx
+var ee = b.Root, te = b.Title, k = b.Description;
+function ne({ className: e, children: t, container: n, ...r }) {
+	return /* @__PURE__ */ v(b.Portal, {
+		container: n,
+		children: [/* @__PURE__ */ _(b.Overlay, { className: "la-sheet-overlay" }), /* @__PURE__ */ v(b.Content, {
+			"data-slot": "sheet-content",
+			className: C("la-observer la-sheet", e),
+			...r,
+			children: [t, /* @__PURE__ */ _(b.Close, {
+				asChild: !0,
+				children: /* @__PURE__ */ _(D, {
+					className: "la-sheet-close",
+					variant: "ghost",
+					size: "icon",
+					"aria-label": "Close",
+					children: /* @__PURE__ */ _(f, { "aria-hidden": "true" })
+				})
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/components/ui/table.tsx
+function A({ className: e, ...t }) {
+	return /* @__PURE__ */ _("div", {
+		"data-slot": "table-container",
+		className: "la:relative la:w-full la:overflow-x-auto",
+		children: /* @__PURE__ */ _("table", {
+			"data-slot": "table",
+			className: C("la:w-full la:caption-bottom la:text-sm la:tabular-nums", e),
+			...t
+		})
+	});
+}
+function j({ className: e, ...t }) {
+	return /* @__PURE__ */ _("thead", {
+		"data-slot": "table-header",
+		className: C("la:[&_tr]:border-b", e),
+		...t
+	});
+}
+function M({ className: e, ...t }) {
+	return /* @__PURE__ */ _("tbody", {
+		"data-slot": "table-body",
+		className: C("la:[&_tr:last-child]:border-0", e),
+		...t
+	});
+}
+function N({ className: e, ...t }) {
+	return /* @__PURE__ */ _("tr", {
+		"data-slot": "table-row",
+		className: C("la:border-b la:transition-colors la:duration-150 la:hover:bg-muted/60 la:data-[state=selected]:bg-muted", e),
+		...t
+	});
+}
+function P({ className: e, ...t }) {
+	return /* @__PURE__ */ _("th", {
+		"data-slot": "table-head",
+		className: C("la:h-10 la:whitespace-nowrap la:px-3 la:text-left la:align-middle la:text-xs la:font-medium la:text-muted-foreground la:[&:has([role=checkbox])]:pr-0 la:[&>[role=checkbox]]:translate-y-[2px]", e),
+		...t
+	});
+}
+function F({ className: e, ...t }) {
+	return /* @__PURE__ */ _("td", {
+		"data-slot": "table-cell",
+		className: C("la:whitespace-nowrap la:px-3 la:py-2.5 la:align-middle la:[&:has([role=checkbox])]:pr-0 la:[&>[role=checkbox]]:translate-y-[2px]", e),
+		...t
+	});
+}
+//#endregion
+//#region src/observer-hooks.ts
+function I(t) {
+	let [n, r] = i(0), [a, o] = i(), [s, c] = i(!0), [l, u] = i(!1);
+	return e(() => {
+		let e = new AbortController(), n, r = 1e3;
+		return u(!1), c(!0), a(), () => {
+			e.abort(), clearTimeout(n);
+		};
+		function i(n) {
+			e.signal.aborted || (o({
+				client: t,
+				inventory: n,
+				updatedAt: Date.now()
+			}), u(!1), c(!1), r = 1e3);
+		}
+		async function a() {
+			try {
+				if (t.watchActors) {
+					if (await t.watchActors(i, e.signal), !e.signal.aborted) throw Error("Stream ended");
+				} else c(!0), i(await t.listActors(e.signal));
+			} catch {
+				e.signal.aborted || u(!0);
+			} finally {
+				e.signal.aborted || (c(!1), n = setTimeout(a, t.watchActors ? r : 5e3), r = Math.min(r * 2, 1e4));
+			}
+		}
+	}, [t, n]), {
+		updatedAt: a?.client === t ? a.updatedAt : void 0,
+		inventory: a?.client === t ? a.inventory : void 0,
+		loading: s,
+		failed: l,
+		retry: () => r((e) => e + 1)
+	};
+}
+function re(t, n = !0) {
+	let [r, a] = i(), [o, s] = i(!1), [c, l] = i(0);
+	return e(() => a(void 0), [t]), e(() => {
+		if (!n) return;
+		let e, r = new AbortController(), i, o = 1e3;
+		async function c() {
+			try {
+				if (!t.watchRequests) throw Error("Request traces unavailable");
+				if (await t.watchRequests((t) => {
+					r.signal.aborted || (e = t.resumeCursor, a((e) => ie(e, t)), s(!1), o = 1e3);
+				}, r.signal, e), !r.signal.aborted) throw Error("Request stream disconnected");
+			} catch {
+				r.signal.aborted || s(!0);
+			} finally {
+				r.signal.aborted || (i = setTimeout(c, o), o = Math.min(o * 2, 1e4));
+			}
+		}
+		return s(!1), c(), () => {
+			r.abort(), clearTimeout(i);
+		};
+	}, [
+		t,
+		c,
+		n
+	]), {
+		page: r,
+		failed: o,
+		retry: () => l((e) => e + 1)
+	};
+}
+function ie(e, t) {
+	let n = new Map((e?.epoch === t.epoch && !t.reset ? e.records : []).map((e) => [e.eventId ?? e.sequence, e]));
+	for (let e of t.records) n.set(e.eventId ?? e.sequence, e);
+	return {
+		...t,
+		reset: t.reset || e?.epoch === t.epoch && e.reset,
+		records: [...n.values()].sort((e, t) => t.sequence - e.sequence).slice(0, t.capacity)
+	};
+}
+//#endregion
+//#region src/client.ts
+var L = class {
+	baseUrl;
+	request;
+	constructor(e = "/api/observe", t = globalThis.fetch.bind(globalThis)) {
+		this.baseUrl = e, this.request = t;
+	}
+	async listActors(e) {
+		let t = await this.get("actors", e);
+		if (!R(t)) throw Error("Invalid actor inventory response.");
+		return t;
+	}
+	async watchActors(e, t) {
+		return this.watch("events", "inventory", R, e, t);
+	}
+	async watchRequests(e, t, n) {
+		let r = n ? `?${new URLSearchParams({ after: n })}` : "";
+		return this.watch(`requests/events${r}`, "requests", z, e, t);
+	}
+	async query(e, t) {
+		let n = await this.request(`${this.baseUrl.replace(/\/$/u, "")}/query`, {
+			method: "POST",
+			credentials: "same-origin",
+			redirect: "error",
+			signal: t,
+			headers: {
+				"content-type": "application/json",
+				accept: "application/json"
+			},
+			body: JSON.stringify(e)
+		});
+		if (!n.ok) throw Error(`Observability query failed (HTTP ${n.status}).`);
+		let r = await n.json();
+		if (!r || typeof r != "object" || !("rows" in r) || !Array.isArray(r.rows) || r.rows.length > 500 || !("truncated" in r) || typeof r.truncated != "boolean" || !r.rows.every((e) => e && typeof e == "object" && !Array.isArray(e) && Object.values(e).every((e) => e === null || [
+			"string",
+			"boolean",
+			"number"
+		].includes(typeof e)))) throw Error("Invalid SQL query response");
+		return r;
+	}
+	async watch(e, t, n, r, i) {
+		let a = await this.request(`${this.baseUrl.replace(/\/$/u, "")}/${e}`, {
+			signal: i,
+			credentials: "same-origin",
+			redirect: "error",
+			headers: { accept: "text/event-stream" }
+		});
+		if (!a.ok || !a.headers.get("content-type")?.startsWith("text/event-stream") || !a.body) throw await a.body?.cancel(), Error("Live inventory is unavailable");
+		let o = a.body.getReader(), s = new TextDecoder(), c = x({ onEvent(e) {
+			if (i.aborted) return;
+			if (e.event === "error") throw Error("Live inventory is unavailable");
+			if (e.event !== t) return;
+			let a = JSON.parse(e.data);
+			if (!n(a)) throw Error("Invalid observer response");
+			r(a);
+		} }), l = () => {
+			o.cancel().catch(() => {});
+		};
+		i.addEventListener("abort", l, { once: !0 });
+		try {
+			for (; !i.aborted;) {
+				let { value: e, done: t } = await o.read();
+				if (t) break;
+				c.feed(s.decode(e, { stream: !0 }));
+			}
+			if (!i.aborted) throw Error("Live inventory disconnected");
+		} finally {
+			i.removeEventListener("abort", l), await o.cancel().catch(() => {}), o.releaseLock();
+		}
+	}
+	async checkConnection(e) {
+		let t = await this.get("connection", e);
+		if (!t || typeof t != "object" || !("connected" in t) || t.connected !== !0) throw Error("Invalid connection response.");
+	}
+	async get(e, t) {
+		let n = await this.request(`${this.baseUrl.replace(/\/$/u, "")}/${e}`, {
+			method: "GET",
+			credentials: "same-origin",
+			redirect: "error",
+			signal: t,
+			headers: { accept: "application/json" }
+		});
+		if (!n.ok) throw Error(`Connection check failed (HTTP ${n.status}).`);
+		return n.json();
+	}
+};
+function R(e) {
+	return !e || typeof e != "object" || !("actors" in e) || !Array.isArray(e.actors) ? !1 : e.actors.every((e) => e && typeof e.actorType == "string" && [
+		e.live,
+		e.dormant,
+		e.unknown
+	].every((e) => Number.isSafeInteger(e) && e >= 0) && Array.isArray(e.instances) && e.instances.every(ae));
+}
+function ae(e) {
+	return !!e && typeof e == "object" && "actorId" in e && typeof e.actorId == "string" && "status" in e && [
+		"live",
+		"dormant",
+		"unknown"
+	].includes(String(e.status)) && "connections" in e && Array.isArray(e.connections) && e.connections.every(oe) && (!("waiting" in e) || e.waiting == null || Array.isArray(e.waiting) && e.waiting.every((e) => !!e && typeof e == "object" && typeof e.id == "string" && typeof e.operation == "string"));
+}
+function oe(e) {
+	return !!e && typeof e == "object" && "id" in e && typeof e.id == "string" && "metadata" in e;
+}
+function z(e) {
+	if (!e || typeof e != "object") return !1;
+	let t = e;
+	return typeof t.epoch == "string" && [
+		t.cursor,
+		t.capacity,
+		t.evicted,
+		t.dropped
+	].every(B) && (t.persistenceFailed === void 0 || typeof t.persistenceFailed == "boolean") && (t.nextCursor == null || typeof t.nextCursor == "string") && (t.resumeCursor === void 0 || typeof t.resumeCursor == "string") && (t.reset === void 0 || typeof t.reset == "boolean") && t.capacity > 0 && t.capacity <= 500 && Array.isArray(t.records) && t.records.length <= t.capacity && t.records.every((e) => V(e) && e.sequence <= t.cursor);
+}
+function B(e) {
+	return Number.isSafeInteger(e) && Number(e) >= 0;
+}
+function V(e) {
+	if (!e || typeof e != "object") return !1;
+	let t = e;
+	return [
+		t.requestId,
+		t.hostId,
+		t.sessionId,
+		t.actorType,
+		t.actorId,
+		t.operation
+	].every((e) => typeof e == "string") && (t.eventId === void 0 || typeof t.eventId == "string" && t.eventId.length > 0) && B(t.sequence) && B(t.startedAtMs) && t.startedAtMs <= 864e13 && ["method", "websocket"].includes(t.kind) && [
+		"completed",
+		"failed",
+		"rejected",
+		"rerouted",
+		"interrupted"
+	].includes(t.outcome) && (t.connectionId === null || typeof t.connectionId == "string") && Number.isFinite(t.durationMs) && t.durationMs >= 0 && (t.queueWaitMs === null || Number.isFinite(t.queueWaitMs) && t.queueWaitMs >= 0 && t.queueWaitMs <= t.durationMs);
+}
+//#endregion
+//#region src/request-sql.ts
+var H = 100;
+function U(e, t) {
+	let n = [], r = [];
+	for (let [t, i, a] of [
+		[
+			"started_at_ms",
+			">=",
+			e.fromMs
+		],
+		[
+			"started_at_ms",
+			"<=",
+			e.toMs
+		],
+		[
+			"actor_type",
+			"=",
+			e.actorType
+		],
+		[
+			"actor_id",
+			"=",
+			e.actorId
+		],
+		[
+			"outcome",
+			"=",
+			e.outcome
+		]
+	]) a !== void 0 && (n.push(`${t} ${i} ?`), r.push(a));
+	if (t) {
+		let e = JSON.parse(t);
+		n.push("sequence <= ?", "(started_at_ms, sequence) < (?, ?)"), r.push(e.watermark, e.time, e.sequence);
+	}
+	return {
+		sql: `SELECT h.generation, h.watermark, h.pruned, h.total, r.sequence, r.event
+FROM request_history h LEFT JOIN (
+    SELECT sequence, event, started_at_ms FROM request_events
+    ${n.length ? `WHERE ${n.join(" AND ")}` : ""}
+    ORDER BY started_at_ms DESC, sequence DESC LIMIT 101
+) r ON 1 = 1
+ORDER BY r.started_at_ms DESC, r.sequence DESC`,
+		params: r
+	};
+}
+function W(e, t) {
+	if (e.truncated) throw Error("History query exceeded the server result limit");
+	let n = e.rows[0];
+	if (!n || typeof n.generation != "string" || ![
+		n.watermark,
+		n.pruned,
+		n.total
+	].every((e) => Number.isSafeInteger(e) && Number(e) >= 0)) throw Error("Invalid history metadata");
+	let r = t ? JSON.parse(t) : void 0, i = e.rows.filter((e) => e.sequence !== null).map((e) => {
+		if (typeof e.event != "string") throw Error("Invalid saved event");
+		let t = {
+			...JSON.parse(e.event),
+			sequence: e.sequence
+		};
+		if (!V(t)) throw Error("Invalid saved event");
+		return t;
+	}), a = i.length > H;
+	i.length = Math.min(i.length, H);
+	let o = i.at(-1), s = r?.watermark ?? Number(n.watermark);
+	return {
+		epoch: n.generation,
+		cursor: Number(n.watermark),
+		capacity: H,
+		dropped: 0,
+		evicted: 0,
+		records: i,
+		reset: !!r && (r.generation !== n.generation || r.pruned < Number(n.pruned)),
+		nextCursor: a && o ? JSON.stringify({
+			watermark: s,
+			sequence: o.sequence,
+			time: o.startedAtMs,
+			generation: n.generation,
+			pruned: Number(n.pruned)
+		}) : null
+	};
+}
+//#endregion
+//#region src/request-history.ts
+function G(t, n) {
+	let [a, o] = i(), [s, c] = i(!1), [l, u] = i(!1), d = r(() => {});
+	return e(() => {
+		if (o(void 0), u(!1), c(!1), !n) return;
+		let e = new AbortController(), r = !1;
+		d.current = (t) => {
+			r || e.signal.aborted || (r = !0, c(!0), u(!1), i(t));
+		};
+		async function i(i) {
+			try {
+				if (!t.query) throw Error("History is unavailable");
+				let r = W(await t.query(U(n, i), e.signal), i);
+				if (e.signal.aborted) return;
+				o((e) => {
+					if (!i || !e || e.epoch !== r.epoch) return r;
+					let t = new Map(e.records.map((e) => [e.eventId ?? e.sequence, e]));
+					for (let e of r.records) t.set(e.eventId ?? e.sequence, e);
+					return {
+						...r,
+						reset: e.reset || r.reset,
+						records: [...t.values()]
+					};
+				});
+			} catch {
+				e.signal.aborted || u(!0);
+			} finally {
+				r = !1, e.signal.aborted || c(!1);
+			}
+		}
+		return d.current(), () => e.abort();
+	}, [t, n]), {
+		page: a,
+		loading: s,
+		failed: l,
+		loadOlder: () => d.current(a?.nextCursor ?? void 0),
+		retry: () => d.current(a?.nextCursor ?? void 0)
+	};
+}
+//#endregion
+//#region src/RequestObserver.tsx
+function K({ client: t, actor: a }) {
+	let [o, u] = i(), d = G(t, n(() => o ? {
+		...o,
+		...a
+	} : void 0, [
+		o,
+		a?.actorType,
+		a?.actorId
+	])), { page: f, failed: p, retry: m } = re(t), [h, y] = i(), [b, x] = i(), S = r(null), C = r(null), w = a ? "h3" : "h1", E = o ? d.page : h ?? f, O = f ?? d.page, I = (E?.records ?? []).filter((e) => !a || e.actorType === a.actorType && e.actorId === a.actorId);
+	return e(() => {
+		y(void 0), u(void 0);
+	}, [
+		t,
+		a?.actorType,
+		a?.actorId
+	]), e(() => x(void 0), [
+		t,
+		f?.epoch,
+		o,
+		a?.actorType,
+		a?.actorId
+	]), /* @__PURE__ */ v("section", {
+		ref: S,
+		className: "la-observer la-requests",
+		"aria-label": "Request observer",
+		children: [
+			/* @__PURE__ */ v("div", {
+				className: "la-observer-toolbar",
+				children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _(w, { children: "Requests" }), /* @__PURE__ */ _("p", { children: a ? "Method calls and WebSocket events for this instance." : "Method calls and WebSocket events, with time spent waiting and processing." })] }), /* @__PURE__ */ v("div", {
+					className: "la-request-actions",
+					children: [t.query && /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(D, {
+						variant: o ? "outline" : "secondary",
+						"aria-pressed": !o,
+						onClick: () => {
+							u(void 0), y(void 0);
+						},
+						children: "Live"
+					}), /* @__PURE__ */ _(D, {
+						variant: o ? "secondary" : "outline",
+						"aria-pressed": !!o,
+						onClick: () => {
+							o || u({});
+						},
+						children: "History"
+					})] }), !o && /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ v(D, {
+						variant: "outline",
+						disabled: !E,
+						onClick: () => y(h ? void 0 : f),
+						children: [_(h ? c : s, { "aria-hidden": "true" }), h ? "Resume" : "Pause"]
+					}), p && /* @__PURE__ */ v(D, {
+						variant: "outline",
+						onClick: m,
+						children: [/* @__PURE__ */ _(l, { "aria-hidden": "true" }), "Retry"]
+					})] })]
+				})]
+			}),
+			o && /* @__PURE__ */ _(se, {
+				query: o,
+				loading: d.loading,
+				onSearch: u,
+				scoped: !!a
+			}),
+			o && d.failed && /* @__PURE__ */ v("div", {
+				className: "la-observer-error",
+				role: "alert",
+				children: [
+					"Request history unavailable.",
+					" ",
+					/* @__PURE__ */ _(D, {
+						variant: "outline",
+						onClick: d.retry,
+						children: "Retry history"
+					})
+				]
+			}),
+			!o && p && /* @__PURE__ */ v("div", {
+				className: "la-observer-error",
+				role: "alert",
+				children: ["Request stream disconnected. Reconnecting… ", f ? "Showing the last received requests." : "Check your connection and runtime version."]
+			}),
+			!!O?.dropped && /* @__PURE__ */ v("div", {
+				className: "la-observer-error",
+				role: "alert",
+				children: [O.dropped.toLocaleString(), " request traces were not delivered. This history is incomplete."]
+			}),
+			O?.persistenceFailed && /* @__PURE__ */ _("div", {
+				className: "la-observer-error",
+				role: "alert",
+				children: "Some request events could not be saved. This history may be incomplete."
+			}),
+			E?.reset && /* @__PURE__ */ _("div", {
+				className: "la-observer-error",
+				role: "alert",
+				children: "Some older events are no longer retained. Showing available history."
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "la-observer-table-frame",
+				children: [/* @__PURE__ */ v(A, {
+					"aria-label": o ? "Saved requests" : "Recent requests",
+					className: "la-request-table",
+					children: [/* @__PURE__ */ _(j, { children: /* @__PURE__ */ v(N, { children: [
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Time"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Request"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Instance"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Transport"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Outcome"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Total"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Queue wait"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: /* @__PURE__ */ _("span", {
+								className: "la:sr-only",
+								children: "Details"
+							})
+						})
+					] }) }), /* @__PURE__ */ _(M, { children: I.map((e) => /* @__PURE__ */ v(N, {
+						className: "la-clickable-row",
+						"data-state": b === e ? "selected" : void 0,
+						onClick: (t) => {
+							C.current = t.currentTarget.querySelector("button"), x(e);
+						},
+						children: [
+							/* @__PURE__ */ _(F, { children: /* @__PURE__ */ _("time", {
+								dateTime: new Date(e.startedAtMs).toISOString(),
+								title: new Date(e.startedAtMs).toLocaleString(),
+								children: o ? new Date(e.startedAtMs).toLocaleString([], { hour12: !1 }) : new Date(e.startedAtMs).toLocaleTimeString([], { hour12: !1 })
+							}) }),
+							/* @__PURE__ */ _(F, { children: /* @__PURE__ */ _("span", {
+								className: "la-request-operation",
+								title: e.operation,
+								children: e.operation
+							}) }),
+							/* @__PURE__ */ _(F, { children: /* @__PURE__ */ v("span", {
+								className: "la-request-actor",
+								title: `${e.actorType} / ${e.actorId}`,
+								children: [
+									e.actorType,
+									" / ",
+									e.actorId
+								]
+							}) }),
+							/* @__PURE__ */ _(F, { children: e.kind === "method" ? "Method" : "WebSocket" }),
+							/* @__PURE__ */ _(F, { children: /* @__PURE__ */ _(T, {
+								variant: "outline",
+								className: `la-request-outcome-${e.outcome}`,
+								children: e.outcome[0].toUpperCase() + e.outcome.slice(1)
+							}) }),
+							/* @__PURE__ */ _(F, { children: q(e.durationMs) }),
+							/* @__PURE__ */ _(F, { children: e.queueWaitMs === null ? /* @__PURE__ */ _("span", {
+								title: "Request did not begin processing",
+								children: "—"
+							}) : q(e.queueWaitMs) }),
+							/* @__PURE__ */ _(F, { children: /* @__PURE__ */ _(D, {
+								variant: "ghost",
+								size: "sm",
+								"aria-label": `Inspect ${e.operation} request`,
+								"aria-haspopup": "dialog",
+								children: "Details"
+							}) })
+						]
+					}, e.eventId ?? `${E.epoch}-${e.sequence}`)) })]
+				}), !I.length && /* @__PURE__ */ v("div", {
+					className: "la-request-empty",
+					role: "status",
+					children: [/* @__PURE__ */ _("strong", { children: o ? d.loading ? "Loading history…" : d.failed ? "History unavailable" : "No saved requests in this range" : E ? "No requests yet" : p ? "Requests unavailable" : "Connecting to requests…" }), /* @__PURE__ */ _("p", { children: o ? "Try a wider time range or fewer filters. Local history retains the latest 10,000 events." : "Call an actor method or send a WebSocket message to see its timings." })]
+				})]
+			}),
+			o && E?.nextCursor && /* @__PURE__ */ _(D, {
+				className: "la-request-load-older",
+				variant: "outline",
+				disabled: d.loading,
+				onClick: d.loadOlder,
+				children: d.loading ? "Loading…" : "Load older"
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "la-observer-footnote",
+				children: [/* @__PURE__ */ v("span", {
+					className: "la-observer-refresh-status",
+					children: [!o && /* @__PURE__ */ _("span", { className: `la-observer-dot ${p ? "la-observer-dot-unknown" : "la-observer-dot-live"}` }), o ? "Saved history" : h ? "Display paused · collection continues" : p ? "Reconnecting…" : f ? "Live updates" : "Connecting…"]
+				}), /* @__PURE__ */ _("span", { children: o ? `${I.length.toLocaleString()} saved requests shown` : a ? `${I.length} matching requests from the latest ${E?.capacity ?? 500} on this control plane.` : `Latest ${E?.capacity ?? 500} requests on this control plane.` })]
+			}),
+			!o && !!E?.evicted && /* @__PURE__ */ v("p", {
+				className: "la-request-note",
+				children: [E.evicted.toLocaleString(), " older records have left this history window."]
+			}),
+			/* @__PURE__ */ _("p", {
+				className: "la-request-note",
+				children: "Total includes queue wait, actor processing, and persistence. Queue wait includes the WebSocket message queue. Timings exclude the caller’s network round trip."
+			}),
+			/* @__PURE__ */ _(ee, {
+				open: !!b,
+				onOpenChange: (e) => {
+					e || x(void 0);
+				},
+				children: /* @__PURE__ */ v(ne, {
+					container: S.current,
+					onCloseAutoFocus: (e) => {
+						e.preventDefault(), C.current?.focus();
+					},
+					children: [
+						/* @__PURE__ */ _(te, { children: "Request details" }),
+						/* @__PURE__ */ _(k, { children: "Full identifiers and timings for this request." }),
+						b && /* @__PURE__ */ _(ce, { record: b })
+					]
+				})
+			})
+		]
+	});
+}
+function se({ query: e, loading: t, onSearch: n, scoped: r }) {
+	let [a, o] = i(!1);
+	return /* @__PURE__ */ v("form", {
+		className: "la-request-history-filters",
+		onSubmit: (e) => {
+			e.preventDefault();
+			let t = new FormData(e.currentTarget), r = t.get("from") ? new Date(String(t.get("from"))).getTime() : void 0, i = t.get("to") ? new Date(String(t.get("to"))).getTime() : void 0;
+			if (r !== void 0 && i !== void 0 && r > i) {
+				o(!0);
+				return;
+			}
+			o(!1), n({
+				fromMs: r,
+				toMs: i,
+				actorId: String(t.get("actorId") || "").trim() || void 0,
+				outcome: String(t.get("outcome") || "") || void 0
+			});
+		},
+		children: [
+			/* @__PURE__ */ v("label", { children: ["From", /* @__PURE__ */ _(O, {
+				type: "datetime-local",
+				name: "from"
+			})] }),
+			/* @__PURE__ */ v("label", { children: ["To", /* @__PURE__ */ _(O, {
+				type: "datetime-local",
+				name: "to"
+			})] }),
+			!r && /* @__PURE__ */ v("label", { children: ["Actor ID", /* @__PURE__ */ _(O, {
+				name: "actorId",
+				placeholder: "All actors",
+				maxLength: 256,
+				defaultValue: e.actorId
+			})] }),
+			/* @__PURE__ */ v("label", { children: ["Outcome", /* @__PURE__ */ v("select", {
+				className: "la-observer-select",
+				name: "outcome",
+				defaultValue: e.outcome ?? "",
+				children: [/* @__PURE__ */ _("option", {
+					value: "",
+					children: "All outcomes"
+				}), [
+					"completed",
+					"failed",
+					"rejected",
+					"rerouted",
+					"interrupted"
+				].map((e) => /* @__PURE__ */ _("option", {
+					value: e,
+					children: e[0].toUpperCase() + e.slice(1)
+				}, e))]
+			})] }),
+			/* @__PURE__ */ _(D, {
+				type: "submit",
+				variant: "outline",
+				disabled: t,
+				children: "Search"
+			}),
+			a && /* @__PURE__ */ _("p", {
+				className: "la-observer-error",
+				role: "alert",
+				children: "From must be before To."
+			})
+		]
+	});
+}
+function ce({ record: e }) {
+	let t = {
+		Operation: e.operation,
+		"Actor class": e.actorType,
+		"Instance ID": e.actorId,
+		"Request ID": e.requestId,
+		Time: new Date(e.startedAtMs).toLocaleString(),
+		Transport: e.kind === "method" ? "Method" : "WebSocket",
+		Outcome: e.outcome,
+		Total: q(e.durationMs),
+		"Queue wait": e.queueWaitMs === null ? "Did not begin processing" : q(e.queueWaitMs),
+		Host: e.hostId,
+		...e.connectionId ? { Connection: e.connectionId } : {}
+	};
+	return /* @__PURE__ */ _("dl", {
+		className: "la-request-details",
+		children: Object.entries(t).map(([e, t]) => /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("dt", { children: e }), /* @__PURE__ */ _("dd", { children: t })] }, e))
+	});
+}
+function q(e) {
+	return e >= 1e3 ? `${(e / 1e3).toLocaleString(void 0, { maximumFractionDigits: 2 })} s` : `${e.toLocaleString(void 0, { maximumFractionDigits: 1 })} ms`;
+}
+//#endregion
+//#region src/ActorObserver.tsx
+function le({ client: n, className: a = "", initialActorType: s, navigation: c }) {
+	let { inventory: u, loading: d, failed: f, retry: p } = I(n), [m, h] = i(s), y = c ? c.actorType : m, b = c ? c.onSelectActor : h, [x, S] = i(""), C = r(null), w = r(s), T = t(), E = u?.actors.find((e) => e.actorType === y);
+	return e(() => {
+		h(s), S("");
+	}, [n, s]), e(() => {
+		w.current !== y && C.current?.focus(), w.current = y;
+	}, [y]), /* @__PURE__ */ v("section", {
+		className: `la-observer ${a}`,
+		"aria-label": "Actor observer",
+		children: [
+			y !== void 0 && /* @__PURE__ */ v("nav", {
+				className: "la-observer-breadcrumb",
+				"aria-label": "Breadcrumb",
+				children: [
+					/* @__PURE__ */ _(D, {
+						variant: "link",
+						type: "button",
+						"aria-label": "Back to actors",
+						onClick: () => b(void 0),
+						children: "Actors"
+					}),
+					/* @__PURE__ */ _("span", {
+						"aria-hidden": "true",
+						children: "/"
+					}),
+					/* @__PURE__ */ _("span", {
+						"aria-current": "page",
+						children: y
+					})
+				]
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "la-observer-toolbar",
+				children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ _("div", {
+					className: "la-observer-title",
+					children: /* @__PURE__ */ _("h1", {
+						ref: C,
+						tabIndex: -1,
+						children: y ?? "Actors"
+					})
+				}), /* @__PURE__ */ _("p", { children: y === void 0 ? "Inspect instances, residency, and connections." : "Inspect this actor class’s instances, residency, and connections." })] }), /* @__PURE__ */ v(D, {
+					variant: "outline",
+					type: "button",
+					disabled: d,
+					onClick: p,
+					children: [/* @__PURE__ */ _(l, {
+						"aria-hidden": "true",
+						className: d ? "la-observer-spin" : void 0
+					}), d ? "Refreshing…" : f ? "Try again" : "Refresh"]
+				})]
+			}),
+			f && /* @__PURE__ */ v("div", {
+				className: "la-observer-error",
+				role: "alert",
+				children: [/* @__PURE__ */ _(o, { "aria-hidden": "true" }), /* @__PURE__ */ _("p", { children: u ? "Could not refresh. These counts may be out of date." : "Could not load actors. Check your connection and access, then try again." })]
+			}),
+			!u && !f && /* @__PURE__ */ _(ue, {}),
+			u && /* @__PURE__ */ v(g, { children: [y === void 0 ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(J, { inventory: u }), u.actors.length ? /* @__PURE__ */ _(de, {
+				inventory: u,
+				query: x,
+				onQueryChange: S,
+				onSelectActor: b
+			}) : /* @__PURE__ */ _(Z, {
+				title: "No actors yet",
+				description: "Deploy your actor classes to see them here. Instance counts appear as actors are used."
+			})] }) : E ? /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ _(J, {
+				inventory: { actors: [E] },
+				actorType: y
+			}), /* @__PURE__ */ _(fe, {
+				client: n,
+				id: T,
+				actorType: y,
+				instances: E.instances
+			}, y)] }) : /* @__PURE__ */ _(Z, {
+				title: "Actor class unavailable",
+				description: "This actor class is no longer in the latest inventory. Return to Actors to see available classes."
+			}), /* @__PURE__ */ v("div", {
+				className: "la-observer-footnote",
+				children: [/* @__PURE__ */ v("span", {
+					className: "la-observer-refresh-status",
+					children: [/* @__PURE__ */ _("span", { className: `la-observer-dot ${f ? "la-observer-dot-unknown" : n.watchActors ? "la-observer-dot-live" : ""}` }), f ? "Reconnecting…" : n.watchActors ? "Live updates" : "Auto-refresh every 5s"]
+				}), /* @__PURE__ */ _("span", { children: n.watchActors ? "Changes stream from the control plane." : "Counts follow the latest host heartbeat." })]
+			})] })
+		]
+	});
+}
+function ue() {
+	return /* @__PURE__ */ v("div", {
+		className: "la-observer-skeleton",
+		role: "status",
+		"aria-label": "Loading actors",
+		children: [
+			/* @__PURE__ */ _("span", {
+				className: "la:sr-only",
+				children: "Loading actors…"
+			}),
+			/* @__PURE__ */ _("div", {}),
+			/* @__PURE__ */ _("div", {}),
+			/* @__PURE__ */ _("div", {})
+		]
+	});
+}
+function J({ inventory: e, actorType: t }) {
+	let n = e.actors.reduce((e, t) => ({
+		live: e.live + t.live,
+		dormant: e.dormant + t.dormant,
+		unknown: e.unknown + t.unknown
+	}), {
+		live: 0,
+		dormant: 0,
+		unknown: 0
+	});
+	return /* @__PURE__ */ v("dl", {
+		className: "la-observer-summary",
+		children: [
+			/* @__PURE__ */ v("div", { children: [
+				/* @__PURE__ */ _("dt", { children: "Total instances" }),
+				/* @__PURE__ */ _("dd", {
+					"aria-label": "Total instances",
+					children: (n.live + n.dormant + n.unknown).toLocaleString()
+				}),
+				/* @__PURE__ */ _("p", { children: t === void 0 ? `${e.actors.length} actor ${e.actors.length === 1 ? "type" : "types"}` : "In this actor class" })
+			] }),
+			/* @__PURE__ */ v("div", { children: [
+				/* @__PURE__ */ v("dt", { children: [/* @__PURE__ */ _("span", { className: "la-observer-dot la-observer-dot-live" }), "Live"] }),
+				/* @__PURE__ */ _("dd", {
+					"aria-label": "Live instances",
+					children: n.live.toLocaleString()
+				}),
+				/* @__PURE__ */ _("p", { children: "Loaded in memory" })
+			] }),
+			/* @__PURE__ */ v("div", { children: [
+				/* @__PURE__ */ v("dt", { children: [/* @__PURE__ */ _("span", { className: "la-observer-dot" }), "Dormant"] }),
+				/* @__PURE__ */ _("dd", {
+					"aria-label": "Dormant instances",
+					children: n.dormant.toLocaleString()
+				}),
+				/* @__PURE__ */ _("p", { children: "Currently unloaded" })
+			] }),
+			n.unknown > 0 && /* @__PURE__ */ v("div", { children: [
+				/* @__PURE__ */ v("dt", { children: [/* @__PURE__ */ _("span", { className: "la-observer-dot la-observer-dot-unknown" }), "Unknown"] }),
+				/* @__PURE__ */ _("dd", {
+					"aria-label": "Unknown instances",
+					children: n.unknown.toLocaleString()
+				}),
+				/* @__PURE__ */ _("p", { children: "Awaiting host report" })
+			] })
+		]
+	});
+}
+function de({ inventory: e, query: t, onQueryChange: n, onSelectActor: r }) {
+	let i = e.actors.some((e) => e.unknown > 0), s = e.actors.filter((e) => Q(e.actorType, t)).sort((e, t) => Number(t.live > 0) - Number(e.live > 0));
+	return /* @__PURE__ */ v(g, { children: [
+		/* @__PURE__ */ v("div", {
+			className: "la-observer-list-toolbar",
+			children: [/* @__PURE__ */ v("h2", { children: ["Actor types ", /* @__PURE__ */ _(T, { children: e.actors.length })] }), /* @__PURE__ */ _(X, {
+				label: "Search actors",
+				placeholder: "Search actors…",
+				value: t,
+				onChange: n
+			})]
+		}),
+		/* @__PURE__ */ _("div", {
+			className: "la-observer-table-frame",
+			children: s.length ? /* @__PURE__ */ v(A, {
+				"aria-label": "Actor instance counts",
+				className: "la-observer-table",
+				children: [/* @__PURE__ */ _(j, { children: /* @__PURE__ */ v(N, { children: [
+					/* @__PURE__ */ _(P, {
+						scope: "col",
+						children: "Actor"
+					}),
+					/* @__PURE__ */ _(P, {
+						scope: "col",
+						children: "Live"
+					}),
+					/* @__PURE__ */ _(P, {
+						scope: "col",
+						children: "Dormant"
+					}),
+					i && /* @__PURE__ */ _(P, {
+						scope: "col",
+						children: "Unknown"
+					}),
+					/* @__PURE__ */ _(P, {
+						scope: "col",
+						children: "Total"
+					})
+				] }) }), /* @__PURE__ */ _(M, { children: s.map((e) => /* @__PURE__ */ v(N, {
+					className: "la-clickable-row",
+					onClick: () => r(e.actorType),
+					children: [
+						/* @__PURE__ */ _(F, {
+							className: "la-observer-name",
+							children: /* @__PURE__ */ v(D, {
+								variant: "ghost",
+								type: "button",
+								className: "la-observer-actor-button la-observer-class-button",
+								children: [/* @__PURE__ */ _(a, {
+									className: "la-observer-type-icon",
+									"aria-hidden": "true"
+								}), /* @__PURE__ */ _("span", { children: e.actorType })]
+							})
+						}),
+						/* @__PURE__ */ _(F, { children: /* @__PURE__ */ _("span", {
+							className: e.live > 0 ? "la-observer-live" : void 0,
+							children: e.live.toLocaleString()
+						}) }),
+						/* @__PURE__ */ _(F, { children: e.dormant.toLocaleString() }),
+						i && /* @__PURE__ */ _(F, { children: e.unknown.toLocaleString() }),
+						/* @__PURE__ */ _(F, { children: (e.live + e.dormant + e.unknown).toLocaleString() })
+					]
+				}, e.actorType)) })]
+			}) : /* @__PURE__ */ _(Z, {
+				title: "No matching actors",
+				description: "Try a different actor name.",
+				action: "Clear search",
+				onReset: () => n("")
+			})
+		}),
+		i && /* @__PURE__ */ v("p", {
+			className: "la-observer-unknown",
+			children: [/* @__PURE__ */ _(o, { "aria-hidden": "true" }), "Some hosts have not reported which instances are loaded. Their counts are shown as unknown."]
+		})
+	] });
+}
+function fe({ client: t, id: n, actorType: a, instances: o }) {
+	let [s, c] = i(""), [l, u] = i("all"), [d, f] = i(), p = `${n}-connections`, m = o.filter((e) => Q(e.actorId, s) && (l === "all" || e.status === l));
+	m.sort((e, t) => Number(t.status === "live") - Number(e.status === "live"));
+	let h = o.find((e) => e.actorId === d), y = r(null);
+	return e(() => {
+		y.current?.focus();
+	}, [d]), d === void 0 ? /* @__PURE__ */ v("section", {
+		id: n,
+		className: "la-observer-instances",
+		"aria-labelledby": `${n}-heading`,
+		children: [/* @__PURE__ */ _("div", {
+			className: "la-observer-instances-heading",
+			children: /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("h2", {
+				ref: y,
+				tabIndex: -1,
+				id: `${n}-heading`,
+				children: [
+					a,
+					" instances ",
+					/* @__PURE__ */ _(T, {
+						"aria-hidden": "true",
+						children: o.length.toLocaleString()
+					})
+				]
+			}), /* @__PURE__ */ _("p", { children: "Select an instance to inspect its waiting line, requests, and WebSocket connections." })] })
+		}), o.length ? /* @__PURE__ */ v(g, { children: [
+			/* @__PURE__ */ v("div", {
+				className: "la-observer-filters",
+				children: [/* @__PURE__ */ _(X, {
+					label: "Search instances",
+					placeholder: "Search instance IDs…",
+					value: s,
+					onChange: c
+				}), /* @__PURE__ */ v("select", {
+					className: "la-observer-select",
+					"aria-label": "Instance state",
+					value: l,
+					onChange: (e) => u(e.target.value),
+					children: [
+						/* @__PURE__ */ _("option", {
+							value: "all",
+							children: "All states"
+						}),
+						/* @__PURE__ */ _("option", {
+							value: "live",
+							children: "Live"
+						}),
+						/* @__PURE__ */ _("option", {
+							value: "dormant",
+							children: "Dormant"
+						}),
+						/* @__PURE__ */ _("option", {
+							value: "unknown",
+							children: "Unknown"
+						})
+					]
+				})]
+			}),
+			/* @__PURE__ */ _("div", {
+				className: "la-observer-table-frame",
+				children: m.length ? /* @__PURE__ */ v(A, {
+					"aria-label": `${a} instances`,
+					className: "la-observer-instance-table",
+					children: [/* @__PURE__ */ _(j, { children: /* @__PURE__ */ v(N, { children: [
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Instance"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "State"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							children: "Connections"
+						}),
+						/* @__PURE__ */ _(P, {
+							scope: "col",
+							className: "la-observer-waiting-cell",
+							children: "Waiting"
+						})
+					] }) }), /* @__PURE__ */ _(M, { children: m.map((e) => /* @__PURE__ */ v(N, {
+						className: "la-clickable-row",
+						onClick: () => f(e.actorId),
+						children: [
+							/* @__PURE__ */ _(F, {
+								className: "la-observer-instance-id",
+								children: /* @__PURE__ */ _(D, {
+									variant: "ghost",
+									type: "button",
+									className: "la-observer-actor-button",
+									children: /* @__PURE__ */ _("span", { children: e.actorId })
+								})
+							}),
+							/* @__PURE__ */ _(F, { children: /* @__PURE__ */ v(T, {
+								variant: "outline",
+								className: `la-observer-status-${e.status}`,
+								children: [/* @__PURE__ */ _("span", { className: `la-observer-dot la-observer-dot-${e.status}` }), $(e.status)]
+							}) }),
+							/* @__PURE__ */ _(F, { children: e.connections.length.toLocaleString() }),
+							/* @__PURE__ */ _(F, {
+								className: "la-observer-waiting-cell",
+								children: /* @__PURE__ */ _(Y, {
+									waiting: e.waiting,
+									compact: !0
+								})
+							})
+						]
+					}, e.actorId)) })]
+				}) : /* @__PURE__ */ _(Z, {
+					title: "No matching instances",
+					description: "Try another instance ID or state.",
+					action: "Clear filters",
+					onReset: () => {
+						c(""), u("all");
+					}
+				})
+			}),
+			/* @__PURE__ */ _("p", {
+				className: "la-observer-connection-note",
+				children: "Connections are active WebSocket connections, not unique people."
+			})
+		] }) : /* @__PURE__ */ v("p", {
+			className: "la-observer-instance-empty",
+			role: "status",
+			children: [
+				"No ",
+				a,
+				" instances have been created yet."
+			]
+		})]
+	}) : /* @__PURE__ */ v("section", {
+		className: "la-observer-instance-detail",
+		"aria-label": `${a} / ${d}`,
+		children: [
+			/* @__PURE__ */ _(D, {
+				variant: "link",
+				"aria-label": "Back to instances",
+				onClick: () => f(void 0),
+				children: "Back to instances"
+			}),
+			/* @__PURE__ */ v("div", {
+				className: "la-observer-instance-heading",
+				children: [/* @__PURE__ */ _("h2", {
+					ref: y,
+					tabIndex: -1,
+					children: d
+				}), h && /* @__PURE__ */ _(T, {
+					variant: "outline",
+					className: `la-observer-status-${h.status}`,
+					children: $(h.status)
+				})]
+			}),
+			!h && /* @__PURE__ */ _("p", {
+				role: "status",
+				children: "This instance is no longer in the current inventory. Its retained requests are still available below."
+			}),
+			h && /* @__PURE__ */ _(pe, { waiting: h.waiting }),
+			t.watchRequests || t.query ? /* @__PURE__ */ _(K, {
+				client: t,
+				actor: {
+					actorType: a,
+					actorId: d
+				}
+			}, d) : /* @__PURE__ */ v("section", { children: [/* @__PURE__ */ _("h3", { children: "Requests" }), /* @__PURE__ */ _("p", { children: "Request timings are unavailable for this connection." })] }),
+			h && /* @__PURE__ */ _(me, {
+				id: p,
+				actorId: h.actorId,
+				connections: h.connections
+			})
+		]
+	});
+}
+function pe({ waiting: e }) {
+	return /* @__PURE__ */ v("section", {
+		className: "la-observer-waiting",
+		"aria-label": "Waiting requests",
+		children: [
+			/* @__PURE__ */ v("h3", { children: ["Waiting requests", e != null && ` (${e.length})`] }),
+			/* @__PURE__ */ _("p", { children: e == null ? "This host has not reported its waiting line." : e.length ? "Next to run first. Operations leave this line when they start." : "No requests waiting." }),
+			!!e?.length && /* @__PURE__ */ _(Y, { waiting: e })
+		]
+	});
+}
+function Y({ waiting: e, compact: t = !1 }) {
+	if (e == null) return /* @__PURE__ */ _("span", {
+		title: "Queue reporting is unavailable",
+		children: "Unavailable"
+	});
+	if (!e.length) return /* @__PURE__ */ _("span", {
+		className: "la-observer-queue-empty",
+		children: "None"
+	});
+	let n = t ? e.slice(0, 3) : e;
+	return /* @__PURE__ */ v("ol", {
+		className: `la-observer-queue${t ? " la-observer-queue-compact" : ""}`,
+		"aria-label": `${e.length} waiting requests, next to run first`,
+		children: [n.map((e, n) => /* @__PURE__ */ _("li", { children: /* @__PURE__ */ v(T, {
+			variant: "outline",
+			className: "la-observer-queue-bubble",
+			title: e.operation,
+			children: [!t && /* @__PURE__ */ _("span", {
+				className: "la-observer-queue-position",
+				children: n + 1
+			}), /* @__PURE__ */ _("span", {
+				className: "la-observer-queue-operation",
+				children: e.operation
+			})]
+		}) }, e.id)), t && e.length > n.length && /* @__PURE__ */ _("li", { children: /* @__PURE__ */ v(T, {
+			"aria-label": `${e.length - n.length} more waiting requests`,
+			children: ["+", e.length - n.length]
+		}) })]
+	});
+}
+function me({ id: e, actorId: t, connections: n }) {
+	return /* @__PURE__ */ v("section", {
+		id: e,
+		className: "la-observer-connections",
+		"aria-labelledby": `${e}-heading`,
+		children: [/* @__PURE__ */ _("div", {
+			className: "la-observer-instances-heading",
+			children: /* @__PURE__ */ v("div", { children: [/* @__PURE__ */ v("h3", {
+				id: `${e}-heading`,
+				children: [
+					t,
+					" WebSockets ",
+					/* @__PURE__ */ _(T, {
+						"aria-hidden": "true",
+						children: n.length.toLocaleString()
+					})
+				]
+			}), /* @__PURE__ */ _("p", { children: `${n.length.toLocaleString()} active ${n.length === 1 ? "connection" : "connections"}` })] })
+		}), n.length ? /* @__PURE__ */ _("div", {
+			className: "la-observer-table-frame",
+			children: /* @__PURE__ */ v(A, {
+				"aria-label": `${t} WebSocket connections`,
+				className: "la-observer-connection-table",
+				children: [/* @__PURE__ */ _(j, { children: /* @__PURE__ */ v(N, { children: [/* @__PURE__ */ _(P, {
+					scope: "col",
+					children: "Socket"
+				}), /* @__PURE__ */ _(P, {
+					scope: "col",
+					children: "Metadata"
+				})] }) }), /* @__PURE__ */ _(M, { children: n.map((e) => /* @__PURE__ */ v(N, { children: [/* @__PURE__ */ _(F, {
+					className: "la-observer-socket-id",
+					children: e.id
+				}), /* @__PURE__ */ _(F, { children: /* @__PURE__ */ _("pre", { children: JSON.stringify(e.metadata, null, 2) }) })] }, e.id)) })]
+			})
+		}) : /* @__PURE__ */ v("div", {
+			className: "la-observer-no-connections",
+			role: "status",
+			children: [/* @__PURE__ */ _(d, { "aria-hidden": "true" }), /* @__PURE__ */ _("p", { children: "No active WebSocket connections." })]
+		})]
+	});
+}
+function X({ label: e, placeholder: t, value: n, onChange: r }) {
+	return /* @__PURE__ */ v("div", {
+		className: "la-observer-search",
+		children: [/* @__PURE__ */ _(u, { "aria-hidden": "true" }), /* @__PURE__ */ _(O, {
+			type: "search",
+			"aria-label": e,
+			placeholder: t,
+			value: n,
+			onInput: (e) => r(e.currentTarget.value)
+		})]
+	});
+}
+function Z({ title: e, description: t, action: n, onReset: r }) {
+	return /* @__PURE__ */ v("div", {
+		className: "la-observer-empty",
+		children: [
+			/* @__PURE__ */ _(u, { "aria-hidden": "true" }),
+			/* @__PURE__ */ _("h3", { children: e }),
+			/* @__PURE__ */ _("p", { children: t }),
+			n && /* @__PURE__ */ _(D, {
+				type: "button",
+				variant: "outline",
+				onClick: r,
+				children: n
+			})
+		]
+	});
+}
+function Q(e, t) {
+	return e.toLocaleLowerCase().includes(t.trim().toLocaleLowerCase());
+}
+function $(e) {
+	return e[0].toUpperCase() + e.slice(1);
+}
+//#endregion
+export { le as ActorObserver, L as HttpObserverClient, K as RequestObserver };