rune-grab 0.1.0

package/dist/react.js

@@ -0,0 +1,1778 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+
+// src/core/screenshot.ts
+async function getStream() {
+  if (activeStream) {
+    const tracks = activeStream.getVideoTracks();
+    if (tracks.length > 0 && tracks[0].readyState === "live") {
+      return activeStream;
+    }
+    activeStream = null;
+  }
+  try {
+    activeStream = await navigator.mediaDevices.getDisplayMedia({
+      video: {
+        preferCurrentTab: true
+      },
+      audio: false
+    });
+    activeStream.getVideoTracks()[0].addEventListener("ended", () => {
+      activeStream = null;
+    });
+    return activeStream;
+  } catch {
+    return null;
+  }
+}
+async function captureFromStream(stream, rect, format, quality) {
+  const video = document.createElement("video");
+  video.srcObject = stream;
+  video.muted = true;
+  video.playsInline = true;
+  await new Promise((resolve, reject) => {
+    video.onloadedmetadata = () => {
+      video.play().then(resolve).catch(reject);
+    };
+    video.onerror = reject;
+  });
+  await new Promise((r) => requestAnimationFrame(r));
+  await new Promise((r) => requestAnimationFrame(r));
+  const track = stream.getVideoTracks()[0];
+  const settings = track.getSettings();
+  const videoW = settings.width || video.videoWidth;
+  const videoH = settings.height || video.videoHeight;
+  const scaleX = videoW / window.innerWidth;
+  const scaleY = videoH / window.innerHeight;
+  const sx = rect.left * scaleX;
+  const sy = rect.top * scaleY;
+  const sw = rect.width * scaleX;
+  const sh = rect.height * scaleY;
+  const dpr = window.devicePixelRatio || 1;
+  const canvas = document.createElement("canvas");
+  canvas.width = rect.width * dpr;
+  canvas.height = rect.height * dpr;
+  const ctx = canvas.getContext("2d");
+  ctx.drawImage(video, sx, sy, sw, sh, 0, 0, canvas.width, canvas.height);
+  video.pause();
+  video.srcObject = null;
+  return canvas.toDataURL(format, quality);
+}
+async function captureRect(rect, format = "image/png", quality = 0.92) {
+  if (rect.width === 0 || rect.height === 0) return null;
+  try {
+    const domRect = new DOMRect(rect.x, rect.y, rect.width, rect.height);
+    if (customProvider) {
+      return await customProvider(domRect);
+    }
+    const stream = await getStream();
+    if (stream) {
+      return await captureFromStream(stream, domRect, format, quality);
+    }
+    console.warn("[rune-grab] No screenshot method available. Use setCaptureProvider() for Electron apps.");
+    return null;
+  } catch (err) {
+    console.warn("[rune-grab] Screenshot capture failed:", err);
+    return null;
+  }
+}
+function releaseStream() {
+  if (activeStream) {
+    activeStream.getTracks().forEach((t) => t.stop());
+    activeStream = null;
+  }
+}
+var customProvider, activeStream;
+var init_screenshot = __esm({
+  "src/core/screenshot.ts"() {
+    "use strict";
+    customProvider = null;
+    activeStream = null;
+  }
+});
+
+// src/targets/clipboard.ts
+async function copyToClipboard(result) {
+  try {
+    const items = {};
+    items["text/plain"] = new Blob([result.text], { type: "text/plain" });
+    if (result.image) {
+      const response = await fetch(result.image);
+      const imageBlob = await response.blob();
+      items["image/png"] = imageBlob;
+    }
+    await navigator.clipboard.write([
+      new ClipboardItem(items)
+    ]);
+    return true;
+  } catch {
+    try {
+      const textarea = document.createElement("textarea");
+      textarea.value = result.text;
+      textarea.style.position = "fixed";
+      textarea.style.opacity = "0";
+      document.body.appendChild(textarea);
+      textarea.select();
+      document.execCommand("copy");
+      document.body.removeChild(textarea);
+      return true;
+    } catch {
+      return false;
+    }
+  }
+}
+var init_clipboard = __esm({
+  "src/targets/clipboard.ts"() {
+    "use strict";
+  }
+});
+
+// src/targets/app.ts
+async function isHelperRunning() {
+  try {
+    const ac = new AbortController();
+    const timer = setTimeout(() => ac.abort(), 500);
+    const res = await fetch(`http://127.0.0.1:${HELPER_PORT}/health`, {
+      signal: ac.signal
+    });
+    clearTimeout(timer);
+    return res.ok;
+  } catch {
+    return false;
+  }
+}
+async function sendToHelper(target, result) {
+  try {
+    const res = await fetch(`http://127.0.0.1:${HELPER_PORT}/paste`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({
+        target,
+        text: result.text,
+        image: result.image ?? null,
+        label: result.label
+      })
+    });
+    return res.ok;
+  } catch {
+    return false;
+  }
+}
+async function sendToApp(target, result) {
+  await copyToClipboard(result);
+  if (target === "clipboard") {
+    return { success: true, method: "clipboard" };
+  }
+  const helperUp = await isHelperRunning();
+  if (helperUp) {
+    const ok = await sendToHelper(target, result);
+    if (ok) return { success: true, method: "auto" };
+  }
+  return { success: true, method: "clipboard" };
+}
+var HELPER_PORT;
+var init_app = __esm({
+  "src/targets/app.ts"() {
+    "use strict";
+    init_clipboard();
+    HELPER_PORT = 19274;
+  }
+});
+
+// src/core/state.ts
+var isMac, DEFAULTS, s;
+var init_state = __esm({
+  "src/core/state.ts"() {
+    "use strict";
+    isMac = typeof navigator !== "undefined" && /Mac|iPhone|iPad/.test(navigator.platform);
+    DEFAULTS = {
+      shortcut: isMac ? "Meta+Shift+G" : "Ctrl+Shift+G",
+      target: "clipboard",
+      accentColor: "#f5f5f5",
+      maxStackDepth: 3,
+      onGrab: () => {
+      },
+      onToggle: () => {
+      },
+      showTargetPicker: true,
+      skipComponents: []
+    };
+    s = {
+      initialized: false,
+      active: false,
+      locked: false,
+      promptMode: false,
+      menuExpanded: false,
+      targetsExpanded: false,
+      grabType: "screenshot",
+      autoPasteEnabled: false,
+      helperAvailable: false,
+      helperChecking: false,
+      dockedEdge: null,
+      selectedElement: null,
+      mmRAF: 0,
+      config: { ...DEFAULTS },
+      customSkipSet: void 0,
+      miniMenu: null,
+      overlay: null,
+      label: null,
+      toolbar: null,
+      cursorStyle: null,
+      selectionBox: null,
+      ssDrawing: false,
+      ssStartX: 0,
+      ssStartY: 0,
+      lastMouseX: 0,
+      lastMouseY: 0,
+      dragging: false,
+      dragPending: false,
+      dragStartX: 0,
+      dragStartY: 0,
+      hasDragged: false,
+      dragW: 0,
+      dragH: 0,
+      dragBaseX: 0,
+      dragBaseY: 0,
+      dragPointerId: -1,
+      dragLastX: 0,
+      dragLastY: 0
+    };
+  }
+});
+
+// src/core/constants.ts
+function isLibraryFile(filePath) {
+  return filePath.includes("node_modules");
+}
+function isSourceFile(filePath) {
+  if (!filePath) return false;
+  if (isLibraryFile(filePath)) return false;
+  if (filePath.startsWith("webpack-internal:///node_modules/")) return false;
+  return true;
+}
+var SKIP_PREFIXES, STYLE_PROPS, STYLE_DEFAULTS, KEEP_ATTRS, Z_OVERLAY, Z_TOOLBAR, OWN_IDS, DRAG_THRESHOLD_PX, HELPER_PORT2, HEALTH_CHECK_TIMEOUT_MS, FLASH_VISIBLE_MS, FLASH_REMOVE_MS, LS_KEY;
+var init_constants = __esm({
+  "src/core/constants.ts"() {
+    "use strict";
+    SKIP_PREFIXES = ["_", "$", "Styled(", "motion(", "chakra(", "withRouter(", "connect(", "styled.", "styled(", "tw.", "rc-", "__"];
+    STYLE_PROPS = [
+      "display",
+      "position",
+      "overflow",
+      "width",
+      "height",
+      "minWidth",
+      "minHeight",
+      "maxWidth",
+      "maxHeight",
+      "flexDirection",
+      "flexWrap",
+      "justifyContent",
+      "alignItems",
+      "alignSelf",
+      "gap",
+      "gridTemplateColumns",
+      "gridTemplateRows",
+      "padding",
+      "margin",
+      "fontSize",
+      "fontWeight",
+      "fontFamily",
+      "lineHeight",
+      "letterSpacing",
+      "textAlign",
+      "textTransform",
+      "color",
+      "backgroundColor",
+      "backgroundImage",
+      "borderRadius",
+      "boxShadow",
+      "borderWidth",
+      "borderStyle",
+      "borderColor",
+      "opacity",
+      "transform",
+      "filter",
+      "backdropFilter",
+      "objectFit"
+    ];
+    STYLE_DEFAULTS = /* @__PURE__ */ new Set([
+      "block",
+      "inline",
+      "none",
+      "normal",
+      "auto",
+      "0px",
+      "transparent",
+      "rgba(0, 0, 0, 0)",
+      "start",
+      "visible",
+      "static",
+      "row",
+      "stretch",
+      "0px 0px 0px 0px",
+      "baseline"
+    ]);
+    KEEP_ATTRS = ["type", "href", "src", "alt", "role", "aria-label", "placeholder", "name", "id", "data-testid"];
+    Z_OVERLAY = 2147483640;
+    Z_TOOLBAR = 2147483641;
+    OWN_IDS = ["__rune-grab-overlay__", "__rune-grab-label__", "__rune-grab-toolbar__", "__rune-grab-menu__", "__rune-grab-selection__"];
+    DRAG_THRESHOLD_PX = 4;
+    HELPER_PORT2 = 19274;
+    HEALTH_CHECK_TIMEOUT_MS = 800;
+    FLASH_VISIBLE_MS = 1e3;
+    FLASH_REMOVE_MS = 1200;
+    LS_KEY = "__rune-grab-autopaste__";
+  }
+});
+
+// src/ui/styles.ts
+var FONT, MONO, M_BG, M_FG, M_FG_DIM, M_BORDER, M_HOVER, M_ACTIVE_BG, M_ACTIVE_FG, ICON_SS, ICON_REF, ICON_X, ICON_CHEVRON_RIGHT, ICON_CHEVRON_LEFT, ICON_SEND, ICON_GRIP, TARGET_LABELS, TARGETS_CLIPBOARD, TARGETS_APPS;
+var init_styles = __esm({
+  "src/ui/styles.ts"() {
+    "use strict";
+    FONT = `-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif`;
+    MONO = `ui-monospace,SFMono-Regular,Menlo,monospace`;
+    M_BG = "#f5f5f5";
+    M_FG = "#171717";
+    M_FG_DIM = "#737373";
+    M_BORDER = "#e5e5e5";
+    M_HOVER = "#ebebeb";
+    M_ACTIVE_BG = "#171717";
+    M_ACTIVE_FG = "#f5f5f5";
+    ICON_SS = `<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>`;
+    ICON_REF = `<svg width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>`;
+    ICON_X = `<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>`;
+    ICON_CHEVRON_RIGHT = `<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>`;
+    ICON_CHEVRON_LEFT = `<svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>`;
+    ICON_SEND = '<svg width="10" height="10" viewBox="0 0 448 512" fill="currentColor"><path d="M34.9 289.5l-22.2-22.2c-9.4-9.4-9.4-24.6 0-33.9L207 39c9.4-9.4 24.6-9.4 33.9 0l194.3 194.3c9.4 9.4 9.4 24.6 0 33.9L413 289.4c-9.5 9.5-25 9.3-34.3-.4L264.5 168.6V456c0 13.3-10.7 24-24 24h-32c-13.3 0-24-10.7-24-24V168.6L70.2 289.1c-9.3 9.8-24.8 10-34.3.4z"/></svg>';
+    ICON_GRIP = `<svg width="6" height="10" viewBox="0 0 6 10" fill="currentColor"><circle cx="1" cy="1" r="1"/><circle cx="5" cy="1" r="1"/><circle cx="1" cy="5" r="1"/><circle cx="5" cy="5" r="1"/><circle cx="1" cy="9" r="1"/><circle cx="5" cy="9" r="1"/></svg>`;
+    TARGET_LABELS = {
+      clipboard: "Clipboard",
+      claude: "Claude",
+      cursor: "Cursor",
+      codex: "Codex",
+      "claude-code": "CLI"
+    };
+    TARGETS_CLIPBOARD = ["clipboard"];
+    TARGETS_APPS = ["claude", "cursor", "codex", "claude-code"];
+  }
+});
+
+// src/ui/menu.ts
+function setMenuCallbacks(activate2, deactivate2) {
+  _activate = activate2;
+  _deactivate = deactivate2;
+}
+function loadAutoPastePref() {
+  try {
+    return localStorage.getItem(LS_KEY) === "1";
+  } catch {
+    return false;
+  }
+}
+function saveAutoPastePref(v) {
+  try {
+    localStorage.setItem(LS_KEY, v ? "1" : "0");
+  } catch {
+  }
+}
+async function checkHelper() {
+  try {
+    const ac = new AbortController();
+    const timer = setTimeout(() => ac.abort(), HEALTH_CHECK_TIMEOUT_MS);
+    const res = await fetch(`http://127.0.0.1:${HELPER_PORT2}/health`, {
+      signal: ac.signal
+    });
+    clearTimeout(timer);
+    return res.ok;
+  } catch {
+    return false;
+  }
+}
+async function onAutoPasteToggle(enabled) {
+  s.autoPasteEnabled = enabled;
+  saveAutoPastePref(enabled);
+  if (enabled) {
+    s.helperChecking = true;
+    renderMiniMenu();
+    s.helperAvailable = await checkHelper();
+    s.helperChecking = false;
+    if (!s.helperAvailable) {
+      s.config.target = "clipboard";
+    }
+  } else {
+    s.helperAvailable = false;
+    s.config.target = "clipboard";
+  }
+  renderMiniMenu();
+}
+function buildToggle(on, onChange) {
+  const wrap = document.createElement("div");
+  wrap.style.cssText = `display:inline-flex;align-items:center;flex-shrink:0;`;
+  const track = document.createElement("div");
+  track.style.cssText = `
+    width:28px;height:16px;border-radius:8px;cursor:pointer;
+    transition:background 0.15s;position:relative;
+    background:${on ? M_ACTIVE_BG : "#d4d4d4"};
+  `;
+  const thumb = document.createElement("div");
+  thumb.style.cssText = `
+    width:12px;height:12px;border-radius:50%;
+    background:${on ? M_ACTIVE_FG : "#fff"};
+    position:absolute;top:2px;transition:left 0.15s;
+    left:${on ? "14px" : "2px"};
+    box-shadow:0 1px 2px rgba(0,0,0,0.15);
+  `;
+  track.appendChild(thumb);
+  track.addEventListener("click", (e) => {
+    e.stopPropagation();
+    onChange(!on);
+  });
+  wrap.appendChild(track);
+  return wrap;
+}
+function grabIconBtn(icon, isActive2, onClick) {
+  const btn = document.createElement("button");
+  btn.innerHTML = icon;
+  btn.style.cssText = `
+    width:28px;height:28px;border:none;border-radius:6px;cursor:pointer;
+    display:flex;align-items:center;justify-content:center;padding:0;
+    transition:all 0.15s;
+    background:${isActive2 ? M_ACTIVE_BG : "transparent"};
+    color:${isActive2 ? M_ACTIVE_FG : M_FG_DIM};
+  `;
+  btn.addEventListener("mouseenter", () => {
+    if (!isActive2) {
+      btn.style.background = M_HOVER;
+      btn.style.color = M_FG;
+    }
+  });
+  btn.addEventListener("mouseleave", () => {
+    if (!isActive2) {
+      btn.style.background = "transparent";
+      btn.style.color = M_FG_DIM;
+    }
+  });
+  btn.addEventListener("click", (e) => {
+    e.stopPropagation();
+    e.preventDefault();
+    onClick();
+  });
+  return btn;
+}
+function sep() {
+  const d = document.createElement("div");
+  d.style.cssText = `width:1px;height:16px;background:${M_BORDER};margin:0 2px;flex-shrink:0;`;
+  return d;
+}
+function onGripPointerDown(e) {
+  if (e.button !== 0 || !s.menuExpanded || !s.miniMenu) return;
+  e.preventDefault();
+  const grip = e.currentTarget;
+  grip.setPointerCapture(e.pointerId);
+  s.dragPointerId = e.pointerId;
+  s.dragStartX = e.clientX;
+  s.dragStartY = e.clientY;
+  s.dragPending = true;
+  s.dragging = false;
+  const rect = s.miniMenu.getBoundingClientRect();
+  s.dragW = rect.width;
+  s.dragH = rect.height;
+  if (!s.hasDragged) {
+    s.miniMenu.style.top = rect.top + "px";
+    s.miniMenu.style.left = rect.left + "px";
+    s.miniMenu.style.bottom = "auto";
+    s.miniMenu.style.right = "auto";
+    s.hasDragged = true;
+  }
+  s.dragBaseX = parseFloat(s.miniMenu.style.left) || rect.left;
+  s.dragBaseY = parseFloat(s.miniMenu.style.top) || rect.top;
+  s.dragLastX = s.dragBaseX;
+  s.dragLastY = s.dragBaseY;
+}
+function onGripPointerMove(e) {
+  if (e.pointerId !== s.dragPointerId || !s.miniMenu) return;
+  if (!s.dragPending && !s.dragging) return;
+  const dx = e.clientX - s.dragStartX;
+  const dy = e.clientY - s.dragStartY;
+  if (s.dragPending && !s.dragging) {
+    if (Math.abs(dx) < DRAG_THRESHOLD_PX && Math.abs(dy) < DRAG_THRESHOLD_PX) return;
+    s.dragging = true;
+    s.dragPending = false;
+    s.miniMenu.style.transition = "none";
+    s.miniMenu.style.willChange = "left, top";
+    document.body.style.cursor = "grabbing";
+    document.body.style.userSelect = "none";
+  }
+  if (s.dragging) {
+    const vw = document.documentElement.clientWidth;
+    const vh = document.documentElement.clientHeight;
+    s.dragLastX = Math.max(0, Math.min(s.dragBaseX + dx, vw - s.dragW));
+    s.dragLastY = Math.max(0, Math.min(s.dragBaseY + dy, vh - s.dragH));
+    s.miniMenu.style.left = s.dragLastX + "px";
+    s.miniMenu.style.top = s.dragLastY + "px";
+  }
+}
+function onGripPointerUp(e) {
+  if (e.pointerId !== s.dragPointerId || !s.miniMenu) return;
+  s.dragPointerId = -1;
+  document.body.style.cursor = "";
+  document.body.style.userSelect = "";
+  if (s.dragging) {
+    s.dragging = false;
+    s.miniMenu.style.willChange = "";
+    s.miniMenu.style.transition = "left 0.15s ease, top 0.15s ease";
+    s.miniMenu.style.pointerEvents = "none";
+    requestAnimationFrame(() => {
+      if (s.miniMenu) s.miniMenu.style.pointerEvents = "";
+    });
+  }
+  s.dragPending = false;
+}
+function snapToNearestEdge() {
+  if (!s.miniMenu) return;
+  const rect = s.miniMenu.getBoundingClientRect();
+  const cx = rect.left + rect.width / 2;
+  const cy = rect.top + rect.height / 2;
+  const vw = document.documentElement.clientWidth;
+  const vh = document.documentElement.clientHeight;
+  const distTop = cy;
+  const distBottom = vh - cy;
+  const distLeft = cx;
+  const distRight = vw - cx;
+  const minDist = Math.min(distTop, distBottom, distLeft, distRight);
+  if (minDist === distTop) s.dockedEdge = "top";
+  else if (minDist === distBottom) s.dockedEdge = "bottom";
+  else if (minDist === distLeft) s.dockedEdge = "left";
+  else s.dockedEdge = "right";
+  s.miniMenu.style.transition = "none";
+  renderMiniMenu();
+  requestAnimationFrame(() => {
+    if (!s.miniMenu) return;
+    const tabRect = s.miniMenu.getBoundingClientRect();
+    const tw = tabRect.width;
+    const th = tabRect.height;
+    let targetX = parseFloat(s.miniMenu.style.left) || 0;
+    let targetY = parseFloat(s.miniMenu.style.top) || 0;
+    if (s.dockedEdge === "top") targetY = 0;
+    else if (s.dockedEdge === "bottom") targetY = vh - th;
+    else if (s.dockedEdge === "left") targetX = 0;
+    else if (s.dockedEdge === "right") targetX = vw - tw;
+    targetX = Math.max(0, Math.min(targetX, vw - tw));
+    targetY = Math.max(0, Math.min(targetY, vh - th));
+    s.miniMenu.style.transition = "left 0.25s ease, top 0.25s ease";
+    s.miniMenu.style.left = targetX + "px";
+    s.miniMenu.style.top = targetY + "px";
+    setTimeout(() => {
+      if (s.miniMenu) s.miniMenu.style.transition = "left 0.15s ease, top 0.15s ease";
+    }, 270);
+  });
+}
+function clampToViewport() {
+  if (!s.miniMenu || !s.hasDragged) return;
+  const rect = s.miniMenu.getBoundingClientRect();
+  let x = rect.left;
+  let y = rect.top;
+  let clamped = false;
+  const vw = document.documentElement.clientWidth;
+  const vh = document.documentElement.clientHeight;
+  if (x + rect.width > vw) {
+    x = vw - rect.width;
+    clamped = true;
+  }
+  if (x < 0) {
+    x = 0;
+    clamped = true;
+  }
+  if (y + rect.height > vh) {
+    y = vh - rect.height;
+    clamped = true;
+  }
+  if (y < 0) {
+    y = 0;
+    clamped = true;
+  }
+  if (clamped) {
+    s.miniMenu.style.transition = "left 0.2s ease, top 0.2s ease";
+    s.miniMenu.style.left = x + "px";
+    s.miniMenu.style.top = y + "px";
+    setTimeout(() => {
+      if (s.miniMenu) s.miniMenu.style.transition = "left 0.15s ease, top 0.15s ease";
+    }, 220);
+  }
+}
+function createMiniMenu() {
+  s.miniMenu = document.createElement("div");
+  s.miniMenu.id = "__rune-grab-menu__";
+  s.dockedEdge = "bottom";
+  s.menuExpanded = false;
+  s.miniMenu.style.cssText = `
+    position:fixed;z-index:${Z_TOOLBAR + 2};
+    background:transparent;border:none;
+    border-radius:9px;font-family:${FONT};
+    box-shadow:none;
+    transition:left 0.15s ease, top 0.15s ease;
+    user-select:none;
+    bottom:0px;right:16px;
+  `;
+  document.addEventListener("mousemove", (e) => {
+    s.lastMouseX = e.clientX;
+    s.lastMouseY = e.clientY;
+  }, { passive: true });
+  document.body.appendChild(s.miniMenu);
+  renderMiniMenu();
+}
+function renderMiniMenu() {
+  if (!s.miniMenu) return;
+  const frag = document.createDocumentFragment();
+  if (!s.menuExpanded) {
+    s.miniMenu.style.padding = "0";
+    s.miniMenu.style.border = "none";
+    s.miniMenu.style.boxShadow = "none";
+    s.miniMenu.style.background = "transparent";
+    let chevronSvg;
+    let tabW;
+    let tabH;
+    let borderRadius;
+    const edge = s.dockedEdge || "bottom";
+    if (edge === "bottom") {
+      chevronSvg = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="${M_FG}" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="18 15 12 9 6 15"/></svg>`;
+      tabW = 40;
+      tabH = 28;
+      borderRadius = "10px 10px 0 0";
+    } else if (edge === "top") {
+      chevronSvg = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="${M_FG}" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>`;
+      tabW = 40;
+      tabH = 28;
+      borderRadius = "0 0 10px 10px";
+    } else if (edge === "left") {
+      chevronSvg = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="${M_FG}" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"/></svg>`;
+      tabW = 28;
+      tabH = 40;
+      borderRadius = "0 10px 10px 0";
+    } else {
+      chevronSvg = `<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="${M_FG}" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>`;
+      tabW = 28;
+      tabH = 40;
+      borderRadius = "10px 0 0 10px";
+    }
+    const tab = document.createElement("button");
+    tab.title = "Rune Grab";
+    tab.innerHTML = chevronSvg;
+    tab.style.cssText = `
+      width:${tabW}px;height:${tabH}px;border:none;cursor:pointer;
+      display:flex;align-items:center;justify-content:center;
+      background:${M_BG};color:${M_FG};
+      border-radius:${borderRadius};
+      box-shadow:0 2px 8px rgba(0,0,0,0.08),0 0 0 1px rgba(0,0,0,0.04);
+      transition:background 0.12s;padding:0;
+    `;
+    tab.addEventListener("mouseenter", () => {
+      tab.style.background = M_HOVER;
+    });
+    tab.addEventListener("mouseleave", () => {
+      tab.style.background = M_BG;
+    });
+    tab.addEventListener("click", (e) => {
+      e.stopPropagation();
+      if (!s.miniMenu) return;
+      const rect = s.miniMenu.getBoundingClientRect();
+      s.miniMenu.style.bottom = "auto";
+      s.miniMenu.style.right = "auto";
+      s.miniMenu.style.top = rect.top + "px";
+      s.miniMenu.style.left = rect.left + "px";
+      s.hasDragged = true;
+      s.menuExpanded = true;
+      s.dockedEdge = null;
+      s.miniMenu.style.background = M_BG;
+      s.miniMenu.style.border = `1px solid ${M_BORDER}`;
+      s.miniMenu.style.boxShadow = "0 2px 8px rgba(0,0,0,0.08),0 0 0 1px rgba(0,0,0,0.04)";
+      s.miniMenu.style.borderRadius = "9px";
+      s.miniMenu.style.transition = "none";
+      renderMiniMenu();
+      s.miniMenu.offsetWidth;
+      clampToViewport();
+    });
+    frag.appendChild(tab);
+    s.miniMenu.textContent = "";
+    s.miniMenu.appendChild(frag);
+    return;
+  }
+  s.miniMenu.style.padding = "3px";
+  const bar = document.createElement("div");
+  bar.style.cssText = "display:flex;align-items:center;gap:2px;";
+  const grip = document.createElement("div");
+  grip.style.cssText = `
+    width:12px;height:28px;cursor:grab;display:flex;align-items:center;justify-content:center;
+    flex-shrink:0;border-radius:4px;color:${M_FG_DIM};transition:color 0.12s;
+  `;
+  grip.innerHTML = ICON_GRIP;
+  grip.addEventListener("mouseenter", () => {
+    grip.style.color = M_FG;
+  });
+  grip.addEventListener("mouseleave", () => {
+    if (!s.dragging) grip.style.color = M_FG_DIM;
+  });
+  grip.addEventListener("pointerdown", onGripPointerDown);
+  grip.addEventListener("pointermove", onGripPointerMove);
+  grip.addEventListener("pointerup", onGripPointerUp);
+  grip.style.touchAction = "none";
+  bar.appendChild(grip);
+  const ssActive = s.active && s.grabType === "screenshot";
+  bar.appendChild(grabIconBtn(ICON_SS, ssActive, () => {
+    if (ssActive) {
+      _deactivate();
+    } else {
+      if (s.active) _deactivate();
+      s.grabType = "screenshot";
+      _activate();
+    }
+    renderMiniMenu();
+  }));
+  const refActive = s.active && s.grabType === "reference";
+  bar.appendChild(grabIconBtn(ICON_REF, refActive, () => {
+    if (refActive) {
+      _deactivate();
+    } else {
+      if (s.active) _deactivate();
+      s.grabType = "reference";
+      _activate();
+    }
+    renderMiniMenu();
+  }));
+  bar.appendChild(sep());
+  const visibleTargets = s.autoPasteEnabled && s.helperAvailable ? [...TARGETS_CLIPBOARD, ...TARGETS_APPS] : TARGETS_CLIPBOARD;
+  const toggleBtn = document.createElement("button");
+  toggleBtn.innerHTML = s.targetsExpanded ? ICON_CHEVRON_RIGHT : ICON_CHEVRON_LEFT;
+  toggleBtn.title = s.targetsExpanded ? "Collapse targets" : "Send to\u2026";
+  toggleBtn.style.cssText = `
+    width:24px;height:28px;border:none;background:transparent;cursor:pointer;
+    display:flex;align-items:center;justify-content:center;border-radius:6px;
+    color:${M_FG_DIM};transition:all 0.12s;padding:0;flex-shrink:0;
+  `;
+  toggleBtn.addEventListener("mouseenter", () => {
+    toggleBtn.style.background = M_HOVER;
+    toggleBtn.style.color = M_FG;
+  });
+  toggleBtn.addEventListener("mouseleave", () => {
+    toggleBtn.style.background = "transparent";
+    toggleBtn.style.color = M_FG_DIM;
+  });
+  toggleBtn.addEventListener("click", (e) => {
+    e.stopPropagation();
+    s.targetsExpanded = !s.targetsExpanded;
+    if (targetsWrap) {
+      if (s.targetsExpanded) {
+        targetsWrap.style.width = "auto";
+        const naturalW = targetsWrap.scrollWidth;
+        targetsWrap.style.width = "0px";
+        targetsWrap.offsetWidth;
+        targetsWrap.style.width = naturalW + "px";
+        targetsWrap.style.opacity = "1";
+        setTimeout(() => {
+          if (targetsWrap) targetsWrap.style.width = "auto";
+          clampToViewport();
+        }, 200);
+      } else {
+        const currentW = targetsWrap.scrollWidth;
+        targetsWrap.style.width = currentW + "px";
+        targetsWrap.offsetWidth;
+        targetsWrap.style.width = "0px";
+        targetsWrap.style.opacity = "0";
+      }
+    }
+    toggleBtn.innerHTML = s.targetsExpanded ? ICON_CHEVRON_RIGHT : ICON_CHEVRON_LEFT;
+    toggleBtn.title = s.targetsExpanded ? "Collapse targets" : "Send to\u2026";
+  });
+  bar.appendChild(toggleBtn);
+  const targetsWrap = document.createElement("div");
+  targetsWrap.style.cssText = `
+    display:flex;align-items:center;gap:2px;
+    overflow:hidden;white-space:nowrap;
+    transition:width 0.2s ease, opacity 0.15s ease;
+    ${s.targetsExpanded ? "opacity:1;" : "width:0px;opacity:0;"}
+  `;
+  for (const t of visibleTargets) {
+    const isCurrent = t === s.config.target;
+    const btn = document.createElement("button");
+    btn.textContent = TARGET_LABELS[t];
+    btn.style.cssText = `
+      height:28px;padding:0 8px;border:none;border-radius:6px;cursor:pointer;
+      font-size:11px;font-weight:${isCurrent ? "600" : "500"};font-family:${FONT};
+      transition:all 0.12s;flex-shrink:0;
+      background:${isCurrent ? M_ACTIVE_BG : "transparent"};
+      color:${isCurrent ? M_ACTIVE_FG : M_FG_DIM};
+    `;
+    btn.addEventListener("mouseenter", () => {
+      if (!isCurrent) btn.style.background = M_HOVER;
+    });
+    btn.addEventListener("mouseleave", () => {
+      if (!isCurrent) btn.style.background = "transparent";
+    });
+    btn.addEventListener("click", (e) => {
+      e.stopPropagation();
+      s.config.target = t;
+      renderMiniMenu();
+    });
+    targetsWrap.appendChild(btn);
+  }
+  bar.appendChild(targetsWrap);
+  if (s.targetsExpanded) bar.appendChild(sep());
+  bar.appendChild(buildToggle(s.autoPasteEnabled, onAutoPasteToggle));
+  if (s.autoPasteEnabled && !s.helperAvailable && !s.helperChecking) {
+    bar.appendChild(sep());
+    const hint = document.createElement("div");
+    hint.style.cssText = `
+      font-size:8px;font-family:${MONO};color:${M_FG_DIM};
+      padding:0 6px;white-space:nowrap;flex-shrink:0;line-height:1.3;
+    `;
+    hint.innerHTML = `To enable auto pasting: add <br><span style="color:${M_FG};font-weight:600;">rune-grab serve</span> to your dev script.`;
+    bar.appendChild(hint);
+  }
+  if (s.helperChecking) {
+    bar.appendChild(sep());
+    const checking = document.createElement("span");
+    checking.textContent = "Connecting\u2026";
+    checking.style.cssText = `font-size:10px;font-family:${FONT};color:${M_FG_DIM};padding:0 4px;flex-shrink:0;`;
+    bar.appendChild(checking);
+  }
+  const closeBtn = document.createElement("button");
+  closeBtn.innerHTML = ICON_X;
+  closeBtn.style.cssText = `
+    width:28px;height:28px;border:none;background:transparent;cursor:pointer;
+    display:flex;align-items:center;justify-content:center;border-radius:6px;
+    color:${M_FG_DIM};transition:all 0.12s;padding:0;
+  `;
+  closeBtn.addEventListener("mouseenter", () => {
+    closeBtn.style.background = M_HOVER;
+    closeBtn.style.color = M_FG;
+  });
+  closeBtn.addEventListener("mouseleave", () => {
+    closeBtn.style.background = "transparent";
+    closeBtn.style.color = M_FG_DIM;
+  });
+  closeBtn.addEventListener("click", (e) => {
+    e.stopPropagation();
+    s.menuExpanded = false;
+    if (!s.hasDragged && s.miniMenu) {
+      const r = s.miniMenu.getBoundingClientRect();
+      s.miniMenu.style.top = r.top + "px";
+      s.miniMenu.style.left = r.left + "px";
+      s.miniMenu.style.bottom = "auto";
+      s.miniMenu.style.right = "auto";
+      s.hasDragged = true;
+    }
+    snapToNearestEdge();
+  });
+  bar.appendChild(closeBtn);
+  frag.appendChild(bar);
+  s.miniMenu.textContent = "";
+  s.miniMenu.appendChild(frag);
+}
+var _activate, _deactivate;
+var init_menu = __esm({
+  "src/ui/menu.ts"() {
+    "use strict";
+    init_constants();
+    init_state();
+    init_styles();
+  }
+});
+
+// src/core/frameworks.ts
+function isUsefulName(name, filePath, customSkip) {
+  if (!name || name.length <= 1) return false;
+  if (customSkip?.has(name)) return false;
+  if (name[0] !== name[0].toUpperCase()) return false;
+  for (const pfx of SKIP_PREFIXES) {
+    if (name.startsWith(pfx)) return false;
+  }
+  if (/^[A-Z][a-zA-Z]+\d+$/.test(name)) return false;
+  if (filePath && !isSourceFile(filePath)) return false;
+  return true;
+}
+function getReactFiber(el) {
+  const keys = Object.keys(el);
+  for (const key of keys) {
+    if (key.startsWith("__reactFiber$") || key.startsWith("__reactInternalInstance$")) {
+      return el[key];
+    }
+  }
+  return null;
+}
+function getReactComponentInfo(el, customSkip) {
+  const fiber = getReactFiber(el);
+  if (!fiber) return null;
+  let cur = fiber;
+  while (cur) {
+    if (cur.type && typeof cur.type === "function") {
+      const name = cur.type.displayName || cur.type.name;
+      const src = cur._debugSource;
+      const filePath = src?.fileName ?? null;
+      if (name && isUsefulName(name, filePath, customSkip)) {
+        return {
+          name,
+          filePath,
+          line: src?.lineNumber ?? null,
+          column: src?.columnNumber ?? null
+        };
+      }
+    }
+    if (cur.type?.$$typeof) {
+      const inner = cur.type.render || cur.type.type;
+      if (inner && typeof inner === "function") {
+        const name = inner.displayName || inner.name;
+        const src = cur._debugSource;
+        const filePath = src?.fileName ?? null;
+        if (name && isUsefulName(name, filePath, customSkip)) {
+          return {
+            name,
+            filePath,
+            line: src?.lineNumber ?? null,
+            column: src?.columnNumber ?? null
+          };
+        }
+      }
+    }
+    cur = cur.return;
+  }
+  return null;
+}
+function getReactComponentStack(el, maxDepth = 6, customSkip) {
+  const fiber = getReactFiber(el);
+  if (!fiber) return [];
+  const stack = [];
+  const seen = /* @__PURE__ */ new Set();
+  let cur = fiber;
+  while (cur && stack.length < maxDepth) {
+    let name = null;
+    let src = null;
+    if (cur.type && typeof cur.type === "function") {
+      name = cur.type.displayName || cur.type.name;
+      src = cur._debugSource;
+    } else if (cur.type?.$$typeof) {
+      const inner = cur.type.render || cur.type.type;
+      if (inner && typeof inner === "function") {
+        name = inner.displayName || inner.name;
+        src = cur._debugSource;
+      }
+    }
+    let filePath = src?.fileName ?? null;
+    if (name && isUsefulName(name, filePath, customSkip) && !seen.has(name)) {
+      seen.add(name);
+      const line = src?.lineNumber ?? null;
+      if (filePath) {
+        filePath = filePath.replace(/^(webpack-internal:\/\/\/|\/app\/)/, "").replace(/^\.\//, "");
+      }
+      stack.push({ name, filePath, line });
+    }
+    cur = cur.return;
+  }
+  return stack;
+}
+function getVueComponentInfo(el) {
+  const vueInstance = el.__vueParentComponent;
+  if (vueInstance) {
+    const name = vueInstance.type?.name || vueInstance.type?.__name;
+    if (name) {
+      const file = vueInstance.type?.__file ?? null;
+      return { name, filePath: file, line: null, column: null };
+    }
+  }
+  const vue2 = el.__vue__;
+  if (vue2) {
+    const name = vue2.$options?.name || vue2.$options?._componentTag;
+    if (name) {
+      const file = vue2.$options?.__file ?? null;
+      return { name, filePath: file, line: null, column: null };
+    }
+  }
+  return null;
+}
+function getSvelteComponentInfo(el) {
+  const meta = el.__svelte_meta;
+  if (meta?.loc) {
+    const file = meta.loc.file;
+    const name = file ? file.split("/").pop()?.replace(/\.svelte$/, "") : null;
+    if (name) {
+      return { name, filePath: file, line: meta.loc.line ?? null, column: meta.loc.column ?? null };
+    }
+  }
+  const keys = Object.keys(el);
+  for (const key of keys) {
+    if (key.startsWith("__svelte")) {
+      return { name: "SvelteComponent", filePath: null, line: null, column: null };
+    }
+  }
+  return null;
+}
+function detectComponent(el, customSkip) {
+  return getReactComponentInfo(el, customSkip) || getVueComponentInfo(el) || getSvelteComponentInfo(el) || null;
+}
+function detectComponentStack(el, maxDepth = 6, customSkip) {
+  const reactStack = getReactComponentStack(el, maxDepth, customSkip);
+  if (reactStack.length > 0) return reactStack;
+  const info = getVueComponentInfo(el) || getSvelteComponentInfo(el);
+  if (info) {
+    return [{ name: info.name, filePath: info.filePath, line: info.line }];
+  }
+  return [];
+}
+var init_frameworks = __esm({
+  "src/core/frameworks.ts"() {
+    "use strict";
+    init_constants();
+  }
+});
+
+// src/core/extract.ts
+function isLocalhost() {
+  const h = location.hostname;
+  return h === "localhost" || h === "127.0.0.1" || h === "0.0.0.0" || h.endsWith(".local");
+}
+function getVisibleText(el) {
+  let text = "";
+  function walk(node) {
+    if (node.nodeType === 3) {
+      const t = (node.textContent || "").trim();
+      if (t) text += (text ? " " : "") + t;
+    } else if (node.nodeType === 1) {
+      for (let i = 0; i < node.childNodes.length; i++) walk(node.childNodes[i]);
+    }
+  }
+  walk(el);
+  if (!text) {
+    text = el.getAttribute("value") || el.getAttribute("alt") || el.getAttribute("aria-label") || el.placeholder || "";
+  }
+  if (text.length > 80) text = text.slice(0, 80) + "...";
+  return text;
+}
+function getTagDisplay(el) {
+  let tag = el.tagName.toLowerCase();
+  if (el.id) tag += "#" + el.id;
+  const cls = Array.from(el.classList).filter((c) => !c.startsWith("__rune-grab")).slice(0, 3);
+  if (cls.length) tag += "." + cls.join(".");
+  return tag;
+}
+function getKeyStyles(el) {
+  const cs = window.getComputedStyle(el);
+  const out = [];
+  for (const prop of STYLE_PROPS) {
+    const cssProp = prop.replace(/[A-Z]/g, (m) => "-" + m.toLowerCase());
+    const v = cs.getPropertyValue(cssProp);
+    if (!v || STYLE_DEFAULTS.has(v)) continue;
+    if (prop === "fontSize" && v === "16px") continue;
+    if (prop === "fontWeight" && (v === "400" || v === "normal")) continue;
+    if (prop === "color" && v === "rgb(0, 0, 0)") continue;
+    if (prop === "lineHeight" && v === "normal") continue;
+    if (prop === "letterSpacing" && v === "normal") continue;
+    if (prop === "textAlign" && v === "start") continue;
+    if (prop === "opacity" && v === "1") continue;
+    if (prop === "borderWidth" && v === "0px") continue;
+    if ((prop === "padding" || prop === "margin") && (v === "0px" || /^0px(\s+0px)*$/.test(v))) continue;
+    if (prop === "fontFamily") {
+      const first = v.split(",")[0].trim().replace(/^["']+|["']+$/g, "");
+      if (!first || ["system-ui", "sans-serif", "serif", "monospace", "-apple-system"].includes(first)) continue;
+      out.push("fontFamily: " + first);
+      continue;
+    }
+    out.push(prop + ": " + v);
+  }
+  return out.join("; ");
+}
+function cleanHTML(el) {
+  const tag = el.tagName.toLowerCase();
+  const attrs = [];
+  for (const attr of KEEP_ATTRS) {
+    const v = el.getAttribute(attr);
+    if (v) attrs.push(`${attr}="${v}"`);
+  }
+  const cls = Array.from(el.classList).filter((c) => !/^(css-|chakra-|__rune)/.test(c));
+  if (cls.length) attrs.push(`class="${cls.join(" ")}"`);
+  const open = `<${tag}${attrs.length ? " " + attrs.join(" ") : ""}>`;
+  const close = `</${tag}>`;
+  let text = "";
+  el.childNodes.forEach((n) => {
+    if (n.nodeType === 3) text += (n.textContent || "").trim();
+  });
+  const childCount = el.children.length;
+  let inner = text;
+  if (childCount > 0) {
+    inner = (text ? text + " " : "") + `[${childCount} child element${childCount > 1 ? "s" : ""}]`;
+  }
+  if (inner.length > 200) inner = inner.slice(0, 200) + "...";
+  return open + inner + close;
+}
+function extractElementMeta(el, customSkip) {
+  const local = isLocalhost();
+  const component = detectComponent(el, customSkip);
+  const tag = getTagDisplay(el);
+  const visibleText = getVisibleText(el);
+  const html = cleanHTML(el);
+  const meta = {
+    tag,
+    visibleText,
+    html,
+    attrs: {
+      role: el.getAttribute("role") || void 0,
+      ariaLabel: el.getAttribute("aria-label") || void 0,
+      alt: el.getAttribute("alt") || void 0,
+      placeholder: el.placeholder || void 0,
+      type: el.getAttribute("type") || void 0,
+      href: el.getAttribute("href") || void 0,
+      id: el.id || void 0,
+      testId: el.getAttribute("data-testid") || void 0
+    },
+    component: component || void 0,
+    isLocal: local
+  };
+  if (local) {
+    meta.componentStack = detectComponentStack(el, 3, customSkip);
+  } else {
+    meta.styles = getKeyStyles(el);
+  }
+  return meta;
+}
+function buildLabel(meta) {
+  const textPart = meta.visibleText ? `"${meta.visibleText.slice(0, 30)}"` : "";
+  const tagPart = meta.tag.split(".")[0].split("#")[0];
+  let elType = tagPart;
+  if (tagPart === "button" || meta.attrs.role === "button") elType = "button";
+  else if (tagPart === "a") elType = "link";
+  else if (tagPart === "input") elType = `${meta.attrs.type || "text"} input`;
+  else if (tagPart === "img") elType = "image";
+  else if (tagPart === "textarea") elType = "textarea";
+  let label = textPart ? `${textPart} ${elType}` : elType;
+  if (meta.component?.filePath) {
+    const parts = meta.component.filePath.split("/");
+    const file = parts[parts.length - 1];
+    label += ` in ${file}`;
+    if (meta.component.line) label += `:${meta.component.line}`;
+  } else if (meta.component?.name) {
+    label += ` in <${meta.component.name}>`;
+  }
+  if (label.length > 80) label = label.slice(0, 77) + "...";
+  return label;
+}
+function buildContextText(meta, prompt) {
+  const parts = [];
+  if (prompt) parts.push(prompt);
+  if (meta.isLocal && meta.componentStack?.length) {
+    for (const frame of meta.componentStack) {
+      let line = frame.name;
+      if (frame.filePath) {
+        line += ` at ${frame.filePath}`;
+        if (frame.line) line += `:${frame.line}`;
+      }
+      parts.push(line);
+    }
+  }
+  parts.push(`Element: ${meta.html}`);
+  if (meta.visibleText) parts.push(`Text: "${meta.visibleText}"`);
+  const attrs = Object.entries(meta.attrs).filter(([, v]) => v).map(([k, v]) => `${k}="${v}"`).join(" ");
+  if (attrs) parts.push(`Attributes: ${attrs}`);
+  if (meta.styles) parts.push(`Styles: ${meta.styles}`);
+  return parts.join("\n");
+}
+var init_extract = __esm({
+  "src/core/extract.ts"() {
+    "use strict";
+    init_constants();
+    init_frameworks();
+  }
+});
+
+// src/ui/overlay.ts
+function isOwnElement(el) {
+  if (!el) return false;
+  let cur = el;
+  while (cur) {
+    if (cur.id && OWN_IDS.includes(cur.id)) return true;
+    cur = cur.parentElement;
+  }
+  return false;
+}
+function getToolbarBase() {
+  return `position:fixed;z-index:${Z_TOOLBAR};background:${M_BG};border:1px solid ${M_BORDER};border-radius:9px;box-shadow:0 2px 8px rgba(0,0,0,0.08),0 0 0 1px rgba(0,0,0,0.04);display:none;flex-direction:row;align-items:center;top:0;left:0;font-family:${FONT};`;
+}
+function createGrabOverlay() {
+  if (s.overlay) return;
+  s.overlay = document.createElement("div");
+  s.overlay.id = "__rune-grab-overlay__";
+  s.overlay.style.cssText = `position:fixed;pointer-events:none;z-index:${Z_OVERLAY};border:1px dashed ${M_BG};background:transparent;border-radius:3px;transition:all 0.08s ease-out;display:none;top:0;left:0;width:0;height:0;`;
+  s.label = document.createElement("div");
+  s.label.id = "__rune-grab-label__";
+  s.label.style.cssText = `position:fixed;pointer-events:none;z-index:${Z_TOOLBAR};background:${M_BG};border:1px solid ${M_BORDER};color:${M_FG};font-size:10px;font-family:${MONO};padding:2px 6px;border-radius:5px;white-space:nowrap;display:none;top:0;left:0;line-height:1.4;font-weight:500;letter-spacing:0.01em;box-shadow:0 2px 8px rgba(0,0,0,0.08);`;
+  s.toolbar = document.createElement("div");
+  s.toolbar.id = "__rune-grab-toolbar__";
+  s.toolbar.style.cssText = getToolbarBase() + "padding:4px;gap:2px;";
+  s.cursorStyle = document.createElement("style");
+  s.cursorStyle.id = "__rune-grab-cursor__";
+  s.cursorStyle.textContent = ".__rune-grab-active__ *{cursor:crosshair !important;}.__rune-grab-active__{cursor:crosshair !important;}";
+  document.head.appendChild(s.cursorStyle);
+  document.body.appendChild(s.overlay);
+  document.body.appendChild(s.label);
+  document.body.appendChild(s.toolbar);
+}
+function removeGrabOverlay() {
+  s.overlay?.remove();
+  s.label?.remove();
+  s.toolbar?.remove();
+  s.cursorStyle?.remove();
+  s.overlay = null;
+  s.label = null;
+  s.toolbar = null;
+  s.cursorStyle = null;
+}
+function createSelectionBox() {
+  if (s.selectionBox) return;
+  s.selectionBox = document.createElement("div");
+  s.selectionBox.id = "__rune-grab-selection__";
+  s.selectionBox.style.cssText = `
+    position:fixed;z-index:${Z_OVERLAY};
+    border:1px dashed ${M_BG};
+    background:transparent;
+    border-radius:2px;display:none;
+    pointer-events:none;
+    top:0;left:0;width:0;height:0;
+  `;
+  document.body.appendChild(s.selectionBox);
+}
+function removeSelectionBox() {
+  s.selectionBox?.remove();
+  s.selectionBox = null;
+}
+function doHighlight(el) {
+  if (!s.overlay || !s.label) return;
+  const r = el.getBoundingClientRect();
+  s.overlay.style.top = r.top + "px";
+  s.overlay.style.left = r.left + "px";
+  s.overlay.style.width = r.width + "px";
+  s.overlay.style.height = r.height + "px";
+  s.overlay.style.display = "block";
+  const meta = extractElementMeta(el, s.customSkipSet);
+  let displayName;
+  if (isLocalhost() && meta.component) {
+    displayName = meta.component.name;
+    if (meta.component.filePath) {
+      const parts = meta.component.filePath.split("/");
+      displayName += ` \xB7 ${parts[parts.length - 1]}`;
+      if (meta.component.line) displayName += `:${meta.component.line}`;
+    }
+  } else {
+    displayName = meta.component ? `<${meta.component.name}>` : `<${meta.tag}>`;
+  }
+  s.label.textContent = displayName;
+  s.label.style.display = "block";
+  let lt = r.top - 22;
+  if (lt < 4) lt = r.bottom + 4;
+  s.label.style.top = lt + "px";
+  s.label.style.left = r.left + "px";
+}
+function hideHighlight() {
+  if (s.overlay) s.overlay.style.display = "none";
+  if (s.label) s.label.style.display = "none";
+}
+function hideToolbar() {
+  if (s.toolbar) s.toolbar.style.display = "none";
+}
+function flash(msg) {
+  if (!document.body) return;
+  const f = document.createElement("div");
+  f.textContent = msg;
+  let x = s.lastMouseX + 12;
+  let y = s.lastMouseY - 30;
+  if (x + 150 > window.innerWidth) x = s.lastMouseX - 150;
+  if (y < 4) y = s.lastMouseY + 16;
+  f.style.cssText = `position:fixed;z-index:${Z_TOOLBAR + 3};top:${y}px;left:${x}px;background:${M_BG};color:${M_FG};font-size:11px;font-family:${FONT};padding:5px 12px;border-radius:7px;font-weight:500;pointer-events:none;opacity:1;transition:opacity 0.3s ease-out;box-shadow:0 2px 8px rgba(0,0,0,0.08),0 0 0 1px rgba(0,0,0,0.04);border:1px solid ${M_BORDER};`;
+  document.body.appendChild(f);
+  setTimeout(() => f.style.opacity = "0", FLASH_VISIBLE_MS);
+  setTimeout(() => f.remove(), FLASH_REMOVE_MS);
+}
+function showPromptInput(onSubmit) {
+  if (!s.toolbar) return;
+  s.promptMode = true;
+  const prevTop = s.toolbar.style.top;
+  const prevLeft = s.toolbar.style.left;
+  s.toolbar.innerHTML = "";
+  s.toolbar.style.cssText = getToolbarBase() + "padding:3px 4px 3px 10px;gap:6px;";
+  s.toolbar.style.top = prevTop;
+  s.toolbar.style.left = prevLeft;
+  const input = document.createElement("input");
+  input.type = "text";
+  input.placeholder = "Comment (Enter \u21B5 send, Esc cancel)";
+  input.style.cssText = `background:transparent;border:none;outline:none;color:${M_FG};font-size:12px;font-family:${FONT};width:230px;padding:2px 0;caret-color:${M_FG};`;
+  const sendBtn = document.createElement("button");
+  sendBtn.innerHTML = ICON_SEND;
+  sendBtn.style.cssText = `width:22px;height:22px;border:1px solid ${M_BORDER};background:${M_ACTIVE_BG};color:${M_ACTIVE_FG};border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all 0.15s;`;
+  function submit() {
+    let prompt = input.value.trim();
+    if (prompt && !prompt.endsWith(":")) prompt += ":";
+    s.promptMode = false;
+    onSubmit(prompt);
+  }
+  function cancel() {
+    s.promptMode = false;
+    s.locked = false;
+    hideToolbar();
+    hideHighlight();
+    s.selectedElement = null;
+  }
+  sendBtn.addEventListener("click", (e) => {
+    e.stopPropagation();
+    e.preventDefault();
+    submit();
+  });
+  input.addEventListener("keydown", (e) => {
+    e.stopPropagation();
+    if (e.key === "Enter") {
+      e.preventDefault();
+      submit();
+    }
+    if (e.key === "Escape") {
+      e.preventDefault();
+      cancel();
+    }
+  });
+  input.addEventListener("click", (e) => e.stopPropagation());
+  s.toolbar.appendChild(input);
+  s.toolbar.appendChild(sendBtn);
+  const tw = 270;
+  const curLeft = parseFloat(s.toolbar.style.left);
+  if (curLeft + tw > window.innerWidth - 8) {
+    s.toolbar.style.left = Math.max(8, window.innerWidth - tw - 8) + "px";
+  }
+  s.toolbar.style.display = "flex";
+  setTimeout(() => input.focus(), 0);
+}
+var init_overlay = __esm({
+  "src/ui/overlay.ts"() {
+    "use strict";
+    init_constants();
+    init_extract();
+    init_extract();
+    init_state();
+    init_styles();
+  }
+});
+
+// src/handlers/keyboard.ts
+function parseShortcut(shortcut) {
+  const parts = shortcut.split("+");
+  return {
+    key: parts[parts.length - 1].toLowerCase(),
+    meta: parts.some((p) => /^(meta|cmd)$/i.test(p)),
+    ctrl: parts.some((p) => /^(ctrl|control)$/i.test(p)),
+    shift: parts.some((p) => /^shift$/i.test(p)),
+    alt: parts.some((p) => /^(alt|option)$/i.test(p))
+  };
+}
+function setKeyboardCallbacks(toggle2, renderMiniMenu2) {
+  _toggle = toggle2;
+  _renderMiniMenu = renderMiniMenu2;
+}
+function onShortcut(e) {
+  const sc = parseShortcut(s.config.shortcut);
+  if (e.key.toLowerCase() === sc.key && e.metaKey === sc.meta && e.ctrlKey === sc.ctrl && e.shiftKey === sc.shift && e.altKey === sc.alt) {
+    e.preventDefault();
+    _toggle();
+    _renderMiniMenu();
+  }
+}
+var _toggle, _renderMiniMenu;
+var init_keyboard = __esm({
+  "src/handlers/keyboard.ts"() {
+    "use strict";
+    init_state();
+  }
+});
+
+// src/handlers/inspect.ts
+function setReferenceCallbacks(dispatch, deactivate2, renderMiniMenu2) {
+  _dispatch = dispatch;
+  _deactivate2 = deactivate2;
+  _renderMiniMenu2 = renderMiniMenu2;
+}
+async function executeReferenceGrab(el, prompt) {
+  const meta = extractElementMeta(el, s.customSkipSet);
+  const labelText = buildLabel(meta);
+  const contextText = buildContextText(meta, prompt);
+  const result = {
+    type: "reference",
+    label: labelText,
+    text: contextText,
+    prompt,
+    meta
+  };
+  await _dispatch(result);
+  flash(`Sent to ${TARGET_LABELS[s.config.target]}`);
+  s.locked = false;
+  hideToolbar();
+  hideHighlight();
+  s.selectedElement = null;
+}
+function showPromptForGrab(el) {
+  if (!s.toolbar) return;
+  const r = el.getBoundingClientRect();
+  const tw = 270;
+  const th = 34;
+  let top = r.bottom + 6;
+  let left = r.left + r.width / 2 - tw / 2;
+  if (top + th > window.innerHeight - 8) top = r.top - th - 6;
+  if (left < 8) left = 8;
+  if (left + tw > window.innerWidth - 8) left = window.innerWidth - tw - 8;
+  s.toolbar.style.top = top + "px";
+  s.toolbar.style.left = left + "px";
+  showPromptInput(async (prompt) => {
+    await executeReferenceGrab(el, prompt);
+  });
+}
+function onRefMouseMove(e) {
+  if (s.locked || s.mmRAF) return;
+  s.mmRAF = requestAnimationFrame(() => {
+    s.mmRAF = 0;
+    const el = document.elementFromPoint(e.clientX, e.clientY);
+    if (!el || isOwnElement(el) || el === document.body || el === document.documentElement) {
+      hideHighlight();
+      s.selectedElement = null;
+      return;
+    }
+    s.selectedElement = el;
+    doHighlight(el);
+  });
+}
+function onRefClick(e) {
+  if (isOwnElement(e.target)) return;
+  if (s.promptMode) return;
+  e.preventDefault();
+  e.stopPropagation();
+  e.stopImmediatePropagation();
+  if (s.locked) {
+    s.locked = false;
+    hideToolbar();
+    return;
+  }
+  if (s.selectedElement) {
+    s.locked = true;
+    doHighlight(s.selectedElement);
+    showPromptForGrab(s.selectedElement);
+  }
+}
+function onRefKeyDown(e) {
+  if (s.promptMode) return;
+  if (e.key === "Escape") {
+    if (s.locked) {
+      s.locked = false;
+      hideToolbar();
+      s.selectedElement = null;
+      hideHighlight();
+    } else {
+      _deactivate2();
+      _renderMiniMenu2();
+    }
+  }
+}
+function onRefScroll() {
+  if (s.promptMode) return;
+  if (s.locked) {
+    s.locked = false;
+    hideToolbar();
+    s.selectedElement = null;
+    hideHighlight();
+  }
+}
+var _dispatch, _deactivate2, _renderMiniMenu2;
+var init_inspect = __esm({
+  "src/handlers/inspect.ts"() {
+    "use strict";
+    init_extract();
+    init_state();
+    init_overlay();
+    init_styles();
+  }
+});
+
+// src/handlers/capture.ts
+function setScreenshotCallbacks(dispatch, deactivate2, renderMiniMenu2) {
+  _dispatch2 = dispatch;
+  _deactivate3 = deactivate2;
+  _renderMiniMenu3 = renderMiniMenu2;
+}
+function onSSMouseDown(e) {
+  if (e.button !== 0) return;
+  if (isOwnElement(e.target)) return;
+  e.preventDefault();
+  e.stopPropagation();
+  s.ssDrawing = true;
+  s.ssStartX = e.clientX;
+  s.ssStartY = e.clientY;
+  if (s.selectionBox) {
+    s.selectionBox.style.left = s.ssStartX + "px";
+    s.selectionBox.style.top = s.ssStartY + "px";
+    s.selectionBox.style.width = "0px";
+    s.selectionBox.style.height = "0px";
+    s.selectionBox.style.display = "block";
+  }
+}
+function onSSMouseMove(e) {
+  if (!s.ssDrawing || !s.selectionBox) return;
+  e.preventDefault();
+  const x = Math.min(e.clientX, s.ssStartX);
+  const y = Math.min(e.clientY, s.ssStartY);
+  const w = Math.abs(e.clientX - s.ssStartX);
+  const h = Math.abs(e.clientY - s.ssStartY);
+  s.selectionBox.style.left = x + "px";
+  s.selectionBox.style.top = y + "px";
+  s.selectionBox.style.width = w + "px";
+  s.selectionBox.style.height = h + "px";
+}
+async function onSSMouseUp(e) {
+  if (!s.ssDrawing) return;
+  s.ssDrawing = false;
+  e.preventDefault();
+  e.stopPropagation();
+  const x = Math.min(e.clientX, s.ssStartX);
+  const y = Math.min(e.clientY, s.ssStartY);
+  const w = Math.abs(e.clientX - s.ssStartX);
+  const h = Math.abs(e.clientY - s.ssStartY);
+  const selBox = s.selectionBox;
+  if (selBox) selBox.remove();
+  s.selectionBox = null;
+  if (s.miniMenu) s.miniMenu.style.display = "none";
+  if (s.cursorStyle) s.cursorStyle.disabled = true;
+  await new Promise((r) => requestAnimationFrame(() => requestAnimationFrame(r)));
+  if (w >= 10 && h >= 10) {
+    const image = await captureRect({ x, y, width: w, height: h });
+    if (s.miniMenu) s.miniMenu.style.display = "";
+    if (s.cursorStyle) s.cursorStyle.disabled = false;
+    createSelectionBox();
+    if (image) {
+      const result = {
+        type: "screenshot",
+        label: `Region ${w}\xD7${h}`,
+        text: `Screenshot region: ${w}\xD7${h} at (${Math.round(x)}, ${Math.round(y)})`,
+        prompt: "",
+        image,
+        meta: { tag: "region", visibleText: "", html: "", attrs: {}, isLocal: isLocalhost() }
+      };
+      await _dispatch2(result);
+      flash("Screenshot captured");
+    }
+  } else {
+    if (s.miniMenu) s.miniMenu.style.display = "";
+    if (s.cursorStyle) s.cursorStyle.disabled = false;
+    createSelectionBox();
+  }
+}
+function onSSKeyDown(e) {
+  if (e.key === "Escape") {
+    if (s.ssDrawing) {
+      s.ssDrawing = false;
+      if (s.selectionBox) s.selectionBox.style.display = "none";
+    } else {
+      _deactivate3();
+      _renderMiniMenu3();
+    }
+  }
+}
+var _dispatch2, _deactivate3, _renderMiniMenu3;
+var init_capture = __esm({
+  "src/handlers/capture.ts"() {
+    "use strict";
+    init_screenshot();
+    init_extract();
+    init_state();
+    init_overlay();
+  }
+});
+
+// src/core/engine.ts
+var engine_exports = {};
+__export(engine_exports, {
+  activate: () => activate,
+  deactivate: () => deactivate,
+  getTarget: () => getTarget,
+  init: () => init,
+  isActive: () => isActive,
+  setTarget: () => setTarget,
+  toggle: () => toggle
+});
+async function dispatchResult(result) {
+  s.config.onGrab(result);
+  window.dispatchEvent(new CustomEvent("rune:grab", { detail: result }));
+  if (s.config.target === "clipboard") {
+    await copyToClipboard(result);
+  } else {
+    await sendToApp(s.config.target, result);
+  }
+}
+function activate() {
+  if (s.active) return;
+  if (!document.body || !document.head) return;
+  s.active = true;
+  document.documentElement.classList.add("__rune-grab-active__");
+  if (s.grabType === "screenshot") {
+    createGrabOverlay();
+    createSelectionBox();
+    document.addEventListener("mousedown", onSSMouseDown, true);
+    document.addEventListener("mousemove", onSSMouseMove, true);
+    document.addEventListener("mouseup", onSSMouseUp, true);
+    document.addEventListener("keydown", onSSKeyDown, true);
+  } else {
+    createGrabOverlay();
+    document.addEventListener("mousemove", onRefMouseMove, true);
+    document.addEventListener("click", onRefClick, true);
+    document.addEventListener("keydown", onRefKeyDown, true);
+    document.addEventListener("scroll", onRefScroll, true);
+  }
+  s.config.onToggle(true);
+}
+function deactivate() {
+  if (!s.active) return;
+  s.active = false;
+  s.locked = false;
+  s.promptMode = false;
+  s.ssDrawing = false;
+  s.selectedElement = null;
+  if (s.mmRAF) {
+    cancelAnimationFrame(s.mmRAF);
+    s.mmRAF = 0;
+  }
+  document.removeEventListener("mousedown", onSSMouseDown, true);
+  document.removeEventListener("mousemove", onSSMouseMove, true);
+  document.removeEventListener("mouseup", onSSMouseUp, true);
+  document.removeEventListener("keydown", onSSKeyDown, true);
+  document.removeEventListener("mousemove", onRefMouseMove, true);
+  document.removeEventListener("click", onRefClick, true);
+  document.removeEventListener("keydown", onRefKeyDown, true);
+  document.removeEventListener("scroll", onRefScroll, true);
+  removeGrabOverlay();
+  removeSelectionBox();
+  document.documentElement.classList.remove("__rune-grab-active__");
+  s.config.onToggle(false);
+}
+function toggle() {
+  if (s.active) deactivate();
+  else activate();
+}
+function isActive() {
+  return s.active;
+}
+function setTarget(target) {
+  s.config.target = target;
+  if (s.menuExpanded) renderMiniMenu();
+}
+function getTarget() {
+  return s.config.target;
+}
+function init(userConfig = {}) {
+  if (s.initialized) return () => {
+  };
+  s.config = { ...DEFAULTS, ...userConfig };
+  s.initialized = true;
+  if (userConfig.skipComponents?.length) {
+    s.customSkipSet = new Set(userConfig.skipComponents);
+  }
+  setMenuCallbacks(activate, deactivate);
+  setKeyboardCallbacks(toggle, renderMiniMenu);
+  setReferenceCallbacks(dispatchResult, deactivate, renderMiniMenu);
+  setScreenshotCallbacks(dispatchResult, deactivate, renderMiniMenu);
+  const savedAutoPaste = loadAutoPastePref();
+  if (savedAutoPaste) {
+    s.autoPasteEnabled = true;
+    checkHelper().then((ok) => {
+      s.helperAvailable = ok;
+      if (!ok) s.config.target = "clipboard";
+      if (s.menuExpanded) renderMiniMenu();
+    });
+  }
+  const setup = () => {
+    createMiniMenu();
+    document.addEventListener("keydown", onShortcut, true);
+  };
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", setup, { once: true });
+  } else {
+    setup();
+  }
+  return () => {
+    deactivate();
+    releaseStream();
+    s.miniMenu?.remove();
+    document.removeEventListener("keydown", onShortcut, true);
+    s.initialized = false;
+    s.hasDragged = false;
+  };
+}
+var init_engine = __esm({
+  "src/core/engine.ts"() {
+    "use strict";
+    init_screenshot();
+    init_app();
+    init_clipboard();
+    init_state();
+    init_menu();
+    init_overlay();
+    init_keyboard();
+    init_inspect();
+    init_capture();
+  }
+});
+
+// src/hooks/react.ts
+import { useEffect, useState, useCallback, useRef } from "react";
+function useRuneGrab(config = {}) {
+  const [active, setActive] = useState(false);
+  const [target, setTargetState] = useState(config.target ?? "clipboard");
+  const [lastGrab, setLastGrab] = useState(null);
+  const cleanupRef = useRef(null);
+  const engineRef = useRef(null);
+  useEffect(() => {
+    let mounted = true;
+    Promise.resolve().then(() => (init_engine(), engine_exports)).then((engine) => {
+      if (!mounted) return;
+      engineRef.current = engine;
+      cleanupRef.current = engine.init({
+        ...config,
+        onGrab: (result) => {
+          setLastGrab(result);
+          config.onGrab?.(result);
+        },
+        onToggle: (isActive2) => {
+          setActive(isActive2);
+          config.onToggle?.(isActive2);
+        }
+      });
+    });
+    return () => {
+      mounted = false;
+      cleanupRef.current?.();
+    };
+  }, []);
+  const toggle2 = useCallback(() => {
+    engineRef.current?.toggle();
+  }, []);
+  const activate2 = useCallback(() => {
+    engineRef.current?.activate();
+  }, []);
+  const deactivate2 = useCallback(() => {
+    engineRef.current?.deactivate();
+  }, []);
+  const setTarget2 = useCallback((t) => {
+    setTargetState(t);
+    engineRef.current?.setTarget(t);
+  }, []);
+  return { active, toggle: toggle2, activate: activate2, deactivate: deactivate2, setTarget: setTarget2, target, lastGrab };
+}
+export {
+  useRuneGrab
+};
+//# sourceMappingURL=react.js.map