alanbox 0.1.1 → 0.1.3

package/2designer/dist/cli.js

@@ -0,0 +1,498 @@
+#!/usr/bin/env node
+
+
+// src/cli.ts
+import { Command } from "commander";
+
+// src/engine/create-engine.ts
+function resolveEngineType(options) {
+  return options.cdp ? "cdp" : "playwright";
+}
+async function createEngine(options) {
+  const type = resolveEngineType(options);
+  if (type === "cdp") {
+    const { CdpEngine } = await import("./cdp-engine-JK2XVDHK.js");
+    const [host, portStr] = options.cdp.split(":");
+    const port = parseInt(portStr, 10);
+    return CdpEngine.create(host, port, options.url);
+  }
+  const { PlaywrightEngine } = await import("./playwright-engine-YBRDIUHF.js");
+  return PlaywrightEngine.create(options.url, {
+    headless: options.headless ?? true,
+    viewport: options.viewport
+  });
+}
+
+// src/engine/selector.ts
+function resolveSelector(input) {
+  if (input.startsWith("~")) {
+    const keyword = input.slice(1).trim();
+    return `[class*="${keyword}"]`;
+  }
+  return input;
+}
+
+// src/commands/measure.ts
+function buildMeasureOptions(raw) {
+  if (!raw.url) throw new Error("--url is required");
+  if (!raw.selector) throw new Error("--selector is required");
+  return {
+    url: raw.url,
+    selector: resolveSelector(raw.selector),
+    frame: raw.frame ? resolveSelector(raw.frame) : void 0,
+    depth: raw.depth != null ? parseInt(raw.depth, 10) : 1,
+    cdp: raw.cdp,
+    format: raw.format ?? "json",
+    pick: raw.pick
+  };
+}
+function formatMeasureResult(result, format) {
+  if (format === "table") {
+    const lines = [];
+    lines.push(`Selector: ${result.selector}`);
+    lines.push(`BBox: x=${result.bbox.x} y=${result.bbox.y} w=${result.bbox.width} h=${result.bbox.height}`);
+    lines.push("");
+    lines.push("Property".padEnd(30) + "Value");
+    lines.push("-".repeat(60));
+    for (const [key, val] of Object.entries(result.computedStyle)) {
+      lines.push(key.padEnd(30) + val);
+    }
+    if (result.children?.length) {
+      let printChildren2 = function(children, indent) {
+        for (const c of children) {
+          const pad = " ".repeat(indent);
+          lines.push(`${pad}<${c.tag}> .${c.className} [${c.bbox.width}x${c.bbox.height}] ${c.text ?? ""}`);
+          if (c.children?.length) {
+            printChildren2(c.children, indent + 2);
+          }
+        }
+      };
+      var printChildren = printChildren2;
+      lines.push("");
+      lines.push(`Children (${result.children.length}):`);
+      printChildren2(result.children, 2);
+    }
+    return lines.join("\n");
+  }
+  return JSON.stringify(result, null, 2);
+}
+function pickFields(result, pick) {
+  if (pick === "bbox") return JSON.stringify(result.bbox);
+  if (pick === "children") return JSON.stringify(result.children ?? []);
+  const props = pick.split(",").map((p) => p.trim());
+  const picked = {};
+  for (const p of props) {
+    if (result.computedStyle[p] != null) {
+      picked[p] = result.computedStyle[p];
+    }
+  }
+  return JSON.stringify(picked);
+}
+async function measure(raw) {
+  const opts = buildMeasureOptions(raw);
+  const engine = await createEngine({ url: opts.url, cdp: opts.cdp });
+  try {
+    const result = await engine.measure(opts.selector, opts.depth, opts.frame);
+    if (opts.pick) {
+      console.log(pickFields(result, opts.pick));
+    } else {
+      console.log(formatMeasureResult(result, opts.format ?? "json"));
+    }
+  } finally {
+    await engine.close();
+  }
+}
+
+// src/commands/screenshot.ts
+import { writeFile, mkdir } from "fs/promises";
+import { dirname } from "path";
+function buildScreenshotOptions(raw) {
+  if (!raw.url) throw new Error("--url is required");
+  return {
+    url: raw.url,
+    selector: raw.selector ? resolveSelector(raw.selector) : void 0,
+    output: raw.output ?? `screenshot-${Date.now()}.png`,
+    fullPage: raw.fullPage ?? false,
+    cdp: raw.cdp
+  };
+}
+async function screenshot(raw) {
+  const opts = buildScreenshotOptions(raw);
+  const engine = await createEngine({ url: opts.url, cdp: opts.cdp });
+  try {
+    const buf = await engine.screenshot({
+      selector: opts.selector,
+      fullPage: opts.fullPage
+    });
+    await mkdir(dirname(opts.output), { recursive: true }).catch(() => {
+    });
+    await writeFile(opts.output, buf);
+    console.log(JSON.stringify({ output: opts.output, bytes: buf.length }));
+  } finally {
+    await engine.close();
+  }
+}
+
+// src/commands/overlay.ts
+import { createServer } from "http";
+import { writeFile as writeFile2, mkdir as mkdir2 } from "fs/promises";
+import { resolve, dirname as dirname2 } from "path";
+import { WebSocketServer } from "ws";
+
+// src/overlay/ui.ts
+function generateOverlayHtml(options) {
+  const {
+    targetUrl,
+    designImageBase64,
+    wsPort,
+    initialOpacity = 50,
+    initialScale = 100,
+    initialOffsetX = 0,
+    initialOffsetY = 0
+  } = options;
+  return `<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<title>designer overlay</title>
+<style>
+  * { margin: 0; padding: 0; box-sizing: border-box; }
+  body { overflow: hidden; background: #1a1a1a; font-family: system-ui, sans-serif; }
+
+  #toolbar {
+    position: fixed; top: 0; left: 0; right: 0; z-index: 100000;
+    background: rgba(0,0,0,0.85); color: #fff; padding: 8px 16px;
+    display: flex; align-items: center; gap: 16px; font-size: 13px;
+    backdrop-filter: blur(8px);
+  }
+  #toolbar label { display: flex; align-items: center; gap: 6px; }
+  #toolbar input[type=range] { width: 120px; }
+  #toolbar .value { min-width: 40px; text-align: right; font-variant-numeric: tabular-nums; }
+  #confirm-btn {
+    margin-left: auto; padding: 6px 20px; background: #22c55e; color: #fff;
+    border: none; border-radius: 6px; font-size: 14px; font-weight: 600;
+    cursor: pointer;
+  }
+  #confirm-btn:hover { background: #16a34a; }
+
+  #viewport {
+    position: fixed; top: 40px; left: 0; right: 0; bottom: 0;
+  }
+  #target-frame {
+    width: 100%; height: 100%; border: none;
+  }
+
+  #overlay-img {
+    position: fixed; top: 40px; left: 0;
+    width: 100vw; height: auto;
+    pointer-events: none; z-index: 99999;
+    transform-origin: top left;
+  }
+  #overlay-img.draggable { pointer-events: auto; cursor: grab; }
+  #overlay-img.dragging { cursor: grabbing; }
+
+  #status {
+    position: fixed; bottom: 12px; right: 12px; z-index: 100001;
+    background: rgba(0,0,0,0.7); color: #aaa; padding: 4px 10px;
+    border-radius: 4px; font-size: 12px;
+  }
+</style>
+</head>
+<body>
+
+<div id="toolbar">
+  <span style="font-weight:600">designer</span>
+  <label>
+    opacity
+    <input type="range" id="opacity-slider" min="0" max="100" value="${initialOpacity}">
+    <span class="value" id="opacity-val">${initialOpacity}%</span>
+  </label>
+  <label>
+    scale
+    <input type="range" id="scale-slider" min="10" max="300" value="${initialScale}">
+    <span class="value" id="scale-val">${initialScale}%</span>
+  </label>
+  <label>
+    <input type="checkbox" id="lock-cb" checked> lock
+  </label>
+  <button id="reset-btn" style="padding:4px 12px;background:#555;color:#fff;border:none;border-radius:4px;cursor:pointer">reset</button>
+  <button id="confirm-btn">confirm</button>
+</div>
+
+<div id="viewport">
+  <iframe id="target-frame" src="${targetUrl}"></iframe>
+</div>
+
+<img id="overlay-img" src="data:image/png;base64,${designImageBase64}">
+
+<div id="status">connecting...</div>
+
+<script>
+(() => {
+  const img = document.getElementById('overlay-img');
+  const opacitySlider = document.getElementById('opacity-slider');
+  const opacityVal = document.getElementById('opacity-val');
+  const scaleSlider = document.getElementById('scale-slider');
+  const scaleVal = document.getElementById('scale-val');
+  const lockCb = document.getElementById('lock-cb');
+  const resetBtn = document.getElementById('reset-btn');
+  const confirmBtn = document.getElementById('confirm-btn');
+  const status = document.getElementById('status');
+
+  let offsetX = ${initialOffsetX}, offsetY = ${initialOffsetY};
+  let scale = ${initialScale} / 100;
+  let opacity = ${initialOpacity} / 100;
+  let isDragging = false, dragStartX = 0, dragStartY = 0, dragStartOX = 0, dragStartOY = 0;
+
+  function updateTransform() {
+    img.style.opacity = String(opacity);
+    img.style.transform = \`translate(\${offsetX}px, \${offsetY}px) scale(\${scale})\`;
+  }
+
+  opacitySlider.addEventListener('input', () => {
+    opacity = opacitySlider.value / 100;
+    opacityVal.textContent = opacitySlider.value + '%';
+    updateTransform();
+  });
+
+  scaleSlider.addEventListener('input', () => {
+    scale = scaleSlider.value / 100;
+    scaleVal.textContent = scaleSlider.value + '%';
+    updateTransform();
+  });
+
+  lockCb.addEventListener('change', () => {
+    img.classList.toggle('draggable', !lockCb.checked);
+  });
+
+  resetBtn.addEventListener('click', () => {
+    offsetX = 0; offsetY = 0; scale = 1; opacity = 0.5;
+    opacitySlider.value = '50'; opacityVal.textContent = '50%';
+    scaleSlider.value = '100'; scaleVal.textContent = '100%';
+    updateTransform();
+  });
+
+  // Drag
+  img.addEventListener('mousedown', (e) => {
+    if (lockCb.checked) return;
+    isDragging = true;
+    dragStartX = e.clientX; dragStartY = e.clientY;
+    dragStartOX = offsetX; dragStartOY = offsetY;
+    img.classList.add('dragging');
+    e.preventDefault();
+  });
+
+  document.addEventListener('mousemove', (e) => {
+    if (!isDragging) return;
+    offsetX = dragStartOX + (e.clientX - dragStartX);
+    offsetY = dragStartOY + (e.clientY - dragStartY);
+    updateTransform();
+  });
+
+  document.addEventListener('mouseup', () => {
+    isDragging = false;
+    img.classList.remove('dragging');
+  });
+
+  // Scroll zoom
+  document.addEventListener('wheel', (e) => {
+    if (lockCb.checked) return;
+    e.preventDefault();
+    const delta = e.deltaY > 0 ? -2 : 2;
+    const newVal = Math.max(10, Math.min(300, parseInt(scaleSlider.value) + delta));
+    scaleSlider.value = String(newVal);
+    scale = newVal / 100;
+    scaleVal.textContent = newVal + '%';
+    updateTransform();
+  }, { passive: false });
+
+  // WebSocket to CLI
+  const ws = new WebSocket('ws://127.0.0.1:${wsPort}');
+  ws.onopen = () => { status.textContent = 'connected'; };
+  ws.onclose = () => { status.textContent = 'disconnected'; };
+
+  confirmBtn.addEventListener('click', () => {
+    const params = { offsetX, offsetY, scale, opacity, scrollY: 0 };
+    // Try to get iframe scroll position
+    try {
+      const frame = document.getElementById('target-frame');
+      params.scrollY = frame.contentWindow.scrollY || 0;
+    } catch(e) {}
+    ws.send(JSON.stringify({ type: 'confirm', params }));
+    status.textContent = 'saved!';
+    confirmBtn.textContent = 'saved!';
+    confirmBtn.style.background = '#666';
+  });
+
+  updateTransform();
+})();
+</script>
+</body>
+</html>`;
+}
+
+// src/commands/overlay.ts
+function buildOverlayOptions(raw) {
+  if (!raw.design) throw new Error("--design is required (path to design screenshot)");
+  if (!raw.url) throw new Error("--url is required (target page URL)");
+  return {
+    designImagePath: resolve(raw.design),
+    targetUrl: raw.url,
+    port: raw.port ? parseInt(raw.port, 10) : 9876,
+    cdp: raw.cdp,
+    output: raw.output,
+    selector: raw.selector ? resolveSelector(raw.selector) : void 0,
+    offsetX: raw.offsetX != null ? parseFloat(raw.offsetX) : void 0,
+    offsetY: raw.offsetY != null ? parseFloat(raw.offsetY) : void 0,
+    scale: raw.scale != null ? parseFloat(raw.scale) : void 0,
+    opacity: raw.opacity != null ? parseFloat(raw.opacity) : void 0,
+    fullPage: raw.fullPage ?? false
+  };
+}
+async function captureGhost(opts, params) {
+  const engine = await createEngine({ url: opts.targetUrl, cdp: opts.cdp });
+  try {
+    await engine.injectOverlay({
+      designImagePath: opts.designImagePath,
+      targetUrl: opts.targetUrl,
+      offsetX: params.offsetX,
+      offsetY: params.offsetY,
+      scale: params.scale,
+      opacity: params.opacity
+    });
+    const buf = await engine.captureOverlay({ fullPage: opts.fullPage });
+    const outputPath = opts.output ?? `overlay-${Date.now()}.png`;
+    await mkdir2(dirname2(resolve(outputPath)), { recursive: true }).catch(() => {
+    });
+    await writeFile2(outputPath, buf);
+    console.log(JSON.stringify({ output: outputPath, bytes: buf.length }));
+  } finally {
+    await engine.close();
+  }
+}
+async function compositeGhost(opts) {
+  const sharp = (await import("sharp")).default;
+  const { tintDesignImage } = await import("./tint-I3FTT23O.js");
+  const engine = await createEngine({ url: opts.targetUrl, cdp: opts.cdp });
+  let elementBuf;
+  try {
+    elementBuf = await engine.screenshot({ selector: opts.selector, fullPage: opts.fullPage });
+  } finally {
+    await engine.close();
+  }
+  const elementMeta = await sharp(elementBuf).metadata();
+  const ew = elementMeta.width;
+  const eh = elementMeta.height;
+  const tintedBuf = await tintDesignImage(opts.designImagePath);
+  const tintedResized = await sharp(tintedBuf).resize(ew, eh, { fit: "contain", background: { r: 0, g: 0, b: 0, alpha: 0 } }).toBuffer();
+  const ghostBuf = await sharp(elementBuf).composite([{ input: tintedResized, blend: "over" }]).png().toBuffer();
+  const outputPath = opts.output ?? `overlay-${Date.now()}.png`;
+  await mkdir2(dirname2(resolve(outputPath)), { recursive: true }).catch(() => {
+  });
+  await writeFile2(outputPath, ghostBuf);
+  console.log(JSON.stringify({ output: outputPath, bytes: ghostBuf.length, selector: opts.selector, elementSize: { width: ew, height: eh } }));
+}
+async function overlay(raw) {
+  const opts = buildOverlayOptions(raw);
+  if (opts.selector) {
+    await compositeGhost(opts);
+    return;
+  }
+  if (opts.offsetX != null || opts.offsetY != null) {
+    await captureGhost(opts, {
+      offsetX: opts.offsetX ?? 0,
+      offsetY: opts.offsetY ?? 0,
+      scale: opts.scale ?? 1,
+      opacity: opts.opacity ?? 1
+    });
+    return;
+  }
+  const { tintDesignImage } = await import("./tint-I3FTT23O.js");
+  const tintedBuf = await tintDesignImage(opts.designImagePath);
+  const imageBase64 = tintedBuf.toString("base64");
+  const wsPort = opts.port + 1;
+  const html = generateOverlayHtml({
+    targetUrl: opts.targetUrl,
+    designImageBase64: imageBase64,
+    wsPort
+  });
+  const server = createServer((req, res) => {
+    res.writeHead(200, { "Content-Type": "text/html; charset=utf-8" });
+    res.end(html);
+  });
+  const wss = new WebSocketServer({ port: wsPort });
+  await new Promise((resolvePromise) => {
+    wss.on("connection", (ws) => {
+      ws.on("message", async (data) => {
+        try {
+          const msg = JSON.parse(data.toString());
+          if (msg.type === "confirm") {
+            console.log(JSON.stringify({ confirmed: true, params: msg.params }));
+            ws.send(JSON.stringify({ type: "saved" }));
+            wss.close();
+            server.close();
+            resolvePromise();
+          }
+        } catch (e) {
+          console.error("WebSocket error:", e);
+        }
+      });
+    });
+    server.listen(opts.port, () => {
+      const url = `http://127.0.0.1:${opts.port}`;
+      console.error(`Overlay UI: ${url}`);
+      console.error("Adjust the overlay, then click confirm.");
+      import("child_process").then(({ exec }) => {
+        const cmd = process.platform === "darwin" ? "open" : process.platform === "win32" ? "start" : "xdg-open";
+        exec(`${cmd} ${url}`);
+      });
+    });
+  });
+}
+
+// src/cli.ts
+var program = new Command();
+program.name("designer").description(
+  "Runtime UI measurement CLI for AI agents: measure CSS/layout, capture screenshots, and build design overlays."
+).version("0.1.0");
+program.addHelpText("after", `
+Workflow (agent):
+  1. measure    Read element bbox and computed CSS as JSON
+  2. screenshot Capture design/runtime component images
+  3. overlay    Compare design image against runtime page
+
+Engine selection:
+  Default: Playwright (launches headless Chromium)
+  --cdp <host:port>: Connect to an existing Chrome/WebView
+
+Examples:
+  $ designer measure --url http://localhost:3000 --selector ".dialog"
+  $ designer measure --url http://127.0.0.1:32767/start.html --frame "#mainFrame" --selector "#u0"
+  $ designer screenshot --url http://localhost:3000 --selector ".dialog" --output runtime.png
+  $ designer overlay --design design.png --url http://localhost:3000 --selector ".dialog" --output overlay.png
+`);
+var measureCmd = program.command("measure").description("Measure an element bbox, computed style, and optional child tree.").requiredOption("--url <url>", "Target page URL").requiredOption("--selector <selector>", "CSS selector to measure; prefix ~ for fuzzy class match").option("--frame <selector>", "Iframe CSS selector; measure --selector inside this frame document").option("--depth <n>", "Child element depth (0=no children)", "1").option("--cdp <host:port>", "CDP endpoint").option("--pick <fields>", "Pick bbox, children, or CSS property names (comma-separated)").option("--format <format>", "Output format: json | table", "json").action(measure);
+measureCmd.addHelpText("after", `
+Output (json):
+  {
+    "selector": ".dialog",
+    "bbox": { "x": 100, "y": 200, "width": 400, "height": 300 },
+    "computedStyle": { "border-radius": "12px", "padding": "24px" },
+    "children": []
+  }
+`);
+program.command("screenshot").description("Capture a PNG screenshot of the full page or a specific element.").requiredOption("--url <url>", "Target page URL").option("--selector <selector>", "CSS selector; captures element only, prefix ~ for fuzzy class match").option("--output <path>", "Output file path (default: screenshot-<timestamp>.png)").option("--full-page", "Capture full scrollable page").option("--cdp <host:port>", "CDP endpoint").action(screenshot);
+var overlayCmd = program.command("overlay").description("Generate a magenta design ghost overlay on top of a live page screenshot.").requiredOption("--design <path>", "Path to design screenshot (PNG/JPG)").requiredOption("--url <url>", "Target page URL").option("--selector <selector>", "CSS selector; composite ghost on element, prefix ~ for fuzzy class match").option("--full-page", "Capture full scrollable page").option("--output <path>", "Output file path (default: overlay-<timestamp>.png)").option("--offset-x <px>", "Horizontal offset of design overlay (full-page mode)").option("--offset-y <px>", "Vertical offset of design overlay (full-page mode)").option("--scale <ratio>", "Scale factor for design overlay (1 = 100%)").option("--opacity <0-1>", "Opacity of design overlay").option("--cdp <host:port>", "CDP endpoint").option("--port <port>", "Local server port for interactive UI", "9876").action(overlay);
+overlayCmd.addHelpText("after", `
+Modes:
+  Selector:
+    $ designer overlay --design design.png --url http://localhost:3000 --selector ".dialog" --output overlay.png
+
+  Direct full-page:
+    $ designer overlay --design spec.png --url http://localhost:3000 --offset-x 0 --offset-y 0 --output overlay.png
+
+  Interactive:
+    $ designer overlay --design spec.png --url http://localhost:3000
+`);
+program.parse();
+//# sourceMappingURL=cli.js.map

package/2designer/dist/cli.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/cli.ts","../src/engine/create-engine.ts","../src/engine/selector.ts","../src/commands/measure.ts","../src/commands/screenshot.ts","../src/commands/overlay.ts","../src/overlay/ui.ts"],"sourcesContent":["import { Command } from 'commander'\nimport { measure } from './commands/measure.js'\nimport { screenshot } from './commands/screenshot.js'\nimport { overlay } from './commands/overlay.js'\n\nconst program = new Command()\n\nprogram\n  .name('designer')\n  .description(\n    'Runtime UI measurement CLI for AI agents: measure CSS/layout, capture screenshots, and build design overlays.',\n  )\n  .version('0.1.0')\n\nprogram.addHelpText('after', `\nWorkflow (agent):\n  1. measure    Read element bbox and computed CSS as JSON\n  2. screenshot Capture design/runtime component images\n  3. overlay    Compare design image against runtime page\n\nEngine selection:\n  Default: Playwright (launches headless Chromium)\n  --cdp <host:port>: Connect to an existing Chrome/WebView\n\nExamples:\n  $ designer measure --url http://localhost:3000 --selector \".dialog\"\n  $ designer measure --url http://127.0.0.1:32767/start.html --frame \"#mainFrame\" --selector \"#u0\"\n  $ designer screenshot --url http://localhost:3000 --selector \".dialog\" --output runtime.png\n  $ designer overlay --design design.png --url http://localhost:3000 --selector \".dialog\" --output overlay.png\n`)\n\nconst measureCmd = program\n  .command('measure')\n  .description('Measure an element bbox, computed style, and optional child tree.')\n  .requiredOption('--url <url>', 'Target page URL')\n  .requiredOption('--selector <selector>', 'CSS selector to measure; prefix ~ for fuzzy class match')\n  .option('--frame <selector>', 'Iframe CSS selector; measure --selector inside this frame document')\n  .option('--depth <n>', 'Child element depth (0=no children)', '1')\n  .option('--cdp <host:port>', 'CDP endpoint')\n  .option('--pick <fields>', 'Pick bbox, children, or CSS property names (comma-separated)')\n  .option('--format <format>', 'Output format: json | table', 'json')\n  .action(measure)\n\nmeasureCmd.addHelpText('after', `\nOutput (json):\n  {\n    \"selector\": \".dialog\",\n    \"bbox\": { \"x\": 100, \"y\": 200, \"width\": 400, \"height\": 300 },\n    \"computedStyle\": { \"border-radius\": \"12px\", \"padding\": \"24px\" },\n    \"children\": []\n  }\n`)\n\nprogram\n  .command('screenshot')\n  .description('Capture a PNG screenshot of the full page or a specific element.')\n  .requiredOption('--url <url>', 'Target page URL')\n  .option('--selector <selector>', 'CSS selector; captures element only, prefix ~ for fuzzy class match')\n  .option('--output <path>', 'Output file path (default: screenshot-<timestamp>.png)')\n  .option('--full-page', 'Capture full scrollable page')\n  .option('--cdp <host:port>', 'CDP endpoint')\n  .action(screenshot)\n\nconst overlayCmd = program\n  .command('overlay')\n  .description('Generate a magenta design ghost overlay on top of a live page screenshot.')\n  .requiredOption('--design <path>', 'Path to design screenshot (PNG/JPG)')\n  .requiredOption('--url <url>', 'Target page URL')\n  .option('--selector <selector>', 'CSS selector; composite ghost on element, prefix ~ for fuzzy class match')\n  .option('--full-page', 'Capture full scrollable page')\n  .option('--output <path>', 'Output file path (default: overlay-<timestamp>.png)')\n  .option('--offset-x <px>', 'Horizontal offset of design overlay (full-page mode)')\n  .option('--offset-y <px>', 'Vertical offset of design overlay (full-page mode)')\n  .option('--scale <ratio>', 'Scale factor for design overlay (1 = 100%)')\n  .option('--opacity <0-1>', 'Opacity of design overlay')\n  .option('--cdp <host:port>', 'CDP endpoint')\n  .option('--port <port>', 'Local server port for interactive UI', '9876')\n  .action(overlay)\n\noverlayCmd.addHelpText('after', `\nModes:\n  Selector:\n    $ designer overlay --design design.png --url http://localhost:3000 --selector \".dialog\" --output overlay.png\n\n  Direct full-page:\n    $ designer overlay --design spec.png --url http://localhost:3000 --offset-x 0 --offset-y 0 --output overlay.png\n\n  Interactive:\n    $ designer overlay --design spec.png --url http://localhost:3000\n`)\n\nprogram.parse()\n","import type { RuntimeEngine } from './types.js'\r\n\r\nexport interface EngineOptions {\r\n  cdp?: string // host:port\r\n  url: string\r\n  viewport?: { width: number; height: number }\r\n  headless?: boolean\r\n}\r\n\r\nexport function resolveEngineType(options: { cdp?: string }): 'cdp' | 'playwright' {\r\n  return options.cdp ? 'cdp' : 'playwright'\r\n}\r\n\r\nexport async function createEngine(options: EngineOptions): Promise<RuntimeEngine> {\r\n  const type = resolveEngineType(options)\r\n\r\n  if (type === 'cdp') {\r\n    const { CdpEngine } = await import('./cdp/cdp-engine.js')\r\n    const [host, portStr] = options.cdp!.split(':')\r\n    const port = parseInt(portStr, 10)\r\n    return CdpEngine.create(host, port, options.url)\r\n  }\r\n\r\n  const { PlaywrightEngine } = await import('./playwright/playwright-engine.js')\r\n  return PlaywrightEngine.create(options.url, {\r\n    headless: options.headless ?? true,\r\n    viewport: options.viewport,\r\n  })\r\n}\r\n","/**\r\n * Resolve selector: if starts with ~, convert to [class*=\"...\"] fuzzy match.\r\n * Returns a standard CSS selector.\r\n */\r\nexport function resolveSelector(input: string): string {\r\n  if (input.startsWith('~')) {\r\n    const keyword = input.slice(1).trim()\r\n    return `[class*=\"${keyword}\"]`\r\n  }\r\n  return input\r\n}\r\n","import type { MeasureResult, ChildElement } from '../engine/types.js'\r\nimport { createEngine } from '../engine/create-engine.js'\r\nimport { resolveSelector } from '../engine/selector.js'\r\n\r\nexport interface MeasureCommandOptions {\n  url: string\n  selector: string\n  frame?: string\n  depth: number\n  cdp?: string\n  format?: 'json' | 'table'\n  pick?: string\n}\r\n\r\nexport function buildMeasureOptions(raw: Record<string, any>): MeasureCommandOptions {\r\n  if (!raw.url) throw new Error('--url is required')\r\n  if (!raw.selector) throw new Error('--selector is required')\r\n  return {\r\n    url: raw.url,\n    selector: resolveSelector(raw.selector),\n    frame: raw.frame ? resolveSelector(raw.frame) : undefined,\n    depth: raw.depth != null ? parseInt(raw.depth, 10) : 1,\n    cdp: raw.cdp,\n    format: raw.format ?? 'json',\n    pick: raw.pick,\r\n  }\r\n}\r\n\r\nexport function formatMeasureResult(result: MeasureResult, format: 'json' | 'table'): string {\r\n  if (format === 'table') {\r\n    const lines: string[] = []\r\n    lines.push(`Selector: ${result.selector}`)\r\n    lines.push(`BBox: x=${result.bbox.x} y=${result.bbox.y} w=${result.bbox.width} h=${result.bbox.height}`)\r\n    lines.push('')\r\n    lines.push('Property'.padEnd(30) + 'Value')\r\n    lines.push('-'.repeat(60))\r\n    for (const [key, val] of Object.entries(result.computedStyle)) {\r\n      lines.push(key.padEnd(30) + val)\r\n    }\r\n    if (result.children?.length) {\r\n      lines.push('')\r\n      lines.push(`Children (${result.children.length}):`)\r\n      function printChildren(children: ChildElement[], indent: number) {\r\n        for (const c of children) {\r\n          const pad = ' '.repeat(indent)\r\n          lines.push(`${pad}<${c.tag}> .${c.className} [${c.bbox.width}x${c.bbox.height}] ${c.text ?? ''}`)\r\n          if (c.children?.length) {\r\n            printChildren(c.children, indent + 2)\r\n          }\r\n        }\r\n      }\r\n      printChildren(result.children, 2)\r\n    }\r\n    return lines.join('\\n')\r\n  }\r\n  return JSON.stringify(result, null, 2)\r\n}\r\n\r\nexport function pickFields(result: MeasureResult, pick: string): string {\r\n  if (pick === 'bbox') return JSON.stringify(result.bbox)\r\n  if (pick === 'children') return JSON.stringify(result.children ?? [])\r\n  // Otherwise treat as comma-separated CSS property names\r\n  const props = pick.split(',').map(p => p.trim())\r\n  const picked: Record<string, string> = {}\r\n  for (const p of props) {\r\n    if (result.computedStyle[p] != null) {\r\n      picked[p] = result.computedStyle[p]\r\n    }\r\n  }\r\n  return JSON.stringify(picked)\r\n}\r\n\r\nexport async function measure(raw: Record<string, any>): Promise<void> {\r\n  const opts = buildMeasureOptions(raw)\r\n  const engine = await createEngine({ url: opts.url, cdp: opts.cdp })\r\n  try {\r\n    const result = await engine.measure(opts.selector, opts.depth, opts.frame)\n    if (opts.pick) {\r\n      console.log(pickFields(result, opts.pick))\r\n    } else {\r\n      console.log(formatMeasureResult(result, opts.format ?? 'json'))\r\n    }\r\n  } finally {\r\n    await engine.close()\r\n  }\r\n}\r\n","import { writeFile, mkdir } from 'fs/promises'\r\nimport { dirname } from 'path'\r\nimport { createEngine } from '../engine/create-engine.js'\r\nimport { resolveSelector } from '../engine/selector.js'\r\n\r\nexport interface ScreenshotCommandOptions {\r\n  url: string\r\n  selector?: string\r\n  output: string\r\n  fullPage?: boolean\r\n  cdp?: string\r\n}\r\n\r\nexport function buildScreenshotOptions(raw: Record<string, any>): ScreenshotCommandOptions {\r\n  if (!raw.url) throw new Error('--url is required')\r\n  return {\r\n    url: raw.url,\r\n    selector: raw.selector ? resolveSelector(raw.selector) : undefined,\r\n    output: raw.output ?? `screenshot-${Date.now()}.png`,\r\n    fullPage: raw.fullPage ?? false,\r\n    cdp: raw.cdp,\r\n  }\r\n}\r\n\r\nexport async function screenshot(raw: Record<string, any>): Promise<void> {\r\n  const opts = buildScreenshotOptions(raw)\r\n  const engine = await createEngine({ url: opts.url, cdp: opts.cdp })\r\n  try {\r\n    const buf = await engine.screenshot({\r\n      selector: opts.selector,\r\n      fullPage: opts.fullPage,\r\n    })\r\n    await mkdir(dirname(opts.output), { recursive: true }).catch(() => {})\r\n    await writeFile(opts.output, buf)\r\n    console.log(JSON.stringify({ output: opts.output, bytes: buf.length }))\r\n  } finally {\r\n    await engine.close()\r\n  }\r\n}\r\n","import { createServer } from 'http'\r\nimport { writeFile, mkdir } from 'fs/promises'\r\nimport { resolve, dirname } from 'path'\r\nimport WebSocket, { WebSocketServer } from 'ws'\r\nimport { generateOverlayHtml } from '../overlay/ui.js'\r\nimport { createEngine } from '../engine/create-engine.js'\r\nimport { resolveSelector } from '../engine/selector.js'\r\n\r\nexport interface OverlayCommandOptions {\r\n  designImagePath: string\r\n  targetUrl: string\r\n  port: number\r\n  cdp?: string\r\n  output?: string\r\n  selector?: string\r\n  fullPage?: boolean\r\n  offsetX?: number\r\n  offsetY?: number\r\n  scale?: number\r\n  opacity?: number\r\n}\r\n\r\nexport function buildOverlayOptions(raw: Record<string, any>): OverlayCommandOptions {\r\n  if (!raw.design) throw new Error('--design is required (path to design screenshot)')\r\n  if (!raw.url) throw new Error('--url is required (target page URL)')\r\n\r\n  return {\r\n    designImagePath: resolve(raw.design),\r\n    targetUrl: raw.url,\r\n    port: raw.port ? parseInt(raw.port, 10) : 9876,\r\n    cdp: raw.cdp,\r\n    output: raw.output,\r\n    selector: raw.selector ? resolveSelector(raw.selector) : undefined,\r\n    offsetX: raw.offsetX != null ? parseFloat(raw.offsetX) : undefined,\r\n    offsetY: raw.offsetY != null ? parseFloat(raw.offsetY) : undefined,\r\n    scale: raw.scale != null ? parseFloat(raw.scale) : undefined,\r\n    opacity: raw.opacity != null ? parseFloat(raw.opacity) : undefined,\r\n    fullPage: raw.fullPage ?? false,\r\n  }\r\n}\r\n\r\nasync function captureGhost(opts: OverlayCommandOptions, params: { offsetX: number; offsetY: number; scale: number; opacity: number }): Promise<void> {\r\n  const engine = await createEngine({ url: opts.targetUrl, cdp: opts.cdp })\r\n  try {\r\n    await engine.injectOverlay({\r\n      designImagePath: opts.designImagePath,\r\n      targetUrl: opts.targetUrl,\r\n      offsetX: params.offsetX,\r\n      offsetY: params.offsetY,\r\n      scale: params.scale,\r\n      opacity: params.opacity,\r\n    })\r\n    const buf = await engine.captureOverlay({ fullPage: opts.fullPage })\r\n    const outputPath = opts.output ?? `overlay-${Date.now()}.png`\r\n    await mkdir(dirname(resolve(outputPath)), { recursive: true }).catch(() => {})\r\n    await writeFile(outputPath, buf)\r\n    console.log(JSON.stringify({ output: outputPath, bytes: buf.length }))\r\n  } finally {\r\n    await engine.close()\r\n  }\r\n}\r\n\r\n/**\r\n * Selector mode: screenshot element + Sharp composite with tinted design.\r\n * No CSS positioning — pure pixel-level compositing for zero precision loss.\r\n */\r\nasync function compositeGhost(opts: OverlayCommandOptions): Promise<void> {\r\n  const sharp = (await import('sharp')).default\r\n  const { tintDesignImage } = await import('../overlay/tint.js')\r\n\r\n  const engine = await createEngine({ url: opts.targetUrl, cdp: opts.cdp })\r\n  let elementBuf: Buffer\r\n  try {\r\n    elementBuf = await engine.screenshot({ selector: opts.selector, fullPage: opts.fullPage })\r\n  } finally {\r\n    await engine.close()\r\n  }\r\n\r\n  const elementMeta = await sharp(elementBuf).metadata()\r\n  const ew = elementMeta.width!\r\n  const eh = elementMeta.height!\r\n\r\n  const tintedBuf = await tintDesignImage(opts.designImagePath)\r\n  const tintedResized = await sharp(tintedBuf)\r\n    .resize(ew, eh, { fit: 'contain', background: { r: 0, g: 0, b: 0, alpha: 0 } })\r\n    .toBuffer()\r\n\r\n  const ghostBuf = await sharp(elementBuf)\r\n    .composite([{ input: tintedResized, blend: 'over' }])\r\n    .png()\r\n    .toBuffer()\r\n\r\n  const outputPath = opts.output ?? `overlay-${Date.now()}.png`\r\n  await mkdir(dirname(resolve(outputPath)), { recursive: true }).catch(() => {})\r\n  await writeFile(outputPath, ghostBuf)\r\n  console.log(JSON.stringify({ output: outputPath, bytes: ghostBuf.length, selector: opts.selector, elementSize: { width: ew, height: eh } }))\r\n}\r\n\r\nexport async function overlay(raw: Record<string, any>): Promise<void> {\r\n  const opts = buildOverlayOptions(raw)\r\n\r\n  // Selector mode — Sharp composite, pixel-precise\r\n  if (opts.selector) {\r\n    await compositeGhost(opts)\r\n    return\r\n  }\r\n\r\n  // Direct params — headless, no interaction\r\n  if (opts.offsetX != null || opts.offsetY != null) {\r\n    await captureGhost(opts, {\r\n      offsetX: opts.offsetX ?? 0,\r\n      offsetY: opts.offsetY ?? 0,\r\n      scale: opts.scale ?? 1,\r\n      opacity: opts.opacity ?? 1,\r\n    })\r\n    return\r\n  }\r\n\r\n  // Interactive alignment UI\r\n  const { tintDesignImage } = await import('../overlay/tint.js')\r\n  const tintedBuf = await tintDesignImage(opts.designImagePath)\r\n  const imageBase64 = tintedBuf.toString('base64')\r\n  const wsPort = opts.port + 1\r\n\r\n  const html = generateOverlayHtml({\r\n    targetUrl: opts.targetUrl,\r\n    designImageBase64: imageBase64,\r\n    wsPort,\r\n  })\r\n\r\n  const server = createServer((req, res) => {\r\n    res.writeHead(200, { 'Content-Type': 'text/html; charset=utf-8' })\r\n    res.end(html)\r\n  })\r\n\r\n  const wss = new WebSocketServer({ port: wsPort })\r\n\r\n  await new Promise<void>((resolvePromise) => {\r\n    wss.on('connection', (ws) => {\r\n      ws.on('message', async (data) => {\r\n        try {\r\n          const msg = JSON.parse(data.toString())\r\n          if (msg.type === 'confirm') {\r\n            console.log(JSON.stringify({ confirmed: true, params: msg.params }))\r\n            ws.send(JSON.stringify({ type: 'saved' }))\r\n            wss.close()\r\n            server.close()\r\n            resolvePromise()\r\n          }\r\n        } catch (e) {\r\n          console.error('WebSocket error:', e)\r\n        }\r\n      })\r\n    })\r\n\r\n    server.listen(opts.port, () => {\r\n      const url = `http://127.0.0.1:${opts.port}`\r\n      console.error(`Overlay UI: ${url}`)\r\n      console.error('Adjust the overlay, then click confirm.')\r\n      import('child_process').then(({ exec }) => {\r\n        const cmd = process.platform === 'darwin' ? 'open' : process.platform === 'win32' ? 'start' : 'xdg-open'\r\n        exec(`${cmd} ${url}`)\r\n      })\r\n    })\r\n  })\r\n}\r\n","export interface OverlayHtmlOptions {\r\n  targetUrl: string\r\n  designImageBase64: string\r\n  wsPort: number\r\n  initialOpacity?: number\r\n  initialScale?: number\r\n  initialOffsetX?: number\r\n  initialOffsetY?: number\r\n}\r\n\r\nexport function generateOverlayHtml(options: OverlayHtmlOptions): string {\r\n  const {\r\n    targetUrl,\r\n    designImageBase64,\r\n    wsPort,\r\n    initialOpacity = 50,\r\n    initialScale = 100,\r\n    initialOffsetX = 0,\r\n    initialOffsetY = 0,\r\n  } = options\r\n\r\n  return `<!DOCTYPE html>\r\n<html lang=\"en\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<title>designer overlay</title>\r\n<style>\r\n  * { margin: 0; padding: 0; box-sizing: border-box; }\r\n  body { overflow: hidden; background: #1a1a1a; font-family: system-ui, sans-serif; }\r\n\r\n  #toolbar {\r\n    position: fixed; top: 0; left: 0; right: 0; z-index: 100000;\r\n    background: rgba(0,0,0,0.85); color: #fff; padding: 8px 16px;\r\n    display: flex; align-items: center; gap: 16px; font-size: 13px;\r\n    backdrop-filter: blur(8px);\r\n  }\r\n  #toolbar label { display: flex; align-items: center; gap: 6px; }\r\n  #toolbar input[type=range] { width: 120px; }\r\n  #toolbar .value { min-width: 40px; text-align: right; font-variant-numeric: tabular-nums; }\r\n  #confirm-btn {\r\n    margin-left: auto; padding: 6px 20px; background: #22c55e; color: #fff;\r\n    border: none; border-radius: 6px; font-size: 14px; font-weight: 600;\r\n    cursor: pointer;\r\n  }\r\n  #confirm-btn:hover { background: #16a34a; }\r\n\r\n  #viewport {\r\n    position: fixed; top: 40px; left: 0; right: 0; bottom: 0;\r\n  }\r\n  #target-frame {\r\n    width: 100%; height: 100%; border: none;\r\n  }\r\n\r\n  #overlay-img {\r\n    position: fixed; top: 40px; left: 0;\r\n    width: 100vw; height: auto;\r\n    pointer-events: none; z-index: 99999;\r\n    transform-origin: top left;\r\n  }\r\n  #overlay-img.draggable { pointer-events: auto; cursor: grab; }\r\n  #overlay-img.dragging { cursor: grabbing; }\r\n\r\n  #status {\r\n    position: fixed; bottom: 12px; right: 12px; z-index: 100001;\r\n    background: rgba(0,0,0,0.7); color: #aaa; padding: 4px 10px;\r\n    border-radius: 4px; font-size: 12px;\r\n  }\r\n</style>\r\n</head>\r\n<body>\r\n\r\n<div id=\"toolbar\">\r\n  <span style=\"font-weight:600\">designer</span>\r\n  <label>\r\n    opacity\r\n    <input type=\"range\" id=\"opacity-slider\" min=\"0\" max=\"100\" value=\"${initialOpacity}\">\r\n    <span class=\"value\" id=\"opacity-val\">${initialOpacity}%</span>\r\n  </label>\r\n  <label>\r\n    scale\r\n    <input type=\"range\" id=\"scale-slider\" min=\"10\" max=\"300\" value=\"${initialScale}\">\r\n    <span class=\"value\" id=\"scale-val\">${initialScale}%</span>\r\n  </label>\r\n  <label>\r\n    <input type=\"checkbox\" id=\"lock-cb\" checked> lock\r\n  </label>\r\n  <button id=\"reset-btn\" style=\"padding:4px 12px;background:#555;color:#fff;border:none;border-radius:4px;cursor:pointer\">reset</button>\r\n  <button id=\"confirm-btn\">confirm</button>\r\n</div>\r\n\r\n<div id=\"viewport\">\r\n  <iframe id=\"target-frame\" src=\"${targetUrl}\"></iframe>\r\n</div>\r\n\r\n<img id=\"overlay-img\" src=\"data:image/png;base64,${designImageBase64}\">\r\n\r\n<div id=\"status\">connecting...</div>\r\n\r\n<script>\r\n(() => {\r\n  const img = document.getElementById('overlay-img');\r\n  const opacitySlider = document.getElementById('opacity-slider');\r\n  const opacityVal = document.getElementById('opacity-val');\r\n  const scaleSlider = document.getElementById('scale-slider');\r\n  const scaleVal = document.getElementById('scale-val');\r\n  const lockCb = document.getElementById('lock-cb');\r\n  const resetBtn = document.getElementById('reset-btn');\r\n  const confirmBtn = document.getElementById('confirm-btn');\r\n  const status = document.getElementById('status');\r\n\r\n  let offsetX = ${initialOffsetX}, offsetY = ${initialOffsetY};\r\n  let scale = ${initialScale} / 100;\r\n  let opacity = ${initialOpacity} / 100;\r\n  let isDragging = false, dragStartX = 0, dragStartY = 0, dragStartOX = 0, dragStartOY = 0;\r\n\r\n  function updateTransform() {\r\n    img.style.opacity = String(opacity);\r\n    img.style.transform = \\`translate(\\${offsetX}px, \\${offsetY}px) scale(\\${scale})\\`;\r\n  }\r\n\r\n  opacitySlider.addEventListener('input', () => {\r\n    opacity = opacitySlider.value / 100;\r\n    opacityVal.textContent = opacitySlider.value + '%';\r\n    updateTransform();\r\n  });\r\n\r\n  scaleSlider.addEventListener('input', () => {\r\n    scale = scaleSlider.value / 100;\r\n    scaleVal.textContent = scaleSlider.value + '%';\r\n    updateTransform();\r\n  });\r\n\r\n  lockCb.addEventListener('change', () => {\r\n    img.classList.toggle('draggable', !lockCb.checked);\r\n  });\r\n\r\n  resetBtn.addEventListener('click', () => {\r\n    offsetX = 0; offsetY = 0; scale = 1; opacity = 0.5;\r\n    opacitySlider.value = '50'; opacityVal.textContent = '50%';\r\n    scaleSlider.value = '100'; scaleVal.textContent = '100%';\r\n    updateTransform();\r\n  });\r\n\r\n  // Drag\r\n  img.addEventListener('mousedown', (e) => {\r\n    if (lockCb.checked) return;\r\n    isDragging = true;\r\n    dragStartX = e.clientX; dragStartY = e.clientY;\r\n    dragStartOX = offsetX; dragStartOY = offsetY;\r\n    img.classList.add('dragging');\r\n    e.preventDefault();\r\n  });\r\n\r\n  document.addEventListener('mousemove', (e) => {\r\n    if (!isDragging) return;\r\n    offsetX = dragStartOX + (e.clientX - dragStartX);\r\n    offsetY = dragStartOY + (e.clientY - dragStartY);\r\n    updateTransform();\r\n  });\r\n\r\n  document.addEventListener('mouseup', () => {\r\n    isDragging = false;\r\n    img.classList.remove('dragging');\r\n  });\r\n\r\n  // Scroll zoom\r\n  document.addEventListener('wheel', (e) => {\r\n    if (lockCb.checked) return;\r\n    e.preventDefault();\r\n    const delta = e.deltaY > 0 ? -2 : 2;\r\n    const newVal = Math.max(10, Math.min(300, parseInt(scaleSlider.value) + delta));\r\n    scaleSlider.value = String(newVal);\r\n    scale = newVal / 100;\r\n    scaleVal.textContent = newVal + '%';\r\n    updateTransform();\r\n  }, { passive: false });\r\n\r\n  // WebSocket to CLI\r\n  const ws = new WebSocket('ws://127.0.0.1:${wsPort}');\r\n  ws.onopen = () => { status.textContent = 'connected'; };\r\n  ws.onclose = () => { status.textContent = 'disconnected'; };\r\n\r\n  confirmBtn.addEventListener('click', () => {\r\n    const params = { offsetX, offsetY, scale, opacity, scrollY: 0 };\r\n    // Try to get iframe scroll position\r\n    try {\r\n      const frame = document.getElementById('target-frame');\r\n      params.scrollY = frame.contentWindow.scrollY || 0;\r\n    } catch(e) {}\r\n    ws.send(JSON.stringify({ type: 'confirm', params }));\r\n    status.textContent = 'saved!';\r\n    confirmBtn.textContent = 'saved!';\r\n    confirmBtn.style.background = '#666';\r\n  });\r\n\r\n  updateTransform();\r\n})();\r\n</script>\r\n</body>\r\n</html>`\r\n}\r\n"],"mappings":"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","names":["printChildren","writeFile","mkdir","dirname","mkdir","dirname","writeFile"]}