@smooai/chat-widget 0.4.0 → 0.5.1

package/README.md

@@ -1,20 +1,26 @@
-<div align="center">
+<p align="center">
+  <a href="https://smoo.ai"><img src=".github/banner.png" alt="@smooai/chat-widget — Embeddable AI chat as a web component" width="100%" /></a>
+</p>
 
-# @smooai/chat-widget
+<p align="center">
+  <a href="https://www.npmjs.com/package/@smooai/chat-widget"><img src="https://img.shields.io/npm/v/@smooai/chat-widget?style=for-the-badge&color=00A6A6&label=npm&logo=npm&logoColor=white&labelColor=020618" alt="npm"></a>
+  <a href="https://smoo.ai/platform/support"><img src="https://img.shields.io/badge/Smoo_AI-platform-00A6A6?style=for-the-badge&labelColor=020618" alt="Smoo AI"></a>
+  <a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-F49F0A?style=for-the-badge&labelColor=020618" alt="license"></a>
+</p>
 
-### Embeddable AI chat as a framework-light web component.
+<p align="center">
+  <img src="https://img.shields.io/badge/gzip-~19%20kB-FF6B6C?style=flat-square" alt="bundle size">
+  <a href="https://github.com/SmooAI/chat-widget/actions/workflows/ci.yml"><img src="https://github.com/SmooAI/chat-widget/actions/workflows/ci.yml/badge.svg" alt="CI"></a>
+</p>
 
-**Streaming replies · grounded sources · popover or full-page · inherits _your_ brand color.**
-
-[![npm](https://img.shields.io/npm/v/@smooai/chat-widget?color=00a6a6&label=npm)](https://www.npmjs.com/package/@smooai/chat-widget)
-[![CI](https://github.com/SmooAI/chat-widget/actions/workflows/ci.yml/badge.svg)](https://github.com/SmooAI/chat-widget/actions/workflows/ci.yml)
-[![bundle](https://img.shields.io/badge/gzip-~19%20kB-4f8bff)](https://github.com/SmooAI/chat-widget)
-[![license](https://img.shields.io/badge/license-MIT-8b5cf6)](./LICENSE)
-
-</div>
+<p align="center">
+  <a href="#why-this-widget"><b>Features</b></a> &nbsp;·&nbsp; <a href="#install"><b>Install</b></a> &nbsp;·&nbsp; <a href="#quick-start"><b>Usage</b></a> &nbsp;·&nbsp; <a href="#theming"><b>Theming</b></a> &nbsp;·&nbsp; <a href="#part-of-smoo-ai"><b>Platform</b></a>
+</p>
 
 ---
 
+> A self-contained, streaming chat surface you drop into any site with one tag. No React on the host page, no CSS to import, ~19 kB gzipped, with the smooth-operator protocol client built in.
+
 `<smooth-agent-chat>` is a self-contained chat web component for the
 [smooth-operator](https://github.com/SmooAI/smooth-operator) protocol. Drop in one
 `<script>` tag (or import the ESM module) and you get a polished, streaming,
@@ -60,7 +66,36 @@ installed automatically.
 
 ## Quick start
 
-### 1. Declarative — a `<script>` tag + the element
+### 1. Recommended — the deferred loader (best Core Web Vitals)
+
+Include the tiny **loader** (~2 KB gzipped) eagerly. It does nothing expensive on
+load — it waits until the page is past its critical render (`requestIdleCallback`
+after `load`, **or** the visitor's first pointer/keydown/scroll, **or** an 8 s
+fallback), and only *then* injects the full widget module. The widget never
+competes with your page's LCP/TBT, but it's instantly there the moment a visitor
+shows intent.
+
+```html
+<script>
+    window.SmoothAgentChatConfig = {
+        endpoint: 'wss://your-host/ws',
+        agentId: '11111111-1111-4111-8111-111111111111',
+        agentName: 'Support',
+        greeting: 'Hi! How can I help?',
+    };
+</script>
+<script src="https://unpkg.com/@smooai/chat-widget/dist/chat-widget-loader.global.js" async></script>
+```
+
+The loader resolves the widget module as a sibling of its own URL (override with
+`data-src`), so a single CDN path is all you need. For the simplest installs you
+can skip the config global and use `data-*` attributes on the loader tag
+(`data-endpoint`, `data-agent-id`, `data-primary`, `data-mode`).
+
+### 2. Declarative — eager `<script>` + the element
+
+Simplest, but the module evaluates during page load — prefer the loader above on
+performance-sensitive (especially marketing) pages.
 
 ```html
 <script src="https://unpkg.com/@smooai/chat-widget/dist/chat-widget.global.js"></script>
@@ -75,7 +110,7 @@ installed automatically.
 
 The IIFE bundle auto-registers the element on load.
 
-### 2. Programmatic — bundler / ESM
+### 3. Programmatic — bundler / ESM
 
 ```ts
 import { mountChatWidget } from '@smooai/chat-widget';
@@ -235,6 +270,25 @@ pnpm test:e2e       # Playwright live e2e (gated — see e2e/)
 Open `index.html` (e.g. `pnpm dlx serve .`) after a build for the interactive,
 backend-free showcase.
 
+## Part of Smoo AI
+
+`@smooai/chat-widget` is built and open-sourced by **[Smoo AI](https://smoo.ai)** — the AI-powered business platform with AI built into every product: CRM, customer support, campaigns, field service, observability, and developer tools.
+
+- 🚀 **Customer support on the platform** — [smoo.ai/platform/support](https://smoo.ai/platform/support)
+- 🧰 **More open source from Smoo AI** — [smoo.ai/open-source](https://smoo.ai/open-source)
+- 🧩 **Sibling repos** — [smooth-operator](https://github.com/SmooAI/smooth-operator) (the protocol it renders), [smooth-operator-core](https://github.com/SmooAI/smooth-operator-core) (the engine), [@smooai/config](https://github.com/SmooAI/config), [@smooai/logger](https://github.com/SmooAI/logger)
+
+## Contributing
+
+Issues and PRs welcome. Run `pnpm check` (typecheck + test + build) before opening
+a PR.
+
 ## License
 
-MIT © [SmooAI](https://github.com/SmooAI)
+MIT © [Smoo AI](https://smoo.ai)
+
+---
+
+<p align="center">
+  Built by <a href="https://smoo.ai"><strong>Smoo AI</strong></a> — AI built into every product.
+</p>

package/dist/chat-widget-loader.global.js

@@ -0,0 +1,157 @@
+(function() {
+	//#region src/loader-core.ts
+	/**
+	* Tiny, dependency-free deferred loader for `@smooai/chat-widget`.
+	*
+	* The recommended embed: a host includes this *small* script eagerly, and it
+	* defers injecting the real (heavier) `chat-widget.global.js` module until the
+	* page is past its critical render — so the widget never competes with the host
+	* page's LCP/TBT. It triggers the real load on the **first** of:
+	*
+	*   - `window` `load` → `requestIdleCallback` (idle time), or
+	*   - user intent (`pointerdown` / `keydown` / `scroll`), or
+	*   - an 8s fallback.
+	*
+	* After the module loads (which registers `<smooth-agent-chat>` and exposes
+	* `window.SmoothAgentChat`), it mounts the widget with the host's config.
+	*
+	* Deliberately imports nothing from the widget itself — this file must stay a
+	* few hundred bytes so including it eagerly is free.
+	*
+	* ## Config
+	* Set a global before/with the loader (any `ChatWidgetConfig`, plus an optional
+	* `src` pointing at the module bundle):
+	*
+	* ```html
+	* <script>window.SmoothAgentChatConfig = { endpoint: 'wss://…/ws', agentId: '…' };<\/script>
+	* <script src="https://cdn/…/chat-widget-loader.global.js" async><\/script>
+	* ```
+	*
+	* Or, for the simplest installs, `data-*` attributes on the loader's own tag
+	* (`data-endpoint`, `data-agent-id`, `data-primary`, `data-mode`, `data-src`).
+	* If no config is found, the module is still loaded (registering the element) so
+	* a `<smooth-agent-chat …>` placed directly in markup upgrades itself.
+	*/
+	/** Must match `ELEMENT_TAG` in `element.ts`; inlined to avoid importing it. */
+	const ELEMENT_TAG = "smooth-agent-chat";
+	/** Default module filename, resolved as a sibling of the loader script. */
+	const DEFAULT_MODULE = "chat-widget.global.js";
+	/**
+	* Resolve the module URL: explicit `src` (config or `data-src`) wins, else a
+	* sibling of the loader script, else the bare default filename.
+	*/
+	function resolveModuleSrc(win, script) {
+		const fromConfig = win.SmoothAgentChatConfig?.src;
+		if (fromConfig) return fromConfig;
+		const fromAttr = script?.getAttribute("data-src");
+		if (fromAttr) return fromAttr;
+		const selfSrc = script?.src;
+		if (selfSrc) return selfSrc.replace(/[^/]*$/, DEFAULT_MODULE);
+		return DEFAULT_MODULE;
+	}
+	/**
+	* The widget mount config: the `SmoothAgentChatConfig` global (minus the
+	* loader-only `src`), or `data-*` attributes. `undefined` ⇒ no programmatic
+	* mount (a markup element will upgrade itself once the module registers it).
+	*/
+	function resolveMountConfig(win, script) {
+		if (win.SmoothAgentChatConfig) {
+			const { src: _src, ...config } = win.SmoothAgentChatConfig;
+			return Object.keys(config).length > 0 ? config : void 0;
+		}
+		if (!script) return void 0;
+		const endpoint = script.getAttribute("data-endpoint");
+		const agentId = script.getAttribute("data-agent-id");
+		if (!endpoint && !agentId) return void 0;
+		const config = {};
+		if (endpoint) config.endpoint = endpoint;
+		if (agentId) config.agentId = agentId;
+		const primary = script.getAttribute("data-primary");
+		if (primary) config.theme = { primary };
+		const mode = script.getAttribute("data-mode");
+		if (mode) config.mode = mode;
+		return config;
+	}
+	/**
+	* Install the deferred loader. Idempotent per call; the IIFE entry
+	* (`loader.ts`) invokes it once on script execution.
+	*/
+	function initChatWidgetLoader() {
+		const win = window;
+		const script = document.currentScript ?? null;
+		const moduleSrc = resolveModuleSrc(win, script);
+		let loaded = false;
+		let idleId;
+		let fallbackId;
+		function mountWhenReady() {
+			const config = resolveMountConfig(win, script);
+			if (!config) return;
+			const apply = () => {
+				try {
+					win.SmoothAgentChat?.mount(config);
+				} catch (error) {
+					console.error("[chat-widget loader] mount failed", error);
+				}
+			};
+			if (win.SmoothAgentChat) apply();
+			else if (window.customElements?.whenDefined) window.customElements.whenDefined(ELEMENT_TAG).then(apply, apply);
+			else apply();
+		}
+		function teardown() {
+			if (idleId !== void 0) {
+				window.cancelIdleCallback?.(idleId);
+				window.clearTimeout(idleId);
+			}
+			if (fallbackId !== void 0) window.clearTimeout(fallbackId);
+			window.removeEventListener("pointerdown", load);
+			window.removeEventListener("keydown", load);
+			window.removeEventListener("scroll", load);
+		}
+		function load() {
+			if (loaded) return;
+			loaded = true;
+			teardown();
+			const tag = document.createElement("script");
+			tag.src = moduleSrc;
+			tag.onload = mountWhenReady;
+			tag.onerror = () => console.error("[chat-widget loader] failed to load", moduleSrc);
+			document.head.appendChild(tag);
+		}
+		function schedule() {
+			if (window.requestIdleCallback) idleId = window.requestIdleCallback(() => load(), { timeout: 5e3 });
+			else idleId = window.setTimeout(load, 2500);
+			fallbackId = window.setTimeout(load, 8e3);
+		}
+		window.addEventListener("pointerdown", load, {
+			once: true,
+			passive: true
+		});
+		window.addEventListener("keydown", load, { once: true });
+		window.addEventListener("scroll", load, {
+			once: true,
+			passive: true
+		});
+		if (document.readyState === "complete") schedule();
+		else window.addEventListener("load", schedule, { once: true });
+	}
+	//#endregion
+	//#region src/loader.ts
+	/**
+	* Standalone IIFE entry for the **deferred loader** — built to
+	* `dist/chat-widget-loader.global.js`.
+	*
+	* This is the recommended embed: include it eagerly (it's tiny) and it lazily
+	* injects the real `chat-widget.global.js` module only once the host page is
+	* past its critical render (idle / user intent / 8s fallback), so the widget
+	* never competes with the host's LCP/TBT. See {@link initChatWidgetLoader}.
+	*
+	* ```html
+	* <script>window.SmoothAgentChatConfig = { endpoint: 'wss://…/ws', agentId: '…' };<\/script>
+	* <script src="https://cdn/…/chat-widget-loader.global.js" async><\/script>
+	* ```
+	*/
+	initChatWidgetLoader();
+	//#endregion
+})();
+
+//# sourceMappingURL=chat-widget-loader.global.js.map

package/dist/chat-widget-loader.global.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chat-widget-loader.global.js","names":[],"sources":["../src/loader-core.ts","../src/loader.ts"],"sourcesContent":["/**\n * Tiny, dependency-free deferred loader for `@smooai/chat-widget`.\n *\n * The recommended embed: a host includes this *small* script eagerly, and it\n * defers injecting the real (heavier) `chat-widget.global.js` module until the\n * page is past its critical render — so the widget never competes with the host\n * page's LCP/TBT. It triggers the real load on the **first** of:\n *\n *   - `window` `load` → `requestIdleCallback` (idle time), or\n *   - user intent (`pointerdown` / `keydown` / `scroll`), or\n *   - an 8s fallback.\n *\n * After the module loads (which registers `<smooth-agent-chat>` and exposes\n * `window.SmoothAgentChat`), it mounts the widget with the host's config.\n *\n * Deliberately imports nothing from the widget itself — this file must stay a\n * few hundred bytes so including it eagerly is free.\n *\n * ## Config\n * Set a global before/with the loader (any `ChatWidgetConfig`, plus an optional\n * `src` pointing at the module bundle):\n *\n * ```html\n * <script>window.SmoothAgentChatConfig = { endpoint: 'wss://…/ws', agentId: '…' };</script>\n * <script src=\"https://cdn/…/chat-widget-loader.global.js\" async></script>\n * ```\n *\n * Or, for the simplest installs, `data-*` attributes on the loader's own tag\n * (`data-endpoint`, `data-agent-id`, `data-primary`, `data-mode`, `data-src`).\n * If no config is found, the module is still loaded (registering the element) so\n * a `<smooth-agent-chat …>` placed directly in markup upgrades itself.\n */\n\n/** Must match `ELEMENT_TAG` in `element.ts`; inlined to avoid importing it. */\nconst ELEMENT_TAG = 'smooth-agent-chat';\n/** Default module filename, resolved as a sibling of the loader script. */\nconst DEFAULT_MODULE = 'chat-widget.global.js';\n\ntype MountFn = (config: Record<string, unknown>, target?: HTMLElement) => unknown;\n\ninterface LoaderWindow extends Window {\n    SmoothAgentChat?: { mount: MountFn };\n    SmoothAgentChatConfig?: Record<string, unknown> & { src?: string };\n}\n\n/**\n * Resolve the module URL: explicit `src` (config or `data-src`) wins, else a\n * sibling of the loader script, else the bare default filename.\n */\nfunction resolveModuleSrc(win: LoaderWindow, script: HTMLScriptElement | null): string {\n    const fromConfig = win.SmoothAgentChatConfig?.src;\n    if (fromConfig) return fromConfig;\n    const fromAttr = script?.getAttribute('data-src');\n    if (fromAttr) return fromAttr;\n    const selfSrc = script?.src;\n    if (selfSrc) return selfSrc.replace(/[^/]*$/, DEFAULT_MODULE);\n    return DEFAULT_MODULE;\n}\n\n/**\n * The widget mount config: the `SmoothAgentChatConfig` global (minus the\n * loader-only `src`), or `data-*` attributes. `undefined` ⇒ no programmatic\n * mount (a markup element will upgrade itself once the module registers it).\n */\nfunction resolveMountConfig(win: LoaderWindow, script: HTMLScriptElement | null): Record<string, unknown> | undefined {\n    if (win.SmoothAgentChatConfig) {\n        const { src: _src, ...config } = win.SmoothAgentChatConfig;\n        // Only `src` (no real fields) ⇒ no programmatic mount; a markup element\n        // upgrades itself once the module registers it.\n        return Object.keys(config).length > 0 ? config : undefined;\n    }\n    if (!script) return undefined;\n    const endpoint = script.getAttribute('data-endpoint');\n    const agentId = script.getAttribute('data-agent-id');\n    if (!endpoint && !agentId) return undefined;\n    const config: Record<string, unknown> = {};\n    if (endpoint) config.endpoint = endpoint;\n    if (agentId) config.agentId = agentId;\n    const primary = script.getAttribute('data-primary');\n    if (primary) config.theme = { primary };\n    const mode = script.getAttribute('data-mode');\n    if (mode) config.mode = mode;\n    return config;\n}\n\n/**\n * Install the deferred loader. Idempotent per call; the IIFE entry\n * (`loader.ts`) invokes it once on script execution.\n */\nexport function initChatWidgetLoader(): void {\n    const win = window as LoaderWindow;\n    const script = (document.currentScript as HTMLScriptElement | null) ?? null;\n    const moduleSrc = resolveModuleSrc(win, script);\n\n    let loaded = false;\n    let idleId: number | undefined;\n    let fallbackId: number | undefined;\n\n    function mountWhenReady(): void {\n        const config = resolveMountConfig(win, script);\n        if (!config) return; // markup element upgrades itself; nothing to mount\n        const apply = () => {\n            try {\n                win.SmoothAgentChat?.mount(config);\n            } catch (error) {\n                console.error('[chat-widget loader] mount failed', error);\n            }\n        };\n        if (win.SmoothAgentChat) {\n            apply();\n        } else if (window.customElements?.whenDefined) {\n            window.customElements.whenDefined(ELEMENT_TAG).then(apply, apply);\n        } else {\n            apply();\n        }\n    }\n\n    function teardown(): void {\n        if (idleId !== undefined) {\n            // The id is either an idle handle or (fallback path) a timeout id;\n            // both cancels are no-ops on the wrong kind, so calling both is safe.\n            window.cancelIdleCallback?.(idleId);\n            window.clearTimeout(idleId);\n        }\n        if (fallbackId !== undefined) window.clearTimeout(fallbackId);\n        window.removeEventListener('pointerdown', load);\n        window.removeEventListener('keydown', load);\n        window.removeEventListener('scroll', load);\n    }\n\n    function load(): void {\n        if (loaded) return;\n        loaded = true;\n        teardown();\n        const tag = document.createElement('script');\n        tag.src = moduleSrc;\n        tag.onload = mountWhenReady;\n        tag.onerror = () => console.error('[chat-widget loader] failed to load', moduleSrc);\n        document.head.appendChild(tag);\n    }\n\n    function schedule(): void {\n        if (window.requestIdleCallback) {\n            idleId = window.requestIdleCallback(() => load(), { timeout: 5000 });\n        } else {\n            idleId = window.setTimeout(load, 2500) as unknown as number;\n        }\n        fallbackId = window.setTimeout(load, 8000) as unknown as number;\n    }\n\n    // User intent loads immediately (they're about to want the widget).\n    window.addEventListener('pointerdown', load, { once: true, passive: true });\n    window.addEventListener('keydown', load, { once: true });\n    window.addEventListener('scroll', load, { once: true, passive: true });\n\n    if (document.readyState === 'complete') {\n        schedule();\n    } else {\n        window.addEventListener('load', schedule, { once: true });\n    }\n}\n","/**\n * Standalone IIFE entry for the **deferred loader** — built to\n * `dist/chat-widget-loader.global.js`.\n *\n * This is the recommended embed: include it eagerly (it's tiny) and it lazily\n * injects the real `chat-widget.global.js` module only once the host page is\n * past its critical render (idle / user intent / 8s fallback), so the widget\n * never competes with the host's LCP/TBT. See {@link initChatWidgetLoader}.\n *\n * ```html\n * <script>window.SmoothAgentChatConfig = { endpoint: 'wss://…/ws', agentId: '…' };</script>\n * <script src=\"https://cdn/…/chat-widget-loader.global.js\" async></script>\n * ```\n */\nimport { initChatWidgetLoader } from './loader-core.js';\n\ninitChatWidgetLoader();\n"],"mappings":"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"}

package/dist/chat-widget.global.js

@@ -49,7 +49,7 @@ var SmoothAgentChat = (function(exports) {
 		return !resolved.allowAnonymous && (resolved.requireName || resolved.requireEmail || resolved.requirePhone);
 	}
 	//#endregion
-	//#region node_modules/.pnpm/@smooai+smooth-operator@0.2.0/node_modules/@smooai/smooth-operator/dist/transport.js
+	//#region node_modules/.pnpm/@smooai+smooth-operator@1.8.0/node_modules/@smooai/smooth-operator/dist/transport.js
 	/**
 	* Transport abstraction for the client.
 	*
@@ -174,7 +174,7 @@ var SmoothAgentChat = (function(exports) {
 		}
 	};
 	//#endregion
-	//#region node_modules/.pnpm/@smooai+smooth-operator@0.2.0/node_modules/@smooai/smooth-operator/dist/types.js
+	//#region node_modules/.pnpm/@smooai+smooth-operator@1.8.0/node_modules/@smooai/smooth-operator/dist/types.js
 	/** Every server→client `type` discriminator value. */
 	const EVENT_TYPES = [
 		"immediate_response",
@@ -195,7 +195,7 @@ var SmoothAgentChat = (function(exports) {
 		return typeof frame === "object" && frame !== null && "type" in frame && typeof frame.type === "string" && EVENT_TYPES.includes(frame.type);
 	}
 	//#endregion
-	//#region node_modules/.pnpm/@smooai+smooth-operator@0.2.0/node_modules/@smooai/smooth-operator/dist/client.js
+	//#region node_modules/.pnpm/@smooai+smooth-operator@1.8.0/node_modules/@smooai/smooth-operator/dist/client.js
 	/**
 	* SmoothAgentClient — a minimal, idiomatic, transport-agnostic client for the
 	* smooth-operator WebSocket protocol.
@@ -371,7 +371,7 @@ var SmoothAgentChat = (function(exports) {
 		listeners = /* @__PURE__ */ new Set();
 		unsubscribe = [];
 		constructor(options) {
-			this.transport = options.transport ?? new WebSocketTransport(options.url, options.webSocketFactory);
+			this.transport = options.transport ?? new WebSocketTransport(withConnectionToken(options.url, options.token), options.webSocketFactory);
 			this.requestTimeout = options.requestTimeout ?? 3e4;
 			this.turnTimeout = options.turnTimeout ?? 12e4;
 			this.generateRequestId = options.generateRequestId ?? (() => `req-${globalThis.crypto?.randomUUID?.() ?? Math.random().toString(36).slice(2)}`);
@@ -526,6 +526,26 @@ var SmoothAgentChat = (function(exports) {
 			this.turns.clear();
 		}
 	};
+	/**
+	* Merge a connection auth `token` into a WebSocket URL as a `?token=` query param,
+	* preserving any existing query string. Returns `url` unchanged when no token is
+	* given, so the no-token path is byte-for-byte identical to before. Uses `URL` /
+	* `URLSearchParams` so an existing `?foo=bar` becomes `?foo=bar&token=…` (and the
+	* value is properly percent-encoded) rather than a naive `?`/`&` string-concat.
+	*
+	* Falls back to manual concatenation if `url` is not absolute (so `URL` can't parse
+	* it) — e.g. a relative or mock URL used in tests.
+	*/
+	function withConnectionToken(url, token) {
+		if (!token) return url;
+		try {
+			const parsed = new URL(url);
+			parsed.searchParams.set("token", token);
+			return parsed.toString();
+		} catch {
+			return `${url}${url.includes("?") ? "&" : "?"}token=${encodeURIComponent(token)}`;
+		}
+	}
 	/** Pull the typed `data` payload out of an `immediate_response` event. */
 	function extractImmediateData(event) {
 		if (event.type === "immediate_response") return event.data;