aipeek 0.1.4 → 0.2.0

package/dist/chunk-AFSKSPDG.js

@@ -1,621 +0,0 @@
-// src/plugin.ts
-import { existsSync, readFileSync, writeFileSync } from "fs";
-import { dirname, resolve } from "path";
-import { fileURLToPath } from "url";
-
-// src/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 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 = trimmed.split(/[\s[—]/)[0];
-    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_PATTERNS = [
-  /\[HMR\]/i,
-  /\[vite\]/i,
-  /hot module/i,
-  /react-devtools/i,
-  /download the react devtools/i,
-  /warning: react does not recognize/i,
-  /source map/i,
-  /favicon\.ico/,
-  /webpack/i,
-  /\[webpack\]/i
-];
-function compactConsole(logs) {
-  if (!logs.length)
-    return "";
-  const filtered = logs.filter((l) => !NOISE_PATTERNS.some((p) => p.test(l.text)));
-  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" || 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);
-    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}${duration}${slow}`);
-    } else {
-      lines.push(`${req.method} ${url} ${req.status}${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;
-  }
-}
-function compactUrl(url) {
-  try {
-    const u = new URL(url);
-    const path = u.pathname + (u.search ? `?${truncate(u.search.slice(1), 50)}` : "");
-    return path;
-  } catch {
-    return truncate(url, 80);
-  }
-}
-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
-    }
-  };
-}
-function truncate(s, max) {
-  return s.length > max ? `${s.slice(0, max)}\u2026` : s;
-}
-
-// src/detail.ts
-async 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) {
-  const i = Number.parseInt(index ?? "");
-  if (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}] ${truncate2(log.text, 200)}`;
-}
-async function detailNetwork(requests, index, full) {
-  const i = Number.parseInt(index ?? "");
-  if (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 ts = await quickTypeOrFallback(req.requestSample, "RequestBody");
-        if (ts)
-          lines.push(ts);
-      }
-    }
-    if (req.responseBody) {
-      if (req.status >= 400) {
-        lines.push(`response-body: ${byteSize(req.responseBody)} "${truncate2(req.responseBody, 100)}"`);
-      } else {
-        if (req.responseSample) {
-          const ts = await quickTypeOrFallback(req.responseSample, "ResponseBody");
-          lines.push(`response-body: ${byteSize(req.responseBody)}`);
-          if (ts)
-            lines.push(ts);
-        } else {
-          lines.push(`response-body: ${byteSize(req.responseBody)} ${truncate2(req.responseBody, 100)}`);
-        }
-      }
-    }
-  }
-  return lines.join("\n");
-}
-async function quickTypeOrFallback(sample, typeName) {
-  try {
-    const { InputData, jsonInputForTargetLanguage, quicktype } = await import("quicktype-core");
-    const jsonInput = jsonInputForTargetLanguage("typescript");
-    await jsonInput.addSource({ name: typeName, samples: [sample] });
-    const inputData = new InputData();
-    inputData.addInput(jsonInput);
-    const { lines } = await quicktype({
-      inputData,
-      lang: "typescript",
-      rendererOptions: { "just-types": "true", "acronym-style": "original" }
-    });
-    return lines.join("\n");
-  } catch {
-    return jsonSchema(sample);
-  }
-}
-function detailError(errors, index, full) {
-  const i = Number.parseInt(index ?? "");
-  if (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 || !(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 formatSummaryValue(v) {
-  if (v === null || v === void 0)
-    return String(v);
-  if (typeof v === "string") {
-    if (/^Array\(\d+\)$/.test(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 truncate2(s, max) {
-  return s.length > max ? `${s.slice(0, max)}\u2026` : s;
-}
-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/emit.ts
-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/{ui|console|network|errors|state}/{index}`;
-}
-
-// src/plugin.ts
-var __dirname = dirname(fileURLToPath(import.meta.url));
-var clientPath = resolve(__dirname, "client.ts");
-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.
-
-\`\`\`bash
-curl ${base}          # full summary: UI tree + console + network + errors + state
-curl ${base}/ui       # React component tree with props and DOM semantics
-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
-\`\`\`
-
-Append \`?full\` for untruncated output. Append \`/{index}\` for a specific item's detail.
-`;
-}
-var AIPEEK_HEADING = "# aipeek \u2014 Runtime Browser Inspector";
-function injectClaudeMd(root, port) {
-  const path = resolve(root, "CLAUDE.md");
-  const snippet = aipeekSnippet(port);
-  try {
-    if (!existsSync(path)) {
-      writeFileSync(path, snippet.trimStart());
-      return;
-    }
-    const content = readFileSync(path, "utf-8");
-    const start = content.indexOf(AIPEEK_HEADING);
-    if (start === -1) {
-      writeFileSync(path, `${content.trimEnd()}
-${snippet}`);
-      return;
-    }
-    const afterHeading = content.indexOf("\n", start);
-    const nextHeading = content.indexOf("\n# ", afterHeading);
-    const end = nextHeading === -1 ? content.length : nextHeading;
-    const before = content.slice(0, start).trimEnd();
-    const after = content.slice(end);
-    writeFileSync(path, before + (before ? "\n" : "") + snippet + after);
-  } catch {
-  }
-}
-function aipeekPlugin() {
-  let pendingResolve = null;
-  let server;
-  let lastRaw = null;
-  function collectFromClient() {
-    return new Promise((resolve2, reject) => {
-      pendingResolve = resolve2;
-      setTimeout(() => {
-        pendingResolve = null;
-        reject(new Error("timeout: no client response within 3s"));
-      }, 3e3);
-      server.hot.send("aipeek:collect", {});
-    });
-  }
-  return {
-    name: "aipeek",
-    apply: "serve",
-    transformIndexHtml() {
-      return [{
-        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.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.length >= 1) {
-            if (!lastRaw)
-              lastRaw = await collectFromClient();
-            const result = await 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;
-          const compacted = compact(raw);
-          const output = emit(compacted);
-          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 {
-  compactUI,
-  compactConsole,
-  compactNetwork,
-  compactErrors,
-  compactState,
-  compact,
-  detail,
-  emit,
-  aipeekPlugin
-};