@hansenexus/hud 0.1.0

package/chunk-c5y856ad.js

@@ -0,0 +1,98 @@
+// core/force-state.ts
+var FORCED_STATES = ["loading", "empty", "error"];
+var FORCE_STATE_PARAM = "__state";
+var FORCE_STATE_MARKER = "__HN_FORCE_STATE__";
+function isForcedState(value) {
+  return FORCED_STATES.includes(value);
+}
+function parseForceStateParam(value) {
+  if (!value)
+    return null;
+  const separator = value.lastIndexOf(":");
+  if (separator === -1)
+    return isForcedState(value) ? { state: value, target: null } : null;
+  const target = value.slice(0, separator);
+  const state = value.slice(separator + 1);
+  if (!target || !isForcedState(state))
+    return null;
+  return { state, target };
+}
+function forceStateParamFromSearch(search) {
+  return parseForceStateParam(new URLSearchParams(search).get(FORCE_STATE_PARAM));
+}
+function resolveForcedState(snapshot, boundary) {
+  const override = snapshot.overrides[boundary.id];
+  if (override)
+    return override;
+  const { param } = snapshot;
+  if (!param)
+    return null;
+  if (param.target !== null)
+    return param.target === boundary.id ? param.state : null;
+  return boundary.parentId === null ? param.state : null;
+}
+
+class ForceStateStore {
+  registrations = new Map;
+  overrides = {};
+  search = "";
+  snapshot = { boundaries: [], overrides: {}, param: null };
+  listeners = new Set;
+  getSnapshot = () => this.snapshot;
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  register(id, parentId) {
+    const existing = this.registrations.get(id);
+    this.registrations.set(id, { parentId, count: (existing?.count ?? 0) + 1 });
+    this.emit();
+    return () => {
+      const current = this.registrations.get(id);
+      if (!current)
+        return;
+      if (current.count > 1)
+        this.registrations.set(id, { ...current, count: current.count - 1 });
+      else
+        this.registrations.delete(id);
+      this.emit();
+    };
+  }
+  force(id, state) {
+    const next = { ...this.overrides };
+    if (state)
+      next[id] = state;
+    else
+      delete next[id];
+    this.overrides = next;
+    this.emit();
+  }
+  clearOverrides() {
+    this.overrides = {};
+    this.emit();
+  }
+  syncSearch(search) {
+    if (search === this.search)
+      return;
+    this.search = search;
+    this.emit();
+  }
+  emit() {
+    this.snapshot = {
+      boundaries: [...this.registrations].map(([id, { parentId }]) => ({ id, parentId })),
+      overrides: this.overrides,
+      param: forceStateParamFromSearch(this.search)
+    };
+    for (const listener of this.listeners)
+      listener();
+  }
+}
+function getForceStateStore() {
+  const holder = globalThis;
+  holder[FORCE_STATE_MARKER] ??= new ForceStateStore;
+  return holder[FORCE_STATE_MARKER];
+}
+
+export { FORCED_STATES, FORCE_STATE_PARAM, FORCE_STATE_MARKER, parseForceStateParam, forceStateParamFromSearch, resolveForcedState, ForceStateStore, getForceStateStore };

package/chunk-ghxh8926.js

@@ -0,0 +1,172 @@
+import {
+  usePoll
+} from "./chunk-xezxydm3.js";
+import {
+  useHud
+} from "./chunk-wspz08q7.js";
+import {
+  LoadingSpinner,
+  PanelSection
+} from "./chunk-kyeb6qeq.js";
+import {
+  Badge
+} from "./chunk-xztw0xyt.js";
+import {
+  __require
+} from "./chunk-5gtx3pza.js";
+
+// panels/vitals-panel.tsx
+import { Activity, ServerCrash } from "lucide-react";
+import { useEffect, useSyncExternalStore } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+var VITAL_ORDER = ["LCP", "INP", "CLS", "TTFB", "FCP"];
+var vitals = new Map;
+var vitalsSnapshot = new Map;
+var vitalListeners = new Set;
+var vitalsStarted = false;
+function recordVital(name, value, rating) {
+  vitals.set(name, { value, rating });
+  vitalsSnapshot = new Map(vitals);
+  for (const listener of vitalListeners)
+    listener();
+}
+function startVitals() {
+  if (vitalsStarted || typeof window === "undefined")
+    return;
+  vitalsStarted = true;
+  import("web-vitals").then(({ onCLS, onFCP, onLCP, onTTFB, onINP }) => {
+    const report = (metric) => recordVital(metric.name, metric.value, metric.rating);
+    onCLS(report, { reportAllChanges: true });
+    onINP(report, { reportAllChanges: true });
+    onLCP(report);
+    onFCP(report);
+    onTTFB(report);
+  });
+}
+function subscribeVitals(listener) {
+  vitalListeners.add(listener);
+  return () => vitalListeners.delete(listener);
+}
+function getVitalsSnapshot() {
+  const out = {};
+  for (const [name, sample] of vitals)
+    out[name] = Number(sample.value.toFixed(2));
+  return out;
+}
+function formatVital(name, value) {
+  if (name === "CLS")
+    return value.toFixed(3);
+  if (value >= 1000)
+    return `${(value / 1000).toFixed(2)} s`;
+  return `${Math.round(value)} ms`;
+}
+var RATING_CLASS = {
+  good: "text-emerald-500",
+  "needs-improvement": "text-amber-500",
+  poor: "text-red-500"
+};
+function VitalsPanel() {
+  const { config } = useHud();
+  const samples = useSyncExternalStore(subscribeVitals, () => vitalsSnapshot, () => vitalsSnapshot);
+  useEffect(() => {
+    startVitals();
+  }, []);
+  const apiBase = config.apiBase ?? "/api/hud";
+  const signoz = usePoll(`${apiBase}/signoz?service=${encodeURIComponent(config.appSlug)}`, 60000);
+  return /* @__PURE__ */ jsxs("div", {
+    className: "space-y-4",
+    children: [
+      /* @__PURE__ */ jsxs(PanelSection, {
+        icon: Activity,
+        title: "Web Vitals · this page load",
+        children: [
+          /* @__PURE__ */ jsx("div", {
+            className: "flex flex-wrap gap-2 px-2",
+            children: VITAL_ORDER.map((name) => {
+              const sample = samples.get(name);
+              return /* @__PURE__ */ jsxs("div", {
+                className: "min-w-[92px] rounded-md border bg-muted/20 px-3 py-2",
+                children: [
+                  /* @__PURE__ */ jsx("div", {
+                    className: "text-[10px] uppercase tracking-wider text-muted-foreground",
+                    children: name
+                  }),
+                  /* @__PURE__ */ jsx("div", {
+                    className: `font-mono text-sm font-semibold ${sample ? RATING_CLASS[sample.rating] : "text-muted-foreground/50"}`,
+                    children: sample ? formatVital(name, sample.value) : "—"
+                  })
+                ]
+              }, name);
+            })
+          }),
+          /* @__PURE__ */ jsx("p", {
+            className: "px-2 text-[10px] text-muted-foreground/60",
+            children: "CLS/INP update live; LCP/FCP/TTFB are per page load. History lands in SigNoz via /api/otel/vitals."
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsxs(PanelSection, {
+        icon: ServerCrash,
+        title: `Server · ${config.appSlug} (1h)`,
+        children: [
+          signoz.loading && /* @__PURE__ */ jsx(LoadingSpinner, {}),
+          signoz.error && /* @__PURE__ */ jsxs("p", {
+            className: "px-2 text-[10px] text-amber-500",
+            children: [
+              "hub unreachable — ",
+              signoz.error
+            ]
+          }),
+          signoz.data && /* @__PURE__ */ jsxs("div", {
+            className: "space-y-1 px-2",
+            children: [
+              /* @__PURE__ */ jsxs("div", {
+                className: "flex items-center gap-2",
+                children: [
+                  /* @__PURE__ */ jsx(ServerStat, {
+                    label: "error rate",
+                    value: signoz.data.errorRate,
+                    unit: "/s"
+                  }),
+                  /* @__PURE__ */ jsx(ServerStat, {
+                    label: "p95",
+                    value: signoz.data.p95Latency,
+                    unit: " ms"
+                  }),
+                  /* @__PURE__ */ jsx(ServerStat, {
+                    label: "req rate",
+                    value: signoz.data.requestCount,
+                    unit: "/s"
+                  })
+                ]
+              }),
+              signoz.data.source === "mock" && /* @__PURE__ */ jsx(Badge, {
+                variant: "outline",
+                className: "h-4 px-1.5 text-[9px] text-muted-foreground",
+                children: "mock data — SIGNOZ_QUERY_URL unset"
+              })
+            ]
+          })
+        ]
+      })
+    ]
+  });
+}
+function ServerStat({ label, value, unit }) {
+  return /* @__PURE__ */ jsxs("div", {
+    className: "min-w-[92px] rounded-md border bg-muted/20 px-3 py-2",
+    children: [
+      /* @__PURE__ */ jsx("div", {
+        className: "text-[10px] uppercase tracking-wider text-muted-foreground",
+        children: label
+      }),
+      /* @__PURE__ */ jsx("div", {
+        className: "font-mono text-sm font-semibold",
+        children: value === null ? "—" : `${value.toFixed(value < 10 ? 2 : 0)}${unit}`
+      })
+    ]
+  });
+}
+
+export { getVitalsSnapshot, VitalsPanel };

package/chunk-hc2g0n35.js

@@ -0,0 +1,24 @@
+// core/mock-cookie.ts
+var HUD_MOCK_COOKIE = "hud-mock";
+function isHudMockEnabled(cookieValue, env) {
+  const hudAllowed = env.nodeEnv === "development" || env.hudEnabled === "true";
+  return hudAllowed && cookieValue === "1";
+}
+function hudMockCookieString(enabled) {
+  if (!enabled)
+    return `${HUD_MOCK_COOKIE}=; path=/; max-age=0; samesite=lax`;
+  return `${HUD_MOCK_COOKIE}=1; path=/; max-age=${60 * 60 * 24 * 30}; samesite=lax`;
+}
+function readHudMockCookie() {
+  if (typeof document === "undefined")
+    return;
+  const match = document.cookie.split("; ").find((part) => part.startsWith(`${HUD_MOCK_COOKIE}=`));
+  return match?.slice(HUD_MOCK_COOKIE.length + 1);
+}
+function setHudMockCookie(enabled) {
+  if (typeof document === "undefined")
+    return;
+  document.cookie = hudMockCookieString(enabled);
+}
+
+export { HUD_MOCK_COOKIE, isHudMockEnabled, hudMockCookieString, readHudMockCookie, setHudMockCookie };

package/chunk-k0vr8dsy.js

@@ -0,0 +1,179 @@
+import {
+  bridgeFetch,
+  getBridgeInfo
+} from "./chunk-50pq4sg6.js";
+import {
+  useHud
+} from "./chunk-wspz08q7.js";
+import {
+  LoadingSpinner,
+  PanelSection
+} from "./chunk-kyeb6qeq.js";
+import {
+  Badge,
+  Button,
+  Switch
+} from "./chunk-xztw0xyt.js";
+import {
+  readHudMockCookie,
+  setHudMockCookie
+} from "./chunk-hc2g0n35.js";
+
+// panels/mock-seed-panel.tsx
+import { Database, FlaskConical, RefreshCw } from "lucide-react";
+import { useEffect, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+function MockSeedPanel({ seeds = [] }) {
+  const { config, can } = useHud();
+  const [mockCookie, setMockCookie] = useState(undefined);
+  const [bridge, setBridge] = useState(undefined);
+  const [runs, setRuns] = useState([]);
+  const apiBase = config.apiBase ?? "/api/hud";
+  const canSeed = can("inject.seed") && seeds.length > 0;
+  useEffect(() => {
+    setMockCookie(readHudMockCookie());
+  }, []);
+  useEffect(() => {
+    if (!canSeed)
+      return;
+    let cancelled = false;
+    getBridgeInfo(apiBase).then((info) => {
+      if (!cancelled)
+        setBridge(info);
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [apiBase, canSeed]);
+  const mockOn = mockCookie === "1";
+  function toggleMock(next) {
+    setHudMockCookie(next);
+    setMockCookie(next ? "1" : undefined);
+    window.location.reload();
+  }
+  async function runSeed(seed) {
+    if (!bridge)
+      return;
+    const runId = `${seed.id}-${Date.now()}`;
+    setRuns((prev) => [{ id: runId, label: seed.label, status: "running" }, ...prev]);
+    try {
+      const res = await bridgeFetch(bridge, "/seed", {
+        method: "POST",
+        body: JSON.stringify({
+          app: config.appSlug,
+          fn: seed.fn,
+          args: seed.args,
+          local: seed.local
+        })
+      });
+      const body = await res.json();
+      setRuns((prev) => prev.map((run) => run.id === runId ? { ...run, status: body.ok ? "done" : "failed", detail: body.output ?? body.error } : run));
+    } catch (error) {
+      setRuns((prev) => prev.map((run) => run.id === runId ? {
+        ...run,
+        status: "failed",
+        detail: error instanceof Error ? error.message : "seed failed"
+      } : run));
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", {
+    className: "space-y-4",
+    children: [
+      can("mock.toggle") && /* @__PURE__ */ jsx(PanelSection, {
+        icon: FlaskConical,
+        title: "Mock Convex",
+        children: /* @__PURE__ */ jsxs("div", {
+          className: "flex items-center justify-between px-2",
+          children: [
+            /* @__PURE__ */ jsxs("div", {
+              children: [
+                /* @__PURE__ */ jsx("div", {
+                  className: "text-xs font-medium",
+                  children: "Mock backend"
+                }),
+                /* @__PURE__ */ jsx("p", {
+                  className: "text-[10px] text-muted-foreground/60",
+                  children: "Swaps the Convex client for a dummy — reload applies (server re-reads the cookie)."
+                })
+              ]
+            }),
+            /* @__PURE__ */ jsxs("div", {
+              className: "flex items-center gap-2",
+              children: [
+                mockOn && /* @__PURE__ */ jsx(Badge, {
+                  variant: "outline",
+                  className: "h-4 px-1.5 text-[9px] text-amber-500",
+                  children: "mock"
+                }),
+                /* @__PURE__ */ jsx(Switch, {
+                  checked: mockOn,
+                  onCheckedChange: toggleMock
+                })
+              ]
+            })
+          ]
+        })
+      }),
+      canSeed && /* @__PURE__ */ jsxs(PanelSection, {
+        icon: Database,
+        title: "Seed data",
+        children: [
+          bridge === undefined && /* @__PURE__ */ jsx(LoadingSpinner, {}),
+          bridge === null && /* @__PURE__ */ jsx("p", {
+            className: "px-2 text-[10px] text-amber-500",
+            children: "bridge not reachable — run `bun hud:bridge` in the repo to seed from here."
+          }),
+          bridge != null && /* @__PURE__ */ jsx("div", {
+            className: "space-y-1 px-2",
+            children: seeds.map((seed) => /* @__PURE__ */ jsxs("div", {
+              className: "flex items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsxs(Button, {
+                  size: "sm",
+                  variant: "outline",
+                  className: "h-6 text-[11px]",
+                  onClick: () => runSeed(seed),
+                  children: [
+                    /* @__PURE__ */ jsx(RefreshCw, {
+                      className: "mr-1.5 h-3 w-3"
+                    }),
+                    seed.label
+                  ]
+                }),
+                seed.description && /* @__PURE__ */ jsx("span", {
+                  className: "min-w-0 flex-1 truncate text-[10px] text-muted-foreground/60",
+                  children: seed.description
+                })
+              ]
+            }, seed.id))
+          })
+        ]
+      }),
+      runs.length > 0 && /* @__PURE__ */ jsx(PanelSection, {
+        title: "Seed runs",
+        children: runs.map((run) => /* @__PURE__ */ jsxs("div", {
+          className: "flex items-center gap-2 px-2 py-1 font-mono text-[10.5px]",
+          children: [
+            /* @__PURE__ */ jsx(Badge, {
+              variant: "outline",
+              className: `h-4 px-1.5 text-[9px] ${run.status === "done" ? "text-emerald-500" : run.status === "failed" ? "text-red-500" : "text-amber-500"}`,
+              children: run.status
+            }),
+            /* @__PURE__ */ jsx("span", {
+              className: "min-w-0 flex-1 truncate",
+              children: run.label
+            }),
+            run.detail && /* @__PURE__ */ jsx("span", {
+              className: "max-w-[220px] truncate text-muted-foreground/60",
+              title: run.detail,
+              children: run.detail
+            })
+          ]
+        }, run.id))
+      })
+    ]
+  });
+}
+
+export { MockSeedPanel };

package/chunk-k50yfp5d.js

@@ -0,0 +1,166 @@
+import {
+  useHud
+} from "./chunk-wspz08q7.js";
+import {
+  PanelSection
+} from "./chunk-kyeb6qeq.js";
+import {
+  Badge,
+  Button
+} from "./chunk-xztw0xyt.js";
+
+// panels/variants-panel.tsx
+import { ArrowUpRight, Beaker, Wand2 } from "lucide-react";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+var STATUS_CLASS = {
+  active: "text-emerald-500",
+  decided: "text-muted-foreground"
+};
+function VariantsPanel({ adapter }) {
+  const { can } = useHud();
+  const { categories, reviewHref, categoryHref, openPreview, generate } = adapter;
+  const [path, setPath] = useState("");
+  const [brief, setBrief] = useState("");
+  const [result, setResult] = useState(null);
+  const [sending, setSending] = useState(false);
+  const grouped = new Map;
+  for (const category of categories) {
+    const key = category.domain ?? "shared";
+    grouped.set(key, [...grouped.get(key) ?? [], category]);
+  }
+  async function submitGenerate() {
+    if (!generate || !path.trim())
+      return;
+    setSending(true);
+    setResult(null);
+    try {
+      setResult(await generate({ path: path.trim(), brief: brief.trim(), count: 3 }));
+    } catch (error) {
+      setResult({ ok: false, error: error instanceof Error ? error.message : "generate failed" });
+    } finally {
+      setSending(false);
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", {
+    className: "space-y-4",
+    children: [
+      /* @__PURE__ */ jsxs(PanelSection, {
+        icon: Beaker,
+        title: `Categories (${categories.length})`,
+        children: [
+          categories.length === 0 && /* @__PURE__ */ jsx("p", {
+            className: "px-2 text-[10px] text-muted-foreground/60",
+            children: "No preview categories registered for this app."
+          }),
+          /* @__PURE__ */ jsx("div", {
+            className: "space-y-2 px-2",
+            children: Array.from(grouped.entries()).map(([domain, list]) => /* @__PURE__ */ jsxs("div", {
+              children: [
+                /* @__PURE__ */ jsx("div", {
+                  className: "text-[9px] uppercase tracking-wider text-muted-foreground/50",
+                  children: domain
+                }),
+                list.map((category) => /* @__PURE__ */ jsxs("div", {
+                  className: "flex items-center gap-2 py-1 text-[11px]",
+                  children: [
+                    /* @__PURE__ */ jsx(Badge, {
+                      variant: "outline",
+                      className: `h-4 px-1.5 text-[9px] ${STATUS_CLASS[category.status] ?? "text-amber-500"}`,
+                      children: category.status
+                    }),
+                    /* @__PURE__ */ jsx("span", {
+                      className: "min-w-0 flex-1 truncate",
+                      children: category.name
+                    }),
+                    /* @__PURE__ */ jsxs("span", {
+                      className: "text-muted-foreground/60",
+                      children: [
+                        category.alternativeCount,
+                        " alt",
+                        category.alternativeCount === 1 ? "" : "s"
+                      ]
+                    }),
+                    openPreview ? /* @__PURE__ */ jsx(Button, {
+                      variant: "ghost",
+                      size: "sm",
+                      className: "h-5 px-1.5 text-[10px]",
+                      onClick: () => openPreview(category.id),
+                      children: "open"
+                    }) : categoryHref ? /* @__PURE__ */ jsxs("a", {
+                      href: categoryHref(category.id),
+                      className: "inline-flex items-center gap-0.5 text-[10px] text-primary hover:underline",
+                      children: [
+                        "open",
+                        /* @__PURE__ */ jsx(ArrowUpRight, {
+                          className: "h-2.5 w-2.5"
+                        })
+                      ]
+                    }) : null
+                  ]
+                }, category.id))
+              ]
+            }, domain))
+          }),
+          /* @__PURE__ */ jsx("div", {
+            className: "px-2 pt-1",
+            children: /* @__PURE__ */ jsxs("a", {
+              href: reviewHref,
+              className: "inline-flex items-center gap-1 text-[10px] text-primary hover:underline",
+              children: [
+                "Full review dashboard (vote, showcase, decisions)",
+                /* @__PURE__ */ jsx(ArrowUpRight, {
+                  className: "h-3 w-3"
+                })
+              ]
+            })
+          })
+        ]
+      }),
+      generate && can("variants.generate") && /* @__PURE__ */ jsx(PanelSection, {
+        icon: Wand2,
+        title: "Generate variants",
+        children: /* @__PURE__ */ jsxs("div", {
+          className: "space-y-2 px-2",
+          children: [
+            /* @__PURE__ */ jsx("input", {
+              value: path,
+              onChange: (e) => setPath(e.target.value),
+              placeholder: "apps/console/src/components/… (repo-relative)",
+              className: "w-full rounded-md border bg-muted/20 p-2 font-mono text-[11px] outline-none focus:ring-1 focus:ring-ring"
+            }),
+            /* @__PURE__ */ jsx("textarea", {
+              value: brief,
+              onChange: (e) => setBrief(e.target.value),
+              placeholder: "Brief, e.g.: three denser table treatments, keep the glass language",
+              className: "min-h-[44px] w-full rounded-md border bg-muted/20 p-2 font-mono text-[11px] outline-none focus:ring-1 focus:ring-ring"
+            }),
+            /* @__PURE__ */ jsxs("div", {
+              className: "flex items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsx(Button, {
+                  size: "sm",
+                  className: "h-6 text-[11px]",
+                  disabled: sending || !path.trim(),
+                  onClick: submitGenerate,
+                  children: "Queue 3 variants"
+                }),
+                /* @__PURE__ */ jsx("span", {
+                  className: "text-[10px] text-muted-foreground/60",
+                  children: "Writes a .claude/queue marker — the next session runs /generate-variants."
+                })
+              ]
+            }),
+            result && /* @__PURE__ */ jsx("p", {
+              className: `font-mono text-[10px] ${result.ok ? "text-emerald-500" : "text-red-500"}`,
+              children: result.ok ? `queued → ${result.markerPath}` : result.error
+            })
+          ]
+        })
+      })
+    ]
+  });
+}
+
+export { VariantsPanel };