aipeek 0.2.1 → 0.2.2

package/dist/chunk-JOY7QP24.js

@@ -0,0 +1,1199 @@
+// src/server/plugin.ts
+import { Buffer } from "buffer";
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from "fs";
+import { dirname, resolve } from "path";
+import { fileURLToPath } from "url";
+import { transformSync } from "esbuild";
+
+// src/core/action.ts
+var TYPES = ["click", "fill", "press", "wait", "screenshot"];
+function resolveAction(type, args) {
+  if (!TYPES.includes(type))
+    return { valid: false, error: `unknown action: ${type}` };
+  const hasTarget = !!(args.sel || args.text);
+  switch (type) {
+    case "click":
+      return hasTarget ? { valid: true } : { valid: false, error: "click needs sel= or text=" };
+    case "fill":
+      if (!hasTarget)
+        return { valid: false, error: "fill needs sel= or text=" };
+      if (args.value === void 0)
+        return { valid: false, error: "fill needs value=" };
+      return { valid: true };
+    case "press":
+      return args.key ? { valid: true } : { valid: false, error: "press needs key=" };
+    case "wait":
+      return hasTarget ? { valid: true } : { valid: false, error: "wait needs sel= or text=" };
+    case "screenshot":
+      return { valid: true };
+    default:
+      return { valid: false, error: `unknown action: ${type}` };
+  }
+}
+
+// src/core/check.ts
+function check(raw) {
+  const consoleErrors = raw.console.filter((l) => l.level === "error");
+  const failedRequests = raw.network.filter((r) => r.status >= 400 || r.failed);
+  const assertions = [
+    {
+      name: "no-console-errors",
+      pass: consoleErrors.length === 0,
+      ...consoleErrors.length && { detail: consoleErrors[0].text }
+    },
+    {
+      name: "no-uncaught-errors",
+      pass: raw.errors.length === 0,
+      ...raw.errors.length && { detail: raw.errors[0].message }
+    },
+    {
+      name: "no-failed-requests",
+      pass: failedRequests.length === 0,
+      ...failedRequests.length && { detail: `${failedRequests[0].method} ${failedRequests[0].url} ${failedRequests[0].status}` }
+    },
+    {
+      name: "ui-not-empty",
+      pass: raw.ui.trim().length > 0,
+      ...!raw.ui.trim().length && { detail: "UI tree is empty" }
+    }
+  ];
+  return {
+    pass: assertions.every((a) => a.pass),
+    assertions
+  };
+}
+
+// src/core/util.ts
+function truncate(s, max) {
+  return s.length > max ? `${s.slice(0, max)}\u2026` : s;
+}
+function compactUrl(url, search) {
+  try {
+    const u = new URL(url);
+    if (search && u.search)
+      return `${u.pathname}?${truncate(u.search.slice(1), search)}`;
+    return u.pathname;
+  } catch {
+    return truncate(url, 80);
+  }
+}
+
+// src/core/compact.ts
+var SLOW_THRESHOLD = 1e3;
+var MAX_UI_DEPTH = 6;
+var UI_PRIMITIVES = /* @__PURE__ */ new Set([
+  "Button",
+  "Input",
+  "Label",
+  "Badge",
+  "Checkbox",
+  "Skeleton",
+  "Spinner",
+  "Switch",
+  "Tabs",
+  "Tooltip",
+  "Popover",
+  "Dialog",
+  "Select",
+  "Card",
+  "Table",
+  "Slider",
+  "Progress",
+  "RadioGroup",
+  "HoverCard",
+  "DropdownMenu",
+  "ContextMenu",
+  "Command",
+  "Form",
+  "Alert",
+  "Pagination",
+  "Textarea",
+  "TooltipProvider",
+  "DialogPortal",
+  "Router",
+  "RenderErrorBoundary",
+  "RouterProvider",
+  "RouterProvider2",
+  "PanelGroup",
+  "Panel"
+]);
+function nameOf(line) {
+  let end = 0;
+  while (end < line.length) {
+    const c = line[end];
+    if (c === " " || c === "	" || c === "[" || c === "\u2014")
+      break;
+    end++;
+  }
+  return line.slice(0, end);
+}
+function compactUI(tree) {
+  if (!tree)
+    return "";
+  const lines = tree.split("\n");
+  const result = [];
+  const repeatTracker = /* @__PURE__ */ new Map();
+  for (let i = 0; i < lines.length; i++) {
+    const line = lines[i];
+    const trimmed = line.trimStart();
+    if (!trimmed)
+      continue;
+    const indent = line.length - trimmed.length;
+    const depth = Math.floor(indent / 2);
+    if (depth > MAX_UI_DEPTH)
+      continue;
+    const componentName = nameOf(trimmed);
+    if (UI_PRIMITIVES.has(componentName))
+      continue;
+    const key = `${depth}:${componentName}`;
+    const tracker = repeatTracker.get(key);
+    if (tracker && i - tracker.lastIndex <= 2) {
+      tracker.count++;
+      tracker.lastIndex = i;
+      continue;
+    }
+    for (const [k, t] of repeatTracker) {
+      if (t.count > 1) {
+        const d = Number.parseInt(k.split(":")[0]);
+        const name = k.split(":").slice(1).join(":");
+        result.push(`${"  ".repeat(d)}${name} \xD7${t.count}`);
+      }
+      if (t.count > 1 || i - t.lastIndex > 2) {
+        repeatTracker.delete(k);
+      }
+    }
+    repeatTracker.set(key, { count: 1, lastIndex: i });
+    result.push(line);
+  }
+  for (const [k, t] of repeatTracker) {
+    if (t.count > 1) {
+      const d = Number.parseInt(k.split(":")[0]);
+      const name = k.split(":").slice(1).join(":");
+      result.push(`${"  ".repeat(d)}${name} \xD7${t.count}`);
+    }
+  }
+  return result.join("\n");
+}
+var NOISE_SUBSTRINGS = [
+  "[hmr]",
+  "[vite]",
+  "hot module",
+  "react-devtools",
+  "download the react devtools",
+  "warning: react does not recognize",
+  "source map",
+  "favicon.ico",
+  "webpack"
+];
+function compactConsole(logs) {
+  if (!logs.length)
+    return "";
+  const filtered = logs.filter((l) => {
+    const lower = l.text.toLowerCase();
+    return !NOISE_SUBSTRINGS.some((s) => lower.includes(s));
+  });
+  if (!filtered.length)
+    return "";
+  const deduped = [];
+  for (const log of filtered) {
+    const last = deduped[deduped.length - 1];
+    if (last && last.entry.text === log.text && last.entry.level === log.level) {
+      last.count++;
+    } else {
+      deduped.push({ entry: log, count: 1 });
+    }
+  }
+  const errors = deduped.filter((d) => d.entry.level === "error");
+  const warns = deduped.filter((d) => d.entry.level === "warn");
+  const rest = deduped.filter((d) => d.entry.level !== "error" && d.entry.level !== "warn");
+  const recentRest = rest.slice(-10);
+  const lines = [];
+  for (const group of [...errors, ...warns, ...recentRest]) {
+    const prefix = `[${group.entry.level}]`;
+    const count = group.count > 1 ? ` \xD7${group.count}` : "";
+    const source = group.entry.source ? ` (${group.entry.source})` : "";
+    const text = truncate(group.entry.text, 200);
+    lines.push(`${prefix}${count} ${text}${source}`);
+  }
+  return lines.join("\n");
+}
+function compactNetwork(requests) {
+  if (!requests.length)
+    return "";
+  const relevant = requests.filter(
+    (r) => r.resourceType === "fetch" || r.resourceType === "xhr" || r.resourceType === "websocket" || r.resourceType === "eventsource" || isApiUrl(r.url)
+  );
+  if (!relevant.length)
+    return "";
+  const lines = [];
+  for (const req of relevant) {
+    const duration = req.duration > 0 ? ` ${formatDuration(req.duration)}` : "";
+    const slow = req.duration >= SLOW_THRESHOLD ? " [SLOW]" : "";
+    const url = compactUrl(req.url, 50);
+    const headers = diagnosticHeaders(req);
+    if (req.failed || req.status >= 400) {
+      const body = req.responseBody ? ` "${truncate(req.responseBody, 100)}"` : "";
+      const failure = req.failureText ? ` (${req.failureText})` : "";
+      lines.push(`${req.method} ${url} ${req.status}${failure}${body}${headers}${duration}${slow}`);
+    } else {
+      lines.push(`${req.method} ${url} ${req.status}${headers}${duration}${slow}`);
+    }
+  }
+  return lines.join("\n");
+}
+function isApiUrl(url) {
+  try {
+    const u = new URL(url);
+    return u.pathname.startsWith("/api") || u.pathname.includes("/graphql");
+  } catch {
+    return false;
+  }
+}
+var DIAGNOSTIC_HEADERS = ["content-type", "x-error", "www-authenticate", "access-control-allow-origin"];
+function diagnosticHeaders(req) {
+  const h = req.responseHeaders;
+  if (!h)
+    return "";
+  const parts = [];
+  for (const key of DIAGNOSTIC_HEADERS) {
+    const val = h[key];
+    if (!val)
+      continue;
+    if (key === "content-type" && req.status < 400 && val.includes("application/json"))
+      continue;
+    parts.push(`${key}: ${truncate(val, 60)}`);
+  }
+  if (!parts.length)
+    return "";
+  return ` [${parts.join(", ")}]`;
+}
+function formatDuration(ms) {
+  return ms >= 1e3 ? `${(ms / 1e3).toFixed(1)}s` : `${Math.round(ms)}ms`;
+}
+function compactErrors(errors) {
+  if (!errors.length)
+    return "";
+  const seen = /* @__PURE__ */ new Map();
+  for (const err of errors) {
+    if (!seen.has(err.message)) {
+      seen.set(err.message, err);
+    }
+  }
+  const lines = [];
+  for (const err of seen.values()) {
+    lines.push(err.message);
+    if (err.stack) {
+      const frames = filterStack(err.stack);
+      for (const frame of frames) {
+        lines.push(`  at ${frame}`);
+      }
+    }
+  }
+  return lines.join("\n");
+}
+function filterStack(stack) {
+  return stack.split("\n").map((l) => l.trim()).filter((l) => l.startsWith("at ")).map((l) => l.slice(3)).filter((l) => !l.includes("node_modules") && !l.includes("<anonymous>")).slice(0, 5);
+}
+function compactState(state) {
+  if (!state || !Object.keys(state).length)
+    return "";
+  const lines = [];
+  for (const [name, value] of Object.entries(state)) {
+    lines.push(`${name}:`);
+    if (typeof value === "object" && value !== null) {
+      for (const [k, v] of Object.entries(value)) {
+        lines.push(`  ${k}: ${formatValue(v)}`);
+      }
+    } else {
+      lines.push(`  ${String(value)}`);
+    }
+  }
+  return lines.join("\n");
+}
+function formatValue(v) {
+  if (v === null || v === void 0)
+    return String(v);
+  if (typeof v === "string")
+    return v;
+  if (typeof v === "number" || typeof v === "boolean")
+    return String(v);
+  if (typeof v === "object") {
+    const s = JSON.stringify(v);
+    return s.length > 120 ? `${s.slice(0, 120)}\u2026` : s;
+  }
+  return String(v);
+}
+function compact(raw) {
+  return {
+    url: raw.url,
+    ui: compactUI(raw.ui),
+    console: compactConsole(raw.console),
+    network: compactNetwork(raw.network),
+    errors: compactErrors(raw.errors),
+    state: compactState(raw.state),
+    timestamp: raw.timestamp,
+    counts: {
+      console: raw.console.length,
+      network: raw.network.length,
+      errors: raw.errors.length,
+      state: Object.keys(raw.state).length
+    }
+  };
+}
+
+// src/core/detail.ts
+function detail(raw, section, index, full) {
+  switch (section) {
+    case "ui":
+      return full ? raw.ui || null : compactUI(raw.ui) || null;
+    case "console":
+      return detailConsole(raw.console, index, full);
+    case "network":
+      return detailNetwork(raw.network, index, full);
+    case "errors":
+      return detailError(raw.errors, index, full);
+    case "state":
+      return detailState(raw.state, index, full);
+    default:
+      return null;
+  }
+}
+function detailConsole(logs, index, full) {
+  if (index === void 0) {
+    if (!logs.length)
+      return "(empty)";
+    return logs.map((log2, i2) => `[${i2}] [${log2.level}] ${truncate(log2.text, 120)}`).join("\n");
+  }
+  const i = Number.parseInt(index);
+  if (Number.isNaN(i) || i < 0 || i >= logs.length)
+    return null;
+  const log = logs[i];
+  if (full) {
+    const parts = [`[${log.level}] ${log.text}`];
+    if (log.timestamp)
+      parts.push(`timestamp: ${new Date(log.timestamp).toISOString()}`);
+    if (log.source)
+      parts.push(`source: ${log.source}`);
+    return parts.join("\n");
+  }
+  return `[${log.level}] ${truncate(log.text, 200)}`;
+}
+function detailNetwork(requests, index, full) {
+  if (index === void 0) {
+    if (!requests.length)
+      return "(empty)";
+    return requests.map((req2, i2) => `[${i2}] ${req2.method} ${req2.status} ${truncate(req2.url, 80)} ${req2.duration}ms${req2.failed ? " FAILED" : ""}`).join("\n");
+  }
+  const i = Number.parseInt(index);
+  if (Number.isNaN(i) || i < 0 || i >= requests.length)
+    return null;
+  const req = requests[i];
+  const lines = [
+    `${req.method} ${req.url}`,
+    `status: ${req.status}`,
+    `duration: ${req.duration}ms`,
+    `type: ${req.resourceType}`
+  ];
+  if (req.failed)
+    lines.push(`failed: ${req.failureText || "true"}`);
+  if (full) {
+    if (req.requestHeaders && Object.keys(req.requestHeaders).length) {
+      lines.push("request-headers:");
+      for (const [k, v] of Object.entries(req.requestHeaders)) lines.push(`  ${k}: ${v}`);
+    }
+    if (req.requestBody)
+      lines.push(`request-body:
+${req.requestBody}`);
+    if (req.responseHeaders && Object.keys(req.responseHeaders).length) {
+      lines.push("response-headers:");
+      for (const [k, v] of Object.entries(req.responseHeaders)) lines.push(`  ${k}: ${v}`);
+    }
+    if (req.responseBody)
+      lines.push(`response-body:
+${req.responseBody}`);
+  } else {
+    if (req.requestBody) {
+      lines.push(`request-body: ${byteSize(req.requestBody)}`);
+      if (req.requestSample) {
+        const schema = jsonSchema(req.requestSample);
+        if (schema)
+          lines.push(schema);
+      }
+    }
+    if (req.responseBody) {
+      if (req.status >= 400) {
+        lines.push(`response-body: ${byteSize(req.responseBody)} "${truncate(req.responseBody, 100)}"`);
+      } else {
+        if (req.responseSample) {
+          lines.push(`response-body: ${byteSize(req.responseBody)}`);
+          const schema = jsonSchema(req.responseSample);
+          if (schema)
+            lines.push(schema);
+        } else {
+          lines.push(`response-body: ${byteSize(req.responseBody)} ${truncate(req.responseBody, 100)}`);
+        }
+      }
+    }
+  }
+  return lines.join("\n");
+}
+function detailError(errors, index, full) {
+  if (index === void 0) {
+    if (!errors.length)
+      return "(empty)";
+    return errors.map((err2, i2) => `[${i2}] ${truncate(err2.message, 120)}`).join("\n");
+  }
+  const i = Number.parseInt(index);
+  if (Number.isNaN(i) || i < 0 || i >= errors.length)
+    return null;
+  const err = errors[i];
+  if (full) {
+    const lines2 = [err.message];
+    if (err.stack)
+      lines2.push(err.stack);
+    if (err.source)
+      lines2.push(`source: ${err.source}`);
+    if (err.line != null)
+      lines2.push(`location: ${err.source || ""}:${err.line}:${err.column ?? 0}`);
+    return lines2.join("\n");
+  }
+  const lines = [err.message];
+  if (err.stack) {
+    const appFrames = err.stack.split("\n").map((l) => l.trim()).filter((l) => l.startsWith("at ") && !l.includes("node_modules")).slice(0, 3);
+    if (appFrames.length)
+      lines.push(...appFrames);
+    const totalApp = err.stack.split("\n").filter((l) => l.trim().startsWith("at ") && !l.includes("node_modules")).length;
+    if (totalApp > 3)
+      lines.push(`  ... ${totalApp - 3} more app frames`);
+  }
+  if (err.line != null)
+    lines.push(`location: ${err.source || ""}:${err.line}:${err.column ?? 0}`);
+  return lines.join("\n");
+}
+function detailState(state, name, full) {
+  if (!name) {
+    const keys = Object.keys(state);
+    if (!keys.length)
+      return "(empty)";
+    return keys.map((k) => `${k}: ${formatSummaryValue(state[k])}`).join("\n");
+  }
+  if (!(name in state))
+    return null;
+  const value = state[name];
+  if (full) {
+    try {
+      return JSON.stringify(value, null, 2);
+    } catch {
+      return String(value);
+    }
+  }
+  if (typeof value !== "object" || value === null)
+    return `${name}: ${typeof value}`;
+  const lines = [];
+  for (const [k, v] of Object.entries(value)) {
+    lines.push(`${k}: ${formatSummaryValue(v)}`);
+  }
+  return lines.join("\n");
+}
+function isArraySentinel(v) {
+  if (!v.startsWith("Array(") || !v.endsWith(")"))
+    return false;
+  const digits = v.slice(6, -1);
+  return digits.length > 0 && [...digits].every((c) => c >= "0" && c <= "9");
+}
+function formatSummaryValue(v) {
+  if (v === null || v === void 0)
+    return String(v);
+  if (typeof v === "string") {
+    if (isArraySentinel(v))
+      return v;
+    return v.length > 80 ? `${v.slice(0, 80)}\u2026` : v;
+  }
+  if (typeof v === "number" || typeof v === "boolean")
+    return String(v);
+  if (typeof v === "object") {
+    const s = JSON.stringify(v);
+    return s.length > 80 ? `${s.slice(0, 80)}\u2026` : s;
+  }
+  return String(v);
+}
+function jsonSchema(sample) {
+  try {
+    return schemaOf(JSON.parse(sample), 0);
+  } catch {
+    return null;
+  }
+}
+function schemaOf(v, d) {
+  if (v === null)
+    return "null";
+  if (typeof v === "string")
+    return "string";
+  if (typeof v === "number")
+    return "number";
+  if (typeof v === "boolean")
+    return "boolean";
+  if (Array.isArray(v)) {
+    if (!v.length)
+      return "[]";
+    if (d >= 3)
+      return "[\u2026]";
+    return `${schemaOf(v[0], d + 1)}[]`;
+  }
+  if (typeof v === "object") {
+    if (d >= 3)
+      return "{\u2026}";
+    const entries = Object.entries(v);
+    if (!entries.length)
+      return "{}";
+    const max = d === 0 ? 12 : 6;
+    const fields = entries.slice(0, max).map(([k, val]) => `${k}: ${schemaOf(val, d + 1)}`);
+    if (entries.length > max)
+      fields.push(`\u2026 ${entries.length - max} more`);
+    return `{ ${fields.join(", ")} }`;
+  }
+  return typeof v;
+}
+function byteSize(s) {
+  const bytes = new TextEncoder().encode(s).length;
+  if (bytes < 1024)
+    return `${bytes}B`;
+  if (bytes < 1024 * 1024)
+    return `${(bytes / 1024).toFixed(1)}KB`;
+  return `${(bytes / (1024 * 1024)).toFixed(1)}MB`;
+}
+
+// src/core/diff.ts
+function diffState(prev, curr) {
+  if (!prev) {
+    return {
+      newErrors: curr.console.filter((l) => l.level === "error"),
+      newExceptions: [...curr.errors],
+      newFailedRequests: curr.network.filter((r) => r.status >= 400 || r.failed),
+      uiGone: false,
+      clean: curr.console.filter((l) => l.level === "error").length === 0 && curr.errors.length === 0 && curr.network.filter((r) => r.status >= 400 || r.failed).length === 0
+    };
+  }
+  const prevErrorTexts = new Set(prev.console.filter((l) => l.level === "error").map((l) => l.text));
+  const newErrors = curr.console.filter((l) => l.level === "error" && !prevErrorTexts.has(l.text));
+  const prevExceptionMsgs = new Set(prev.errors.map((e) => e.message));
+  const newExceptions = curr.errors.filter((e) => !prevExceptionMsgs.has(e.message));
+  const prevFailedKeys = new Set(
+    prev.network.filter((r) => r.status >= 400 || r.failed).map((r) => `${r.method}|${r.url}|${r.status}`)
+  );
+  const newFailedRequests = curr.network.filter((r) => r.status >= 400 || r.failed).filter((r) => !prevFailedKeys.has(`${r.method}|${r.url}|${r.status}`));
+  const uiGone = prev.ui.trim().length > 0 && curr.ui.trim().length === 0;
+  return {
+    newErrors,
+    newExceptions,
+    newFailedRequests,
+    uiGone,
+    clean: newErrors.length === 0 && newExceptions.length === 0 && newFailedRequests.length === 0 && !uiGone
+  };
+}
+
+// src/core/emit.ts
+import pc from "picocolors";
+var SECTIONS = ["ui", "console", "network", "errors", "state"];
+var COUNTED_SECTIONS = {
+  console: "console",
+  network: "network",
+  errors: "errors",
+  state: "state"
+};
+function emit(state) {
+  const sections = [];
+  for (const key of SECTIONS) {
+    if (state[key]) {
+      const countKey = COUNTED_SECTIONS[key];
+      const count = countKey ? state.counts?.[countKey] ?? 0 : 0;
+      const attr = count ? ` count="${count}"` : "";
+      sections.push(`<${key}${attr}>
+${state[key]}
+</${key}>`);
+    }
+  }
+  if (!sections.length) {
+    sections.push("<empty/>");
+  }
+  return `<aipeek url="${state.url}">
+
+${sections.join("\n\n")}
+
+</aipeek>
+
+detail: GET /__aipeek/{section}/{index}?full`;
+}
+function emitSummary(raw) {
+  const consoleErrors = raw.console.filter((l) => l.level === "error");
+  const consoleWarns = raw.console.filter((l) => l.level === "warn");
+  const failedReqs = raw.network.filter((r) => r.status >= 400 || r.failed);
+  const hasIssues = consoleErrors.length > 0 || raw.errors.length > 0 || failedReqs.length > 0;
+  const lines = [];
+  if (raw.ui.trim()) {
+    lines.push(`ui: ${summarizeUI(raw.ui)}`);
+  }
+  if (raw.console.length) {
+    if (consoleErrors.length || consoleWarns.length) {
+      const parts = [];
+      for (const e of consoleErrors) parts.push(`  [error] ${truncate(e.text, 150)}`);
+      for (const w of consoleWarns) parts.push(`  [warn] ${truncate(w.text, 150)}`);
+      const rest = raw.console.length - consoleErrors.length - consoleWarns.length;
+      if (rest > 0)
+        parts.push(`  \u2026 ${rest} more`);
+      lines.push(`console (${raw.console.length}):`);
+      lines.push(...parts);
+    } else {
+      lines.push(`console: ${raw.console.length} logs`);
+    }
+  }
+  if (raw.network.length) {
+    if (failedReqs.length) {
+      lines.push(`network (${raw.network.length}):`);
+      for (const r of failedReqs) {
+        const body = r.responseBody ? ` "${truncate(r.responseBody, 80)}"` : "";
+        lines.push(`  ${r.method} ${compactUrl(r.url)} ${r.status}${body}`);
+      }
+      const ok = raw.network.length - failedReqs.length;
+      if (ok > 0)
+        lines.push(`  \u2026 ${ok} ok`);
+    } else {
+      lines.push(`network: ${raw.network.length} ok`);
+    }
+  }
+  if (raw.errors.length) {
+    lines.push(`errors (${raw.errors.length}):`);
+    for (const e of raw.errors) lines.push(`  ${truncate(e.message, 150)}`);
+  }
+  const storeNames = Object.keys(raw.state);
+  if (storeNames.length) {
+    const parts = storeNames.map((n) => {
+      const v = raw.state[n];
+      const keys = typeof v === "object" && v !== null ? Object.keys(v).length : 0;
+      return keys > 0 ? `${n}(${keys})` : n;
+    });
+    lines.push(`state: ${parts.join(", ")}`);
+  }
+  if (!lines.length)
+    return "<aipeek>empty</aipeek>";
+  const status = hasIssues ? `${consoleErrors.length + raw.errors.length + failedReqs.length} issues` : "ok";
+  return `<aipeek url="${raw.url}" status="${status}">
+${lines.join("\n")}
+</aipeek>${hasIssues ? "\n\ndetail: GET /__aipeek/{section}/{index}" : ""}`;
+}
+function summarizeUI(tree) {
+  const components = [];
+  const counts = /* @__PURE__ */ new Map();
+  for (const line of tree.split("\n")) {
+    const trimmed = line.trimStart();
+    if (!trimmed)
+      continue;
+    const indent = line.length - trimmed.length;
+    if (indent > 2)
+      continue;
+    const name = nameOf(trimmed);
+    if (!name)
+      continue;
+    const focused = trimmed.includes("[focused]");
+    const generating = trimmed.includes("[generating]");
+    const loading = trimmed.includes("[loading]");
+    const existing = counts.get(name) || 0;
+    if (existing > 0) {
+      counts.set(name, existing + 1);
+      continue;
+    }
+    counts.set(name, 1);
+    let label = name;
+    if (focused)
+      label += "[focused]";
+    if (generating)
+      label += "[generating]";
+    if (loading)
+      label += "[loading]";
+    components.push(label);
+  }
+  const result = components.map((c) => {
+    const name = c.split("[")[0];
+    const count = counts.get(name) || 1;
+    return count > 1 ? `${c}(\xD7${count})` : c;
+  });
+  return result.join(", ") || "empty";
+}
+function emitCheck(result) {
+  const lines = result.assertions.map(
+    (a) => a.pass ? `\u2713 ${a.name}` : `\u2717 ${a.name}${a.detail ? `: ${a.detail}` : ""}`
+  );
+  return `<aipeek-check pass="${result.pass}">
+${lines.join("\n")}
+</aipeek-check>`;
+}
+function emitDiff(diff) {
+  const issues = [];
+  for (const e of diff.newErrors) issues.push(pc.red(`  [error] ${e.text}`));
+  for (const e of diff.newExceptions) issues.push(pc.red(`  [exception] ${e.message}`));
+  for (const r of diff.newFailedRequests) issues.push(pc.yellow(`  [network] ${r.method} ${r.url} ${r.status}`));
+  if (diff.uiGone)
+    issues.push(pc.magenta("  [ui] component tree disappeared"));
+  if (!issues.length)
+    return "";
+  const count = issues.length;
+  return `${pc.bold("[aipeek]")} ${pc.red(`\u2717 ${count} issue${count > 1 ? "s" : ""} after HMR`)}
+${issues.join("\n")}`;
+}
+
+// src/server/plugin.ts
+function readBody(req) {
+  return new Promise((resolve2) => {
+    let s = "";
+    req.on("data", (c) => s += c);
+    req.on("end", () => resolve2(s));
+  });
+}
+var __dirname2 = dirname(fileURLToPath(import.meta.url));
+var clientPath = resolve(__dirname2, "../client/client.ts");
+var patchPath = resolve(__dirname2, "../client/client-patch.ts");
+function compilePatch() {
+  const source = readFileSync(patchPath, "utf-8");
+  const result = transformSync(source, {
+    loader: "ts",
+    target: "es2020",
+    format: "iife",
+    minify: false
+  });
+  return result.code;
+}
+function aipeekSnippet(port) {
+  const base = `http://localhost:${port}/__aipeek`;
+  return `
+# aipeek \u2014 Runtime Browser Inspector
+
+IMPORTANT: Before debugging any UI issue, visual bug, or runtime error, ALWAYS fetch the live app state first. Do NOT guess \u2014 look at the actual browser state.
+
+## Read state \u2014 cheapest first
+
+\`\`\`bash
+curl ${base}/screen   # state-machine projection {view, modal, focus, knobs} \u2014 START HERE
+curl ${base}/ui                  # React component tree \u2014 deep-dive when /screen isn't enough
+curl '${base}/dom?scope=ChatInput' # semantic DOM scoped to a component \u2014 UI as text, src locations
+curl ${base}          # high-density summary (ok sections \u2192 1 line, issues \u2192 expanded)
+curl ${base}?full     # full dump: UI tree + console + network + errors + state
+curl ${base}/check    # pass/fail health check \u2014 use after code changes
+curl ${base}/console  # console logs (errors, warnings, info)
+curl ${base}/network  # fetch/XHR requests with status and timing
+curl ${base}/errors   # uncaught errors and unhandled rejections
+curl ${base}/state    # registered store snapshots
+\`\`\`
+
+\`/screen\` projects the whole UI to a few state variables \u2014 start there, not \`/ui\`. Append
+\`?full\` for untruncated output. Append \`/{index}\` for a specific item's detail.
+
+To inspect or edit a component, work top-down \u2014 the full DOM is huge, a scoped view is
+accurate: \`/screen\` or \`/ui\` to find the component, then \`/dom?scope=<Name>\` (matches the
+source path) or \`/dom?sel=<css>\` for just that subtree. Each line carries its source
+location (\`@File.tsx:line\`), so the DOM view tells you exactly where to edit.
+
+## Drive the page (acts on the currently-open tab \u2014 no separate browser)
+
+\`\`\`bash
+curl '${base}/click?text=New'            # click by visible text (or sel= for CSS)
+curl '${base}/fill?sel=textarea&value=hi' # set an input/textarea/select value
+curl '${base}/press?key=Enter'           # key on focused element (e.g. Control+a)
+curl '${base}/wait?text=Done&timeout=8000' # poll until text/sel appears (add gone=1 to wait until it disappears)
+curl '${base}/screenshot?out=shot.png'   # DOM\u2192PNG into .aipeek/ (html-to-image; lossy)
+\`\`\`
+
+\`click\`/\`fill\`/\`press\` settle the DOM and append the resulting UI tree (\`--- ui after ---\`)
+to the response \u2014 no follow-up read needed. On a miss, the response lists the reachable
+clickable elements so you can re-target. URL-encode any \`sel=\` with non-ASCII or quotes:
+\`curl -G ${base}/click --data-urlencode 'sel=button[title="\u77E5\u8BC6\u5E93"]'\`.
+
+**Chain \u2014 a whole interaction in one round-trip.** POST a JSON array; runs in sequence,
+each step settles before the next, stops on first failure:
+
+\`\`\`bash
+curl -X POST ${base}/chain -d '[
+  {"type":"click","sel":"button[title=\\"\u77E5\u8BC6\u5E93\\"]"},
+  {"type":"wait","text":"Done"},
+  {"type":"fill","sel":"textarea","value":"hi"},
+  {"type":"press","key":"Enter"}
+]'
+\`\`\`
+
+**Escape hatch.** \`curl '${base}/eval?code=...'\` (or POST the code as the body) runs arbitrary
+JS in the page and returns the result \u2014 for anything the typed endpoints can't do.
+
+aipeek auto-detects errors after HMR and prints them to the terminal \u2014 watch for \`[aipeek]\` messages.
+`;
+}
+function norm(line) {
+  const t = line.trim();
+  const i = t.indexOf("localhost:");
+  if (i === -1)
+    return t;
+  let j = i + "localhost:".length;
+  while (j < t.length && t[j] >= "0" && t[j] <= "9") j++;
+  return `${t.slice(0, i)}localhost:PORT${t.slice(j)}`;
+}
+function stripBlocks(content, snippet) {
+  const known = new Set(snippet.split("\n").map(norm).filter((l) => l.length > 3));
+  const lines = content.split("\n");
+  const keep = [];
+  let inside = false;
+  let buf = [];
+  let hits = 0;
+  const flush = () => {
+    if (buf.length && hits / buf.length <= 0.5)
+      keep.push(...buf);
+    buf = [];
+    hits = 0;
+    inside = false;
+  };
+  for (const line of lines) {
+    const isKnown = known.has(norm(line));
+    if (!inside) {
+      if (isKnown) {
+        inside = true;
+        buf = [line];
+        hits = 1;
+      } else {
+        keep.push(line);
+      }
+      continue;
+    }
+    buf.push(line);
+    if (isKnown)
+      hits++;
+    else if (buf.slice(-3).every((l) => !known.has(norm(l))))
+      flush();
+  }
+  flush();
+  return keep.join("\n");
+}
+function injectClaudeMd(root, port) {
+  const path = resolve(root, "CLAUDE.md");
+  const snippet = aipeekSnippet(port);
+  try {
+    if (!existsSync(path)) {
+      writeFileSync(path, snippet.trimStart());
+      return;
+    }
+    const stripped = stripBlocks(readFileSync(path, "utf-8"), snippet).trimEnd();
+    writeFileSync(path, `${stripped}
+${snippet}`);
+  } catch {
+  }
+}
+function aipeekPlugin() {
+  let pendingResolve = null;
+  let server;
+  let lastRaw = null;
+  let pushTimer;
+  const pendingActions = /* @__PURE__ */ new Map();
+  let actionId = 0;
+  let pendingDom = null;
+  let pendingScreen = null;
+  const pendingEvals = /* @__PURE__ */ new Map();
+  let evalId = 0;
+  const VISIBLE_MS = 400;
+  function twoPhase(event, payload, arm, fullMs = 3e3) {
+    return new Promise((resolve2, reject) => {
+      let settled = false;
+      const clear = arm((v) => {
+        settled = true;
+        resolve2(v);
+      });
+      server.hot.send(event, { ...payload, requireVisible: true });
+      setTimeout(() => {
+        if (settled)
+          return;
+        server.hot.send(event, { ...payload, requireVisible: false });
+        setTimeout(() => {
+          if (settled)
+            return;
+          clear();
+          reject(new Error(`timeout: no client response within ${VISIBLE_MS + fullMs}ms`));
+        }, fullMs);
+      }, VISIBLE_MS);
+    });
+  }
+  function collectFromClient() {
+    return twoPhase("aipeek:collect", {}, (resolve2) => {
+      pendingResolve = resolve2;
+      return () => {
+        pendingResolve = null;
+      };
+    });
+  }
+  function collectDomFromClient(scope, sel) {
+    return twoPhase("aipeek:collect-dom", { scope, sel }, (resolve2) => {
+      pendingDom = resolve2;
+      return () => {
+        pendingDom = null;
+      };
+    });
+  }
+  function collectScreenFromClient() {
+    return twoPhase("aipeek:collect-screen", {}, (resolve2) => {
+      pendingScreen = resolve2;
+      return () => {
+        pendingScreen = null;
+      };
+    });
+  }
+  function sendAction(type, args) {
+    const id = ++actionId;
+    const fullMs = Math.max(args.timeout ?? 0, 3e3) + 2e3;
+    return twoPhase("aipeek:action", { id, type, args }, (resolve2) => {
+      pendingActions.set(id, resolve2);
+      return () => {
+        pendingActions.delete(id);
+      };
+    }, fullMs);
+  }
+  function evalInClient(code) {
+    const id = ++evalId;
+    return twoPhase("aipeek:eval", { id, code }, (resolve2) => {
+      pendingEvals.set(id, resolve2);
+      return () => {
+        pendingEvals.delete(id);
+      };
+    }, 8e3);
+  }
+  return {
+    name: "aipeek",
+    apply: "serve",
+    transformIndexHtml() {
+      const patchCode = compilePatch();
+      return [
+        // Synchronous inline script — patches console/fetch/XHR/errors
+        // BEFORE any ES modules execute
+        {
+          tag: "script",
+          children: patchCode,
+          injectTo: "head-prepend"
+        },
+        // Module script — collectors + HMR channel (can be deferred)
+        {
+          tag: "script",
+          attrs: { type: "module" },
+          children: `import '/@fs/${clientPath}'`,
+          injectTo: "body"
+        }
+      ];
+    },
+    configureServer(_server) {
+      server = _server;
+      injectClaudeMd(server.config.root, server.config.server.port || 5173);
+      server.hot.on("aipeek:state", (data) => {
+        if (pendingResolve) {
+          pendingResolve(data);
+          pendingResolve = null;
+        }
+      });
+      server.hot.on("aipeek:result", (data) => {
+        const resolve2 = pendingActions.get(data.id);
+        if (resolve2) {
+          pendingActions.delete(data.id);
+          resolve2(data);
+        }
+      });
+      server.hot.on("aipeek:eval-result", (data) => {
+        const resolve2 = pendingEvals.get(data.id);
+        if (resolve2) {
+          pendingEvals.delete(data.id);
+          resolve2(data);
+        }
+      });
+      server.hot.on("aipeek:dom", (data) => {
+        if (pendingDom) {
+          pendingDom(data.dom);
+          pendingDom = null;
+        }
+      });
+      server.hot.on("aipeek:screen", (data) => {
+        if (pendingScreen) {
+          pendingScreen(data.screen);
+          pendingScreen = null;
+        }
+      });
+      server.hot.on("vite:afterUpdate", () => {
+        clearTimeout(pushTimer);
+        pushTimer = setTimeout(async () => {
+          try {
+            const raw = await collectFromClient();
+            const diff = diffState(lastRaw, raw);
+            lastRaw = raw;
+            if (!diff.clean) {
+              const msg = emitDiff(diff);
+              if (msg)
+                server.config.logger.warn(msg);
+            }
+          } catch {
+          }
+        }, 500);
+      });
+      server.middlewares.use("/__aipeek", async (req, res) => {
+        const url = new URL(req.url || "/", "http://localhost");
+        const parts = url.pathname.split("/").filter(Boolean);
+        const full = url.searchParams.has("full");
+        try {
+          if (parts[0] === "eval") {
+            let code = url.searchParams.get("code") || "";
+            if (!code && req.method === "POST")
+              code = await readBody(req);
+            if (!code) {
+              res.writeHead(400, { "Content-Type": "text/plain; charset=utf-8" });
+              res.end("eval needs ?code= or a POST body");
+              return;
+            }
+            const r = await evalInClient(code);
+            res.writeHead(r.ok ? 200 : 422, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(r.ok ? r.value ?? "undefined" : `error: ${r.error}`);
+            return;
+          }
+          if (parts[0] === "dom") {
+            const dom = await collectDomFromClient(
+              url.searchParams.get("scope") || void 0,
+              url.searchParams.get("sel") || void 0
+            );
+            res.writeHead(200, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(dom || "(empty)");
+            return;
+          }
+          if (parts[0] === "screen") {
+            const screen = await collectScreenFromClient();
+            res.writeHead(200, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(screen || "(empty)");
+            return;
+          }
+          if (parts[0] === "chain") {
+            const body = await readBody(req);
+            let steps;
+            try {
+              steps = JSON.parse(body);
+              if (!Array.isArray(steps))
+                throw new Error("body must be a JSON array");
+            } catch (e) {
+              res.writeHead(400, { "Content-Type": "text/plain; charset=utf-8" });
+              res.end(`invalid chain body: ${e instanceof Error ? e.message : String(e)}`);
+              return;
+            }
+            lastRaw = null;
+            const lines = [];
+            let lastUi = "";
+            let allOk = true;
+            for (let i = 0; i < steps.length; i++) {
+              const { type, ...args } = steps[i];
+              const check2 = resolveAction(type, args);
+              if (!check2.valid) {
+                lines.push(`[${i}] \u2717 ${type}: ${check2.error}`);
+                allOk = false;
+                break;
+              }
+              const r = await sendAction(type, args);
+              lines.push(`[${i}] ${r.ok ? "\u2713" : "\u2717"} ${type}: ${r.ok ? r.detail || "ok" : r.error}`);
+              if (r.screen)
+                lines.push(r.screen.split("\n").map((l) => `    ${l}`).join("\n"));
+              if (r.ui)
+                lastUi = r.ui;
+              if (!r.ok) {
+                allOk = false;
+                break;
+              }
+            }
+            res.writeHead(allOk ? 200 : 422, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(lastUi ? `${lines.join("\n")}
+
+--- ui after ---
+${lastUi}` : lines.join("\n"));
+            return;
+          }
+          if (["click", "fill", "press", "wait", "screenshot"].includes(parts[0])) {
+            const q = url.searchParams;
+            const args = {
+              sel: q.get("sel") || void 0,
+              text: q.get("text") || void 0,
+              value: q.has("value") ? q.get("value") : void 0,
+              key: q.get("key") || void 0,
+              timeout: q.has("timeout") ? Number(q.get("timeout")) : void 0,
+              gone: q.has("gone") ? q.get("gone") !== "false" : void 0
+            };
+            const check2 = resolveAction(parts[0], args);
+            if (!check2.valid) {
+              res.writeHead(400, { "Content-Type": "text/plain; charset=utf-8" });
+              res.end(check2.error);
+              return;
+            }
+            const result = await sendAction(parts[0], args);
+            lastRaw = null;
+            if (parts[0] === "screenshot" && result.dataUrl) {
+              const dir = resolve(server.config.root, ".aipeek");
+              mkdirSync(dir, { recursive: true });
+              const name = q.get("out") || `shot-${result.dataUrl.length}.png`;
+              const file = resolve(dir, name);
+              writeFileSync(file, Buffer.from(result.dataUrl.split(",")[1], "base64"));
+              res.writeHead(200, { "Content-Type": "text/plain; charset=utf-8" });
+              res.end(`saved: ${file}`);
+              return;
+            }
+            res.writeHead(result.ok ? 200 : 422, { "Content-Type": "text/plain; charset=utf-8" });
+            const head = result.ok ? result.detail || "ok" : `${result.error}${result.detail ? `
+
+clickable: ${result.detail}` : ""}`;
+            res.end(result.ui ? `${head}
+
+--- ui after ---
+${result.ui}` : head);
+            return;
+          }
+          if (parts[0] === "check") {
+            const raw2 = await collectFromClient();
+            lastRaw = raw2;
+            const result = check(raw2);
+            const output = emitCheck(result);
+            res.writeHead(result.pass ? 200 : 417, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(output);
+            return;
+          }
+          if (parts.length >= 1) {
+            if (!lastRaw)
+              lastRaw = await collectFromClient();
+            const result = detail(lastRaw, parts[0], parts[1], full);
+            if (result !== null) {
+              res.writeHead(200, { "Content-Type": "text/plain; charset=utf-8" });
+              res.end(result);
+              return;
+            }
+            res.writeHead(404, { "Content-Type": "text/plain" });
+            res.end(`not found: ${parts.join("/")}`);
+            return;
+          }
+          const raw = await collectFromClient();
+          lastRaw = raw;
+          if (full) {
+            const compacted = compact(raw);
+            const output = emit(compacted);
+            res.writeHead(200, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(output);
+          } else {
+            const output = emitSummary(raw);
+            res.writeHead(200, { "Content-Type": "text/plain; charset=utf-8" });
+            res.end(output);
+          }
+        } catch (err) {
+          res.writeHead(504, { "Content-Type": "text/plain" });
+          res.end(err instanceof Error ? err.message : "unknown error");
+        }
+      });
+    }
+  };
+}
+
+export {
+  check,
+  diffState,
+  emitSummary,
+  emitCheck,
+  emitDiff,
+  aipeekPlugin
+};