wxt 0.18.15 → 0.19.0-alpha1

package/dist/client.js

@@ -1,424 +0,0 @@
-import {
-  browser
-} from "./chunk-FNTE2L27.js";
-
-// src/sandbox/utils/logger.ts
-function print(method, ...args) {
-  if (import.meta.env.MODE === "production") return;
-  if (typeof args[0] === "string") {
-    const message = args.shift();
-    method(`[wxt] ${message}`, ...args);
-  } else {
-    method("[wxt]", ...args);
-  }
-}
-var logger = {
-  debug: (...args) => print(console.debug, ...args),
-  log: (...args) => print(console.log, ...args),
-  warn: (...args) => print(console.warn, ...args),
-  error: (...args) => print(console.error, ...args)
-};
-
-// src/client/content-scripts/custom-events.ts
-var WxtLocationChangeEvent = class _WxtLocationChangeEvent extends Event {
-  constructor(newUrl, oldUrl) {
-    super(_WxtLocationChangeEvent.EVENT_NAME, {});
-    this.newUrl = newUrl;
-    this.oldUrl = oldUrl;
-  }
-  static EVENT_NAME = getUniqueEventName("wxt:locationchange");
-};
-function getUniqueEventName(eventName) {
-  const entrypointName = typeof import.meta.env === "undefined" ? "build" : import.meta.env.ENTRYPOINT;
-  return `${browser.runtime.id}:${entrypointName}:${eventName}`;
-}
-
-// src/client/content-scripts/location-watcher.ts
-function createLocationWatcher(ctx) {
-  let interval;
-  let oldUrl;
-  return {
-    /**
-     * Ensure the location watcher is actively looking for URL changes. If it's already watching,
-     * this is a noop.
-     */
-    run() {
-      if (interval != null) return;
-      oldUrl = new URL(location.href);
-      interval = ctx.setInterval(() => {
-        let newUrl = new URL(location.href);
-        if (newUrl.href !== oldUrl.href) {
-          window.dispatchEvent(new WxtLocationChangeEvent(newUrl, oldUrl));
-          oldUrl = newUrl;
-        }
-      }, 1e3);
-    }
-  };
-}
-
-// src/client/content-scripts/content-script-context.ts
-var ContentScriptContext = class _ContentScriptContext {
-  constructor(contentScriptName, options) {
-    this.contentScriptName = contentScriptName;
-    this.options = options;
-    this.#abortController = new AbortController();
-    if (this.#isTopFrame) {
-      this.#stopOldScripts();
-    }
-    this.setTimeout(() => {
-      this.#listenForNewerScripts();
-    });
-  }
-  static SCRIPT_STARTED_MESSAGE_TYPE = "wxt:content-script-started";
-  #isTopFrame = window.self === window.top;
-  #abortController;
-  #locationWatcher = createLocationWatcher(this);
-  get signal() {
-    return this.#abortController.signal;
-  }
-  abort(reason) {
-    return this.#abortController.abort(reason);
-  }
-  get isInvalid() {
-    if (browser.runtime.id == null) {
-      this.notifyInvalidated();
-    }
-    return this.signal.aborted;
-  }
-  get isValid() {
-    return !this.isInvalid;
-  }
-  /**
-   * Add a listener that is called when the content script's context is invalidated.
-   *
-   * @returns A function to remove the listener.
-   *
-   * @example
-   * browser.runtime.onMessage.addListener(cb);
-   * const removeInvalidatedListener = ctx.onInvalidated(() => {
-   *   browser.runtime.onMessage.removeListener(cb);
-   * })
-   * // ...
-   * removeInvalidatedListener();
-   */
-  onInvalidated(cb) {
-    this.signal.addEventListener("abort", cb);
-    return () => this.signal.removeEventListener("abort", cb);
-  }
-  /**
-   * Return a promise that never resolves. Useful if you have an async function that shouldn't run
-   * after the context is expired.
-   *
-   * @example
-   * const getValueFromStorage = async () => {
-   *   if (ctx.isInvalid) return ctx.block();
-   *
-   *   // ...
-   * }
-   */
-  block() {
-    return new Promise(() => {
-    });
-  }
-  /**
-   * Wrapper around `window.setInterval` that automatically clears the interval when invalidated.
-   */
-  setInterval(handler, timeout) {
-    const id = setInterval(() => {
-      if (this.isValid) handler();
-    }, timeout);
-    this.onInvalidated(() => clearInterval(id));
-    return id;
-  }
-  /**
-   * Wrapper around `window.setTimeout` that automatically clears the interval when invalidated.
-   */
-  setTimeout(handler, timeout) {
-    const id = setTimeout(() => {
-      if (this.isValid) handler();
-    }, timeout);
-    this.onInvalidated(() => clearTimeout(id));
-    return id;
-  }
-  /**
-   * Wrapper around `window.requestAnimationFrame` that automatically cancels the request when
-   * invalidated.
-   */
-  requestAnimationFrame(callback) {
-    const id = requestAnimationFrame((...args) => {
-      if (this.isValid) callback(...args);
-    });
-    this.onInvalidated(() => cancelAnimationFrame(id));
-    return id;
-  }
-  /**
-   * Wrapper around `window.requestIdleCallback` that automatically cancels the request when
-   * invalidated.
-   */
-  requestIdleCallback(callback, options) {
-    const id = requestIdleCallback((...args) => {
-      if (!this.signal.aborted) callback(...args);
-    }, options);
-    this.onInvalidated(() => cancelIdleCallback(id));
-    return id;
-  }
-  /**
-   * Call `target.addEventListener` and remove the event listener when the context is invalidated.
-   *
-   * Includes additional events useful for content scripts:
-   *
-   * - `"wxt:locationchange"` - Triggered when HTML5 history mode is used to change URL. Content
-   *   scripts are not reloaded when navigating this way, so this can be used to reset the content
-   *   script state on URL change, or run custom code.
-   *
-   * @example
-   * ctx.addEventListener(document, "visibilitychange", () => {
-   *   // ...
-   * });
-   * ctx.addEventListener(document, "wxt:locationchange", () => {
-   *   // ...
-   * });
-   */
-  addEventListener(target, type, handler, options) {
-    if (type === "wxt:locationchange") {
-      if (this.isValid) this.#locationWatcher.run();
-    }
-    target.addEventListener?.(
-      type.startsWith("wxt:") ? getUniqueEventName(type) : type,
-      // @ts-expect-error: Event don't match, but that's OK, EventTarget doesn't allow custom types in the callback
-      handler,
-      {
-        ...options,
-        signal: this.signal
-      }
-    );
-  }
-  /**
-   * @internal
-   * Abort the abort controller and execute all `onInvalidated` listeners.
-   */
-  notifyInvalidated() {
-    this.abort("Content script context invalidated");
-    logger.debug(
-      `Content script "${this.contentScriptName}" context invalidated`
-    );
-  }
-  #stopOldScripts() {
-    window.postMessage(
-      {
-        type: _ContentScriptContext.SCRIPT_STARTED_MESSAGE_TYPE,
-        contentScriptName: this.contentScriptName
-      },
-      "*"
-    );
-  }
-  #listenForNewerScripts() {
-    const cb = (event) => {
-      if (event.data?.type === _ContentScriptContext.SCRIPT_STARTED_MESSAGE_TYPE && event.data?.contentScriptName === this.contentScriptName) {
-        this.notifyInvalidated();
-      }
-    };
-    addEventListener("message", cb);
-    this.onInvalidated(() => removeEventListener("message", cb));
-  }
-};
-
-// src/client/content-scripts/ui/index.ts
-import { createIsolatedElement } from "@webext-core/isolated-element";
-function createIntegratedUi(ctx, options) {
-  const wrapper = document.createElement(options.tag || "div");
-  wrapper.setAttribute("data-wxt-integrated", "");
-  let mounted = void 0;
-  const mount = () => {
-    applyPosition(wrapper, void 0, options);
-    mountUi(wrapper, options);
-    mounted = options.onMount?.(wrapper);
-  };
-  const remove = () => {
-    options.onRemove?.(mounted);
-    wrapper.remove();
-    mounted = void 0;
-  };
-  ctx.onInvalidated(remove);
-  return {
-    get mounted() {
-      return mounted;
-    },
-    wrapper,
-    mount,
-    remove
-  };
-}
-function createIframeUi(ctx, options) {
-  const wrapper = document.createElement("div");
-  wrapper.setAttribute("data-wxt-iframe", "");
-  const iframe = document.createElement("iframe");
-  iframe.src = browser.runtime.getURL(options.page);
-  wrapper.appendChild(iframe);
-  let mounted = void 0;
-  const mount = () => {
-    applyPosition(wrapper, iframe, options);
-    mountUi(wrapper, options);
-    mounted = options.onMount?.(wrapper, iframe);
-  };
-  const remove = () => {
-    options.onRemove?.(mounted);
-    wrapper.remove();
-    mounted = void 0;
-  };
-  ctx.onInvalidated(remove);
-  return {
-    get mounted() {
-      return mounted;
-    },
-    iframe,
-    wrapper,
-    mount,
-    remove
-  };
-}
-async function createShadowRootUi(ctx, options) {
-  const css = [options.css ?? ""];
-  if (ctx.options?.cssInjectionMode === "ui") {
-    const entryCss = await loadCss();
-    css.push(entryCss.replaceAll(":root", ":host"));
-  }
-  const {
-    isolatedElement: uiContainer,
-    parentElement: shadowHost,
-    shadow
-  } = await createIsolatedElement({
-    name: options.name,
-    css: {
-      textContent: css.join("\n").trim()
-    },
-    mode: options.mode ?? "open",
-    isolateEvents: options.isolateEvents
-  });
-  shadowHost.setAttribute("data-wxt-shadow-root", "");
-  let mounted;
-  const mount = () => {
-    mountUi(shadowHost, options);
-    applyPosition(shadowHost, shadow.querySelector("html"), options);
-    mounted = options.onMount(uiContainer, shadow, shadowHost);
-  };
-  const remove = () => {
-    options.onRemove?.(mounted);
-    shadowHost.remove();
-    while (uiContainer.lastChild)
-      uiContainer.removeChild(uiContainer.lastChild);
-    mounted = void 0;
-  };
-  ctx.onInvalidated(remove);
-  return {
-    shadow,
-    shadowHost,
-    uiContainer,
-    mount,
-    remove,
-    get mounted() {
-      return mounted;
-    }
-  };
-}
-function applyPosition(root, positionedElement, options) {
-  if (options.position === "inline") return;
-  if (options.zIndex != null) root.style.zIndex = String(options.zIndex);
-  root.style.overflow = "visible";
-  root.style.position = "relative";
-  root.style.width = "0";
-  root.style.height = "0";
-  root.style.display = "block";
-  if (positionedElement) {
-    if (options.position === "overlay") {
-      positionedElement.style.position = "absolute";
-      if (options.alignment?.startsWith("bottom-"))
-        positionedElement.style.bottom = "0";
-      else positionedElement.style.top = "0";
-      if (options.alignment?.endsWith("-right"))
-        positionedElement.style.right = "0";
-      else positionedElement.style.left = "0";
-    } else {
-      positionedElement.style.position = "fixed";
-      positionedElement.style.top = "0";
-      positionedElement.style.bottom = "0";
-      positionedElement.style.left = "0";
-      positionedElement.style.right = "0";
-    }
-  }
-}
-function getAnchor(options) {
-  if (options.anchor == null) return document.body;
-  let resolved = typeof options.anchor === "function" ? options.anchor() : options.anchor;
-  if (typeof resolved === "string") {
-    if (resolved.startsWith("/")) {
-      const result = document.evaluate(
-        resolved,
-        document,
-        null,
-        XPathResult.FIRST_ORDERED_NODE_TYPE,
-        null
-      );
-      return result.singleNodeValue ?? void 0;
-    } else {
-      return document.querySelector(resolved) ?? void 0;
-    }
-  }
-  return resolved ?? void 0;
-}
-function mountUi(root, options) {
-  const anchor = getAnchor(options);
-  if (anchor == null)
-    throw Error(
-      "Failed to mount content script UI: could not find anchor element"
-    );
-  switch (options.append) {
-    case void 0:
-    case "last":
-      anchor.append(root);
-      break;
-    case "first":
-      anchor.prepend(root);
-      break;
-    case "replace":
-      anchor.replaceWith(root);
-      break;
-    case "after":
-      anchor.parentElement?.insertBefore(root, anchor.nextElementSibling);
-      break;
-    case "before":
-      anchor.parentElement?.insertBefore(root, anchor);
-      break;
-    default:
-      options.append(anchor, root);
-      break;
-  }
-}
-async function loadCss() {
-  const url = browser.runtime.getURL(
-    `/content-scripts/${import.meta.env.ENTRYPOINT}.css`
-  );
-  try {
-    const res = await fetch(url);
-    return await res.text();
-  } catch (err) {
-    logger.warn(
-      `Failed to load styles @ ${url}. Did you forget to import the stylesheet in your entrypoint?`,
-      err
-    );
-    return "";
-  }
-}
-
-// src/client/app-config.ts
-import appConfig from "virtual:app-config";
-function useAppConfig() {
-  return appConfig;
-}
-export {
-  ContentScriptContext,
-  createIframeUi,
-  createIntegratedUi,
-  createShadowRootUi,
-  useAppConfig
-};