@opencx/widget-react 4.0.24 → 4.0.27

package/dist/index.js

@@ -1,14 +1,14 @@
 import { jsx as r, jsxs as d, Fragment as te } from "react/jsx-runtime";
-import * as ae from "@radix-ui/react-popover";
+import * as le from "@radix-ui/react-popover";
 import * as G from "react";
-import q, { memo as Bt, forwardRef as ct, useState as I, cloneElement as dt, createContext as Lt, useEffect as re, useContext as Yt, useMemo as pt, useRef as le, createElement as rt } from "react";
-import { useWidget as R, useConfig as b, useDocumentDir as ue, useWidgetRouter as $, useWidgetTrigger as K, useSessions as B, useMessages as j, useModes as ht, useCsat as mt, useUploadFiles as qt, useIsAwaitingBotReply as gt, useContact as Xt, WidgetProvider as Ut, WidgetTriggerProvider as Vt } from "@opencx/widget-react-headless";
+import q, { memo as Bt, forwardRef as ct, useState as T, cloneElement as dt, createContext as Lt, useEffect as re, useContext as Yt, useMemo as pt, useRef as ce, createElement as rt } from "react";
+import { useWidget as R, useConfig as x, useDocumentDir as fe, useWidgetRouter as $, useWidgetTrigger as K, useSessions as B, useMessages as j, useModes as ht, useCsat as mt, useUploadFiles as qt, useIsAwaitingBotReply as gt, useContact as Xt, WidgetProvider as Ut, WidgetTriggerProvider as Vt } from "@opencx/widget-react-headless";
 import { clsx as Gt } from "clsx";
 import { twMerge as Kt } from "tailwind-merge";
-import { motion as Z, AnimatePresence as S } from "framer-motion";
+import { motion as Z, AnimatePresence as _ } from "framer-motion";
 import { Slot as Qt } from "@radix-ui/react-slot";
 import { cva as Zt } from "class-variance-authority";
-import { X as Jt, CircleDashedIcon as er, XIcon as fe, SquareXIcon as tr, SquareCheckBigIcon as rr, SquareCheckIcon as or, ShrinkIcon as nr, Minimize2Icon as sr, MinimizeIcon as ir, Maximize2Icon as ar, MaximizeIcon as lr, ExpandIcon as cr, CircleXIcon as dr, CircleCheckBigIcon as pr, CircleCheckIcon as wt, CheckCheckIcon as hr, CheckIcon as mr, ChevronLeftIcon as gr, LoaderIcon as wr, ArrowUpIcon as ut, PaperclipIcon as ur, ImageIcon as fr, CircleDashed as vr, AlertCircle as xr, Loader2 as br, FileAudio2Icon as yr, FileVideo2Icon as kr, FileIcon as Cr, UserRoundIcon as zr, ChevronRightIcon as Nr, SendHorizontal as Sr, ChevronDownIcon as _r } from "lucide-react";
+import { X as Jt, CircleDashedIcon as er, XIcon as ve, SquareXIcon as tr, SquareCheckBigIcon as rr, SquareCheckIcon as or, ShrinkIcon as nr, Minimize2Icon as sr, MinimizeIcon as ir, Maximize2Icon as ar, MaximizeIcon as lr, ExpandIcon as cr, CircleXIcon as dr, CircleCheckBigIcon as pr, CircleCheckIcon as wt, CheckCheckIcon as hr, CheckIcon as mr, ChevronLeftIcon as gr, LoaderIcon as wr, ArrowUpIcon as ut, PaperclipIcon as ur, ImageIcon as fr, CircleDashed as vr, AlertCircle as xr, Loader2 as br, FileAudio2Icon as yr, FileVideo2Icon as kr, FileIcon as Cr, UserRoundIcon as zr, ChevronRightIcon as Nr, SendHorizontal as Sr, ChevronDownIcon as _r } from "lucide-react";
 import ft from "remark-gfm";
 import Ir from "react-markdown";
 import vt from "rehype-raw";
@@ -19,7 +19,7 @@ import * as oe from "@radix-ui/react-tooltip";
 import ot from "tinycolor2";
 import { useDropzone as Dr } from "react-dropzone";
 import Rr from "react-use/lib/useAsyncFn";
-import { z as pe } from "zod";
+import { z as he } from "zod";
 function g(e) {
   return { "data-component": e };
 }
@@ -32,38 +32,38 @@ const V = {
 }, W = Bt(
   ct(
     ({ children: e, className: o, scale: t = 1.02, off: n = !1 }, s) => {
-      const [i, a] = I(!1), [c, l] = I({ x: 0, y: 0 });
+      const [i, a] = T(!1), [c, l] = T({ x: 0, y: 0 });
       if (n || /translate/.test(
         e.props.className || ""
       )) return e;
-      const x = (f) => {
-        var C, z;
-        const { clientX: N, clientY: T } = f, _ = f.currentTarget.getBoundingClientRect(), M = N - (_.left + _.width / 2), A = T - (_.top + _.height / 2), F = Math.max(
+      const y = (u) => {
+        var z, N;
+        const { clientX: b, clientY: I } = u, S = u.currentTarget.getBoundingClientRect(), M = b - (S.left + S.width / 2), A = I - (S.top + S.height / 2), F = Math.max(
           -1,
-          Math.min(1, M / (_.width / 2))
+          Math.min(1, M / (S.width / 2))
         ), H = Math.max(
           -1,
-          Math.min(1, A / (_.height / 2))
+          Math.min(1, A / (S.height / 2))
         ), E = F * V.x, v = H * V.y;
-        l({ x: E, y: v }), (z = (C = e.props).onMouseMove) == null || z.call(C, f);
-      }, u = () => {
-        var f, N;
-        a(!0), (N = (f = e.props).onMouseEnter) == null || N.call(f);
+        l({ x: E, y: v }), (N = (z = e.props).onMouseMove) == null || N.call(z, u);
+      }, w = () => {
+        var u, b;
+        a(!0), (b = (u = e.props).onMouseEnter) == null || b.call(u);
       }, m = () => {
-        var f, N;
-        a(!1), l({ x: 0, y: 0 }), (N = (f = e.props).onMouseLeave) == null || N.call(f);
-      }, k = {
+        var u, b;
+        a(!1), l({ x: 0, y: 0 }), (b = (u = e.props).onMouseLeave) == null || b.call(u);
+      }, C = {
         "--wobble-x": i ? `${c.x}px` : "0px",
         "--wobble-y": i ? `${c.y}px` : "0px",
         "--scale": 1 - (t - 1)
       };
       return dt(e, {
         ref: s,
-        onMouseMove: x,
-        onMouseEnter: u,
+        onMouseMove: y,
+        onMouseEnter: w,
         onMouseLeave: m,
         style: {
-          ...k,
+          ...C,
           ...e.props.style
         },
         className: p(
@@ -100,7 +100,7 @@ const jr = 10, Er = (e, o, t) => ({
   left: Or,
   up: Pr,
   down: Ar
-}, w = ct(
+}, f = ct(
   ({
     fadeIn: e = "down",
     distance: o = jr,
@@ -114,7 +114,7 @@ const jr = 10, Er = (e, o, t) => ({
     return n && l.exit && typeof l.exit == "object" && !Array.isArray(l.exit) && (l.exit.transition = { duration: 0 }), /* @__PURE__ */ r(Z.div, { ref: c, ...a, ...l, children: t });
   }
 );
-w.displayName = "MotionDiv";
+f.displayName = "MotionDiv";
 const Hr = Zt(
   p(
     "inline-flex shrink-0 items-center justify-center gap-2",
@@ -154,7 +154,7 @@ const Hr = Zt(
       size: "default"
     }
   }
-), y = G.forwardRef(
+), k = G.forwardRef(
   ({ className: e, variant: o = "default", size: t, asChild: n = !1, ...s }, i) => /* @__PURE__ */ r(W, { ref: i, children: /* @__PURE__ */ r(
     n ? Qt : "button",
     {
@@ -165,10 +165,10 @@ const Hr = Zt(
     }
   ) })
 );
-y.displayName = "Button";
+k.displayName = "Button";
 const bt = Lt(null);
 function Wr({ children: e }) {
-  const [o, t] = I(!1), [n, s] = I(null), i = (c) => {
+  const [o, t] = T(!1), [n, s] = T(null), i = (c) => {
     s(c), t(!0);
   }, a = () => {
     t(!1), setTimeout(() => {
@@ -186,7 +186,7 @@ function Wr({ children: e }) {
     }
   );
 }
-function ce() {
+function de() {
   const e = Yt(bt);
   return e || (console.error("useDialoger must be used within a DialogerProvider"), {
     open: () => {
@@ -198,7 +198,7 @@ function ce() {
   });
 }
 function $r() {
-  const { contentIframeRef: e } = R(), { isOpen: o, content: t, close: n } = ce();
+  const { contentIframeRef: e } = R(), { isOpen: o, content: t, close: n } = de();
   return re(() => {
     var i, a;
     const s = (c) => {
@@ -214,8 +214,8 @@ function $r() {
         s
       );
     };
-  }, []), /* @__PURE__ */ r(S, { mode: "wait", children: o && t && /* @__PURE__ */ r(
-    w,
+  }, []), /* @__PURE__ */ r(_, { mode: "wait", children: o && t && /* @__PURE__ */ r(
+    f,
     {
       overrides: {
         initial: { y: 0 },
@@ -234,7 +234,7 @@ function yt({
   className: o,
   withClose: t = !1
 }) {
-  const { close: n } = ce();
+  const { close: n } = de();
   return /* @__PURE__ */ d(
     "div",
     {
@@ -246,7 +246,7 @@ function yt({
       children: [
         e,
         t && /* @__PURE__ */ d(
-          y,
+          k,
           {
             size: "fit",
             className: "rounded-full absolute top-4 right-4",
@@ -314,7 +314,7 @@ function _t({
   children: e,
   trigger: o
 }) {
-  const { open: t } = ce();
+  const { open: t } = de();
   return dt(o, {
     onClick: () => t(e)
   });
@@ -365,12 +365,12 @@ const Tt = q.memo(
   Ir,
   (e, o) => e.children === o.children && e.className === o.className
 );
-function ve({
+function xe({
   children: e,
   messageType: o,
   messageId: t
 }) {
-  const { anchorTarget: n } = b();
+  const { anchorTarget: n } = x();
   return /* @__PURE__ */ r(
     Tt,
     {
@@ -385,7 +385,7 @@ function ve({
     }
   );
 }
-function he({
+function me({
   data: e,
   id: o,
   type: t,
@@ -397,8 +397,8 @@ function he({
   classNames: l
 }) {
   if (t !== "AI" && t !== "AGENT") return null;
-  const { message: h, variant: x = "default" } = e;
-  return x === "error" ? /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r("div", { className: "flex flex-row flex-wrap items-center justify-start", children: /* @__PURE__ */ r("div", { className: "leading-snug text-sm text-destructive", children: h }) }) }) : /* @__PURE__ */ d(
+  const { message: h, variant: y = "default" } = e;
+  return y === "error" ? /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r("div", { className: "flex flex-row flex-wrap items-center justify-start", children: /* @__PURE__ */ r("div", { className: "leading-snug text-sm text-destructive", children: h }) }) }) : /* @__PURE__ */ d(
     "div",
     {
       ...g((c == null ? void 0 : c.messageContainer) ?? "chat/agent_msg/root"),
@@ -407,7 +407,7 @@ function he({
         l == null ? void 0 : l.messageContainer
       ),
       children: [
-        n && n.length > 0 && /* @__PURE__ */ r("div", { className: "w-full gap-1 flex flex-row flex-wrap items-center justify-start", children: n == null ? void 0 : n.map((u) => /* @__PURE__ */ r(It, { attachment: u }, u.id)) }),
+        n && n.length > 0 && /* @__PURE__ */ r("div", { className: "w-full gap-1 flex flex-row flex-wrap items-center justify-start", children: n == null ? void 0 : n.map((w) => /* @__PURE__ */ r(It, { attachment: w }, w.id)) }),
         h.length > 0 && /* @__PURE__ */ r(
           "div",
           {
@@ -429,7 +429,7 @@ function he({
               !s && !i && !a && "rounded-l-md",
               l == null ? void 0 : l.message
             ),
-            children: /* @__PURE__ */ r(ve, { messageType: t, messageId: o, children: h })
+            children: /* @__PURE__ */ r(xe, { messageType: t, messageId: o, children: h })
           }
         )
       ]
@@ -439,7 +439,7 @@ function he({
 function Br(e) {
   return /* @__PURE__ */ r("div", { className: "w-full max-w-full overflow-auto shrink-0", children: /* @__PURE__ */ r("pre", { className: "text-xs leading-tight whitespace-pre-wrap break-word", children: JSON.stringify(e, null, 1) }) });
 }
-const xe = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
+const be = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
   Q.Root,
   {
     ref: t,
@@ -451,8 +451,8 @@ const xe = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
     ...o
   }
 ));
-xe.displayName = Q.Root.displayName;
-const be = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
+be.displayName = Q.Root.displayName;
+const ye = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
   Q.Image,
   {
     ref: t,
@@ -460,8 +460,8 @@ const be = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
     ...o
   }
 ));
-be.displayName = Q.Image.displayName;
-const ye = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
+ye.displayName = Q.Image.displayName;
+const ke = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
   Q.Fallback,
   {
     ref: t,
@@ -472,25 +472,25 @@ const ye = G.forwardRef(({ className: e, ...o }, t) => /* @__PURE__ */ r(
     ...o
   }
 ));
-ye.displayName = Q.Fallback.displayName;
-function me({
+ke.displayName = Q.Fallback.displayName;
+function ge({
   agent: e,
   ...o
 }) {
   var t, n;
-  return /* @__PURE__ */ d(xe, { ...o, children: [
-    /* @__PURE__ */ r(be, { src: (e == null ? void 0 : e.avatar) ?? "", alt: "Agent Icon" }),
-    (e == null ? void 0 : e.name) && /* @__PURE__ */ r(ye, { children: (n = (t = e == null ? void 0 : e.name) == null ? void 0 : t.slice(0, 1)) == null ? void 0 : n.toUpperCase() })
+  return /* @__PURE__ */ d(be, { ...o, children: [
+    /* @__PURE__ */ r(ye, { src: (e == null ? void 0 : e.avatar) ?? "", alt: "Agent Icon" }),
+    (e == null ? void 0 : e.name) && /* @__PURE__ */ r(ke, { children: (n = (t = e == null ? void 0 : e.name) == null ? void 0 : t.slice(0, 1)) == null ? void 0 : n.toUpperCase() })
   ] });
 }
 function Lr({ agent: e }) {
-  return /* @__PURE__ */ r(S, { children: /* @__PURE__ */ d(
-    w,
+  return /* @__PURE__ */ r(_, { children: /* @__PURE__ */ d(
+    f,
     {
       ...g("chat/bot_loading/root"),
       className: "flex flex-row items-end w-full gap-2 animate-pulse",
       children: [
-        /* @__PURE__ */ r(me, { agent: e }),
+        /* @__PURE__ */ r(ge, { agent: e }),
         /* @__PURE__ */ d(
           "div",
           {
@@ -529,7 +529,7 @@ function J({
   side: t,
   align: n
 }) {
-  const { disableTooltips: s } = b();
+  const { disableTooltips: s } = x();
   return !o || s ? e : /* @__PURE__ */ d(qr, { children: [
     /* @__PURE__ */ r(Xr, { asChild: !0, children: e }),
     /* @__PURE__ */ r(
@@ -561,13 +561,13 @@ const se = {
   transitionDuration: "1000ms"
 };
 function X() {
-  var u, m, k, f, N, T, _, M, A, F, H, E, v, C, z, L, ne, Se, _e, Ie, Te, Me, De, Re, je, Ee, Oe, Pe, Ae, Fe, He, We, $e, Be, Le, Ye, qe, Xe, Ue, Ve, Ge, Ke, Qe, Ze, Je, et, tt;
-  const { dir: e } = ue(), { isSmallScreen: o } = P(), { theme: t, inline: n } = b(), s = (Y) => n ? "100%" : Y, i = (Y, de) => o ? `100dv${Y}` : de, a = (Y, de) => s(i(Y, de)), c = {
-    zIndex: ((u = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : u.zIndex) ?? 1e7,
+  var w, m, C, u, b, I, S, M, A, F, H, E, v, z, N, L, ne, Se, _e, Ie, Te, Me, De, Re, je, Ee, Oe, Pe, Ae, Fe, He, We, $e, Be, Le, Ye, qe, Xe, Ue, Ve, Ge, Ke, Qe, Ze, Je, et, tt;
+  const { dir: e } = fe(), { isSmallScreen: o } = P(), { theme: t, inline: n } = x(), s = (Y) => n ? "100%" : Y, i = (Y, pe) => o ? `100dv${Y}` : pe, a = (Y, pe) => s(i(Y, pe)), c = {
+    zIndex: ((w = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : w.zIndex) ?? 1e7,
     offset: {
-      bottom: ((k = (m = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : m.offset) == null ? void 0 : k.bottom) ?? 20,
-      right: ((N = (f = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : f.offset) == null ? void 0 : N.right) ?? (e === "ltr" ? 20 : "initial"),
-      left: ((_ = (T = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : T.offset) == null ? void 0 : _.left) ?? (e === "rtl" ? 20 : "initial")
+      bottom: ((C = (m = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : m.offset) == null ? void 0 : C.bottom) ?? 20,
+      right: ((b = (u = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : u.offset) == null ? void 0 : b.right) ?? (e === "ltr" ? 20 : "initial"),
+      left: ((S = (I = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : I.offset) == null ? void 0 : S.left) ?? (e === "rtl" ? 20 : "initial")
     },
     size: {
       button: ((A = (M = t == null ? void 0 : t.widgetTrigger) == null ? void 0 : M.size) == null ? void 0 : A.button) ?? 48,
@@ -583,9 +583,9 @@ function X() {
     widgetContentContainer: {
       borderRadius: o ? "0px" : ((E = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : E.borderRadius) ?? "32px",
       zIndex: ((v = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : v.zIndex) ?? c.zIndex + 1,
-      outline: ((C = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : C.outline) ?? "none",
+      outline: ((z = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : z.outline) ?? "none",
       // was: '1px solid'
-      outlineColor: ((z = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : z.outlineColor) ?? "hsl(0 0% 50% / .5)",
+      outlineColor: ((N = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : N.outlineColor) ?? "hsl(0 0% 50% / .5)",
       boxShadow: ((L = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : L.boxShadow) ?? "0 0px 100px 0px rgb(0 0 0 / 0.25)",
       transitionProperty: ((ne = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : ne.transitionProperty) ?? "all",
       transitionTimingFunction: ((Se = t == null ? void 0 : t.widgetContentContainer) == null ? void 0 : Se.transitionTimingFunction) ?? se.transitionTimingFunction,
@@ -625,7 +625,7 @@ function X() {
         }
       }
     }
-  }, x = {
+  }, y = {
     // Subtract the offset.bottom twice so that it adds a bit of padding to the top
     // Subtract the distance between the trigger and the widget content container
     // Subtract the invisible padding of the trigger (for the wobble effect)
@@ -665,7 +665,7 @@ function X() {
   };
   return {
     theme: h,
-    computed: x,
+    computed: y,
     cssVars: Ur({
       palette: h.palette,
       primary: h.primaryColor
@@ -759,7 +759,7 @@ function Rt(e) {
   }
 }
 function jt() {
-  const { contentIframeRef: e } = R(), { inline: o } = b();
+  const { contentIframeRef: e } = R(), { inline: o } = x();
   return {
     setWidth: (t) => {
       var n;
@@ -777,7 +777,7 @@ function jt() {
     }
   };
 }
-function ke({
+function Ce({
   width: e,
   height: o
 }) {
@@ -822,7 +822,7 @@ function ee({
       case "SquareX":
         return tr;
       case "X":
-        return fe;
+        return ve;
       case void 0:
         return st;
       default:
@@ -831,10 +831,10 @@ function ee({
   })();
   return /* @__PURE__ */ r(t, { className: p("size-4", o) });
 }
-function Ce() {
+function ze() {
   const { widgetCtx: { org: e } } = R(), {
     routerState: { screen: o }
-  } = $(), { textContent: t } = b();
+  } = $(), { textContent: t } = x();
   return (() => {
     var s, i;
     switch (o) {
@@ -845,7 +845,7 @@ function Ce() {
       case "welcome":
         return;
       default:
-        D(o, Ce.name);
+        D(o, ze.name);
         return;
     }
   })() ?? e.name ?? "Chat";
@@ -859,17 +859,17 @@ function Vr(e) {
     case "welcome":
       return;
     default:
-      D(e, Ce.name);
+      D(e, ze.name);
       return;
   }
 }
 function Gr() {
-  const { router: e } = b(), {
+  const { router: e } = x(), {
     routerState: { screen: o },
     toSessionsScreen: t
   } = $();
   return o !== "chat" || e != null && e.chatScreenOnly ? null : /* @__PURE__ */ r(
-    y,
+    k,
     {
       variant: "ghost",
       size: "fit",
@@ -884,7 +884,7 @@ function Kr({
 }) {
   const { setIsOpen: o } = K(), { isSmallScreen: t } = P();
   return t && e.hideOnSmallScreen || !t && e.hideOnLargeScreen ? null : /* @__PURE__ */ r(
-    y,
+    k,
     {
       variant: "ghost",
       size: "fit",
@@ -897,10 +897,10 @@ function Kr({
     }
   );
 }
-function ge({
+function we({
   button: e
 }) {
-  const [o, t] = I(!1), {
+  const [o, t] = T(!1), {
     routerState: { screen: n }
   } = $(), { isSmallScreen: s } = P(), { theme: i } = X(), { setWidth: a, setHeight: c } = jt();
   if (n !== "chat" && n !== "sessions") return null;
@@ -911,7 +911,7 @@ function ge({
       case "sessions":
         return i.screens.sessions.height;
       default:
-        return D(n, ge.name), i.screens.chat.height;
+        return D(n, we.name), i.screens.chat.height;
     }
   })(), h = (() => {
     switch (n) {
@@ -920,21 +920,21 @@ function ge({
       case "sessions":
         return i.screens.sessions.width;
       default:
-        return D(n, ge.name), i.screens.chat.width;
+        return D(n, we.name), i.screens.chat.width;
     }
-  })(), x = () => {
-    t((u) => {
-      const m = !u;
+  })(), y = () => {
+    t((w) => {
+      const m = !w;
       return c(m ? "100vh" : l), a(m ? `max(40vw, ${h})` : h), m;
     });
   };
   return s && e.hideOnSmallScreen || !s && e.hideOnLargeScreen ? null : /* @__PURE__ */ r(
-    y,
+    k,
     {
       variant: "ghost",
       size: "fit",
       className: "rounded-full",
-      onClick: x,
+      onClick: y,
       children: /* @__PURE__ */ r(
         ee,
         {
@@ -947,10 +947,10 @@ function ge({
 function Et({
   button: e
 }) {
-  var N, T;
-  const { close: o } = ce(), { widgetCtx: t } = R(), { setIsOpen: n } = K(), { resolveSession: s, sessionState: i } = B(), { isSmallScreen: a } = P(), c = !i.session, l = ((N = i.session) == null ? void 0 : N.isOpened) === !1, h = e.onResolved || "stay-in-chat", x = e.behaviorBeforeSessionCreation || "disabled", u = e.behaviorIfSessionIsResolved || "disabled", m = !!(i.isResolvingSession || c && x === "disabled" || l && u === "disabled"), k = async () => {
-    const { success: _, error: M } = await s();
-    if (o(), !_) return console.error(M);
+  var b, I;
+  const { close: o } = de(), { widgetCtx: t } = R(), { setIsOpen: n } = K(), { resolveSession: s, sessionState: i } = B(), { isSmallScreen: a } = P(), c = !i.session, l = ((b = i.session) == null ? void 0 : b.isOpened) === !1, h = e.onResolved || "stay-in-chat", y = e.behaviorBeforeSessionCreation || "disabled", w = e.behaviorIfSessionIsResolved || "disabled", m = !!(i.isResolvingSession || c && y === "disabled" || l && w === "disabled"), C = async () => {
+    const { success: S, error: M } = await s();
+    if (o(), !S) return console.error(M);
     switch (h) {
       case "stay-in-chat":
         return;
@@ -967,9 +967,9 @@ function Et({
         D(h, Et.name);
         break;
     }
-  }, f = () => {
+  }, u = () => {
     if (c)
-      switch (x) {
+      switch (y) {
         case "disabled":
           return;
         case "close-widget":
@@ -977,12 +977,12 @@ function Et({
           break;
         default:
           D(
-            x,
-            f.name
+            y,
+            u.name
           );
       }
     if (l)
-      switch (u) {
+      switch (w) {
         case "disabled":
           return;
         case "close-widget":
@@ -998,16 +998,16 @@ function Et({
           break;
         default:
           D(
-            u,
-            f.name
+            w,
+            u.name
           );
       }
   };
-  return a && e.hideOnSmallScreen || !a && e.hideOnLargeScreen ? null : ((T = e.confirmation) == null ? void 0 : T.type) === "modal" && !l && !c ? /* @__PURE__ */ r(
+  return a && e.hideOnSmallScreen || !a && e.hideOnLargeScreen ? null : ((I = e.confirmation) == null ? void 0 : I.type) === "modal" && !l && !c ? /* @__PURE__ */ r(
     _t,
     {
       trigger: /* @__PURE__ */ r(
-        y,
+        k,
         {
           variant: "ghost",
           size: "fit",
@@ -1021,7 +1021,7 @@ function Et({
         /* @__PURE__ */ r(Ct, { children: /* @__PURE__ */ r(St, { children: e.confirmation.description || "Are you sure you want to close this conversation?" }) }),
         /* @__PURE__ */ d(zt, { children: [
           /* @__PURE__ */ r(
-            y,
+            k,
             {
               variant: "secondary",
               onClick: o,
@@ -1030,10 +1030,10 @@ function Et({
             }
           ),
           /* @__PURE__ */ r(
-            y,
+            k,
             {
               variant: "destructive",
-              onClick: k,
+              onClick: C,
               disabled: i.isResolvingSession,
               children: e.confirmation.confirmButtonText || "Yes"
             }
@@ -1042,27 +1042,27 @@ function Et({
       ] })
     }
   ) : /* @__PURE__ */ r(
-    y,
+    k,
     {
       variant: "ghost",
       size: "fit",
       className: "rounded-full",
-      onClick: l || c ? f : k,
+      onClick: l || c ? u : C,
       disabled: m,
       children: /* @__PURE__ */ r(ee, { name: e.icon })
     }
   );
 }
-function we({ button: e }) {
+function ue({ button: e }) {
   switch (e.functionality) {
     case "close-widget":
       return /* @__PURE__ */ r(Kr, { button: e });
     case "expand-shrink":
-      return /* @__PURE__ */ r(ge, { button: e });
+      return /* @__PURE__ */ r(we, { button: e });
     case "resolve-session":
       return /* @__PURE__ */ r(Et, { button: e });
     default:
-      return D(e, we.name), null;
+      return D(e, ue.name), null;
   }
 }
 const Qr = {
@@ -1073,9 +1073,9 @@ const Qr = {
 function Zr() {
   const {
     routerState: { screen: e }
-  } = $(), { headerButtons: o } = b(), t = e === "chat" ? o == null ? void 0 : o.chatScreen : e === "sessions" ? o == null ? void 0 : o.sessionsScreen : [];
-  return !t || t.length === 0 ? /* @__PURE__ */ r(we, { button: Qr }) : /* @__PURE__ */ r(te, { children: t.map((n) => /* @__PURE__ */ r(
-    we,
+  } = $(), { headerButtons: o } = x(), t = e === "chat" ? o == null ? void 0 : o.chatScreen : e === "sessions" ? o == null ? void 0 : o.sessionsScreen : [];
+  return !t || t.length === 0 ? /* @__PURE__ */ r(ue, { button: Qr }) : /* @__PURE__ */ r(te, { children: t.map((n) => /* @__PURE__ */ r(
+    ue,
     {
       button: n
     },
@@ -1085,7 +1085,7 @@ function Zr() {
 function Ot() {
   const {
     routerState: { screen: e }
-  } = $(), o = Vr(e), t = Ce();
+  } = $(), o = Vr(e), t = ze();
   return /* @__PURE__ */ r("header", { ...o, className: "py-2 px-4 shrink-0", children: /* @__PURE__ */ d("div", { className: "flex items-center gap-2", children: [
     /* @__PURE__ */ r(Gr, {}),
     /* @__PURE__ */ r(
@@ -1113,7 +1113,7 @@ function Jr() {
   };
 }
 function eo() {
-  const { activeMode: e, Component: o } = ht(), { sendMessage: t } = j(), { createStateCheckpoint: n } = B(), [s, i] = I(!1), a = async (c) => {
+  const { activeMode: e, Component: o } = ht(), { sendMessage: t } = j(), { createStateCheckpoint: n } = B(), [s, i] = T(!1), a = async (c) => {
     try {
       i(!0), await t(c);
     } catch (l) {
@@ -1137,7 +1137,7 @@ const O = q.forwardRef(
   (e, o) => {
     var t, n, s;
     return /* @__PURE__ */ r(
-      w,
+      f,
       {
         ...e,
         ref: o,
@@ -1186,16 +1186,16 @@ function ro() {
     isCsatSubmitted: n,
     submittedScore: s,
     submittedFeedback: i
-  } = mt(), [a, c] = I(null), [l, h] = I(null), x = (m) => {
-    c((k) => k === m ? null : m);
-  }, u = () => {
+  } = mt(), [a, c] = T(null), [l, h] = T(null), y = (m) => {
+    c((C) => C === m ? null : m);
+  }, w = () => {
     a && o({
       score: a,
       feedback: l || void 0
     });
   };
   return !t && !n ? null : /* @__PURE__ */ d("div", { className: "w-1/2 min-w-80 max-w-96 mx-auto overflow-hidden", children: [
-    /* @__PURE__ */ r(S, { mode: "wait", children: t && !a ? /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("p", { className: "text-sm text-muted-foreground text-center pt-2", children: "How was your conversation?" }) }, "csat-requested-title") : n ? /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("p", { className: "text-sm text-muted-foreground text-center pt-2", children: "You rated the conversation as" }) }, "csat-submitted-title") : null }),
+    /* @__PURE__ */ r(_, { mode: "wait", children: t && !a ? /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("p", { className: "text-sm text-muted-foreground text-center pt-2", children: "How was your conversation?" }) }, "csat-requested-title") : n ? /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("p", { className: "text-sm text-muted-foreground text-center pt-2", children: "You rated the conversation as" }) }, "csat-submitted-title") : null }),
     /* @__PURE__ */ r(
       "div",
       {
@@ -1205,7 +1205,7 @@ function ro() {
           n && "gap-0 justify-center"
         ),
         children: to.map((m) => /* @__PURE__ */ r(
-          y,
+          k,
           {
             variant: m.value === a ? "secondary" : "ghost",
             size: "selfless",
@@ -1219,14 +1219,14 @@ function ro() {
               n && m.value !== s && "opacity-0 size-0",
               n && m.value === s && "opacity-100 size-fit text-4xl"
             ),
-            onClick: t ? () => x(m.value) : void 0,
+            onClick: t ? () => y(m.value) : void 0,
             children: m.emoji
           },
           m.value
         ))
       }
     ),
-    /* @__PURE__ */ r(S, { mode: "wait", children: (a || s) && /* @__PURE__ */ r(O, { children: /* @__PURE__ */ d("div", { className: "pb-2 px-2 flex items-end", children: [
+    /* @__PURE__ */ r(_, { mode: "wait", children: (a || s) && /* @__PURE__ */ r(O, { children: /* @__PURE__ */ d("div", { className: "pb-2 px-2 flex items-end", children: [
       /* @__PURE__ */ r(
         "textarea",
         {
@@ -1248,10 +1248,10 @@ function ro() {
         }
       ),
       /* @__PURE__ */ r(
-        y,
+        k,
         {
           size: "fit",
-          onClick: u,
+          onClick: w,
           disabled: !a,
           className: p(
             "transition-all overflow-hidden",
@@ -1266,7 +1266,7 @@ function ro() {
   ] });
 }
 function U() {
-  const { dir: e } = ue(), o = b();
+  const { dir: e } = fe(), o = x();
   return pt(() => {
     const t = Tr(o.language) ? o.language : "en";
     return {
@@ -1277,7 +1277,7 @@ function U() {
     };
   }, [o.language, e]);
 }
-function ze({
+function Ne({
   suggestion: e,
   className: o,
   ...t
@@ -1287,7 +1287,7 @@ function ze({
     i && n({ content: i });
   };
   return /* @__PURE__ */ r(
-    y,
+    k,
     {
       ...g("chat/suggested_reply_btn"),
       size: "sm",
@@ -1306,7 +1306,7 @@ function oo() {
       ...g("chat/might_solve_user_issue_suggested_replies_container"),
       className: "flex items-center gap-2 p-2 pb-0 flex-wrap",
       children: o.map((t) => /* @__PURE__ */ r(
-        ze,
+        Ne,
         {
           suggestion: t,
           className: "flex-1"
@@ -1317,14 +1317,14 @@ function oo() {
   );
 }
 function it() {
-  const { sessionState: e } = B(), { chatFooterItems: o } = b(), t = !!e.session && !e.session.isOpened, n = !t;
-  return /* @__PURE__ */ r(S, { mode: "wait", children: o == null ? void 0 : o.map((s, i) => s.showWhenSessionIsOpen === !1 && n || s.showWhenSessionIsResolved === !1 && t ? null : /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("div", { className: "pb-2 text-center text-xs", children: /* @__PURE__ */ r(ve, { children: s.message }) }) }, `${s.message}-${i}`)) });
+  const { sessionState: e } = B(), { chatFooterItems: o } = x(), t = !!e.session && !e.session.isOpened, n = !t;
+  return /* @__PURE__ */ r(_, { mode: "wait", children: o == null ? void 0 : o.map((s, i) => s.showWhenSessionIsOpen === !1 && n || s.showWhenSessionIsResolved === !1 && t ? null : /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r("div", { className: "pb-2 text-center text-xs", children: /* @__PURE__ */ r(xe, { children: s.message }) }) }, `${s.message}-${i}`)) });
 }
 function no({
   file: { status: e, file: o, error: t },
   onCancel: n
 }) {
-  const [s, i] = I(
+  const [s, i] = T(
     null
   );
   re(() => {
@@ -1381,7 +1381,7 @@ function no({
                   "opacity-0 group-hover:opacity-100 transition"
                 ),
                 onClick: n,
-                children: /* @__PURE__ */ r(fe, { className: "size-4 text-primary-foreground" })
+                children: /* @__PURE__ */ r(ve, { className: "size-4 text-primary-foreground" })
               }
             ),
             /* @__PURE__ */ r(c, {})
@@ -1393,29 +1393,29 @@ function no({
 }
 function so() {
   var E;
-  const { isSmallScreen: e } = P(), o = le(null), { sendMessage: t } = j(), { sessionState: n } = B(), { t: s } = U(), [i, a] = I(""), {
+  const { isSmallScreen: e } = P(), o = ce(null), { sendMessage: t } = j(), { sessionState: n } = B(), { t: s } = U(), [i, a] = T(""), {
     allFiles: c,
     emptyTheFiles: l,
     handleCancelUpload: h,
-    appendFiles: x,
-    isUploading: u,
+    appendFiles: y,
+    isUploading: w,
     successFiles: m
-  } = qt(), k = !!((E = n.session) != null && E.isHandedOff), { isAwaitingBotReply: f } = gt(), N = (v) => {
-    x(v);
-  }, T = !i.trim() && m.length === 0, _ = async () => {
-    if (f || T) return;
-    u && console.info("please wait for the file(s) to upload");
+  } = qt(), C = !!((E = n.session) != null && E.isHandedOff), { isAwaitingBotReply: u } = gt(), b = (v) => {
+    y(v);
+  }, I = !i.trim() && m.length === 0, S = async () => {
+    if (u || I) return;
+    w && console.info("please wait for the file(s) to upload");
     const v = i.trim();
     t({
       content: v,
       attachments: m.flatMap(
-        (C) => C.fileUrl ? [
+        (z) => z.fileUrl ? [
           {
-            url: C.fileUrl,
-            type: C.file.type,
-            name: C.file.name,
-            id: C.id,
-            size: C.file.size
+            url: z.fileUrl,
+            type: z.file.type,
+            name: z.file.name,
+            id: z.id,
+            size: z.file.size
           }
         ] : []
       )
@@ -1425,13 +1425,13 @@ function so() {
     getInputProps: A,
     open: F
   } = Dr({
-    onDrop: N,
+    onDrop: b,
     noClick: !0,
     onDropRejected() {
       console.error("unsupported file type, or the file is too large");
     },
     maxSize: 5 * 1024 * 1024,
-    accept: k ? {
+    accept: C ? {
       "text/*": [".txt"],
       "image/*": [".png", ".jpg", ".jpeg", ".gif"],
       "application/pdf": [".pdf"]
@@ -1442,8 +1442,8 @@ function so() {
       "image/webp": [".webp"]
     }
   }), H = (v) => {
-    const C = v.clipboardData;
-    C && C.files.length > 0 && N(Array.from(C.files));
+    const z = v.clipboardData;
+    z && z.files.length > 0 && b(Array.from(z.files));
   };
   return /* @__PURE__ */ d(
     "div",
@@ -1476,7 +1476,7 @@ function so() {
                       {
                         ...g("chat/input_box/attachments_container"),
                         className: "flex items-center gap-1",
-                        children: /* @__PURE__ */ r(S, { mode: "popLayout", children: c.map((v) => /* @__PURE__ */ r(w, { snapExit: !0, children: /* @__PURE__ */ r(
+                        children: /* @__PURE__ */ r(_, { mode: "popLayout", children: c.map((v) => /* @__PURE__ */ r(f, { snapExit: !0, children: /* @__PURE__ */ r(
                           no,
                           {
                             onCancel: () => h(v.id),
@@ -1507,7 +1507,7 @@ function so() {
                         ),
                         onChange: (v) => a(v.target.value),
                         onKeyDown: async (v) => {
-                          v.key === "Enter" && !v.shiftKey && (v.preventDefault(), _());
+                          v.key === "Enter" && !v.shiftKey && (v.preventDefault(), S());
                         },
                         placeholder: s("write_a_message_placeholder")
                       }
@@ -1523,7 +1523,7 @@ function so() {
                     align: "start",
                     content: "attach files, (maximum size 5mb)",
                     children: /* @__PURE__ */ r(
-                      y,
+                      k,
                       {
                         onClick: F,
                         size: "fit",
@@ -1531,19 +1531,19 @@ function so() {
                         className: p(
                           "rounded-full size-8 flex items-center justify-center p-0 overflow-hidden"
                         ),
-                        children: /* @__PURE__ */ r(S, { mode: "wait", children: k ? /* @__PURE__ */ r(w, { children: /* @__PURE__ */ r(ur, { className: "size-4" }) }, "paper-clip") : /* @__PURE__ */ r(w, { children: /* @__PURE__ */ r(fr, { className: "size-4" }) }, "image-icon") })
+                        children: /* @__PURE__ */ r(_, { mode: "wait", children: C && !u ? /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r(ur, { className: "size-4" }) }, "paper-clip") : /* @__PURE__ */ r(f, { children: /* @__PURE__ */ r(fr, { className: "size-4" }) }, "image-icon") })
                       }
                     )
                   }
                 ),
                 /* @__PURE__ */ r(J, { content: "send message", side: "top", align: "end", children: /* @__PURE__ */ r(
-                  y,
+                  k,
                   {
                     size: "fit",
-                    onClick: _,
-                    disabled: f || u || T,
+                    onClick: S,
+                    disabled: u || w || I,
                     className: "rounded-full size-8 flex items-center justify-center p-0",
-                    children: /* @__PURE__ */ r(S, { mode: "wait", children: f || u ? /* @__PURE__ */ r(w, { snapExit: !0, children: /* @__PURE__ */ r(vr, { className: "size-4 animate-spin animate-iteration-infinite" }) }, "loading") : /* @__PURE__ */ r(w, { snapExit: !0, children: /* @__PURE__ */ r(ut, { className: "size-4" }) }, "send") })
+                    children: /* @__PURE__ */ r(_, { mode: "wait", children: u || w ? /* @__PURE__ */ r(f, { snapExit: !0, children: /* @__PURE__ */ r(vr, { className: "size-4 animate-spin animate-iteration-infinite" }) }, "loading") : /* @__PURE__ */ r(f, { snapExit: !0, children: /* @__PURE__ */ r(ut, { className: "size-4" }) }, "send") })
                   }
                 ) })
               ] })
@@ -1555,14 +1555,14 @@ function so() {
   );
 }
 function at() {
-  const { widgetCtx: e } = R(), { router: o } = b(), { canCreateNewSession: t } = B(), { toSessionsScreen: n } = $(), { t: s } = U();
-  return /* @__PURE__ */ r(te, { children: t || o != null && o.chatScreenOnly ? /* @__PURE__ */ r(y, { onClick: e.resetChat, className: "rounded-2xl w-full", children: s("new_conversation") }) : /* @__PURE__ */ r(y, { onClick: n, className: "rounded-2xl w-full", children: s("back_to_conversations") }) });
+  const { widgetCtx: e } = R(), { router: o } = x(), { canCreateNewSession: t } = B(), { toSessionsScreen: n } = $(), { t: s } = U();
+  return /* @__PURE__ */ r(te, { children: t || o != null && o.chatScreenOnly ? /* @__PURE__ */ r(k, { onClick: e.resetChat, className: "rounded-2xl w-full", children: s("new_conversation") }) : /* @__PURE__ */ r(k, { onClick: n, className: "rounded-2xl w-full", children: s("back_to_conversations") }) });
 }
 function io() {
   const { t: e } = U(), { isCsatRequested: o, isCsatSubmitted: t } = mt();
-  return /* @__PURE__ */ r("div", { className: "p-2", children: /* @__PURE__ */ r("div", { className: "p-2 bg-muted rounded-3xl", children: /* @__PURE__ */ r(S, { mode: "wait", children: o || t ? /* @__PURE__ */ d(O, { children: [
+  return /* @__PURE__ */ r("div", { className: "p-2", children: /* @__PURE__ */ r("div", { className: "p-2 bg-muted rounded-3xl", children: /* @__PURE__ */ r(_, { mode: "wait", children: o || t ? /* @__PURE__ */ d(O, { children: [
     /* @__PURE__ */ r(ro, {}),
-    /* @__PURE__ */ r(S, { mode: "wait", children: t && /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r(at, {}) }, "new-conv-or-back-to-convs-button") })
+    /* @__PURE__ */ r(_, { mode: "wait", children: t && /* @__PURE__ */ r(O, { children: /* @__PURE__ */ r(at, {}) }, "new-conv-or-back-to-convs-button") })
   ] }, "csat") : /* @__PURE__ */ d(O, { children: [
     /* @__PURE__ */ d("div", { className: "ps-2 flex items-center gap-1 pb-2", children: [
       /* @__PURE__ */ r(wt, { className: "size-4 text-emerald-600" }),
@@ -1573,14 +1573,14 @@ function io() {
 }
 function ao() {
   var a;
-  const { initialQuestions: e, initialQuestionsPosition: o, thisWasHelpfulOrNot: t } = b(), { sessionState: n } = B(), { messagesState: s } = j(), i = s.messages.length === 0;
-  return /* @__PURE__ */ r("footer", { children: /* @__PURE__ */ r(S, { mode: "wait", children: n.session && !((a = n.session) != null && a.isOpened) ? /* @__PURE__ */ d(O, { children: [
+  const { initialQuestions: e, initialQuestionsPosition: o, thisWasHelpfulOrNot: t } = x(), { sessionState: n } = B(), { messagesState: s } = j(), i = s.messages.length === 0;
+  return /* @__PURE__ */ r("footer", { children: /* @__PURE__ */ r(_, { mode: "wait", children: n.session && !((a = n.session) != null && a.isOpened) ? /* @__PURE__ */ d(O, { children: [
     /* @__PURE__ */ r(io, {}),
     /* @__PURE__ */ r(it, {})
   ] }, "session-closed") : /* @__PURE__ */ d(O, { children: [
     s.lastAIResMightSolveUserIssue && (t == null ? void 0 : t.enabled) !== !1 && /* @__PURE__ */ r(oo, {}),
     i && e && o !== "below-initial-messages" && /* @__PURE__ */ r("div", { className: "flex items-center flex-row justify-end gap-2 flex-wrap px-2", children: e == null ? void 0 : e.map((c, l) => /* @__PURE__ */ r(
-      ze,
+      Ne,
       {
         suggestion: c
       },
@@ -1623,7 +1623,7 @@ function lo({
       isAloneInGroup: t
     }
   ) : /* @__PURE__ */ r(
-    he,
+    me,
     {
       ...n,
       isFirstInGroup: e,
@@ -1638,7 +1638,7 @@ function At({
   containerClassName: t
 }) {
   var a, c;
-  const { timestamps: n } = b();
+  const { timestamps: n } = x();
   if (!((a = n == null ? void 0 : n.perMessageGroup) != null && a.enabled))
     return null;
   const s = (c = e[e.length - 1]) == null ? void 0 : c.timestamp;
@@ -1656,7 +1656,7 @@ function At({
   })();
   return i ? /* @__PURE__ */ r("div", { className: t, children: /* @__PURE__ */ r("span", { className: p("text-xs text-muted-foreground", o), children: i }) }) : null;
 }
-function Ne({
+function ae({
   messages: e,
   agent: o,
   suggestedReplies: t
@@ -1668,7 +1668,7 @@ function Ne({
       className: p("flex items-end gap-2"),
       children: [
         /* @__PURE__ */ r(J, { content: o == null ? void 0 : o.name, side: "right", align: "end", children: /* @__PURE__ */ r(
-          me,
+          ge,
           {
             ...g("chat/agent_msg_group/root/avatar"),
             agent: o,
@@ -1683,7 +1683,7 @@ function Ne({
               className: p("flex items-end gap-2"),
               children: [
                 /* @__PURE__ */ r(J, { content: o == null ? void 0 : o.name, side: "right", align: "end", children: /* @__PURE__ */ r(
-                  me,
+                  ge,
                   {
                     ...g("chat/agent_msg_group/avatar_and_msgs/avatar"),
                     agent: o
@@ -1718,7 +1718,7 @@ function Ne({
               ...g("chat/agent_msg_group/suggestions"),
               className: p("flex flex-col gap-1 ps-8"),
               children: t == null ? void 0 : t.map((n, s) => /* @__PURE__ */ r(
-                ze,
+                Ne,
                 {
                   suggestion: n
                 },
@@ -1736,7 +1736,7 @@ function Ft() {
     widgetCtx: { org: e }
   } = R(), {
     sessionState: { session: o }
-  } = B(), t = b(), {
+  } = B(), t = x(), {
     messagesState: { messages: n }
   } = j();
   return {
@@ -1825,7 +1825,9 @@ function mo(e) {
   let t = null;
   return e.forEach((n) => {
     var s, i, a, c, l, h;
-    (!t || ((s = t[0]) == null ? void 0 : s.type) !== n.type) && (t = [], o.push(t)), ((i = t[0]) == null ? void 0 : i.type) === "AGENT" && n.type === "AGENT" && (((a = n.agent) == null ? void 0 : a.id) !== ((c = t[0].agent) == null ? void 0 : c.id) || ((l = n.agent) == null ? void 0 : l.name) !== ((h = t[0].agent) == null ? void 0 : h.name)) && (t = [], o.push(t)), t.push(n);
+    // Start a new group if the type changes
+    (((s = t == null ? void 0 : t[0]) == null ? void 0 : s.type) !== n.type || // Start a new group if the agent changes
+    ((i = t[0]) == null ? void 0 : i.type) === "AGENT" && n.type === "AGENT" && (((a = n.agent) == null ? void 0 : a.id) !== ((c = t[0].agent) == null ? void 0 : c.id) || ((l = n.agent) == null ? void 0 : l.name) !== ((h = t[0].agent) == null ? void 0 : h.name))) && (t = [], o.push(t)), t.push(n);
   }), o;
 }
 function go(e) {
@@ -1848,9 +1850,9 @@ function fo() {
     initialQuestionsPosition: t,
     initialQuestions: n,
     bot: s
-  } = b();
+  } = x();
   return /* @__PURE__ */ r(te, { children: e.length === 0 && o.length > 0 && /* @__PURE__ */ r(
-    Ne,
+    ae,
     {
       messages: o.map(
         ({ message: i }, a) => ({
@@ -1869,15 +1871,15 @@ function fo() {
 function vo() {
   const {
     messagesState: { messages: e }
-  } = j(), { chatBannerItems: o } = b();
+  } = j(), { chatBannerItems: o } = x();
   return !(o != null && o.length) || e.length > 0 && o.every((t) => !t.persistent) ? null : /* @__PURE__ */ r("div", { className: "w-full text-center text-xs", children: o.map(
-    ({ message: t, persistent: n }, s) => e.length > 0 && !n ? null : /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(ve, { children: t }) }, `${t}-${s}`)
+    ({ message: t, persistent: n }, s) => e.length > 0 && !n ? null : /* @__PURE__ */ r("div", { children: /* @__PURE__ */ r(xe, { children: t }) }, `${t}-${s}`)
   ) });
 }
 function xo() {
   const {
     messagesState: { messages: e }
-  } = j(), o = b(), {
+  } = j(), o = x(), {
     advancedInitialMessages: t = [],
     initialQuestions: n,
     initialQuestionsPosition: s
@@ -1886,7 +1888,7 @@ function xo() {
     return t.length ? [] : e.length ? [] : (a = o.initialMessages) != null && a.length ? o.initialMessages : ["Hello, how can I help you?"];
   })();
   return /* @__PURE__ */ r(te, { children: e.length === 0 && i.length > 0 && /* @__PURE__ */ r(
-    Ne,
+    ae,
     {
       messages: i.map(
         (a, c) => ({
@@ -1910,12 +1912,12 @@ function bo() {
 function yo() {
   const {
     messagesState: { messages: e }
-  } = j(), { isAwaitingBotReply: o } = gt(), { componentStore: t } = R(), n = b(), s = pt(
+  } = j(), { isAwaitingBotReply: o } = gt(), { componentStore: t } = R(), n = x(), s = pt(
     () => mo(e),
     [e]
   ), i = t.getComponent(
     "loading"
-  ), a = le(null);
+  ), a = ce(null);
   function c() {
     setTimeout(() => {
       const l = a.current;
@@ -1934,21 +1936,34 @@ function yo() {
         /* @__PURE__ */ r(vo, {}),
         /* @__PURE__ */ r(fo, {}),
         /* @__PURE__ */ r(xo, {}),
-        s.map((l) => {
-          var u, m, k;
-          const h = (u = l == null ? void 0 : l[0]) == null ? void 0 : u.type, x = (m = l[0]) == null ? void 0 : m.id;
-          if (!h || !x) return null;
+        s.map((l, h) => {
+          var m, C, u, b;
+          const y = (m = l == null ? void 0 : l[0]) == null ? void 0 : m.type, w = (C = l[0]) == null ? void 0 : C.id;
+          if (!y || !w) return null;
           if (go(l))
-            return /* @__PURE__ */ r(ho, { messages: l }, x);
-          if (wo(l) || uo(l)) {
-            const f = (k = l[0]) == null ? void 0 : k.agent;
+            return /* @__PURE__ */ r(ho, { messages: l }, w);
+          if (wo(l)) {
+            const I = h === s.length - 1;
+            if (o && I) return null;
+            const S = (u = l[0]) == null ? void 0 : u.agent;
+            return /* @__PURE__ */ r(
+              ae,
+              {
+                messages: l,
+                agent: S
+              },
+              w
+            );
+          }
+          if (uo(l)) {
+            const I = (b = l[0]) == null ? void 0 : b.agent;
             return /* @__PURE__ */ r(
-              Ne,
+              ae,
               {
                 messages: l,
-                agent: f
+                agent: I
               },
-              x
+              w
             );
           }
           return null;
@@ -1966,11 +1981,11 @@ function ko() {
   } = j(), {
     sessionState: { session: o }
   } = B(), { isCanvasOpen: t } = Jr(), { theme: n } = X();
-  ke({
+  Ce({
     width: t ? n.screens.chat.withCanvas.width : n.screens.chat.width,
     height: t ? n.screens.chat.withCanvas.height : n.screens.chat.height
   });
-  const s = le((o == null ? void 0 : o.id) || "chat").current;
+  const s = ce((o == null ? void 0 : o.id) || "chat").current;
   return /* @__PURE__ */ r(
     "div",
     {
@@ -1988,15 +2003,15 @@ function ko() {
       },
       children: /* @__PURE__ */ d("div", { className: "size-full justify-between flex flex-col", children: [
         /* @__PURE__ */ r(Ot, {}),
-        /* @__PURE__ */ r(S, { mode: "wait", children: e ? /* @__PURE__ */ r(
-          w,
+        /* @__PURE__ */ r(_, { mode: "wait", children: e ? /* @__PURE__ */ r(
+          f,
           {
             className: "flex flex-col items-center justify-center w-full flex-1",
             children: /* @__PURE__ */ r(Pt, {})
           },
           "loading"
         ) : /* @__PURE__ */ d(
-          w,
+          f,
           {
             className: "flex items-start h-full flex-1 overflow-auto",
             snapExit: !0,
@@ -2075,7 +2090,7 @@ function zo({ className: e }) {
   );
 }
 function Ht({ className: e }) {
-  const { token: o } = b();
+  const { token: o } = x();
   return /* @__PURE__ */ r(
     "div",
     {
@@ -2114,9 +2129,9 @@ function lt({
   session: e,
   className: o
 }) {
-  const { bot: t } = b(), { toChatScreen: n } = $(), s = e.assignee.kind === "human" ? e.assignee.name || "Support Agent" : (t == null ? void 0 : t.name) || "AI Support Agent", i = e.assignee.kind === "human" ? e.assignee.avatarUrl || "" : (t == null ? void 0 : t.avatar) || "";
+  const { bot: t } = x(), { toChatScreen: n } = $(), s = e.assignee.kind === "human" ? e.assignee.name || "Support Agent" : (t == null ? void 0 : t.name) || "AI Support Agent", i = e.assignee.kind === "human" ? e.assignee.avatarUrl || "" : (t == null ? void 0 : t.avatar) || "";
   return /* @__PURE__ */ d(
-    y,
+    k,
     {
       variant: "ghost",
       size: "lg",
@@ -2127,13 +2142,13 @@ function lt({
       onClick: () => n(e.id),
       children: [
         /* @__PURE__ */ d("div", { className: "flex-1 flex gap-2 items-center", children: [
-          /* @__PURE__ */ r(S, { mode: "wait", children: /* @__PURE__ */ r(w, { snapExit: !0, children: /* @__PURE__ */ d(xe, { className: "size-10", children: [
-            /* @__PURE__ */ r(be, { src: i, alt: "Agent Icon" }),
-            /* @__PURE__ */ r(ye, { children: /* @__PURE__ */ r(zr, { className: "size-4" }) })
+          /* @__PURE__ */ r(_, { mode: "wait", children: /* @__PURE__ */ r(f, { snapExit: !0, children: /* @__PURE__ */ d(be, { className: "size-10", children: [
+            /* @__PURE__ */ r(ye, { src: i, alt: "Agent Icon" }),
+            /* @__PURE__ */ r(ke, { children: /* @__PURE__ */ r(zr, { className: "size-4" }) })
           ] }) }) }),
           /* @__PURE__ */ d("div", { className: "flex-1", children: [
-            /* @__PURE__ */ r(S, { mode: "wait", children: /* @__PURE__ */ r(w, { snapExit: !0, children: s }, s) }),
-            /* @__PURE__ */ r(S, { mode: "wait", children: e.lastMessage ? /* @__PURE__ */ r(w, { snapExit: !0, children: /* @__PURE__ */ r(
+            /* @__PURE__ */ r(_, { mode: "wait", children: /* @__PURE__ */ r(f, { snapExit: !0, children: s }, s) }),
+            /* @__PURE__ */ r(_, { mode: "wait", children: e.lastMessage ? /* @__PURE__ */ r(f, { snapExit: !0, children: /* @__PURE__ */ r(
               Tt,
               {
                 remarkPlugins: [ft],
@@ -2141,7 +2156,7 @@ function lt({
                 className: "line-clamp-1 overflow-hidden text-ellipsis text-xs text-muted-foreground",
                 children: e.lastMessage
               }
-            ) }, e.lastMessage || "content") : /* @__PURE__ */ r(w, { className: "w-1/2", snapExit: !0, children: /* @__PURE__ */ r(Co, { className: "h-4 w-full" }) }, "skeleton") })
+            ) }, e.lastMessage || "content") : /* @__PURE__ */ r(f, { className: "w-1/2", snapExit: !0, children: /* @__PURE__ */ r(Co, { className: "h-4 w-full" }) }, "skeleton") })
           ] })
         ] }),
         /* @__PURE__ */ r(Nr, { className: "size-4 text-muted-foreground shrink-0 rtl:-scale-100" })
@@ -2156,21 +2171,21 @@ function So() {
     closedSessions: i,
     canCreateNewSession: a
   } = B();
-  return /* @__PURE__ */ r("div", { className: "flex-1 flex flex-col overflow-scroll py-2 px-2", children: /* @__PURE__ */ r(S, { mode: "wait", children: n ? /* @__PURE__ */ r(
-    w,
+  return /* @__PURE__ */ r("div", { className: "flex-1 flex flex-col overflow-scroll py-2 px-2", children: /* @__PURE__ */ r(_, { mode: "wait", children: n ? /* @__PURE__ */ r(
+    f,
     {
       className: "flex-1 flex items-center justify-center",
       children: /* @__PURE__ */ r(Pt, {})
     },
     "loading"
   ) : /* @__PURE__ */ r(
-    w,
+    f,
     {
       className: "flex-1 flex flex-col gap-2 relative",
       children: t.length ? /* @__PURE__ */ d(te, { children: [
-        /* @__PURE__ */ d(S, { children: [
+        /* @__PURE__ */ d(_, { children: [
           s.length > 0 && /* @__PURE__ */ r(
-            w,
+            f,
             {
               fadeIn: "up",
               delay: 0.2,
@@ -2181,7 +2196,7 @@ function So() {
             "open-sessions"
           ),
           i.length > 0 && /* @__PURE__ */ d(
-            w,
+            f,
             {
               className: "space-y-2",
               delay: 0.2,
@@ -2202,7 +2217,7 @@ function So() {
           )
         ] }),
         a && /* @__PURE__ */ r("div", { className: "mt-auto w-full rounded-3xl sticky bottom-0 outline outline-8 outline-background bg-background", children: /* @__PURE__ */ rt(
-          y,
+          k,
           {
             ...g("sessions/new_conversation_btn"),
             size: "lg",
@@ -2215,7 +2230,7 @@ function So() {
       ] }) : /* @__PURE__ */ d("div", { className: "flex-1 flex flex-col gap-2 items-center", children: [
         /* @__PURE__ */ r("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ r("p", { className: "text-muted-foreground", children: e("no_conversations_yet") }) }),
         /* @__PURE__ */ rt(
-          y,
+          k,
           {
             ...g("sessions/new_conversation_btn"),
             size: "lg",
@@ -2232,7 +2247,7 @@ function So() {
 }
 function _o() {
   const { theme: e } = X();
-  return ke({
+  return Ce({
     width: e.screens.sessions.width,
     height: e.screens.sessions.height
   }), /* @__PURE__ */ r(
@@ -2280,7 +2295,7 @@ const ie = G.forwardRef(
 );
 ie.displayName = "Input";
 function Io() {
-  const { contentIframeRef: e } = R(), { inline: o } = b(), t = le(null);
+  const { contentIframeRef: e } = R(), { inline: o } = x(), t = ce(null);
   return re(() => {
     const n = e == null ? void 0 : e.current;
     if (n && t.current) {
@@ -2301,35 +2316,35 @@ function Io() {
     }
   }, [e, o]), { observedElementRef: t };
 }
-const To = pe.object({
-  name: pe.string().min(2),
-  email: pe.string().email()
+const To = he.object({
+  name: he.string().min(2),
+  email: he.string().email()
 });
 function Mo() {
-  var _, M, A, F, H, E, v, C;
+  var S, M, A, F, H, E, v, z;
   const {
     widgetCtx: { org: e }
-  } = R(), { setIsOpen: o } = K(), { createUnverifiedContact: t } = Xt(), { isSmallScreen: n } = P(), s = b(), { theme: i } = X(), { t: a } = U(), { observedElementRef: c } = Io();
-  ke({
+  } = R(), { setIsOpen: o } = K(), { createUnverifiedContact: t } = Xt(), { isSmallScreen: n } = P(), s = x(), { theme: i } = X(), { t: a } = U(), { observedElementRef: c } = Io();
+  Ce({
     height: void 0,
     width: i.screens.welcome.width
   });
-  const [l, h] = I(((_ = s.prefillUserData) == null ? void 0 : _.name) || ""), [x, u] = I(((M = s.prefillUserData) == null ? void 0 : M.email) || ""), m = (s.extraDataCollectionFields || []).filter(
-    (z) => z !== "name" && z !== "email" && !!z
-  ), [k, f] = I({}), [N, T] = Rr(
-    async (z) => {
-      z.preventDefault();
-      const L = To.safeParse({ name: l, email: x });
+  const [l, h] = T(((S = s.prefillUserData) == null ? void 0 : S.name) || ""), [y, w] = T(((M = s.prefillUserData) == null ? void 0 : M.email) || ""), m = (s.extraDataCollectionFields || []).filter(
+    (N) => N !== "name" && N !== "email" && !!N
+  ), [C, u] = T({}), [b, I] = Rr(
+    async (N) => {
+      N.preventDefault();
+      const L = To.safeParse({ name: l, email: y });
       L.success && await t(
         {
           email: L.data.email,
           non_verified_name: L.data.name
         },
         // Only pass extra data if there is any
-        Object.values(k).filter(Boolean).length ? k : void 0
+        Object.values(C).filter(Boolean).length ? C : void 0
       );
     },
-    [l, x, k]
+    [l, y, C]
   );
   return /* @__PURE__ */ r(
     "div",
@@ -2364,7 +2379,7 @@ function Mo() {
                   "text-primary-foreground"
                 ),
                 children: [
-                  n && /* @__PURE__ */ r(w, { className: "absolute top-6 end-6", children: /* @__PURE__ */ r(y, { size: "selfless", onClick: () => o(!1), children: /* @__PURE__ */ r(fe, { className: "size-4" }) }) }),
+                  n && /* @__PURE__ */ r(f, { className: "absolute top-6 end-6", children: /* @__PURE__ */ r(k, { size: "selfless", onClick: () => o(!1), children: /* @__PURE__ */ r(ve, { className: "size-4" }) }) }),
                   /* @__PURE__ */ r("div", { className: "flex items-center justify-between w-full mb-2", children: (A = s.assets) != null && A.organizationLogo ? /* @__PURE__ */ r(
                     "img",
                     {
@@ -2375,7 +2390,7 @@ function Mo() {
                   ) : /* @__PURE__ */ r("h2", { className: "font-bold text-sm", children: e.name }) }),
                   /* @__PURE__ */ d("div", { className: "space-y-2", children: [
                     /* @__PURE__ */ r("h1", { className: "text-[1.75rem] font-semibold tracking-tight leading-none", children: ((E = (H = s.textContent) == null ? void 0 : H.welcomeScreen) == null ? void 0 : E.title) || a("welcome_screen_title") }),
-                    /* @__PURE__ */ r("p", { className: "text-sm", children: ((C = (v = s.textContent) == null ? void 0 : v.welcomeScreen) == null ? void 0 : C.description) || a("welcome_screen_description") })
+                    /* @__PURE__ */ r("p", { className: "text-sm", children: ((z = (v = s.textContent) == null ? void 0 : v.welcomeScreen) == null ? void 0 : z.description) || a("welcome_screen_description") })
                   ] })
                 ]
               }
@@ -2390,12 +2405,12 @@ function Mo() {
                   "rounded-3xl"
                 ),
                 children: [
-                  /* @__PURE__ */ d("form", { onSubmit: T, className: "space-y-2", children: [
+                  /* @__PURE__ */ d("form", { onSubmit: I, className: "space-y-2", children: [
                     /* @__PURE__ */ r(
                       ie,
                       {
                         value: l,
-                        onChange: (z) => h(z.target.value),
+                        onChange: (N) => h(N.target.value),
                         required: !0,
                         placeholder: a("your_name_placeholder"),
                         name: "name"
@@ -2405,33 +2420,33 @@ function Mo() {
                       ie,
                       {
                         required: !0,
-                        value: x,
-                        onChange: (z) => u(z.target.value),
+                        value: y,
+                        onChange: (N) => w(N.target.value),
                         type: "email",
                         placeholder: a("your_email_placeholder"),
                         name: "email"
                       }
                     ),
-                    m.map((z) => /* @__PURE__ */ r(
+                    m.map((N) => /* @__PURE__ */ r(
                       ie,
                       {
-                        value: k[z],
-                        onChange: (L) => f((ne) => ({
+                        value: C[N],
+                        onChange: (L) => u((ne) => ({
                           ...ne,
-                          [z]: L.target.value
+                          [N]: L.target.value
                         })),
-                        placeholder: `${z} (${a("optional")})`
+                        placeholder: `${N} (${a("optional")})`
                       },
-                      z
+                      N
                     )),
                     /* @__PURE__ */ d(
-                      y,
+                      k,
                       {
-                        disabled: N.loading,
+                        disabled: b.loading,
                         className: "w-full",
                         size: "lg",
                         children: [
-                          N.loading ? a("start_chat_button_loading") : a("start_chat_button"),
+                          b.loading ? a("start_chat_button_loading") : a("start_chat_button"),
                           /* @__PURE__ */ r(Sr, { className: "size-4 rtl:-scale-100" })
                         ]
                       }
@@ -2451,11 +2466,11 @@ function Wt() {
   const {
     routerState: { screen: e }
   } = $();
-  return /* @__PURE__ */ r("div", { className: "relative bg-background size-full", children: /* @__PURE__ */ r(S, { mode: "wait", children: (() => {
+  return /* @__PURE__ */ r("div", { className: "relative bg-background size-full", children: /* @__PURE__ */ r(_, { mode: "wait", children: (() => {
     switch (e) {
       case "welcome":
         return /* @__PURE__ */ r(
-          w,
+          f,
           {
             fadeIn: "right",
             className: "size-full",
@@ -2466,7 +2481,7 @@ function Wt() {
         );
       case "sessions":
         return /* @__PURE__ */ r(
-          w,
+          f,
           {
             fadeIn: "right",
             className: "size-full",
@@ -2477,7 +2492,7 @@ function Wt() {
         );
       case "chat":
         return /* @__PURE__ */ r(
-          w,
+          f,
           {
             fadeIn: "right",
             className: "size-full",
@@ -2491,7 +2506,7 @@ function Wt() {
     }
   })() }) });
 }
-const Do = "4.0.24", Ro = `<!DOCTYPE html>
+const Do = "4.0.27", Ro = `<!DOCTYPE html>
 <html>
 <head>
 <style>
@@ -2510,7 +2525,7 @@ html, body {
 </body>
 </html>`;
 function $t() {
-  const { isOpen: e } = K(), { contentIframeRef: o } = R(), { cssOverrides: t, inline: n } = b(), { theme: s, cssVars: i, computed: a } = X(), { dir: c } = U();
+  const { isOpen: e } = K(), { contentIframeRef: o } = R(), { cssOverrides: t, inline: n } = x(), { theme: s, cssVars: i, computed: a } = X(), { dir: c } = U();
   return /* @__PURE__ */ r(
     Z.div,
     {
@@ -2595,7 +2610,7 @@ function $t() {
 function jo() {
   const { theme: e } = X();
   return /* @__PURE__ */ r(
-    ae.Content,
+    le.Content,
     {
       onInteractOutside: (o) => o.preventDefault(),
       forceMount: !0,
@@ -2666,7 +2681,7 @@ html, body {
 </html>`;
 function Po() {
   var i, a;
-  const { isOpen: e } = K(), { cssOverrides: o, assets: t } = b(), { theme: n, cssVars: s } = X();
+  const { isOpen: e } = K(), { cssOverrides: o, assets: t } = x(), { theme: n, cssVars: s } = X();
   return /* @__PURE__ */ d(
     xt,
     {
@@ -2700,7 +2715,7 @@ function Po() {
               justifyContent: "center"
             },
             children: /* @__PURE__ */ r(
-              ae.PopoverTrigger,
+              le.PopoverTrigger,
               {
                 className: p(
                   "font-sans flex items-center justify-center rounded-full"
@@ -2721,8 +2736,8 @@ function Po() {
                       "bg-primary",
                       "text-primary-foreground"
                     ),
-                    children: /* @__PURE__ */ r(S, { mode: "wait", children: e ? /* @__PURE__ */ r(
-                      w,
+                    children: /* @__PURE__ */ r(_, { mode: "wait", children: e ? /* @__PURE__ */ r(
+                      f,
                       {
                         snapExit: !0,
                         fadeIn: "up",
@@ -2752,7 +2767,7 @@ function Po() {
                       },
                       "x-icon"
                     ) : /* @__PURE__ */ r(
-                      w,
+                      f,
                       {
                         snapExit: !0,
                         overrides: {
@@ -2793,9 +2808,9 @@ function Po() {
   );
 }
 function Ao() {
-  const { dir: e } = ue();
+  const { dir: e } = fe();
   return /* @__PURE__ */ r(
-    ae.Anchor,
+    le.Anchor,
     {
       style: {
         position: "fixed",
@@ -2808,7 +2823,7 @@ function Ao() {
 }
 function Fo() {
   const { isOpen: e, setIsOpen: o } = K();
-  return /* @__PURE__ */ d(ae.Root, { open: e, onOpenChange: o, children: [
+  return /* @__PURE__ */ d(le.Root, { open: e, onOpenChange: o, children: [
     /* @__PURE__ */ r(Ao, {}),
     /* @__PURE__ */ r(Po, {}),
     /* @__PURE__ */ r(jo, {})
@@ -2825,11 +2840,11 @@ const Ho = [
   },
   {
     key: "bot_message",
-    component: he
+    component: me
   },
   {
     key: "agent_message",
-    component: he
+    component: me
   }
 ], Wo = {
   get: async (e) => localStorage.getItem(e),