@tavus/widget 0.19.0 → 0.19.2

package/dist/index.mjs

@@ -3048,7 +3048,7 @@ var xn = class extends Error {
 	}
 }, Sn = {
 	name: "@tavus/widget",
-	version: "0.19.0",
+	version: "0.19.2",
 	variant: "widget"
 }, Cn = /* @__PURE__ */ new Set([
 	"Error",
@@ -16323,7 +16323,7 @@ function Gh({ children: e }) {
 			...r,
 			tavus: d,
 			open: s.expand,
-			close: s.collapse
+			close: s.close
 		} : {
 			...r,
 			tavus: d
@@ -30495,7 +30495,11 @@ function KI({ flow: e, welcomeText: t, onUnavailableCancel: n }) {
 }
 //#endregion
 //#region ../core/src/providers/widget-ui-provider.tsx
-function qI({ children: e }) {
+function qI(e, t, n) {
+	let r = e.state === "call", i = r || e.state === "haircheck" || e.isStarting;
+	e.cancel(), r && e.leave(), i && t(), n();
+}
+function JI({ children: e }) {
 	let { config: t } = L(Cr), n = t.peek().customization?.widget, r = n?.expandable ?? "default", i = Kt(r === "start-expanded" || r === "always"), a = Kt(n?.variant ?? "full"), o = Kt(n?.position ?? "bottom-right"), s = Kt(r), c = Kt(n?.avatar?.type ?? "orb"), l = P(r);
 	$t(() => {
 		let e = t.value.customization?.widget, n = e?.expandable ?? "default";
@@ -30519,7 +30523,24 @@ function qI({ children: e }) {
 		h,
 		i
 	]);
-	let _ = F(() => ({
+	let _ = L(qm), v = P(m);
+	v.current = m;
+	let y = P(_);
+	y.current = _;
+	let b = I(() => {
+		if (s.peek() === "always") return;
+		let e = v.current, t = y.current;
+		if (!e || !t) {
+			f();
+			return;
+		}
+		qI({
+			state: e.flowSignal.peek(),
+			isStarting: e.isStarting,
+			cancel: e.cancel,
+			leave: e.leave
+		}, t.end, f);
+	}, [s, f]), x = F(() => ({
 		expanded: i,
 		variant: a,
 		position: o,
@@ -30527,7 +30548,7 @@ function qI({ children: e }) {
 		avatarType: c,
 		toggle: u,
 		expand: d,
-		collapse: f
+		close: b
 	}), [
 		i,
 		a,
@@ -30536,23 +30557,23 @@ function qI({ children: e }) {
 		c,
 		u,
 		d,
-		f
+		b
 	]);
 	return /* @__PURE__ */ R(Vh.Provider, {
-		value: _,
+		value: x,
 		children: e
 	});
 }
 //#endregion
 //#region ../core/src/components/powered-by/index.tsx
-function JI() {
+function YI() {
 	let { config: e } = _h(), t = e.value.customization.branding;
-	return e.value.show_tavus_branding !== !1 && !t?.hide_tavus_badge ? /* @__PURE__ */ R(YI, {}) : t?.logo || t?.text ? /* @__PURE__ */ R(XI, {
+	return e.value.show_tavus_branding !== !1 && !t?.hide_tavus_badge ? /* @__PURE__ */ R(XI, {}) : t?.logo || t?.text ? /* @__PURE__ */ R(ZI, {
 		logo: t.logo,
 		text: t.text
 	}) : null;
 }
-function YI() {
+function XI() {
 	let { isDark: e } = Bj(), t = e.value ? "white" : "#140206";
 	return /* @__PURE__ */ R("a", {
 		href: "https://tavus.io",
@@ -30579,7 +30600,7 @@ function YI() {
 		})] })]
 	});
 }
-function XI({ logo: e, text: t }) {
+function ZI({ logo: e, text: t }) {
 	return /* @__PURE__ */ R("div", {
 		class: "inline-flex items-center gap-1 text-xs text-base-content/50",
 		children: [e ? /* @__PURE__ */ R("img", {
@@ -30591,63 +30612,63 @@ function XI({ logo: e, text: t }) {
 }
 //#endregion
 //#region ../core/src/hooks/use-widget-text.ts
-var ZI = {
+var QI = {
 	title: "Hi! Want to chat?",
 	btn_title: "Start conversation"
 };
-function QI() {
+function $I() {
 	let { config: e } = _h(), t = e.value.customization.widget?.text;
 	return F(() => ({
-		title: t?.title || ZI.title,
-		btn_title: t?.btn_title || ZI.btn_title
+		title: t?.title || QI.title,
+		btn_title: t?.btn_title || QI.btn_title
 	}), [t]);
 }
 //#endregion
 //#region ../core/src/hooks/use-widget-ui.ts
-function $I() {
+function eL() {
 	let e = L(Vh);
 	if (!e) throw Error("useWidgetUI must be used within WidgetUIProvider");
 	return e;
 }
 //#endregion
 //#region ../core/src/components/widget-launcher/widget-avatar.tsx
-var eL = {
+var tL = {
 	xs: "w-6 h-6",
 	sm: "w-8 h-8",
 	md: "w-10 h-10",
 	lg: "w-16 h-16"
-}, tL = {
+}, nL = {
 	xs: "w-3 h-3",
 	sm: "w-4 h-4",
 	md: "w-5 h-5",
 	lg: "w-8 h-8"
 };
-function nL({ size: e = "md", className: t = "" }) {
-	let { avatarType: n } = $I(), { config: r } = _h(), i = D_(r.value);
+function rL({ size: e = "md", className: t = "" }) {
+	let { avatarType: n } = eL(), { config: r } = _h(), i = D_(r.value);
 	return (O_(r.value).background.type === "replica" || n.value === "image") && i ? /* @__PURE__ */ R("div", {
-		class: `relative ${eL[e]} rounded-box overflow-hidden bg-base-300 ${t}`,
+		class: `relative ${tL[e]} rounded-box overflow-hidden bg-base-300 ${t}`,
 		children: /* @__PURE__ */ R(I_, { replica: i })
 	}) : /* @__PURE__ */ R("div", {
-		class: `relative ${eL[e]} rounded-box bg-primary/15 flex items-center justify-center ${t}`,
-		children: /* @__PURE__ */ R("span", { class: `${tL[e]} rounded-full bg-primary animate-pulse` })
+		class: `relative ${tL[e]} rounded-box bg-primary/15 flex items-center justify-center ${t}`,
+		children: /* @__PURE__ */ R("span", { class: `${nL[e]} rounded-full bg-primary animate-pulse` })
 	});
 }
 //#endregion
 //#region ../core/src/components/widget-launcher/widget-launcher.tsx
-function rL({ variant: e }) {
-	let { toggle: t } = $I(), n = QI();
+function iL({ variant: e }) {
+	let { toggle: t } = eL(), n = $I();
 	return e === "tiny" ? /* @__PURE__ */ R("button", {
 		type: "button",
 		onClick: t,
 		"aria-label": n.btn_title,
 		class: "rounded-box overflow-hidden shadow-xl hover:shadow-2xl transition-shadow cursor-pointer",
-		children: /* @__PURE__ */ R(nL, { size: "lg" })
+		children: /* @__PURE__ */ R(rL, { size: "lg" })
 	}) : e === "compact" ? /* @__PURE__ */ R("button", {
 		type: "button",
 		onClick: t,
 		"aria-label": n.btn_title,
 		class: "group flex items-center gap-2.5 py-2.5 pl-2.5 pr-8 rounded-box bg-base-100 text-base-content border border-base-300 shadow-lg hover:shadow-xl transition-shadow cursor-pointer text-left",
-		children: [/* @__PURE__ */ R(nL, { size: "md" }), /* @__PURE__ */ R("span", {
+		children: [/* @__PURE__ */ R(rL, { size: "md" }), /* @__PURE__ */ R("span", {
 			class: "flex flex-col gap-0.5",
 			children: [/* @__PURE__ */ R("span", {
 				class: "text-base font-medium leading-tight",
@@ -30664,7 +30685,7 @@ function rL({ variant: e }) {
 		class: "flex flex-col gap-3 p-3 w-64 rounded-box bg-base-100 text-base-content border border-base-300 shadow-xl hover:shadow-2xl transition-shadow cursor-pointer text-left",
 		children: [/* @__PURE__ */ R("div", {
 			class: "flex items-center gap-2.5",
-			children: [/* @__PURE__ */ R(nL, { size: "md" }), /* @__PURE__ */ R("span", {
+			children: [/* @__PURE__ */ R(rL, { size: "md" }), /* @__PURE__ */ R("span", {
 				class: "text-sm font-medium leading-snug",
 				children: n.title
 			})]
@@ -30682,13 +30703,13 @@ function rL({ variant: e }) {
 }
 //#endregion
 //#region ../core/src/components/widget-launcher/widget-greeting-bubble.tsx
-var iL = "tavus:widget:greeting-dismissed";
-function aL({ anchor: e }) {
-	let t = QI(), { variant: n, expand: r } = $I(), [i, a] = M(!1);
+var aL = "tavus:widget:greeting-dismissed";
+function oL({ anchor: e }) {
+	let t = $I(), { variant: n, expand: r } = eL(), [i, a] = M(!1);
 	N(() => {
 		if (n.value === "tiny") {
 			try {
-				if (sessionStorage.getItem(iL) === "1") return;
+				if (sessionStorage.getItem(aL) === "1") return;
 			} catch {}
 			a(!0);
 		}
@@ -30696,7 +30717,7 @@ function aL({ anchor: e }) {
 	let o = I((e) => {
 		e.stopPropagation();
 		try {
-			sessionStorage.setItem(iL, "1");
+			sessionStorage.setItem(aL, "1");
 		} catch {}
 		a(!1);
 	}, []);
@@ -30728,18 +30749,18 @@ function aL({ anchor: e }) {
 }
 //#endregion
 //#region ../core/src/hooks/use-host-bridge.ts
-function oL() {
+function sL() {
 	let e = L(Uh);
 	if (!e) throw Error("useHostBridge must be used within HostBridgeProvider");
 	return e;
 }
 //#endregion
 //#region ../core/src/shells/widget/widget-popup.tsx
-var sL = "bg-base-100 text-base-content rounded-box border border-base-300 shadow-xl w-[22rem] flex flex-col animate-[tavusPopIn_180ms_ease-out]", cL = "bg-base-100 text-base-content w-[100vw] h-[100dvh] flex flex-col animate-[tavusFadeUp_180ms_ease-out]", lL = "p-1 flex-1 min-h-0", uL = "p-1 flex-1 min-h-0";
-function dL({ variant: e, children: t, onClose: n, fullscreen: r }) {
-	let { expandable: i } = $I(), a = i.value !== "always";
+var cL = "bg-base-100 text-base-content rounded-box border border-base-300 shadow-xl w-[22rem] flex flex-col animate-[tavusPopIn_180ms_ease-out]", lL = "bg-base-100 text-base-content w-[100vw] h-[100dvh] flex flex-col animate-[tavusFadeUp_180ms_ease-out]", uL = "p-1 flex-1 min-h-0", dL = "p-1 flex-1 min-h-0";
+function fL({ variant: e, children: t, onClose: n, fullscreen: r }) {
+	let { expandable: i } = eL(), a = i.value !== "always";
 	return r ? /* @__PURE__ */ R("div", {
-		class: cL,
+		class: lL,
 		children: [
 			/* @__PURE__ */ R("div", {
 				class: "flex items-center justify-end gap-2 px-2.5 py-1.5 border-b border-base-300",
@@ -30755,18 +30776,18 @@ function dL({ variant: e, children: t, onClose: n, fullscreen: r }) {
 				})
 			}),
 			/* @__PURE__ */ R("div", {
-				class: uL,
+				class: dL,
 				children: t
 			}),
 			/* @__PURE__ */ R("div", {
 				class: "flex justify-end px-2.5",
-				children: /* @__PURE__ */ R(JI, {})
+				children: /* @__PURE__ */ R(YI, {})
 			})
 		]
 	}) : /* @__PURE__ */ R("div", {
 		class: "flex flex-col h-[min(34rem,calc(100dvh-3rem))]",
 		children: [/* @__PURE__ */ R("div", {
-			class: `${sL} flex-1 overflow-hidden`,
+			class: `${cL} flex-1 overflow-hidden`,
 			children: [/* @__PURE__ */ R("div", {
 				class: "flex items-center justify-end gap-2 px-2.5 pt-1.5 shrink-0",
 				children: a && /* @__PURE__ */ R("button", {
@@ -30780,50 +30801,46 @@ function dL({ variant: e, children: t, onClose: n, fullscreen: r }) {
 					})
 				})
 			}), /* @__PURE__ */ R("div", {
-				class: lL,
+				class: uL,
 				children: t
 			})]
 		}), /* @__PURE__ */ R("div", {
 			class: "flex justify-end pr-2 pt-1.5 shrink-0",
-			children: /* @__PURE__ */ R(JI, {})
+			children: /* @__PURE__ */ R(YI, {})
 		})]
 	});
 }
 //#endregion
 //#region ../core/src/shells/widget/widget-shell.tsx
-var fL = en("Widget"), pL = "1rem", mL = 480;
-function hL(e, t, n) {
-	let r = e.state === "call", i = r || e.state === "haircheck" || e.isStarting;
-	e.cancel(), r && e.leave(), i && t(), n();
-}
+var pL = en("Widget"), mL = "1rem", hL = 480;
 function gL() {
-	return typeof window > "u" ? !1 : window.innerWidth <= mL;
+	return typeof window > "u" ? !1 : window.innerWidth <= hL;
 }
 function _L(e) {
 	switch (e) {
 		case "bottom-right": return {
-			bottom: pL,
-			right: pL
+			bottom: mL,
+			right: mL
 		};
 		case "bottom-left": return {
-			bottom: pL,
-			left: pL
+			bottom: mL,
+			left: mL
 		};
 		case "top-right": return {
-			top: pL,
-			right: pL
+			top: mL,
+			right: mL
 		};
 		case "top-left": return {
-			top: pL,
-			left: pL
+			top: mL,
+			left: mL
 		};
 		case "top": return {
-			top: pL,
+			top: mL,
 			left: "50%",
 			transform: "translateX(-50%)"
 		};
 		case "bottom": return {
-			bottom: pL,
+			bottom: mL,
 			left: "50%",
 			transform: "translateX(-50%)"
 		};
@@ -30840,64 +30857,58 @@ function yL(e) {
 	return e === "bottom-left" || e === "top-left" ? "left" : "right";
 }
 function bL() {
-	let { config: e, initError: t } = _h(), n = QI(), { expanded: r, position: i, variant: a, collapse: o } = $I(), { end: s } = Qv(), { shadowHost: c } = oL(), l = $_(), u = Kt(gL());
+	let { config: e, initError: t } = _h(), n = $I(), { expanded: r, position: i, variant: a, close: o } = eL(), { shadowHost: s } = sL(), c = $_(), l = Kt(gL());
 	N(() => {
 		if (typeof window > "u") return;
-		u.value = gL();
+		l.value = gL();
 		let e = () => {
-			u.value = gL();
+			l.value = gL();
 		};
 		return window.addEventListener("resize", e), () => window.removeEventListener("resize", e);
-	}, [u]);
-	let d = F(() => ({ fallback_button: n.btn_title }), [n.btn_title]), f = I(() => {
-		hL(l, s, o);
-	}, [
-		l,
-		s,
-		o
-	]);
+	}, [l]);
+	let u = F(() => ({ fallback_button: n.btn_title }), [n.btn_title]);
 	if ($t(() => {
-		let e = c.value, t = i.value, n = r.value, a = n && u.value;
+		let e = s.value, t = i.value, n = r.value, a = n && l.value;
 		if (e) {
 			if (a) e.style.top = "0", e.style.right = "0", e.style.bottom = "0", e.style.left = "0", e.style.transform = "";
 			else {
 				let n = _L(t);
 				for (let t of vL) e.style[t] = n[t] ?? "";
 			}
-			e.dataset.tavusWidgetPosition = t, e.dataset.tavusWidgetExpanded = n ? "true" : "false", e.dataset.tavusWidgetFullscreen = a ? "true" : "false", e.dataset.tavusWidgetSmall = u.value ? "true" : "false";
+			e.dataset.tavusWidgetPosition = t, e.dataset.tavusWidgetExpanded = n ? "true" : "false", e.dataset.tavusWidgetFullscreen = a ? "true" : "false", e.dataset.tavusWidgetSmall = l.value ? "true" : "false";
 		}
-	}), t.value) return fL.error("Widget cannot initialize (init request failed):", t.value), null;
-	if (e.value.is_available === !1 && e.value.unavailable_reason === "total_limit") return fL.error("Widget is unavailable (total_limit reached) — not rendering"), null;
+	}), t.value) return pL.error("Widget cannot initialize (init request failed):", t.value), null;
+	if (e.value.is_available === !1 && e.value.unavailable_reason === "total_limit") return pL.error("Widget is unavailable (total_limit reached) — not rendering"), null;
 	if (!r.value) {
 		let e = yL(i.value), t = e === "right" ? "flex items-end gap-2 justify-end" : "flex items-end gap-2 flex-row-reverse justify-end", n = e === "right" ? "justify-end pr-2" : "justify-start pl-2";
 		return /* @__PURE__ */ R("div", {
 			class: "flex flex-col",
 			children: [/* @__PURE__ */ R("div", {
 				class: t,
-				children: [/* @__PURE__ */ R(aL, { anchor: e }), /* @__PURE__ */ R(rL, { variant: a.value })]
+				children: [/* @__PURE__ */ R(oL, { anchor: e }), /* @__PURE__ */ R(iL, { variant: a.value })]
 			}), /* @__PURE__ */ R("div", {
 				class: `flex ${n} pt-1.5`,
-				children: /* @__PURE__ */ R(JI, {})
+				children: /* @__PURE__ */ R(YI, {})
 			})]
 		});
 	}
-	return e.value.is_available === !1 ? /* @__PURE__ */ R(dL, {
+	return e.value.is_available === !1 ? /* @__PURE__ */ R(fL, {
 		variant: a.value,
-		fullscreen: u.value,
-		onClose: f,
+		fullscreen: l.value,
+		onClose: o,
 		children: /* @__PURE__ */ R(sg, { children: /* @__PURE__ */ R(Q_, {
 			cause: e.value.unavailable_reason ?? "daily_limit",
 			canRetry: !1,
 			onRetry: () => {}
 		}) })
-	}) : /* @__PURE__ */ R(dL, {
+	}) : /* @__PURE__ */ R(fL, {
 		variant: a.value,
-		fullscreen: u.value,
-		onClose: f,
+		fullscreen: l.value,
+		onClose: o,
 		children: /* @__PURE__ */ R(sg, { children: /* @__PURE__ */ R(KI, {
-			flow: l,
-			welcomeText: d,
-			onUnavailableCancel: () => l.restart()
+			flow: c,
+			welcomeText: u,
+			onUnavailableCancel: () => c.restart()
 		}) })
 	});
 }
@@ -30918,7 +30929,7 @@ function SL(e) {
 			"memory-stores": e["memory-stores"],
 			"base-url": e["base-url"],
 			token: e.token,
-			children: /* @__PURE__ */ R(wr, { children: /* @__PURE__ */ R(Er, { children: /* @__PURE__ */ R(Jm, { children: /* @__PURE__ */ R(gh, { children: /* @__PURE__ */ R(Bh, { children: /* @__PURE__ */ R(qI, { children: /* @__PURE__ */ R(Gh, { children: /* @__PURE__ */ R(qh, { children: /* @__PURE__ */ R(bL, {}) }) }) }) }) }) }) }) })
+			children: /* @__PURE__ */ R(wr, { children: /* @__PURE__ */ R(Er, { children: /* @__PURE__ */ R(Jm, { children: /* @__PURE__ */ R(gh, { children: /* @__PURE__ */ R(Bh, { children: /* @__PURE__ */ R(JI, { children: /* @__PURE__ */ R(Gh, { children: /* @__PURE__ */ R(qh, { children: /* @__PURE__ */ R(bL, {}) }) }) }) }) }) }) }) })
 		})
 	] });
 }

package/dist/integration.d.ts

@@ -82,7 +82,13 @@ interface TavusElementTavusApi {
     sendMessage?: (interaction: TavusInteraction) => void;
 }
 export interface TavusElement extends HTMLElement {
+    /** Expands the popup to the preview screen. `<tavus-widget>` only. */
     open?: () => void;
+    /**
+     * The popup's own close path. Ends a call in progress and cancels a pending
+     * start before it collapses; `tavus:conversation-ended` follows for a call
+     * that was live. `<tavus-widget>` only.
+     */
     close?: () => void;
     /** Creates the room without joining it; the next start joins it. Rejects on failure. */
     createConversation?: () => Promise<{

package/package.json

@@ -1,28 +1,33 @@
 {
   "name": "@tavus/widget",
-  "version": "0.19.0",
-  "description": "Tavus conversational video AI <tavus-widget> launcher custom element for the web.",
+  "version": "0.19.2",
+  "description": "Add a face-to-face Tavus PAL to any website with the <tavus-widget> floating launcher. Fully managed conversational video, no backend or API key in the browser.",
   "keywords": [
-    "ai",
+    "ai-agent",
+    "ai-avatar",
+    "chat-widget",
     "conversational-ai",
+    "conversational-video",
     "custom-element",
-    "preact",
+    "cvi",
+    "deployments",
+    "face-to-face",
+    "launcher",
+    "no-backend",
+    "pal",
+    "real-time",
     "tavus",
-    "video",
+    "video-agent",
     "web-component",
+    "webrtc",
     "widget"
   ],
-  "homepage": "https://github.com/Tavus-Engineering/tavus-deployment/tree/main/packages/widget#readme",
+  "homepage": "https://docs.tavus.io/sections/deployments/widget",
   "bugs": {
-    "url": "https://github.com/Tavus-Engineering/tavus-deployment/issues"
+    "email": "support@tavus.io"
   },
   "license": "MIT",
   "author": "Tavus, Inc.",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/Tavus-Engineering/tavus-deployment.git",
-    "directory": "packages/widget"
-  },
   "files": [
     "dist",
     "README.md",