radiant-docs 0.1.39 → 0.1.41

package/template/src/lib/assistant-embed-script.ts

@@ -0,0 +1,897 @@
+import fs from "node:fs";
+import path from "node:path";
+import { DEFAULT_ASSISTANT_CHROME_CONFIG } from "./assistant-chrome-defaults";
+import {
+  type AssistantChromeConfig,
+  getAssistantChromeConfig,
+} from "./assistant-chrome";
+import { getDocsBasePath, withBasePath } from "./base-path";
+import { getFaviconConfig } from "./favicon";
+import {
+  getDocsBaseColorShade,
+  getThemeForegroundColor,
+} from "./theme-css";
+import { type DocsConfig } from "./validation";
+
+type AssistantColorByMode = {
+  light: string;
+  dark: string;
+};
+
+type GeneratedEmbedConfig = {
+  docsOrigin: string;
+  docsBasePath: string;
+  panelSrc: string;
+  apiUrl: string;
+  themeColor: string;
+  themeColors: AssistantColorByMode;
+  iconColor: string;
+  iconColors: AssistantColorByMode;
+  iconImageSrc: string;
+  chrome: AssistantChromeConfig;
+};
+
+export type ResolvedAssistantLauncherIcon = {
+  themeColor: string;
+  themeColors: AssistantColorByMode;
+  color: string;
+  colors: AssistantColorByMode;
+  imageSrc: string;
+};
+
+const DOCS_DIR = path.join(process.cwd(), "src/content/docs");
+const IMAGE_MIME_TYPES: Record<string, string> = {
+  ".avif": "image/avif",
+  ".gif": "image/gif",
+  ".ico": "image/x-icon",
+  ".jpg": "image/jpeg",
+  ".jpeg": "image/jpeg",
+  ".png": "image/png",
+  ".svg": "image/svg+xml",
+  ".webp": "image/webp",
+};
+
+function getDocsSiteUrl(): URL | null {
+  const rawSiteUrl = (import.meta.env.DOCS_SITE_URL ?? "").toString().trim();
+  if (!rawSiteUrl) return null;
+
+  try {
+    return new URL(rawSiteUrl);
+  } catch {
+    return null;
+  }
+}
+
+function getPanelSrc(docsSiteUrl: URL | null): string {
+  if (import.meta.env.DEV) {
+    return withBasePath("/-/assistant/panel");
+  }
+
+  if (!docsSiteUrl) {
+    return withBasePath("/-/assistant/panel");
+  }
+
+  const panelUrl = new URL(withBasePath("/-/assistant/panel"), docsSiteUrl);
+  const buildVersion = (import.meta.env.DOCS_BUILD_VERSION ?? "")
+    .toString()
+    .trim();
+
+  if (buildVersion) {
+    panelUrl.searchParams.set("v", buildVersion);
+  }
+
+  return panelUrl.toString();
+}
+
+function getApiUrl(docsSiteUrl: URL | null): string {
+  if (!docsSiteUrl) return "";
+
+  return new URL(withBasePath("/_platform/assistant"), docsSiteUrl).toString();
+}
+
+function getLocalImageDataUrl(iconSource: string): string {
+  const parsed = new URL(iconSource, "https://docs.invalid/");
+  const normalizedPath = parsed.pathname.replace(/^\/+/, "");
+  const fullPath = path.join(DOCS_DIR, normalizedPath);
+  const extension = path.extname(parsed.pathname).toLowerCase();
+  const mimeType = IMAGE_MIME_TYPES[extension];
+
+  if (!mimeType || !fs.existsSync(fullPath)) {
+    return "";
+  }
+
+  const data = fs.readFileSync(fullPath);
+  return `data:${mimeType};base64,${data.toString("base64")}`;
+}
+
+function resolveLauncherIcon(
+  iconSource: string | undefined,
+): Pick<ResolvedAssistantLauncherIcon, "imageSrc"> {
+  const resolvedIconSource = iconSource ?? getFaviconConfig().href;
+
+  return {
+    imageSrc: getLocalImageDataUrl(resolvedIconSource),
+  };
+}
+
+function getConfiguredColorForMode(
+  value: DocsConfig["theme"]["themeColor"] | undefined,
+  mode: "light" | "dark",
+): string | undefined {
+  if (typeof value === "string") return value;
+  return value?.[mode];
+}
+
+function getDefaultAssistantThemeColor(
+  config: DocsConfig,
+  mode: "light" | "dark",
+): string {
+  const configuredThemeColor = getConfiguredColorForMode(
+    config.theme?.themeColor,
+    mode,
+  );
+  if (configuredThemeColor) return configuredThemeColor;
+
+  return getDocsBaseColorShade(config.theme, mode, mode === "light" ? "900" : "100");
+}
+
+function getAssistantThemeColor(
+  config: DocsConfig,
+  mode: "light" | "dark",
+): string {
+  const configuredAssistantColor = getConfiguredColorForMode(
+    config.assistant?.themeColor,
+    mode,
+  );
+  return configuredAssistantColor ?? getDefaultAssistantThemeColor(config, mode);
+}
+
+export function getAssistantLauncherIconConfig(
+  config: DocsConfig,
+): ResolvedAssistantLauncherIcon {
+  const assistantConfig = config.assistant;
+  const themeColors = {
+    light: getAssistantThemeColor(config, "light"),
+    dark: getAssistantThemeColor(config, "dark"),
+  };
+  const iconColors = {
+    light:
+      assistantConfig?.icon?.color ??
+      getThemeForegroundColor(
+        themeColors.light,
+        getDocsBaseColorShade(config.theme, "light", "900"),
+      ),
+    dark:
+      assistantConfig?.icon?.color ??
+      getThemeForegroundColor(
+        themeColors.dark,
+        getDocsBaseColorShade(config.theme, "dark", "900"),
+      ),
+  };
+  const icon = resolveLauncherIcon(assistantConfig?.icon?.src);
+
+  return {
+    themeColor: themeColors.light,
+    themeColors,
+    color: iconColors.light,
+    colors: iconColors,
+    imageSrc: icon.imageSrc,
+  };
+}
+
+function getGeneratedConfig(config: DocsConfig): GeneratedEmbedConfig {
+  const docsSiteUrl = getDocsSiteUrl();
+  const icon = getAssistantLauncherIconConfig(config);
+
+  return {
+    docsOrigin: docsSiteUrl?.origin ?? "",
+    docsBasePath: getDocsBasePath(),
+    panelSrc: getPanelSrc(docsSiteUrl),
+    apiUrl: getApiUrl(docsSiteUrl),
+    themeColor: icon.themeColor,
+    themeColors: icon.themeColors,
+    iconColor: icon.color,
+    iconColors: icon.colors,
+    iconImageSrc: icon.imageSrc,
+    chrome: getAssistantChromeConfig(config),
+  };
+}
+
+export function renderAssistantEmbedScript(config: DocsConfig): string {
+  const generatedConfig = JSON.stringify(getGeneratedConfig(config));
+  const fallbackPanelDarkBackground = JSON.stringify(
+    DEFAULT_ASSISTANT_CHROME_CONFIG.panelDarkBackground,
+  );
+
+  return `(function () {
+  var generatedConfig = ${generatedConfig};
+  var existing = window.AssistantEmbed;
+  if (existing && existing.installed) {
+    return;
+  }
+
+  var script = document.currentScript;
+  var scriptDataset = script ? script.dataset : {};
+  var globalConfig = window.AssistantEmbedConfig || {};
+  var configuredDocsOrigin =
+    scriptDataset.docsOrigin ||
+    globalConfig.docsOrigin ||
+    generatedConfig.docsOrigin ||
+    "";
+  var configuredDocsBasePath =
+    scriptDataset.docsBasePath ||
+    globalConfig.docsBasePath ||
+    generatedConfig.docsBasePath ||
+    "";
+  var configuredPanelSrc =
+    scriptDataset.panelSrc || globalConfig.panelSrc || generatedConfig.panelSrc || "";
+  var configuredApiUrl =
+    scriptDataset.apiUrl || globalConfig.apiUrl || generatedConfig.apiUrl || "";
+  var configuredIconImageSrc = generatedConfig.iconImageSrc || "";
+
+  function resolveDocsOrigin() {
+    if (configuredDocsOrigin) {
+      try {
+        return new URL(configuredDocsOrigin).origin;
+      } catch (error) {
+        console.warn("[Assistant embed] Invalid data-docs-origin", error);
+      }
+    }
+
+    if (script && script.src) {
+      try {
+        return new URL(script.src).origin;
+      } catch {
+        return "";
+      }
+    }
+
+    return "";
+  }
+
+  function normalizeBasePath(value) {
+    var trimmed = String(value || "").trim();
+    if (!trimmed || trimmed === "/") return "";
+    var pathname = trimmed.charAt(0) === "/" ? trimmed : "/" + trimmed;
+    pathname = pathname.replace(/\\/{2,}/g, "/").replace(/\\/+$/, "");
+    return pathname === "/" ? "" : pathname;
+  }
+
+  function resolveDocsBasePath() {
+    var explicitBasePath = normalizeBasePath(configuredDocsBasePath);
+    if (explicitBasePath) return explicitBasePath;
+
+    if (script && script.src) {
+      try {
+        var scriptPathname = new URL(script.src).pathname;
+        var suffixes = ["/-/assistant/embed.js", "/_platform/assistant/embed.js"];
+        for (var index = 0; index < suffixes.length; index += 1) {
+          var suffix = suffixes[index];
+          if (scriptPathname.endsWith(suffix)) {
+            return normalizeBasePath(scriptPathname.slice(0, -suffix.length));
+          }
+        }
+      } catch {
+        return "";
+      }
+    }
+
+    return "";
+  }
+
+  function withBasePath(pathname) {
+    var basePath = docsBasePath;
+    if (!basePath) return pathname;
+    if (pathname === basePath || pathname.startsWith(basePath + "/")) {
+      return pathname;
+    }
+    if (pathname === "/") return basePath;
+    return basePath + pathname;
+  }
+
+  function escapeHtmlAttribute(value) {
+    return String(value).replace(/[&<>"']/g, function (character) {
+      if (character === "&") return "&amp;";
+      if (character === "<") return "&lt;";
+      if (character === ">") return "&gt;";
+      if (character === '"') return "&quot;";
+      return "&#39;";
+    });
+  }
+
+  var docsOrigin = resolveDocsOrigin();
+  var docsBasePath = resolveDocsBasePath();
+  var chrome = generatedConfig.chrome || {};
+  var zIndex = scriptDataset.zIndex || chrome.zIndex || "2147483000";
+  var configuredMode =
+    scriptDataset.mode ||
+    (typeof globalConfig.mode === "string" ? globalConfig.mode : "") ||
+    "system";
+  var defaultSide = chrome.side === "left" ? "left" : "right";
+  var side =
+    scriptDataset.side === "left" || scriptDataset.side === "right"
+      ? scriptDataset.side
+      : defaultSide;
+  var offsetX = scriptDataset.offsetX || chrome.offsetX || "20px";
+  var offsetY = scriptDataset.offsetY || chrome.offsetY || "20px";
+  var mobileOffsetX = chrome.mobileOffsetX || "16px";
+  var mobileOffsetY = chrome.mobileOffsetY || "16px";
+  var panelWidth = scriptDataset.panelWidth || chrome.panelWidth || "420px";
+  var panelHeight = scriptDataset.panelHeight || chrome.panelHeight || "640px";
+  var panelGap = chrome.panelGap || "12px";
+  var panelRadius = chrome.panelRadius || "16px";
+  var panelBorder = chrome.panelBorder || "1px solid rgb(9 14 21 / 8%)";
+  var panelBackground = chrome.panelBackground || "rgb(255 255 255 / 90%)";
+  var panelDarkBorder = chrome.panelDarkBorder || "1px solid rgb(255 255 255 / 10%)";
+  var panelDarkBackground =
+    chrome.panelDarkBackground ||
+    ${fallbackPanelDarkBackground};
+  var panelBackdropBlur = chrome.panelBackdropBlur || "48px";
+  var panelShadow =
+    chrome.panelShadow || "rgba(9, 14, 21, 0.16) 0px 5px 40px 0px";
+  var panelDarkShadow =
+    chrome.panelDarkShadow || "rgba(0, 0, 0, 0.36) 0px 8px 44px 0px";
+  var panelOpenScale = chrome.panelOpenScale || ".9";
+  var panelOpenDuration = chrome.panelOpenDuration || ".5s";
+  var panelOpenTiming = chrome.panelOpenTiming || "cubic-bezier(.34,1.56,.64,1)";
+  var panelCloseDuration = chrome.panelCloseDuration || ".2s";
+  var panelCloseTiming = chrome.panelCloseTiming || "cubic-bezier(.25,1,.5,1)";
+  var mobileBreakpoint = chrome.mobileBreakpoint || "640px";
+  var launcherSize = scriptDataset.launcherSize || chrome.launcherSize || "48px";
+  var launcherIconSize = chrome.launcherIconSize || "20px";
+  var launcherShadow =
+    chrome.launcherShadow ||
+    "0 18px 40px rgb(0 0 0 / 18%),0 3px 10px rgb(0 0 0 / 12%)";
+  var numericZIndex = Number.parseInt(zIndex, 10) || 2147483000;
+  var generatedThemeColors = generatedConfig.themeColors || {
+    light: generatedConfig.themeColor || "#171717",
+    dark: generatedConfig.themeColor || "#171717",
+  };
+  var generatedIconColors = generatedConfig.iconColors || {
+    light: generatedConfig.iconColor || "#ffffff",
+    dark: generatedConfig.iconColor || "#ffffff",
+  };
+  var themeColor = "";
+  var iconColor = "";
+  var styleId = "assistant-embed-style";
+  var launcherButton;
+  var panelShell;
+  var panelFrame;
+  var isOpen = false;
+  var systemThemeMediaQuery =
+    typeof window.matchMedia === "function"
+      ? window.matchMedia("(prefers-color-scheme: dark)")
+      : null;
+  var isListeningForSystemTheme = false;
+
+  function normalizeThemeMode(value) {
+    var normalized = String(value || "").trim().toLowerCase();
+    if (
+      normalized === "light" ||
+      normalized === "dark" ||
+      normalized === "system"
+    ) {
+      return normalized;
+    }
+    return "";
+  }
+
+  function getSystemTheme() {
+    if (systemThemeMediaQuery && systemThemeMediaQuery.matches) {
+      return "dark";
+    }
+    return "light";
+  }
+
+  function resolveThemeMode(nextMode) {
+    if (nextMode === "light" || nextMode === "dark") {
+      return nextMode;
+    }
+    return getSystemTheme();
+  }
+
+  var themeMode = normalizeThemeMode(configuredMode) || "system";
+  var resolvedTheme = resolveThemeMode(themeMode);
+
+  function getColorForMode(value, mode) {
+    if (typeof value === "string" && value.trim().length > 0) {
+      return value;
+    }
+
+    if (value && typeof value === "object" && typeof value[mode] === "string") {
+      return value[mode];
+    }
+
+    return "";
+  }
+
+  function resolveLauncherThemeColor() {
+    return (
+      (resolvedTheme === "dark"
+        ? scriptDataset.themeColorDark
+        : scriptDataset.themeColorLight) ||
+      getColorForMode(scriptDataset.themeColor, resolvedTheme) ||
+      getColorForMode(globalConfig.themeColor, resolvedTheme) ||
+      getColorForMode(generatedThemeColors, resolvedTheme) ||
+      "#171717"
+    );
+  }
+
+  function resolveLauncherIconColor() {
+    return (
+      getColorForMode(generatedIconColors, resolvedTheme) ||
+      generatedConfig.iconColor ||
+      "#ffffff"
+    );
+  }
+
+  function applyLauncherColors() {
+    themeColor = resolveLauncherThemeColor();
+    iconColor = resolveLauncherIconColor();
+
+    if (!launcherButton) {
+      return;
+    }
+
+    launcherButton.style.setProperty("--assistant-embed-theme", themeColor);
+    launcherButton.style.setProperty("--assistant-embed-icon-color", iconColor);
+  }
+
+  applyLauncherColors();
+
+  function resolveUrl(value, fallbackPathname) {
+    var rawValue = value || withBasePath(fallbackPathname);
+    try {
+      return new URL(rawValue, docsOrigin || window.location.origin);
+    } catch {
+      return new URL(withBasePath(fallbackPathname), window.location.origin);
+    }
+  }
+
+  function buildPanelUrl() {
+    var url = resolveUrl(configuredPanelSrc, "/-/assistant/panel");
+    url.searchParams.set("mode", resolvedTheme);
+    if (configuredApiUrl) {
+      url.searchParams.set("apiUrl", configuredApiUrl);
+    }
+    return url.toString();
+  }
+
+  function buildIconUrl() {
+    if (!configuredIconImageSrc) {
+      return "";
+    }
+
+    try {
+      return new URL(configuredIconImageSrc, docsOrigin || window.location.origin).toString();
+    } catch {
+      return configuredIconImageSrc;
+    }
+  }
+
+  function ensureStyle() {
+    if (document.getElementById(styleId)) {
+      return;
+    }
+
+    var style = document.createElement("style");
+    style.id = styleId;
+    style.textContent = [
+      ".assistant-embed-frame{display:block;width:100%;height:100%;border:0;background:transparent;color-scheme:normal;}",
+      "@keyframes assistant-embed-launcher-enter{0%{opacity:0;transform:translateY(3px) scale(.96);}46%{opacity:1;transform:translateY(0) scale(1.012);}72%{opacity:1;transform:translateY(0) scale(.998);}100%{opacity:1;transform:translateY(0) scale(1);}}",
+      ".assistant-embed-launcher{position:fixed;display:inline-flex;align-items:center;justify-content:center;border:0;padding:0;cursor:pointer;color:var(--assistant-embed-icon-color);background:linear-gradient(to bottom,color-mix(in oklab,var(--assistant-embed-theme) 88%,white),color-mix(in oklab,var(--assistant-embed-theme) 90%,black));animation:assistant-embed-launcher-enter 460ms linear backwards;transition:transform 180ms ease,opacity 160ms ease;transform-origin:center center;}",
+      ".assistant-embed-launcher:hover{opacity:.96;transform:translateY(-1px) scale(1.03);}",
+      ".assistant-embed-launcher:active{transform:translateY(0) scale(.96);}",
+      ".assistant-embed-launcher{width:" +
+        launcherSize +
+        ";height:" +
+        launcherSize +
+        ";bottom:" +
+        offsetY +
+        ";" +
+        side +
+        ":" +
+        offsetX +
+        ";z-index:" +
+        (numericZIndex + 1) +
+        ";border-radius:999px;box-shadow:" +
+        launcherShadow +
+        ";}",
+      ".assistant-embed-launcher-icon{position:absolute;width:" +
+        launcherIconSize +
+        ";height:" +
+        launcherIconSize +
+        ";pointer-events:none;transform-origin:center;transition:opacity 150ms ease,transform 180ms cubic-bezier(.2,.8,.2,1);}",
+      ".assistant-embed-launcher-custom-icon{object-fit:contain;}",
+      ".assistant-embed-launcher-mark{opacity:1;transform:scale(1);}",
+      ".assistant-embed-launcher-chevron{opacity:0;transform:scale(.55);}",
+      ".assistant-embed-launcher[data-open='true'] .assistant-embed-launcher-mark{opacity:0;transform:scale(.55);}",
+      ".assistant-embed-launcher[data-open='true'] .assistant-embed-launcher-chevron{opacity:1;transform:scale(1);}",
+      ".assistant-embed-panel-shell{position:fixed;width:min(" +
+        panelWidth +
+        ",calc(100vw - 32px));height:min(" +
+        panelHeight +
+        ",calc(100dvh - 32px));bottom:calc(" +
+        offsetY +
+        " + " +
+        launcherSize +
+        " + " +
+        panelGap +
+        ");" +
+        side +
+        ":" +
+        offsetX +
+        ";z-index:" +
+        zIndex +
+        ";box-sizing:border-box;border:" +
+        panelBorder +
+        ";border-radius:" +
+        panelRadius +
+        ";box-shadow:" +
+        panelShadow +
+        ";background:" +
+        panelBackground +
+        ";-webkit-backdrop-filter:blur(" +
+        panelBackdropBlur +
+        ");backdrop-filter:blur(" +
+        panelBackdropBlur +
+        ");overflow:hidden;opacity:1;pointer-events:auto;transform:scale(1);transform-origin:bottom " +
+        side +
+        ";transition-property:transform,opacity,display;transition-duration:" +
+        panelOpenDuration +
+        ";transition-timing-function:" +
+        panelOpenTiming +
+        ";transition-behavior:allow-discrete;}",
+      ".assistant-embed-panel-shell[data-theme='dark']{border:" +
+        panelDarkBorder +
+        ";background:" +
+        panelDarkBackground +
+        ";box-shadow:" +
+        panelDarkShadow +
+        ";}",
+      "@starting-style{.assistant-embed-panel-shell[data-state='open']{opacity:0;transform:scale(" +
+        panelOpenScale +
+        ");}}",
+      ".assistant-embed-panel-shell[data-state='closed']{display:none;opacity:0;pointer-events:none;transform:scale(" +
+        panelOpenScale +
+        ");transition-property:transform,opacity,display;transition-duration:" +
+        panelCloseDuration +
+        ";transition-timing-function:" +
+        panelCloseTiming +
+        ";transition-behavior:allow-discrete;}",
+      "@media (max-width:" +
+        mobileBreakpoint +
+        "){.assistant-embed-panel-shell{inset:0!important;width:100vw!important;height:100dvh!important;border:0!important;border-radius:0!important;z-index:" +
+        (numericZIndex + 2) +
+        "!important;}}",
+      "@media (max-width:" +
+        mobileBreakpoint +
+        "){.assistant-embed-launcher{bottom:" +
+        mobileOffsetY +
+        "!important;" +
+        side +
+        ":" +
+        mobileOffsetX +
+        "!important;}}",
+      "@media (prefers-reduced-motion:reduce){.assistant-embed-launcher{animation:none!important;}.assistant-embed-launcher,.assistant-embed-launcher-icon,.assistant-embed-panel-shell{transition:none!important;}}",
+    ].join("");
+    document.head.appendChild(style);
+  }
+
+  function setPanelOpen(nextOpen) {
+    if (!panelShell) {
+      return;
+    }
+
+    if (nextOpen) {
+      if (panelShell.dataset.state === "open") {
+        return;
+      }
+      panelShell.dataset.state = "open";
+      return;
+    }
+
+    if (panelShell.dataset.state === "closed") {
+      return;
+    }
+
+    panelShell.dataset.state = "closed";
+  }
+
+  function postPanelOpenedMessage() {
+    if (!panelFrame || !panelFrame.contentWindow) {
+      return;
+    }
+
+    try {
+      panelFrame.contentWindow.postMessage(
+        { type: "assistant-embed:panel-opened" },
+        getPanelTargetOrigin(),
+      );
+    } catch {
+      // Ignore cross-window messaging failures.
+    }
+  }
+
+  function getPanelTargetOrigin() {
+    if (!panelFrame || !panelFrame.src) {
+      return "*";
+    }
+
+    try {
+      return new URL(panelFrame.src).origin;
+    } catch {
+      return "*";
+    }
+  }
+
+  function postPanelThemeMessage() {
+    if (!panelFrame || !panelFrame.contentWindow) {
+      return;
+    }
+
+    try {
+      panelFrame.contentWindow.postMessage(
+        {
+          type: "assistant-embed:set-theme",
+          theme: resolvedTheme,
+        },
+        getPanelTargetOrigin(),
+      );
+    } catch {
+      // Ignore cross-window messaging failures.
+    }
+  }
+
+  function applyResolvedTheme(shouldNotifyPanel) {
+    if (panelShell) {
+      panelShell.dataset.theme = resolvedTheme;
+    }
+
+    applyLauncherColors();
+
+    if (shouldNotifyPanel) {
+      postPanelThemeMessage();
+    }
+  }
+
+  function handleSystemThemeChange() {
+    if (themeMode !== "system") {
+      return;
+    }
+
+    var nextResolvedTheme = resolveThemeMode(themeMode);
+    if (nextResolvedTheme === resolvedTheme) {
+      return;
+    }
+
+    resolvedTheme = nextResolvedTheme;
+    applyResolvedTheme(true);
+  }
+
+  function setSystemThemeListener(shouldListen) {
+    if (!systemThemeMediaQuery) {
+      return;
+    }
+
+    if (shouldListen && !isListeningForSystemTheme) {
+      if (typeof systemThemeMediaQuery.addEventListener === "function") {
+        systemThemeMediaQuery.addEventListener("change", handleSystemThemeChange);
+      } else if (typeof systemThemeMediaQuery.addListener === "function") {
+        systemThemeMediaQuery.addListener(handleSystemThemeChange);
+      }
+      isListeningForSystemTheme = true;
+      return;
+    }
+
+    if (!shouldListen && isListeningForSystemTheme) {
+      if (typeof systemThemeMediaQuery.removeEventListener === "function") {
+        systemThemeMediaQuery.removeEventListener(
+          "change",
+          handleSystemThemeChange,
+        );
+      } else if (typeof systemThemeMediaQuery.removeListener === "function") {
+        systemThemeMediaQuery.removeListener(handleSystemThemeChange);
+      }
+      isListeningForSystemTheme = false;
+    }
+  }
+
+  function setTheme(nextMode) {
+    var normalizedMode = normalizeThemeMode(nextMode);
+    if (!normalizedMode) {
+      console.warn(
+        "[Assistant embed] Theme must be 'light', 'dark', or 'system'.",
+      );
+      return;
+    }
+
+    themeMode = normalizedMode;
+    setSystemThemeListener(themeMode === "system");
+    resolvedTheme = resolveThemeMode(themeMode);
+    applyResolvedTheme(true);
+  }
+
+  function notifyPanelOpened() {
+    if (typeof window.requestAnimationFrame === "function") {
+      window.requestAnimationFrame(function () {
+        window.requestAnimationFrame(postPanelOpenedMessage);
+      });
+      return;
+    }
+
+    window.setTimeout(postPanelOpenedMessage, 32);
+  }
+
+  function setOpen(nextOpen) {
+    var wasOpen = isOpen;
+    isOpen = nextOpen === true;
+    setPanelOpen(isOpen);
+    if (isOpen && !wasOpen) {
+      notifyPanelOpened();
+    }
+    if (launcherButton) {
+      launcherButton.dataset.open = String(isOpen);
+      launcherButton.setAttribute(
+        "aria-label",
+        isOpen ? "Close chat" : "Open chat",
+      );
+      launcherButton.setAttribute("title", isOpen ? "Close chat" : "Open chat");
+    }
+  }
+
+  function createFrame(className, title, src) {
+    var frame = document.createElement("iframe");
+    frame.className = "assistant-embed-frame " + className;
+    frame.title = title;
+    frame.src = src;
+    frame.allow = "clipboard-write";
+    frame.setAttribute("data-assistant-embed-frame", "true");
+    frame.addEventListener("load", function () {
+      postPanelThemeMessage();
+      if (isOpen) {
+        notifyPanelOpened();
+      }
+    });
+    return frame;
+  }
+
+  function createPanelShell(frame) {
+    var shell = document.createElement("div");
+    shell.className = "assistant-embed-panel-shell";
+    shell.dataset.state = "closed";
+    shell.dataset.theme = resolvedTheme;
+    shell.setAttribute("data-assistant-embed-panel", "true");
+    shell.appendChild(frame);
+    return shell;
+  }
+
+  function getLauncherMarkHtml() {
+    var iconUrl = buildIconUrl();
+    if (iconUrl) {
+      return (
+        '<img class="assistant-embed-launcher-icon assistant-embed-launcher-mark assistant-embed-launcher-custom-icon" src="' +
+        escapeHtmlAttribute(iconUrl) +
+        '" alt="" aria-hidden="true" />'
+      );
+    }
+
+    return "";
+  }
+
+  function createLauncherButton() {
+    var button = document.createElement("button");
+    button.type = "button";
+    button.className = "assistant-embed-launcher";
+    button.dataset.open = "false";
+    button.setAttribute("aria-label", "Open chat");
+    button.setAttribute("title", "Open chat");
+    button.setAttribute("data-assistant-embed-launcher", "true");
+    button.style.setProperty("--assistant-embed-theme", themeColor);
+    button.style.setProperty(
+      "--assistant-embed-icon-color",
+      iconColor,
+    );
+
+    button.innerHTML =
+      getLauncherMarkHtml() +
+      '<svg class="assistant-embed-launcher-icon assistant-embed-launcher-chevron" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m6 9 6 6 6-6"></path></svg>';
+
+    button.addEventListener("click", function () {
+      setOpen(!isOpen);
+    });
+
+    return button;
+  }
+
+  function mount() {
+    if (!document.body) {
+      document.addEventListener("DOMContentLoaded", mount, { once: true });
+      return;
+    }
+
+    ensureStyle();
+
+    panelFrame = createFrame(
+      "assistant-embed-panel-frame",
+      "Chat",
+      buildPanelUrl(),
+    );
+    panelShell = createPanelShell(panelFrame);
+    launcherButton = createLauncherButton();
+
+    document.body.appendChild(panelShell);
+    document.body.appendChild(launcherButton);
+  }
+
+  window.addEventListener("message", function (event) {
+    if (
+      !event.data ||
+      typeof event.data.type !== "string" ||
+      !event.data.type.startsWith("assistant-embed:")
+    ) {
+      return;
+    }
+
+    if (event.source !== (panelFrame && panelFrame.contentWindow)) {
+      return;
+    }
+
+    if (event.data.type === "assistant-embed:open") {
+      setOpen(true);
+      return;
+    }
+
+    if (event.data.type === "assistant-embed:close") {
+      setOpen(false);
+      return;
+    }
+
+    if (event.data.type === "assistant-embed:toggle") {
+      setOpen(!isOpen);
+    }
+  });
+
+  window.addEventListener("ask-ai:open", function () {
+    setOpen(true);
+  });
+
+  window.AssistantEmbed = {
+    installed: true,
+    open: function () {
+      setOpen(true);
+    },
+    close: function () {
+      setOpen(false);
+    },
+    toggle: function () {
+      setOpen(!isOpen);
+    },
+    setTheme: setTheme,
+    getTheme: function () {
+      return {
+        mode: themeMode,
+        resolvedTheme: resolvedTheme,
+      };
+    },
+    destroy: function () {
+      setSystemThemeListener(false);
+      if (launcherButton) {
+        launcherButton.remove();
+      }
+      if (panelShell) {
+        panelShell.remove();
+      }
+      var style = document.getElementById(styleId);
+      if (style) {
+        style.remove();
+      }
+      window.AssistantEmbed = undefined;
+    },
+  };
+
+  setSystemThemeListener(themeMode === "system");
+  mount();
+})();
+`;
+}