@page-agent/page-controller 0.2.5 → 0.3.0

package/dist/lib/PageController.d.ts

@@ -1,5 +1,3 @@
-import { Motion } from 'ai-motion';
-
 declare interface ActionResult {
     success: boolean;
     message: string;
@@ -141,7 +139,12 @@ export declare class PageController extends EventTarget {
     private lastTimeUpdate;
     /** Visual mask overlay for blocking user interaction during automation */
     private mask;
+    private maskReady;
     constructor(config?: PageControllerConfig);
+    /**
+     * Initialize mask asynchronously (dynamic import to avoid CSS loading in Node)
+     */
+    private initMask;
     /**
      * Get current page URL
      */
@@ -202,12 +205,12 @@ export declare class PageController extends EventTarget {
      * Show the visual mask overlay.
      * Only works if enableMask was set to true in config.
      */
-    showMask(): void;
+    showMask(): Promise<void>;
     /**
      * Hide the visual mask overlay.
      * Only works if enableMask was set to true in config.
      */
-    hideMask(): void;
+    hideMask(): Promise<void>;
     /**
      * Dispose and clean up resources
      */
@@ -223,18 +226,6 @@ export declare interface PageControllerConfig extends dom.DomConfig {
     enableMask?: boolean;
 }
 
-export declare class SimulatorMask {
-    #private;
-    wrapper: HTMLDivElement;
-    motion: Motion;
-    constructor();
-    setCursorPosition(x: number, y: number): void;
-    triggerClickAnimation(): void;
-    show(): void;
-    hide(): void;
-    dispose(): void;
-}
-
 declare interface TextDomNode {
     type: 'TEXT_NODE';
     text: string;

package/dist/lib/SimulatorMask-BiVNIB3r.js

@@ -0,0 +1,251 @@
+(function() {
+  "use strict";
+  try {
+    if (typeof document != "undefined") {
+      var elementStyle = document.createElement("style");
+      elementStyle.appendChild(document.createTextNode("._wrapper_1oy2s_1 {\n	position: fixed;\n	inset: 0;\n	z-index: 2147483641; /* 确保在所有元素之上，除了 panel */\n	/* pointer-events: none; */\n	cursor: not-allowed;\n	overflow: hidden;\n\n	display: none;\n}\n/* AI 光标样式 */\n._cursor_1vrf3_2 {\n	position: absolute;\n	width: var(--cursor-size, 75px);\n	height: var(--cursor-size, 75px);\n	pointer-events: none;\n	z-index: 10000;\n	transform: translate(-30%, -30%);\n\n	animation: _cursor-enter_1vrf3_1 300ms ease-out forwards;\n}\n\n._cursorBorder_1vrf3_13 {\n	position: absolute;\n	inset: 0;\n	background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n	mask-image: url(https://img.alicdn.com/imgextra/i1/O1CN01YHLVYR1LvqWIyo5kH_!!6000000001362-2-tps-202-202.png);\n	mask-size: 100% 100%;\n	mask-repeat: no-repeat;\n	animation: _cursor-breathe_1vrf3_1 2s ease-in-out infinite;\n}\n\n._cursorFilling_1vrf3_23 {\n	position: absolute;\n	inset: 0;\n	background: url(https://img.alicdn.com/imgextra/i3/O1CN01JZOqOS1Tu1sIKbPLW_!!6000000002441-2-tps-202-202.png);\n	background-size: 100% 100%;\n	background-repeat: no-repeat;\n}\n\n._cursorRipple_1vrf3_31 {\n	position: absolute;\n	inset: 0;\n	pointer-events: none;\n}\n\n._cursor_1vrf3_2._clicking_1vrf3_37 ._cursorRipple_1vrf3_31::after {\n	content: '';\n	position: absolute;\n	width: 100%;\n	height: 100%;\n	left: -30%;\n	top: -30%;\n	border: 4px solid rgba(57, 182, 255, 1);\n	border-radius: 50%;\n	animation: _cursor-ripple_1vrf3_1 300ms ease-out forwards;\n}\n\n/* 光标动画关键帧 */\n@keyframes _cursor-breathe_1vrf3_1 {\n	0%,\n	100% {\n		transform: scale(1);\n		opacity: 0.9;\n	}\n	50% {\n		transform: scale(1.05);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-rotate_1vrf3_1 {\n	0% {\n		transform: rotate(0deg);\n	}\n	100% {\n		transform: rotate(360deg);\n	}\n}\n\n@keyframes _cursor-enter_1vrf3_1 {\n	0% {\n		transform: translate(-30%, -30%) scale(0.5);\n		opacity: 0;\n	}\n	100% {\n		transform: translate(-30%, -30%) scale(1);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-ripple_1vrf3_1 {\n	0% {\n		transform: scale(0);\n		opacity: 1;\n	}\n	100% {\n		transform: scale(2);\n		opacity: 0;\n	}\n}"));
+      document.head.appendChild(elementStyle);
+    }
+  } catch (e) {
+    console.error("vite-plugin-css-injected-by-js", e);
+  }
+})();
+var __defProp = Object.defineProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
+var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
+var _cursor, _currentCursorX, _currentCursorY, _targetCursorX, _targetCursorY, _SimulatorMask_instances, createCursor_fn, moveCursorToTarget_fn;
+import { Motion } from "ai-motion";
+function hasDarkModeClass() {
+  const DEFAULT_DARK_MODE_CLASSES = ["dark", "dark-mode", "theme-dark", "night", "night-mode"];
+  const htmlElement = document.documentElement;
+  const bodyElement = document.body || document.documentElement;
+  for (const className of DEFAULT_DARK_MODE_CLASSES) {
+    if (htmlElement.classList.contains(className) || bodyElement?.classList.contains(className)) {
+      return true;
+    }
+  }
+  const darkThemeAttribute = htmlElement.getAttribute("data-theme");
+  if (darkThemeAttribute?.toLowerCase().includes("dark")) {
+    return true;
+  }
+  return false;
+}
+__name(hasDarkModeClass, "hasDarkModeClass");
+function parseRgbColor(colorString) {
+  const rgbMatch = /rgba?\((\d+),\s*(\d+),\s*(\d+)/.exec(colorString);
+  if (!rgbMatch) {
+    return null;
+  }
+  return {
+    r: parseInt(rgbMatch[1]),
+    g: parseInt(rgbMatch[2]),
+    b: parseInt(rgbMatch[3])
+  };
+}
+__name(parseRgbColor, "parseRgbColor");
+function isColorDark(colorString, threshold = 128) {
+  if (!colorString || colorString === "transparent" || colorString.startsWith("rgba(0, 0, 0, 0)")) {
+    return false;
+  }
+  const rgb = parseRgbColor(colorString);
+  if (!rgb) {
+    return false;
+  }
+  const luminance = 0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b;
+  return luminance < threshold;
+}
+__name(isColorDark, "isColorDark");
+function isBackgroundDark() {
+  const htmlStyle = window.getComputedStyle(document.documentElement);
+  const bodyStyle = window.getComputedStyle(document.body || document.documentElement);
+  const htmlBgColor = htmlStyle.backgroundColor;
+  const bodyBgColor = bodyStyle.backgroundColor;
+  if (isColorDark(bodyBgColor)) {
+    return true;
+  } else if (bodyBgColor === "transparent" || bodyBgColor.startsWith("rgba(0, 0, 0, 0)")) {
+    return isColorDark(htmlBgColor);
+  }
+  return false;
+}
+__name(isBackgroundDark, "isBackgroundDark");
+function isPageDark() {
+  try {
+    if (hasDarkModeClass()) {
+      return true;
+    }
+    if (isBackgroundDark()) {
+      return true;
+    }
+    return false;
+  } catch (error) {
+    console.warn("Error determining if page is dark:", error);
+    return false;
+  }
+}
+__name(isPageDark, "isPageDark");
+const wrapper = "_wrapper_1oy2s_1";
+const styles = {
+  wrapper
+};
+const cursor = "_cursor_1vrf3_2";
+const cursorBorder = "_cursorBorder_1vrf3_13";
+const cursorFilling = "_cursorFilling_1vrf3_23";
+const cursorRipple = "_cursorRipple_1vrf3_31";
+const clicking = "_clicking_1vrf3_37";
+const cursorStyles = {
+  cursor,
+  cursorBorder,
+  cursorFilling,
+  cursorRipple,
+  clicking
+};
+const _SimulatorMask = class _SimulatorMask {
+  constructor() {
+    __privateAdd(this, _SimulatorMask_instances);
+    __publicField(this, "wrapper", document.createElement("div"));
+    __publicField(this, "motion", new Motion({
+      mode: isPageDark() ? "dark" : "light",
+      styles: {
+        position: "absolute",
+        inset: "0"
+      }
+    }));
+    __privateAdd(this, _cursor, document.createElement("div"));
+    __privateAdd(this, _currentCursorX, 0);
+    __privateAdd(this, _currentCursorY, 0);
+    __privateAdd(this, _targetCursorX, 0);
+    __privateAdd(this, _targetCursorY, 0);
+    this.wrapper.id = "page-agent-runtime_simulator-mask";
+    this.wrapper.className = styles.wrapper;
+    this.wrapper.setAttribute("data-browser-use-ignore", "true");
+    this.wrapper.appendChild(this.motion.element);
+    this.motion.autoResize(this.wrapper);
+    this.wrapper.addEventListener("click", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    this.wrapper.addEventListener("mousedown", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    this.wrapper.addEventListener("mouseup", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    this.wrapper.addEventListener("mousemove", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    this.wrapper.addEventListener("wheel", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    this.wrapper.addEventListener("keydown", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    this.wrapper.addEventListener("keyup", (e) => {
+      e.stopPropagation();
+      e.preventDefault();
+    });
+    __privateMethod(this, _SimulatorMask_instances, createCursor_fn).call(this);
+    document.body.appendChild(this.wrapper);
+    __privateMethod(this, _SimulatorMask_instances, moveCursorToTarget_fn).call(this);
+    window.addEventListener("PageAgent::MovePointerTo", (event) => {
+      const { x, y } = event.detail;
+      this.setCursorPosition(x, y);
+    });
+    window.addEventListener("PageAgent::ClickPointer", (event) => {
+      this.triggerClickAnimation();
+    });
+  }
+  setCursorPosition(x, y) {
+    __privateSet(this, _targetCursorX, x);
+    __privateSet(this, _targetCursorY, y);
+  }
+  triggerClickAnimation() {
+    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
+    void __privateGet(this, _cursor).offsetHeight;
+    __privateGet(this, _cursor).classList.add(cursorStyles.clicking);
+  }
+  show() {
+    this.motion.start();
+    this.motion.fadeIn();
+    this.wrapper.style.display = "block";
+    __privateSet(this, _currentCursorX, window.innerWidth / 2);
+    __privateSet(this, _currentCursorY, window.innerHeight / 2);
+    __privateSet(this, _targetCursorX, __privateGet(this, _currentCursorX));
+    __privateSet(this, _targetCursorY, __privateGet(this, _currentCursorY));
+    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
+    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
+  }
+  hide() {
+    this.motion.fadeOut();
+    this.motion.pause();
+    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
+    setTimeout(() => {
+      this.wrapper.style.display = "none";
+    }, 800);
+  }
+  dispose() {
+    this.motion.dispose();
+    this.wrapper.remove();
+  }
+};
+_cursor = new WeakMap();
+_currentCursorX = new WeakMap();
+_currentCursorY = new WeakMap();
+_targetCursorX = new WeakMap();
+_targetCursorY = new WeakMap();
+_SimulatorMask_instances = new WeakSet();
+createCursor_fn = /* @__PURE__ */ __name(function() {
+  __privateGet(this, _cursor).className = cursorStyles.cursor;
+  const rippleContainer = document.createElement("div");
+  rippleContainer.className = cursorStyles.cursorRipple;
+  __privateGet(this, _cursor).appendChild(rippleContainer);
+  const fillingLayer = document.createElement("div");
+  fillingLayer.className = cursorStyles.cursorFilling;
+  __privateGet(this, _cursor).appendChild(fillingLayer);
+  const borderLayer = document.createElement("div");
+  borderLayer.className = cursorStyles.cursorBorder;
+  __privateGet(this, _cursor).appendChild(borderLayer);
+  this.wrapper.appendChild(__privateGet(this, _cursor));
+}, "#createCursor");
+moveCursorToTarget_fn = /* @__PURE__ */ __name(function() {
+  const newX = __privateGet(this, _currentCursorX) + (__privateGet(this, _targetCursorX) - __privateGet(this, _currentCursorX)) * 0.2;
+  const newY = __privateGet(this, _currentCursorY) + (__privateGet(this, _targetCursorY) - __privateGet(this, _currentCursorY)) * 0.2;
+  const xDistance = Math.abs(newX - __privateGet(this, _targetCursorX));
+  if (xDistance > 0) {
+    if (xDistance < 2) {
+      __privateSet(this, _currentCursorX, __privateGet(this, _targetCursorX));
+    } else {
+      __privateSet(this, _currentCursorX, newX);
+    }
+    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
+  }
+  const yDistance = Math.abs(newY - __privateGet(this, _targetCursorY));
+  if (yDistance > 0) {
+    if (yDistance < 2) {
+      __privateSet(this, _currentCursorY, __privateGet(this, _targetCursorY));
+    } else {
+      __privateSet(this, _currentCursorY, newY);
+    }
+    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
+  }
+  requestAnimationFrame(() => __privateMethod(this, _SimulatorMask_instances, moveCursorToTarget_fn).call(this));
+}, "#moveCursorToTarget");
+__name(_SimulatorMask, "SimulatorMask");
+let SimulatorMask = _SimulatorMask;
+export {
+  SimulatorMask
+};
+//# sourceMappingURL=SimulatorMask-BiVNIB3r.js.map

package/dist/lib/SimulatorMask-BiVNIB3r.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimulatorMask-BiVNIB3r.js","sources":["../../src/mask/checkDarkMode.ts","../../src/mask/SimulatorMask.ts"],"sourcesContent":["/**\n * Checks for common dark mode CSS classes on the html or body elements.\n * @returns {boolean} - True if a common dark mode class is found.\n */\nfunction hasDarkModeClass() {\n\tconst DEFAULT_DARK_MODE_CLASSES = ['dark', 'dark-mode', 'theme-dark', 'night', 'night-mode']\n\n\tconst htmlElement = document.documentElement\n\tconst bodyElement = document.body || document.documentElement // can be null in some cases\n\n\t// Check class names on <html> and <body>\n\tfor (const className of DEFAULT_DARK_MODE_CLASSES) {\n\t\tif (htmlElement.classList.contains(className) || bodyElement?.classList.contains(className)) {\n\t\t\treturn true\n\t\t}\n\t}\n\n\t// Some sites use data attributes\n\tconst darkThemeAttribute = htmlElement.getAttribute('data-theme')\n\tif (darkThemeAttribute?.toLowerCase().includes('dark')) {\n\t\treturn true\n\t}\n\n\treturn false\n}\n\n/**\n * Parses an RGB or RGBA color string and returns an object with r, g, b properties.\n * @param {string} colorString - e.g., \"rgb(34, 34, 34)\" or \"rgba(0, 0, 0, 0.5)\"\n * @returns {{r: number, g: number, b: number}|null}\n */\nfunction parseRgbColor(colorString: string) {\n\tconst rgbMatch = /rgba?\\((\\d+),\\s*(\\d+),\\s*(\\d+)/.exec(colorString)\n\tif (!rgbMatch) {\n\t\treturn null // Not a valid rgb/rgba string\n\t}\n\treturn {\n\t\tr: parseInt(rgbMatch[1]),\n\t\tg: parseInt(rgbMatch[2]),\n\t\tb: parseInt(rgbMatch[3]),\n\t}\n}\n\n/**\n * Determines if a color is \"dark\" based on its calculated luminance.\n * @param {string} colorString - The CSS color string (e.g., \"rgb(50, 50, 50)\").\n * @param {number} threshold - A value between 0 and 255. Colors with luminance below this will be considered dark. Default is 128.\n * @returns {boolean} - True if the color is considered dark.\n */\nfunction isColorDark(colorString: string, threshold = 128) {\n\tif (!colorString || colorString === 'transparent' || colorString.startsWith('rgba(0, 0, 0, 0)')) {\n\t\treturn false // Transparent is not dark\n\t}\n\n\tconst rgb = parseRgbColor(colorString)\n\tif (!rgb) {\n\t\treturn false // Could not parse color\n\t}\n\n\t// Calculate perceived luminance using the standard formula\n\tconst luminance = 0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b\n\n\treturn luminance < threshold\n}\n\n/**\n * Checks the background color of the body element to determine if the page is dark.\n * @returns {boolean}\n */\nfunction isBackgroundDark() {\n\t// We check both <html> and <body> because some pages set the color on <html>\n\tconst htmlStyle = window.getComputedStyle(document.documentElement)\n\tconst bodyStyle = window.getComputedStyle(document.body || document.documentElement)\n\n\t// Get background colors\n\tconst htmlBgColor = htmlStyle.backgroundColor\n\tconst bodyBgColor = bodyStyle.backgroundColor\n\n\t// The body's background might be transparent, in which case we should\n\t// fall back to the html element's background.\n\tif (isColorDark(bodyBgColor)) {\n\t\treturn true\n\t} else if (bodyBgColor === 'transparent' || bodyBgColor.startsWith('rgba(0, 0, 0, 0)')) {\n\t\treturn isColorDark(htmlBgColor)\n\t}\n\n\treturn false\n}\n\n/**\n * A comprehensive function to determine if the page is currently in a dark theme.\n * It combines class checking and background color analysis.\n * @returns {boolean} - True if the page is likely dark.\n */\nexport function isPageDark() {\n\ttry {\n\t\t// Strategy 1: Check for common dark mode classes\n\t\tif (hasDarkModeClass()) {\n\t\t\treturn true\n\t\t}\n\n\t\t// Strategy 2: Analyze the computed background color\n\t\tif (isBackgroundDark()) {\n\t\t\treturn true\n\t\t}\n\n\t\t// @TODO add more checks here, e.g., analyzing text color,\n\t\t// or checking the background of major layout elements like <main> or #app.\n\n\t\treturn false\n\t} catch (error) {\n\t\tconsole.warn('Error determining if page is dark:', error)\n\t\treturn false\n\t}\n}\n","import { Motion } from 'ai-motion'\n\nimport { isPageDark } from './checkDarkMode'\n\nimport styles from './SimulatorMask.module.css'\nimport cursorStyles from './cursor.module.css'\n\nexport class SimulatorMask {\n\twrapper = document.createElement('div')\n\tmotion = new Motion({\n\t\tmode: isPageDark() ? 'dark' : 'light',\n\t\tstyles: {\n\t\t\tposition: 'absolute',\n\t\t\tinset: '0',\n\t\t},\n\t})\n\n\t#cursor = document.createElement('div')\n\n\t#currentCursorX = 0\n\t#currentCursorY = 0\n\n\t#targetCursorX = 0\n\t#targetCursorY = 0\n\n\tconstructor() {\n\t\tthis.wrapper.id = 'page-agent-runtime_simulator-mask'\n\t\tthis.wrapper.className = styles.wrapper\n\t\tthis.wrapper.setAttribute('data-browser-use-ignore', 'true')\n\n\t\tthis.wrapper.appendChild(this.motion.element)\n\t\tthis.motion.autoResize(this.wrapper)\n\n\t\t// Capture all mouse, keyboard, and wheel events\n\t\tthis.wrapper.addEventListener('click', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\t\tthis.wrapper.addEventListener('mousedown', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\t\tthis.wrapper.addEventListener('mouseup', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\t\tthis.wrapper.addEventListener('mousemove', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\t\tthis.wrapper.addEventListener('wheel', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\t\tthis.wrapper.addEventListener('keydown', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\t\tthis.wrapper.addEventListener('keyup', (e) => {\n\t\t\te.stopPropagation()\n\t\t\te.preventDefault()\n\t\t})\n\n\t\t// Create AI cursor\n\t\tthis.#createCursor()\n\t\t// this.show()\n\n\t\tdocument.body.appendChild(this.wrapper)\n\n\t\tthis.#moveCursorToTarget()\n\n\t\twindow.addEventListener('PageAgent::MovePointerTo', (event: Event) => {\n\t\t\tconst { x, y } = (event as CustomEvent).detail\n\t\t\tthis.setCursorPosition(x, y)\n\t\t})\n\n\t\twindow.addEventListener('PageAgent::ClickPointer', (event: Event) => {\n\t\t\tthis.triggerClickAnimation()\n\t\t})\n\t}\n\n\t#createCursor() {\n\t\tthis.#cursor.className = cursorStyles.cursor\n\n\t\t// Create ripple effect container\n\t\tconst rippleContainer = document.createElement('div')\n\t\trippleContainer.className = cursorStyles.cursorRipple\n\t\tthis.#cursor.appendChild(rippleContainer)\n\n\t\t// Create filling layer\n\t\tconst fillingLayer = document.createElement('div')\n\t\tfillingLayer.className = cursorStyles.cursorFilling\n\t\tthis.#cursor.appendChild(fillingLayer)\n\n\t\t// Create border layer\n\t\tconst borderLayer = document.createElement('div')\n\t\tborderLayer.className = cursorStyles.cursorBorder\n\t\tthis.#cursor.appendChild(borderLayer)\n\n\t\tthis.wrapper.appendChild(this.#cursor)\n\t}\n\n\t#moveCursorToTarget() {\n\t\tconst newX = this.#currentCursorX + (this.#targetCursorX - this.#currentCursorX) * 0.2\n\t\tconst newY = this.#currentCursorY + (this.#targetCursorY - this.#currentCursorY) * 0.2\n\n\t\tconst xDistance = Math.abs(newX - this.#targetCursorX)\n\t\tif (xDistance > 0) {\n\t\t\tif (xDistance < 2) {\n\t\t\t\tthis.#currentCursorX = this.#targetCursorX\n\t\t\t} else {\n\t\t\t\tthis.#currentCursorX = newX\n\t\t\t}\n\t\t\tthis.#cursor.style.left = `${this.#currentCursorX}px`\n\t\t}\n\n\t\tconst yDistance = Math.abs(newY - this.#targetCursorY)\n\t\tif (yDistance > 0) {\n\t\t\tif (yDistance < 2) {\n\t\t\t\tthis.#currentCursorY = this.#targetCursorY\n\t\t\t} else {\n\t\t\t\tthis.#currentCursorY = newY\n\t\t\t}\n\t\t\tthis.#cursor.style.top = `${this.#currentCursorY}px`\n\t\t}\n\n\t\trequestAnimationFrame(() => this.#moveCursorToTarget())\n\t}\n\n\tsetCursorPosition(x: number, y: number) {\n\t\tthis.#targetCursorX = x\n\t\tthis.#targetCursorY = y\n\t}\n\n\ttriggerClickAnimation() {\n\t\tthis.#cursor.classList.remove(cursorStyles.clicking)\n\t\t// Force reflow to restart animation\n\t\tvoid this.#cursor.offsetHeight\n\t\tthis.#cursor.classList.add(cursorStyles.clicking)\n\t}\n\n\tshow() {\n\t\tthis.motion.start()\n\t\tthis.motion.fadeIn()\n\n\t\tthis.wrapper.style.display = 'block'\n\n\t\t// Initialize cursor position\n\t\tthis.#currentCursorX = window.innerWidth / 2\n\t\tthis.#currentCursorY = window.innerHeight / 2\n\t\tthis.#targetCursorX = this.#currentCursorX\n\t\tthis.#targetCursorY = this.#currentCursorY\n\t\tthis.#cursor.style.left = `${this.#currentCursorX}px`\n\t\tthis.#cursor.style.top = `${this.#currentCursorY}px`\n\t}\n\n\thide() {\n\t\tthis.motion.fadeOut()\n\t\tthis.motion.pause()\n\n\t\tthis.#cursor.classList.remove(cursorStyles.clicking)\n\n\t\tsetTimeout(() => {\n\t\t\tthis.wrapper.style.display = 'none'\n\t\t}, 800) // Match the animation duration\n\t}\n\n\tdispose() {\n\t\tthis.motion.dispose()\n\t\tthis.wrapper.remove()\n\t}\n}\n"],"names":[],"mappings":"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"}

package/dist/lib/page-controller.js

@@ -1,29 +1,5 @@
-(function() {
-  "use strict";
-  try {
-    if (typeof document != "undefined") {
-      var elementStyle = document.createElement("style");
-      elementStyle.appendChild(document.createTextNode("._wrapper_1oy2s_1 {\n	position: fixed;\n	inset: 0;\n	z-index: 2147483641; /* 确保在所有元素之上，除了 panel */\n	/* pointer-events: none; */\n	cursor: not-allowed;\n	overflow: hidden;\n\n	display: none;\n}\n/* AI 光标样式 */\n._cursor_1vrf3_2 {\n	position: absolute;\n	width: var(--cursor-size, 75px);\n	height: var(--cursor-size, 75px);\n	pointer-events: none;\n	z-index: 10000;\n	transform: translate(-30%, -30%);\n\n	animation: _cursor-enter_1vrf3_1 300ms ease-out forwards;\n}\n\n._cursorBorder_1vrf3_13 {\n	position: absolute;\n	inset: 0;\n	background: linear-gradient(45deg, rgb(57, 182, 255), rgb(189, 69, 251));\n	mask-image: url(https://img.alicdn.com/imgextra/i1/O1CN01YHLVYR1LvqWIyo5kH_!!6000000001362-2-tps-202-202.png);\n	mask-size: 100% 100%;\n	mask-repeat: no-repeat;\n	animation: _cursor-breathe_1vrf3_1 2s ease-in-out infinite;\n}\n\n._cursorFilling_1vrf3_23 {\n	position: absolute;\n	inset: 0;\n	background: url(https://img.alicdn.com/imgextra/i3/O1CN01JZOqOS1Tu1sIKbPLW_!!6000000002441-2-tps-202-202.png);\n	background-size: 100% 100%;\n	background-repeat: no-repeat;\n}\n\n._cursorRipple_1vrf3_31 {\n	position: absolute;\n	inset: 0;\n	pointer-events: none;\n}\n\n._cursor_1vrf3_2._clicking_1vrf3_37 ._cursorRipple_1vrf3_31::after {\n	content: '';\n	position: absolute;\n	width: 100%;\n	height: 100%;\n	left: -30%;\n	top: -30%;\n	border: 4px solid rgba(57, 182, 255, 1);\n	border-radius: 50%;\n	animation: _cursor-ripple_1vrf3_1 300ms ease-out forwards;\n}\n\n/* 光标动画关键帧 */\n@keyframes _cursor-breathe_1vrf3_1 {\n	0%,\n	100% {\n		transform: scale(1);\n		opacity: 0.9;\n	}\n	50% {\n		transform: scale(1.05);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-rotate_1vrf3_1 {\n	0% {\n		transform: rotate(0deg);\n	}\n	100% {\n		transform: rotate(360deg);\n	}\n}\n\n@keyframes _cursor-enter_1vrf3_1 {\n	0% {\n		transform: translate(-30%, -30%) scale(0.5);\n		opacity: 0;\n	}\n	100% {\n		transform: translate(-30%, -30%) scale(1);\n		opacity: 1;\n	}\n}\n\n@keyframes _cursor-ripple_1vrf3_1 {\n	0% {\n		transform: scale(0);\n		opacity: 1;\n	}\n	100% {\n		transform: scale(2);\n		opacity: 0;\n	}\n}"));
-      document.head.appendChild(elementStyle);
-    }
-  } catch (e) {
-    console.error("vite-plugin-css-injected-by-js", e);
-  }
-})();
 var __defProp = Object.defineProperty;
-var __typeError = (msg) => {
-  throw TypeError(msg);
-};
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
-var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
-var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
-var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
-var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
-var _cursor, _currentCursorX, _currentCursorY, _targetCursorX, _targetCursorY, _SimulatorMask_instances, createCursor_fn, moveCursorToTarget_fn;
-import { Motion } from "ai-motion";
 async function waitFor(seconds) {
   await new Promise((resolve) => setTimeout(resolve, seconds * 1e3));
 }
@@ -1723,227 +1699,6 @@ function getPageInfo() {
   };
 }
 __name(getPageInfo, "getPageInfo");
-function hasDarkModeClass() {
-  const DEFAULT_DARK_MODE_CLASSES = ["dark", "dark-mode", "theme-dark", "night", "night-mode"];
-  const htmlElement = document.documentElement;
-  const bodyElement = document.body || document.documentElement;
-  for (const className of DEFAULT_DARK_MODE_CLASSES) {
-    if (htmlElement.classList.contains(className) || bodyElement?.classList.contains(className)) {
-      return true;
-    }
-  }
-  const darkThemeAttribute = htmlElement.getAttribute("data-theme");
-  if (darkThemeAttribute?.toLowerCase().includes("dark")) {
-    return true;
-  }
-  return false;
-}
-__name(hasDarkModeClass, "hasDarkModeClass");
-function parseRgbColor(colorString) {
-  const rgbMatch = /rgba?\((\d+),\s*(\d+),\s*(\d+)/.exec(colorString);
-  if (!rgbMatch) {
-    return null;
-  }
-  return {
-    r: parseInt(rgbMatch[1]),
-    g: parseInt(rgbMatch[2]),
-    b: parseInt(rgbMatch[3])
-  };
-}
-__name(parseRgbColor, "parseRgbColor");
-function isColorDark(colorString, threshold = 128) {
-  if (!colorString || colorString === "transparent" || colorString.startsWith("rgba(0, 0, 0, 0)")) {
-    return false;
-  }
-  const rgb = parseRgbColor(colorString);
-  if (!rgb) {
-    return false;
-  }
-  const luminance = 0.299 * rgb.r + 0.587 * rgb.g + 0.114 * rgb.b;
-  return luminance < threshold;
-}
-__name(isColorDark, "isColorDark");
-function isBackgroundDark() {
-  const htmlStyle = window.getComputedStyle(document.documentElement);
-  const bodyStyle = window.getComputedStyle(document.body || document.documentElement);
-  const htmlBgColor = htmlStyle.backgroundColor;
-  const bodyBgColor = bodyStyle.backgroundColor;
-  if (isColorDark(bodyBgColor)) {
-    return true;
-  } else if (bodyBgColor === "transparent" || bodyBgColor.startsWith("rgba(0, 0, 0, 0)")) {
-    return isColorDark(htmlBgColor);
-  }
-  return false;
-}
-__name(isBackgroundDark, "isBackgroundDark");
-function isPageDark() {
-  try {
-    if (hasDarkModeClass()) {
-      return true;
-    }
-    if (isBackgroundDark()) {
-      return true;
-    }
-    return false;
-  } catch (error) {
-    console.warn("Error determining if page is dark:", error);
-    return false;
-  }
-}
-__name(isPageDark, "isPageDark");
-const wrapper = "_wrapper_1oy2s_1";
-const styles = {
-  wrapper
-};
-const cursor = "_cursor_1vrf3_2";
-const cursorBorder = "_cursorBorder_1vrf3_13";
-const cursorFilling = "_cursorFilling_1vrf3_23";
-const cursorRipple = "_cursorRipple_1vrf3_31";
-const clicking = "_clicking_1vrf3_37";
-const cursorStyles = {
-  cursor,
-  cursorBorder,
-  cursorFilling,
-  cursorRipple,
-  clicking
-};
-const _SimulatorMask = class _SimulatorMask {
-  constructor() {
-    __privateAdd(this, _SimulatorMask_instances);
-    __publicField(this, "wrapper", document.createElement("div"));
-    __publicField(this, "motion", new Motion({
-      mode: isPageDark() ? "dark" : "light",
-      styles: {
-        position: "absolute",
-        inset: "0"
-      }
-    }));
-    __privateAdd(this, _cursor, document.createElement("div"));
-    __privateAdd(this, _currentCursorX, 0);
-    __privateAdd(this, _currentCursorY, 0);
-    __privateAdd(this, _targetCursorX, 0);
-    __privateAdd(this, _targetCursorY, 0);
-    this.wrapper.id = "page-agent-runtime_simulator-mask";
-    this.wrapper.className = styles.wrapper;
-    this.wrapper.setAttribute("data-browser-use-ignore", "true");
-    this.wrapper.appendChild(this.motion.element);
-    this.motion.autoResize(this.wrapper);
-    this.wrapper.addEventListener("click", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    this.wrapper.addEventListener("mousedown", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    this.wrapper.addEventListener("mouseup", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    this.wrapper.addEventListener("mousemove", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    this.wrapper.addEventListener("wheel", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    this.wrapper.addEventListener("keydown", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    this.wrapper.addEventListener("keyup", (e) => {
-      e.stopPropagation();
-      e.preventDefault();
-    });
-    __privateMethod(this, _SimulatorMask_instances, createCursor_fn).call(this);
-    document.body.appendChild(this.wrapper);
-    __privateMethod(this, _SimulatorMask_instances, moveCursorToTarget_fn).call(this);
-    window.addEventListener("PageAgent::MovePointerTo", (event) => {
-      const { x, y } = event.detail;
-      this.setCursorPosition(x, y);
-    });
-    window.addEventListener("PageAgent::ClickPointer", (event) => {
-      this.triggerClickAnimation();
-    });
-  }
-  setCursorPosition(x, y) {
-    __privateSet(this, _targetCursorX, x);
-    __privateSet(this, _targetCursorY, y);
-  }
-  triggerClickAnimation() {
-    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
-    void __privateGet(this, _cursor).offsetHeight;
-    __privateGet(this, _cursor).classList.add(cursorStyles.clicking);
-  }
-  show() {
-    this.motion.start();
-    this.motion.fadeIn();
-    this.wrapper.style.display = "block";
-    __privateSet(this, _currentCursorX, window.innerWidth / 2);
-    __privateSet(this, _currentCursorY, window.innerHeight / 2);
-    __privateSet(this, _targetCursorX, __privateGet(this, _currentCursorX));
-    __privateSet(this, _targetCursorY, __privateGet(this, _currentCursorY));
-    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
-    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
-  }
-  hide() {
-    this.motion.fadeOut();
-    this.motion.pause();
-    __privateGet(this, _cursor).classList.remove(cursorStyles.clicking);
-    setTimeout(() => {
-      this.wrapper.style.display = "none";
-    }, 800);
-  }
-  dispose() {
-    this.motion.dispose();
-    this.wrapper.remove();
-  }
-};
-_cursor = new WeakMap();
-_currentCursorX = new WeakMap();
-_currentCursorY = new WeakMap();
-_targetCursorX = new WeakMap();
-_targetCursorY = new WeakMap();
-_SimulatorMask_instances = new WeakSet();
-createCursor_fn = /* @__PURE__ */ __name(function() {
-  __privateGet(this, _cursor).className = cursorStyles.cursor;
-  const rippleContainer = document.createElement("div");
-  rippleContainer.className = cursorStyles.cursorRipple;
-  __privateGet(this, _cursor).appendChild(rippleContainer);
-  const fillingLayer = document.createElement("div");
-  fillingLayer.className = cursorStyles.cursorFilling;
-  __privateGet(this, _cursor).appendChild(fillingLayer);
-  const borderLayer = document.createElement("div");
-  borderLayer.className = cursorStyles.cursorBorder;
-  __privateGet(this, _cursor).appendChild(borderLayer);
-  this.wrapper.appendChild(__privateGet(this, _cursor));
-}, "#createCursor");
-moveCursorToTarget_fn = /* @__PURE__ */ __name(function() {
-  const newX = __privateGet(this, _currentCursorX) + (__privateGet(this, _targetCursorX) - __privateGet(this, _currentCursorX)) * 0.2;
-  const newY = __privateGet(this, _currentCursorY) + (__privateGet(this, _targetCursorY) - __privateGet(this, _currentCursorY)) * 0.2;
-  const xDistance = Math.abs(newX - __privateGet(this, _targetCursorX));
-  if (xDistance > 0) {
-    if (xDistance < 2) {
-      __privateSet(this, _currentCursorX, __privateGet(this, _targetCursorX));
-    } else {
-      __privateSet(this, _currentCursorX, newX);
-    }
-    __privateGet(this, _cursor).style.left = `${__privateGet(this, _currentCursorX)}px`;
-  }
-  const yDistance = Math.abs(newY - __privateGet(this, _targetCursorY));
-  if (yDistance > 0) {
-    if (yDistance < 2) {
-      __privateSet(this, _currentCursorY, __privateGet(this, _targetCursorY));
-    } else {
-      __privateSet(this, _currentCursorY, newY);
-    }
-    __privateGet(this, _cursor).style.top = `${__privateGet(this, _currentCursorY)}px`;
-  }
-  requestAnimationFrame(() => __privateMethod(this, _SimulatorMask_instances, moveCursorToTarget_fn).call(this));
-}, "#moveCursorToTarget");
-__name(_SimulatorMask, "SimulatorMask");
-let SimulatorMask = _SimulatorMask;
 function patchReact(pageController) {
   const reactRootElements = document.querySelectorAll(
     '[data-reactroot], [data-reactid], [data-react-checksum], #root, #app, [id^="root-"], [id^="app-"], #adex-wrapper, #adex-root'
@@ -1973,14 +1728,22 @@ const _PageController = class _PageController extends EventTarget {
   lastTimeUpdate = 0;
   /** Visual mask overlay for blocking user interaction during automation */
   mask = null;
+  maskReady = null;
   constructor(config = {}) {
     super();
     this.config = config;
     patchReact();
     if (config.enableMask) {
-      this.mask = new SimulatorMask();
+      this.maskReady = this.initMask();
     }
   }
+  /**
+   * Initialize mask asynchronously (dynamic import to avoid CSS loading in Node)
+   */
+  async initMask() {
+    const { SimulatorMask } = await import("./SimulatorMask-BiVNIB3r.js");
+    this.mask = new SimulatorMask();
+  }
   // ======= State Queries =======
   /**
    * Get current page URL
@@ -2183,14 +1946,16 @@ ${scrollHintAbove}`;
    * Show the visual mask overlay.
    * Only works if enableMask was set to true in config.
    */
-  showMask() {
+  async showMask() {
+    await this.maskReady;
     this.mask?.show();
   }
   /**
    * Hide the visual mask overlay.
    * Only works if enableMask was set to true in config.
    */
-  hideMask() {
+  async hideMask() {
+    await this.maskReady;
     this.mask?.hide();
   }
   /**
@@ -2209,7 +1974,6 @@ ${scrollHintAbove}`;
 __name(_PageController, "PageController");
 let PageController = _PageController;
 export {
-  PageController,
-  SimulatorMask
+  PageController
 };
 //# sourceMappingURL=page-controller.js.map