aipeek 0.1.1 → 0.1.3

package/dist/{chunk-5SM5A2YR.js → chunk-FI6MF54L.js}

@@ -1,5 +1,5 @@
 // src/plugin.ts
-import { readFileSync, writeFileSync, existsSync } from "fs";
+import { existsSync, readFileSync, writeFileSync } from "fs";
 import { dirname, resolve } from "path";
 import { fileURLToPath } from "url";
 
@@ -43,19 +43,23 @@ var UI_PRIMITIVES = /* @__PURE__ */ new Set([
   "Panel"
 ]);
 function compactUI(tree) {
-  if (!tree) return "";
+  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;
+    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;
+    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) {
@@ -65,7 +69,7 @@ function compactUI(tree) {
     }
     for (const [k, t] of repeatTracker) {
       if (t.count > 1) {
-        const d = parseInt(k.split(":")[0]);
+        const d = Number.parseInt(k.split(":")[0]);
         const name = k.split(":").slice(1).join(":");
         result.push(`${"  ".repeat(d)}${name} \xD7${t.count}`);
       }
@@ -78,7 +82,7 @@ function compactUI(tree) {
   }
   for (const [k, t] of repeatTracker) {
     if (t.count > 1) {
-      const d = parseInt(k.split(":")[0]);
+      const d = Number.parseInt(k.split(":")[0]);
       const name = k.split(":").slice(1).join(":");
       result.push(`${"  ".repeat(d)}${name} \xD7${t.count}`);
     }
@@ -98,9 +102,11 @@ var NOISE_PATTERNS = [
   /\[webpack\]/i
 ];
 function compactConsole(logs) {
-  if (!logs.length) return "";
+  if (!logs.length)
+    return "";
   const filtered = logs.filter((l) => !NOISE_PATTERNS.some((p) => p.test(l.text)));
-  if (!filtered.length) return "";
+  if (!filtered.length)
+    return "";
   const deduped = [];
   for (const log of filtered) {
     const last = deduped[deduped.length - 1];
@@ -125,11 +131,13 @@ function compactConsole(logs) {
   return lines.join("\n");
 }
 function compactNetwork(requests) {
-  if (!requests.length) return "";
+  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 "";
+  if (!relevant.length)
+    return "";
   const lines = [];
   for (const req of relevant) {
     const duration = req.duration > 0 ? ` ${formatDuration(req.duration)}` : "";
@@ -156,7 +164,7 @@ function isApiUrl(url) {
 function compactUrl(url) {
   try {
     const u = new URL(url);
-    const path = u.pathname + (u.search ? "?" + truncate(u.search.slice(1), 50) : "");
+    const path = u.pathname + (u.search ? `?${truncate(u.search.slice(1), 50)}` : "");
     return path;
   } catch {
     return truncate(url, 80);
@@ -166,7 +174,8 @@ function formatDuration(ms) {
   return ms >= 1e3 ? `${(ms / 1e3).toFixed(1)}s` : `${Math.round(ms)}ms`;
 }
 function compactErrors(errors) {
-  if (!errors.length) return "";
+  if (!errors.length)
+    return "";
   const seen = /* @__PURE__ */ new Map();
   for (const err of errors) {
     if (!seen.has(err.message)) {
@@ -189,7 +198,8 @@ 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 "";
+  if (!state || !Object.keys(state).length)
+    return "";
   const lines = [];
   for (const [name, value] of Object.entries(state)) {
     lines.push(`${name}:`);
@@ -204,12 +214,15 @@ function compactState(state) {
   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 (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 s.length > 120 ? `${s.slice(0, 120)}\u2026` : s;
   }
   return String(v);
 }
@@ -231,39 +244,7 @@ function compact(raw) {
   };
 }
 function truncate(s, max) {
-  return s.length > max ? s.slice(0, max) + "\u2026" : s;
-}
-
-// 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}`;
+  return s.length > max ? `${s.slice(0, max)}\u2026` : s;
 }
 
 // src/detail.ts
@@ -284,20 +265,24 @@ async function detail(raw, section, index, full) {
   }
 }
 function detailConsole(logs, index, full) {
-  const i = parseInt(index ?? "");
-  if (isNaN(i) || i < 0 || i >= logs.length) return null;
+  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}`);
+    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 = parseInt(index ?? "");
-  if (isNaN(i) || i < 0 || i >= requests.length) return null;
+  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}`,
@@ -305,26 +290,30 @@ async function detailNetwork(requests, index, full) {
     `duration: ${req.duration}ms`,
     `type: ${req.resourceType}`
   ];
-  if (req.failed) lines.push(`failed: ${req.failureText || "true"}`);
+  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:
+    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:
+    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 (ts)
+          lines.push(ts);
       }
     }
     if (req.responseBody) {
@@ -334,7 +323,8 @@ ${req.responseBody}`);
         if (req.responseSample) {
           const ts = await quickTypeOrFallback(req.responseSample, "ResponseBody");
           lines.push(`response-body: ${byteSize(req.responseBody)}`);
-          if (ts) lines.push(ts);
+          if (ts)
+            lines.push(ts);
         } else {
           lines.push(`response-body: ${byteSize(req.responseBody)} ${truncate2(req.responseBody, 100)}`);
         }
@@ -361,28 +351,36 @@ async function quickTypeOrFallback(sample, typeName) {
   }
 }
 function detailError(errors, index, full) {
-  const i = parseInt(index ?? "");
-  if (isNaN(i) || i < 0 || i >= errors.length) return null;
+  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}`);
+    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);
+    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 (totalApp > 3)
+      lines.push(`  ... ${totalApp - 3} more app frames`);
   }
-  if (err.line != null) lines.push(`location: ${err.source || ""}:${err.line}:${err.column ?? 0}`);
+  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;
+  if (!name || !(name in state))
+    return null;
   const value = state[name];
   if (full) {
     try {
@@ -391,7 +389,8 @@ function detailState(state, name, full) {
       return String(value);
     }
   }
-  if (typeof value !== "object" || value === null) return `${name}: ${typeof 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)}`);
@@ -399,15 +398,18 @@ function detailState(state, name, full) {
   return lines.join("\n");
 }
 function formatSummaryValue(v) {
-  if (v === null || v === void 0) return String(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 (/^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 === "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 s.length > 80 ? `${s.slice(0, 80)}\u2026` : s;
   }
   return String(v);
 }
@@ -419,58 +421,113 @@ function jsonSchema(sample) {
   }
 }
 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 (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]";
+    if (!v.length)
+      return "[]";
+    if (d >= 3)
+      return "[\u2026]";
     return `${schemaOf(v[0], d + 1)}[]`;
   }
   if (typeof v === "object") {
-    if (d >= 3) return "{\u2026}";
+    if (d >= 3)
+      return "{\u2026}";
     const entries = Object.entries(v);
-    if (!entries.length) return "{}";
+    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`);
+    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;
+  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`;
+  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");
-var AIPEEK_SNIPPET = `
+function aipeekSnippet(port) {
+  const base = `http://localhost:${port}/__aipeek`;
+  return `
 # aipeek \u2014 Runtime Browser Inspector
 
-When debugging UI issues, checking errors, or inspecting app state, fetch runtime info from the dev server:
+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.
 
-- \`curl http://localhost:5195/__aipeek\` \u2014 summary (UI tree, console, network, errors, state)
-- \`curl http://localhost:5195/__aipeek/{section}\` \u2014 detail for one section
-- \`curl http://localhost:5195/__aipeek/{section}/{index}\` \u2014 specific item
-- Append \`?full\` for untruncated output
+\`\`\`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.
 `;
-function injectClaudeMd(root) {
+}
+function injectClaudeMd(root, port) {
   const path = resolve(root, "CLAUDE.md");
+  const snippet = aipeekSnippet(port);
   try {
     if (existsSync(path)) {
       const content = readFileSync(path, "utf-8");
-      if (content.includes("__aipeek")) return;
-      writeFileSync(path, content.trimEnd() + "\n" + AIPEEK_SNIPPET);
+      if (content.includes("__aipeek"))
+        return;
+      writeFileSync(path, `${content.trimEnd()}
+${snippet}`);
     } else {
-      writeFileSync(path, AIPEEK_SNIPPET.trimStart());
+      writeFileSync(path, snippet.trimStart());
     }
   } catch {
   }
@@ -502,7 +559,7 @@ function aipeekPlugin() {
     },
     configureServer(_server) {
       server = _server;
-      injectClaudeMd(server.config.root);
+      injectClaudeMd(server.config.root, server.config.server.port || 5173);
       server.hot.on("aipeek:state", (data) => {
         if (pendingResolve) {
           pendingResolve(data);
@@ -515,7 +572,8 @@ function aipeekPlugin() {
         const full = url.searchParams.has("full");
         try {
           if (parts.length >= 1) {
-            if (!lastRaw) lastRaw = await collectFromClient();
+            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" });
@@ -548,7 +606,7 @@ export {
   compactErrors,
   compactState,
   compact,
-  emit,
   detail,
+  emit,
   aipeekPlugin
 };

package/dist/{chunk-QXCVA2LU.cjs → chunk-KW232XW7.cjs}

@@ -43,19 +43,23 @@ var UI_PRIMITIVES = /* @__PURE__ */ new Set([
   "Panel"
 ]);
 function compactUI(tree) {
-  if (!tree) return "";
+  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;
+    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;
+    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) {
@@ -65,7 +69,7 @@ function compactUI(tree) {
     }
     for (const [k, t] of repeatTracker) {
       if (t.count > 1) {
-        const d = parseInt(k.split(":")[0]);
+        const d = Number.parseInt(k.split(":")[0]);
         const name = k.split(":").slice(1).join(":");
         result.push(`${"  ".repeat(d)}${name} \xD7${t.count}`);
       }
@@ -78,7 +82,7 @@ function compactUI(tree) {
   }
   for (const [k, t] of repeatTracker) {
     if (t.count > 1) {
-      const d = parseInt(k.split(":")[0]);
+      const d = Number.parseInt(k.split(":")[0]);
       const name = k.split(":").slice(1).join(":");
       result.push(`${"  ".repeat(d)}${name} \xD7${t.count}`);
     }
@@ -98,9 +102,11 @@ var NOISE_PATTERNS = [
   /\[webpack\]/i
 ];
 function compactConsole(logs) {
-  if (!logs.length) return "";
+  if (!logs.length)
+    return "";
   const filtered = logs.filter((l) => !NOISE_PATTERNS.some((p) => p.test(l.text)));
-  if (!filtered.length) return "";
+  if (!filtered.length)
+    return "";
   const deduped = [];
   for (const log of filtered) {
     const last = deduped[deduped.length - 1];
@@ -125,11 +131,13 @@ function compactConsole(logs) {
   return lines.join("\n");
 }
 function compactNetwork(requests) {
-  if (!requests.length) return "";
+  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 "";
+  if (!relevant.length)
+    return "";
   const lines = [];
   for (const req of relevant) {
     const duration = req.duration > 0 ? ` ${formatDuration(req.duration)}` : "";
@@ -156,7 +164,7 @@ function isApiUrl(url) {
 function compactUrl(url) {
   try {
     const u = new URL(url);
-    const path = u.pathname + (u.search ? "?" + truncate(u.search.slice(1), 50) : "");
+    const path = u.pathname + (u.search ? `?${truncate(u.search.slice(1), 50)}` : "");
     return path;
   } catch (e2) {
     return truncate(url, 80);
@@ -166,7 +174,8 @@ function formatDuration(ms) {
   return ms >= 1e3 ? `${(ms / 1e3).toFixed(1)}s` : `${Math.round(ms)}ms`;
 }
 function compactErrors(errors) {
-  if (!errors.length) return "";
+  if (!errors.length)
+    return "";
   const seen = /* @__PURE__ */ new Map();
   for (const err of errors) {
     if (!seen.has(err.message)) {
@@ -189,7 +198,8 @@ 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 "";
+  if (!state || !Object.keys(state).length)
+    return "";
   const lines = [];
   for (const [name, value] of Object.entries(state)) {
     lines.push(`${name}:`);
@@ -204,12 +214,15 @@ function compactState(state) {
   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 (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 s.length > 120 ? `${s.slice(0, 120)}\u2026` : s;
   }
   return String(v);
 }
@@ -231,39 +244,7 @@ function compact(raw) {
   };
 }
 function truncate(s, max) {
-  return s.length > max ? s.slice(0, max) + "\u2026" : s;
-}
-
-// 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 ? _nullishCoalesce(_optionalChain([state, 'access', _ => _.counts, 'optionalAccess', _2 => _2[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}`;
+  return s.length > max ? `${s.slice(0, max)}\u2026` : s;
 }
 
 // src/detail.ts
@@ -284,20 +265,24 @@ async function detail(raw, section, index, full) {
   }
 }
 function detailConsole(logs, index, full) {
-  const i = parseInt(_nullishCoalesce(index, () => ( "")));
-  if (isNaN(i) || i < 0 || i >= logs.length) return null;
+  const i = Number.parseInt(_nullishCoalesce(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}`);
+    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 = parseInt(_nullishCoalesce(index, () => ( "")));
-  if (isNaN(i) || i < 0 || i >= requests.length) return null;
+  const i = Number.parseInt(_nullishCoalesce(index, () => ( "")));
+  if (isNaN(i) || i < 0 || i >= requests.length)
+    return null;
   const req = requests[i];
   const lines = [
     `${req.method} ${req.url}`,
@@ -305,26 +290,30 @@ async function detailNetwork(requests, index, full) {
     `duration: ${req.duration}ms`,
     `type: ${req.resourceType}`
   ];
-  if (req.failed) lines.push(`failed: ${req.failureText || "true"}`);
+  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:
+    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:
+    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 (ts)
+          lines.push(ts);
       }
     }
     if (req.responseBody) {
@@ -334,7 +323,8 @@ ${req.responseBody}`);
         if (req.responseSample) {
           const ts = await quickTypeOrFallback(req.responseSample, "ResponseBody");
           lines.push(`response-body: ${byteSize(req.responseBody)}`);
-          if (ts) lines.push(ts);
+          if (ts)
+            lines.push(ts);
         } else {
           lines.push(`response-body: ${byteSize(req.responseBody)} ${truncate2(req.responseBody, 100)}`);
         }
@@ -361,28 +351,36 @@ async function quickTypeOrFallback(sample, typeName) {
   }
 }
 function detailError(errors, index, full) {
-  const i = parseInt(_nullishCoalesce(index, () => ( "")));
-  if (isNaN(i) || i < 0 || i >= errors.length) return null;
+  const i = Number.parseInt(_nullishCoalesce(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}:${_nullishCoalesce(err.column, () => ( 0))}`);
+    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}:${_nullishCoalesce(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);
+    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 (totalApp > 3)
+      lines.push(`  ... ${totalApp - 3} more app frames`);
   }
-  if (err.line != null) lines.push(`location: ${err.source || ""}:${err.line}:${_nullishCoalesce(err.column, () => ( 0))}`);
+  if (err.line != null)
+    lines.push(`location: ${err.source || ""}:${err.line}:${_nullishCoalesce(err.column, () => ( 0))}`);
   return lines.join("\n");
 }
 function detailState(state, name, full) {
-  if (!name || !(name in state)) return null;
+  if (!name || !(name in state))
+    return null;
   const value = state[name];
   if (full) {
     try {
@@ -391,7 +389,8 @@ function detailState(state, name, full) {
       return String(value);
     }
   }
-  if (typeof value !== "object" || value === null) return `${name}: ${typeof 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)}`);
@@ -399,15 +398,18 @@ function detailState(state, name, full) {
   return lines.join("\n");
 }
 function formatSummaryValue(v) {
-  if (v === null || v === void 0) return String(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 (/^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 === "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 s.length > 80 ? `${s.slice(0, 80)}\u2026` : s;
   }
   return String(v);
 }
@@ -419,58 +421,113 @@ function jsonSchema(sample) {
   }
 }
 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 (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]";
+    if (!v.length)
+      return "[]";
+    if (d >= 3)
+      return "[\u2026]";
     return `${schemaOf(v[0], d + 1)}[]`;
   }
   if (typeof v === "object") {
-    if (d >= 3) return "{\u2026}";
+    if (d >= 3)
+      return "{\u2026}";
     const entries = Object.entries(v);
-    if (!entries.length) return "{}";
+    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`);
+    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;
+  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`;
+  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 ? _nullishCoalesce(_optionalChain([state, 'access', _ => _.counts, 'optionalAccess', _2 => _2[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 = _path.dirname.call(void 0, _url.fileURLToPath.call(void 0, import.meta.url));
 var clientPath = _path.resolve.call(void 0, __dirname, "client.ts");
-var AIPEEK_SNIPPET = `
+function aipeekSnippet(port) {
+  const base = `http://localhost:${port}/__aipeek`;
+  return `
 # aipeek \u2014 Runtime Browser Inspector
 
-When debugging UI issues, checking errors, or inspecting app state, fetch runtime info from the dev server:
+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.
 
-- \`curl http://localhost:5195/__aipeek\` \u2014 summary (UI tree, console, network, errors, state)
-- \`curl http://localhost:5195/__aipeek/{section}\` \u2014 detail for one section
-- \`curl http://localhost:5195/__aipeek/{section}/{index}\` \u2014 specific item
-- Append \`?full\` for untruncated output
+\`\`\`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.
 `;
-function injectClaudeMd(root) {
+}
+function injectClaudeMd(root, port) {
   const path = _path.resolve.call(void 0, root, "CLAUDE.md");
+  const snippet = aipeekSnippet(port);
   try {
     if (_fs.existsSync.call(void 0, path)) {
       const content = _fs.readFileSync.call(void 0, path, "utf-8");
-      if (content.includes("__aipeek")) return;
-      _fs.writeFileSync.call(void 0, path, content.trimEnd() + "\n" + AIPEEK_SNIPPET);
+      if (content.includes("__aipeek"))
+        return;
+      _fs.writeFileSync.call(void 0, path, `${content.trimEnd()}
+${snippet}`);
     } else {
-      _fs.writeFileSync.call(void 0, path, AIPEEK_SNIPPET.trimStart());
+      _fs.writeFileSync.call(void 0, path, snippet.trimStart());
     }
   } catch (e6) {
   }
@@ -502,7 +559,7 @@ function aipeekPlugin() {
     },
     configureServer(_server) {
       server = _server;
-      injectClaudeMd(server.config.root);
+      injectClaudeMd(server.config.root, server.config.server.port || 5173);
       server.hot.on("aipeek:state", (data) => {
         if (pendingResolve) {
           pendingResolve(data);
@@ -515,7 +572,8 @@ function aipeekPlugin() {
         const full = url.searchParams.has("full");
         try {
           if (parts.length >= 1) {
-            if (!lastRaw) lastRaw = await collectFromClient();
+            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" });
@@ -551,4 +609,4 @@ function aipeekPlugin() {
 
 
 
-exports.compactUI = compactUI; exports.compactConsole = compactConsole; exports.compactNetwork = compactNetwork; exports.compactErrors = compactErrors; exports.compactState = compactState; exports.compact = compact; exports.emit = emit; exports.detail = detail; exports.aipeekPlugin = aipeekPlugin;
+exports.compactUI = compactUI; exports.compactConsole = compactConsole; exports.compactNetwork = compactNetwork; exports.compactErrors = compactErrors; exports.compactState = compactState; exports.compact = compact; exports.detail = detail; exports.emit = emit; exports.aipeekPlugin = aipeekPlugin;

package/dist/index.cjs

@@ -8,7 +8,7 @@
 
 
 
-var _chunkQXCVA2LUcjs = require('./chunk-QXCVA2LU.cjs');
+var _chunkKW232XW7cjs = require('./chunk-KW232XW7.cjs');
 
 
 
@@ -19,4 +19,4 @@ var _chunkQXCVA2LUcjs = require('./chunk-QXCVA2LU.cjs');
 
 
 
-exports.aipeekPlugin = _chunkQXCVA2LUcjs.aipeekPlugin; exports.compact = _chunkQXCVA2LUcjs.compact; exports.compactConsole = _chunkQXCVA2LUcjs.compactConsole; exports.compactErrors = _chunkQXCVA2LUcjs.compactErrors; exports.compactNetwork = _chunkQXCVA2LUcjs.compactNetwork; exports.compactState = _chunkQXCVA2LUcjs.compactState; exports.compactUI = _chunkQXCVA2LUcjs.compactUI; exports.detail = _chunkQXCVA2LUcjs.detail; exports.emit = _chunkQXCVA2LUcjs.emit;
+exports.aipeekPlugin = _chunkKW232XW7cjs.aipeekPlugin; exports.compact = _chunkKW232XW7cjs.compact; exports.compactConsole = _chunkKW232XW7cjs.compactConsole; exports.compactErrors = _chunkKW232XW7cjs.compactErrors; exports.compactNetwork = _chunkKW232XW7cjs.compactNetwork; exports.compactState = _chunkKW232XW7cjs.compactState; exports.compactUI = _chunkKW232XW7cjs.compactUI; exports.detail = _chunkKW232XW7cjs.detail; exports.emit = _chunkKW232XW7cjs.emit;

package/dist/index.d.cts

@@ -60,10 +60,10 @@ declare function compactErrors(errors: ErrorEntry[]): string;
 declare function compactState(state: Record<string, unknown>): string;
 declare function compact(raw: RawState): CompactState;
 
-declare function emit(state: CompactState): string;
-
 declare function detail(raw: RawState, section: string, index: string | undefined, full: boolean): Promise<string | null>;
 
+declare function emit(state: CompactState): string;
+
 declare function aipeekPlugin(): Plugin;
 
 export { type CompactState, type ErrorEntry, type LogEntry, type NetworkRequest, type RawState, aipeekPlugin, compact, compactConsole, compactErrors, compactNetwork, compactState, compactUI, detail, emit };

package/dist/index.d.ts

@@ -60,10 +60,10 @@ declare function compactErrors(errors: ErrorEntry[]): string;
 declare function compactState(state: Record<string, unknown>): string;
 declare function compact(raw: RawState): CompactState;
 
-declare function emit(state: CompactState): string;
-
 declare function detail(raw: RawState, section: string, index: string | undefined, full: boolean): Promise<string | null>;
 
+declare function emit(state: CompactState): string;
+
 declare function aipeekPlugin(): Plugin;
 
 export { type CompactState, type ErrorEntry, type LogEntry, type NetworkRequest, type RawState, aipeekPlugin, compact, compactConsole, compactErrors, compactNetwork, compactState, compactUI, detail, emit };

package/dist/index.js

@@ -8,7 +8,7 @@ import {
   compactUI,
   detail,
   emit
-} from "./chunk-5SM5A2YR.js";
+} from "./chunk-FI6MF54L.js";
 export {
   aipeekPlugin,
   compact,

package/dist/plugin.cjs

@@ -1,6 +1,6 @@
 "use strict";Object.defineProperty(exports, "__esModule", {value: true});
 
-var _chunkQXCVA2LUcjs = require('./chunk-QXCVA2LU.cjs');
+var _chunkKW232XW7cjs = require('./chunk-KW232XW7.cjs');
 
 
-exports.aipeekPlugin = _chunkQXCVA2LUcjs.aipeekPlugin;
+exports.aipeekPlugin = _chunkKW232XW7cjs.aipeekPlugin;

package/dist/plugin.js

@@ -1,6 +1,6 @@
 import {
   aipeekPlugin
-} from "./chunk-5SM5A2YR.js";
+} from "./chunk-FI6MF54L.js";
 export {
   aipeekPlugin
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "aipeek",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Gives AI a peek into your running browser app — UI tree, console, network, errors, state",
   "license": "MIT",
   "repository": {