stashes 0.1.38 → 0.1.39

package/dist/mcp.js

@@ -1558,7 +1558,291 @@ var apiRoutes = app;
 import { readFileSync as readFileSync4, existsSync as existsSync8 } from "fs";
 import { join as join8 } from "path";
 
+// ../server/dist/services/app-proxy.js
+import { spawn as spawn5 } from "child_process";
+function startAppProxy(userDevPort, proxyPort, injectOverlay) {
+  const overlayScript = injectOverlay("", userDevPort, proxyPort);
+  const overlayEscaped = JSON.stringify(overlayScript);
+  const proxyScript = `
+const http = require('http');
+const net = require('net');
+const zlib = require('zlib');
+const UPSTREAM = ${userDevPort};
+const OVERLAY = ${overlayEscaped};
+
+const server = http.createServer((clientReq, clientRes) => {
+  const opts = {
+    hostname: 'localhost',
+    port: UPSTREAM,
+    path: clientReq.url,
+    method: clientReq.method,
+    headers: clientReq.headers,
+  };
+  const proxyReq = http.request(opts, (proxyRes) => {
+    const ct = proxyRes.headers['content-type'] || '';
+    if (ct.includes('text/html')) {
+      // Buffer HTML to inject overlay
+      const chunks = [];
+      proxyRes.on('data', c => chunks.push(c));
+      proxyRes.on('end', () => {
+        let html = Buffer.concat(chunks);
+        const enc = proxyRes.headers['content-encoding'];
+        // Decompress if needed
+        if (enc === 'gzip') {
+          try { html = zlib.gunzipSync(html); } catch {}
+        } else if (enc === 'br') {
+          try { html = zlib.brotliDecompressSync(html); } catch {}
+        } else if (enc === 'deflate') {
+          try { html = zlib.inflateSync(html); } catch {}
+        }
+        const hdrs = { ...proxyRes.headers };
+        delete hdrs['content-length'];
+        delete hdrs['content-encoding'];
+        delete hdrs['transfer-encoding'];
+        clientRes.writeHead(proxyRes.statusCode, hdrs);
+        clientRes.write(html);
+        clientRes.end(OVERLAY);
+      });
+    } else {
+      // Non-HTML: stream through unchanged
+      clientRes.writeHead(proxyRes.statusCode, proxyRes.headers);
+      proxyRes.pipe(clientRes);
+    }
+    proxyRes.on('error', () => clientRes.end());
+  });
+  proxyReq.on('error', () => { try { clientRes.writeHead(502); clientRes.end(); } catch {} });
+  clientReq.pipe(proxyReq);
+});
+
+// WebSocket upgrades: raw TCP pipe
+server.on('upgrade', (req, socket, head) => {
+  const upstream = net.createConnection(UPSTREAM, 'localhost', () => {
+    const lines = [req.method + ' ' + req.url + ' HTTP/1.1'];
+    for (const [k, v] of Object.entries(req.headers)) {
+      lines.push(k + ': ' + (Array.isArray(v) ? v.join(', ') : v));
+    }
+    upstream.write(lines.join('\\r\\n') + '\\r\\n\\r\\n');
+    if (head.length) upstream.write(head);
+    socket.pipe(upstream);
+    upstream.pipe(socket);
+  });
+  upstream.on('error', () => socket.destroy());
+  socket.on('error', () => upstream.destroy());
+});
+
+server.listen(${proxyPort}, () => {
+  if (process.send) process.send('ready');
+});
+`;
+  const child = spawn5("node", ["-e", proxyScript], {
+    stdio: ["ignore", "inherit", "inherit", "ipc"]
+  });
+  child.on("error", (err) => {
+    logger.error("proxy", `Failed to start proxy: ${err.message}`);
+  });
+  child.on("message", (msg) => {
+    if (msg === "ready") {
+      logger.info("proxy", `App proxy at http://localhost:${proxyPort} \u2192 http://localhost:${userDevPort}`);
+    }
+  });
+  return child;
+}
+
+// ../server/dist/services/overlay-script.js
+function injectOverlayScript(html, _upstreamPort, _proxyPort) {
+  const overlayScript = `
+<script data-stashes-overlay>
+(function() {
+  var highlightOverlay = null;
+  var pickerEnabled = false;
+  var precisionMode = false;
+
+  function createOverlay() {
+    var overlay = document.createElement('div');
+    overlay.id = 'stashes-highlight';
+    overlay.style.cssText = 'position:fixed;pointer-events:none;border:2px solid #6366f1;background:rgba(99,102,241,0.1);z-index:99999;transition:all 0.1s ease;display:none;border-radius:4px;';
+    var tooltip = document.createElement('div');
+    tooltip.id = 'stashes-tooltip';
+    tooltip.style.cssText = 'position:fixed;background:#1e1b4b;color:#e0e7ff;padding:4px 10px;border-radius:6px;font-size:11px;font-family:ui-monospace,monospace;z-index:100000;pointer-events:none;display:none;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,0.3);max-width:400px;overflow:hidden;text-overflow:ellipsis;';
+    document.body.appendChild(overlay);
+    document.body.appendChild(tooltip);
+    return overlay;
+  }
+
+  var SEMANTIC_TAGS = ['header','nav','main','section','article','aside','footer','form','dialog'];
+  var LEAF_TAGS = ['h1','h2','h3','h4','h5','h6','p','button','a','input','textarea','select','img','svg','video','label','li','td','th','figcaption','blockquote','pre','code','span'];
+
+  function findTarget(el, precise) {
+    if (precise) return el;
+    // If the element itself is a meaningful leaf, select it directly
+    var elTag = el.tagName ? el.tagName.toLowerCase() : '';
+    if (LEAF_TAGS.indexOf(elTag) !== -1) return el;
+    var current = el;
+    var best = el;
+    while (current && current !== document.body) {
+      var tag = current.tagName.toLowerCase();
+      if (LEAF_TAGS.indexOf(tag) !== -1) { best = current; break; }
+      if (SEMANTIC_TAGS.indexOf(tag) !== -1) { best = current; break; }
+      if (current.id) { best = current; break; }
+      if (current.getAttribute('role')) { best = current; break; }
+      if (current.getAttribute('data-testid')) { best = current; break; }
+      if (current.children && current.children.length > 1 && current.getBoundingClientRect().height > 50) {
+        best = current;
+        break;
+      }
+      current = current.parentElement;
+    }
+    return best;
+  }
+
+  function describeElement(el) {
+    var tag = el.tagName.toLowerCase();
+    var id = el.id ? '#' + el.id : '';
+    var role = el.getAttribute('role') || '';
+    var testId = el.getAttribute('data-testid') || '';
+    var cls = (el.className && typeof el.className === 'string') ? el.className.trim().split(/[ ]+/).slice(0, 2).join('.') : '';
+    var text = (el.textContent || '').trim().substring(0, 40);
+    var label = tag;
+    if (SEMANTIC_TAGS.indexOf(tag) !== -1) label = tag.toUpperCase();
+    if (id) label += ' ' + id;
+    else if (cls) label += '.' + cls;
+    if (role) label += ' [' + role + ']';
+    if (testId) label += ' [' + testId + ']';
+    if (!id && !cls && text) label += ' "' + text.substring(0, 25) + '"';
+    return label;
+  }
+
+  function generateSelector(el) {
+    if (el.id) return '#' + el.id;
+    var parts = [];
+    var current = el;
+    var depth = 0;
+    while (current && current !== document.body && depth < 5) {
+      var sel = current.tagName.toLowerCase();
+      if (current.id) { parts.unshift('#' + current.id); break; }
+      if (current.className && typeof current.className === 'string') {
+        var c = current.className.trim().split(/[ ]+/).slice(0, 2).join('.');
+        if (c) sel += '.' + c;
+      }
+      parts.unshift(sel);
+      current = current.parentElement;
+      depth++;
+    }
+    return parts.join(' > ');
+  }
+
+  function onMouseMove(e) {
+    if (!pickerEnabled) return;
+    if (!highlightOverlay) highlightOverlay = createOverlay();
+    precisionMode = e.shiftKey;
+    var target = findTarget(e.target, precisionMode);
+    var overlay = document.getElementById('stashes-highlight');
+    var tooltip = document.getElementById('stashes-tooltip');
+    if (target) {
+      var rect = target.getBoundingClientRect();
+      overlay.style.display = 'block';
+      overlay.style.top = rect.top + 'px';
+      overlay.style.left = rect.left + 'px';
+      overlay.style.width = rect.width + 'px';
+      overlay.style.height = rect.height + 'px';
+      overlay.style.borderColor = precisionMode ? '#f59e0b' : '#6366f1';
+      tooltip.style.display = 'block';
+      tooltip.style.top = Math.max(0, rect.top - 30) + 'px';
+      tooltip.style.left = Math.max(0, rect.left) + 'px';
+      tooltip.textContent = (precisionMode ? '[precise] ' : '') + describeElement(target);
+    } else {
+      overlay.style.display = 'none';
+      tooltip.style.display = 'none';
+    }
+  }
+
+  function onClick(e) {
+    if (!pickerEnabled) return;
+    e.preventDefault();
+    e.stopPropagation();
+    var target = findTarget(e.target, e.shiftKey);
+    if (target) {
+      var desc = describeElement(target);
+      var selector = generateSelector(target);
+      var tag = target.tagName.toLowerCase();
+      var outerSnippet = target.outerHTML.substring(0, 500);
+      window.parent.postMessage({
+        type: 'stashes:component_selected',
+        component: {
+          name: desc,
+          filePath: 'auto-detect',
+          domSelector: selector,
+          htmlSnippet: outerSnippet,
+          tag: tag
+        }
+      }, '*');
+      var overlay = document.getElementById('stashes-highlight');
+      if (overlay) {
+        overlay.style.borderColor = '#22c55e';
+        overlay.style.background = 'rgba(34,197,94,0.1)';
+        setTimeout(function() {
+          overlay.style.borderColor = '#6366f1';
+          overlay.style.background = 'rgba(99,102,241,0.1)';
+        }, 500);
+      }
+    }
+  }
+
+  window.addEventListener('message', function(e) {
+    if (!e.data || !e.data.type) return;
+    if (e.data.type === 'stashes:toggle_picker') {
+      pickerEnabled = e.data.enabled;
+      if (!pickerEnabled) {
+        var ov = document.getElementById('stashes-highlight');
+        var tp = document.getElementById('stashes-tooltip');
+        if (ov) ov.style.display = 'none';
+        if (tp) tp.style.display = 'none';
+      }
+    } else if (e.data.type === 'stashes:navigate_back') {
+      history.back();
+    } else if (e.data.type === 'stashes:navigate_forward') {
+      history.forward();
+    } else if (e.data.type === 'stashes:refresh') {
+      location.reload();
+    } else if (e.data.type === 'stashes:navigate_to') {
+      window.location.href = e.data.url;
+    }
+  });
+
+  // Report current URL to parent for status bar display
+  function reportUrl() {
+    window.parent.postMessage({
+      type: 'stashes:url_change',
+      url: window.location.pathname + window.location.search + window.location.hash
+    }, '*');
+  }
+  reportUrl();
+  var origPush = history.pushState;
+  history.pushState = function() {
+    origPush.apply(this, arguments);
+    setTimeout(reportUrl, 0);
+  };
+  var origReplace = history.replaceState;
+  history.replaceState = function() {
+    origReplace.apply(this, arguments);
+    setTimeout(reportUrl, 0);
+  };
+  window.addEventListener('popstate', reportUrl);
+
+  document.addEventListener('mousemove', onMouseMove, { passive: true });
+  document.addEventListener('click', onClick, true);
+})();
+</script>`;
+  if (html.includes("</body>")) {
+    return html.replace("</body>", () => overlayScript + `
+</body>`);
+  }
+  return html + overlayScript;
+}
+
 // ../server/dist/services/preview-pool.js
+var DEV_PORT_OFFSET = 1000;
+
 class PreviewPool {
   entries = new Map;
   usedPorts = new Set;
@@ -1584,7 +1868,8 @@ class PreviewPool {
     if (this.entries.size >= this.maxSize) {
       this.evictOldest();
     }
-    const port = this.allocatePort();
+    const proxyPort = this.allocatePort();
+    const devPort = proxyPort + DEV_PORT_OFFSET;
     const worktreePath = await this.worktreeManager.createPreviewForPool(stashId);
     const process2 = Bun.spawn({
       cmd: ["npm", "run", "dev"],
@@ -1592,20 +1877,22 @@ class PreviewPool {
       stdin: "ignore",
       stdout: "pipe",
       stderr: "pipe",
-      env: { ...Bun.env, PORT: String(port), BROWSER: "none" }
+      env: { ...Bun.env, PORT: String(devPort), BROWSER: "none" }
     });
+    const proxyProcess = startAppProxy(devPort, proxyPort, injectOverlayScript);
     const entry = {
       stashId,
-      port,
+      port: proxyPort,
       process: process2,
+      proxyProcess,
       worktreePath,
       lastHeartbeat: Date.now()
     };
     this.entries.set(stashId, entry);
-    this.usedPorts.add(port);
-    logger.info("pool", `cold start: ${stashId} on port ${port}`, { poolSize: this.entries.size });
-    await this.waitForPort(port, 60000);
-    return port;
+    this.usedPorts.add(proxyPort);
+    logger.info("pool", `cold start: ${stashId} dev=:${devPort} proxy=:${proxyPort}`, { poolSize: this.entries.size });
+    await this.waitForPort(proxyPort, 60000);
+    return proxyPort;
   }
   heartbeat(stashId) {
     const entry = this.entries.get(stashId);
@@ -1723,6 +2010,9 @@ class PreviewPool {
     try {
       entry.process.kill();
     } catch {}
+    try {
+      entry.proxyProcess.kill();
+    } catch {}
   }
   async waitForPort(port, timeout) {
     const start = Date.now();
@@ -2227,124 +2517,34 @@ function createWebSocketHandler(projectPath, userDevPort, appProxyPort) {
               }
             }
             await stashService.message(event.projectId, event.chatId, event.message, event.referenceStashIds, event.componentContext);
-            break;
-          }
-          case "interact":
-            await stashService.switchPreview(event.stashId, event.sortedStashIds);
-            break;
-          case "preview_heartbeat":
-            stashService.previewHeartbeat(event.stashId);
-            break;
-          case "apply_stash":
-            await stashService.applyStash(event.stashId);
-            break;
-          case "delete_stash":
-            await stashService.deleteStash(event.stashId);
-            break;
-        }
-      } catch (err) {
-        const errorMsg = err instanceof Error ? err.message : String(err);
-        logger.error("ws", `handler failed for ${event.type}`, { error: errorMsg });
-        if ("stashId" in event && event.stashId) {
-          broadcast({ type: "stash:error", stashId: event.stashId, error: errorMsg });
-        }
-      }
-    },
-    close(ws) {
-      clients.delete(ws);
-      logger.info("ws", "client disconnected", { remaining: clients.size });
-    }
-  };
-}
-
-// ../server/dist/services/app-proxy.js
-import { spawn as spawn5 } from "child_process";
-function startAppProxy(userDevPort, proxyPort, injectOverlay) {
-  const overlayScript = injectOverlay("", userDevPort, proxyPort);
-  const overlayEscaped = JSON.stringify(overlayScript);
-  const proxyScript = `
-const http = require('http');
-const net = require('net');
-const zlib = require('zlib');
-const UPSTREAM = ${userDevPort};
-const OVERLAY = ${overlayEscaped};
-
-const server = http.createServer((clientReq, clientRes) => {
-  const opts = {
-    hostname: 'localhost',
-    port: UPSTREAM,
-    path: clientReq.url,
-    method: clientReq.method,
-    headers: clientReq.headers,
-  };
-  const proxyReq = http.request(opts, (proxyRes) => {
-    const ct = proxyRes.headers['content-type'] || '';
-    if (ct.includes('text/html')) {
-      // Buffer HTML to inject overlay
-      const chunks = [];
-      proxyRes.on('data', c => chunks.push(c));
-      proxyRes.on('end', () => {
-        let html = Buffer.concat(chunks);
-        const enc = proxyRes.headers['content-encoding'];
-        // Decompress if needed
-        if (enc === 'gzip') {
-          try { html = zlib.gunzipSync(html); } catch {}
-        } else if (enc === 'br') {
-          try { html = zlib.brotliDecompressSync(html); } catch {}
-        } else if (enc === 'deflate') {
-          try { html = zlib.inflateSync(html); } catch {}
+            break;
+          }
+          case "interact":
+            await stashService.switchPreview(event.stashId, event.sortedStashIds);
+            break;
+          case "preview_heartbeat":
+            stashService.previewHeartbeat(event.stashId);
+            break;
+          case "apply_stash":
+            await stashService.applyStash(event.stashId);
+            break;
+          case "delete_stash":
+            await stashService.deleteStash(event.stashId);
+            break;
         }
-        const hdrs = { ...proxyRes.headers };
-        delete hdrs['content-length'];
-        delete hdrs['content-encoding'];
-        delete hdrs['transfer-encoding'];
-        clientRes.writeHead(proxyRes.statusCode, hdrs);
-        clientRes.write(html);
-        clientRes.end(OVERLAY);
-      });
-    } else {
-      // Non-HTML: stream through unchanged
-      clientRes.writeHead(proxyRes.statusCode, proxyRes.headers);
-      proxyRes.pipe(clientRes);
-    }
-    proxyRes.on('error', () => clientRes.end());
-  });
-  proxyReq.on('error', () => { try { clientRes.writeHead(502); clientRes.end(); } catch {} });
-  clientReq.pipe(proxyReq);
-});
-
-// WebSocket upgrades: raw TCP pipe
-server.on('upgrade', (req, socket, head) => {
-  const upstream = net.createConnection(UPSTREAM, 'localhost', () => {
-    const lines = [req.method + ' ' + req.url + ' HTTP/1.1'];
-    for (const [k, v] of Object.entries(req.headers)) {
-      lines.push(k + ': ' + (Array.isArray(v) ? v.join(', ') : v));
-    }
-    upstream.write(lines.join('\\r\\n') + '\\r\\n\\r\\n');
-    if (head.length) upstream.write(head);
-    socket.pipe(upstream);
-    upstream.pipe(socket);
-  });
-  upstream.on('error', () => socket.destroy());
-  socket.on('error', () => upstream.destroy());
-});
-
-server.listen(${proxyPort}, () => {
-  if (process.send) process.send('ready');
-});
-`;
-  const child = spawn5("node", ["-e", proxyScript], {
-    stdio: ["ignore", "inherit", "inherit", "ipc"]
-  });
-  child.on("error", (err) => {
-    logger.error("proxy", `Failed to start proxy: ${err.message}`);
-  });
-  child.on("message", (msg) => {
-    if (msg === "ready") {
-      logger.info("proxy", `App proxy at http://localhost:${proxyPort} \u2192 http://localhost:${userDevPort}`);
+      } catch (err) {
+        const errorMsg = err instanceof Error ? err.message : String(err);
+        logger.error("ws", `handler failed for ${event.type}`, { error: errorMsg });
+        if ("stashId" in event && event.stashId) {
+          broadcast({ type: "stash:error", stashId: event.stashId, error: errorMsg });
+        }
+      }
+    },
+    close(ws) {
+      clients.delete(ws);
+      logger.info("ws", "client disconnected", { remaining: clients.size });
     }
-  });
-  return child;
+  };
 }
 
 // ../server/dist/index.js
@@ -2422,187 +2622,6 @@ function startServer(projectPath, userDevPort, port = STASHES_PORT) {
   logger.info("server", `Project: ${projectPath}`);
   return server;
 }
-function injectOverlayScript(html, _upstreamPort, _proxyPort) {
-  const overlayScript = `
-<script data-stashes-overlay>
-(function() {
-  var highlightOverlay = null;
-  var pickerEnabled = false;
-  var precisionMode = false;
-
-  function createOverlay() {
-    var overlay = document.createElement('div');
-    overlay.id = 'stashes-highlight';
-    overlay.style.cssText = 'position:fixed;pointer-events:none;border:2px solid #6366f1;background:rgba(99,102,241,0.1);z-index:99999;transition:all 0.1s ease;display:none;border-radius:4px;';
-    var tooltip = document.createElement('div');
-    tooltip.id = 'stashes-tooltip';
-    tooltip.style.cssText = 'position:fixed;background:#1e1b4b;color:#e0e7ff;padding:4px 10px;border-radius:6px;font-size:11px;font-family:ui-monospace,monospace;z-index:100000;pointer-events:none;display:none;white-space:nowrap;box-shadow:0 4px 12px rgba(0,0,0,0.3);max-width:400px;overflow:hidden;text-overflow:ellipsis;';
-    document.body.appendChild(overlay);
-    document.body.appendChild(tooltip);
-    return overlay;
-  }
-
-  var SEMANTIC_TAGS = ['header','nav','main','section','article','aside','footer','form','dialog'];
-  var LEAF_TAGS = ['h1','h2','h3','h4','h5','h6','p','button','a','input','textarea','select','img','svg','video','label','li','td','th','figcaption','blockquote','pre','code','span'];
-
-  function findTarget(el, precise) {
-    if (precise) return el;
-    // If the element itself is a meaningful leaf, select it directly
-    var elTag = el.tagName ? el.tagName.toLowerCase() : '';
-    if (LEAF_TAGS.indexOf(elTag) !== -1) return el;
-    var current = el;
-    var best = el;
-    while (current && current !== document.body) {
-      var tag = current.tagName.toLowerCase();
-      if (LEAF_TAGS.indexOf(tag) !== -1) { best = current; break; }
-      if (SEMANTIC_TAGS.indexOf(tag) !== -1) { best = current; break; }
-      if (current.id) { best = current; break; }
-      if (current.getAttribute('role')) { best = current; break; }
-      if (current.getAttribute('data-testid')) { best = current; break; }
-      if (current.children && current.children.length > 1 && current.getBoundingClientRect().height > 50) {
-        best = current;
-        break;
-      }
-      current = current.parentElement;
-    }
-    return best;
-  }
-
-  function describeElement(el) {
-    var tag = el.tagName.toLowerCase();
-    var id = el.id ? '#' + el.id : '';
-    var role = el.getAttribute('role') || '';
-    var testId = el.getAttribute('data-testid') || '';
-    var cls = (el.className && typeof el.className === 'string') ? el.className.trim().split(/[ ]+/).slice(0, 2).join('.') : '';
-    var text = (el.textContent || '').trim().substring(0, 40);
-    var label = tag;
-    if (SEMANTIC_TAGS.indexOf(tag) !== -1) label = tag.toUpperCase();
-    if (id) label += ' ' + id;
-    else if (cls) label += '.' + cls;
-    if (role) label += ' [' + role + ']';
-    if (testId) label += ' [' + testId + ']';
-    if (!id && !cls && text) label += ' "' + text.substring(0, 25) + '"';
-    return label;
-  }
-
-  function generateSelector(el) {
-    if (el.id) return '#' + el.id;
-    var parts = [];
-    var current = el;
-    var depth = 0;
-    while (current && current !== document.body && depth < 5) {
-      var sel = current.tagName.toLowerCase();
-      if (current.id) { parts.unshift('#' + current.id); break; }
-      if (current.className && typeof current.className === 'string') {
-        var c = current.className.trim().split(/[ ]+/).slice(0, 2).join('.');
-        if (c) sel += '.' + c;
-      }
-      parts.unshift(sel);
-      current = current.parentElement;
-      depth++;
-    }
-    return parts.join(' > ');
-  }
-
-  function onMouseMove(e) {
-    if (!pickerEnabled) return;
-    if (!highlightOverlay) highlightOverlay = createOverlay();
-    precisionMode = e.shiftKey;
-    var target = findTarget(e.target, precisionMode);
-    var overlay = document.getElementById('stashes-highlight');
-    var tooltip = document.getElementById('stashes-tooltip');
-    if (target) {
-      var rect = target.getBoundingClientRect();
-      overlay.style.display = 'block';
-      overlay.style.top = rect.top + 'px';
-      overlay.style.left = rect.left + 'px';
-      overlay.style.width = rect.width + 'px';
-      overlay.style.height = rect.height + 'px';
-      overlay.style.borderColor = precisionMode ? '#f59e0b' : '#6366f1';
-      tooltip.style.display = 'block';
-      tooltip.style.top = Math.max(0, rect.top - 30) + 'px';
-      tooltip.style.left = Math.max(0, rect.left) + 'px';
-      tooltip.textContent = (precisionMode ? '[precise] ' : '') + describeElement(target);
-    } else {
-      overlay.style.display = 'none';
-      tooltip.style.display = 'none';
-    }
-  }
-
-  function onClick(e) {
-    if (!pickerEnabled) return;
-    e.preventDefault();
-    e.stopPropagation();
-    var target = findTarget(e.target, e.shiftKey);
-    if (target) {
-      var desc = describeElement(target);
-      var selector = generateSelector(target);
-      var tag = target.tagName.toLowerCase();
-      var outerSnippet = target.outerHTML.substring(0, 500);
-      window.parent.postMessage({
-        type: 'stashes:component_selected',
-        component: {
-          name: desc,
-          filePath: 'auto-detect',
-          domSelector: selector,
-          htmlSnippet: outerSnippet,
-          tag: tag
-        }
-      }, '*');
-      var overlay = document.getElementById('stashes-highlight');
-      if (overlay) {
-        overlay.style.borderColor = '#22c55e';
-        overlay.style.background = 'rgba(34,197,94,0.1)';
-        setTimeout(function() {
-          overlay.style.borderColor = '#6366f1';
-          overlay.style.background = 'rgba(99,102,241,0.1)';
-        }, 500);
-      }
-    }
-  }
-
-  window.addEventListener('message', function(e) {
-    if (e.data && e.data.type === 'stashes:toggle_picker') {
-      pickerEnabled = e.data.enabled;
-      if (!pickerEnabled) {
-        var ov = document.getElementById('stashes-highlight');
-        var tp = document.getElementById('stashes-tooltip');
-        if (ov) ov.style.display = 'none';
-        if (tp) tp.style.display = 'none';
-      }
-    }
-  });
-
-  // Report current URL to parent for status bar display
-  function reportUrl() {
-    window.parent.postMessage({
-      type: 'stashes:url_change',
-      url: window.location.pathname + window.location.search + window.location.hash
-    }, '*');
-  }
-  reportUrl();
-  var origPush = history.pushState;
-  history.pushState = function() {
-    origPush.apply(this, arguments);
-    setTimeout(reportUrl, 0);
-  };
-  var origReplace = history.replaceState;
-  history.replaceState = function() {
-    origReplace.apply(this, arguments);
-    setTimeout(reportUrl, 0);
-  };
-  window.addEventListener('popstate', reportUrl);
-
-  document.addEventListener('mousemove', onMouseMove, { passive: true });
-  document.addEventListener('click', onClick, true);
-})();
-</script>`;
-  if (html.includes("</body>")) {
-    return html.replace("</body>", () => overlayScript + `
-</body>`);
-  }
-  return html + overlayScript;
-}
 
 // ../mcp/src/tools/browse.ts
 import open from "open";