@xopcai/xopc 0.0.264 → 0.0.266

package/dist/browser-ext/dist/content.js

@@ -1,191 +0,0 @@
-const OVERLAY_HOST_ID = "xopc-overlay-host";
-let overlayHost = null;
-let overlayInner = null;
-let completedTimer = null;
-function ensureOverlay() {
-  if (overlayHost?.isConnected && overlayInner) return;
-  removeOverlay();
-  const existing = document.getElementById(OVERLAY_HOST_ID);
-  if (existing) existing.remove();
-  overlayHost = document.createElement("div");
-  overlayHost.id = OVERLAY_HOST_ID;
-  const shadow = overlayHost.attachShadow({ mode: "open" });
-  const style = document.createElement("style");
-  style.textContent = `
-    :host { all: initial; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 2147483647; pointer-events: none; }
-    .overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; }
-    .overlay.operating { border: 2px solid rgba(59, 130, 246, 0.6); animation: pulse 2s ease-in-out infinite; }
-    .overlay.completed { border: 2px solid rgba(34, 197, 94, 0.6); }
-    .badge { position: fixed; top: 8px; right: 8px; padding: 4px 12px; border-radius: 12px; font: 500 12px -apple-system, sans-serif; color: white; opacity: 0; transform: translateY(-8px); animation: badge-in 0.3s ease forwards; }
-    .badge.operating { background: rgba(59, 130, 246, 0.85); backdrop-filter: blur(8px); }
-    .badge.completed { background: rgba(34, 197, 94, 0.85); backdrop-filter: blur(8px); }
-    .dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: white; margin-right: 6px; vertical-align: middle; }
-    .badge.operating .dot { animation: dot-pulse 1.2s ease-in-out infinite; }
-    @keyframes pulse { 0%, 100% { border-color: rgba(59, 130, 246, 0.3); } 50% { border-color: rgba(59, 130, 246, 0.8); } }
-    @keyframes badge-in { to { opacity: 1; transform: translateY(0); } }
-    @keyframes dot-pulse { 0%, 100% { opacity: 0.4; transform: scale(0.8); } 50% { opacity: 1; transform: scale(1.2); } }
-  `;
-  shadow.appendChild(style);
-  overlayInner = document.createElement("div");
-  overlayInner.className = "overlay";
-  shadow.appendChild(overlayInner);
-  document.documentElement.appendChild(overlayHost);
-}
-function removeOverlay() {
-  if (completedTimer) {
-    clearTimeout(completedTimer);
-    completedTimer = null;
-  }
-  overlayInner = null;
-  if (overlayHost) {
-    overlayHost.remove();
-    overlayHost = null;
-  }
-  document.documentElement.style.cursor = "";
-}
-function showOverlay(status) {
-  if (completedTimer) {
-    clearTimeout(completedTimer);
-    completedTimer = null;
-  }
-  if (status === "hidden") {
-    removeOverlay();
-    return;
-  }
-  ensureOverlay();
-  if (!overlayInner) return;
-  overlayInner.innerHTML = "";
-  overlayInner.className = `overlay ${status}`;
-  const badge = document.createElement("div");
-  badge.className = `badge ${status}`;
-  const dot = document.createElement("span");
-  dot.className = "dot";
-  badge.appendChild(dot);
-  badge.appendChild(document.createTextNode(status === "operating" ? "🤖 xopc" : "✅ Done"));
-  overlayInner.appendChild(badge);
-  document.documentElement.style.cursor = status === "operating" ? "not-allowed" : "";
-  if (status === "completed") {
-    completedTimer = setTimeout(removeOverlay, 2e3);
-  }
-}
-function showClickRipple(x, y) {
-  if (!document.getElementById("xopc-ripple-style")) {
-    const s = document.createElement("style");
-    s.id = "xopc-ripple-style";
-    s.textContent = `@keyframes xopc-ripple { 0% { transform: scale(0.3); opacity: 1; } 100% { transform: scale(2.5); opacity: 0; } }`;
-    document.head.appendChild(s);
-  }
-  const el = document.createElement("div");
-  Object.assign(el.style, {
-    position: "fixed",
-    left: `${x - 15}px`,
-    top: `${y - 15}px`,
-    width: "30px",
-    height: "30px",
-    borderRadius: "50%",
-    background: "rgba(59, 130, 246, 0.4)",
-    border: "2px solid rgba(59, 130, 246, 0.7)",
-    pointerEvents: "none",
-    zIndex: "2147483646",
-    animation: "xopc-ripple 0.6s ease-out forwards"
-  });
-  document.body.appendChild(el);
-  setTimeout(() => el.remove(), 600);
-}
-function showHoverHighlight(selector) {
-  const element = document.querySelector(selector);
-  if (!element) return;
-  const rect = element.getBoundingClientRect();
-  const el = document.createElement("div");
-  Object.assign(el.style, {
-    position: "fixed",
-    left: `${rect.left - 2}px`,
-    top: `${rect.top - 2}px`,
-    width: `${rect.width + 4}px`,
-    height: `${rect.height + 4}px`,
-    border: "2px solid rgba(59, 130, 246, 0.6)",
-    borderRadius: "4px",
-    background: "rgba(59, 130, 246, 0.08)",
-    pointerEvents: "none",
-    zIndex: "2147483645",
-    transition: "opacity 0.3s ease",
-    opacity: "1"
-  });
-  document.body.appendChild(el);
-  setTimeout(() => {
-    el.style.opacity = "0";
-    setTimeout(() => el.remove(), 300);
-  }, 800);
-}
-function showInputFlash(selector) {
-  const el = document.querySelector(selector);
-  if (!el) return;
-  const orig = el.style.backgroundColor;
-  el.style.transition = "background-color 0.15s ease";
-  el.style.backgroundColor = "rgba(34, 197, 94, 0.15)";
-  setTimeout(() => {
-    el.style.backgroundColor = orig;
-  }, 300);
-}
-function showScrollIndicator(direction) {
-  const el = document.createElement("div");
-  Object.assign(el.style, {
-    position: "fixed",
-    right: "20px",
-    [direction === "down" ? "bottom" : "top"]: "20px",
-    width: "36px",
-    height: "36px",
-    borderRadius: "50%",
-    background: "rgba(59, 130, 246, 0.85)",
-    color: "white",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    fontSize: "18px",
-    fontWeight: "bold",
-    pointerEvents: "none",
-    zIndex: "2147483646",
-    opacity: "0",
-    transform: `translateY(${direction === "down" ? "10px" : "-10px"})`,
-    transition: "opacity 0.2s ease, transform 0.2s ease"
-  });
-  el.textContent = direction === "down" ? "↓" : "↑";
-  document.body.appendChild(el);
-  requestAnimationFrame(() => {
-    el.style.opacity = "1";
-    el.style.transform = "translateY(0)";
-  });
-  setTimeout(() => {
-    el.style.opacity = "0";
-    setTimeout(() => el.remove(), 200);
-  }, 600);
-}
-chrome.runtime.onMessage.addListener(
-  (message, _sender, sendResponse) => {
-    switch (message.type) {
-      case "content/show-overlay":
-        showOverlay(message.status);
-        break;
-      case "content/hide-overlay":
-        removeOverlay();
-        break;
-      case "content/show-click-ripple":
-        showClickRipple(message.x, message.y);
-        break;
-      case "content/show-hover-highlight":
-        showHoverHighlight(message.selector);
-        break;
-      case "content/show-input-flash":
-        showInputFlash(message.selector);
-        break;
-      case "content/show-scroll-indicator":
-        showScrollIndicator(message.direction);
-        break;
-      default:
-        sendResponse({ ok: false });
-        return true;
-    }
-    sendResponse({ ok: true });
-    return true;
-  }
-);

package/dist/browser-ext/dist/popup.js

@@ -1,32 +0,0 @@
-function updateUI(status) {
-  const dot = document.getElementById("status-dot");
-  const label = document.getElementById("status-label");
-  const urlEl = document.getElementById("server-url");
-  const connectBtn = document.getElementById("btn-connect");
-  const disconnectBtn = document.getElementById("btn-disconnect");
-  if (status.connected) {
-    dot.className = "dot connected";
-    label.textContent = "Connected";
-    connectBtn.classList.add("hidden");
-    disconnectBtn.classList.remove("hidden");
-  } else {
-    dot.className = "dot disconnected";
-    label.textContent = "Disconnected";
-    connectBtn.classList.remove("hidden");
-    disconnectBtn.classList.add("hidden");
-  }
-  urlEl.textContent = status.url ?? "ws://127.0.0.1:19820/browser-ext";
-}
-async function getStatus() {
-  const response = await chrome.runtime.sendMessage({ type: "popup/get-status" });
-  updateUI(response);
-}
-document.getElementById("btn-connect")?.addEventListener("click", async () => {
-  await chrome.runtime.sendMessage({ type: "popup/connect" });
-  setTimeout(getStatus, 500);
-});
-document.getElementById("btn-disconnect")?.addEventListener("click", async () => {
-  await chrome.runtime.sendMessage({ type: "popup/disconnect" });
-  setTimeout(getStatus, 200);
-});
-getStatus();

package/dist/browser-ext/popup.html

@@ -1,37 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <style>
-    * { margin: 0; padding: 0; box-sizing: border-box; }
-    body { width: 280px; padding: 16px; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; font-size: 13px; color: #1e293b; background: #fff; }
-    h1 { font-size: 14px; font-weight: 600; margin-bottom: 12px; display: flex; align-items: center; gap: 8px; }
-    h1 .logo { width: 20px; height: 20px; flex-shrink: 0; }
-    .status-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; padding: 8px 10px; background: #f8fafc; border-radius: 6px; border: 1px solid #e2e8f0; }
-    .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
-    .dot.connected { background: #22c55e; box-shadow: 0 0 4px rgba(34, 197, 94, 0.4); }
-    .dot.disconnected { background: #ef4444; }
-    .server-url { font-size: 11px; color: #64748b; margin-top: 4px; word-break: break-all; }
-    .actions { display: flex; gap: 8px; margin-top: 12px; }
-    button { flex: 1; padding: 6px 12px; border-radius: 6px; border: 1px solid #e2e8f0; background: #f8fafc; font-size: 12px; cursor: pointer; transition: all 0.15s; }
-    button:hover { background: #e2e8f0; }
-    button.primary { background: #3b82f6; color: white; border-color: #3b82f6; }
-    button.primary:hover { background: #2563eb; }
-    button.danger { color: #ef4444; }
-    .hidden { display: none; }
-  </style>
-</head>
-<body>
-  <h1><img class="logo" src="icons/icon-32.png" width="20" height="20" alt="" /> xopc Browser Bridge</h1>
-  <div class="status-row">
-    <span id="status-dot" class="dot disconnected"></span>
-    <span id="status-label">Checking...</span>
-  </div>
-  <div class="server-url" id="server-url">ws://127.0.0.1:19820/browser-ext</div>
-  <div class="actions">
-    <button id="btn-connect" class="primary hidden">Connect</button>
-    <button id="btn-disconnect" class="danger hidden">Disconnect</button>
-  </div>
-  <script type="module" src="dist/popup.js"></script>
-</body>
-</html>