@antelopejs/dms-ai 0.1.4 → 0.1.5

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),
-	}
-}

package/frontend-vue/app/runtime/theme-bridge.ts

@@ -1,189 +0,0 @@
-// Theme bridge (host → chatbox iframe). The host DMS is the source of truth for
-// the active Nuxt UI primary palette and the light/dark mode; the chatbox iframe
-// is a separate document, so it cannot inherit them through CSS — we forward
-// them explicitly here. Both documents share the dashboard's origin, which is
-// the only one either side posts to or accepts messages from.
-//
-// Protocol:
-//   iframe → host : { type: "dms-ai:ready" }            (chatbox announces mount)
-//   host → iframe : { type: "dms-ai:theme", mode, primary }
-// See sidecar/chatbox/src/composables/useHostTheme.ts for the receiver.
-
-const THEME_MESSAGE_TYPE = 'dms-ai:theme'
-const READY_MESSAGE_TYPE = 'dms-ai:ready'
-
-const PRIMARY_STEPS = [
-	'50',
-	'100',
-	'200',
-	'300',
-	'400',
-	'500',
-	'600',
-	'700',
-	'800',
-	'900',
-	'950',
-] as const
-
-// Nuxt UI semantic surface/text/border tokens. The host DMS may override these
-// with bespoke values (e.g. the DMS dark canvas is #0a0b12, not the default
-// neutral-900), so the chatbox can't just rely on the default neutral palette —
-// it has to mirror the host's resolved values for a faithful match in both modes.
-const SEMANTIC_TOKENS = [
-	'--ui-bg',
-	'--ui-bg-muted',
-	'--ui-bg-elevated',
-	'--ui-bg-accented',
-	'--ui-bg-inverted',
-	'--ui-text-dimmed',
-	'--ui-text-muted',
-	'--ui-text-toned',
-	'--ui-text',
-	'--ui-text-highlighted',
-	'--ui-text-inverted',
-	'--ui-border',
-	'--ui-border-muted',
-	'--ui-border-accented',
-	'--ui-border-inverted',
-] as const
-
-export interface HostTheme {
-	mode: 'dark' | 'light'
-	primary: Record<string, string>
-	tokens: Record<string, string>
-}
-
-export function readHostMode(): 'dark' | 'light' {
-	return document.documentElement.classList.contains('dark') ? 'dark' : 'light'
-}
-
-interface ResolvedColors {
-	primary: Record<string, string>
-	tokens: Record<string, string>
-}
-
-// Resolve CSS custom properties to concrete color strings. They are authored as
-// `var(--color-…)` chains, so we read them through a throwaway probe whose
-// computed `color` forces full var() resolution (getComputedStyle on the custom
-// property itself may return the unresolved `var(...)` token in some browsers).
-// A variable the host does not define is skipped entirely: `color: var(--undef)`
-// falls back to the *inherited* color, so the probe would otherwise report a
-// bogus concrete value (e.g. black) instead of "missing" — leaving downstream
-// guards/fallbacks ineffective.
-function readResolvedColors(): ResolvedColors {
-	const rootStyle = getComputedStyle(document.documentElement)
-	const probe = document.createElement('span')
-	probe.style.cssText =
-		'position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;pointer-events:none;'
-	document.body.appendChild(probe)
-	const probeStyle = getComputedStyle(probe)
-	const resolve = (name: string): string => {
-		if (rootStyle.getPropertyValue(name).trim() === '') return ''
-		probe.style.color = `var(${name})`
-		return probeStyle.color
-	}
-	const primary: Record<string, string> = {}
-	for (const step of PRIMARY_STEPS) {
-		const value = resolve(`--ui-color-primary-${step}`)
-		if (value !== '') primary[step] = value
-	}
-	const tokens: Record<string, string> = {}
-	for (const name of SEMANTIC_TOKENS) {
-		const value = resolve(name)
-		if (value !== '') tokens[name] = value
-	}
-	probe.remove()
-	return { primary, tokens }
-}
-
-export function readHostTheme(): HostTheme {
-	const { primary, tokens } = readResolvedColors()
-	return { mode: readHostMode(), primary, tokens }
-}
-
-function themeSignature(theme: HostTheme): string {
-	const primary = PRIMARY_STEPS.map((s) => theme.primary[s]).join(',')
-	const tokens = SEMANTIC_TOKENS.map((t) => theme.tokens[t]).join(',')
-	return `${theme.mode}|${primary}|${tokens}`
-}
-
-interface MessageData {
-	type?: unknown
-}
-
-type ThemePush = (force: boolean) => void
-
-/** True for a message the chatbox frame itself posted, from our own origin. */
-export function isFromFrame(
-	event: MessageEvent,
-	iframe: HTMLIFrameElement,
-): boolean {
-	return (
-		event.source === iframe.contentWindow &&
-		event.origin === globalThis.location.origin
-	)
-}
-
-// Only answer the handshake from our own iframe, never an arbitrary frame.
-function answerReadyHandshake(
-	iframe: HTMLIFrameElement,
-	post: ThemePush,
-): void {
-	globalThis.addEventListener('message', (event: MessageEvent) => {
-		const type = (event.data as MessageData)?.type
-		if (type === READY_MESSAGE_TYPE && isFromFrame(event, iframe)) {
-			post(true)
-		}
-	})
-}
-
-// @nuxtjs/color-mode toggles `.dark` on <html>; mirror those changes live.
-function watchHostModeChanges(post: ThemePush): void {
-	const observer = new MutationObserver(() => post(false))
-	observer.observe(document.documentElement, {
-		attributes: true,
-		attributeFilter: ['class'],
-	})
-}
-
-// Wire the bridge to a chatbox iframe: reply to its `ready` handshake and
-// re-push the theme whenever the host flips light/dark. Primary/token swaps
-// alone are not mirrored live — they only reach the iframe on the forced
-// pushes (`ready` handshake and iframe `load`).
-// `onTheme` fires on every (re)push so the caller can keep host-side chrome
-// (the overlay backdrop / iframe color-scheme) in sync with live mode changes —
-// without it, an OS-driven dark switch leaves the panel edge on its old shade
-// until the page is reloaded.
-export function installThemeBridge(
-	iframe: HTMLIFrameElement,
-	onTheme?: (theme: HostTheme) => void,
-): void {
-	let lastMode: 'dark' | 'light' | '' = ''
-	let lastSignature = ''
-
-	const post: ThemePush = (force) => {
-		// The observer fires on any <html> class mutation (scroll locks, modal or
-		// route classes…). Gate the expensive probe resolution behind a cheap mode
-		// check: only a light/dark flip changes what this bridge mirrors live, and
-		// primary/token swaps are re-pushed on the `force` paths (ready/load).
-		const mode = readHostMode()
-		if (!force && mode === lastMode) return
-		lastMode = mode
-		const theme = readHostTheme()
-		const signature = themeSignature(theme)
-		if (!force && signature === lastSignature) return
-		lastSignature = signature
-		onTheme?.(theme)
-		iframe.contentWindow?.postMessage(
-			{ type: THEME_MESSAGE_TYPE, ...theme },
-			globalThis.location.origin,
-		)
-	}
-
-	answerReadyHandshake(iframe, post)
-	watchHostModeChanges(post)
-	// Belt and suspenders for the case where the iframe loaded before its
-	// message listener was ready and the `ready` handshake was missed.
-	iframe.addEventListener('load', () => post(true))
-}