angular-grab 0.1.0 → 0.1.2

package/dist/core/index.js

@@ -1,2560 +0,0 @@
-// src/core/store.ts
-function createStore(initialOptions) {
-  const listeners = /* @__PURE__ */ new Set();
-  const raw = {
-    active: false,
-    frozen: false,
-    hoveredElement: null,
-    options: initialOptions,
-    toolbar: {
-      visible: initialOptions.showToolbar,
-      themeMode: initialOptions.themeMode,
-      history: [],
-      pendingAction: null
-    }
-  };
-  const state = new Proxy(raw, {
-    set(target, prop, value) {
-      const key = prop;
-      if (target[key] === value) return true;
-      Reflect.set(target, key, value);
-      listeners.forEach((fn) => fn(state, key));
-      return true;
-    }
-  });
-  return {
-    state,
-    subscribe(listener) {
-      listeners.add(listener);
-      return () => listeners.delete(listener);
-    }
-  };
-}
-
-// src/core/constants.ts
-var Z_INDEX_FREEZE = 2147483644;
-var Z_INDEX_CROSSHAIR = 2147483645;
-var Z_INDEX_OVERLAY = 2147483646;
-var Z_INDEX_LABEL = 2147483647;
-var Z_INDEX_TOOLBAR = 2147483646;
-var Z_INDEX_TOAST = 2147483647;
-var Z_INDEX_POPOVER = 2147483647;
-var TOOLBAR_TOAST_OFFSET = "72px";
-var TOOLBAR_POPOVER_OFFSET = "68px";
-
-// src/core/overlay/overlay-renderer.ts
-var OVERLAY_ID = "__ag-overlay__";
-var LABEL_ID = "__ag-label__";
-var STYLE_ID = "__ag-styles__";
-function createOverlayRenderer() {
-  let overlay = null;
-  let label = null;
-  let rafId = null;
-  let currentElement = null;
-  let currentComponentName = null;
-  let currentSourcePath = null;
-  let currentCssClasses = [];
-  function injectStyles2() {
-    if (document.getElementById(STYLE_ID)) return;
-    const style = document.createElement("style");
-    style.id = STYLE_ID;
-    style.textContent = `
-      #${OVERLAY_ID} {
-        position: fixed;
-        pointer-events: none;
-        z-index: ${Z_INDEX_OVERLAY};
-        border: 2px solid var(--ag-overlay-border, #3b82f6);
-        background: var(--ag-overlay-bg, rgba(59, 130, 246, 0.1));
-        transition: top 0.05s ease, left 0.05s ease, width 0.05s ease, height 0.05s ease;
-        box-sizing: border-box;
-      }
-      #${LABEL_ID} {
-        position: fixed;
-        pointer-events: none;
-        z-index: ${Z_INDEX_LABEL};
-        background: var(--ag-label-bg, #3b82f6);
-        color: var(--ag-label-text, #fff);
-        font: 11px/1.4 monospace;
-        padding: 2px 6px;
-        border-radius: 3px;
-        white-space: nowrap;
-        box-sizing: border-box;
-        max-width: 100vw;
-        overflow: hidden;
-        text-overflow: ellipsis;
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function ensureElements() {
-    if (!overlay) {
-      injectStyles2();
-      overlay = document.createElement("div");
-      overlay.id = OVERLAY_ID;
-      document.body.appendChild(overlay);
-    }
-    if (!label) {
-      label = document.createElement("div");
-      label.id = LABEL_ID;
-      document.body.appendChild(label);
-    }
-  }
-  function positionOverlay() {
-    if (!currentElement || !overlay || !label) return;
-    const rect = currentElement.getBoundingClientRect();
-    if (rect.width === 0 && rect.height === 0 && !currentElement.isConnected) {
-      overlay.style.display = "none";
-      label.style.display = "none";
-      return;
-    }
-    overlay.style.top = `${rect.top}px`;
-    overlay.style.left = `${rect.left}px`;
-    overlay.style.width = `${rect.width}px`;
-    overlay.style.height = `${rect.height}px`;
-    overlay.style.display = "block";
-    const tag = currentElement.tagName.toLowerCase();
-    let labelText = `<${tag}>`;
-    if (currentCssClasses.length > 0) {
-      labelText += ` .${currentCssClasses.join(".")}`;
-    }
-    if (currentComponentName) {
-      labelText += ` in ${currentComponentName}`;
-    }
-    if (currentSourcePath) {
-      labelText += ` \u2014 ${currentSourcePath}`;
-    }
-    label.textContent = labelText;
-    const labelHeight = 20;
-    const gap = 4;
-    let labelTop = rect.top - labelHeight - gap;
-    if (labelTop < 0) {
-      labelTop = rect.bottom + gap;
-    }
-    let labelLeft = rect.left;
-    label.style.top = `${labelTop}px`;
-    label.style.left = `${labelLeft}px`;
-    label.style.display = "block";
-    const labelRect = label.getBoundingClientRect();
-    const viewportWidth = document.documentElement.clientWidth;
-    if (labelRect.right > viewportWidth) {
-      labelLeft = Math.max(0, viewportWidth - labelRect.width);
-      label.style.left = `${labelLeft}px`;
-    }
-    if (labelLeft < 0) {
-      label.style.left = "0px";
-    }
-  }
-  function trackPosition() {
-    positionOverlay();
-    rafId = requestAnimationFrame(trackPosition);
-  }
-  function stopTracking() {
-    if (rafId !== null) {
-      cancelAnimationFrame(rafId);
-      rafId = null;
-    }
-  }
-  return {
-    show(element, componentName, sourcePath, cssClasses) {
-      ensureElements();
-      currentElement = element;
-      currentComponentName = componentName;
-      currentSourcePath = sourcePath ?? null;
-      currentCssClasses = cssClasses ?? [];
-      stopTracking();
-      trackPosition();
-    },
-    hide() {
-      stopTracking();
-      currentElement = null;
-      currentComponentName = null;
-      currentSourcePath = null;
-      currentCssClasses = [];
-      if (overlay) overlay.style.display = "none";
-      if (label) label.style.display = "none";
-    },
-    isOverlayElement(el) {
-      return el === overlay || el === label || el.id === OVERLAY_ID || el.id === LABEL_ID;
-    },
-    dispose() {
-      stopTracking();
-      currentElement = null;
-      currentComponentName = null;
-      currentSourcePath = null;
-      currentCssClasses = [];
-      overlay?.remove();
-      label?.remove();
-      document.getElementById(STYLE_ID)?.remove();
-      overlay = null;
-      label = null;
-    }
-  };
-}
-
-// src/core/overlay/crosshair.ts
-var CROSSHAIR_STYLE_ID = "__ag-crosshair-styles__";
-var H_LINE_ID = "__ag-crosshair-h__";
-var V_LINE_ID = "__ag-crosshair-v__";
-function createCrosshair() {
-  let hLine = null;
-  let vLine = null;
-  let listening = false;
-  function injectStyles2() {
-    if (document.getElementById(CROSSHAIR_STYLE_ID)) return;
-    const style = document.createElement("style");
-    style.id = CROSSHAIR_STYLE_ID;
-    style.textContent = `
-      .ag-crosshair-line {
-        position: fixed;
-        pointer-events: none;
-        z-index: ${Z_INDEX_CROSSHAIR};
-        background: var(--ag-accent, #3b82f6);
-        opacity: 0.25;
-        transition: none;
-      }
-      #${H_LINE_ID} {
-        left: 0;
-        right: 0;
-        height: 1px;
-      }
-      #${V_LINE_ID} {
-        top: 0;
-        bottom: 0;
-        width: 1px;
-      }
-      body.ag-crosshair-active {
-        cursor: crosshair !important;
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function ensureElements() {
-    if (!hLine) {
-      injectStyles2();
-      hLine = document.createElement("div");
-      hLine.id = H_LINE_ID;
-      hLine.className = "ag-crosshair-line";
-      document.body.appendChild(hLine);
-    }
-    if (!vLine) {
-      vLine = document.createElement("div");
-      vLine.id = V_LINE_ID;
-      vLine.className = "ag-crosshair-line";
-      document.body.appendChild(vLine);
-    }
-  }
-  function handleMouseMove(e) {
-    if (hLine) {
-      hLine.style.top = `${e.clientY}px`;
-    }
-    if (vLine) {
-      vLine.style.left = `${e.clientX}px`;
-    }
-  }
-  return {
-    activate() {
-      if (listening) return;
-      listening = true;
-      ensureElements();
-      document.body.classList.add("ag-crosshair-active");
-      document.addEventListener("mousemove", handleMouseMove, true);
-    },
-    deactivate() {
-      if (!listening) return;
-      listening = false;
-      document.body.classList.remove("ag-crosshair-active");
-      document.removeEventListener("mousemove", handleMouseMove, true);
-      if (hLine) hLine.style.top = "-10px";
-      if (vLine) vLine.style.left = "-10px";
-    },
-    isCrosshairElement(el) {
-      return el === hLine || el === vLine || el.id === H_LINE_ID || el.id === V_LINE_ID;
-    },
-    dispose() {
-      this.deactivate();
-      hLine?.remove();
-      vLine?.remove();
-      document.getElementById(CROSSHAIR_STYLE_ID)?.remove();
-      hLine = null;
-      vLine = null;
-    }
-  };
-}
-
-// src/core/utils.ts
-function escapeHtml(text) {
-  const div = document.createElement("div");
-  div.textContent = text;
-  return div.innerHTML;
-}
-function filterAngularClasses(classList) {
-  return Array.from(classList).filter((c) => !c.startsWith("ng-") && !c.startsWith("_ng"));
-}
-var NG_ATTR_RE = /\s_ng(host|content)-[a-z0-9-]+="[^"]*"/gi;
-var NG_ATTR_EMPTY_RE = /\s_ng(host|content)-[a-z0-9-]+/gi;
-function cleanAngularAttrs(html) {
-  return html.replace(NG_ATTR_RE, "").replace(NG_ATTR_EMPTY_RE, "");
-}
-
-// src/core/overlay/toast.ts
-var TOAST_ID = "__ag-toast__";
-var TOAST_STYLE_ID = "__ag-toast-styles__";
-var activeTimer = null;
-function injectToastStyles() {
-  if (document.getElementById(TOAST_STYLE_ID)) return;
-  const style = document.createElement("style");
-  style.id = TOAST_STYLE_ID;
-  style.textContent = `
-    #${TOAST_ID} {
-      position: fixed;
-      bottom: var(--ag-toast-bottom, 24px);
-      left: 50%;
-      transform: translateX(-50%) translateY(100%);
-      z-index: ${Z_INDEX_TOAST};
-      background: var(--ag-toast-bg, #0f172a);
-      color: var(--ag-toast-text, #e2e8f0);
-      font: 500 13px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-      padding: 12px 18px;
-      border-radius: 10px;
-      box-shadow: 0 8px 24px var(--ag-toast-shadow, rgba(0, 0, 0, 0.4));
-      pointer-events: none;
-      opacity: 0;
-      transition: transform 0.25s ease, opacity 0.25s ease;
-      letter-spacing: 0.01em;
-      max-width: 480px;
-      min-width: 260px;
-    }
-    #${TOAST_ID}.ag-toast-visible {
-      transform: translateX(-50%) translateY(0);
-      opacity: 1;
-    }
-    #${TOAST_ID} .ag-toast-header {
-      display: flex;
-      align-items: center;
-      gap: 8px;
-      margin-bottom: 0;
-    }
-    #${TOAST_ID} .ag-toast-icon {
-      flex-shrink: 0;
-      width: 16px;
-      height: 16px;
-    }
-    #${TOAST_ID} .ag-toast-title {
-      font-weight: 600;
-      color: var(--ag-toast-title, #fff);
-    }
-    #${TOAST_ID} .ag-toast-details {
-      margin-top: 8px;
-      display: flex;
-      flex-direction: column;
-      gap: 4px;
-      font-size: 12px;
-      font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
-    }
-    #${TOAST_ID} .ag-toast-row {
-      display: flex;
-      gap: 8px;
-      align-items: baseline;
-    }
-    #${TOAST_ID} .ag-toast-label {
-      color: var(--ag-toast-label, #64748b);
-      flex-shrink: 0;
-      min-width: 72px;
-    }
-    #${TOAST_ID} .ag-toast-value {
-      color: var(--ag-toast-text, #e2e8f0);
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    }
-    #${TOAST_ID} .ag-toast-file-link {
-      color: var(--ag-toast-text, #e2e8f0);
-      text-decoration: none;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      pointer-events: auto;
-      cursor: pointer;
-    }
-    #${TOAST_ID} .ag-toast-file-link:hover {
-      text-decoration: underline;
-      color: var(--ag-accent, #3b82f6);
-    }
-  `;
-  document.head.appendChild(style);
-}
-function getOrCreateToast() {
-  let toast = document.getElementById(TOAST_ID);
-  if (!toast) {
-    injectToastStyles();
-    toast = document.createElement("div");
-    toast.id = TOAST_ID;
-    document.body.appendChild(toast);
-  }
-  return toast;
-}
-var CHECKMARK_SVG = `<svg class="ag-toast-icon" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="7" fill="#22c55e"/><path d="M5 8l2 2 4-4" stroke="#fff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
-function showToast(message, detail, durationMs = 3500) {
-  const toast = getOrCreateToast();
-  let html = `<div class="ag-toast-header">${CHECKMARK_SVG}<span class="ag-toast-title">${escapeHtml(message)}</span></div>`;
-  if (detail) {
-    html += '<div class="ag-toast-details">';
-    if (detail.componentName) {
-      html += `<div class="ag-toast-row"><span class="ag-toast-label">Component</span><span class="ag-toast-value">${escapeHtml(detail.componentName)}</span></div>`;
-    }
-    if (detail.filePath) {
-      let loc = detail.filePath;
-      if (detail.line != null) loc += `:${detail.line}`;
-      let vsCodeUri = `vscode://file/${encodeURI(detail.filePath)}`;
-      if (detail.line != null) vsCodeUri += `:${detail.line}`;
-      if (detail.line != null && detail.column != null) vsCodeUri += `:${detail.column}`;
-      html += `<div class="ag-toast-row"><span class="ag-toast-label">File</span>`;
-      html += `<a class="ag-toast-file-link" href="${escapeHtml(vsCodeUri)}" title="Open in VS Code">${escapeHtml(loc)}</a>`;
-      html += `</div>`;
-    }
-    if (detail.cssClasses && detail.cssClasses.length > 0) {
-      const classes = detail.cssClasses.map((c) => `.${escapeHtml(c)}`).join(" ");
-      html += `<div class="ag-toast-row"><span class="ag-toast-label">Classes</span><span class="ag-toast-value">${classes}</span></div>`;
-    }
-    html += "</div>";
-  }
-  toast.innerHTML = html;
-  if (activeTimer) {
-    clearTimeout(activeTimer);
-    activeTimer = null;
-  }
-  toast.classList.remove("ag-toast-visible");
-  void toast.offsetHeight;
-  toast.classList.add("ag-toast-visible");
-  activeTimer = setTimeout(() => {
-    toast.classList.remove("ag-toast-visible");
-    activeTimer = null;
-  }, durationMs);
-}
-function disposeToast() {
-  if (activeTimer) {
-    clearTimeout(activeTimer);
-    activeTimer = null;
-  }
-  document.getElementById(TOAST_ID)?.remove();
-  document.getElementById(TOAST_STYLE_ID)?.remove();
-}
-
-// src/core/picker/element-picker.ts
-function createElementPicker(deps) {
-  let hoveredElement = null;
-  let listening = false;
-  function resolveComponentName(el) {
-    const resolver = deps.getComponentResolver();
-    if (!resolver) return null;
-    const result = resolver(el);
-    return result?.name ?? null;
-  }
-  function resolveSourcePath(el) {
-    const resolver = deps.getSourceResolver();
-    if (!resolver) return null;
-    const result = resolver(el);
-    if (!result?.filePath) return null;
-    let path = result.filePath;
-    if (result.line != null) {
-      path += `:${result.line}`;
-    }
-    return path;
-  }
-  function elementAtPoint(x, y) {
-    const freezeEl = deps.getFreezeElement?.();
-    if (freezeEl) freezeEl.style.pointerEvents = "none";
-    const target = document.elementFromPoint(x, y);
-    if (freezeEl) freezeEl.style.pointerEvents = "auto";
-    return target;
-  }
-  function handleMouseMove(e) {
-    const target = elementAtPoint(e.clientX, e.clientY);
-    if (!target || deps.overlay.isOverlayElement(target)) return;
-    if (deps.crosshair.isCrosshairElement(target)) return;
-    if (deps.isToolbarElement?.(target)) return;
-    if (target === hoveredElement) return;
-    hoveredElement = target;
-    const componentName = resolveComponentName(target);
-    const sourcePath = resolveSourcePath(target);
-    const cssClasses = filterAngularClasses(target.classList);
-    deps.overlay.show(target, componentName, sourcePath, cssClasses);
-    deps.onHover(target);
-  }
-  function handleClick(e) {
-    const target = elementAtPoint(e.clientX, e.clientY);
-    if (target && (deps.isToolbarElement?.(target) || deps.crosshair.isCrosshairElement(target))) return;
-    e.preventDefault();
-    e.stopPropagation();
-    if (hoveredElement) {
-      deps.onSelect(hoveredElement);
-    }
-  }
-  return {
-    activate() {
-      if (listening) return;
-      listening = true;
-      deps.crosshair.activate();
-      document.addEventListener("mousemove", handleMouseMove, true);
-      document.addEventListener("click", handleClick, true);
-    },
-    deactivate() {
-      if (!listening) return;
-      listening = false;
-      hoveredElement = null;
-      deps.crosshair.deactivate();
-      document.removeEventListener("mousemove", handleMouseMove, true);
-      document.removeEventListener("click", handleClick, true);
-      deps.overlay.hide();
-      deps.onHover(null);
-    },
-    getHoveredElement() {
-      return hoveredElement;
-    },
-    dispose() {
-      this.deactivate();
-    }
-  };
-}
-
-// src/core/keyboard/keyboard-handler.ts
-function isMac() {
-  if (typeof navigator === "undefined") return false;
-  const uaData = navigator.userAgentData;
-  if (uaData?.platform) return /mac/i.test(uaData.platform);
-  return /Mac|iPhone|iPad|iPod/i.test(navigator.userAgent);
-}
-function parseKeyCombo(combo) {
-  const parts = combo.split("+").map((s) => s.trim());
-  const result = {
-    key: "",
-    meta: false,
-    ctrl: false,
-    shift: false,
-    alt: false
-  };
-  for (const part of parts) {
-    const lower = part.toLowerCase();
-    if (lower === "meta" || lower === "cmd" || lower === "command") {
-      result.meta = true;
-    } else if (lower === "ctrl" || lower === "control") {
-      result.ctrl = true;
-    } else if (lower === "shift") {
-      result.shift = true;
-    } else if (lower === "alt" || lower === "option") {
-      result.alt = true;
-    } else {
-      result.key = lower;
-    }
-  }
-  return result;
-}
-function matchesCombo(e, parsed) {
-  if (parsed.meta && !e.metaKey) return false;
-  if (parsed.ctrl && !e.ctrlKey) return false;
-  if (parsed.shift && !e.shiftKey) return false;
-  if (parsed.alt && !e.altKey) return false;
-  return e.key.toLowerCase() === parsed.key;
-}
-function isInputElement(el) {
-  if (!el || !(el instanceof HTMLElement)) return false;
-  const tag = el.tagName;
-  return tag === "INPUT" || tag === "TEXTAREA" || el.isContentEditable;
-}
-function createKeyboardHandler(deps) {
-  let holdTimer = null;
-  let holdActivated = false;
-  let listening = false;
-  function handleKeyDown(e) {
-    if (!deps.getEnableInInputs() && isInputElement(e.target)) return;
-    const parsed = parseKeyCombo(deps.getActivationKey());
-    if (!matchesCombo(e, parsed)) return;
-    const mode = deps.getActivationMode();
-    const holdDuration = deps.getKeyHoldDuration();
-    if (mode === "hold") {
-      e.preventDefault();
-      if (holdActivated) return;
-      if (holdDuration > 0) {
-        if (holdTimer) return;
-        holdTimer = setTimeout(() => {
-          holdActivated = true;
-          deps.onActivate();
-        }, holdDuration);
-      } else {
-        holdActivated = true;
-        deps.onActivate();
-      }
-    } else {
-      e.preventDefault();
-    }
-  }
-  function handleKeyUp(e) {
-    const parsed = parseKeyCombo(deps.getActivationKey());
-    if (e.key.toLowerCase() !== parsed.key) return;
-    const mode = deps.getActivationMode();
-    if (mode === "hold") {
-      if (holdTimer) {
-        clearTimeout(holdTimer);
-        holdTimer = null;
-      }
-      if (holdActivated) {
-        holdActivated = false;
-        deps.onDeactivate();
-      }
-    } else {
-      if (deps.isActive()) {
-        deps.onDeactivate();
-      } else {
-        deps.onActivate();
-      }
-    }
-  }
-  return {
-    start() {
-      if (listening) return;
-      listening = true;
-      document.addEventListener("keydown", handleKeyDown, true);
-      document.addEventListener("keyup", handleKeyUp, true);
-    },
-    stop() {
-      if (!listening) return;
-      listening = false;
-      if (holdTimer) {
-        clearTimeout(holdTimer);
-        holdTimer = null;
-      }
-      holdActivated = false;
-      document.removeEventListener("keydown", handleKeyDown, true);
-      document.removeEventListener("keyup", handleKeyUp, true);
-    },
-    dispose() {
-      this.stop();
-    }
-  };
-}
-
-// src/core/clipboard/generate-snippet.ts
-function truncateHtml(html, maxLines) {
-  const lines = html.split("\n");
-  if (lines.length <= maxLines) return html;
-  return lines.slice(0, maxLines).join("\n") + "\n  ...";
-}
-function formatLocation(name, filePath, line, column) {
-  let locationLine = "";
-  if (name) locationLine += `in ${name}`;
-  if (filePath) {
-    const loc = filePath + (line != null ? `:${line}` : "") + (line != null && column != null ? `:${column}` : "");
-    locationLine += locationLine ? ` at ${loc}` : `at ${loc}`;
-  }
-  return locationLine;
-}
-function generateSnippet(context, maxContextLines) {
-  const cleaned = cleanAngularAttrs(context.html);
-  const truncated = truncateHtml(cleaned, maxContextLines);
-  const parts = [truncated];
-  if (context.componentStack.length > 0) {
-    for (const entry of context.componentStack) {
-      parts.push(formatLocation(entry.name, entry.filePath, entry.line, entry.column));
-    }
-  } else if (context.componentName || context.filePath) {
-    parts.push(formatLocation(context.componentName, context.filePath, context.line, context.column));
-  }
-  return parts.join("\n");
-}
-
-// src/core/clipboard/copy.ts
-function buildSelector(el) {
-  const tag = el.tagName.toLowerCase();
-  const id = el.id ? `#${el.id}` : "";
-  const classes = filterAngularClasses(el.classList).map((c) => `.${c}`).join("");
-  return `${tag}${id}${classes}`;
-}
-function getCssClasses(el) {
-  return filterAngularClasses(el.classList);
-}
-function buildElementContext(element, componentResolver, sourceResolver) {
-  const compResult = componentResolver?.(element);
-  const srcResult = sourceResolver?.(element);
-  const componentStack = [];
-  if (compResult?.stack) {
-    for (const entry of compResult.stack) {
-      let filePath = null;
-      let line = null;
-      let column = null;
-      if (entry.hostElement && sourceResolver) {
-        const src = sourceResolver(entry.hostElement);
-        if (src) {
-          filePath = src.filePath;
-          line = src.line;
-          column = src.column;
-        }
-      }
-      componentStack.push({ name: entry.name, filePath, line, column });
-    }
-  }
-  return {
-    element,
-    html: element.outerHTML,
-    componentName: compResult?.name ?? null,
-    filePath: srcResult?.filePath ?? null,
-    line: srcResult?.line ?? null,
-    column: srcResult?.column ?? null,
-    componentStack,
-    selector: buildSelector(element),
-    cssClasses: getCssClasses(element)
-  };
-}
-async function copyElement(element, deps) {
-  const context = buildElementContext(
-    element,
-    deps.getComponentResolver(),
-    deps.getSourceResolver()
-  );
-  deps.pluginRegistry.callHook("onElementSelect", context);
-  deps.pluginRegistry.callHook("onBeforeCopy", context);
-  let snippet = generateSnippet(context, deps.getMaxContextLines());
-  snippet = deps.pluginRegistry.callTransformHook(snippet, context);
-  try {
-    await navigator.clipboard.writeText(snippet);
-    const detail = {
-      componentName: context.componentName,
-      filePath: context.filePath,
-      line: context.line,
-      column: context.column,
-      cssClasses: context.cssClasses
-    };
-    showToast("Copied to clipboard", detail);
-    deps.pluginRegistry.callHook("onCopySuccess", snippet, context, void 0);
-    return { context, snippet };
-  } catch (err) {
-    const error = err instanceof Error ? err : new Error(String(err));
-    deps.pluginRegistry.callHook("onCopyError", error);
-    return null;
-  }
-}
-
-// src/core/plugins/plugin-registry.ts
-function createPluginRegistry() {
-  const plugins = /* @__PURE__ */ new Map();
-  const cleanups = /* @__PURE__ */ new Map();
-  return {
-    register(plugin, api) {
-      if (plugins.has(plugin.name)) {
-        this.unregister(plugin.name);
-      }
-      plugins.set(plugin.name, plugin);
-      if (plugin.setup) {
-        const cleanup = plugin.setup(api);
-        if (cleanup) {
-          cleanups.set(plugin.name, cleanup);
-        }
-      }
-    },
-    unregister(name) {
-      const cleanup = cleanups.get(name);
-      if (cleanup) {
-        cleanup();
-        cleanups.delete(name);
-      }
-      plugins.delete(name);
-    },
-    callHook(hookName, ...args) {
-      for (const plugin of plugins.values()) {
-        const hook = plugin.hooks?.[hookName];
-        if (hook) {
-          try {
-            hook(...args);
-          } catch (err) {
-            console.warn(`[angular-grab] Plugin "${plugin.name}" hook "${hookName}" threw:`, err);
-          }
-        }
-      }
-    },
-    callTransformHook(text, context) {
-      let result = text;
-      for (const plugin of plugins.values()) {
-        const transform = plugin.hooks?.transformCopyContent;
-        if (transform) {
-          try {
-            result = transform(result, context);
-          } catch (err) {
-            console.warn(`[angular-grab] Plugin "${plugin.name}" transformCopyContent threw:`, err);
-          }
-        }
-      }
-      return result;
-    },
-    getPlugins() {
-      return Array.from(plugins.values());
-    },
-    dispose() {
-      for (const [name] of plugins) {
-        const cleanup = cleanups.get(name);
-        if (cleanup) {
-          try {
-            cleanup();
-          } catch {
-          }
-        }
-      }
-      cleanups.clear();
-      plugins.clear();
-    }
-  };
-}
-
-// src/core/toolbar/theme-manager.ts
-var STYLE_ID2 = "__ag-theme-vars__";
-var OVERRIDE_STYLE_ID = "__ag-theme-overrides__";
-var DARK_VARS = `
-  :root {
-    --ag-bg: #0f172a;
-    --ag-text: #e2e8f0;
-    --ag-text-muted: #64748b;
-    --ag-accent: #3b82f6;
-    --ag-accent-hover: #2563eb;
-    --ag-surface: #1e293b;
-    --ag-border: #334155;
-    --ag-overlay-border: #3b82f6;
-    --ag-overlay-bg: rgba(59, 130, 246, 0.1);
-    --ag-label-bg: #3b82f6;
-    --ag-label-text: #fff;
-    --ag-toast-bg: #0f172a;
-    --ag-toast-text: #e2e8f0;
-    --ag-toast-title: #fff;
-    --ag-toast-label: #64748b;
-    --ag-toast-shadow: rgba(0, 0, 0, 0.4);
-    --ag-toolbar-bg: #0f172a;
-    --ag-toolbar-text: #94a3b8;
-    --ag-toolbar-hover: #1e293b;
-    --ag-toolbar-active: #3b82f6;
-    --ag-toolbar-border: #1e293b;
-    --ag-toolbar-shadow: rgba(0, 0, 0, 0.5);
-    --ag-popover-bg: #0f172a;
-    --ag-popover-text: #e2e8f0;
-    --ag-popover-border: #1e293b;
-    --ag-popover-hover: #1e293b;
-    --ag-popover-shadow: rgba(0, 0, 0, 0.5);
-  }
-`;
-var LIGHT_VARS = `
-  :root {
-    --ag-bg: #ffffff;
-    --ag-text: #334155;
-    --ag-text-muted: #94a3b8;
-    --ag-accent: #2563eb;
-    --ag-accent-hover: #1d4ed8;
-    --ag-surface: #f1f5f9;
-    --ag-border: #e2e8f0;
-    --ag-overlay-border: #2563eb;
-    --ag-overlay-bg: rgba(37, 99, 235, 0.08);
-    --ag-label-bg: #2563eb;
-    --ag-label-text: #fff;
-    --ag-toast-bg: #ffffff;
-    --ag-toast-text: #334155;
-    --ag-toast-title: #0f172a;
-    --ag-toast-label: #94a3b8;
-    --ag-toast-shadow: rgba(0, 0, 0, 0.12);
-    --ag-toolbar-bg: #ffffff;
-    --ag-toolbar-text: #64748b;
-    --ag-toolbar-hover: #f1f5f9;
-    --ag-toolbar-active: #2563eb;
-    --ag-toolbar-border: #e2e8f0;
-    --ag-toolbar-shadow: rgba(0, 0, 0, 0.12);
-    --ag-popover-bg: #ffffff;
-    --ag-popover-text: #334155;
-    --ag-popover-border: #e2e8f0;
-    --ag-popover-hover: #f1f5f9;
-    --ag-popover-shadow: rgba(0, 0, 0, 0.12);
-  }
-`;
-var THEME_TO_VAR = {
-  overlayBorderColor: "--ag-overlay-border",
-  overlayBgColor: "--ag-overlay-bg",
-  labelBgColor: "--ag-label-bg",
-  labelTextColor: "--ag-label-text",
-  toastBgColor: "--ag-toast-bg",
-  toastTextColor: "--ag-toast-text",
-  toolbarBgColor: "--ag-toolbar-bg",
-  toolbarTextColor: "--ag-toolbar-text",
-  toolbarAccentColor: "--ag-toolbar-active",
-  popoverBgColor: "--ag-popover-bg",
-  popoverTextColor: "--ag-popover-text",
-  popoverBorderColor: "--ag-popover-border"
-};
-function createThemeManager() {
-  let styleEl = null;
-  let overrideEl = null;
-  let currentMode = "dark";
-  let mediaQuery = null;
-  let mediaHandler = null;
-  function getOrCreateStyle() {
-    if (styleEl) return styleEl;
-    const existing = document.getElementById(STYLE_ID2);
-    if (existing) {
-      styleEl = existing;
-      return styleEl;
-    }
-    styleEl = document.createElement("style");
-    styleEl.id = STYLE_ID2;
-    document.head.appendChild(styleEl);
-    return styleEl;
-  }
-  function getOrCreateOverrideStyle() {
-    if (overrideEl) return overrideEl;
-    overrideEl = document.createElement("style");
-    overrideEl.id = OVERRIDE_STYLE_ID;
-    document.head.appendChild(overrideEl);
-    return overrideEl;
-  }
-  function resolveMode(mode) {
-    if (mode !== "system") return mode;
-    return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
-  }
-  function applyResolved(resolved) {
-    const el = getOrCreateStyle();
-    el.textContent = resolved === "dark" ? DARK_VARS : LIGHT_VARS;
-  }
-  function detachMediaListener() {
-    if (mediaQuery && mediaHandler) {
-      mediaQuery.removeEventListener("change", mediaHandler);
-    }
-    mediaQuery = null;
-    mediaHandler = null;
-  }
-  return {
-    apply(mode) {
-      currentMode = mode;
-      detachMediaListener();
-      applyResolved(resolveMode(mode));
-      if (mode === "system") {
-        mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-        mediaHandler = () => applyResolved(resolveMode("system"));
-        mediaQuery.addEventListener("change", mediaHandler);
-      }
-    },
-    applyOverrides(theme) {
-      const vars = [];
-      for (const [key, varName] of Object.entries(THEME_TO_VAR)) {
-        const value = theme[key];
-        if (value) {
-          vars.push(`    ${varName}: ${value};`);
-        }
-      }
-      if (vars.length === 0) {
-        this.clearOverrides();
-        return;
-      }
-      const el = getOrCreateOverrideStyle();
-      el.textContent = `  :root {
-${vars.join("\n")}
-  }`;
-    },
-    clearOverrides() {
-      overrideEl?.remove();
-      document.getElementById(OVERRIDE_STYLE_ID)?.remove();
-      overrideEl = null;
-    },
-    dispose() {
-      detachMediaListener();
-      styleEl?.remove();
-      document.getElementById(STYLE_ID2)?.remove();
-      styleEl = null;
-      this.clearOverrides();
-    }
-  };
-}
-
-// src/core/toolbar/toolbar-icons.ts
-var ICON_GRAB = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M5.5 7V3.5a1 1 0 0 1 2 0V7"/><path d="M7.5 6.5V2.5a1 1 0 0 1 2 0v4"/><path d="M9.5 7V3.5a1 1 0 0 1 2 0V8"/><path d="M5.5 7V5.5a1 1 0 0 0-2 0V9a4 4 0 0 0 4 4h1.5a4 4 0 0 0 4-4V6a1 1 0 0 0-2 0"/></svg>`;
-var ICON_HISTORY = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="6"/><path d="M8 4.5V8l2.5 1.5"/></svg>`;
-var ICON_ELLIPSIS = `<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><circle cx="4" cy="8" r="1.25"/><circle cx="8" cy="8" r="1.25"/><circle cx="12" cy="8" r="1.25"/></svg>`;
-var ICON_SUN = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="3"/><path d="M8 1.5v1M8 13.5v1M1.5 8h1M13.5 8h1M3.4 3.4l.7.7M11.9 11.9l.7.7M3.4 12.6l.7-.7M11.9 4.1l.7-.7"/></svg>`;
-var ICON_MOON = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M13.5 8.5a5.5 5.5 0 0 1-7-7 5.5 5.5 0 1 0 7 7z"/></svg>`;
-var ICON_SYSTEM = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><rect x="2" y="2" width="12" height="9" rx="1"/><path d="M5.5 14h5"/><path d="M8 11v3"/></svg>`;
-var ICON_POWER = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M8 2v5"/><path d="M4.5 4a5.5 5.5 0 1 0 7 0"/></svg>`;
-var ICON_DISMISS = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" xmlns="http://www.w3.org/2000/svg"><path d="M4 4l8 8M12 4l-8 8"/></svg>`;
-var ICON_COPY = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><rect x="5.5" y="5.5" width="7" height="8" rx="1"/><path d="M3.5 10.5v-7a1 1 0 0 1 1-1h5"/></svg>`;
-var ICON_STYLES = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M13 1.5l-1.3 4.3a1 1 0 0 1-.7.7L6.7 7.8a1 1 0 0 0-.7.7L4.7 12.8a1 1 0 0 1-.7.7L1.5 14"/><path d="M7.5 5.5l3 3"/></svg>`;
-var ICON_CODE = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M5 4.5L1.5 8 5 11.5"/><path d="M11 4.5l3.5 3.5-3.5 3.5"/><path d="M9.5 2.5l-3 11"/></svg>`;
-var ICON_COMMENT = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M2 3a1 1 0 0 1 1-1h10a1 1 0 0 1 1 1v7a1 1 0 0 1-1 1H5l-3 3V3z"/></svg>`;
-var ICON_TRASH = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M2.5 4.5h11"/><path d="M5.5 4.5V3a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v1.5"/><path d="M4 4.5l.5 8.5a1 1 0 0 0 1 1h5a1 1 0 0 0 1-1l.5-8.5"/></svg>`;
-var ICON_FREEZE = `<svg width="16" height="16" viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" xmlns="http://www.w3.org/2000/svg"><path d="M8 1v14"/><path d="M1 8h14"/><path d="M8 1l2 2M8 1L6 3"/><path d="M8 15l2-2M8 15l-2-2"/><path d="M1 8l2 2M1 8l2-2"/><path d="M15 8l-2 2M15 8l-2-2"/></svg>`;
-
-// src/core/toolbar/toolbar-renderer.ts
-var TOOLBAR_ID = "__ag-toolbar__";
-var STYLE_ID3 = "__ag-toolbar-styles__";
-function createToolbarRenderer(callbacks) {
-  let container = null;
-  let leftGroup = null;
-  let buttons = {};
-  let allElements = /* @__PURE__ */ new Set();
-  function injectStyles2() {
-    if (document.getElementById(STYLE_ID3)) return;
-    const style = document.createElement("style");
-    style.id = STYLE_ID3;
-    style.textContent = `
-      #${TOOLBAR_ID} {
-        position: fixed;
-        bottom: 20px;
-        left: 50%;
-        transform: translateX(-50%);
-        z-index: ${Z_INDEX_TOOLBAR};
-        display: flex;
-        align-items: center;
-        gap: 2px;
-        padding: 4px 6px;
-        background: var(--ag-toolbar-bg, #0f172a);
-        border: 1px solid var(--ag-toolbar-border, #1e293b);
-        border-radius: 24px;
-        box-shadow: 0 4px 16px var(--ag-toolbar-shadow, rgba(0, 0, 0, 0.5));
-        pointer-events: auto;
-        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-        transition: opacity 0.2s ease, transform 0.2s ease;
-      }
-      #${TOOLBAR_ID}.ag-toolbar-hidden {
-        opacity: 0;
-        transform: translateX(-50%) translateY(20px);
-        pointer-events: none;
-      }
-      #${TOOLBAR_ID} button {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        width: 32px;
-        height: 32px;
-        border: none;
-        border-radius: 8px;
-        background: transparent;
-        color: var(--ag-toolbar-text, #94a3b8);
-        cursor: pointer;
-        padding: 0;
-        transition: background 0.15s ease, color 0.15s ease;
-      }
-      #${TOOLBAR_ID} button:hover {
-        background: var(--ag-toolbar-hover, #1e293b);
-        color: var(--ag-accent, #3b82f6);
-      }
-      #${TOOLBAR_ID} button.ag-btn-active {
-        color: var(--ag-toolbar-active, #3b82f6);
-      }
-      #${TOOLBAR_ID} button.ag-btn-disabled {
-        opacity: 0.4;
-        color: var(--ag-toolbar-text, #94a3b8);
-      }
-      #${TOOLBAR_ID} .ag-toolbar-divider {
-        width: 1px;
-        height: 20px;
-        background: var(--ag-toolbar-border, #1e293b);
-        margin: 0 4px;
-        flex-shrink: 0;
-      }
-      #${TOOLBAR_ID} .ag-toolbar-left {
-        display: flex;
-        align-items: center;
-        gap: 2px;
-        overflow: hidden;
-        max-width: 240px;
-        opacity: 1;
-        transition: max-width 0.25s ease, opacity 0.2s ease, margin 0.25s ease;
-      }
-      #${TOOLBAR_ID} .ag-toolbar-left.ag-toolbar-left-hidden {
-        max-width: 0;
-        opacity: 0;
-        pointer-events: none;
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function createButton(name, icon, title, onClick) {
-    const btn = document.createElement("button");
-    btn.innerHTML = icon;
-    btn.title = title;
-    btn.setAttribute("aria-label", title);
-    btn.setAttribute("data-ag-btn", name);
-    btn.addEventListener("click", (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      onClick();
-    });
-    return btn;
-  }
-  function ensureContainer() {
-    if (container) return;
-    injectStyles2();
-    container = document.createElement("div");
-    container.id = TOOLBAR_ID;
-    container.setAttribute("role", "toolbar");
-    container.setAttribute("aria-label", "Angular Grab toolbar");
-    buttons.selection = createButton("selection", ICON_GRAB, "Selection mode", callbacks.onSelectionMode);
-    buttons.history = createButton("history", ICON_HISTORY, "History", callbacks.onHistory);
-    buttons.actions = createButton("actions", ICON_ELLIPSIS, "Actions", callbacks.onActions);
-    buttons.freeze = createButton("freeze", ICON_FREEZE, "Freeze page (F)", callbacks.onFreeze);
-    buttons.theme = createButton("theme", ICON_SUN, "Toggle theme", callbacks.onThemeToggle);
-    buttons.enable = createButton("enable", ICON_POWER, "Enable/Disable", callbacks.onEnableToggle);
-    buttons.dismiss = createButton("dismiss", ICON_DISMISS, "Dismiss toolbar", callbacks.onDismiss);
-    const divider = document.createElement("span");
-    divider.className = "ag-toolbar-divider";
-    leftGroup = document.createElement("div");
-    leftGroup.className = "ag-toolbar-left";
-    leftGroup.appendChild(buttons.selection);
-    leftGroup.appendChild(buttons.history);
-    leftGroup.appendChild(buttons.actions);
-    leftGroup.appendChild(buttons.freeze);
-    leftGroup.appendChild(divider);
-    container.appendChild(leftGroup);
-    container.appendChild(buttons.theme);
-    container.appendChild(buttons.enable);
-    container.appendChild(buttons.dismiss);
-    document.body.appendChild(container);
-    allElements.clear();
-    allElements.add(container);
-    allElements.add(leftGroup);
-    allElements.add(divider);
-    for (const btn of Object.values(buttons)) {
-      allElements.add(btn);
-    }
-  }
-  return {
-    show() {
-      ensureContainer();
-      container.classList.remove("ag-toolbar-hidden");
-    },
-    hide() {
-      if (container) {
-        container.classList.add("ag-toolbar-hidden");
-      }
-    },
-    update(state) {
-      if (!container) return;
-      if (state.active) {
-        buttons.selection.classList.add("ag-btn-active");
-      } else {
-        buttons.selection.classList.remove("ag-btn-active");
-      }
-      const mode = state.toolbar.themeMode;
-      const themeIcon = mode === "dark" ? ICON_SUN : mode === "light" ? ICON_MOON : ICON_SYSTEM;
-      const themeLabel = mode === "dark" ? "Switch to light mode" : mode === "light" ? "Switch to system theme" : "Switch to dark mode";
-      buttons.theme.innerHTML = themeIcon;
-      buttons.theme.title = themeLabel;
-      buttons.theme.setAttribute("aria-label", themeLabel);
-      if (state.frozen) {
-        buttons.freeze.classList.add("ag-btn-active");
-      } else {
-        buttons.freeze.classList.remove("ag-btn-active");
-      }
-      if (state.options.enabled) {
-        buttons.enable.classList.add("ag-btn-active");
-        leftGroup?.classList.remove("ag-toolbar-left-hidden");
-      } else {
-        buttons.enable.classList.remove("ag-btn-active");
-        leftGroup?.classList.add("ag-toolbar-left-hidden");
-      }
-    },
-    isToolbarElement(el) {
-      if (allElements.has(el)) return true;
-      let current = el;
-      while (current) {
-        if (current === container) return true;
-        if (current.id === TOOLBAR_ID) return true;
-        current = current.parentElement;
-      }
-      return false;
-    },
-    dispose() {
-      container?.remove();
-      document.getElementById(STYLE_ID3)?.remove();
-      container = null;
-      leftGroup = null;
-      buttons = {};
-      allElements.clear();
-    }
-  };
-}
-
-// src/core/toolbar/history-popover.ts
-var POPOVER_ID = "__ag-history-popover__";
-var STYLE_ID4 = "__ag-history-styles__";
-function formatRelativeTime(timestamp) {
-  const diff = Date.now() - timestamp;
-  const seconds = Math.floor(diff / 1e3);
-  if (seconds < 60) return "just now";
-  const minutes = Math.floor(seconds / 60);
-  if (minutes < 60) return `${minutes}m ago`;
-  const hours = Math.floor(minutes / 60);
-  if (hours < 24) return `${hours}h ago`;
-  const days = Math.floor(hours / 24);
-  return `${days}d ago`;
-}
-function shortPath(filePath) {
-  const parts = filePath.split("/");
-  return parts[parts.length - 1];
-}
-function buildVsCodeUri(filePath, line, column) {
-  let uri = `vscode://file/${encodeURI(filePath)}`;
-  if (line != null) uri += `:${line}`;
-  if (line != null && column != null) uri += `:${column}`;
-  return uri;
-}
-function createHistoryPopover(callbacks) {
-  let popover = null;
-  let visible = false;
-  function injectStyles2() {
-    if (document.getElementById(STYLE_ID4)) return;
-    const style = document.createElement("style");
-    style.id = STYLE_ID4;
-    style.textContent = `
-      #${POPOVER_ID} {
-        position: fixed;
-        bottom: ${TOOLBAR_POPOVER_OFFSET};
-        left: 50%;
-        transform: translateX(-50%);
-        z-index: ${Z_INDEX_POPOVER};
-        background: var(--ag-popover-bg, #0f172a);
-        border: 1px solid var(--ag-popover-border, #1e293b);
-        border-radius: 12px;
-        box-shadow: 0 8px 24px var(--ag-popover-shadow, rgba(0, 0, 0, 0.5));
-        min-width: 320px;
-        max-width: 420px;
-        max-height: 360px;
-        overflow-y: auto;
-        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-        opacity: 0;
-        visibility: hidden;
-        transition: opacity 0.15s ease, visibility 0.15s ease;
-        pointer-events: auto;
-      }
-      #${POPOVER_ID}.ag-popover-visible {
-        opacity: 1;
-        visibility: visible;
-      }
-      #${POPOVER_ID} .ag-history-header {
-        padding: 10px 14px 8px;
-        font-size: 11px;
-        font-weight: 600;
-        text-transform: uppercase;
-        letter-spacing: 0.05em;
-        color: var(--ag-text-muted, #64748b);
-        border-bottom: 1px solid var(--ag-popover-border, #1e293b);
-      }
-      #${POPOVER_ID} .ag-history-empty {
-        padding: 24px 14px;
-        text-align: center;
-        color: var(--ag-text-muted, #64748b);
-        font-size: 13px;
-      }
-      #${POPOVER_ID} .ag-history-item {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        gap: 12px;
-        padding: 8px 14px;
-        cursor: pointer;
-        border: none;
-        border-bottom: 1px solid var(--ag-popover-border, #1e293b);
-        background: transparent;
-        width: 100%;
-        text-align: left;
-        font: inherit;
-        color: inherit;
-        transition: background 0.1s ease;
-      }
-      #${POPOVER_ID} .ag-history-item:last-child {
-        border-bottom: none;
-      }
-      #${POPOVER_ID} .ag-history-item:hover {
-        background: var(--ag-popover-hover, #1e293b);
-      }
-      #${POPOVER_ID} .ag-history-info {
-        flex: 1;
-        min-width: 0;
-      }
-      #${POPOVER_ID} .ag-history-selector {
-        font: 12px/1.3 ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
-        color: var(--ag-popover-text, #e2e8f0);
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      #${POPOVER_ID} .ag-history-meta {
-        font-size: 11px;
-        color: var(--ag-text-muted, #64748b);
-        margin-top: 2px;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        white-space: nowrap;
-      }
-      #${POPOVER_ID} .ag-history-time {
-        font-size: 11px;
-        color: var(--ag-text-muted, #64748b);
-        flex-shrink: 0;
-      }
-      #${POPOVER_ID} .ag-history-file-link {
-        color: var(--ag-text-muted, #64748b);
-        text-decoration: none;
-      }
-      #${POPOVER_ID} .ag-history-file-link:hover {
-        text-decoration: underline;
-        color: var(--ag-accent, #3b82f6);
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function ensurePopover() {
-    if (popover) return popover;
-    injectStyles2();
-    popover = document.createElement("div");
-    popover.id = POPOVER_ID;
-    popover.setAttribute("role", "dialog");
-    popover.setAttribute("aria-label", "Grab history");
-    document.body.appendChild(popover);
-    return popover;
-  }
-  function render(entries) {
-    const el = ensurePopover();
-    let html = '<div class="ag-history-header">History</div>';
-    if (entries.length === 0) {
-      html += '<div class="ag-history-empty">No elements grabbed yet</div>';
-    } else {
-      for (const entry of entries) {
-        const selector = escapeHtml(entry.context.selector);
-        const comp = entry.context.componentName ? escapeHtml(entry.context.componentName) : "";
-        const time = formatRelativeTime(entry.timestamp);
-        let meta = comp ? `in ${comp}` : "";
-        if (entry.context.filePath) {
-          const uri = buildVsCodeUri(entry.context.filePath, entry.context.line, entry.context.column);
-          const fileName = escapeHtml(shortPath(entry.context.filePath));
-          const sep = meta ? " \u2014 " : "";
-          meta += `${sep}<a class="ag-history-file-link" href="${escapeHtml(uri)}" title="Open in VS Code">${fileName}</a>`;
-        }
-        html += `<button class="ag-history-item" data-ag-history-id="${escapeHtml(entry.id)}" aria-label="Re-copy ${selector}">`;
-        html += `<div class="ag-history-info">`;
-        html += `<div class="ag-history-selector">${selector}</div>`;
-        if (meta) html += `<div class="ag-history-meta">${meta}</div>`;
-        html += `</div>`;
-        html += `<span class="ag-history-time">${time}</span>`;
-        html += `</button>`;
-      }
-    }
-    el.innerHTML = html;
-    const items = el.querySelectorAll(".ag-history-item");
-    items.forEach((item) => {
-      item.addEventListener("click", (e) => {
-        e.stopPropagation();
-        const id = item.dataset.agHistoryId;
-        const entry = entries.find((ent) => ent.id === id);
-        if (entry) {
-          callbacks.onEntryClick(entry);
-        }
-      });
-    });
-  }
-  return {
-    show(entries) {
-      render(entries);
-      visible = true;
-      void ensurePopover().offsetHeight;
-      ensurePopover().classList.add("ag-popover-visible");
-    },
-    hide() {
-      visible = false;
-      popover?.classList.remove("ag-popover-visible");
-    },
-    isVisible() {
-      return visible;
-    },
-    isPopoverElement(el) {
-      if (!popover) return false;
-      let current = el;
-      while (current) {
-        if (current === popover || current.id === POPOVER_ID) return true;
-        current = current.parentElement;
-      }
-      return false;
-    },
-    dispose() {
-      popover?.remove();
-      document.getElementById(STYLE_ID4)?.remove();
-      popover = null;
-      visible = false;
-    }
-  };
-}
-
-// src/core/toolbar/actions-menu.ts
-var MENU_ID = "__ag-actions-menu__";
-var STYLE_ID5 = "__ag-actions-styles__";
-function createActionsMenu(callbacks) {
-  let menu = null;
-  let visible = false;
-  const items = [
-    { icon: ICON_COPY, label: "Copy Element", action: callbacks.onCopyElement },
-    { icon: ICON_STYLES, label: "Copy Styles", action: callbacks.onCopyStyles },
-    { icon: ICON_CODE, label: "Copy HTML", action: callbacks.onCopyHtml },
-    { icon: ICON_COMMENT, label: "Comment", action: callbacks.onComment },
-    { separator: true },
-    { icon: ICON_TRASH, label: "Clear History", action: callbacks.onClearHistory }
-  ];
-  function injectStyles2() {
-    if (document.getElementById(STYLE_ID5)) return;
-    const style = document.createElement("style");
-    style.id = STYLE_ID5;
-    style.textContent = `
-      #${MENU_ID} {
-        position: fixed;
-        bottom: ${TOOLBAR_POPOVER_OFFSET};
-        left: 50%;
-        transform: translateX(-50%);
-        z-index: ${Z_INDEX_POPOVER};
-        background: var(--ag-popover-bg, #0f172a);
-        border: 1px solid var(--ag-popover-border, #1e293b);
-        border-radius: 10px;
-        box-shadow: 0 8px 24px var(--ag-popover-shadow, rgba(0, 0, 0, 0.5));
-        min-width: 200px;
-        padding: 4px;
-        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-        opacity: 0;
-        visibility: hidden;
-        transition: opacity 0.15s ease, visibility 0.15s ease;
-        pointer-events: auto;
-      }
-      #${MENU_ID}.ag-menu-visible {
-        opacity: 1;
-        visibility: visible;
-      }
-      #${MENU_ID} .ag-menu-item {
-        display: flex;
-        align-items: center;
-        gap: 10px;
-        padding: 8px 12px;
-        border: none;
-        border-radius: 6px;
-        background: transparent;
-        color: var(--ag-popover-text, #e2e8f0);
-        font-size: 13px;
-        cursor: pointer;
-        width: 100%;
-        text-align: left;
-        transition: background 0.1s ease;
-      }
-      #${MENU_ID} .ag-menu-item:hover {
-        background: var(--ag-popover-hover, #1e293b);
-      }
-      #${MENU_ID} .ag-menu-item svg {
-        flex-shrink: 0;
-        opacity: 0.7;
-      }
-      #${MENU_ID} .ag-menu-sep {
-        height: 1px;
-        background: var(--ag-popover-border, #1e293b);
-        margin: 4px 8px;
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function ensureMenu() {
-    if (menu) return menu;
-    injectStyles2();
-    menu = document.createElement("div");
-    menu.id = MENU_ID;
-    menu.setAttribute("role", "menu");
-    menu.setAttribute("aria-label", "Actions");
-    for (const entry of items) {
-      if (entry.separator) {
-        const sep = document.createElement("div");
-        sep.className = "ag-menu-sep";
-        menu.appendChild(sep);
-        continue;
-      }
-      const btn = document.createElement("button");
-      btn.className = "ag-menu-item";
-      btn.setAttribute("role", "menuitem");
-      btn.innerHTML = `${entry.icon}<span>${escapeHtml(entry.label)}</span>`;
-      btn.addEventListener("click", (e) => {
-        e.preventDefault();
-        e.stopPropagation();
-        visible = false;
-        menu?.classList.remove("ag-menu-visible");
-        entry.action();
-      });
-      menu.appendChild(btn);
-    }
-    document.body.appendChild(menu);
-    return menu;
-  }
-  return {
-    show() {
-      const el = ensureMenu();
-      visible = true;
-      void el.offsetHeight;
-      el.classList.add("ag-menu-visible");
-    },
-    hide() {
-      visible = false;
-      menu?.classList.remove("ag-menu-visible");
-    },
-    isVisible() {
-      return visible;
-    },
-    isMenuElement(el) {
-      if (!menu) return false;
-      let current = el;
-      while (current) {
-        if (current === menu || current.id === MENU_ID) return true;
-        current = current.parentElement;
-      }
-      return false;
-    },
-    dispose() {
-      menu?.remove();
-      document.getElementById(STYLE_ID5)?.remove();
-      menu = null;
-      visible = false;
-    }
-  };
-}
-
-// src/core/toolbar/comment-popover.ts
-var POPOVER_ID2 = "__ag-comment-popover__";
-var STYLE_ID6 = "__ag-comment-styles__";
-function createCommentPopover(callbacks) {
-  let popover = null;
-  let textarea = null;
-  let visible = false;
-  let keydownHandler = null;
-  function injectStyles2() {
-    if (document.getElementById(STYLE_ID6)) return;
-    const style = document.createElement("style");
-    style.id = STYLE_ID6;
-    style.textContent = `
-      #${POPOVER_ID2} {
-        position: fixed;
-        bottom: ${TOOLBAR_POPOVER_OFFSET};
-        left: 50%;
-        transform: translateX(-50%);
-        z-index: ${Z_INDEX_POPOVER};
-        background: var(--ag-popover-bg, #0f172a);
-        border: 1px solid var(--ag-popover-border, #1e293b);
-        border-radius: 12px;
-        box-shadow: 0 8px 24px var(--ag-popover-shadow, rgba(0, 0, 0, 0.5));
-        width: 340px;
-        padding: 14px;
-        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-        opacity: 0;
-        visibility: hidden;
-        transition: opacity 0.15s ease, visibility 0.15s ease;
-        pointer-events: auto;
-      }
-      #${POPOVER_ID2}.ag-comment-visible {
-        opacity: 1;
-        visibility: visible;
-      }
-      #${POPOVER_ID2} textarea {
-        width: 100%;
-        min-height: 80px;
-        padding: 8px 10px;
-        border: 1px solid var(--ag-popover-border, #1e293b);
-        border-radius: 8px;
-        background: var(--ag-surface, #1e293b);
-        color: var(--ag-popover-text, #e2e8f0);
-        font: 13px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-        resize: vertical;
-        outline: none;
-        box-sizing: border-box;
-      }
-      #${POPOVER_ID2} textarea:focus {
-        border-color: var(--ag-accent, #3b82f6);
-      }
-      #${POPOVER_ID2} textarea::placeholder {
-        color: var(--ag-text-muted, #64748b);
-      }
-      #${POPOVER_ID2} .ag-comment-footer {
-        display: flex;
-        justify-content: flex-end;
-        gap: 8px;
-        margin-top: 10px;
-      }
-      #${POPOVER_ID2} .ag-comment-btn {
-        padding: 6px 14px;
-        border: none;
-        border-radius: 6px;
-        font-size: 13px;
-        font-weight: 500;
-        cursor: pointer;
-        transition: background 0.15s ease;
-      }
-      #${POPOVER_ID2} .ag-comment-cancel {
-        background: transparent;
-        color: var(--ag-text-muted, #64748b);
-      }
-      #${POPOVER_ID2} .ag-comment-cancel:hover {
-        background: var(--ag-popover-hover, #1e293b);
-        color: var(--ag-popover-text, #e2e8f0);
-      }
-      #${POPOVER_ID2} .ag-comment-submit {
-        background: var(--ag-accent, #3b82f6);
-        color: #fff;
-      }
-      #${POPOVER_ID2} .ag-comment-submit:hover {
-        background: var(--ag-accent-hover, #2563eb);
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function ensurePopover() {
-    if (popover) return popover;
-    injectStyles2();
-    popover = document.createElement("div");
-    popover.id = POPOVER_ID2;
-    popover.setAttribute("role", "dialog");
-    popover.setAttribute("aria-label", "Add comment");
-    textarea = document.createElement("textarea");
-    textarea.placeholder = "Add a comment...";
-    textarea.rows = 3;
-    const footer = document.createElement("div");
-    footer.className = "ag-comment-footer";
-    const cancelBtn = document.createElement("button");
-    cancelBtn.className = "ag-comment-btn ag-comment-cancel";
-    cancelBtn.textContent = "Cancel";
-    cancelBtn.addEventListener("click", (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      doHide();
-      callbacks.onCancel();
-    });
-    const submitBtn = document.createElement("button");
-    submitBtn.className = "ag-comment-btn ag-comment-submit";
-    submitBtn.textContent = "Copy with Comment";
-    submitBtn.addEventListener("click", (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      const comment = textarea.value.trim();
-      if (comment) {
-        doHide();
-        callbacks.onSubmit(comment);
-      } else {
-        textarea.style.borderColor = "var(--ag-accent, #3b82f6)";
-        textarea.setAttribute("placeholder", "Please enter a comment...");
-        textarea.focus();
-        setTimeout(() => {
-          if (textarea) {
-            textarea.style.borderColor = "";
-            textarea.setAttribute("placeholder", "Add a comment...");
-          }
-        }, 2e3);
-      }
-    });
-    footer.appendChild(cancelBtn);
-    footer.appendChild(submitBtn);
-    popover.appendChild(textarea);
-    popover.appendChild(footer);
-    document.body.appendChild(popover);
-    return popover;
-  }
-  function attachKeydownInterceptor() {
-    if (keydownHandler) return;
-    keydownHandler = (e) => {
-      if (textarea && document.activeElement === textarea) {
-        e.stopImmediatePropagation();
-        if (e.key === "Escape") {
-          doHide();
-          callbacks.onCancel();
-        }
-      }
-    };
-    document.addEventListener("keydown", keydownHandler, true);
-  }
-  function detachKeydownInterceptor() {
-    if (keydownHandler) {
-      document.removeEventListener("keydown", keydownHandler, true);
-      keydownHandler = null;
-    }
-  }
-  function doHide() {
-    visible = false;
-    popover?.classList.remove("ag-comment-visible");
-    detachKeydownInterceptor();
-  }
-  return {
-    show() {
-      const el = ensurePopover();
-      textarea.value = "";
-      visible = true;
-      void el.offsetHeight;
-      el.classList.add("ag-comment-visible");
-      attachKeydownInterceptor();
-      requestAnimationFrame(() => textarea?.focus());
-    },
-    hide() {
-      doHide();
-    },
-    isVisible() {
-      return visible;
-    },
-    isPopoverElement(el) {
-      if (!popover) return false;
-      let current = el;
-      while (current) {
-        if (current === popover || current.id === POPOVER_ID2) return true;
-        current = current.parentElement;
-      }
-      return false;
-    },
-    dispose() {
-      detachKeydownInterceptor();
-      popover?.remove();
-      document.getElementById(STYLE_ID6)?.remove();
-      popover = null;
-      textarea = null;
-      visible = false;
-    }
-  };
-}
-
-// src/core/toolbar/copy-actions.ts
-async function copyElementSnippet(context, maxLines, pluginRegistry) {
-  let snippet = generateSnippet(context, maxLines);
-  if (pluginRegistry) {
-    snippet = pluginRegistry.callTransformHook(snippet, context);
-  }
-  const ok = await writeAndToast(snippet, "Copied to clipboard", context);
-  if (ok) pluginRegistry?.callHook("onCopySuccess", snippet, context, void 0);
-  return ok;
-}
-async function copyElementHtml(context, pluginRegistry) {
-  const cleaned = cleanAngularAttrs(context.html);
-  const ok = await writeAndToast(cleaned, "HTML copied to clipboard", context);
-  if (ok) pluginRegistry?.callHook("onCopySuccess", cleaned, context, void 0);
-  return ok;
-}
-async function copyElementStyles(element) {
-  if (!element.isConnected) {
-    showToast("Element is no longer on the page");
-    return false;
-  }
-  const computed = window.getComputedStyle(element);
-  const tag = element.tagName.toLowerCase();
-  const lines = [`/* Computed styles for <${tag}> */`, `${tag} {`];
-  const props = [
-    "display",
-    "position",
-    "top",
-    "right",
-    "bottom",
-    "left",
-    "width",
-    "height",
-    "min-width",
-    "min-height",
-    "max-width",
-    "max-height",
-    "margin",
-    "padding",
-    "border",
-    "border-radius",
-    "background",
-    "background-color",
-    "color",
-    "font",
-    "font-size",
-    "font-weight",
-    "font-family",
-    "line-height",
-    "text-align",
-    "text-decoration",
-    "text-transform",
-    "opacity",
-    "overflow",
-    "z-index",
-    "flex-direction",
-    "justify-content",
-    "align-items",
-    "gap",
-    "grid-template-columns",
-    "grid-template-rows",
-    "box-shadow",
-    "cursor",
-    "transition",
-    "transform"
-  ];
-  for (const prop of props) {
-    const value = computed.getPropertyValue(prop);
-    if (value && value !== "none" && value !== "normal" && value !== "auto" && value !== "0px" && value !== "visible") {
-      lines.push(`  ${prop}: ${value};`);
-    }
-  }
-  lines.push("}");
-  const css = lines.join("\n");
-  return writeAndToast(css, "Styles copied to clipboard");
-}
-async function copyWithComment(context, comment, maxLines, pluginRegistry) {
-  let snippet = generateSnippet(context, maxLines);
-  if (pluginRegistry) {
-    snippet = pluginRegistry.callTransformHook(snippet, context);
-  }
-  const full = `${snippet}
-
-/* Comment: ${comment} */`;
-  const ok = await writeAndToast(full, "Copied with comment", context);
-  if (ok) pluginRegistry?.callHook("onCopySuccess", full, context, comment);
-  return ok;
-}
-async function writeAndToast(text, message, context) {
-  try {
-    await navigator.clipboard.writeText(text);
-    showToast(message, context ? {
-      componentName: context.componentName,
-      filePath: context.filePath,
-      line: context.line,
-      column: context.column,
-      cssClasses: context.cssClasses
-    } : void 0);
-    return true;
-  } catch {
-    return false;
-  }
-}
-
-// src/core/overlay/freeze-overlay.ts
-var FREEZE_ID = "__ag-freeze-overlay__";
-var FREEZE_STYLE_ID = "__ag-freeze-styles__";
-var HOVER_STYLE_ID = "__ag-freeze-hover-styles__";
-var ANIM_STYLE_ID = "__ag-freeze-anim-styles__";
-var HOVER_ATTR = "data-ag-hover";
-var MOUSE_EVENTS_TO_BLOCK = [
-  "mouseenter",
-  "mouseleave",
-  "mouseover",
-  "mouseout",
-  "pointerenter",
-  "pointerleave",
-  "pointerover",
-  "pointerout"
-];
-var FOCUS_EVENTS_TO_BLOCK = ["focus", "blur", "focusin", "focusout"];
-function createFreezeOverlay() {
-  let overlay = null;
-  let visible = false;
-  let hoverStyleEl = null;
-  let animStyleEl = null;
-  let markedElements = [];
-  function injectStyles2() {
-    if (document.getElementById(FREEZE_STYLE_ID)) return;
-    const style = document.createElement("style");
-    style.id = FREEZE_STYLE_ID;
-    style.textContent = `
-      #${FREEZE_ID} {
-        position: fixed;
-        top: 0;
-        left: 0;
-        width: 100vw;
-        height: 100vh;
-        z-index: ${Z_INDEX_FREEZE};
-        pointer-events: auto;
-        background: transparent;
-      }
-    `;
-    document.head.appendChild(style);
-  }
-  function ensureOverlay() {
-    if (overlay) return overlay;
-    injectStyles2();
-    overlay = document.createElement("div");
-    overlay.id = FREEZE_ID;
-    overlay.style.display = "none";
-    document.body.appendChild(overlay);
-    return overlay;
-  }
-  const stopEvent = (e) => {
-    e.stopImmediatePropagation();
-  };
-  const preventFocusChange = (e) => {
-    e.preventDefault();
-    e.stopImmediatePropagation();
-  };
-  function blockEvents() {
-    for (const type of MOUSE_EVENTS_TO_BLOCK) {
-      document.addEventListener(type, stopEvent, true);
-    }
-    for (const type of FOCUS_EVENTS_TO_BLOCK) {
-      document.addEventListener(type, preventFocusChange, true);
-    }
-  }
-  function unblockEvents() {
-    for (const type of MOUSE_EVENTS_TO_BLOCK) {
-      document.removeEventListener(type, stopEvent, true);
-    }
-    for (const type of FOCUS_EVENTS_TO_BLOCK) {
-      document.removeEventListener(type, preventFocusChange, true);
-    }
-  }
-  function markHoverChain(element) {
-    let current = element;
-    while (current && current !== document.documentElement) {
-      current.setAttribute(HOVER_ATTR, "");
-      markedElements.push(current);
-      current = current.parentElement;
-    }
-  }
-  function clearHoverMarks() {
-    for (const el of markedElements) {
-      el.removeAttribute(HOVER_ATTR);
-    }
-    markedElements = [];
-  }
-  function injectHoverRules() {
-    if (hoverStyleEl) return;
-    const cloned = [];
-    for (const sheet of Array.from(document.styleSheets)) {
-      let rules;
-      try {
-        rules = sheet.cssRules;
-      } catch {
-        continue;
-      }
-      collectHoverRules(rules, cloned);
-    }
-    if (cloned.length === 0) return;
-    hoverStyleEl = document.createElement("style");
-    hoverStyleEl.id = HOVER_STYLE_ID;
-    hoverStyleEl.textContent = cloned.join("\n");
-    document.head.appendChild(hoverStyleEl);
-  }
-  function collectHoverRules(rules, out) {
-    for (const rule of Array.from(rules)) {
-      if (rule instanceof CSSStyleRule) {
-        if (rule.selectorText.includes(":hover")) {
-          const newSelector = rule.selectorText.replace(/:hover/g, `[${HOVER_ATTR}]`);
-          out.push(`${newSelector} { ${rule.style.cssText} }`);
-        }
-      } else if (rule instanceof CSSMediaRule) {
-        const inner = [];
-        collectHoverRules(rule.cssRules, inner);
-        if (inner.length > 0) {
-          out.push(`@media ${rule.conditionText} { ${inner.join("\n")} }`);
-        }
-      }
-    }
-  }
-  function removeHoverRules() {
-    hoverStyleEl?.remove();
-    hoverStyleEl = null;
-  }
-  function freezeAnimations() {
-    if (animStyleEl) return;
-    animStyleEl = document.createElement("style");
-    animStyleEl.id = ANIM_STYLE_ID;
-    animStyleEl.textContent = `
-      *, *::before, *::after {
-        animation-play-state: paused !important;
-        transition: none !important;
-      }
-    `;
-    document.head.appendChild(animStyleEl);
-  }
-  function unfreezeAnimations() {
-    animStyleEl?.remove();
-    animStyleEl = null;
-  }
-  return {
-    show(hoveredElement) {
-      blockEvents();
-      if (hoveredElement) {
-        markHoverChain(hoveredElement);
-        injectHoverRules();
-      }
-      freezeAnimations();
-      const el = ensureOverlay();
-      el.style.display = "block";
-      visible = true;
-    },
-    hide() {
-      if (overlay) overlay.style.display = "none";
-      visible = false;
-      clearHoverMarks();
-      removeHoverRules();
-      unfreezeAnimations();
-      unblockEvents();
-    },
-    isVisible() {
-      return visible;
-    },
-    isFreezeElement(el) {
-      return el === overlay || el.id === FREEZE_ID;
-    },
-    getElement() {
-      return overlay;
-    },
-    dispose() {
-      clearHoverMarks();
-      removeHoverRules();
-      unfreezeAnimations();
-      unblockEvents();
-      overlay?.remove();
-      document.getElementById(FREEZE_STYLE_ID)?.remove();
-      overlay = null;
-      visible = false;
-    }
-  };
-}
-
-// src/core/overlay/select-feedback.ts
-var STYLE_ID7 = "__ag-feedback-styles__";
-function injectStyles() {
-  if (document.getElementById(STYLE_ID7)) return;
-  const style = document.createElement("style");
-  style.id = STYLE_ID7;
-  style.textContent = `
-    @keyframes ag-flash {
-      0%   { opacity: 1; }
-      100% { opacity: 0; transform: scale(1.02); }
-    }
-    @keyframes ag-pill-in {
-      0%   { opacity: 0; transform: translateY(4px) scale(0.9); }
-      30%  { opacity: 1; transform: translateY(0) scale(1); }
-      70%  { opacity: 1; transform: translateY(0) scale(1); }
-      100% { opacity: 0; transform: translateY(-8px) scale(0.95); }
-    }
-    .ag-select-flash {
-      position: fixed;
-      pointer-events: none;
-      z-index: ${Z_INDEX_OVERLAY};
-      border: 2px solid #22c55e;
-      background: rgba(34, 197, 94, 0.12);
-      border-radius: 3px;
-      box-sizing: border-box;
-      animation: ag-flash 0.45s ease-out forwards;
-    }
-    .ag-select-pill {
-      position: fixed;
-      pointer-events: none;
-      z-index: ${Z_INDEX_LABEL};
-      display: flex;
-      align-items: center;
-      gap: 4px;
-      background: #22c55e;
-      color: #fff;
-      font: 600 10px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
-      padding: 3px 8px;
-      border-radius: 10px;
-      white-space: nowrap;
-      letter-spacing: 0.03em;
-      text-transform: uppercase;
-      box-shadow: 0 2px 8px rgba(34, 197, 94, 0.35);
-      animation: ag-pill-in 0.9s ease-out forwards;
-    }
-    .ag-select-pill svg {
-      width: 10px;
-      height: 10px;
-      flex-shrink: 0;
-    }
-  `;
-  document.head.appendChild(style);
-}
-var CHECK_SVG = `<svg viewBox="0 0 10 10" fill="none"><path d="M2 5.5l2 2 4-4" stroke="#fff" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>`;
-function showSelectFeedback(element) {
-  injectStyles();
-  const rect = element.getBoundingClientRect();
-  const flash = document.createElement("div");
-  flash.className = "ag-select-flash";
-  flash.style.top = `${rect.top}px`;
-  flash.style.left = `${rect.left}px`;
-  flash.style.width = `${rect.width}px`;
-  flash.style.height = `${rect.height}px`;
-  document.body.appendChild(flash);
-  const pill = document.createElement("div");
-  pill.className = "ag-select-pill";
-  pill.innerHTML = `${CHECK_SVG} Copied`;
-  document.body.appendChild(pill);
-  const pillWidth = 70;
-  let pillLeft = rect.left + rect.width / 2 - pillWidth / 2;
-  let pillTop = rect.top - 24;
-  if (pillTop < 4) {
-    pillTop = rect.bottom + 6;
-  }
-  const vw = document.documentElement.clientWidth;
-  if (pillLeft + pillWidth > vw - 4) pillLeft = vw - pillWidth - 4;
-  if (pillLeft < 4) pillLeft = 4;
-  pill.style.top = `${pillTop}px`;
-  pill.style.left = `${pillLeft}px`;
-  const cleanup = () => {
-    flash.remove();
-    pill.remove();
-  };
-  pill.addEventListener("animationend", cleanup);
-  setTimeout(cleanup, 1200);
-}
-function disposeFeedbackStyles() {
-  document.getElementById(STYLE_ID7)?.remove();
-}
-
-// src/core/grab.ts
-var MAX_HISTORY = 50;
-function toHistoryContext(ctx) {
-  return {
-    html: ctx.html,
-    componentName: ctx.componentName,
-    filePath: ctx.filePath,
-    line: ctx.line,
-    column: ctx.column,
-    componentStack: ctx.componentStack,
-    selector: ctx.selector,
-    cssClasses: ctx.cssClasses
-  };
-}
-function getDefaultOptions() {
-  return {
-    activationKey: isMac() ? "Meta+C" : "Ctrl+C",
-    activationMode: "hold",
-    keyHoldDuration: 0,
-    maxContextLines: 20,
-    enabled: true,
-    enableInInputs: false,
-    devOnly: true,
-    showToolbar: true,
-    themeMode: "dark"
-  };
-}
-function init(options) {
-  return createGrabInstance(options);
-}
-function isDevMode() {
-  try {
-    const ng = globalThis.ngDevMode;
-    return typeof ng === "undefined" || !!ng;
-  } catch {
-    return true;
-  }
-}
-function createNoopApi() {
-  const noop = () => {
-  };
-  return {
-    activate: noop,
-    deactivate: noop,
-    toggle: noop,
-    isActive: () => false,
-    setOptions: noop,
-    registerPlugin: noop,
-    unregisterPlugin: noop,
-    setComponentResolver: noop,
-    setSourceResolver: noop,
-    showToolbar: noop,
-    hideToolbar: noop,
-    setThemeMode: noop,
-    getHistory: () => [],
-    clearHistory: noop,
-    dispose: noop
-  };
-}
-function createGrabInstance(options) {
-  const defaults = getDefaultOptions();
-  const merged = { ...defaults, ...options };
-  if (merged.devOnly && !isDevMode()) {
-    return createNoopApi();
-  }
-  const store = createStore(merged);
-  const overlay = createOverlayRenderer();
-  const crosshair = createCrosshair();
-  const freezeOverlay = createFreezeOverlay();
-  const pluginRegistry = createPluginRegistry();
-  const themeManager = createThemeManager();
-  let componentResolver = null;
-  let sourceResolver = null;
-  let lastSelectedElement = null;
-  let lastSelectedContext = null;
-  let idCounter = 0;
-  function nextId() {
-    return `ag-${++idCounter}-${Date.now()}`;
-  }
-  themeManager.apply(store.state.toolbar.themeMode);
-  updateToastOffset();
-  function isAnyToolbarElement(el) {
-    return toolbar.isToolbarElement(el) || historyPopover.isPopoverElement(el) || actionsMenu.isMenuElement(el) || commentPopover.isPopoverElement(el) || freezeOverlay.isFreezeElement(el);
-  }
-  function addHistoryEntry(context, snippet) {
-    const entry = {
-      id: nextId(),
-      context: toHistoryContext(context),
-      snippet,
-      timestamp: Date.now()
-    };
-    lastSelectedElement = new WeakRef(context.element);
-    lastSelectedContext = context;
-    const history = [entry, ...store.state.toolbar.history].slice(0, MAX_HISTORY);
-    store.state.toolbar = { ...store.state.toolbar, history };
-  }
-  function getLastSelectedElement() {
-    const el = lastSelectedElement?.deref() ?? null;
-    if (el && !el.isConnected) {
-      lastSelectedElement = null;
-      lastSelectedContext = null;
-      return null;
-    }
-    return el;
-  }
-  function closeAllPopovers() {
-    historyPopover.hide();
-    actionsMenu.hide();
-    commentPopover.hide();
-  }
-  async function executePendingAction(pending, element) {
-    const context = buildElementContext(element, componentResolver, sourceResolver);
-    const maxLines = store.state.options.maxContextLines;
-    lastSelectedElement = new WeakRef(element);
-    lastSelectedContext = context;
-    store.state.toolbar = { ...store.state.toolbar, pendingAction: null };
-    switch (pending.type) {
-      case "copy-element": {
-        const ok = await copyElementSnippet(context, maxLines, pluginRegistry);
-        if (ok) {
-          showSelectFeedback(element);
-          addHistoryEntry(context, "");
-        }
-        break;
-      }
-      case "copy-styles":
-        await copyElementStyles(element);
-        break;
-      case "copy-html":
-        await copyElementHtml(context, pluginRegistry);
-        break;
-      case "comment":
-        commentPopover.show();
-        return;
-    }
-  }
-  const picker = createElementPicker({
-    overlay,
-    crosshair,
-    getComponentResolver: () => componentResolver,
-    getSourceResolver: () => sourceResolver,
-    isToolbarElement: isAnyToolbarElement,
-    getFreezeElement: () => freezeOverlay.getElement(),
-    onHover(element) {
-      store.state.hoveredElement = element;
-      if (element) {
-        pluginRegistry.callHook("onElementHover", element);
-      }
-    },
-    async onSelect(element) {
-      const pending = store.state.toolbar.pendingAction;
-      if (pending) {
-        await executePendingAction(pending, element);
-        if (pending.type !== "comment") {
-          doDeactivate();
-        }
-        return;
-      }
-      const result = await copyElement(element, {
-        getComponentResolver: () => componentResolver,
-        getSourceResolver: () => sourceResolver,
-        getMaxContextLines: () => store.state.options.maxContextLines,
-        pluginRegistry
-      });
-      if (result) {
-        showSelectFeedback(element);
-        addHistoryEntry(result.context, result.snippet);
-      }
-    }
-  });
-  function doActivate() {
-    if (!store.state.options.enabled) return;
-    if (store.state.active) return;
-    if (store.state.toolbar.visible === false && store.state.options.showToolbar) {
-      store.state.toolbar = { ...store.state.toolbar, visible: true };
-      toolbar.show();
-      toolbar.update(store.state);
-    }
-    store.state.active = true;
-    picker.activate();
-    pluginRegistry.callHook("onActivate");
-    toolbar.update(store.state);
-  }
-  function doDeactivate() {
-    if (!store.state.active) return;
-    store.state.active = false;
-    store.state.frozen = false;
-    freezeOverlay.hide();
-    store.state.toolbar = { ...store.state.toolbar, pendingAction: null };
-    picker.deactivate();
-    pluginRegistry.callHook("onDeactivate");
-    toolbar.update(store.state);
-  }
-  function toggleFreeze() {
-    store.state.frozen = !store.state.frozen;
-    if (store.state.frozen) {
-      freezeOverlay.show(store.state.hoveredElement);
-    } else {
-      freezeOverlay.hide();
-    }
-    toolbar.update(store.state);
-  }
-  const toolbar = createToolbarRenderer({
-    onSelectionMode() {
-      closeAllPopovers();
-      if (store.state.active) {
-        doDeactivate();
-      } else {
-        doActivate();
-      }
-    },
-    onHistory() {
-      actionsMenu.hide();
-      commentPopover.hide();
-      if (historyPopover.isVisible()) {
-        historyPopover.hide();
-      } else {
-        historyPopover.show([...store.state.toolbar.history]);
-      }
-    },
-    onActions() {
-      historyPopover.hide();
-      commentPopover.hide();
-      if (actionsMenu.isVisible()) {
-        actionsMenu.hide();
-      } else {
-        actionsMenu.show();
-      }
-    },
-    onFreeze() {
-      closeAllPopovers();
-      if (!store.state.active) {
-        doActivate();
-      }
-      toggleFreeze();
-    },
-    onThemeToggle() {
-      const current = store.state.toolbar.themeMode;
-      const newMode = current === "dark" ? "light" : current === "light" ? "system" : "dark";
-      store.state.toolbar = { ...store.state.toolbar, themeMode: newMode };
-      themeManager.apply(newMode);
-      toolbar.update(store.state);
-    },
-    onEnableToggle() {
-      closeAllPopovers();
-      const newEnabled = !store.state.options.enabled;
-      store.state.options = { ...store.state.options, enabled: newEnabled };
-      if (!newEnabled) {
-        doDeactivate();
-      }
-      toolbar.update(store.state);
-    },
-    onDismiss() {
-      closeAllPopovers();
-      doDeactivate();
-      store.state.toolbar = { ...store.state.toolbar, visible: false };
-      toolbar.hide();
-    }
-  });
-  const historyPopover = createHistoryPopover({
-    async onEntryClick(entry) {
-      historyPopover.hide();
-      try {
-        await navigator.clipboard.writeText(entry.snippet);
-        showToast("Re-copied to clipboard", {
-          componentName: entry.context.componentName,
-          filePath: entry.context.filePath,
-          line: entry.context.line,
-          column: entry.context.column,
-          cssClasses: entry.context.cssClasses
-        });
-      } catch {
-      }
-    }
-  });
-  const actionsMenu = createActionsMenu({
-    onCopyElement() {
-      if (lastSelectedContext) {
-        copyElementSnippet(lastSelectedContext, store.state.options.maxContextLines, pluginRegistry);
-      } else {
-        store.state.toolbar = { ...store.state.toolbar, pendingAction: { type: "copy-element" } };
-        doActivate();
-      }
-    },
-    onCopyStyles() {
-      const el = getLastSelectedElement();
-      if (el) {
-        copyElementStyles(el);
-      } else {
-        store.state.toolbar = { ...store.state.toolbar, pendingAction: { type: "copy-styles" } };
-        doActivate();
-      }
-    },
-    onCopyHtml() {
-      if (lastSelectedContext) {
-        copyElementHtml(lastSelectedContext, pluginRegistry);
-      } else {
-        store.state.toolbar = { ...store.state.toolbar, pendingAction: { type: "copy-html" } };
-        doActivate();
-      }
-    },
-    onComment() {
-      if (lastSelectedContext) {
-        commentPopover.show();
-      } else {
-        store.state.toolbar = { ...store.state.toolbar, pendingAction: { type: "comment" } };
-        doActivate();
-      }
-    },
-    onClearHistory() {
-      lastSelectedContext = null;
-      lastSelectedElement = null;
-      store.state.toolbar = { ...store.state.toolbar, history: [] };
-    }
-  });
-  const commentPopover = createCommentPopover({
-    async onSubmit(comment) {
-      if (lastSelectedContext) {
-        await copyWithComment(lastSelectedContext, comment, store.state.options.maxContextLines, pluginRegistry);
-      }
-      if (store.state.active) {
-        doDeactivate();
-      }
-    },
-    onCancel() {
-      if (store.state.active) {
-        doDeactivate();
-      }
-    }
-  });
-  function handleDocumentClick(e) {
-    const target = e.target;
-    if (!target) return;
-    if (isAnyToolbarElement(target)) return;
-    if (historyPopover.isVisible() || actionsMenu.isVisible() || commentPopover.isVisible()) {
-      closeAllPopovers();
-    }
-  }
-  document.addEventListener("click", handleDocumentClick);
-  function updateToastOffset() {
-    if (store.state.toolbar.visible) {
-      document.documentElement.style.setProperty("--ag-toast-bottom", TOOLBAR_TOAST_OFFSET);
-    } else {
-      document.documentElement.style.removeProperty("--ag-toast-bottom");
-    }
-  }
-  function handleFreezeKey(e) {
-    if (!store.state.active) return;
-    if (e.key.toLowerCase() !== "f") return;
-    const tag = e.target?.tagName;
-    if (tag === "INPUT" || tag === "TEXTAREA") return;
-    if (e.target?.isContentEditable) return;
-    e.preventDefault();
-    toggleFreeze();
-  }
-  document.addEventListener("keydown", handleFreezeKey, true);
-  const keyboard = createKeyboardHandler({
-    getActivationKey: () => store.state.options.activationKey,
-    getActivationMode: () => store.state.options.activationMode,
-    getKeyHoldDuration: () => store.state.options.keyHoldDuration,
-    getEnableInInputs: () => store.state.options.enableInInputs,
-    onActivate: doActivate,
-    onDeactivate: doDeactivate,
-    isActive: () => store.state.active
-  });
-  const api = {
-    activate: doActivate,
-    deactivate: doDeactivate,
-    toggle() {
-      if (store.state.active) {
-        doDeactivate();
-      } else {
-        doActivate();
-      }
-    },
-    isActive() {
-      return store.state.active;
-    },
-    setOptions(opts) {
-      store.state.options = { ...store.state.options, ...opts };
-    },
-    registerPlugin(plugin) {
-      if (plugin.options) {
-        store.state.options = { ...store.state.options, ...plugin.options };
-      }
-      if (plugin.theme) {
-        themeManager.applyOverrides(plugin.theme);
-      }
-      pluginRegistry.register(plugin, api);
-    },
-    unregisterPlugin(name) {
-      pluginRegistry.unregister(name);
-    },
-    setComponentResolver(resolver) {
-      componentResolver = resolver;
-    },
-    setSourceResolver(resolver) {
-      sourceResolver = resolver;
-    },
-    showToolbar() {
-      store.state.toolbar = { ...store.state.toolbar, visible: true };
-      toolbar.show();
-      toolbar.update(store.state);
-      updateToastOffset();
-    },
-    hideToolbar() {
-      closeAllPopovers();
-      store.state.toolbar = { ...store.state.toolbar, visible: false };
-      toolbar.hide();
-      updateToastOffset();
-    },
-    setThemeMode(mode) {
-      store.state.toolbar = { ...store.state.toolbar, themeMode: mode };
-      themeManager.apply(mode);
-      toolbar.update(store.state);
-    },
-    getHistory() {
-      return [...store.state.toolbar.history];
-    },
-    clearHistory() {
-      lastSelectedContext = null;
-      lastSelectedElement = null;
-      store.state.toolbar = { ...store.state.toolbar, history: [] };
-    },
-    dispose() {
-      doDeactivate();
-      document.removeEventListener("click", handleDocumentClick);
-      document.removeEventListener("keydown", handleFreezeKey, true);
-      keyboard.dispose();
-      picker.dispose();
-      overlay.dispose();
-      crosshair.dispose();
-      freezeOverlay.dispose();
-      disposeToast();
-      disposeFeedbackStyles();
-      pluginRegistry.dispose();
-      closeAllPopovers();
-      toolbar.dispose();
-      historyPopover.dispose();
-      actionsMenu.dispose();
-      commentPopover.dispose();
-      themeManager.dispose();
-      document.documentElement.style.removeProperty("--ag-toast-bottom");
-    }
-  };
-  if (store.state.options.enabled) {
-    keyboard.start();
-  }
-  store.state.toolbar = { ...store.state.toolbar, visible: false };
-  store.subscribe((state, key) => {
-    if (key === "options") {
-      if (state.options.enabled) {
-        keyboard.start();
-      } else {
-        keyboard.stop();
-        doDeactivate();
-      }
-    }
-    if (key === "toolbar") {
-      updateToastOffset();
-    }
-  });
-  return api;
-}
-export {
-  createGrabInstance,
-  filterAngularClasses,
-  init
-};
-//# sourceMappingURL=index.js.map