@jefuriiij/synthra 0.1.0

package/dist/dashboard/index.js

@@ -0,0 +1,602 @@
+// src/dashboard/server.ts
+import { serve } from "@hono/node-server";
+import { Hono } from "hono";
+
+// src/shared/logger.ts
+var LEVEL_PRIORITY = {
+  debug: 10,
+  info: 20,
+  warn: 30,
+  error: 40
+};
+var activeLevel = process.env.SYN_LOG_LEVEL ?? "info";
+function shouldLog(level) {
+  return LEVEL_PRIORITY[level] >= LEVEL_PRIORITY[activeLevel];
+}
+function emit(level, msg, ...args) {
+  if (!shouldLog(level)) return;
+  const stream = level === "error" || level === "warn" ? process.stderr : process.stdout;
+  stream.write(`[syn] ${msg}${args.length ? " " + args.map(String).join(" ") : ""}
+`);
+}
+var log = {
+  debug: (m, ...a) => emit("debug", m, ...a),
+  info: (m, ...a) => emit("info", m, ...a),
+  warn: (m, ...a) => emit("warn", m, ...a),
+  error: (m, ...a) => emit("error", m, ...a)
+};
+
+// src/server/port.ts
+import { createServer } from "net";
+var PORT_RANGE_START = 8080;
+var PORT_RANGE_END = 8099;
+async function findFreePort(start = PORT_RANGE_START, end = PORT_RANGE_END) {
+  for (let port = start; port <= end; port++) {
+    if (await isFree(port)) return port;
+  }
+  throw new Error(`Synthra: no free port in ${start}-${end}`);
+}
+function isFree(port) {
+  return new Promise((resolve) => {
+    const s = createServer();
+    s.once("error", () => resolve(false));
+    s.once("listening", () => s.close(() => resolve(true)));
+    s.listen(port, "127.0.0.1");
+  });
+}
+
+// src/dashboard/delta.ts
+import { readFile as readFile2 } from "fs/promises";
+
+// src/shared/paths.ts
+import { join } from "path";
+function resolvePaths(projectRoot) {
+  const graphDir = join(projectRoot, ".synthra-graph");
+  const contextDir = join(projectRoot, ".synthra");
+  const claudeDir = join(projectRoot, ".claude");
+  return {
+    projectRoot,
+    graphDir,
+    contextDir,
+    infoGraph: join(graphDir, "info_graph.json"),
+    symbolIndex: join(graphDir, "symbol_index.json"),
+    sessionState: join(graphDir, "session.json"),
+    activityLog: join(graphDir, "activity.jsonl"),
+    tokenLog: join(graphDir, "token_log.jsonl"),
+    gateLog: join(graphDir, "gate_log.jsonl"),
+    mcpPort: join(graphDir, "mcp_port"),
+    mcpServerLog: join(graphDir, "mcp_server.log"),
+    mcpServerErrLog: join(graphDir, "mcp_server.err.log"),
+    contextStore: join(contextDir, "context-store.json"),
+    contextMd: join(contextDir, "CONTEXT.md"),
+    branchesDir: join(contextDir, "branches"),
+    claudeDir,
+    claudeSettings: join(claudeDir, "settings.local.json"),
+    claudeHooksDir: join(claudeDir, "hooks"),
+    claudeMd: join(projectRoot, "CLAUDE.md"),
+    gitignore: join(projectRoot, ".gitignore")
+  };
+}
+
+// src/shared/pricing.ts
+var PRICING = {
+  // Opus-class models — premium tier
+  "claude-opus-4-7": { input: 15, output: 75, cacheRead: 1.5, cacheCreate: 18.75 },
+  "claude-opus-4-6": { input: 15, output: 75, cacheRead: 1.5, cacheCreate: 18.75 },
+  "claude-opus-4-5": { input: 15, output: 75, cacheRead: 1.5, cacheCreate: 18.75 },
+  // Sonnet-class — workhorse
+  "claude-sonnet-4-6": { input: 3, output: 15, cacheRead: 0.3, cacheCreate: 3.75 },
+  "claude-sonnet-4-5": { input: 3, output: 15, cacheRead: 0.3, cacheCreate: 3.75 },
+  // Haiku-class — fast and cheap
+  "claude-haiku-4-5": { input: 1, output: 5, cacheRead: 0.1, cacheCreate: 1.25 }
+};
+var FALLBACK = { input: 3, output: 15, cacheRead: 0.3, cacheCreate: 3.75 };
+function pricingFor(model) {
+  if (!model) return FALLBACK;
+  const direct = PRICING[model];
+  if (direct) return direct;
+  if (model.includes("opus")) return PRICING["claude-opus-4-7"] ?? FALLBACK;
+  if (model.includes("sonnet")) return PRICING["claude-sonnet-4-6"] ?? FALLBACK;
+  if (model.includes("haiku")) return PRICING["claude-haiku-4-5"] ?? FALLBACK;
+  return FALLBACK;
+}
+function estimateCostUsd(usage) {
+  const p = pricingFor(usage.model);
+  return usage.input_tokens / 1e6 * p.input + usage.output_tokens / 1e6 * p.output + (usage.cache_read_input_tokens ?? 0) / 1e6 * p.cacheRead + (usage.cache_creation_input_tokens ?? 0) / 1e6 * p.cacheCreate;
+}
+
+// src/shared/project-registry.ts
+import { mkdir, readFile, writeFile } from "fs/promises";
+import { homedir } from "os";
+import { basename, dirname, join as join2 } from "path";
+var REGISTRY_DIR = join2(homedir(), ".synthra");
+var REGISTRY_PATH = join2(REGISTRY_DIR, "projects.json");
+var SCHEMA_VERSION = 1;
+async function readRegistry() {
+  try {
+    const raw = await readFile(REGISTRY_PATH, "utf8");
+    const parsed = JSON.parse(raw);
+    if (!Array.isArray(parsed.projects)) return { schema_version: SCHEMA_VERSION, projects: [] };
+    return { schema_version: parsed.schema_version ?? SCHEMA_VERSION, projects: parsed.projects };
+  } catch {
+    return { schema_version: SCHEMA_VERSION, projects: [] };
+  }
+}
+async function listProjects() {
+  const registry = await readRegistry();
+  return registry.projects.slice().sort((a, b) => a.last_seen > b.last_seen ? -1 : a.last_seen < b.last_seen ? 1 : 0);
+}
+
+// src/dashboard/delta.ts
+var AVG_TOKENS_PER_BLOCKED_GREP = 500;
+async function readJsonl(path) {
+  try {
+    const text = await readFile2(path, "utf8");
+    return text.split(/\r?\n/).filter((l) => l.length > 0).map((l) => {
+      try {
+        return JSON.parse(l);
+      } catch {
+        return null;
+      }
+    }).filter((v) => v !== null);
+  } catch {
+    return [];
+  }
+}
+function basename2(p) {
+  const parts = p.split(/[\\/]/);
+  return parts[parts.length - 1] || p;
+}
+function summarize(p) {
+  let totalIn = 0;
+  let totalOut = 0;
+  let totalCacheRead = 0;
+  let totalCacheCreate = 0;
+  let costUsd = 0;
+  const models = {};
+  for (const t of p.tokens) {
+    totalIn += t.input_tokens ?? 0;
+    totalOut += t.output_tokens ?? 0;
+    totalCacheRead += t.cache_read_input_tokens ?? 0;
+    totalCacheCreate += t.cache_creation_input_tokens ?? 0;
+    costUsd += estimateCostUsd(t);
+    if (t.model) models[t.model] = (models[t.model] ?? 0) + 1;
+  }
+  const blocked = p.gates.filter((g) => g.decision === "block").length;
+  const saved = blocked * AVG_TOKENS_PER_BLOCKED_GREP;
+  return {
+    path: p.path,
+    name: p.name,
+    last_seen: p.last_seen,
+    total_turns: p.tokens.length,
+    total_input_tokens: totalIn,
+    total_output_tokens: totalOut,
+    total_cache_read: totalCacheRead,
+    total_cache_create: totalCacheCreate,
+    total_gate_calls: p.gates.length,
+    blocked_count: blocked,
+    estimated_tokens_saved: saved,
+    estimated_cost_usd: Math.round(costUsd * 100) / 100,
+    models
+  };
+}
+async function loadProjectFiles(path, name, lastSeen) {
+  const paths = resolvePaths(path);
+  const [rawTokens, gates] = await Promise.all([
+    readJsonl(paths.tokenLog),
+    readJsonl(paths.gateLog)
+  ]);
+  return { path, name, last_seen: lastSeen, tokens: dedupeTokens(rawTokens), gates };
+}
+function dedupeTokens(entries) {
+  const score = (model) => {
+    if (!model) return 0;
+    if (model === "<synthetic>") return 1;
+    return 2;
+  };
+  const groups = /* @__PURE__ */ new Map();
+  for (const e of entries) {
+    const ts = e.ts ?? e.written_at ?? "";
+    const second = ts.slice(0, 19);
+    const key = [
+      e.project ?? "",
+      e.input_tokens ?? 0,
+      e.output_tokens ?? 0,
+      e.cache_creation_input_tokens ?? 0,
+      e.cache_read_input_tokens ?? 0,
+      second
+    ].join("|");
+    const arr = groups.get(key) ?? [];
+    arr.push(e);
+    groups.set(key, arr);
+  }
+  const out = [];
+  for (const arr of groups.values()) {
+    if (arr.length === 1) {
+      out.push(arr[0]);
+      continue;
+    }
+    arr.sort((a, b) => score(b.model) - score(a.model));
+    out.push(arr[0]);
+  }
+  out.sort((a, b) => {
+    const at = a.ts ?? a.written_at ?? "";
+    const bt = b.ts ?? b.written_at ?? "";
+    return at.localeCompare(bt);
+  });
+  return out;
+}
+async function computeDashboardData(activePaths, recentN = 25) {
+  const registered = await listProjects();
+  const activePath = activePaths.projectRoot;
+  const activeName = basename2(activePath);
+  const knownPaths = new Set(registered.map((p) => p.path));
+  const allEntries = [
+    ...registered.map((p) => ({ path: p.path, name: p.name, last_seen: p.last_seen }))
+  ];
+  if (!knownPaths.has(activePath)) {
+    allEntries.unshift({ path: activePath, name: activeName, last_seen: null });
+  }
+  const loaded = await Promise.all(
+    allEntries.map((e) => loadProjectFiles(e.path, e.name, e.last_seen))
+  );
+  const projects = loaded.map(summarize).sort((a, b) => b.total_input_tokens + b.total_output_tokens - (a.total_input_tokens + a.total_output_tokens));
+  const activeFiles = loaded.find((p) => p.path === activePath) ?? {
+    path: activePath,
+    name: activeName,
+    last_seen: null,
+    tokens: [],
+    gates: []
+  };
+  const activeStats = summarize(activeFiles);
+  let g_in = 0, g_out = 0, g_cr = 0, g_cc = 0, g_gate = 0, g_block = 0, g_cost = 0, g_turns = 0;
+  for (const s of projects) {
+    g_turns += s.total_turns;
+    g_in += s.total_input_tokens;
+    g_out += s.total_output_tokens;
+    g_cr += s.total_cache_read;
+    g_cc += s.total_cache_create;
+    g_gate += s.total_gate_calls;
+    g_block += s.blocked_count;
+    g_cost += s.estimated_cost_usd;
+  }
+  const g_saved = g_block * AVG_TOKENS_PER_BLOCKED_GREP;
+  const g_used = g_in + g_out + g_cc;
+  const g_saved_pct = g_used + g_saved > 0 ? g_saved / (g_used + g_saved) * 100 : 0;
+  const allTurns = [];
+  const allGates = [];
+  for (const p of loaded) {
+    for (const t of p.tokens) {
+      allTurns.push({
+        // Fall back to written_at — the Stop hook today posts entries without
+        // a `ts` field, and the server tags them with written_at on receive.
+        ts: t.ts ?? t.written_at ?? "",
+        project_name: p.name,
+        project_path: p.path,
+        input: t.input_tokens ?? 0,
+        output: t.output_tokens ?? 0,
+        cache_read: t.cache_read_input_tokens ?? 0,
+        cache_create: t.cache_creation_input_tokens ?? 0,
+        model: t.model ?? "",
+        cost_usd: Math.round(estimateCostUsd(t) * 1e3) / 1e3
+      });
+    }
+    for (const gate of p.gates) {
+      allGates.push({
+        ts: gate.ts,
+        project_name: p.name,
+        project_path: p.path,
+        tool: gate.tool,
+        decision: gate.decision,
+        query: gate.query
+      });
+    }
+  }
+  allTurns.sort((a, b) => a.ts < b.ts ? 1 : a.ts > b.ts ? -1 : 0);
+  allGates.sort((a, b) => a.ts < b.ts ? 1 : a.ts > b.ts ? -1 : 0);
+  return {
+    active: {
+      project_root: activePath,
+      project_name: activeName,
+      stats: activeStats
+    },
+    global: {
+      project_count: projects.length,
+      total_turns: g_turns,
+      total_input_tokens: g_in,
+      total_output_tokens: g_out,
+      total_cache_read: g_cr,
+      total_cache_create: g_cc,
+      total_gate_calls: g_gate,
+      blocked_count: g_block,
+      estimated_tokens_saved: g_saved,
+      saved_percent: Math.round(g_saved_pct * 10) / 10,
+      estimated_cost_usd: Math.round(g_cost * 100) / 100
+    },
+    projects,
+    recent_turns: allTurns.slice(0, recentN),
+    recent_gates: allGates.slice(0, recentN)
+  };
+}
+
+// src/dashboard/public/index.html
+var public_default = `<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>Synthra \u2014 Token Dashboard</title>
+  <link rel="stylesheet" href="./style.css" />
+</head>
+<body>
+  <header>
+    <div class="brand">
+      <h1>Synthra</h1>
+      <span class="tag">Token Dashboard</span>
+    </div>
+    <div class="meta">
+      <span class="active-project" id="active-project">\u2026</span>
+      <span class="dot" id="dot"></span>
+      <span id="status">connecting\u2026</span>
+    </div>
+  </header>
+
+  <main>
+    <section>
+      <h2>Global totals  <span class="muted">(all projects)</span></h2>
+      <div class="cards" id="cards"></div>
+    </section>
+
+    <section>
+      <h2>Projects</h2>
+      <div class="projects" id="projects"></div>
+      <p class="empty hidden" id="projects-empty">No projects registered yet. Run <code>syn .</code> in any project to add it.</p>
+    </section>
+
+    <section>
+      <h2>Recent calls  <span class="muted">(across all projects)</span></h2>
+      <table id="turns">
+        <thead>
+          <tr>
+            <th>Time</th>
+            <th>Project</th>
+            <th>Model</th>
+            <th class="num">Input</th>
+            <th class="num">Output</th>
+            <th class="num">Cache R / W</th>
+            <th class="num">Cost</th>
+          </tr>
+        </thead>
+        <tbody></tbody>
+      </table>
+      <p class="empty hidden" id="turns-empty">No turns logged yet. Use Claude via the IDE extension or <code>claude</code> CLI while <code>syn .</code> is running.</p>
+    </section>
+
+    <section>
+      <h2>Recent gate decisions</h2>
+      <table id="gates">
+        <thead>
+          <tr>
+            <th>Time</th>
+            <th>Project</th>
+            <th>Tool</th>
+            <th>Decision</th>
+            <th>Query</th>
+          </tr>
+        </thead>
+        <tbody></tbody>
+      </table>
+      <p class="empty hidden" id="gates-empty">No gate decisions yet.</p>
+    </section>
+  </main>
+
+  <footer>
+    <span>Token Counter MCP \xB7 live polling every 2s</span>
+    <span class="muted">Cost figures are approximate \u2014 see /docs/PROTOCOL.md</span>
+  </footer>
+
+  <script>
+    const $ = (sel) => document.querySelector(sel);
+    const cardsEl = $("#cards");
+    const projectsEl = $("#projects");
+    const turnsBody = $("#turns tbody");
+    const gatesBody = $("#gates tbody");
+    const turnsEmpty = $("#turns-empty");
+    const gatesEmpty = $("#gates-empty");
+    const projectsEmpty = $("#projects-empty");
+    const statusEl = $("#status");
+    const dotEl = $("#dot");
+    const activeProjectEl = $("#active-project");
+
+    function fmt(n) {
+      if (typeof n !== "number" || !Number.isFinite(n)) return "0";
+      if (n >= 1_000_000) return (n / 1_000_000).toFixed(1) + "M";
+      if (n >= 1000) return (n / 1000).toFixed(1) + "K";
+      return n.toLocaleString();
+    }
+
+    function fmtFull(n) {
+      return (typeof n === "number" ? n : 0).toLocaleString();
+    }
+
+    function fmtCost(usd) {
+      if (typeof usd !== "number") return "~$0.00";
+      if (usd >= 1) return "~$" + usd.toFixed(2);
+      if (usd >= 0.01) return "~$" + usd.toFixed(3);
+      return "~$" + usd.toFixed(4);
+    }
+
+    function fmtTs(iso) {
+      try {
+        const d = new Date(iso);
+        const today = new Date();
+        const isToday = d.toDateString() === today.toDateString();
+        if (isToday) return d.toLocaleTimeString();
+        return d.toLocaleString();
+      } catch {
+        return iso;
+      }
+    }
+
+    function renderCards(g) {
+      cardsEl.innerHTML = "";
+      const cards = [
+        { label: "Total cost", value: fmtCost(g.estimated_cost_usd), accent: true },
+        { label: "Turns",        value: fmt(g.total_turns) },
+        { label: "Input",        value: fmt(g.total_input_tokens) },
+        { label: "Output",       value: fmt(g.total_output_tokens) },
+        { label: "Cache read",   value: fmt(g.total_cache_read) },
+        { label: "Cache write",  value: fmt(g.total_cache_create) },
+        { label: "Projects",     value: fmt(g.project_count) },
+        { label: "Blocked Grep / Glob", value: fmt(g.blocked_count), accent: true },
+        { label: "Tokens saved",        value: fmt(g.estimated_tokens_saved), accent: true },
+      ];
+      for (const c of cards) {
+        const el = document.createElement("div");
+        el.className = "card" + (c.accent ? " accent" : "");
+        el.innerHTML = '<div class="card-label">' + c.label + '</div><div class="card-value">' + c.value + '</div>';
+        cardsEl.appendChild(el);
+      }
+    }
+
+    function renderProjects(projects, globalCost) {
+      projectsEl.innerHTML = "";
+      if (!projects.length) {
+        projectsEmpty.classList.remove("hidden");
+        return;
+      }
+      projectsEmpty.classList.add("hidden");
+      const maxTokens = Math.max(1, ...projects.map((p) => p.total_input_tokens + p.total_output_tokens));
+      for (const p of projects) {
+        const total = p.total_input_tokens + p.total_output_tokens;
+        const pct = Math.round((total / maxTokens) * 100);
+        const sharePct = globalCost > 0 ? ((p.estimated_cost_usd / globalCost) * 100).toFixed(1) : "0.0";
+        const row = document.createElement("div");
+        row.className = "project-row";
+        row.innerHTML =
+          '<div class="project-name">' +
+            '<strong>' + p.name + '</strong>' +
+            '<code class="project-path">' + p.path + '</code>' +
+          '</div>' +
+          '<div class="project-stats">' +
+            '<div class="stat"><span class="stat-value cost">' + fmtCost(p.estimated_cost_usd) + '</span><span class="stat-label">cost (' + sharePct + '%)</span></div>' +
+            '<div class="stat"><span class="stat-value">' + fmt(total) + '</span><span class="stat-label">tokens</span></div>' +
+            '<div class="stat"><span class="stat-value">' + fmt(p.total_turns) + '</span><span class="stat-label">turns</span></div>' +
+            '<div class="stat"><span class="stat-value">' + fmt(p.blocked_count) + '</span><span class="stat-label">blocks</span></div>' +
+          '</div>' +
+          '<div class="bar"><div class="bar-fill" style="width:' + pct + '%"></div></div>';
+        projectsEl.appendChild(row);
+      }
+    }
+
+    function renderTurns(turns) {
+      turnsBody.innerHTML = "";
+      if (!turns.length) {
+        turnsEmpty.classList.remove("hidden");
+        return;
+      }
+      turnsEmpty.classList.add("hidden");
+      for (const t of turns) {
+        const tr = document.createElement("tr");
+        const modelCell =
+          t.model && t.model !== "<synthetic>"
+            ? "<code>" + t.model + "</code>"
+            : '<span class="muted">' + (t.model === "<synthetic>" ? "synthetic" : "unknown") + "</span>";
+        tr.innerHTML =
+          "<td>" + fmtTs(t.ts) + "</td>" +
+          "<td><code>" + t.project_name + "</code></td>" +
+          "<td>" + modelCell + "</td>" +
+          '<td class="num">' + fmtFull(t.input) + "</td>" +
+          '<td class="num">' + fmtFull(t.output) + "</td>" +
+          '<td class="num">' + fmt(t.cache_read) + " / " + fmt(t.cache_create) + "</td>" +
+          '<td class="num cost">' + fmtCost(t.cost_usd) + "</td>";
+        turnsBody.appendChild(tr);
+      }
+    }
+
+    function renderGates(gates) {
+      gatesBody.innerHTML = "";
+      if (!gates.length) {
+        gatesEmpty.classList.remove("hidden");
+        return;
+      }
+      gatesEmpty.classList.add("hidden");
+      for (const g of gates) {
+        const tr = document.createElement("tr");
+        const cls = g.decision === "block" ? "decision-block" : "decision-allow";
+        tr.innerHTML =
+          "<td>" + fmtTs(g.ts) + "</td>" +
+          "<td><code>" + g.project_name + "</code></td>" +
+          "<td><code>" + g.tool + "</code></td>" +
+          '<td class="' + cls + '">' + g.decision + "</td>" +
+          "<td><code>" + (g.query || "") + "</code></td>";
+        gatesBody.appendChild(tr);
+      }
+    }
+
+    async function tick() {
+      try {
+        const res = await fetch("/data");
+        if (!res.ok) throw new Error("HTTP " + res.status);
+        const data = await res.json();
+        activeProjectEl.textContent = data.active.project_root;
+        renderCards(data.global);
+        renderProjects(data.projects, data.global.estimated_cost_usd);
+        renderTurns(data.recent_turns);
+        renderGates(data.recent_gates);
+        statusEl.textContent = "live \xB7 " + new Date().toLocaleTimeString();
+        dotEl.classList.add("live");
+        dotEl.classList.remove("dead");
+      } catch (e) {
+        statusEl.textContent = "disconnected \xB7 " + e.message;
+        dotEl.classList.add("dead");
+        dotEl.classList.remove("live");
+      }
+    }
+
+    tick();
+    setInterval(tick, 2000);
+  </script>
+</body>
+</html>
+`;
+
+// src/dashboard/public/style.css
+var style_default = '/* Synthra token dashboard \u2014 palette per project brief. */\n\n:root {\n  --color-heading: #ECEBD8;\n  --color-body: #EDECD9;\n  --color-bg: #000000;\n  --color-surface: #140009;\n  --color-surface-raised: #1E000D;\n  --color-border: #4D0020;\n  --color-accent: #FF0073;\n  --color-accent-darker: #EB006A;\n  --color-form-bg: #2E0014;\n  --color-muted: rgba(237, 236, 217, 0.55);\n  --color-very-muted: rgba(237, 236, 217, 0.35);\n  --color-block: #FF0073;\n  --color-allow: #ECEBD8;\n}\n\n* {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\n\nhtml, body {\n  background: var(--color-bg);\n  color: var(--color-body);\n  font-family:\n    ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI",\n    system-ui, sans-serif;\n  font-size: 14px;\n  line-height: 1.5;\n  min-height: 100vh;\n}\n\ncode, .num, table, .project-path {\n  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;\n}\n\nheader {\n  display: flex;\n  align-items: center;\n  gap: 1.5rem;\n  padding: 1.1rem 2rem;\n  background: var(--color-surface);\n  border-bottom: 1px solid var(--color-border);\n}\n\nheader .brand {\n  display: flex;\n  align-items: baseline;\n  gap: 0.75rem;\n}\n\nheader h1 {\n  color: var(--color-heading);\n  font-size: 1.35rem;\n  font-weight: 700;\n  letter-spacing: 0.02em;\n}\n\nheader .tag {\n  color: var(--color-muted);\n  font-size: 0.78rem;\n  text-transform: uppercase;\n  letter-spacing: 0.1em;\n}\n\nheader .meta {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  font-size: 0.78rem;\n  font-family: ui-monospace, monospace;\n  color: var(--color-muted);\n}\n\nheader .active-project {\n  max-width: 480px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\nmain {\n  padding: 2rem;\n  display: flex;\n  flex-direction: column;\n  gap: 2rem;\n  max-width: 1400px;\n  margin: 0 auto;\n}\n\nsection {\n  display: flex;\n  flex-direction: column;\n  gap: 0.85rem;\n}\n\nh2 {\n  color: var(--color-heading);\n  font-size: 0.85rem;\n  font-weight: 600;\n  letter-spacing: 0.08em;\n  text-transform: uppercase;\n}\n\nh2 .muted {\n  color: var(--color-very-muted);\n  font-size: 0.78rem;\n  font-weight: 400;\n  letter-spacing: 0.06em;\n  text-transform: none;\n  margin-left: 0.5rem;\n}\n\n/* Cards row */\n.cards {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));\n  gap: 0.7rem;\n}\n\n.card {\n  background: var(--color-surface);\n  border: 1px solid var(--color-border);\n  border-radius: 6px;\n  padding: 0.85rem 1rem;\n}\n\n.card.accent {\n  background: var(--color-surface-raised);\n  border-color: var(--color-accent);\n}\n\n.card-label {\n  color: var(--color-muted);\n  font-size: 0.66rem;\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n  margin-bottom: 0.35rem;\n}\n\n.card-value {\n  color: var(--color-heading);\n  font-family: ui-monospace, monospace;\n  font-size: 1.5rem;\n  font-weight: 600;\n}\n\n.card.accent .card-value {\n  color: var(--color-accent);\n}\n\n/* Projects list */\n.projects {\n  display: flex;\n  flex-direction: column;\n  gap: 0.6rem;\n}\n\n.project-row {\n  display: grid;\n  grid-template-columns: minmax(220px, 1fr) auto;\n  grid-template-rows: auto auto;\n  gap: 0.6rem 1.25rem;\n  align-items: center;\n  background: var(--color-surface);\n  border: 1px solid var(--color-border);\n  border-radius: 6px;\n  padding: 0.9rem 1.2rem;\n}\n\n.project-row:hover {\n  background: var(--color-surface-raised);\n}\n\n.project-name {\n  display: flex;\n  flex-direction: column;\n  gap: 0.15rem;\n  overflow: hidden;\n}\n\n.project-name strong {\n  color: var(--color-heading);\n  font-size: 0.95rem;\n  font-weight: 600;\n}\n\n.project-name .project-path {\n  color: var(--color-very-muted);\n  font-size: 0.72rem;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.project-stats {\n  display: flex;\n  gap: 1.6rem;\n  justify-self: end;\n  text-align: right;\n}\n\n.stat {\n  display: flex;\n  flex-direction: column;\n  gap: 0.15rem;\n  min-width: 70px;\n}\n\n.stat-value {\n  color: var(--color-heading);\n  font-family: ui-monospace, monospace;\n  font-size: 0.95rem;\n  font-weight: 600;\n}\n\n.stat-value.cost {\n  color: var(--color-accent);\n}\n\n.stat-label {\n  color: var(--color-muted);\n  font-size: 0.66rem;\n  text-transform: uppercase;\n  letter-spacing: 0.08em;\n}\n\n.bar {\n  grid-column: 1 / -1;\n  height: 3px;\n  background: var(--color-form-bg);\n  border-radius: 2px;\n  overflow: hidden;\n}\n\n.bar-fill {\n  height: 100%;\n  background: linear-gradient(90deg, var(--color-accent-darker), var(--color-accent));\n  border-radius: 2px;\n  transition: width 400ms ease;\n}\n\n/* Tables */\ntable {\n  width: 100%;\n  border-collapse: collapse;\n  font-size: 0.83rem;\n  background: var(--color-surface);\n  border: 1px solid var(--color-border);\n  border-radius: 6px;\n  overflow: hidden;\n}\n\ntable thead th {\n  text-align: left;\n  color: var(--color-muted);\n  text-transform: uppercase;\n  font-size: 0.66rem;\n  letter-spacing: 0.08em;\n  font-weight: 600;\n  padding: 0.65rem 0.85rem;\n  border-bottom: 1px solid var(--color-border);\n  background: var(--color-surface);\n}\n\ntable thead th.num {\n  text-align: right;\n}\n\ntable tbody td {\n  padding: 0.55rem 0.85rem;\n  border-bottom: 1px solid rgba(77, 0, 32, 0.4);\n  color: var(--color-body);\n}\n\ntable tbody td.num {\n  text-align: right;\n}\n\ntable tbody td.cost {\n  color: var(--color-accent);\n  font-weight: 600;\n}\n\ntable tbody tr:last-child td {\n  border-bottom: none;\n}\n\ntable tbody tr:hover {\n  background: var(--color-surface-raised);\n}\n\ncode {\n  color: var(--color-heading);\n  background: var(--color-form-bg);\n  padding: 0.1rem 0.4rem;\n  border-radius: 3px;\n  font-size: 0.85em;\n}\n\n.decision-block {\n  color: var(--color-block);\n  font-weight: 700;\n  text-transform: uppercase;\n  font-size: 0.72rem;\n  letter-spacing: 0.06em;\n}\n\n.decision-allow {\n  color: var(--color-allow);\n  opacity: 0.7;\n  text-transform: uppercase;\n  font-size: 0.72rem;\n  letter-spacing: 0.06em;\n}\n\n.empty {\n  color: var(--color-muted);\n  font-style: italic;\n  padding: 1rem;\n  background: var(--color-surface);\n  border: 1px dashed var(--color-border);\n  border-radius: 6px;\n}\n\n.hidden {\n  display: none;\n}\n\nfooter {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 0.85rem 2rem;\n  background: var(--color-surface);\n  border-top: 1px solid var(--color-border);\n  color: var(--color-muted);\n  font-size: 0.72rem;\n  font-family: ui-monospace, monospace;\n}\n\nfooter .muted {\n  color: var(--color-very-muted);\n}\n\n.dot {\n  width: 8px;\n  height: 8px;\n  border-radius: 50%;\n  background: var(--color-muted);\n  transition: background 200ms ease, box-shadow 200ms ease;\n}\n\n.dot.live {\n  background: var(--color-accent);\n  box-shadow: 0 0 8px var(--color-accent-darker);\n}\n\n.dot.dead {\n  background: var(--color-border);\n  box-shadow: none;\n}\n';
+
+// src/dashboard/server.ts
+var FALLBACK_RANGE = 9;
+async function startDashboard(paths, preferredPort = 8901) {
+  const port = await findFreePort(preferredPort, preferredPort + FALLBACK_RANGE);
+  if (port !== preferredPort) {
+    log.info(
+      `dashboard port ${preferredPort} was busy \u2014 bound to ${port} instead (likely another dashboard from a coexisting tool).`
+    );
+  }
+  const app = new Hono();
+  app.get("/", (c) => c.html(public_default));
+  app.get("/style.css", (c) => {
+    c.header("Content-Type", "text/css; charset=utf-8");
+    c.header("Cache-Control", "no-cache");
+    return c.body(style_default);
+  });
+  app.get("/health", (c) => c.json({ ok: true }));
+  app.get("/data", async (c) => {
+    const data = await computeDashboardData(paths);
+    return c.json(data);
+  });
+  const nodeServer = serve({ fetch: app.fetch, port, hostname: "127.0.0.1" });
+  return {
+    port,
+    url: `http://127.0.0.1:${port}`,
+    async stop() {
+      await new Promise((resolve, reject) => {
+        nodeServer.close((err) => err ? reject(err) : resolve());
+      });
+    }
+  };
+}
+export {
+  startDashboard
+};
+//# sourceMappingURL=index.js.map