@coffer-org/plugin-webchat 7.0.1 → 7.1.0

package/dist/ChatWidget-BhGpxS9f.js

@@ -0,0 +1,2179 @@
+import * as __fedReact from "react";
+import { Dialog, DialogContent, Icon, MarkdownView, toneVar, uploadFile, useMinWidth } from "@coffer-org/web-ui";
+import { createContext, createElement, forwardRef, memo, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
+import { useLocation } from "react-router-dom";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region \0rolldown/runtime.js
+var __commonJSMin = (cb, mod) => () => (mod || (cb((mod = { exports: {} }).exports, mod), cb = null), mod.exports);
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, { get: (a, b) => (typeof require !== "undefined" ? require : a)[b] }) : x)(function(x) {
+	if (typeof require !== "undefined") return require.apply(this, arguments);
+	throw Error("Calling `require` for \"" + x + "\" in an environment that doesn't expose the `require` function. See https://rolldown.rs/in-depth/bundling-cjs#require-external-modules for more details.");
+});
+//#endregion
+//#region ../../node_modules/react-i18next/dist/es/utils.js
+var warn = (i18n, code, msg, rest) => {
+	const args = [msg, {
+		code,
+		...rest || {}
+	}];
+	if (i18n?.services?.logger?.forward) return i18n.services.logger.forward(args, "warn", "react-i18next::", true);
+	if (isString(args[0])) args[0] = `react-i18next:: ${args[0]}`;
+	if (i18n?.services?.logger?.warn) i18n.services.logger.warn(...args);
+	else if (console?.warn) console.warn(...args);
+};
+var alreadyWarned = {};
+var warnOnce = (i18n, code, msg, rest) => {
+	if (isString(msg) && alreadyWarned[msg]) return;
+	if (isString(msg)) alreadyWarned[msg] = /* @__PURE__ */ new Date();
+	warn(i18n, code, msg, rest);
+};
+var loadedClb = (i18n, cb) => () => {
+	if (i18n.isInitialized) cb();
+	else {
+		const initialized = () => {
+			setTimeout(() => {
+				i18n.off("initialized", initialized);
+			}, 0);
+			cb();
+		};
+		i18n.on("initialized", initialized);
+	}
+};
+var loadNamespaces = (i18n, ns, cb) => {
+	i18n.loadNamespaces(ns, loadedClb(i18n, cb));
+};
+var loadLanguages = (i18n, lng, ns, cb) => {
+	if (isString(ns)) ns = [ns];
+	if (i18n.options.preload && i18n.options.preload.indexOf(lng) > -1) return loadNamespaces(i18n, ns, cb);
+	ns.forEach((n) => {
+		if (i18n.options.ns.indexOf(n) < 0) i18n.options.ns.push(n);
+	});
+	i18n.loadLanguages(lng, loadedClb(i18n, cb));
+};
+var hasLoadedNamespace = (ns, i18n, options = {}) => {
+	if (!i18n.languages || !i18n.languages.length) {
+		warnOnce(i18n, "NO_LANGUAGES", "i18n.languages were undefined or empty", { languages: i18n.languages });
+		return true;
+	}
+	return i18n.hasLoadedNamespace(ns, {
+		lng: options.lng,
+		precheck: (i18nInstance, loadNotPending) => {
+			if (options.bindI18n && options.bindI18n.indexOf("languageChanging") > -1 && i18nInstance.services.backendConnector.backend && i18nInstance.isLanguageChangingTo && !loadNotPending(i18nInstance.isLanguageChangingTo, ns)) return false;
+		}
+	});
+};
+var isString = (obj) => typeof obj === "string";
+var isObject = (obj) => typeof obj === "object" && obj !== null;
+//#endregion
+//#region ../../node_modules/react-i18next/dist/es/unescape.js
+var matchHtmlEntity = /&(?:amp|#38|lt|#60|gt|#62|apos|#39|quot|#34|nbsp|#160|copy|#169|reg|#174|hellip|#8230|#x2F|#47);/g;
+var htmlEntities = {
+	"&amp;": "&",
+	"&#38;": "&",
+	"&lt;": "<",
+	"&#60;": "<",
+	"&gt;": ">",
+	"&#62;": ">",
+	"&apos;": "'",
+	"&#39;": "'",
+	"&quot;": "\"",
+	"&#34;": "\"",
+	"&nbsp;": " ",
+	"&#160;": " ",
+	"&copy;": "©",
+	"&#169;": "©",
+	"&reg;": "®",
+	"&#174;": "®",
+	"&hellip;": "…",
+	"&#8230;": "…",
+	"&#x2F;": "/",
+	"&#47;": "/"
+};
+var unescapeHtmlEntity = (m) => htmlEntities[m];
+var unescape = (text) => text.replace(matchHtmlEntity, unescapeHtmlEntity);
+//#endregion
+//#region ../../node_modules/react-i18next/dist/es/defaults.js
+var defaultOptions = {
+	bindI18n: "languageChanged",
+	bindI18nStore: "",
+	transEmptyNodeValue: "",
+	transSupportBasicHtmlNodes: true,
+	transWrapTextNodes: "",
+	transKeepBasicHtmlNodesFor: [
+		"br",
+		"strong",
+		"i",
+		"p"
+	],
+	useSuspense: true,
+	unescape,
+	transDefaultProps: void 0
+};
+var getDefaults = () => defaultOptions;
+//#endregion
+//#region ../../node_modules/react-i18next/dist/es/i18nInstance.js
+var i18nInstance;
+var getI18n = () => i18nInstance;
+//#endregion
+//#region ../../node_modules/react-i18next/dist/es/context.js
+var I18nContext = createContext();
+var ReportNamespaces = class {
+	constructor() {
+		this.usedNamespaces = {};
+	}
+	addUsedNamespaces(namespaces) {
+		namespaces.forEach((ns) => {
+			if (!this.usedNamespaces[ns]) this.usedNamespaces[ns] = true;
+		});
+	}
+	getUsedNamespaces() {
+		return Object.keys(this.usedNamespaces);
+	}
+};
+//#endregion
+//#region ../../node_modules/use-sync-external-store/cjs/use-sync-external-store-shim.production.js
+/**
+* @license React
+* use-sync-external-store-shim.production.js
+*
+* Copyright (c) Meta Platforms, Inc. and affiliates.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+var require_use_sync_external_store_shim_production = /* @__PURE__ */ __commonJSMin(((exports) => {
+	var React = __fedReact;
+	function is(x, y) {
+		return x === y && (0 !== x || 1 / x === 1 / y) || x !== x && y !== y;
+	}
+	var objectIs = "function" === typeof Object.is ? Object.is : is;
+	var useState = React.useState;
+	var useEffect = React.useEffect;
+	var useLayoutEffect = React.useLayoutEffect;
+	var useDebugValue = React.useDebugValue;
+	function useSyncExternalStore$2(subscribe, getSnapshot) {
+		var value = getSnapshot(), _useState = useState({ inst: {
+			value,
+			getSnapshot
+		} }), inst = _useState[0].inst, forceUpdate = _useState[1];
+		useLayoutEffect(function() {
+			inst.value = value;
+			inst.getSnapshot = getSnapshot;
+			checkIfSnapshotChanged(inst) && forceUpdate({ inst });
+		}, [
+			subscribe,
+			value,
+			getSnapshot
+		]);
+		useEffect(function() {
+			checkIfSnapshotChanged(inst) && forceUpdate({ inst });
+			return subscribe(function() {
+				checkIfSnapshotChanged(inst) && forceUpdate({ inst });
+			});
+		}, [subscribe]);
+		useDebugValue(value);
+		return value;
+	}
+	function checkIfSnapshotChanged(inst) {
+		var latestGetSnapshot = inst.getSnapshot;
+		inst = inst.value;
+		try {
+			var nextValue = latestGetSnapshot();
+			return !objectIs(inst, nextValue);
+		} catch (error) {
+			return !0;
+		}
+	}
+	function useSyncExternalStore$1(subscribe, getSnapshot) {
+		return getSnapshot();
+	}
+	var shim = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? useSyncExternalStore$1 : useSyncExternalStore$2;
+	exports.useSyncExternalStore = void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
+}));
+//#endregion
+//#region ../../node_modules/react-i18next/dist/es/useTranslation.js
+var import_shim = (/* @__PURE__ */ __commonJSMin(((exports, module) => {
+	module.exports = require_use_sync_external_store_shim_production();
+})))();
+var notReadyT = (k, optsOrDefaultValue) => {
+	if (isString(optsOrDefaultValue)) return optsOrDefaultValue;
+	if (isObject(optsOrDefaultValue) && isString(optsOrDefaultValue.defaultValue)) return optsOrDefaultValue.defaultValue;
+	if (typeof k === "function") return "";
+	if (Array.isArray(k)) {
+		const last = k[k.length - 1];
+		return typeof last === "function" ? "" : last;
+	}
+	return k;
+};
+var notReadySnapshot = {
+	t: notReadyT,
+	ready: false
+};
+var dummySubscribe = () => () => {};
+var useTranslation = (ns, props = {}) => {
+	const { i18n: i18nFromProps } = props;
+	const { i18n: i18nFromContext, defaultNS: defaultNSFromContext } = useContext(I18nContext) || {};
+	const i18n = i18nFromProps || i18nFromContext || getI18n();
+	if (i18n && !i18n.reportNamespaces) i18n.reportNamespaces = new ReportNamespaces();
+	if (!i18n) warnOnce(i18n, "NO_I18NEXT_INSTANCE", "useTranslation: You will need to pass in an i18next instance by using initReactI18next or by passing it via props or context. In monorepo setups, make sure there is only one instance of react-i18next.");
+	const i18nOptions = useMemo(() => ({
+		...getDefaults(),
+		...i18n?.options?.react,
+		...props
+	}), [i18n, props]);
+	const { useSuspense, keyPrefix } = i18nOptions;
+	const nsOrContext = ns || defaultNSFromContext || i18n?.options?.defaultNS;
+	const unstableNamespaces = isString(nsOrContext) ? [nsOrContext] : nsOrContext || ["translation"];
+	const namespaces = useMemo(() => unstableNamespaces, unstableNamespaces);
+	i18n?.reportNamespaces?.addUsedNamespaces?.(namespaces);
+	const revisionRef = useRef(0);
+	const subscribe = useCallback((callback) => {
+		if (!i18n) return dummySubscribe;
+		const { bindI18n, bindI18nStore } = i18nOptions;
+		const wrappedCallback = () => {
+			revisionRef.current += 1;
+			callback();
+		};
+		if (bindI18n) i18n.on(bindI18n, wrappedCallback);
+		if (bindI18nStore) i18n.store.on(bindI18nStore, wrappedCallback);
+		return () => {
+			if (bindI18n) bindI18n.split(" ").forEach((e) => i18n.off(e, wrappedCallback));
+			if (bindI18nStore) bindI18nStore.split(" ").forEach((e) => i18n.store.off(e, wrappedCallback));
+		};
+	}, [i18n, i18nOptions]);
+	const snapshotRef = useRef();
+	const getSnapshot = useCallback(() => {
+		if (!i18n) return notReadySnapshot;
+		const calculatedReady = !!(i18n.isInitialized || i18n.initializedStoreOnce) && namespaces.every((n) => hasLoadedNamespace(n, i18n, i18nOptions));
+		const currentLng = props.lng || i18n.language;
+		const currentRevision = revisionRef.current;
+		const lastSnapshot = snapshotRef.current;
+		if (lastSnapshot && lastSnapshot.ready === calculatedReady && lastSnapshot.lng === currentLng && lastSnapshot.keyPrefix === keyPrefix && lastSnapshot.revision === currentRevision) return lastSnapshot;
+		const newSnapshot = {
+			t: i18n.getFixedT(currentLng, i18nOptions.nsMode === "fallback" ? namespaces : namespaces[0], keyPrefix, { scopeNs: namespaces }),
+			ready: calculatedReady,
+			lng: currentLng,
+			keyPrefix,
+			revision: currentRevision
+		};
+		snapshotRef.current = newSnapshot;
+		return newSnapshot;
+	}, [
+		i18n,
+		namespaces,
+		keyPrefix,
+		i18nOptions,
+		props.lng
+	]);
+	const [loadCount, setLoadCount] = useState(0);
+	const { t, ready } = (0, import_shim.useSyncExternalStore)(subscribe, getSnapshot, getSnapshot);
+	useEffect(() => {
+		if (i18n && !ready && !useSuspense) {
+			const onLoaded = () => setLoadCount((c) => c + 1);
+			if (props.lng) loadLanguages(i18n, props.lng, namespaces, onLoaded);
+			else loadNamespaces(i18n, namespaces, onLoaded);
+		}
+	}, [
+		i18n,
+		props.lng,
+		namespaces,
+		ready,
+		useSuspense,
+		loadCount
+	]);
+	const finalI18n = i18n || {};
+	const wrapperRef = useRef(null);
+	const wrapperLangRef = useRef();
+	const createI18nWrapper = (original) => {
+		const descriptors = Object.getOwnPropertyDescriptors(original);
+		if (descriptors.__original) delete descriptors.__original;
+		const wrapper = Object.create(Object.getPrototypeOf(original), descriptors);
+		if (!Object.prototype.hasOwnProperty.call(wrapper, "__original")) try {
+			Object.defineProperty(wrapper, "__original", {
+				value: original,
+				writable: false,
+				enumerable: false,
+				configurable: false
+			});
+		} catch (_) {}
+		return wrapper;
+	};
+	const ret = useMemo(() => {
+		const original = finalI18n;
+		const lang = original?.language;
+		let i18nWrapper = original;
+		if (original) if (wrapperRef.current && wrapperRef.current.__original === original) if (wrapperLangRef.current !== lang) {
+			i18nWrapper = createI18nWrapper(original);
+			wrapperRef.current = i18nWrapper;
+			wrapperLangRef.current = lang;
+		} else i18nWrapper = wrapperRef.current;
+		else {
+			i18nWrapper = createI18nWrapper(original);
+			wrapperRef.current = i18nWrapper;
+			wrapperLangRef.current = lang;
+		}
+		const effectiveT = !ready && !useSuspense ? (...args) => {
+			warnOnce(i18n, "USE_T_BEFORE_READY", "useTranslation: t was called before ready. When using useSuspense: false, make sure to check the ready flag before using t.");
+			return t(...args);
+		} : t;
+		const arr = [
+			effectiveT,
+			i18nWrapper,
+			ready
+		];
+		arr.t = effectiveT;
+		arr.i18n = i18nWrapper;
+		arr.ready = ready;
+		return arr;
+	}, [
+		t,
+		finalI18n,
+		ready,
+		finalI18n.resolvedLanguage,
+		finalI18n.language,
+		finalI18n.languages
+	]);
+	if (i18n && useSuspense && !ready) {
+		let inDevelopment = false;
+		try {
+			inDevelopment = false;
+		} catch (e) {}
+		if (inDevelopment) warnOnce(i18n, "SUSPENDED_WHILE_LOADING", "useTranslation: suspended while translations are loading (useSuspense is true by default). Add a <Suspense> boundary above this component, or set react.useSuspense: false in the i18next init options. https://react.i18next.com/latest/usetranslation-hook");
+		throw new Promise((resolve) => {
+			const onLoaded = () => resolve();
+			if (props.lng) loadLanguages(i18n, props.lng, namespaces, onLoaded);
+			else loadNamespaces(i18n, namespaces, onLoaded);
+		});
+	}
+	return ret;
+};
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/shared/src/utils/mergeClasses.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var mergeClasses = (...classes) => classes.filter((className, index, array) => {
+	return Boolean(className) && className.trim() !== "" && array.indexOf(className) === index;
+}).join(" ").trim();
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/shared/src/utils/toKebabCase.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var toKebabCase = (string) => string.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/shared/src/utils/toCamelCase.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var toCamelCase = (string) => string.replace(/^([A-Z])|[\s-_]+(\w)/g, (match, p1, p2) => p2 ? p2.toUpperCase() : p1.toLowerCase());
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/shared/src/utils/toPascalCase.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var toPascalCase = (string) => {
+	const camelCase = toCamelCase(string);
+	return camelCase.charAt(0).toUpperCase() + camelCase.slice(1);
+};
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/defaultAttributes.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var defaultAttributes = {
+	xmlns: "http://www.w3.org/2000/svg",
+	width: 24,
+	height: 24,
+	viewBox: "0 0 24 24",
+	fill: "none",
+	stroke: "currentColor",
+	strokeWidth: 2,
+	strokeLinecap: "round",
+	strokeLinejoin: "round"
+};
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/shared/src/utils/hasA11yProp.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var hasA11yProp = (props) => {
+	for (const prop in props) if (prop.startsWith("aria-") || prop === "role" || prop === "title") return true;
+	return false;
+};
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/context.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var LucideContext = createContext({});
+var useLucideContext = () => useContext(LucideContext);
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/Icon.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Icon$1 = forwardRef(({ color, size, strokeWidth, absoluteStrokeWidth, className = "", children, iconNode, ...rest }, ref) => {
+	const { size: contextSize = 24, strokeWidth: contextStrokeWidth = 2, absoluteStrokeWidth: contextAbsoluteStrokeWidth = false, color: contextColor = "currentColor", className: contextClass = "" } = useLucideContext() ?? {};
+	const calculatedStrokeWidth = absoluteStrokeWidth ?? contextAbsoluteStrokeWidth ? Number(strokeWidth ?? contextStrokeWidth) * 24 / Number(size ?? contextSize) : strokeWidth ?? contextStrokeWidth;
+	return createElement("svg", {
+		ref,
+		...defaultAttributes,
+		width: size ?? contextSize ?? defaultAttributes.width,
+		height: size ?? contextSize ?? defaultAttributes.height,
+		stroke: color ?? contextColor,
+		strokeWidth: calculatedStrokeWidth,
+		className: mergeClasses("lucide", contextClass, className),
+		...!children && !hasA11yProp(rest) && { "aria-hidden": "true" },
+		...rest
+	}, [...iconNode.map(([tag, attrs]) => createElement(tag, attrs)), ...Array.isArray(children) ? children : [children]]);
+});
+//#endregion
+//#region ../../node_modules/lucide-react/dist/esm/createLucideIcon.mjs
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var createLucideIcon = (iconName, iconNode) => {
+	const Component = forwardRef(({ className, ...props }, ref) => createElement(Icon$1, {
+		ref,
+		iconNode,
+		className: mergeClasses(`lucide-${toKebabCase(toPascalCase(iconName))}`, `lucide-${iconName}`, className),
+		...props
+	}));
+	Component.displayName = toPascalCase(iconName);
+	return Component;
+};
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Check = createLucideIcon("check", [["path", {
+	d: "M20 6 9 17l-5-5",
+	key: "1gmf2c"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var ChevronDown = createLucideIcon("chevron-down", [["path", {
+	d: "m6 9 6 6 6-6",
+	key: "qrunsl"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Clock = createLucideIcon("clock", [["circle", {
+	cx: "12",
+	cy: "12",
+	r: "10",
+	key: "1mglay"
+}], ["path", {
+	d: "M12 6v6l4 2",
+	key: "mmk7yg"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var FileText = createLucideIcon("file-text", [
+	["path", {
+		d: "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z",
+		key: "1oefj6"
+	}],
+	["path", {
+		d: "M14 2v5a1 1 0 0 0 1 1h5",
+		key: "wfsgrz"
+	}],
+	["path", {
+		d: "M10 9H8",
+		key: "b1mrlr"
+	}],
+	["path", {
+		d: "M16 13H8",
+		key: "t4e002"
+	}],
+	["path", {
+		d: "M16 17H8",
+		key: "z1uh3a"
+	}]
+]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var List = createLucideIcon("list", [
+	["path", {
+		d: "M3 5h.01",
+		key: "18ugdj"
+	}],
+	["path", {
+		d: "M3 12h.01",
+		key: "nlz23k"
+	}],
+	["path", {
+		d: "M3 19h.01",
+		key: "noohij"
+	}],
+	["path", {
+		d: "M8 5h13",
+		key: "1pao27"
+	}],
+	["path", {
+		d: "M8 12h13",
+		key: "1za7za"
+	}],
+	["path", {
+		d: "M8 19h13",
+		key: "m83p4d"
+	}]
+]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var LoaderCircle = createLucideIcon("loader-circle", [["path", {
+	d: "M21 12a9 9 0 1 1-6.219-8.56",
+	key: "13zald"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Maximize2 = createLucideIcon("maximize-2", [
+	["path", {
+		d: "M15 3h6v6",
+		key: "1q9fwt"
+	}],
+	["path", {
+		d: "m21 3-7 7",
+		key: "1l2asr"
+	}],
+	["path", {
+		d: "m3 21 7-7",
+		key: "tjx5ai"
+	}],
+	["path", {
+		d: "M9 21H3v-6",
+		key: "wtvkvv"
+	}]
+]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var MessageCircle = createLucideIcon("message-circle", [["path", {
+	d: "M2.992 16.342a2 2 0 0 1 .094 1.167l-1.065 3.29a1 1 0 0 0 1.236 1.168l3.413-.998a2 2 0 0 1 1.099.092 10 10 0 1 0-4.777-4.719",
+	key: "1sd12s"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Minimize2 = createLucideIcon("minimize-2", [
+	["path", {
+		d: "m14 10 7-7",
+		key: "oa77jy"
+	}],
+	["path", {
+		d: "M20 10h-6V4",
+		key: "mjg0md"
+	}],
+	["path", {
+		d: "m3 21 7-7",
+		key: "tjx5ai"
+	}],
+	["path", {
+		d: "M4 14h6v6",
+		key: "rmj7iw"
+	}]
+]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Paperclip = createLucideIcon("paperclip", [["path", {
+	d: "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551",
+	key: "1miecu"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Plus = createLucideIcon("plus", [["path", {
+	d: "M5 12h14",
+	key: "1ays0h"
+}], ["path", {
+	d: "M12 5v14",
+	key: "s699le"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var RotateCcw = createLucideIcon("rotate-ccw", [["path", {
+	d: "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8",
+	key: "1357e3"
+}], ["path", {
+	d: "M3 3v5h5",
+	key: "1xhq8a"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Send = createLucideIcon("send", [["path", {
+	d: "M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z",
+	key: "1ffxy3"
+}], ["path", {
+	d: "m21.854 2.147-10.94 10.939",
+	key: "12cjpa"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Square = createLucideIcon("square", [["rect", {
+	width: "18",
+	height: "18",
+	x: "3",
+	y: "3",
+	rx: "2",
+	key: "afitv7"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Star = createLucideIcon("star", [["path", {
+	d: "M11.525 2.295a.53.53 0 0 1 .95 0l2.31 4.679a2.123 2.123 0 0 0 1.595 1.16l5.166.756a.53.53 0 0 1 .294.904l-3.736 3.638a2.123 2.123 0 0 0-.611 1.878l.882 5.14a.53.53 0 0 1-.771.56l-4.618-2.428a2.122 2.122 0 0 0-1.973 0L6.396 21.01a.53.53 0 0 1-.77-.56l.881-5.139a2.122 2.122 0 0 0-.611-1.879L2.16 9.795a.53.53 0 0 1 .294-.906l5.165-.755a2.122 2.122 0 0 0 1.597-1.16z",
+	key: "r04s7s"
+}]]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var Upload = createLucideIcon("upload", [
+	["path", {
+		d: "M12 3v12",
+		key: "1x0j5s"
+	}],
+	["path", {
+		d: "m17 8-5-5-5 5",
+		key: "7q97r8"
+	}],
+	["path", {
+		d: "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4",
+		key: "ih7n3h"
+	}]
+]);
+/**
+* @license lucide-react v1.24.0 - ISC
+*
+* This source code is licensed under the ISC license.
+* See the LICENSE file in the root directory of this source tree.
+*/
+var X = createLucideIcon("x", [["path", {
+	d: "M18 6 6 18",
+	key: "1bl5f8"
+}], ["path", {
+	d: "m6 6 12 12",
+	key: "d8bk6v"
+}]]);
+//#endregion
+//#region src/ui/sse.ts
+async function* readSse(body) {
+	const reader = body.getReader();
+	const decoder = new TextDecoder();
+	let buf = "";
+	for (;;) {
+		const { done, value } = await reader.read();
+		if (done) break;
+		buf += decoder.decode(value, { stream: true });
+		let idx;
+		while ((idx = buf.indexOf("\n\n")) !== -1) {
+			const frame = buf.slice(0, idx);
+			buf = buf.slice(idx + 2);
+			let event = "message";
+			const data = [];
+			for (const line of frame.split("\n")) {
+				if (!line || line.startsWith(":")) continue;
+				if (line.startsWith("event:")) event = line.slice(6).trim();
+				else if (line.startsWith("data:")) data.push(line.slice(5).replace(/^ /, ""));
+			}
+			if (data.length) yield {
+				event,
+				data: data.join("\n")
+			};
+		}
+	}
+}
+//#endregion
+//#region src/ui/chat-api.ts
+/** Web-chat transport. Session cookies are sent automatically (same-origin), so there is no
+*  separate authorization here; the gate is on the server. */
+var BASE = "/api/plugins/webchat/user";
+/** POST a member-level webchat action with a JSON body: the one request path every call
+*  in this file (except the SSE stream in `openChannel` and `stopTurn`'s empty-body POST)
+*  goes through. Throws `Error(action)` on any non-OK response — every caller below relies
+*  on that to build its own error message. */
+async function postAction(action, body) {
+	const r = await fetch(`${BASE}/${action}`, {
+		method: "POST",
+		headers: { "content-type": "application/json" },
+		body: JSON.stringify(body)
+	});
+	if (!r.ok) throw new Error(action);
+	return await r.json();
+}
+/**
+* Throws on any rejection, including 404 (“plugin was disabled AFTER the widget bundle
+* loaded”). There is deliberately no separate `null` for this case: the caller keeps
+* the current thread list either way, so two return codes would mean the same thing.
+*/
+async function fetchThreads() {
+	return (await postAction("threads", {})).threads;
+}
+async function fetchHistory(convId) {
+	return postAction("history", { convId });
+}
+async function fetchAgents(convId) {
+	const out = await postAction("agents", { convId });
+	return {
+		agents: out.agents ?? [],
+		defaultAgentId: out.defaultAgentId ?? null,
+		selection: out.selection ?? {
+			agentId: null,
+			presetId: null
+		},
+		starters: out.starters ?? []
+	};
+}
+async function selectAgent(convId, patch) {
+	return (await postAction("selectAgent", {
+		convId,
+		...patch
+	})).selection;
+}
+/** Mark a conversation private, or reopen it. Only ever meaningful for the
+*  caller's OWN conversation — the server refuses (returns the unchanged
+*  visibility) for anything else, so the UI only offers this control on the
+*  viewer's own rows in the first place. */
+async function setThreadVisibility(convId, makePrivate) {
+	return postAction("setVisibility", {
+		convId,
+		private: makePrivate
+	});
+}
+/** Records the user turn and starts the agent turn running — an ordinary POST that
+*  resolves as soon as the turn has STARTED, not once it finishes (`sendAction`,
+*  `../runtime/send.ts`). It streams nothing any more: every live update — the
+*  answer as it is written, its completion, an error — arrives on the
+*  conversation's own channel (`openChannel`, below), which `use-chat.ts` keeps
+*  open for as long as this conversation is on screen, whether or not THIS call
+*  is what started the turn currently running. */
+async function sendMessage(req) {
+	return postAction("send", {
+		convId: req.convId,
+		text: req.text,
+		replyTo: req.replyTo,
+		context: req.context,
+		...req.attachments?.length ? { attachments: req.attachments } : {}
+	});
+}
+/** Abort the turn currently running on `convId`, if there is one (`stopAction`,
+*  `../runtime/actions.ts`). That action returns `Promise<void>` — the route sends
+*  an empty 200 body, the same uniform non-answer whether a live turn was
+*  actually aborted, none was running, or the caller may not write to the
+*  conversation — so this deliberately does NOT go through `postAction`, whose
+*  `.json()` would throw on that empty body. */
+async function stopTurn(convId) {
+	if (!(await fetch(`${BASE}/stop`, {
+		method: "POST",
+		headers: { "content-type": "application/json" },
+		body: JSON.stringify({ convId })
+	})).ok) throw new Error("stop");
+}
+/** Subscribe to `convId`'s channel and hold the connection open, delivering every
+*  frame to `handlers` until the server ends the stream (the conversation went
+*  private on this viewer, `setVisibility`'s eviction; a restart; a network drop)
+*  or `signal` aborts it. Resolves (does not reject) when the server ends the
+*  stream cleanly, same as a plain fetch whose body simply runs out — rejects only
+*  on a genuine transport failure or `signal` aborting. Either way it is
+*  `use-chat.ts`'s job to reconnect with backoff while the conversation is still
+*  the one on screen: there is no `Last-Event-ID` bookkeeping and no server-side
+*  buffer here, by design (see the design doc's "Reconnect, and the race that
+*  comes with it") — missed frames are recovered by re-reading history, never by
+*  replaying the stream. */
+async function openChannel(convId, handlers, signal) {
+	const r = await fetch(`${BASE}/channel/stream`, {
+		method: "POST",
+		headers: { "content-type": "application/json" },
+		body: JSON.stringify({ convId }),
+		signal
+	});
+	if (!r.ok || !r.body) throw new Error(`http ${r.status}`);
+	for await (const frame of readSse(r.body)) try {
+		const data = JSON.parse(frame.data);
+		if (frame.event === "user") handlers.onUser({
+			msgId: String(data["msgId"] ?? ""),
+			text: String(data["text"] ?? ""),
+			ts: typeof data["ts"] === "number" ? data["ts"] : 0,
+			...Array.isArray(data["attachments"]) ? { attachments: data["attachments"] } : {}
+		});
+		else if (frame.event === "message") handlers.onMessage({
+			msgId: String(data["msgId"] ?? ""),
+			text: String(data["text"] ?? "")
+		});
+		else if (frame.event === "delta") handlers.onDelta({
+			msgId: String(data["msgId"] ?? ""),
+			text: String(data["text"] ?? "")
+		});
+		else if (frame.event === "reasoning") handlers.onReasoning({
+			msgId: String(data["msgId"] ?? ""),
+			text: String(data["text"] ?? "")
+		});
+		else if (frame.event === "done") handlers.onDone({
+			msgId: data["msgId"] ?? null,
+			parentMsgId: String(data["parentMsgId"] ?? ""),
+			suggestions: Array.isArray(data["suggestions"]) ? data["suggestions"] : null
+		});
+		else if (frame.event === "error") handlers.onError({
+			message: data["message"] ?? null,
+			parentMsgId: typeof data["parentMsgId"] === "string" ? data["parentMsgId"] : null
+		});
+	} catch (e) {
+		handlers.onError({
+			message: `malformed frame: ${String(e)}`,
+			parentMsgId: null
+		});
+	}
+}
+//#endregion
+//#region src/ui/use-chat.ts
+function newId() {
+	return crypto.randomUUID();
+}
+/** The message id a frame reports as its OUTCOME, for dedup against history on
+*  flush. `error` is never persisted (a failed turn stores nothing), so it is
+*  never a duplicate of anything a history read could carry — its
+*  `parentMsgId` exists only to scope the send-lock clear below to the
+*  viewer's own turn, a different question from dedup. */
+function frameHistoryId(frame) {
+	switch (frame.kind) {
+		case "user":
+		case "message":
+		case "delta":
+		case "reasoning": return frame.data.msgId;
+		case "done": return frame.data.msgId;
+		case "error": return null;
+	}
+}
+var RECONNECT_BASE_MS = 1e3;
+var RECONNECT_MAX_MS = 3e4;
+function useChat() {
+	const [threads, setThreads] = useState([]);
+	const [convId, setConvId] = useState(null);
+	const [messages, setMessages] = useState([]);
+	const [pending, setPending] = useState(null);
+	const [pendingReasoning, setPendingReasoning] = useState(null);
+	const [error, setError] = useState(null);
+	const [agents, setAgents] = useState([]);
+	const [defaultAgentId, setDefaultAgentId] = useState(null);
+	const [selection, setSelection] = useState({
+		agentId: null,
+		presetId: null
+	});
+	const [starters, setStarters] = useState([]);
+	const [suggestions, setSuggestions] = useState(null);
+	const headRef = useRef(null);
+	const sendingRef = useRef(false);
+	const myTurnMsgIdRef = useRef(null);
+	const pendingTextRef = useRef("");
+	const pendingReasoningRef = useRef(null);
+	const turnRef = useRef(0);
+	const aliveRef = useRef(true);
+	useEffect(() => {
+		aliveRef.current = true;
+		return () => {
+			aliveRef.current = false;
+			turnRef.current++;
+		};
+	}, []);
+	const loadThreads = useCallback(() => {
+		fetchThreads().then((list) => {
+			if (aliveRef.current) setThreads(list);
+		}).catch(() => {});
+	}, []);
+	useEffect(() => {
+		if (!convId) return;
+		let cancelled = false;
+		fetchAgents(convId).then((r) => {
+			if (cancelled) return;
+			setAgents(r.agents);
+			setDefaultAgentId(r.defaultAgentId);
+			setSelection(r.selection);
+			setStarters(r.starters);
+		}).catch(() => {});
+		return () => {
+			cancelled = true;
+		};
+	}, [convId]);
+	/** Apply one channel frame to state. Called either live (as it arrives, once a
+	*  connection has finished its history flush) or from the buffer a fresh
+	*  (re)connect built while history was in flight — `historyIds` is non-null
+	*  ONLY for the latter, and gates every frame on it: a frame whose outcome the
+	*  just-fetched history already carries is dropped rather than reapplied, the
+	*  one piece of ordering the design doc calls out by name. Live frames never
+	*  need this check — their message id cannot already be in a history snapshot
+	*  read before they existed. */
+	const applyFrame = useCallback((frame, historyIds) => {
+		const outcomeId = frameHistoryId(frame);
+		const isDuplicate = historyIds !== null && outcomeId !== null && historyIds.has(outcomeId);
+		switch (frame.kind) {
+			case "user": {
+				if (isDuplicate) break;
+				const { msgId, text, ts, attachments } = frame.data;
+				setMessages((prev) => prev.some((m) => m.msgId === msgId) ? prev : [...prev, {
+					msgId,
+					role: "user",
+					text,
+					ts,
+					...attachments?.length ? { attachments } : {}
+				}]);
+				break;
+			}
+			case "message":
+			case "delta":
+				if (isDuplicate) break;
+				pendingTextRef.current = frame.data.text;
+				setPending(frame.data.text);
+				break;
+			case "reasoning":
+				if (isDuplicate) break;
+				pendingReasoningRef.current = frame.data.text;
+				setPendingReasoning(frame.data.text);
+				break;
+			case "done": {
+				const { msgId, parentMsgId, suggestions: nextSuggestions } = frame.data;
+				headRef.current = msgId ?? parentMsgId;
+				setSuggestions(nextSuggestions ?? null);
+				if (!isDuplicate && msgId && pendingTextRef.current) {
+					const text = pendingTextRef.current;
+					const reasoning = pendingReasoningRef.current;
+					setMessages((prev) => prev.some((m) => m.msgId === msgId) ? prev : [...prev, {
+						msgId,
+						role: "assistant",
+						text,
+						ts: Math.floor(Date.now() / 1e3),
+						...reasoning ? { reasoning } : {}
+					}]);
+				}
+				pendingTextRef.current = "";
+				pendingReasoningRef.current = null;
+				setPending(null);
+				setPendingReasoning(null);
+				if (myTurnMsgIdRef.current !== null && myTurnMsgIdRef.current === parentMsgId) {
+					sendingRef.current = false;
+					myTurnMsgIdRef.current = null;
+				}
+				loadThreads();
+				break;
+			}
+			case "error":
+				setError(frame.data.message ?? "error");
+				pendingTextRef.current = "";
+				pendingReasoningRef.current = null;
+				setPending(null);
+				setPendingReasoning(null);
+				if (myTurnMsgIdRef.current !== null && myTurnMsgIdRef.current === frame.data.parentMsgId) {
+					sendingRef.current = false;
+					myTurnMsgIdRef.current = null;
+				}
+				break;
+		}
+	}, [loadThreads]);
+	useEffect(() => {
+		if (!convId) return;
+		const chatConvId = convId;
+		let cancelled = false;
+		let reconnectTimer = null;
+		let attempt = 0;
+		const ctl = new AbortController();
+		async function connectOnce() {
+			if (cancelled) return;
+			let buffering = true;
+			let receivedFrame = false;
+			const buffer = [];
+			const dispatch = (frame) => {
+				if (cancelled) return;
+				receivedFrame = true;
+				if (buffering) buffer.push(frame);
+				else applyFrame(frame, null);
+			};
+			const settled = openChannel(chatConvId, {
+				onUser: (data) => dispatch({
+					kind: "user",
+					data
+				}),
+				onMessage: (data) => dispatch({
+					kind: "message",
+					data
+				}),
+				onDelta: (data) => dispatch({
+					kind: "delta",
+					data
+				}),
+				onReasoning: (data) => dispatch({
+					kind: "reasoning",
+					data
+				}),
+				onDone: (data) => dispatch({
+					kind: "done",
+					data
+				}),
+				onError: (data) => dispatch({
+					kind: "error",
+					data
+				})
+			}, ctl.signal).then(() => true, () => false);
+			try {
+				const h = await fetchHistory(chatConvId);
+				if (cancelled) return;
+				headRef.current = h.headMsgId;
+				const historyIds = new Set(h.messages.map((m) => m.msgId));
+				setMessages((prev) => {
+					const ownPendingId = myTurnMsgIdRef.current;
+					const stillUnconfirmed = prev.filter((m) => !historyIds.has(m.msgId) && (m.msgId.startsWith("local-") || m.msgId === ownPendingId));
+					return stillUnconfirmed.length ? [...h.messages, ...stillUnconfirmed] : h.messages;
+				});
+				setSuggestions(h.messages.at(-1)?.suggestions ?? null);
+				buffering = false;
+				for (const frame of buffer) applyFrame(frame, historyIds);
+			} catch (e) {
+				if (cancelled) return;
+				setError(e.message);
+				buffering = false;
+				for (const frame of buffer) applyFrame(frame, null);
+			}
+			await settled;
+			if (cancelled) return;
+			if (receivedFrame) attempt = 0;
+			const delay = Math.min(RECONNECT_BASE_MS * 2 ** attempt, RECONNECT_MAX_MS);
+			attempt++;
+			reconnectTimer = setTimeout(() => void connectOnce(), delay);
+		}
+		connectOnce();
+		return () => {
+			cancelled = true;
+			if (reconnectTimer) clearTimeout(reconnectTimer);
+			ctl.abort();
+		};
+	}, [convId, applyFrame]);
+	const chooseAgent = useCallback((next) => {
+		const previous = selection;
+		setSelection(next);
+		if (convId) selectAgent(convId, next).then(setSelection).catch((err) => {
+			setSelection(previous);
+			setError(err instanceof Error ? err.message : String(err));
+		});
+	}, [convId, selection]);
+	const togglePrivate = useCallback((convId, next) => {
+		const previous = threads.find((t) => t.convId === convId)?.private ?? false;
+		setThreads((prev) => prev.map((t) => t.convId === convId ? {
+			...t,
+			private: next
+		} : t));
+		setThreadVisibility(convId, next).then((r) => {
+			setThreads((prev) => prev.map((t) => t.convId === convId ? {
+				...t,
+				private: r.visibility === "private"
+			} : t));
+		}).catch(() => {
+			setThreads((prev) => prev.map((t) => t.convId === convId ? {
+				...t,
+				private: previous
+			} : t));
+		});
+	}, [threads]);
+	const attachmentsAllowed = useMemo(() => {
+		const media = agents.find((a) => a.id === selection.agentId)?.media;
+		if (!media) return true;
+		return media.image.accepts.length > 0 || media.document.accepts.length > 0;
+	}, [agents, selection]);
+	const newConversation = useCallback(() => {
+		turnRef.current++;
+		sendingRef.current = false;
+		myTurnMsgIdRef.current = null;
+		headRef.current = null;
+		setConvId(newId());
+		setMessages([]);
+		setPending(null);
+		setPendingReasoning(null);
+		pendingTextRef.current = "";
+		pendingReasoningRef.current = null;
+		setError(null);
+		setSuggestions(null);
+	}, []);
+	const open = useCallback(async (id) => {
+		turnRef.current++;
+		sendingRef.current = false;
+		myTurnMsgIdRef.current = null;
+		setConvId(id);
+		headRef.current = null;
+		setMessages([]);
+		setPending(null);
+		setPendingReasoning(null);
+		pendingTextRef.current = "";
+		pendingReasoningRef.current = null;
+		setError(null);
+		setSuggestions(null);
+	}, []);
+	const stop = useCallback(() => {
+		if (!convId) return;
+		stopTurn(convId).catch(() => {});
+	}, [convId]);
+	return {
+		threads,
+		convId,
+		messages,
+		pending,
+		pendingReasoning,
+		error,
+		agents,
+		defaultAgentId,
+		selection,
+		starters,
+		suggestions,
+		attachmentsAllowed,
+		chooseAgent,
+		togglePrivate,
+		send: useCallback((text, context, attachments = []) => {
+			if (!text.trim() || sendingRef.current) return false;
+			sendingRef.current = true;
+			const myTurn = turnRef.current;
+			const id = convId ?? newId();
+			if (convId === null) setConvId(id);
+			setError(null);
+			setSuggestions(null);
+			const localMsgId = `local-${newId()}`;
+			setMessages((prev) => [...prev, {
+				msgId: localMsgId,
+				role: "user",
+				text,
+				ts: Math.floor(Date.now() / 1e3),
+				...attachments.length ? { attachments } : {}
+			}]);
+			setPending("");
+			(async () => {
+				try {
+					const { msgId } = await sendMessage({
+						convId: id,
+						text,
+						replyTo: headRef.current,
+						context,
+						attachments
+					});
+					if (turnRef.current !== myTurn) return;
+					if (msgId === null) {
+						sendingRef.current = false;
+						setPending(null);
+						setPendingReasoning(null);
+						return;
+					}
+					setMessages((prev) => prev.some((m) => m.msgId === msgId) ? prev.filter((m) => m.msgId !== localMsgId) : prev.map((m) => m.msgId === localMsgId ? {
+						...m,
+						msgId
+					} : m));
+					myTurnMsgIdRef.current = msgId;
+				} catch (e) {
+					if (turnRef.current === myTurn) {
+						sendingRef.current = false;
+						setError(e.message);
+						setPending(null);
+						setPendingReasoning(null);
+					}
+				}
+			})();
+			return true;
+		}, [convId]),
+		open,
+		newConversation,
+		loadThreads,
+		stop
+	};
+}
+//#endregion
+//#region src/ui/use-page-context.ts
+/** The record page's own heading — a BEST-EFFORT read of the app's own rendered DOM,
+*  not a data path. `RecordContent` (`packages/web/display/index.tsx`) marks the
+*  TITLE element itself `role="heading" aria-level="1"` (the role sits on the title
+*  element alone, never a wrapper — a wrapping row's role would pull every sibling
+*  body field's text into the name, and the title is now one field among many in the
+*  body); today that is the only element in the whole app carrying it,
+*  so this selector cannot pick up some OTHER record's heading by mistake. It exists at
+*  all because the chat overlay is a sibling of the routed page (mounted in the app
+*  shell's own slot), never a descendant of it, so there is no React tree — no prop, no
+*  context — to read the value from, and this package (`plugin-webchat`) has no data
+*  path of its own to the open record either. Reading the painted DOM instead of
+*  fetching the record: the SPA already has it open and displaying this text, and a
+*  server-side lookup would be a query per turn for a value the browser is holding.
+*
+*  WHEN it is read is the whole safety argument, so it is stated rather than assumed:
+*  reading the DOM during React's RENDER phase sees the PREVIOUSLY COMMITTED tree, so a
+*  navigation from one record to another produced the new path and id beside the OLD
+*  record's name — a fact stated WRONG, which the base prompt tells the model to trust.
+*  Hence `usePageContext` returns a READER the composer calls in its send handler: an
+*  event handler runs after commit, so the heading and the path it is reported with
+*  come from the same painted page. That is also what the design asks for — the page
+*  the user was on AT THE MOMENT OF SENDING, and nowhere else.
+*
+*  What is guaranteed, then: the title is read from the DOM as it stands when the turn
+*  is sent. What is NOT guaranteed is that the title is present — a heading not yet
+*  painted (a record still loading) and an untitled record's Dash placeholder both
+*  yield no title, and an absent fact is the harmless case. One case yields a WRONG
+*  one: if the app ever grows a SECOND element with this exact role/level (a preview
+*  dialog, a relation picker, a plugin's own record renderer), `querySelector` returns
+*  whichever comes first in document order, not necessarily the record the user is
+*  actually looking at. Whoever eventually gives the overlay a real data path to the
+*  open record should read this as the reason it was ever DOM-based, not rediscover it. */
+var EMPTY_TITLE = "—";
+function recordHeading() {
+	if (typeof document === "undefined") return void 0;
+	const text = document.querySelector("[role=\"heading\"][aria-level=\"1\"]")?.textContent?.trim();
+	return text && text !== EMPTY_TITLE ? text : void 0;
+}
+/** SPA routes: `/:library/:type[/:id]`; system branches (settings, browse) are
+*  returned by path only. Pure but for the heading read, which is why it takes the
+*  path rather than calling the router itself. */
+function pageContextAt(pathname) {
+	const parts = pathname.split("/").filter(Boolean);
+	const system = /* @__PURE__ */ new Set([
+		"settings",
+		"browse",
+		"plugins",
+		"login",
+		"setup"
+	]);
+	if (parts.length < 2 || system.has(parts[0])) return { path: pathname };
+	const [library, type, id] = parts;
+	const isRecord = Boolean(id && id !== "new");
+	const title = isRecord ? recordHeading() : void 0;
+	return {
+		path: pathname,
+		library,
+		type,
+		...isRecord ? { id } : {},
+		...title ? { title } : {}
+	};
+}
+/** Current-page context for the agent, as a reader called AT SEND TIME rather than a
+*  value computed while rendering — see the heading comment above for why that
+*  distinction is the difference between an absent title and a wrong one. The path
+*  comes from the render that is currently committed, which is the same tree the
+*  reader's heading lookup walks. */
+function usePageContext() {
+	const { pathname } = useLocation();
+	return useCallback(() => pageContextAt(pathname), [pathname]);
+}
+//#endregion
+//#region src/ui/chat-nav.tsx
+/** What to do with the widget when the user follows a link from a response.
+*  ChatWidget supplies the callback (it owns mode/open), avoiding a prop
+*  threaded through ChatMessages and Bubble. */
+var ChatNavContext = createContext(() => {});
+function ChatNavProvider({ onNavigate, children }) {
+	return /* @__PURE__ */ jsx(ChatNavContext.Provider, {
+		value: onNavigate,
+		children
+	});
+}
+function useChatNav() {
+	return useContext(ChatNavContext);
+}
+//#endregion
+//#region src/ui/chat-markdown.tsx
+/** Render markdown received FROM THE MODEL, an untrusted source.
+*
+*  One renderer serves every markdown surface now — the record page and this bubble alike —
+*  so this component is a density layer over the kit's `MarkdownView` and nothing more. What
+*  it used to own itself now lives there, for both surfaces:
+*
+*    - raw HTML never becomes markup. The vocabulary renderer has NO raw-HTML pass, so a tag
+*      the model wrote is escaped before anything sees it; the barrier react-markdown gave
+*      structurally is still structural, just one layer earlier. DOMPurify is defence in depth.
+*    - an internal link goes through the router, so the chat stays mounted, and `onNavigate`
+*      closes the panel on the way out.
+*    - an address that leads nowhere (`javascript:`, a fabricated shelf) keeps its text and
+*      loses its anchor — this bubble's old rule, now everyone's.
+*    - a table gets its scroll wrapper from the web tag map itself.
+*/
+function ChatMarkdown({ text, className }) {
+	const onNavigate = useChatNav();
+	return /* @__PURE__ */ jsx(MarkdownView, {
+		value: text,
+		className: className ?? "md-static md-chat",
+		onNavigate
+	});
+}
+//#endregion
+//#region src/ui/ChatMessages.tsx
+function ChatMessages({ messages, pending, pendingReasoning, trailing }) {
+	const { t } = useTranslation();
+	const listRef = useRef(null);
+	useEffect(() => {
+		const el = listRef.current;
+		if (el) el.scrollTop = el.scrollHeight;
+	}, [messages.length, pending]);
+	return /* @__PURE__ */ jsxs("div", {
+		ref: listRef,
+		"data-chat-list": true,
+		className: "flex min-h-0 flex-1 flex-col gap-3 overflow-y-auto p-2",
+		children: [!messages.length && pending === null && pendingReasoning === null ? /* @__PURE__ */ jsx("div", {
+			className: "flex-1 grid place-items-center text-muted-foreground text-sm",
+			children: t("webchat.empty")
+		}) : /* @__PURE__ */ jsxs(Fragment, { children: [messages.map((m) => /* @__PURE__ */ jsx(Bubble, {
+			role: m.role,
+			text: m.text,
+			reasoning: m.reasoning,
+			attachments: m.attachments
+		}, m.msgId)), pending !== null && /* @__PURE__ */ jsx(Bubble, {
+			role: "assistant",
+			text: pending || t("webchat.thinking"),
+			reasoning: pendingReasoning
+		})] }), trailing]
+	});
+}
+/**
+* memo: during streaming, the parent re-renders on EVERY delta (several times per
+* second). Without memo, each tick would re-render (and therefore re-parse markdown)
+* for every completed message while only one bubble at the bottom is changing.
+* The props are primitives, so the default shallow comparison is sufficient.
+*/
+var Bubble = memo(function Bubble({ role, text, reasoning, attachments }) {
+	const { t } = useTranslation();
+	if (role === "user") return /* @__PURE__ */ jsxs("div", {
+		className: "self-end max-w-[85%] rounded-2xl border border-ring bg-muted px-3 py-2 text-[0.8125rem] whitespace-pre-wrap break-words",
+		children: [attachments?.length ? /* @__PURE__ */ jsx("div", {
+			className: "mb-1.5 flex flex-wrap gap-1",
+			children: attachments.map((a) => /* @__PURE__ */ jsx("span", {
+				className: "inline-flex max-w-full items-center rounded-md bg-background px-1.5 py-0.5 text-xs",
+				title: a.name,
+				children: a.label ?? a.name
+			}, a.name))
+		}) : null, text]
+	});
+	return /* @__PURE__ */ jsxs("div", {
+		className: "self-start max-w-[95%] min-w-0 rounded-2xl bg-muted px-3 py-2 text-sm break-words",
+		children: [reasoning ? /* @__PURE__ */ jsxs("details", {
+			className: "mb-2 rounded-lg border border-border px-2 py-1",
+			children: [/* @__PURE__ */ jsx("summary", {
+				className: "cursor-pointer select-none text-xs text-muted-foreground",
+				children: t("webchat.reasoning")
+			}), /* @__PURE__ */ jsx(ChatMarkdown, {
+				text: reasoning,
+				className: "md-static md-chat md-chat-sub mt-1 text-muted-foreground"
+			})]
+		}) : null, /* @__PURE__ */ jsx(ChatMarkdown, {
+			text,
+			className: "md-static md-chat"
+		})]
+	});
+});
+//#endregion
+//#region src/ui/AgentPicker.tsx
+var MAX_STARS = 5;
+/** Rating pair: "3 star, 3 clock". Two digits read at a glance and stay the same
+*  width on every row, which a free-text hint ("fastest and cheapest" next to
+*  "quick") does not. Both are read the same way — the star is what you get, the
+*  clock is what it costs you in waiting — so a heavier model raises both numbers.
+*  Falls back to the hint when the agent publishes no ratings. */
+function PresetRating({ quality, time, hint }) {
+	const { t } = useTranslation();
+	if (quality === void 0 || time === void 0) return hint ? /* @__PURE__ */ jsx("span", {
+		className: "shrink-0 text-muted-foreground",
+		children: hint
+	}) : null;
+	const both = quality !== time;
+	return /* @__PURE__ */ jsxs("span", {
+		className: "flex shrink-0 items-center gap-1.5 text-muted-foreground tabular-nums",
+		children: [/* @__PURE__ */ jsxs("span", {
+			className: "flex items-center gap-0.5",
+			title: t("webchat.quality", { value: quality }),
+			children: [
+				quality,
+				/* @__PURE__ */ jsx(Star, {
+					size: 11,
+					"aria-hidden": true,
+					className: "shrink-0"
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: "sr-only",
+					children: t("webchat.quality", { value: quality })
+				})
+			]
+		}), both ? /* @__PURE__ */ jsxs("span", {
+			className: "flex items-center gap-0.5",
+			title: t("webchat.time", { value: time }),
+			children: [
+				time,
+				/* @__PURE__ */ jsx(Clock, {
+					size: 11,
+					"aria-hidden": true,
+					className: "shrink-0"
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: "sr-only",
+					children: t("webchat.time", { value: time })
+				})
+			]
+		}) : /* @__PURE__ */ jsx("span", {
+			className: "sr-only",
+			children: t("webchat.time", { value: time })
+		})]
+	});
+}
+/**
+* The presets of ONE agent, ordered by their level, when they form a complete ladder:
+* a unique `quality` per preset, contiguous from 1, at most five rungs. Only then does a
+* star count address a preset without ambiguity, and only then may the picker stop
+* printing model names. Anything else — two agents, a gap in the ladder, a preset with
+* no rating — returns null and the picker keeps its list of names.
+*/
+function starLadder(rows, multi) {
+	if (multi || rows.length < 2 || rows.length > MAX_STARS) return null;
+	const byLevel = Array.from({ length: rows.length });
+	for (const r of rows) {
+		const q = r.quality;
+		if (q === void 0 || !Number.isInteger(q) || q < 1 || q > rows.length) return null;
+		if (byLevel[q - 1]) return null;
+		byLevel[q - 1] = r;
+	}
+	return byLevel.every((r) => r !== void 0) ? byLevel : null;
+}
+/** Flatten the catalog to one list: with a single registered agent the agent
+*  level is noise, and with several the agent name simply prefixes its presets. */
+function AgentPicker({ agents, defaultAgentId, selection, onChange }) {
+	const { t } = useTranslation();
+	const [open, setOpen] = useState(false);
+	const [preview, setPreview] = useState(null);
+	const rootRef = useRef(null);
+	const triggerRef = useRef(null);
+	useEffect(() => {
+		if (!open) return;
+		function onPointerDown(e) {
+			if (rootRef.current && !rootRef.current.contains(e.target)) setOpen(false);
+		}
+		function onKeyDown(e) {
+			if (e.key === "Escape") {
+				setOpen(false);
+				triggerRef.current?.focus();
+			}
+		}
+		document.addEventListener("pointerdown", onPointerDown);
+		document.addEventListener("keydown", onKeyDown);
+		return () => {
+			document.removeEventListener("pointerdown", onPointerDown);
+			document.removeEventListener("keydown", onKeyDown);
+		};
+	}, [open]);
+	const multi = agents.length > 1;
+	const rows = agents.flatMap((a) => a.presets.map((p) => ({
+		agentId: a.id,
+		presetId: p.id,
+		label: multi ? `${a.title} · ${p.title}` : p.title,
+		hint: p.hint,
+		quality: p.quality,
+		time: p.time,
+		isDefault: p.default === true
+	})));
+	if (rows.length === 0) return null;
+	const current = rows.find((r) => r.agentId === selection.agentId && r.presetId === selection.presetId) ?? rows.find((r) => r.agentId === defaultAgentId && r.isDefault) ?? rows.find((r) => r.isDefault) ?? rows[0];
+	const ladder = starLadder(rows, multi);
+	if (ladder) {
+		const level = ladder.indexOf(current) + 1;
+		const shown = preview ?? level;
+		const levelName = (row, n) => `${row.label} · ${t("webchat.level", {
+			value: n,
+			max: ladder.length
+		})}`;
+		return /* @__PURE__ */ jsx("ul", {
+			"aria-label": t("webchat.agentPicker"),
+			className: "flex shrink-0 items-center",
+			onPointerLeave: () => setPreview(null),
+			children: ladder.map((r, i) => {
+				const n = i + 1;
+				return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx("button", {
+					type: "button",
+					...r === current ? { "aria-current": true } : {},
+					"aria-label": levelName(r, n),
+					className: "flex rounded p-1 focus-visible:outline-2 focus-visible:outline-ring",
+					onPointerEnter: () => setPreview(n),
+					onFocus: () => setPreview(n),
+					onBlur: () => setPreview(null),
+					onClick: () => onChange({
+						agentId: r.agentId,
+						presetId: r.presetId
+					}),
+					children: /* @__PURE__ */ jsx(Star, {
+						size: 16,
+						"aria-hidden": true,
+						className: n <= shown ? "fill-current" : "text-border",
+						style: n <= shown ? { color: toneVar("yellow") } : void 0
+					})
+				}) }, `${r.agentId}/${r.presetId}`);
+			})
+		});
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		className: "relative",
+		ref: rootRef,
+		children: [/* @__PURE__ */ jsxs("button", {
+			ref: triggerRef,
+			type: "button",
+			"aria-haspopup": "menu",
+			"aria-expanded": open,
+			className: "flex items-center gap-1 rounded-md px-2 py-1 text-xs text-muted-foreground hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring",
+			onClick: () => setOpen((v) => !v),
+			children: [/* @__PURE__ */ jsx("span", {
+				className: "max-w-40 truncate",
+				children: current.label
+			}), /* @__PURE__ */ jsx(ChevronDown, {
+				size: 12,
+				className: "shrink-0"
+			})]
+		}), open && /* @__PURE__ */ jsx("ul", {
+			"aria-label": t("webchat.agentPicker"),
+			className: "absolute bottom-full left-0 z-10 mb-1 max-h-64 w-64 max-w-[calc(100vw-2rem)] overflow-y-auto rounded-md border border-border bg-muted py-1 shadow-lg",
+			children: rows.map((r) => {
+				const selected = r === current;
+				return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("button", {
+					type: "button",
+					...selected ? { "aria-current": true } : {},
+					className: "flex w-full items-center gap-2 px-2 py-1.5 text-left text-xs hover:bg-card focus-visible:outline-2 focus-visible:outline-ring",
+					onClick: () => {
+						setOpen(false);
+						onChange({
+							agentId: r.agentId,
+							presetId: r.presetId
+						});
+					},
+					children: [
+						/* @__PURE__ */ jsx(Check, {
+							size: 12,
+							className: selected ? "shrink-0 text-primary" : "shrink-0 opacity-0"
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "min-w-0 flex-1 truncate",
+							children: r.label
+						}),
+						/* @__PURE__ */ jsx(PresetRating, {
+							quality: r.quality,
+							time: r.time,
+							hint: r.hint
+						})
+					]
+				}) }, `${r.agentId}/${r.presetId}`);
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/ui/ChatComposer.tsx
+function ChatComposer({ streaming, onSend, onStop, attachments, uploading, uploadError, uploadProgress, canRetryUpload, onRetryUpload, onPickFiles, onRemoveAttachment, agents, defaultAgentId, selection, onChooseAgent, attachmentsAllowed }) {
+	const { t } = useTranslation();
+	const [text, setText] = useState("");
+	function submit() {
+		if (!text.trim() || streaming) return;
+		if (onSend(text.trim(), attachments)) setText("");
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		className: "flex shrink-0 flex-col gap-2 border-t border-border p-2",
+		children: [(attachments.length > 0 || uploading || uploadError) && /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-wrap items-center gap-1.5 px-1",
+			"data-chat-attachments": true,
+			children: [
+				attachments.map((a, i) => /* @__PURE__ */ jsxs("span", {
+					className: "inline-flex min-w-0 max-w-full items-center gap-1 rounded-md bg-muted px-2 py-1 text-xs",
+					children: [
+						/* @__PURE__ */ jsx(FileText, {
+							size: 13,
+							className: "shrink-0 text-muted-foreground"
+						}),
+						/* @__PURE__ */ jsx("span", {
+							className: "max-w-48 truncate",
+							children: a.label ?? a.name
+						}),
+						/* @__PURE__ */ jsx("button", {
+							type: "button",
+							"aria-label": t("webchat.removeAttachment", { name: a.label ?? a.name }),
+							className: "shrink-0 rounded p-0.5 text-muted-foreground hover:text-destructive",
+							onClick: () => onRemoveAttachment(i),
+							children: /* @__PURE__ */ jsx(X, { size: 13 })
+						})
+					]
+				}, `${a.name}-${i}`)),
+				uploading && /* @__PURE__ */ jsxs("div", {
+					className: "flex min-w-32 flex-1 items-center gap-2",
+					"aria-label": t("webchat.uploading"),
+					children: [
+						/* @__PURE__ */ jsx(LoaderCircle, {
+							size: 14,
+							className: "shrink-0 animate-spin text-muted-foreground"
+						}),
+						/* @__PURE__ */ jsx("div", {
+							role: "progressbar",
+							"aria-label": t("webchat.uploadProgress"),
+							"aria-valuemin": 0,
+							"aria-valuemax": 100,
+							"aria-valuenow": uploadProgress,
+							className: "h-1.5 min-w-0 flex-1 overflow-hidden rounded-full bg-border",
+							children: /* @__PURE__ */ jsx("div", {
+								className: "h-full rounded-full bg-primary transition-[width]",
+								style: { width: `${uploadProgress}%` }
+							})
+						}),
+						/* @__PURE__ */ jsxs("span", {
+							className: "text-xs tabular-nums text-muted-foreground",
+							children: [uploadProgress, "%"]
+						})
+					]
+				}),
+				uploadError && /* @__PURE__ */ jsxs("div", {
+					className: "flex min-w-0 flex-1 items-center gap-2 text-xs text-destructive",
+					children: [/* @__PURE__ */ jsx("span", {
+						className: "min-w-0 flex-1",
+						children: t(uploadError)
+					}), canRetryUpload && /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						className: "inline-flex shrink-0 items-center gap-1 rounded px-1.5 py-0.5 font-medium text-primary hover:bg-muted",
+						onClick: onRetryUpload,
+						children: [
+							/* @__PURE__ */ jsx(RotateCcw, { size: 12 }),
+							" ",
+							t("webchat.retryUpload")
+						]
+					})]
+				})
+			]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "flex flex-col gap-1",
+			children: [/* @__PURE__ */ jsx("textarea", {
+				className: "w-full resize-none rounded-lg border border-border bg-background px-3 py-2 text-sm max-h-32",
+				rows: 1,
+				value: text,
+				placeholder: t("webchat.placeholder"),
+				onChange: (e) => setText(e.target.value),
+				onKeyDown: (e) => {
+					if (e.key === "Enter" && !e.shiftKey) {
+						e.preventDefault();
+						submit();
+					}
+				}
+			}), /* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-1",
+				children: [
+					attachmentsAllowed && /* @__PURE__ */ jsxs("label", {
+						"aria-label": t("webchat.attach"),
+						className: `shrink-0 cursor-pointer rounded-lg p-1.5 text-muted-foreground hover:bg-muted hover:text-primary ${uploading ? "pointer-events-none opacity-60" : ""}`,
+						children: [/* @__PURE__ */ jsx(Paperclip, { size: 18 }), /* @__PURE__ */ jsx("input", {
+							type: "file",
+							multiple: true,
+							className: "hidden",
+							disabled: uploading,
+							onChange: (e) => {
+								if (e.target.files?.length) onPickFiles(e.target.files);
+								e.currentTarget.value = "";
+							}
+						})]
+					}),
+					/* @__PURE__ */ jsx(AgentPicker, {
+						agents,
+						defaultAgentId,
+						selection,
+						onChange: onChooseAgent
+					}),
+					/* @__PURE__ */ jsx("div", { className: "flex-1" }),
+					streaming ? /* @__PURE__ */ jsx("button", {
+						"aria-label": t("webchat.stop"),
+						className: "shrink-0 rounded-lg p-1.5 hover:bg-muted",
+						onClick: onStop,
+						children: /* @__PURE__ */ jsx(Square, { size: 18 })
+					}) : /* @__PURE__ */ jsx("button", {
+						"aria-label": t("webchat.send"),
+						className: "shrink-0 rounded-lg p-1.5 hover:bg-muted",
+						onClick: submit,
+						children: /* @__PURE__ */ jsx(Send, { size: 18 })
+					})
+				]
+			})]
+		})]
+	});
+}
+//#endregion
+//#region src/ui/ChatThreadList.tsx
+function ChatThreadList({ threads, activeId, onOpen, onNew, onTogglePrivate, className = "w-[220px] shrink-0" }) {
+	const { t } = useTranslation();
+	return /* @__PURE__ */ jsxs("aside", {
+		"aria-label": t("webchat.threads"),
+		className: `${className} border-r border-border flex flex-col`,
+		children: [/* @__PURE__ */ jsxs("button", {
+			className: "flex items-center gap-2 px-3 py-2 text-sm hover:bg-muted",
+			onClick: onNew,
+			children: [
+				/* @__PURE__ */ jsx(Plus, { size: 16 }),
+				" ",
+				t("webchat.newConversation")
+			]
+		}), /* @__PURE__ */ jsx("div", {
+			className: "flex-1 overflow-y-auto",
+			children: threads.map((th) => {
+				const active = th.convId === activeId;
+				return /* @__PURE__ */ jsxs("div", {
+					className: `flex items-center gap-1 pl-1 pr-2 ${active ? "bg-muted" : "hover:bg-muted"}`,
+					children: [/* @__PURE__ */ jsxs("button", {
+						onClick: () => onOpen(th.convId),
+						className: `min-w-0 flex-1 py-2 pl-2 text-left text-sm ${active ? "font-medium" : ""}`,
+						children: [/* @__PURE__ */ jsx("span", {
+							className: "block truncate",
+							children: th.title || t("webchat.newConversation")
+						}), (th.mine || th.ownerName) && /* @__PURE__ */ jsx("span", {
+							className: "block truncate text-xs text-muted-foreground",
+							children: th.mine ? t("webchat.you") : th.ownerName
+						})]
+					}), th.mine && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						"aria-label": th.private ? t("webchat.makePublic") : t("webchat.makePrivate"),
+						title: th.private ? t("webchat.makePublic") : t("webchat.makePrivate"),
+						onClick: (e) => {
+							e.stopPropagation();
+							onTogglePrivate(th.convId, !th.private);
+						},
+						className: "shrink-0 rounded p-1 text-muted-foreground hover:bg-card hover:text-foreground focus-visible:outline-2 focus-visible:outline-ring",
+						children: /* @__PURE__ */ jsx(Icon, {
+							name: th.private ? "lucide:shield" : "lucide:globe",
+							size: 14
+						})
+					})]
+				}, th.convId);
+			})
+		})]
+	});
+}
+//#endregion
+//#region src/ui/SuggestionChips.tsx
+/**
+* A row of clickable quick-reply chips: either the static, global conversation starters
+* shown on an empty chat, or the contextual suggestions the agent proposed after its last
+* answer (`ChatState.suggestions`) — both render through this one component, distinguished
+* only by which list `ChatWidget` passes in. Renders nothing for an empty or null list, so
+* callers do not need their own guard.
+*/
+function SuggestionChips({ items, onPick }) {
+	const { t } = useTranslation();
+	if (!items?.length) return null;
+	return /* @__PURE__ */ jsx("div", {
+		role: "group",
+		"aria-label": t("webchat.suggestions"),
+		className: "flex flex-wrap gap-1.5 px-2 pb-1.5",
+		children: items.map((text, i) => /* @__PURE__ */ jsx("button", {
+			type: "button",
+			title: text,
+			className: "max-w-full truncate rounded-full border border-border bg-muted px-3 py-1 text-xs text-foreground hover:border-border2 hover:bg-card focus-visible:outline-2 focus-visible:outline-ring",
+			onClick: () => onPick(text),
+			children: text
+		}, `${i}-${text}`))
+	});
+}
+//#endregion
+//#region src/ui/ChatWidget.tsx
+var MAX_CHAT_UPLOAD_BYTES = 25 * 1024 * 1024;
+function isFileDrag(e) {
+	return Array.from(e.dataTransfer.types).includes("Files");
+}
+/** One drop surface per popup. The overlay deliberately covers the header, feed, and composer. */
+function ChatDropSurface({ children, onFiles, className }) {
+	const { t } = useTranslation();
+	const [dragging, setDragging] = useState(false);
+	const depth = useRef(0);
+	function enter(e) {
+		if (!isFileDrag(e)) return;
+		e.preventDefault();
+		depth.current += 1;
+		setDragging(true);
+	}
+	function leave(e) {
+		if (!isFileDrag(e)) return;
+		e.preventDefault();
+		depth.current = Math.max(0, depth.current - 1);
+		if (depth.current === 0) setDragging(false);
+	}
+	function drop(e) {
+		if (!isFileDrag(e)) return;
+		e.preventDefault();
+		depth.current = 0;
+		setDragging(false);
+		onFiles(Array.from(e.dataTransfer.files));
+	}
+	return /* @__PURE__ */ jsxs("div", {
+		className,
+		onDragEnter: enter,
+		onDragLeave: leave,
+		onDragOver: (e) => {
+			if (isFileDrag(e)) {
+				e.preventDefault();
+				e.dataTransfer.dropEffect = "copy";
+			}
+		},
+		onDrop: drop,
+		children: [children, dragging && /* @__PURE__ */ jsx("div", {
+			"data-chat-drop-overlay": true,
+			"data-testid": "chat-drop-overlay",
+			className: "pointer-events-none absolute inset-0 z-50 grid place-items-center bg-card/95 p-6 text-center backdrop-blur-sm",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "flex h-full w-full flex-col items-center justify-center rounded-2xl border-2 border-dashed border-ring text-primary",
+				children: [
+					/* @__PURE__ */ jsx(Upload, { size: 34 }),
+					/* @__PURE__ */ jsx("span", {
+						className: "mt-3 text-base font-medium",
+						children: t("webchat.dropFiles")
+					}),
+					/* @__PURE__ */ jsx("span", {
+						className: "mt-1 text-xs text-muted-foreground",
+						children: t("webchat.dropFilesHint")
+					})
+				]
+			})
+		})]
+	});
+}
+/** The states the VIEWPORT offers, ordered from least to most expanded. `panel` — the 380px
+*  floating window — exists only where it does not obstruct the page: on a narrow screen the
+*  widget has exactly two states, the bubble and the full sheet. Every mode transition is a
+*  move along this ladder, so no call site can put the widget into a mode its screen lacks. */
+function chatModes(wide) {
+	return wide ? [
+		"bubble",
+		"panel",
+		"modal"
+	] : ["bubble", "modal"];
+}
+/** Where the widget rests once it is opened — expanded, but as little as the viewport allows.
+*  Also where it returns after following a link from a response: on a wide screen the panel
+*  does not obstruct the page the user just navigated to, while on a narrow one the sheet is
+*  the only visible state, so the active conversation survives the navigation either way. */
+function restingMode(wide) {
+	return chatModes(wide)[1];
+}
+/** One step along the ladder, clamped at both ends: `-1` is what collapse, Esc and a dialog
+*  dismiss do, `+1` is expand. A mode this viewport no longer offers is re-homed by the effect
+*  in the widget, not by stepping — the step always returns a mode from the current ladder. */
+function stepMode(mode, wide, delta) {
+	const ladder = chatModes(wide);
+	const next = ladder.indexOf(mode) + delta;
+	return ladder[Math.min(ladder.length - 1, Math.max(0, next))];
+}
+function ChatWidget() {
+	const { t } = useTranslation();
+	const chat = useChat();
+	const readPage = usePageContext();
+	const [mode, setMode] = useState("bubble");
+	const [threadsOpen, setThreadsOpen] = useState(false);
+	const [attachments, setAttachments] = useState([]);
+	const [uploading, setUploading] = useState(false);
+	const [uploadProgress, setUploadProgress] = useState(0);
+	const [uploadError, setUploadError] = useState(null);
+	const [retryFiles, setRetryFiles] = useState([]);
+	const wide = useMinWidth("sm", 640);
+	const hasSidebar = wide && mode === "modal";
+	const onChatNavigate = useCallback(() => {
+		setMode(restingMode(wide));
+	}, [wide]);
+	const expandBtnRef = useRef(null);
+	const prevModeRef = useRef("bubble");
+	useEffect(() => {
+		if (mode !== "modal") return;
+		const onKey = (e) => {
+			if (e.key === "Escape") setMode(stepMode("modal", wide, -1));
+		};
+		window.addEventListener("keydown", onKey);
+		return () => window.removeEventListener("keydown", onKey);
+	}, [mode, wide]);
+	useEffect(() => {
+		if (!chatModes(wide).includes(mode)) setMode(restingMode(wide));
+	}, [mode, wide]);
+	useEffect(() => {
+		if (mode === "panel" && prevModeRef.current === "modal") expandBtnRef.current?.focus();
+		prevModeRef.current = mode;
+	}, [mode]);
+	useEffect(() => {
+		if (mode === "bubble" || hasSidebar) setThreadsOpen(false);
+	}, [mode, hasSidebar]);
+	useEffect(() => {
+		if (mode !== "modal") return;
+		const prev = document.body.style.overflow;
+		document.body.style.overflow = "hidden";
+		return () => {
+			document.body.style.overflow = prev;
+		};
+	}, [mode]);
+	const isOpen = mode !== "bubble";
+	useEffect(() => {
+		if (isOpen) chat.loadThreads();
+	}, [isOpen, chat.loadThreads]);
+	const { convId, newConversation } = chat;
+	useEffect(() => {
+		if (isOpen && convId === null) newConversation();
+	}, [
+		isOpen,
+		convId,
+		newConversation
+	]);
+	function startNew() {
+		chat.newConversation();
+		setAttachments([]);
+		setUploadError(null);
+		setRetryFiles([]);
+		setThreadsOpen(false);
+	}
+	const pickFiles = useCallback(async (files) => {
+		if (!files.length) return;
+		setUploadError(null);
+		setRetryFiles([]);
+		setUploading(true);
+		setUploadProgress(0);
+		const added = [];
+		const failedFiles = [];
+		let error = null;
+		for (const file of files) {
+			if (file.size > MAX_CHAT_UPLOAD_BYTES) {
+				error ??= "webchat.uploadTooLarge";
+				continue;
+			}
+			try {
+				setUploadProgress(0);
+				const rec = await uploadFile(file, setUploadProgress);
+				if (rec) added.push({
+					...rec,
+					label: file.name
+				});
+				else {
+					failedFiles.push(file);
+					error ??= "webchat.uploadFailed";
+				}
+			} catch {
+				failedFiles.push(file);
+				error ??= "webchat.uploadFailed";
+			}
+		}
+		if (added.length) setAttachments((prev) => [...prev, ...added]);
+		setUploading(false);
+		setUploadProgress(0);
+		setRetryFiles(failedFiles);
+		if (error) setUploadError(error);
+	}, []);
+	const retryUploads = useCallback(() => {
+		if (retryFiles.length) pickFiles(retryFiles);
+	}, [pickFiles, retryFiles]);
+	const sendTurn = useCallback((text, refs) => {
+		const page = readPage();
+		const accepted = refs.length ? chat.send(text, page, refs) : chat.send(text, page);
+		if (accepted) {
+			setAttachments([]);
+			setUploadError(null);
+			setRetryFiles([]);
+		}
+		return accepted;
+	}, [chat, readPage]);
+	const hasConversation = chat.messages.length > 0 || chat.pending !== null;
+	const activeTitle = chat.threads.find((th) => th.convId === chat.convId)?.title;
+	const header = /* @__PURE__ */ jsxs("div", {
+		className: "flex shrink-0 items-center justify-between gap-2 border-b border-border px-3 py-2",
+		children: [/* @__PURE__ */ jsx("span", {
+			className: "min-w-0 truncate text-sm font-medium",
+			children: activeTitle || t("webchat.title")
+		}), /* @__PURE__ */ jsxs("div", {
+			className: "flex shrink-0 items-center gap-1",
+			children: [
+				!hasSidebar && /* @__PURE__ */ jsx("button", {
+					"aria-label": t("webchat.threads"),
+					"aria-expanded": threadsOpen,
+					className: "rounded p-1 hover:bg-muted",
+					onClick: () => setThreadsOpen((v) => !v),
+					children: /* @__PURE__ */ jsx(List, { size: 16 })
+				}),
+				hasConversation && /* @__PURE__ */ jsx("button", {
+					"aria-label": t("webchat.newConversation"),
+					className: "rounded p-1 hover:bg-muted",
+					onClick: startNew,
+					children: /* @__PURE__ */ jsx(Plus, { size: 16 })
+				}),
+				chatModes(wide).includes("panel") && /* @__PURE__ */ jsx("button", {
+					ref: expandBtnRef,
+					"aria-label": mode === "modal" ? t("webchat.collapse") : t("webchat.expand"),
+					className: "rounded p-1 hover:bg-muted",
+					onClick: () => setMode(stepMode(mode, wide, mode === "modal" ? -1 : 1)),
+					children: mode === "modal" ? /* @__PURE__ */ jsx(Minimize2, { size: 16 }) : /* @__PURE__ */ jsx(Maximize2, { size: 16 })
+				}),
+				/* @__PURE__ */ jsx("button", {
+					"aria-label": t("webchat.close"),
+					className: "rounded p-1 hover:bg-muted",
+					onClick: () => setMode("bubble"),
+					children: /* @__PURE__ */ jsx(X, { size: 16 })
+				})
+			]
+		})]
+	});
+	const threadList = /* @__PURE__ */ jsx(ChatThreadList, {
+		threads: chat.threads,
+		activeId: chat.convId,
+		onOpen: (id) => {
+			chat.open(id);
+			setAttachments([]);
+			setUploadError(null);
+			setRetryFiles([]);
+			setThreadsOpen(false);
+		},
+		onNew: startNew,
+		onTogglePrivate: chat.togglePrivate,
+		className: hasSidebar ? "w-[220px] shrink-0" : "w-full"
+	});
+	const conversation = /* @__PURE__ */ jsx(ChatNavProvider, {
+		onNavigate: onChatNavigate,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "flex min-h-0 min-w-0 flex-1 flex-col",
+			children: [
+				chat.error && /* @__PURE__ */ jsx("div", {
+					className: "px-3 py-2 text-sm text-destructive",
+					children: t("webchat.error", { message: chat.error })
+				}),
+				/* @__PURE__ */ jsx(ChatMessages, {
+					messages: chat.messages,
+					pending: chat.pending,
+					pendingReasoning: chat.pendingReasoning,
+					trailing: chat.messages.length === 0 ? /* @__PURE__ */ jsx(SuggestionChips, {
+						items: chat.starters,
+						onPick: (text) => sendTurn(text, attachments)
+					}) : /* @__PURE__ */ jsx(SuggestionChips, {
+						items: chat.suggestions,
+						onPick: (text) => sendTurn(text, attachments)
+					})
+				}),
+				/* @__PURE__ */ jsx(ChatComposer, {
+					streaming: chat.pending !== null,
+					attachments,
+					uploading,
+					uploadProgress,
+					uploadError,
+					canRetryUpload: retryFiles.length > 0 && !uploading,
+					onRetryUpload: retryUploads,
+					onPickFiles: (files) => void pickFiles(Array.from(files)),
+					onRemoveAttachment: (index) => setAttachments((prev) => prev.filter((_, i) => i !== index)),
+					agents: chat.agents,
+					defaultAgentId: chat.defaultAgentId,
+					selection: chat.selection,
+					onChooseAgent: chat.chooseAgent,
+					attachmentsAllowed: chat.attachmentsAllowed,
+					onSend: sendTurn,
+					onStop: chat.stop
+				})
+			]
+		})
+	});
+	if (mode === "bubble") return /* @__PURE__ */ jsx("button", {
+		"aria-label": t("webchat.open"),
+		onClick: () => setMode(restingMode(wide)),
+		className: "fixed bottom-4 right-4 z-40 grid h-14 w-14 place-items-center rounded-full bg-primary text-on-accent ring-1 ring-border2 shadow-lg",
+		children: /* @__PURE__ */ jsx(MessageCircle, { size: 24 })
+	});
+	if (mode === "panel") return /* @__PURE__ */ jsxs(ChatDropSurface, {
+		onFiles: pickFiles,
+		className: "fixed bottom-4 right-4 z-40 flex h-[560px] max-h-[80dvh] w-[380px] max-w-[calc(100vw-2rem)] flex-col overflow-hidden rounded-2xl border border-border bg-card shadow-xl",
+		children: [header, threadsOpen ? threadList : conversation]
+	});
+	return /* @__PURE__ */ jsxs(Dialog, {
+		open: true,
+		modal: false,
+		onOpenChange: (open) => !open && setMode(stepMode("modal", wide, -1)),
+		children: [/* @__PURE__ */ jsx("div", {
+			"data-chat-backdrop": true,
+			"aria-hidden": "true",
+			className: "fixed inset-0 z-[45] bg-black/50 backdrop-blur-sm"
+		}), /* @__PURE__ */ jsx(DialogContent, {
+			hideClose: true,
+			className: "h-[85dvh] w-full p-0 md:h-[85dvh] md:w-[80vw] md:max-w-[1040px] md:overflow-y-hidden",
+			children: /* @__PURE__ */ jsx(ChatDropSurface, {
+				onFiles: pickFiles,
+				className: "h-full",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "flex h-full min-h-0 flex-col",
+					children: [header, /* @__PURE__ */ jsxs("div", {
+						className: "flex min-h-0 flex-1",
+						children: [(hasSidebar || threadsOpen) && threadList, (hasSidebar || !threadsOpen) && conversation]
+					})]
+				})
+			})
+		})]
+	});
+}
+//#endregion
+export { ChatWidget, ChatWidget as default, chatModes, restingMode, stepMode };