@thewhatmatters/wmds 0.4.1 → 0.4.3

package/dist/components/organisms/ChatDock/ChatDock.js

@@ -1,21 +1,23 @@
 "use client";
 import { cn as e } from "../../../lib/cn.js";
-import { motionBeatSeconds as t, motionStaggerSeconds as n, motionTransitionProp as r, readMotionDurationSeconds as i } from "../../../lib/motion.js";
-import { ButtonIcon as a } from "../../atoms/Button/ButtonIcon.js";
-import { Button as o } from "../../atoms/Button/Button.js";
-import { IconButton as s } from "../../atoms/IconButton/IconButton.js";
+import { motionBeatSeconds as t, motionStaggerSeconds as n, motionTransitionProp as r } from "../../../lib/motion.js";
+import { ButtonIcon as i } from "../../atoms/Button/ButtonIcon.js";
+import { Button as a } from "../../atoms/Button/Button.js";
+import { IconButton as o } from "../../atoms/IconButton/IconButton.js";
 import { Status as ee } from "../../atoms/Status/Status.js";
 import { PromptBar as te } from "../../molecules/PromptBar/PromptBar.js";
-import { OverlayPanelHeader as ne } from "../Dialog/OverlayPanelHeader.js";
-import { subscribeChatDockViewport as re, useChatDockVisibleArea as ie, useChatDockWide as ae } from "./chatDockViewport.js";
-import { ChatDockGate as c, chatDockGateDefaultLabels as l } from "./ChatDockGate.js";
-import { chatDockAssistantMessageClasses as u, chatDockComposerAreaClasses as oe, chatDockComposerClasses as se, chatDockComposerFootSpacerClasses as ce, chatDockComposerLayerClasses as le, chatDockDisclaimerClasses as ue, chatDockDockClasses as de, chatDockDockHoverClasses as fe, chatDockFollowUpRowClasses as pe, chatDockFollowUpsComposerClasses as me, chatDockFollowUpsInlineClasses as he, chatDockGridClasses as ge, chatDockMarkClasses as _e, chatDockPillClasses as ve, chatDockPillsClasses as ye, chatDockPlacements as d, chatDockReplyActionsClasses as be, chatDockReplyActionsPendingClasses as xe, chatDockReplyButtonsClasses as Se, chatDockReplyClasses as Ce, chatDockReplyMetaClasses as we, chatDockRootClasses as Te, chatDockRootRaisedClasses as Ee, chatDockSuggestionLabelClasses as De, chatDockSuggestionListClasses as Oe, chatDockSuggestionRowContentClasses as ke, chatDockThinkingClasses as Ae, chatDockThreadClasses as je, chatDockUserMessageClasses as Me, chatDockWindowClasses as Ne, chatDockWindowContentClasses as Pe } from "./chatDockStyles.js";
-import { useContext as Fe, useEffect as f, useId as Ie, useLayoutEffect as p, useRef as m, useState as h, useSyncExternalStore as Le } from "react";
-import { Check as Re, Copy as ze, CornerDownRight as Be, ThumbsDown as Ve, ThumbsUp as He } from "lucide-react";
-import { Fragment as Ue, jsx as g, jsxs as _ } from "react/jsx-runtime";
-import { AnimatePresence as v, MotionConfigContext as We, motion as y, useReducedMotion as Ge } from "motion/react";
+import { inertOutside as ne, lockBodyScroll as re, trapFocus as ie } from "../../../lib/dialogOverlay.js";
+import { OverlayPanelHeader as ae } from "../Dialog/OverlayPanelHeader.js";
+import { ChatDockGateContext as oe } from "./chatDockGateContext.js";
+import { subscribeChatDockViewport as se, useChatDockReducedMotion as ce, useChatDockVisibleArea as le, useChatDockWide as ue } from "./chatDockViewport.js";
+import { ChatDockGate as s, chatDockGateDefaultLabels as c } from "./ChatDockGate.js";
+import { chatDockAssistantMessageClasses as l, chatDockComposerClasses as de, chatDockComposerFootSpacerClasses as fe, chatDockComposerHiddenClasses as pe, chatDockDisclaimerClasses as me, chatDockDockClasses as he, chatDockDockHoverClasses as ge, chatDockFollowUpRowClasses as _e, chatDockFollowUpsComposerClasses as ve, chatDockFollowUpsInlineClasses as ye, chatDockGateLayerClasses as be, chatDockGridClasses as xe, chatDockMarkClasses as Se, chatDockPillClasses as Ce, chatDockPillsClasses as we, chatDockPlacements as u, chatDockReplyActionsClasses as Te, chatDockReplyActionsPendingClasses as Ee, chatDockReplyButtonsClasses as De, chatDockReplyClasses as Oe, chatDockReplyMetaClasses as ke, chatDockRootClasses as Ae, chatDockRootModalClasses as je, chatDockRootRaisedClasses as Me, chatDockScrimClasses as Ne, chatDockSuggestionLabelClasses as Pe, chatDockSuggestionListClasses as Fe, chatDockSuggestionRowContentClasses as Ie, chatDockThinkingClasses as Le, chatDockThreadClasses as Re, chatDockUserMessageClasses as ze, chatDockWindowClasses as Be, chatDockWindowContentClasses as Ve } from "./chatDockStyles.js";
+import { useContext as He, useEffect as d, useId as Ue, useLayoutEffect as We, useRef as f, useState as p, useSyncExternalStore as Ge } from "react";
+import { Check as Ke, Copy as qe, CornerDownRight as Je, ThumbsDown as Ye, ThumbsUp as Xe } from "lucide-react";
+import { Fragment as Ze, jsx as m, jsxs as h } from "react/jsx-runtime";
+import { AnimatePresence as g, MotionConfigContext as Qe, motion as _ } from "motion/react";
 //#region src/components/organisms/ChatDock/ChatDock.tsx
-var Ke = {
+var $e = {
 	close: "Close chat",
 	thinking: "Thinking…",
 	conversation: "Conversation",
@@ -27,18 +29,18 @@ var Ke = {
 	copied: "Copied",
 	helpful: "Mark this reply helpful",
 	notHelpful: "Mark this reply not helpful"
-}, b = ["inline", "composer"];
-function qe(e) {
+}, v = ["inline", "composer"];
+function et(e) {
 	return e.filter((e) => e.prompt != null && e.prompt.trim() !== "");
 }
-function Je(e, t) {
+function tt(e, t) {
 	return e.length > 0 && t.length === 0;
 }
-function Ye({ followUps: e, messages: t, thinking: n, sentAfterId: r }) {
+function nt({ followUps: e, messages: t, thinking: n, sentAfterId: r }) {
 	let i = t[t.length - 1];
 	return e.length > 0 && !n && i?.role === "assistant" && i.id !== r;
 }
-function Xe({ message: e, isLatest: t, thinking: n, takesVotes: r }) {
+function rt({ message: e, isLatest: t, thinking: n, takesVotes: r }) {
 	if (e.role !== "assistant") return null;
 	let i = {
 		copy: e.copyText != null,
@@ -50,189 +52,172 @@ function Xe({ message: e, isLatest: t, thinking: n, takesVotes: r }) {
 		ready: !(t && n)
 	};
 }
-var Ze = 2e3, Qe = 48;
-function $e() {
+var it = 2e3, at = 48;
+function ot() {
 	return window.innerHeight;
 }
-function et() {
+function st() {
 	return Number.parseFloat(getComputedStyle(document.documentElement).fontSize) || 16;
 }
-function x(e, t, n) {
+function ct(e, t, n) {
 	return e === "inline" ? 32 * n : Math.max(0, Math.min(40 * n, t - 7 * n));
 }
-var S = 7, C = 12;
-function tt({ windowHeight: e, headerHeight: t, bottomInset: n, remPx: r }) {
-	let i = r + t + .75 * r + S * r + .75 * r + n;
-	return Math.round(Math.max(C * r, e - i));
-}
-function w({ title: c, subtitle: l, mark: d, greeting: b, messages: S = [], thinking: C = !1, suggestions: w = [], onSend: nt, onSuggestionSelect: rt, followUps: T = [], followUpsPlacement: it = "inline", onMessageFeedback: at, gate: ot, open: st, defaultOpen: ct = !1, onOpenChange: lt, placeholder: ut, disclaimer: E, labels: dt, placement: D = "fixed", className: ft }) {
-	let O = {
-		...Ke,
-		...dt
-	}, pt = Ie(), mt = Ie(), { reducedMotion: ht } = Fe(We), k = Ge() === !0 || ht === "always", A = ae(), gt = Le(re, $e, () => 800), j = Le(re, et, () => 16), _t = st !== void 0, [vt, yt] = h(ct), M = _t ? st : vt, [bt, xt] = h(""), [St, Ct] = h(null), [N, wt] = h(null), [Tt, Et] = h(!M);
-	M && Tt && Et(!1);
-	let P = !M && Tt, F = ot != null, I = F && M, [Dt, Ot] = h(I), [L, R] = h(!1);
-	Dt !== I && (Ot(I), R(!0));
-	let [kt, At] = h(null), [jt, Mt] = h(!I);
-	I && jt && Mt(!1);
-	let [Nt, Pt] = h(I);
-	!I && Nt && Pt(!1);
-	let z = ie(D === "fixed" && !A && !P), B = m(null), Ft = m(null), It = m(null), Lt = m(null), Rt = m(null), V = m(null), zt = m(null), Bt = m(F), H = m(I), U = m(null), Vt = m(null), Ht = m(!0), W = m(!1), Ut = m(M), Wt = m(M);
-	function G(e) {
-		e !== M && (_t || yt(e), lt?.(e));
+function y({ title: s, subtitle: c, mark: u, greeting: v, messages: y = [], thinking: b = !1, suggestions: x = [], onSend: lt, onSuggestionSelect: ut, followUps: S = [], followUpsPlacement: dt = "inline", onMessageFeedback: ft, gate: pt, open: mt, defaultOpen: ht = !1, onOpenChange: gt, placeholder: _t, disclaimer: C, labels: vt, placement: w = "fixed", className: yt }) {
+	let T = {
+		...$e,
+		...vt
+	}, bt = Ue(), xt = Ue(), { reducedMotion: St } = He(Qe), E = ce(St), D = ue(), Ct = Ge(se, ot, () => 800), O = Ge(se, st, () => 16), wt = mt !== void 0, [Tt, Et] = p(ht), k = wt ? mt : Tt, [Dt, Ot] = p(""), [kt, At] = p(null), [A, jt] = p(null), [Mt, Nt] = p(!k);
+	k && Mt && Nt(!1);
+	let j = !k && Mt, M = pt != null, N = M && k, P = w === "fixed" && N, [Pt, Ft] = p(M);
+	!M && Pt && Ft(!1);
+	let [It, Lt] = p(N);
+	!N && It && Lt(!1);
+	let F = le(w === "fixed" && !D && !j), Rt = f(null), I = f(null), zt = f(null), Bt = f(null), Vt = f(null), Ht = f(null), Ut = f(M), L = f(N), R = f(null), Wt = f(null), z = f(!0), B = f(!1), V = f(k), H = f(k);
+	function U(e) {
+		e !== k && (wt || Et(e), gt?.(e));
 	}
 	function Gt(e) {
 		let t = e.trim();
-		t !== "" && (G(!0), Ht.current = !0, xt(""), Ct(S[S.length - 1]?.id ?? null), nt(t));
+		t !== "" && (U(!0), z.current = !0, Ot(""), At(y[y.length - 1]?.id ?? null), lt(t));
 	}
-	function Kt(e) {
-		rt?.(e), e.prompt != null && Gt(e.prompt);
+	function W(e) {
+		ut?.(e), e.prompt != null && Gt(e.prompt);
 	}
-	function qt(e) {
+	function Kt(e) {
 		let t = e.copyText, n = typeof navigator > "u" ? void 0 : navigator.clipboard;
-		t != null && n != null && n.writeText(t).then(() => wt({
+		t != null && n != null && n.writeText(t).then(() => jt({
 			id: e.id,
 			at: Date.now()
 		}), () => void 0);
 	}
-	f(() => {
-		if (N == null) return;
-		let e = window.setTimeout(() => wt(null), Ze);
+	d(() => {
+		if (A == null) return;
+		let e = window.setTimeout(() => jt(null), it);
 		return () => window.clearTimeout(e);
-	}, [N]);
-	function Jt(e) {
-		Kt(e), U.current?.focus();
+	}, [A]);
+	function qt(e) {
+		W(e), R.current?.focus();
 	}
-	function Yt(e) {
-		Kt(e), e.prompt != null && U.current?.focus();
+	function Jt(e) {
+		W(e), e.prompt != null && R.current?.focus();
 	}
-	f(() => {
-		Wt.current = M;
-		let e = U.current;
-		if (e != null && M && !Ut.current) document.activeElement !== e && e.focus();
-		else if (e != null && !M && Ut.current) {
-			let t = document.activeElement, n = t == null || t === document.body || B.current?.contains(t) === !0;
-			t !== e && n && (W.current = !0, e.focus(), W.current = !1);
+	d(() => {
+		H.current = k;
+		let e = R.current;
+		if (e != null && k && !V.current) document.activeElement !== e && e.focus();
+		else if (e != null && !k && V.current) {
+			let t = document.activeElement, n = t == null || t === document.body || I.current?.contains(t) === !0;
+			t !== e && n && (B.current = !0, e.focus(), B.current = !1);
 		}
-		Ut.current = M;
-	}, [M]), f(() => {
-		F && !Bt.current && !Wt.current && G(!0), Bt.current = F;
-	}), f(() => {
-		if (I && !H.current) {
-			let e = zt.current;
+		V.current = k;
+	}, [k]), d(() => {
+		M && !Ut.current && !H.current && U(!0), Ut.current = M;
+	}), d(() => {
+		if (N && !L.current) {
+			let e = Ht.current;
 			(e?.querySelector("[data-chat-dock-gate-focus]") ?? e)?.focus({ preventScroll: !0 });
-		} else if (!I && H.current && M) {
-			let e = U.current, t = document.activeElement, n = t == null || t === document.body || B.current?.contains(t) === !0;
-			e != null && n && (W.current = !0, e.focus({ preventScroll: !0 }), W.current = !1);
+		} else if (!N && L.current && k) {
+			let e = R.current, t = document.activeElement, n = t == null || t === document.body || I.current?.contains(t) === !0;
+			e != null && n && (B.current = !0, e.focus({ preventScroll: !0 }), B.current = !1);
 		}
-		H.current = I;
-	}, [I, M]), f(() => {
-		if (!L) return;
-		let e = (i("fast") + i("medium")) * 1e3 + 100, t = window.setTimeout(() => R(!1), e);
-		return () => window.clearTimeout(t);
-	}, [L]), p(() => {
-		let e = Rt.current;
-		if (e == null || typeof ResizeObserver > "u") return;
-		let t = new ResizeObserver(() => At(e.offsetHeight));
-		return t.observe(e), () => {
-			t.disconnect();
+		L.current = N;
+	}, [N, k]), d(() => {
+		if (!P) return;
+		let e = Rt.current, t = I.current;
+		if (e == null || t == null) return;
+		let n = ne(e), r = re(), i = ie(t);
+		return () => {
+			i(), r(), n();
 		};
-	}, []);
-	let Xt = E != null, K = D === "fixed" && !A ? "rise" : "grow";
-	p(() => {
-		let e = B.current, t = It.current, n = Lt.current;
+	}, [P]);
+	let Yt = C != null, G = w === "fixed" && !D ? "rise" : "grow";
+	We(() => {
+		let e = I.current, t = Bt.current, n = Vt.current;
 		if (e == null || t == null || n == null) return;
 		let r = () => {
-			let r = K === "rise" ? Math.max(0, window.innerHeight - z.bottom - e.getBoundingClientRect().bottom) : 0;
-			Ft.current?.style.setProperty("--chat-dock-composer", `${t.offsetHeight + n.offsetHeight + r}px`);
-			let i = tt({
-				windowHeight: K === "rise" ? window.innerHeight - z.top - z.bottom : x(D, window.innerHeight, j),
-				headerHeight: V.current?.offsetHeight || 4 * j,
-				bottomInset: n.offsetHeight + r,
-				remPx: j
-			});
-			e.style.setProperty("--chat-dock-gate-max", `${i}px`);
+			let r = G === "rise" ? Math.max(0, window.innerHeight - F.bottom - e.getBoundingClientRect().bottom) : 0;
+			zt.current?.style.setProperty("--chat-dock-composer", `${t.offsetHeight + n.offsetHeight + r}px`);
 		};
 		if (r(), typeof ResizeObserver > "u") return;
 		let i = new ResizeObserver(r);
-		return i.observe(t), i.observe(n), V.current != null && i.observe(V.current), () => {
+		return i.observe(t), i.observe(n), () => {
 			i.disconnect();
 		};
 	}, [
-		Xt,
-		K,
-		gt,
-		z.top,
-		z.bottom,
-		D,
-		j,
-		I
-	]), p(() => {
-		let e = Vt.current;
-		e != null && Ht.current && (e.scrollTop = e.scrollHeight);
+		Yt,
+		G,
+		Ct,
+		F.top,
+		F.bottom
+	]), We(() => {
+		let e = Wt.current;
+		e != null && z.current && (e.scrollTop = e.scrollHeight);
 	});
-	function Zt(e) {
-		!M || I || e.key !== "Escape" || e.defaultPrevented || (e.preventDefault(), G(!1));
+	function Xt(e) {
+		!k || e.key !== "Escape" || e.defaultPrevented || (e.preventDefault(), U(!1));
 	}
-	let Qt = qe(w), $t = !I && Je(w, S), en = !I && Ye({
-		followUps: T,
-		messages: S,
-		thinking: C,
-		sentAfterId: St
-	}), q = M ? "open" : "closed", J = r("medium"), Y = r("fast"), tn = n(), nn = t(1), X = tn, Z = { duration: 0 }, Q = {
-		default: Z,
-		opacity: Y
-	}, rn = 3.25 * j, an = {
-		height: rn,
+	let Zt = {
+		closeWindow: () => U(!1),
+		closeLabel: T.close
+	}, Qt = et(x), $t = !M && tt(x, y), en = !M && nt({
+		followUps: S,
+		messages: y,
+		thinking: b,
+		sentAfterId: kt
+	}), K = k ? "open" : "closed", q = r("medium"), J = r("fast"), Y = n(), X = t(1), Z = Y, Q = { duration: 0 }, $ = {
+		default: Q,
+		opacity: J
+	}, tn = 3.25 * O, nn = {
+		height: tn,
 		left: 0,
 		right: 0,
-		borderRadius: rn / 2
-	}, on = {
-		height: x(D, gt, j),
-		left: -j,
-		right: -j,
-		borderRadius: j
-	}, sn = k ? {
+		borderRadius: tn / 2
+	}, rn = {
+		height: ct(w, Ct, O),
+		left: -O,
+		right: -O,
+		borderRadius: O
+	}, an = E ? {
 		open: {
-			...K === "grow" ? on : { y: 0 },
+			...G === "grow" ? rn : { y: 0 },
 			opacity: 1,
-			transition: Q
+			transition: $
 		},
 		closed: {
-			...K === "grow" ? on : { y: 0 },
+			...G === "grow" ? rn : { y: 0 },
 			opacity: 0,
-			transition: Q
+			transition: $
 		}
-	} : K === "grow" ? {
+	} : G === "grow" ? {
 		open: {
-			...on,
+			...rn,
 			opacity: 1,
-			transition: J
+			transition: q
 		},
 		closed: {
-			...an,
+			...nn,
 			opacity: 1,
 			transition: {
-				...J,
-				delay: X
+				...q,
+				delay: Z
 			}
 		}
 	} : {
 		open: {
 			y: 0,
 			opacity: 1,
-			transition: J
+			transition: q
 		},
 		closed: {
 			y: "100%",
 			opacity: 1,
 			transition: {
-				...J,
-				delay: X
+				...q,
+				delay: Z
 			}
 		}
-	}, cn = {
-		variants: k ? {
+	}, on = {
+		variants: E ? {
 			open: {},
 			closed: {}
 		} : {
@@ -240,86 +225,86 @@ function w({ title: c, subtitle: l, mark: d, greeting: b, messages: S = [], thin
 				opacity: 1,
 				y: 0,
 				transition: {
-					...Y,
-					delay: nn + e * tn
+					...J,
+					delay: X + e * Y
 				}
 			}),
 			closed: {
 				opacity: 0,
 				y: 8,
-				transition: Y
+				transition: J
 			}
 		},
 		initial: !1,
-		animate: q
-	}, ln = {
+		animate: K
+	}, sn = {
 		open: {
 			width: 0,
 			opacity: 0,
-			transition: k ? Q : {
-				width: J,
-				opacity: Y
+			transition: E ? $ : {
+				width: q,
+				opacity: J
 			}
 		},
 		closed: {
 			width: "auto",
 			opacity: 1,
-			transition: k ? Q : {
+			transition: E ? $ : {
 				width: {
-					...J,
-					delay: X
+					...q,
+					delay: Z
 				},
 				opacity: {
-					...Y,
-					delay: nn
+					...J,
+					delay: X
 				}
 			}
 		}
-	}, un = {
+	}, cn = {
 		open: {
 			height: "auto",
 			opacity: 1,
-			transition: k ? Q : {
-				height: J,
+			transition: E ? $ : {
+				height: q,
 				opacity: {
-					...Y,
-					delay: nn
+					...J,
+					delay: X
 				}
 			}
 		},
 		closed: {
 			height: 0,
 			opacity: 0,
-			transition: k ? Q : {
+			transition: E ? $ : {
 				height: {
-					...J,
-					delay: X
+					...q,
+					delay: Z
 				},
-				opacity: Y
+				opacity: J
 			}
 		}
-	}, dn = {
-		initial: !k && "hidden",
-		animate: M ? "visible" : "folded",
+	}, ln = {
+		initial: !E && "hidden",
+		animate: k ? "visible" : "folded",
 		exit: {
 			opacity: 0,
-			transition: Z
+			transition: Q
 		},
 		variants: {
 			hidden: {},
 			visible: {
 				opacity: 1,
 				transition: {
-					...Y,
-					staggerChildren: tn
+					...J,
+					staggerChildren: Y
 				}
 			},
 			folded: {
 				opacity: 0,
-				transition: k ? Z : Y
+				transition: E ? Q : J
 			}
 		}
-	}, fn = {
+	}, un = {
 		hidden: {
 			opacity: 0,
 			y: 6
@@ -327,147 +312,178 @@ function w({ title: c, subtitle: l, mark: d, greeting: b, messages: S = [], thin
 		visible: {
 			opacity: 1,
 			y: 0,
-			transition: Y
+			transition: J
 		}
-	}, $ = (e) => e.preventDefault(), pn = A ? "sm" : "md";
-	function mn(t, n) {
-		let r = N?.id === t.id, i = t.feedback ?? null, a = (e) => at?.(t, i === e ? null : e);
-		return /* @__PURE__ */ _("div", {
-			className: e(be, n.ready ? void 0 : xe),
+	}, dn = (e) => e.preventDefault(), fn = D ? "sm" : "md";
+	function pn(t, n) {
+		let r = A?.id === t.id, i = t.feedback ?? null, a = (e) => ft?.(t, i === e ? null : e);
+		return /* @__PURE__ */ h("div", {
+			className: e(Te, n.ready ? void 0 : Ee),
 			"data-reply-actions": n.ready ? "ready" : "pending",
-			children: [n.copy || n.vote ? /* @__PURE__ */ _("div", {
-				className: Se,
-				children: [n.copy ? /* @__PURE__ */ g(s, {
-					size: pn,
-					icon: g(r ? Re : ze, {}),
-					"aria-label": r ? O.copied : O.copy,
-					onClick: () => qt(t)
-				}) : null, n.vote ? /* @__PURE__ */ _(Ue, { children: [/* @__PURE__ */ g(s, {
-					size: pn,
-					icon: /* @__PURE__ */ g(He, {}),
-					"aria-label": O.helpful,
+			children: [n.copy || n.vote ? /* @__PURE__ */ h("div", {
+				className: De,
+				children: [n.copy ? /* @__PURE__ */ m(o, {
+					size: fn,
+					icon: m(r ? Ke : qe, {}),
+					"aria-label": r ? T.copied : T.copy,
+					onClick: () => Kt(t)
+				}) : null, n.vote ? /* @__PURE__ */ h(Ze, { children: [/* @__PURE__ */ m(o, {
+					size: fn,
+					icon: /* @__PURE__ */ m(Xe, {}),
+					"aria-label": T.helpful,
 					pressed: i === "up",
 					onClick: () => a("up")
-				}), /* @__PURE__ */ g(s, {
-					size: pn,
-					icon: /* @__PURE__ */ g(Ve, {}),
-					"aria-label": O.notHelpful,
+				}), /* @__PURE__ */ m(o, {
+					size: fn,
+					icon: /* @__PURE__ */ m(Ye, {}),
+					"aria-label": T.notHelpful,
 					pressed: i === "down",
 					onClick: () => a("down")
 				})] }) : null]
-			}) : null, t.meta == null ? null : /* @__PURE__ */ _("p", {
-				className: we,
-				children: [t.meta.label, t.meta.description == null ? null : /* @__PURE__ */ _("span", {
+			}) : null, t.meta == null ? null : /* @__PURE__ */ h("p", {
+				className: ke,
+				children: [t.meta.label, t.meta.description == null ? null : /* @__PURE__ */ h("span", {
 					className: "sr-only",
 					children: [". ", t.meta.description]
 				})]
 			})]
 		});
 	}
-	return /* @__PURE__ */ g("div", {
-		className: e(Te[D], D === "fixed" && !P ? Ee : void 0, ft),
-		"data-open": M ? "" : void 0,
-		"data-gate": I ? "" : void 0,
-		style: z.top > 0 || z.bottom > 0 ? {
-			"--chat-dock-vv-top": `${z.top}px`,
-			"--chat-dock-vv-bottom": `${z.bottom}px`
+	return /* @__PURE__ */ h("div", {
+		ref: Rt,
+		className: e(Ae[w], w === "fixed" && !j ? Me : void 0, P ? je : void 0, yt),
+		"data-open": k ? "" : void 0,
+		"data-gate": N ? "" : void 0,
+		style: F.top > 0 || F.bottom > 0 ? {
+			"--chat-dock-vv-top": `${F.top}px`,
+			"--chat-dock-vv-bottom": `${F.bottom}px`
 		} : void 0,
-		children: /* @__PURE__ */ g("div", {
-			className: ge,
-			children: /* @__PURE__ */ g("div", {
+		children: [/* @__PURE__ */ m(g, {
+			initial: !1,
+			children: P ? /* @__PURE__ */ m(_.div, {
+				className: Ne,
+				"aria-hidden": "true",
+				"data-chat-dock-scrim": "",
+				initial: { opacity: 0 },
+				animate: {
+					opacity: 1,
+					transition: E ? J : q
+				},
+				exit: {
+					opacity: 0,
+					transition: E ? J : q
+				},
+				onClick: () => U(!1)
+			}, "scrim") : null
+		}), /* @__PURE__ */ m("div", {
+			className: xe,
+			children: /* @__PURE__ */ m("div", {
 				className: "band",
-				children: /* @__PURE__ */ _("div", {
-					ref: B,
-					className: e(de, P ? fe : void 0),
-					role: M ? "dialog" : void 0,
-					"aria-modal": M ? "false" : void 0,
-					"aria-labelledby": M ? pt : void 0,
-					"aria-describedby": M && l != null ? mt : void 0,
-					onKeyDown: Zt,
+				children: /* @__PURE__ */ h("div", {
+					ref: I,
+					className: e(he, j ? ge : void 0),
+					role: k ? "dialog" : void 0,
+					"aria-modal": k ? P ? "true" : "false" : void 0,
+					"aria-labelledby": k ? bt : void 0,
+					"aria-describedby": k && c != null ? xt : void 0,
+					onKeyDown: Xt,
 					children: [
-						/* @__PURE__ */ g(v, {
+						/* @__PURE__ */ m(g, {
 							initial: !1,
-							children: !M && Qt.length > 0 ? /* @__PURE__ */ g(y.div, {
-								className: ye,
+							children: !k && Qt.length > 0 ? /* @__PURE__ */ m(_.div, {
+								className: we,
 								role: "group",
-								"aria-label": O.suggestions,
+								"aria-label": T.suggestions,
 								exit: {
 									opacity: 0,
-									transition: k ? Z : Y
+									transition: E ? Q : J
 								},
-								children: Qt.map((e, t) => /* @__PURE__ */ g("span", {
-									className: ve,
+								children: Qt.map((e, t) => /* @__PURE__ */ m("span", {
+									className: Ce,
 									style: { "--chat-dock-pill-index": t },
-									children: /* @__PURE__ */ g(o, {
+									children: /* @__PURE__ */ m(a, {
 										type: "button",
 										role: "secondary",
 										size: "md",
 										icon: e.icon,
-										onClick: () => Kt(e),
+										onClick: () => W(e),
 										children: e.label
 									})
 								}, e.id))
 							}, "pills") : null
 						}),
-						/* @__PURE__ */ g(y.div, {
-							ref: Ft,
-							className: Ne[D],
-							"data-chat-dock-window": q,
-							hidden: P,
-							variants: sn,
+						/* @__PURE__ */ h(_.div, {
+							ref: zt,
+							className: Be[w],
+							"data-chat-dock-window": K,
+							hidden: j,
+							variants: an,
 							initial: !1,
-							animate: q,
+							animate: K,
 							onAnimationComplete: (e) => {
-								e === "closed" && !Wt.current && Et(!0);
+								e === "closed" && !H.current && Nt(!0);
 							},
-							children: /* @__PURE__ */ _("div", {
-								className: Pe,
+							children: [/* @__PURE__ */ h(_.div, {
+								className: e(Ve, Pt ? pe : void 0),
+								initial: !1,
+								animate: M ? {
+									opacity: 0,
+									transition: k ? J : Q
+								} : {
+									opacity: 1,
+									transition: k && !E ? {
+										...J,
+										delay: X
+									} : k ? J : Q
+								},
+								onAnimationComplete: () => {
+									M && Ft(!0);
+								},
 								children: [
-									/* @__PURE__ */ g(y.div, {
-										ref: V,
+									/* @__PURE__ */ m(_.div, {
 										className: "shrink-0",
 										custom: 0,
-										...cn,
-										children: /* @__PURE__ */ g(ne, {
-											titleId: pt,
-											descriptionId: mt,
-											title: c,
-											description: l,
-											headerStart: d,
-											closeLabel: O.close,
-											onClose: () => G(!1),
+										...on,
+										children: /* @__PURE__ */ m(ae, {
+											titleId: bt,
+											descriptionId: xt,
+											title: s,
+											description: c,
+											headerStart: u,
+											closeLabel: T.close,
+											onClose: () => U(!1),
 											delineated: !0
 										})
 									}),
-									/* @__PURE__ */ _(y.div, {
-										ref: Vt,
-										className: je,
+									/* @__PURE__ */ h(_.div, {
+										ref: Wt,
+										className: Re,
 										role: "log",
-										"aria-label": O.conversation,
+										"aria-label": T.conversation,
 										tabIndex: 0,
 										custom: 1,
-										...cn,
+										...on,
 										onScroll: (e) => {
 											let t = e.currentTarget;
-											Ht.current = t.scrollHeight - t.scrollTop - t.clientHeight <= Qe;
+											z.current = t.scrollHeight - t.scrollTop - t.clientHeight <= at;
 										},
-										children: [b == null ? null : /* @__PURE__ */ g("div", {
-											className: u,
-											children: b
-										}), /* @__PURE__ */ _(v, {
+										children: [v == null ? null : /* @__PURE__ */ m("div", {
+											className: l,
+											children: v
+										}), /* @__PURE__ */ h(g, {
 											initial: !1,
 											children: [
-												S.map((e, t) => {
-													let n = Xe({
+												y.map((e, t) => {
+													let n = rt({
 														message: e,
-														isLatest: t === S.length - 1,
-														thinking: C,
-														takesVotes: at != null
+														isLatest: t === y.length - 1,
+														thinking: b,
+														takesVotes: ft != null
 													});
-													return /* @__PURE__ */ g(y.div, {
+													return /* @__PURE__ */ m(_.div, {
 														"data-role": e.role,
-														className: e.role === "user" ? Me : n == null ? u : Ce,
-														initial: !k && {
+														className: e.role === "user" ? ze : n == null ? l : Oe,
+														initial: !E && {
 															opacity: 0,
 															y: 8
 														},
@@ -475,223 +491,207 @@ function w({ title: c, subtitle: l, mark: d, greeting: b, messages: S = [], thin
 															opacity: 1,
 															y: 0
 														},
-														transition: Y,
-														children: n == null ? e.content : /* @__PURE__ */ _(Ue, { children: [/* @__PURE__ */ g("div", {
-															className: u,
+														transition: J,
+														children: n == null ? e.content : /* @__PURE__ */ h(Ze, { children: [/* @__PURE__ */ m("div", {
+															className: l,
 															children: e.content
-														}), mn(e, n)] })
+														}), pn(e, n)] })
 													}, e.id);
 												}),
-												en && it === "inline" ? /* @__PURE__ */ g(y.div, {
+												en && dt === "inline" ? /* @__PURE__ */ m(_.div, {
 													role: "group",
-													"aria-label": O.followUps,
+													"aria-label": T.followUps,
 													"data-follow-ups": "inline",
-													className: he,
-													...dn,
+													className: ye,
+													...ln,
 													animate: "visible",
-													children: T.map((e) => /* @__PURE__ */ g(y.div, {
-														className: pe,
-														variants: fn,
-														children: /* @__PURE__ */ g(o, {
+													children: S.map((e) => /* @__PURE__ */ m(_.div, {
+														className: _e,
+														variants: un,
+														children: /* @__PURE__ */ m(a, {
 															type: "button",
 															role: "ghost",
 															layout: "row",
-															onMouseDown: $,
-															onClick: () => Jt(e),
-															children: /* @__PURE__ */ _("span", {
-																className: ke,
-																children: [/* @__PURE__ */ g(a, {
+															onMouseDown: dn,
+															onClick: () => qt(e),
+															children: /* @__PURE__ */ h("span", {
+																className: Ie,
+																children: [/* @__PURE__ */ m(i, {
 																	size: "md",
-																	children: /* @__PURE__ */ g(Be, {})
-																}), /* @__PURE__ */ g("span", {
-																	className: De,
+																	children: /* @__PURE__ */ m(Je, {})
+																}), /* @__PURE__ */ m("span", {
+																	className: Pe,
 																	children: e.label
 																})]
 															})
 														})
 													}, e.id))
 												}, "follow-ups") : null,
-												C ? /* @__PURE__ */ _(y.div, {
-													className: Ae,
-													initial: !k && { opacity: 0 },
+												b ? /* @__PURE__ */ h(_.div, {
+													className: Le,
+													initial: !E && { opacity: 0 },
 													animate: { opacity: 1 },
 													exit: {
 														opacity: 0,
-														transition: Z
+														transition: Q
 													},
-													transition: Y,
-													children: [/* @__PURE__ */ g(ee, {
+													transition: J,
+													children: [/* @__PURE__ */ m(ee, {
 														variant: "dot",
 														tone: "neutral",
 														pulsing: !0,
 														besideLabel: !0
-													}), /* @__PURE__ */ g("span", { children: O.thinking })]
+													}), /* @__PURE__ */ m("span", { children: T.thinking })]
 												}, "thinking") : null
 											]
 										})]
 									}),
-									$t ? /* @__PURE__ */ g(y.div, {
-										className: Oe,
+									$t ? /* @__PURE__ */ m(_.div, {
+										className: Fe,
 										role: "group",
-										"aria-label": O.suggestions,
+										"aria-label": T.suggestions,
 										custom: 2,
-										...cn,
-										children: w.map((e) => /* @__PURE__ */ g(o, {
+										...on,
+										children: x.map((e) => /* @__PURE__ */ m(a, {
 											type: "button",
 											role: "ghost",
 											layout: "row",
-											onMouseDown: e.prompt == null ? void 0 : $,
-											onClick: () => Yt(e),
-											children: /* @__PURE__ */ _("span", {
-												className: ke,
-												children: [e.icon == null ? null : /* @__PURE__ */ g(a, {
+											onMouseDown: e.prompt == null ? void 0 : dn,
+											onClick: () => Jt(e),
+											children: /* @__PURE__ */ h("span", {
+												className: Ie,
+												children: [e.icon == null ? null : /* @__PURE__ */ m(i, {
 													size: "md",
 													children: e.icon
-												}), /* @__PURE__ */ g("span", {
-													className: De,
+												}), /* @__PURE__ */ m("span", {
+													className: Pe,
 													children: e.label
 												})]
 											})
 										}, e.id))
 									}) : null,
-									/* @__PURE__ */ g(v, {
+									/* @__PURE__ */ m(g, {
 										initial: !1,
-										children: en && it === "composer" ? /* @__PURE__ */ g(y.div, {
+										children: en && dt === "composer" ? /* @__PURE__ */ m(_.div, {
 											role: "group",
-											"aria-label": O.followUps,
+											"aria-label": T.followUps,
 											"data-follow-ups": "composer",
-											className: me,
-											...dn,
-											children: T.map((e) => /* @__PURE__ */ g(y.span, {
+											className: ve,
+											...ln,
+											children: S.map((e) => /* @__PURE__ */ m(_.span, {
 												className: "inline-flex",
-												variants: fn,
-												children: /* @__PURE__ */ g(o, {
+												variants: un,
+												children: /* @__PURE__ */ m(a, {
 													type: "button",
 													role: "secondary",
 													size: "md",
-													onMouseDown: $,
-													onClick: () => Jt(e),
+													onMouseDown: dn,
+													onClick: () => qt(e),
 													children: e.label
 												})
 											}, e.id))
 										}, "follow-ups") : null
 									})
 								]
-							})
-						}, K),
-						/* @__PURE__ */ g("span", {
+							}), /* @__PURE__ */ m(g, {
+								initial: !1,
+								children: M ? /* @__PURE__ */ m(_.div, {
+									ref: Ht,
+									className: be[w],
+									"data-chat-dock-gate": "",
+									initial: { opacity: 0 },
+									animate: k ? {
+										opacity: 1,
+										transition: E ? J : {
+											...J,
+											delay: X
+										}
+									} : {
+										opacity: 0,
+										transition: J
+									},
+									exit: {
+										opacity: 0,
+										transition: J
+									},
+									children: /* @__PURE__ */ m(oe.Provider, {
+										value: Zt,
+										children: pt
+									})
+								}, "gate") : null
+							})]
+						}, G),
+						/* @__PURE__ */ m("span", {
 							className: "sr-only",
 							role: "status",
-							children: N == null ? "" : O.copied
+							children: A == null ? "" : T.copied
 						}),
-						/* @__PURE__ */ _("div", {
-							className: se,
-							children: [/* @__PURE__ */ g(y.div, {
-								ref: It,
-								initial: !1,
-								animate: { height: kt ?? "auto" },
-								transition: L && !k ? J : Z,
-								style: L ? { overflow: "hidden" } : void 0,
-								onAnimationComplete: () => R(!1),
-								children: /* @__PURE__ */ _("div", {
-									ref: Rt,
-									className: oe,
-									children: [/* @__PURE__ */ g(v, {
-										initial: !1,
-										children: F ? /* @__PURE__ */ g(y.div, {
-											ref: zt,
-											className: e(le, I ? void 0 : "pointer-events-none"),
-											"data-chat-dock-gate": "",
-											hidden: jt,
-											initial: {
-												opacity: 0,
-												y: 12
-											},
-											animate: I ? {
-												opacity: 1,
-												y: 0,
-												transition: {
-													...Y,
-													delay: k ? 0 : Y.duration
-												}
-											} : {
-												opacity: 0,
-												y: 12,
-												transition: Y
-											},
-											exit: {
-												opacity: 0,
-												y: 12,
-												transition: Y
-											},
-											onAnimationComplete: () => {
-												I || Mt(!0);
-											},
-											children: ot
-										}, "gate") : null
-									}), /* @__PURE__ */ g(y.div, {
-										className: e(le, I ? "pointer-events-none" : void 0),
-										hidden: Nt,
-										initial: !1,
-										animate: I ? {
-											opacity: 0,
-											transition: Y
-										} : {
-											opacity: 1,
-											transition: {
-												...Y,
-												delay: L && !k ? Y.duration : 0
-											}
+						/* @__PURE__ */ h("div", {
+							className: e(de, N ? "pointer-events-none" : void 0),
+							children: [/* @__PURE__ */ m("div", {
+								ref: Bt,
+								children: /* @__PURE__ */ m(_.div, {
+									className: It ? pe : void 0,
+									"aria-hidden": N ? !0 : void 0,
+									initial: !1,
+									animate: N ? {
+										opacity: 0,
+										transition: J
+									} : {
+										opacity: 1,
+										transition: k && !E ? {
+											...J,
+											delay: X
+										} : J
+									},
+									onAnimationComplete: () => {
+										N && Lt(!0);
+									},
+									children: /* @__PURE__ */ m(te, {
+										ref: R,
+										value: Dt,
+										onValueChange: (e) => {
+											Ot(e), U(!0);
 										},
-										onAnimationComplete: () => {
-											I && Pt(!0);
+										onSend: Gt,
+										onFocus: () => {
+											B.current || U(!0);
 										},
-										children: /* @__PURE__ */ g(te, {
-											ref: U,
-											value: bt,
-											onValueChange: (e) => {
-												xt(e), G(!0);
-											},
-											onSend: Gt,
-											onFocus: () => {
-												W.current || G(!0);
-											},
-											onClick: () => G(!0),
-											start: d == null ? void 0 : /* @__PURE__ */ g(y.span, {
-												className: _e,
-												"aria-hidden": M ? !0 : void 0,
-												variants: ln,
-												initial: !1,
-												animate: q,
-												children: d
-											}),
-											placeholder: ut,
-											"aria-label": O.field,
-											sendLabel: O.send
-										})
-									})]
+										onClick: () => U(!0),
+										start: u == null ? void 0 : /* @__PURE__ */ m(_.span, {
+											className: Se,
+											"aria-hidden": k ? !0 : void 0,
+											variants: sn,
+											initial: !1,
+											animate: K,
+											children: u
+										}),
+										placeholder: _t,
+										"aria-label": T.field,
+										sendLabel: T.send
+									})
 								})
-							}), /* @__PURE__ */ g(y.div, {
+							}), /* @__PURE__ */ m(_.div, {
 								className: "overflow-hidden",
-								"aria-hidden": !M || void 0,
-								variants: un,
+								"aria-hidden": !k || void 0,
+								variants: cn,
 								initial: !1,
-								animate: q,
-								children: /* @__PURE__ */ g("div", {
-									ref: Lt,
-									children: E != null && !I ? /* @__PURE__ */ g("p", {
-										className: ue[D],
-										children: E
-									}) : /* @__PURE__ */ g("div", { className: ce[D] })
+								animate: K,
+								children: /* @__PURE__ */ m("div", {
+									ref: Vt,
+									children: C != null && !N ? /* @__PURE__ */ m("p", {
+										className: me[w],
+										children: C
+									}) : /* @__PURE__ */ m("div", { className: fe[w] })
 								})
 							})]
 						})
 					]
 				})
 			})
-		})
+		})]
 	});
 }
-var nt = Object.assign(w, { Gate: c });
+var b = Object.assign(y, { Gate: s });
 //#endregion
-export { nt as ChatDock, c as ChatDockGate, Ke as chatDockDefaultLabels, b as chatDockFollowUpsPlacements, l as chatDockGateDefaultLabels, tt as chatDockGateMaxHeight, x as chatDockOpenHeight, qe as chatDockPillSuggestions, d as chatDockPlacements, Xe as chatDockReplyRow, Ye as chatDockShowsFollowUps, Je as chatDockShowsSuggestionRows };
+export { b as ChatDock, s as ChatDockGate, $e as chatDockDefaultLabels, v as chatDockFollowUpsPlacements, c as chatDockGateDefaultLabels, ct as chatDockOpenHeight, et as chatDockPillSuggestions, u as chatDockPlacements, rt as chatDockReplyRow, nt as chatDockShowsFollowUps, tt as chatDockShowsSuggestionRows };