@antelopejs/dms-ai 0.1.4 → 0.1.6

package/sidecar/package.json

@@ -9,12 +9,10 @@
   "main": "dist/index.js",
   "scripts": {
     "build": "rimraf dist && tsc",
-    "build:chatbox": "cd chatbox && pnpm install && pnpm build",
-    "build:all": "pnpm build && pnpm build:chatbox",
     "dev": "tsc -w",
-    "typecheck": "tsc --noEmit && tsc -p tsconfig.test.json && cd chatbox && pnpm typecheck",
-    "lint": "oxlint && oxfmt --check . && cd chatbox && pnpm lint",
-    "lint:fix": "oxlint --fix --max-warnings=1000000 && oxfmt . && cd chatbox && pnpm lint:fix",
+    "typecheck": "tsc --noEmit && tsc -p tsconfig.test.json",
+    "lint": "oxlint && oxfmt --check .",
+    "lint:fix": "oxlint --fix --max-warnings=1000000 && oxfmt .",
     "test": "vitest run --passWithNoTests",
     "generate:codex-types": "node scripts/generate-codex-types.mjs",
     "test:e2e": "echo 'no e2e yet' && exit 0",

package/dist/chatbox/passthrough.d.ts

@@ -1,3 +0,0 @@
-import { HTTPResult, type RequestContext } from "@antelopejs/interface-api";
-export type ChatboxLoader = (path: string) => Promise<Response>;
-export declare function relayChatboxFile(ctx: RequestContext, path: string, load?: ChatboxLoader): Promise<HTTPResult | undefined>;

package/dist/chatbox/passthrough.js

@@ -1,53 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.relayChatboxFile = relayChatboxFile;
-const node_stream_1 = require("node:stream");
-const promises_1 = require("node:stream/promises");
-const interface_api_1 = require("@antelopejs/interface-api");
-const chatbox_1 = require("../constants/chatbox");
-const sidecar_1 = require("../constants/sidecar");
-const sidecar_unavailable_error_1 = require("../lifecycle/sidecar-unavailable-error");
-const spawn_sidecar_1 = require("../lifecycle/spawn-sidecar");
-async function loadFromSidecar(path) {
-    await (0, spawn_sidecar_1.ensureSidecarRunning)();
-    const port = (0, spawn_sidecar_1.getSidecarPort)();
-    if (port === null)
-        throw new sidecar_unavailable_error_1.SidecarUnavailableError();
-    return fetch(`http://${sidecar_1.SIDECAR_LOOPBACK_HOST}:${port}${path}`);
-}
-async function tryLoad(load, path) {
-    try {
-        return await load(path);
-    }
-    catch {
-        return null;
-    }
-}
-function applyHeaders(ctx, upstream) {
-    for (const [name, value] of Object.entries(chatbox_1.CHATBOX_RESPONSE_HEADERS)) {
-        ctx.response.addHeader(name, value);
-    }
-    for (const name of chatbox_1.CHATBOX_RELAYED_HEADERS) {
-        const value = upstream.headers.get(name);
-        if (value !== null)
-            ctx.response.addHeader(name, value);
-    }
-}
-async function relayChatboxFile(ctx, path, load = loadFromSidecar) {
-    const upstream = await tryLoad(load, path);
-    if (upstream === null) {
-        return new interface_api_1.HTTPResult(sidecar_1.SIDECAR_UNAVAILABLE_STATUS, sidecar_1.SIDECAR_UNAVAILABLE_BODY);
-    }
-    applyHeaders(ctx, upstream);
-    const contentType = upstream.headers.get(chatbox_1.CHATBOX_CONTENT_TYPE_HEADER) ??
-        chatbox_1.CHATBOX_DEFAULT_CONTENT_TYPE;
-    const sink = ctx.response.getWriteStream(contentType, upstream.status);
-    if (upstream.body === null) {
-        sink.end();
-        return undefined;
-    }
-    const body = node_stream_1.Readable.fromWeb(upstream.body);
-    void (0, promises_1.pipeline)(body, sink).catch(() => sink.destroy());
-    return undefined;
-}
-//# sourceMappingURL=passthrough.js.map

package/dist/chatbox/passthrough.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"passthrough.js","sourceRoot":"","sources":["../../src/chatbox/passthrough.ts"],"names":[],"mappings":";;AAyDA,4CAqBC;AA9ED,6CAAuC;AACvC,mDAAgD;AAEhD,6DAA4E;AAC5E,kDAK8B;AAC9B,kDAI8B;AAC9B,sFAAiF;AACjF,8DAGoC;AAKpC,KAAK,UAAU,eAAe,CAAC,IAAY;IACzC,MAAM,IAAA,oCAAoB,GAAE,CAAC;IAC7B,MAAM,IAAI,GAAG,IAAA,8BAAc,GAAE,CAAC;IAC9B,IAAI,IAAI,KAAK,IAAI;QAAE,MAAM,IAAI,mDAAuB,EAAE,CAAC;IACvD,OAAO,KAAK,CAAC,UAAU,+BAAqB,IAAI,IAAI,GAAG,IAAI,EAAE,CAAC,CAAC;AACjE,CAAC;AAED,KAAK,UAAU,OAAO,CACpB,IAAmB,EACnB,IAAY;IAEZ,IAAI,CAAC;QACH,OAAO,MAAM,IAAI,CAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;IAAC,MAAM,CAAC;QACP,OAAO,IAAI,CAAC;IACd,CAAC;AACH,CAAC;AAED,SAAS,YAAY,CAAC,GAAmB,EAAE,QAAkB;IAC3D,KAAK,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,kCAAwB,CAAC,EAAE,CAAC;QACrE,GAAG,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IACtC,CAAC;IACD,KAAK,MAAM,IAAI,IAAI,iCAAuB,EAAE,CAAC;QAC3C,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACzC,IAAI,KAAK,KAAK,IAAI;YAAE,GAAG,CAAC,QAAQ,CAAC,SAAS,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IAC1D,CAAC;AACH,CAAC;AAOM,KAAK,UAAU,gBAAgB,CACpC,GAAmB,EACnB,IAAY,EACZ,OAAsB,eAAe;IAErC,MAAM,QAAQ,GAAG,MAAM,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;IAC3C,IAAI,QAAQ,KAAK,IAAI,EAAE,CAAC;QACtB,OAAO,IAAI,0BAAU,CAAC,oCAA0B,EAAE,kCAAwB,CAAC,CAAC;IAC9E,CAAC;IACD,YAAY,CAAC,GAAG,EAAE,QAAQ,CAAC,CAAC;IAC5B,MAAM,WAAW,GACf,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,qCAA2B,CAAC;QACjD,sCAA4B,CAAC;IAC/B,MAAM,IAAI,GAAG,GAAG,CAAC,QAAQ,CAAC,cAAc,CAAC,WAAW,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACvE,IAAI,QAAQ,CAAC,IAAI,KAAK,IAAI,EAAE,CAAC;QAC3B,IAAI,CAAC,GAAG,EAAE,CAAC;QACX,OAAO,SAAS,CAAC;IACnB,CAAC;IACD,MAAM,IAAI,GAAG,sBAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAqC,CAAC,CAAC;IAC9E,KAAK,IAAA,mBAAQ,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,CAAC;IACtD,OAAO,SAAS,CAAC;AACnB,CAAC"}

package/dist/constants/chatbox.d.ts

@@ -1,10 +0,0 @@
-export declare const CHATBOX_ROUTE_PREFIX = "/api/ai/chatbox";
-export declare const CHATBOX_INDEX_ROUTE = "/";
-export declare const CHATBOX_ASSET_ROUTE = "::path";
-export declare const CHATBOX_PATH_PARAM = "path";
-export declare const CHATBOX_INDEX_PATH = "/";
-export declare const CHATBOX_DEFAULT_CONTENT_TYPE = "application/octet-stream";
-export declare const CHATBOX_CONTENT_TYPE_HEADER = "content-type";
-export declare const CHATBOX_RELAYED_HEADERS: readonly ["content-length"];
-export declare const CHATBOX_CONTENT_SECURITY_POLICY: string;
-export declare const CHATBOX_RESPONSE_HEADERS: Readonly<Record<string, string>>;

package/dist/constants/chatbox.js

@@ -1,35 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.CHATBOX_RESPONSE_HEADERS = exports.CHATBOX_CONTENT_SECURITY_POLICY = exports.CHATBOX_RELAYED_HEADERS = exports.CHATBOX_CONTENT_TYPE_HEADER = exports.CHATBOX_DEFAULT_CONTENT_TYPE = exports.CHATBOX_INDEX_PATH = exports.CHATBOX_PATH_PARAM = exports.CHATBOX_ASSET_ROUTE = exports.CHATBOX_INDEX_ROUTE = exports.CHATBOX_ROUTE_PREFIX = void 0;
-exports.CHATBOX_ROUTE_PREFIX = "/api/ai/chatbox";
-exports.CHATBOX_INDEX_ROUTE = "/";
-exports.CHATBOX_ASSET_ROUTE = "::path";
-exports.CHATBOX_PATH_PARAM = "path";
-exports.CHATBOX_INDEX_PATH = "/";
-exports.CHATBOX_DEFAULT_CONTENT_TYPE = "application/octet-stream";
-exports.CHATBOX_CONTENT_TYPE_HEADER = "content-type";
-exports.CHATBOX_RELAYED_HEADERS = ["content-length"];
-const ICONIFY_API_ORIGINS = [
-    "https://api.iconify.design",
-    "https://api.simplesvg.com",
-    "https://api.unisvg.com",
-];
-exports.CHATBOX_CONTENT_SECURITY_POLICY = [
-    "default-src 'self'",
-    "script-src 'self'",
-    "style-src 'self' 'unsafe-inline'",
-    "img-src 'self' data: blob:",
-    "font-src 'self' data:",
-    `connect-src 'self' ${ICONIFY_API_ORIGINS.join(" ")}`,
-    "frame-ancestors 'self'",
-    "base-uri 'self'",
-    "form-action 'none'",
-    "object-src 'none'",
-].join("; ");
-exports.CHATBOX_RESPONSE_HEADERS = {
-    "Content-Security-Policy": exports.CHATBOX_CONTENT_SECURITY_POLICY,
-    "X-Content-Type-Options": "nosniff",
-    "Referrer-Policy": "same-origin",
-    "Cache-Control": "no-cache",
-};
-//# sourceMappingURL=chatbox.js.map

package/dist/constants/chatbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"chatbox.js","sourceRoot":"","sources":["../../src/constants/chatbox.ts"],"names":[],"mappings":";;;AAIa,QAAA,oBAAoB,GAAG,iBAAiB,CAAC;AACzC,QAAA,mBAAmB,GAAG,GAAG,CAAC;AAC1B,QAAA,mBAAmB,GAAG,QAAQ,CAAC;AAC/B,QAAA,kBAAkB,GAAG,MAAM,CAAC;AAC5B,QAAA,kBAAkB,GAAG,GAAG,CAAC;AACzB,QAAA,4BAA4B,GAAG,0BAA0B,CAAC;AAC1D,QAAA,2BAA2B,GAAG,cAAc,CAAC;AAG7C,QAAA,uBAAuB,GAAG,CAAC,gBAAgB,CAAU,CAAC;AAEnE,MAAM,mBAAmB,GAAG;IAC1B,4BAA4B;IAC5B,2BAA2B;IAC3B,wBAAwB;CACzB,CAAC;AAUW,QAAA,+BAA+B,GAAG;IAC7C,oBAAoB;IACpB,mBAAmB;IACnB,kCAAkC;IAClC,4BAA4B;IAC5B,uBAAuB;IACvB,sBAAsB,mBAAmB,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE;IACrD,wBAAwB;IACxB,iBAAiB;IACjB,oBAAoB;IACpB,mBAAmB;CACpB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;AAEA,QAAA,wBAAwB,GAAqC;IACxE,yBAAyB,EAAE,uCAA+B;IAC1D,wBAAwB,EAAE,SAAS;IACnC,iBAAiB,EAAE,aAAa;IAChC,eAAe,EAAE,UAAU;CAC5B,CAAC"}

package/dist/routes/chatbox.d.ts

@@ -1,7 +0,0 @@
-import { type HTTPResult, type RequestContext } from "@antelopejs/interface-api";
-declare const AIChatboxController_base: import("@antelopejs/interface-api").ControllerClass<object>;
-export declare class AIChatboxController extends AIChatboxController_base {
-    document(ctx: RequestContext): Promise<HTTPResult | undefined>;
-    asset(ctx: RequestContext, path: string): Promise<HTTPResult | undefined>;
-}
-export {};

package/dist/routes/chatbox.js

@@ -1,47 +0,0 @@
-"use strict";
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-var __param = (this && this.__param) || function (paramIndex, decorator) {
-    return function (target, key) { decorator(target, key, paramIndex); }
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.AIChatboxController = void 0;
-const interface_api_1 = require("@antelopejs/interface-api");
-const auth_1 = require("@antelopejs/interface-dms/auth");
-const passthrough_1 = require("../chatbox/passthrough");
-const chatbox_1 = require("../constants/chatbox");
-let AIChatboxController = class AIChatboxController extends (0, interface_api_1.Controller)(chatbox_1.CHATBOX_ROUTE_PREFIX) {
-    document(ctx) {
-        return (0, passthrough_1.relayChatboxFile)(ctx, chatbox_1.CHATBOX_INDEX_PATH);
-    }
-    asset(ctx, path) {
-        return (0, passthrough_1.relayChatboxFile)(ctx, `/${path}`);
-    }
-};
-exports.AIChatboxController = AIChatboxController;
-__decorate([
-    (0, interface_api_1.Get)(chatbox_1.CHATBOX_INDEX_ROUTE),
-    __param(0, (0, interface_api_1.Context)()),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object]),
-    __metadata("design:returntype", Promise)
-], AIChatboxController.prototype, "document", null);
-__decorate([
-    (0, interface_api_1.Get)(chatbox_1.CHATBOX_ASSET_ROUTE),
-    __param(0, (0, interface_api_1.Context)()),
-    __param(1, (0, interface_api_1.Parameter)(chatbox_1.CHATBOX_PATH_PARAM, "param")),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [Object, String]),
-    __metadata("design:returntype", Promise)
-], AIChatboxController.prototype, "asset", null);
-exports.AIChatboxController = AIChatboxController = __decorate([
-    (0, auth_1.AuthOwnerOnly)()
-], AIChatboxController);
-//# sourceMappingURL=chatbox.js.map

package/dist/routes/chatbox.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"chatbox.js","sourceRoot":"","sources":["../../src/routes/chatbox.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;AAAA,6DAOmC;AACnC,yDAA+D;AAC/D,wDAA0D;AAC1D,kDAM8B;AAOvB,IAAM,mBAAmB,GAAzB,MAAM,mBAAoB,SAAQ,IAAA,0BAAU,EAAC,8BAAoB,CAAC;IAEvE,QAAQ,CAAY,GAAmB;QACrC,OAAO,IAAA,8BAAgB,EAAC,GAAG,EAAE,4BAAkB,CAAC,CAAC;IACnD,CAAC;IAGD,KAAK,CACQ,GAAmB,EACU,IAAY;QAEpD,OAAO,IAAA,8BAAgB,EAAC,GAAG,EAAE,IAAI,IAAI,EAAE,CAAC,CAAC;IAC3C,CAAC;CACF,CAAA;AAbY,kDAAmB;AAE9B;IADC,IAAA,mBAAG,EAAC,6BAAmB,CAAC;IACf,WAAA,IAAA,uBAAO,GAAE,CAAA;;;;mDAElB;AAGD;IADC,IAAA,mBAAG,EAAC,6BAAmB,CAAC;IAEtB,WAAA,IAAA,uBAAO,GAAE,CAAA;IACT,WAAA,IAAA,yBAAS,EAAC,4BAAkB,EAAE,OAAO,CAAC,CAAA;;;;gDAGxC;8BAZU,mBAAmB;IAD/B,IAAA,oBAAa,GAAE;GACH,mBAAmB,CAa/B"}

package/frontend-vue/app/runtime/overlay.ts

@@ -1,400 +0,0 @@
-import {
-	OVERLAY_BOX_SHADOW,
-	OVERLAY_DEFAULT_WIDTH_PX,
-	OVERLAY_DOM_ID,
-	OVERLAY_IFRAME_ID,
-	OVERLAY_MIN_WIDTH_PX,
-	OVERLAY_OPEN_CHANGE_EVENT,
-	OVERLAY_OUTSIDE_TOGGLE_SUPPRESS_MS,
-	OVERLAY_PLACEHOLDER_ID,
-	OVERLAY_RESIZE_HANDLE_SIZE_PX,
-	OVERLAY_Z_INDEX,
-	PLACEHOLDER_CONNECTING_TEXT,
-	PLACEHOLDER_REVIVING_TEXT,
-	PLACEHOLDER_UNAVAILABLE_TEXT,
-	PLACEHOLDER_UNAVAILABLE_TITLE,
-} from './constants'
-import {
-	type OverlayPrefs,
-	readPrefs,
-	writePrefsDebounced,
-} from './overlay-prefs'
-import {
-	type HostTheme,
-	installThemeBridge,
-	isFromFrame,
-	readHostMode,
-} from './theme-bridge'
-
-// What the host-origin placeholder shows while the sidecar frame can't be shown.
-// `connecting`/`reviving` are transient (spinner); `unavailable` is terminal.
-export type PlaceholderKind = 'connecting' | 'reviving' | 'unavailable'
-
-export interface OverlayHandle {
-	// Toggle the docked panel's slide-in open/closed state.
-	toggleOpen: () => void
-	// Launcher-specific toggle: ignores an open request that immediately follows
-	// an outside-click close, since the launcher's `click` fires after the same
-	// `pointerdown` that already closed the panel. The keyboard shortcut must
-	// use `toggleOpen` so it is never suppressed.
-	toggleFromLauncher: () => void
-	isOpen: () => boolean
-	/** Called on every open or close, however the panel was toggled. */
-	onOpenChange: (listener: (isOpen: boolean) => void) => () => void
-	// Point the frame at the chat document. A no-op when the URL is
-	// unchanged and already loaded, so a redundant `connected` notify won't reload
-	// the chatbox; otherwise it reloads and shows a connecting placeholder until
-	// the frame paints.
-	repoint: (url: string) => void
-	// Cover the frame with the host-origin status panel (never the browser's raw
-	// error page) while the sidecar is unreachable.
-	showPlaceholder: (kind: PlaceholderKind) => void
-}
-
-interface OverlayElements {
-	container: HTMLDivElement
-	iframe: HTMLIFrameElement
-	resizeHandle: HTMLDivElement
-	placeholder: HTMLDivElement
-}
-
-interface OverlayPrefsRef {
-	value: OverlayPrefs
-}
-
-interface MessageData {
-	type?: unknown
-}
-
-const MAX_WIDTH_VW_RATIO = 0.94
-// Message types accepted from the chatbox iframe to close the panel.
-const CLOSE_MESSAGE_TYPES = new Set(['dms-ai:close'])
-
-// Fallback backdrop shown behind the iframe while it slides in, before the
-// bridge reports the host's real `--ui-bg`. Only briefly visible.
-const BACKDROP_DARK = '#0a0b12'
-const BACKDROP_LIGHT = '#ffffff'
-
-function backdropFor(mode: 'dark' | 'light'): string {
-	return mode === 'dark' ? BACKDROP_DARK : BACKDROP_LIGHT
-}
-
-function maxWidth(): number {
-	const vw = globalThis.innerWidth ?? OVERLAY_DEFAULT_WIDTH_PX * 3
-	return Math.max(OVERLAY_MIN_WIDTH_PX, Math.round(vw * MAX_WIDTH_VW_RATIO))
-}
-
-function clampWidth(width: number): number {
-	return Math.min(Math.max(width, OVERLAY_MIN_WIDTH_PX), maxWidth())
-}
-
-function buildContainer(): HTMLDivElement {
-	const container = document.createElement('div')
-	container.id = OVERLAY_DOM_ID
-	const style = container.style
-	style.position = 'fixed'
-	style.top = '0'
-	style.right = '0'
-	style.height = '100vh'
-	style.zIndex = String(OVERLAY_Z_INDEX)
-	style.boxShadow = OVERLAY_BOX_SHADOW
-	// Backdrop behind the iframe while it slides in — follow the host mode so a
-	// light-mode host doesn't flash a dark sheet. The iframe fills the container
-	// once painted, so this is only ever briefly visible.
-	style.background = backdropFor(readHostMode())
-	style.borderLeft = '1px solid rgba(140,160,220,0.20)'
-	style.overflow = 'hidden'
-	style.display = 'flex'
-	style.transition = 'transform 220ms cubic-bezier(0.16, 1, 0.3, 1)'
-	style.willChange = 'transform'
-	return container
-}
-
-// Built with no `src`: the frame is only pointed at the chat via `repoint` once
-// the status controller confirms the sidecar runs, so it never renders the
-// error page of a sidecar that is down.
-function buildIframe(): HTMLIFrameElement {
-	const iframe = document.createElement('iframe')
-	iframe.id = OVERLAY_IFRAME_ID
-	iframe.style.flex = '1 1 auto'
-	iframe.style.width = '100%'
-	iframe.style.height = '100%'
-	iframe.style.border = '0'
-	iframe.style.colorScheme = readHostMode()
-	return iframe
-}
-
-const SPINNER_STYLE_ID = 'dms-ai-overlay-spinner-style'
-
-function ensureSpinnerKeyframes(): void {
-	if (document.getElementById(SPINNER_STYLE_ID) !== null) return
-	const style = document.createElement('style')
-	style.id = SPINNER_STYLE_ID
-	style.textContent =
-		'@keyframes dms-ai-spin{to{transform:rotate(360deg)}}'
-	document.head.appendChild(style)
-}
-
-function buildPlaceholder(): HTMLDivElement {
-	const placeholder = document.createElement('div')
-	placeholder.id = OVERLAY_PLACEHOLDER_ID
-	const style = placeholder.style
-	style.position = 'absolute'
-	style.inset = '0'
-	// Above the iframe, but transparent to pointers so the resize handle and the
-	// (harmless) dead frame beneath stay reachable.
-	style.zIndex = '2'
-	style.pointerEvents = 'none'
-	style.display = 'none'
-	style.flexDirection = 'column'
-	style.alignItems = 'center'
-	style.justifyContent = 'center'
-	style.gap = '14px'
-	style.padding = '24px'
-	style.textAlign = 'center'
-	style.font =
-		'500 13px/1.5 system-ui, -apple-system, Segoe UI, Roboto, sans-serif'
-	style.background = backdropFor(readHostMode())
-	return placeholder
-}
-
-function spinnerHtml(color: string): string {
-	return `<span style="width:22px;height:22px;border:2.5px solid ${color}33;border-top-color:${color};border-radius:50%;animation:dms-ai-spin 0.7s linear infinite;"></span>`
-}
-
-function placeholderContent(kind: PlaceholderKind): string {
-	if (kind === 'unavailable') {
-		return `<div style="font-size:15px;font-weight:600;">${PLACEHOLDER_UNAVAILABLE_TITLE}</div><div style="opacity:0.7;">${PLACEHOLDER_UNAVAILABLE_TEXT}</div>`
-	}
-	const text =
-		kind === 'reviving'
-			? PLACEHOLDER_REVIVING_TEXT
-			: PLACEHOLDER_CONNECTING_TEXT
-	return `${spinnerHtml('currentColor')}<div style="opacity:0.75;">${text}</div>`
-}
-
-function buildResizeHandle(): HTMLDivElement {
-	const handle = document.createElement('div')
-	const style = handle.style
-	style.position = 'absolute'
-	style.left = '0'
-	style.top = '0'
-	style.width = `${OVERLAY_RESIZE_HANDLE_SIZE_PX}px`
-	style.height = '100%'
-	style.cursor = 'ew-resize'
-	style.touchAction = 'none'
-	style.zIndex = '1'
-	return handle
-}
-
-function applyPrefs(elements: OverlayElements, prefs: OverlayPrefs): void {
-	const width = clampWidth(prefs.width)
-	elements.container.style.width = `${width}px`
-	elements.container.style.transform = prefs.isOpen
-		? 'translateX(0)'
-		: 'translateX(100%)'
-}
-
-function resolveInitialPrefs(): OverlayPrefs {
-	const stored = readPrefs()
-	if (stored !== null)
-		return { width: clampWidth(stored.width), isOpen: stored.isOpen }
-	return { width: OVERLAY_DEFAULT_WIDTH_PX, isOpen: false }
-}
-
-interface InteractionContext {
-	elements: OverlayElements
-	stateRef: OverlayPrefsRef
-}
-
-function installWidthResize(ctx: InteractionContext): void {
-	const { resizeHandle, container, iframe } = ctx.elements
-	let startX = 0
-	let startWidth = 0
-
-	const onMove = (event: PointerEvent): void => {
-		// Panel is pinned right, so dragging left (smaller clientX) grows it.
-		const next = clampWidth(startWidth + (startX - event.clientX))
-		ctx.stateRef.value = { ...ctx.stateRef.value, width: next }
-		container.style.width = `${next}px`
-	}
-
-	const onUp = (): void => {
-		globalThis.removeEventListener('pointermove', onMove)
-		globalThis.removeEventListener('pointerup', onUp)
-		// Restore the iframe's pointer capture now the drag is over.
-		iframe.style.pointerEvents = ''
-		writePrefsDebounced(ctx.stateRef.value)
-	}
-
-	resizeHandle.addEventListener('pointerdown', (event: PointerEvent) => {
-		event.preventDefault()
-		startX = event.clientX
-		startWidth = ctx.stateRef.value.width
-		// While dragging, dragging over the iframe would let it swallow the
-		// pointer stream, so the parent never sees pointermove/up and the drag
-		// sticks. Make the iframe transparent to pointers for the drag's duration.
-		iframe.style.pointerEvents = 'none'
-		globalThis.addEventListener('pointermove', onMove)
-		globalThis.addEventListener('pointerup', onUp)
-	})
-}
-
-// Close the panel when the user clicks anywhere in the host page outside it.
-// Clicks inside the iframe never reach the host document, so they can't close
-// the panel. Returns a predicate telling whether an outside click just closed
-// the panel: the header launcher toggles on `click`, which follows the same
-// `pointerdown` that closed the panel — without this guard, clicking the
-// launcher while open would close then immediately re-open it.
-function installOutsideClickClose(ctx: InteractionContext): () => boolean {
-	let lastCloseAt = Number.NEGATIVE_INFINITY
-	document.addEventListener(
-		'pointerdown',
-		(event: PointerEvent) => {
-			if (!ctx.stateRef.value.isOpen) return
-			if (event.composedPath().includes(ctx.elements.container)) return
-			lastCloseAt = event.timeStamp
-			setOpen(ctx.elements, ctx.stateRef, false)
-		},
-		{ capture: true },
-	)
-	return (): boolean =>
-		performance.now() - lastCloseAt < OVERLAY_OUTSIDE_TOGGLE_SUPPRESS_MS
-}
-
-function appendElements(elements: OverlayElements): void {
-	elements.container.appendChild(elements.iframe)
-	elements.container.appendChild(elements.placeholder)
-	elements.container.appendChild(elements.resizeHandle)
-	document.body.appendChild(elements.container)
-}
-
-interface PlaceholderController {
-	show: (kind: PlaceholderKind) => void
-	hide: () => void
-	recolor: (theme: HostTheme) => void
-}
-
-function createPlaceholderController(
-	placeholder: HTMLDivElement,
-): PlaceholderController {
-	return {
-		show: (kind) => {
-			placeholder.innerHTML = placeholderContent(kind)
-			placeholder.style.display = 'flex'
-		},
-		hide: () => {
-			placeholder.style.display = 'none'
-		},
-		recolor: (theme) => {
-			placeholder.style.background =
-				theme.tokens['--ui-bg'] || backdropFor(theme.mode)
-			placeholder.style.color = theme.tokens['--ui-text'] || ''
-		},
-	}
-}
-
-// Repoint the frame at `url`, deferring the placeholder-hide until it paints so a
-// reload of the chatbox never flashes the previous frame. A no-op reload when
-// the URL is already loaded.
-function createRepointer(
-	iframe: HTMLIFrameElement,
-	placeholder: PlaceholderController,
-): (url: string) => void {
-	let currentUrl = ''
-	let loaded = false
-	iframe.addEventListener('load', () => {
-		if (iframe.src === '') return
-		loaded = true
-		placeholder.hide()
-	})
-	return (url: string): void => {
-		if (url === currentUrl && loaded) {
-			placeholder.hide()
-			return
-		}
-		currentUrl = url
-		loaded = false
-		placeholder.show('connecting')
-		iframe.src = url
-	}
-}
-
-function setOpen(
-	elements: OverlayElements,
-	stateRef: OverlayPrefsRef,
-	isOpen: boolean,
-): void {
-	const hasChanged = stateRef.value.isOpen !== isOpen
-	stateRef.value = { ...stateRef.value, isOpen }
-	applyPrefs(elements, stateRef.value)
-	writePrefsDebounced(stateRef.value)
-	if (!hasChanged) return
-	elements.container.dispatchEvent(
-		new CustomEvent(OVERLAY_OPEN_CHANGE_EVENT, { detail: isOpen }),
-	)
-}
-
-export function injectOverlay(): OverlayHandle | null {
-	const isAlreadyInjected = document.getElementById(OVERLAY_DOM_ID) !== null
-	if (isAlreadyInjected) return null
-	ensureSpinnerKeyframes()
-	const elements: OverlayElements = {
-		container: buildContainer(),
-		iframe: buildIframe(),
-		resizeHandle: buildResizeHandle(),
-		placeholder: buildPlaceholder(),
-	}
-	appendElements(elements)
-	const placeholder = createPlaceholderController(elements.placeholder)
-	const repoint = createRepointer(elements.iframe, placeholder)
-	const stateRef = { value: resolveInitialPrefs() }
-	applyPrefs(elements, stateRef.value)
-	installWidthResize({ elements, stateRef })
-	const wasJustClosedByOutsideClick = installOutsideClickClose({
-		elements,
-		stateRef,
-	})
-	// Mirror the host's primary palette + light/dark mode into the iframe, and
-	// keep the panel backdrop / iframe color-scheme (and the status placeholder)
-	// following live mode changes (e.g. an OS-driven dark switch) so no light edge
-	// lingers until a reload.
-	installThemeBridge(elements.iframe, (theme) => {
-		elements.container.style.background =
-			theme.tokens['--ui-bg'] || backdropFor(theme.mode)
-		elements.iframe.style.colorScheme = theme.mode
-		placeholder.recolor(theme)
-	})
-
-	// The chatbox header's close button lives inside the iframe; it asks the
-	// host to slide the panel away via postMessage.
-	globalThis.addEventListener('message', (event: MessageEvent) => {
-		if (!isFromFrame(event, elements.iframe)) return
-		const type = (event.data as MessageData)?.type
-		if (typeof type === 'string' && CLOSE_MESSAGE_TYPES.has(type)) {
-			setOpen(elements, stateRef, false)
-		}
-	})
-
-	const toggle = (): void =>
-		setOpen(elements, stateRef, !stateRef.value.isOpen)
-
-	return {
-		toggleOpen: toggle,
-		toggleFromLauncher: (): void => {
-			const wouldOpen = !stateRef.value.isOpen
-			if (wouldOpen && wasJustClosedByOutsideClick()) return
-			toggle()
-		},
-		isOpen: (): boolean => stateRef.value.isOpen,
-		onOpenChange: (listener) => {
-			const onChange = (event: Event): void =>
-				listener((event as CustomEvent<boolean>).detail)
-			elements.container.addEventListener(OVERLAY_OPEN_CHANGE_EVENT, onChange)
-			return () =>
-				elements.container.removeEventListener(OVERLAY_OPEN_CHANGE_EVENT, onChange)
-		},
-		repoint,
-		showPlaceholder: (kind) => placeholder.show(kind),
-	}
-}