@opencx/widget 3.0.0 → 3.0.1

package/dist/basic.js

@@ -1,54 +1,81 @@
 import { jsx as X, jsxs as Nt, Fragment as G4 } from "react/jsx-runtime";
-import * as Um from "@radix-ui/react-tooltip";
 import * as ie from "react";
-import P1, { forwardRef as Hw, memo as X4, useState as Nu, cloneElement as K4, useMemo as F1, useRef as U1, useEffect as Bm, createElement as i_, useLayoutEffect as J4, useImperativeHandle as Z4, useCallback as eI } from "react";
-import { clsx as nk } from "clsx";
+import P1, { useMemo as F1, forwardRef as Hw, memo as X4, useState as Nu, cloneElement as K4, useRef as U1, useEffect as Um, createElement as i_, useLayoutEffect as J4, useImperativeHandle as Z4, useCallback as eI } from "react";
 import o_ from "tinycolor2";
-import { motion as Sc, AnimatePresence as Hm } from "framer-motion";
-import { Slot as zw } from "@radix-ui/react-slot";
-import { PaperclipIcon as tI, CircleDashed as nI, SendHorizonal as rI, CheckCheckIcon as aI, XIcon as rk, AlertCircle as iI, Loader2 as oI, FileAudio as uI, FileIcon as sI, ChevronRight as lI, Check as cI, Circle as dI, EllipsisVerticalIcon as fI, RotateCcw as hI, SendHorizontal as pI } from "lucide-react";
+import { motion as Sc, AnimatePresence as Bm } from "framer-motion";
+import { PaperclipIcon as tI, CircleDashed as nI, SendHorizonal as rI, CheckCheckIcon as aI, XIcon as nk, AlertCircle as iI, Loader2 as oI, FileAudio as uI, FileIcon as sI, ChevronRight as lI, Check as cI, Circle as dI, EllipsisVerticalIcon as fI, RotateCcw as hI, SendHorizontal as pI } from "lucide-react";
 import { useDropzone as mI } from "react-dropzone";
 import u_ from "react-hot-toast";
-import { u as $f, g as jw, d as Vw, h as gI, c as ak, e as Yw, a as zm, b as ik, _ as vI, i as Xs, j as ok, k as yI, l as s_, m as EI, W as bI } from "./useUploadFiles-BaCcqTwX.js";
+import { u as $f, g as zw, d as jw, h as gI, c as rk, e as Vw, a as Hm, b as ak, _ as vI, i as Xs, j as ik, k as yI, l as s_, m as EI, W as bI } from "./useUploadFiles-CEd5c5iE.js";
+import * as zm from "@radix-ui/react-tooltip";
+import { clsx as ok } from "clsx";
+import { Slot as Yw } from "@radix-ui/react-slot";
 import * as Yn from "@radix-ui/react-dropdown-menu";
 import { formatDistance as TI } from "date-fns";
 import * as Gf from "@radix-ui/react-avatar";
 import { z as MT } from "zod";
-const Ww = "-", wI = (e) => {
-  const n = SI(e), {
+const wI = 400, xI = 600, Ww = {
+  widgetMinHeight: "min-h-[400px]",
+  widgetMaxHeight: "max-h-[600px]",
+  widgetHeight: "h-[600px]"
+}, uk = ({ primary: e = "hsl(0, 0%, 0%)" }) => {
+  const n = o_(e).toHsl(), a = o_(e).isLight() ? "240 10% 3.9%" : "0 0% 100%";
+  return {
+    /**
+     * Spread the primary color without the `hsl()` call so that we can use tailwind opacity classes on it
+     */
+    "--opencx-primary": `${n.h} ${n.s}% ${n.l}%`,
+    "--opencx-primary-foreground": a,
+    "--opencx-background": "0 0% 100%",
+    "--opencx-foreground": "240 10% 3.9%",
+    "--opencx-accent": "240 4.8% 95.9%",
+    "--opencx-accent-foreground": "240 5.9% 10%",
+    "--opencx-destructive": "0 84.2% 60.2%",
+    "--opencx-destructive-foreground": "0 0% 98%",
+    "--opencx-secondary": "240 4.8% 95.9%",
+    "--opencx-secondary-foreground": "240 5.9% 10%",
+    "--opencx-muted": "240 4.8% 95.9%",
+    "--opencx-muted-foreground": "240 3.8% 46.1%",
+    "--opencx-input": "240 5.9% 90%",
+    "--opencx-border": "240 5.9% 90%",
+    "--opencx-ring": "240 5.9% 10%"
+    // "--opencx-trigger-offset": _.triggerOffset,
+  };
+}, qw = "-", SI = (e) => {
+  const n = _I(e), {
     conflictingClassGroups: a,
     conflictingClassGroupModifiers: s
   } = e;
   return {
     getClassGroupId: (d) => {
-      const g = d.split(Ww);
-      return g[0] === "" && g.length !== 1 && g.shift(), uk(g, n) || xI(d);
+      const g = d.split(qw);
+      return g[0] === "" && g.length !== 1 && g.shift(), sk(g, n) || CI(d);
     },
     getConflictingClassGroupIds: (d, g) => {
       const E = a[d] || [];
       return g && s[d] ? [...E, ...s[d]] : E;
     }
   };
-}, uk = (e, n) => {
+}, sk = (e, n) => {
   var d;
   if (e.length === 0)
     return n.classGroupId;
-  const a = e[0], s = n.nextPart.get(a), f = s ? uk(e.slice(1), s) : void 0;
+  const a = e[0], s = n.nextPart.get(a), f = s ? sk(e.slice(1), s) : void 0;
   if (f)
     return f;
   if (n.validators.length === 0)
     return;
-  const p = e.join(Ww);
+  const p = e.join(qw);
   return (d = n.validators.find(({
     validator: g
   }) => g(p))) == null ? void 0 : d.classGroupId;
-}, l_ = /^\[(.+)\]$/, xI = (e) => {
+}, l_ = /^\[(.+)\]$/, CI = (e) => {
   if (l_.test(e)) {
     const n = l_.exec(e)[1], a = n == null ? void 0 : n.substring(0, n.indexOf(":"));
     if (a)
       return "arbitrary.." + a;
   }
-}, SI = (e) => {
+}, _I = (e) => {
   const {
     theme: n,
     prefix: a
@@ -56,7 +83,7 @@ const Ww = "-", wI = (e) => {
     nextPart: /* @__PURE__ */ new Map(),
     validators: []
   };
-  return _I(Object.entries(e.classGroups), a).forEach(([p, d]) => {
+  return kI(Object.entries(e.classGroups), a).forEach(([p, d]) => {
     fw(d, s, p, n);
   }), s;
 }, fw = (e, n, a, s) => {
@@ -67,7 +94,7 @@ const Ww = "-", wI = (e) => {
       return;
     }
     if (typeof f == "function") {
-      if (CI(f)) {
+      if (AI(f)) {
         fw(f(s), n, a, s);
         return;
       }
@@ -83,16 +110,16 @@ const Ww = "-", wI = (e) => {
   });
 }, c_ = (e, n) => {
   let a = e;
-  return n.split(Ww).forEach((s) => {
+  return n.split(qw).forEach((s) => {
     a.nextPart.has(s) || a.nextPart.set(s, {
       nextPart: /* @__PURE__ */ new Map(),
       validators: []
     }), a = a.nextPart.get(s);
   }), a;
-}, CI = (e) => e.isThemeGetter, _I = (e, n) => n ? e.map(([a, s]) => {
+}, AI = (e) => e.isThemeGetter, kI = (e, n) => n ? e.map(([a, s]) => {
   const f = s.map((p) => typeof p == "string" ? n + p : typeof p == "object" ? Object.fromEntries(Object.entries(p).map(([d, g]) => [n + d, g])) : p);
   return [a, f];
-}) : e, AI = (e) => {
+}) : e, RI = (e) => {
   if (e < 1)
     return {
       get: () => {
@@ -116,7 +143,7 @@ const Ww = "-", wI = (e) => {
       a.has(p) ? a.set(p, d) : f(p, d);
     }
   };
-}, sk = "!", kI = (e) => {
+}, lk = "!", NI = (e) => {
   const {
     separator: n,
     experimentalParseClassName: a
@@ -137,7 +164,7 @@ const Ww = "-", wI = (e) => {
       }
       H === "[" ? T++ : H === "]" && T--;
     }
-    const R = E.length === 0 ? g : g.substring(C), A = R.startsWith(sk), D = A ? R.substring(1) : R, L = S && S > C ? S - C : void 0;
+    const R = E.length === 0 ? g : g.substring(C), A = R.startsWith(lk), D = A ? R.substring(1) : R, L = S && S > C ? S - C : void 0;
     return {
       modifiers: E,
       hasImportantModifier: A,
@@ -149,7 +176,7 @@ const Ww = "-", wI = (e) => {
     className: g,
     parseClassName: d
   }) : d;
-}, RI = (e) => {
+}, DI = (e) => {
   if (e.length <= 1)
     return e;
   const n = [];
@@ -157,16 +184,16 @@ const Ww = "-", wI = (e) => {
   return e.forEach((s) => {
     s[0] === "[" ? (n.push(...a.sort(), s), a = []) : a.push(s);
   }), n.push(...a.sort()), n;
-}, NI = (e) => ({
-  cache: AI(e.cacheSize),
-  parseClassName: kI(e),
-  ...wI(e)
-}), DI = /\s+/, OI = (e, n) => {
+}, OI = (e) => ({
+  cache: RI(e.cacheSize),
+  parseClassName: NI(e),
+  ...SI(e)
+}), LI = /\s+/, II = (e, n) => {
   const {
     parseClassName: a,
     getClassGroupId: s,
     getConflictingClassGroupIds: f
-  } = n, p = [], d = e.trim().split(DI);
+  } = n, p = [], d = e.trim().split(LI);
   let g = "";
   for (let E = d.length - 1; E >= 0; E -= 1) {
     const T = d[E], {
@@ -187,7 +214,7 @@ const Ww = "-", wI = (e) => {
       }
       D = !1;
     }
-    const U = RI(C).join(":"), H = S ? U + sk : U, G = H + L;
+    const U = DI(C).join(":"), H = S ? U + lk : U, G = H + L;
     if (p.includes(G))
       continue;
     p.push(G);
@@ -200,49 +227,49 @@ const Ww = "-", wI = (e) => {
   }
   return g;
 };
-function LI() {
+function MI() {
   let e = 0, n, a, s = "";
   for (; e < arguments.length; )
-    (n = arguments[e++]) && (a = lk(n)) && (s && (s += " "), s += a);
+    (n = arguments[e++]) && (a = ck(n)) && (s && (s += " "), s += a);
   return s;
 }
-const lk = (e) => {
+const ck = (e) => {
   if (typeof e == "string")
     return e;
   let n, a = "";
   for (let s = 0; s < e.length; s++)
-    e[s] && (n = lk(e[s])) && (a && (a += " "), a += n);
+    e[s] && (n = ck(e[s])) && (a && (a += " "), a += n);
   return a;
 };
-function II(e, ...n) {
+function PI(e, ...n) {
   let a, s, f, p = d;
   function d(E) {
     const T = n.reduce((C, S) => S(C), e());
-    return a = NI(T), s = a.cache.get, f = a.cache.set, p = g, g(E);
+    return a = OI(T), s = a.cache.get, f = a.cache.set, p = g, g(E);
   }
   function g(E) {
     const T = s(E);
     if (T)
       return T;
-    const C = OI(E, a);
+    const C = II(E, a);
     return f(E, C), C;
   }
   return function() {
-    return p(LI.apply(null, arguments));
+    return p(MI.apply(null, arguments));
   };
 }
 const hn = (e) => {
   const n = (a) => a[e] || [];
   return n.isThemeGetter = !0, n;
-}, ck = /^\[(?:([a-z-]+):)?(.+)\]$/i, MI = /^\d+\/\d+$/, PI = /* @__PURE__ */ new Set(["px", "full", "screen"]), FI = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, UI = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, BI = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/, HI = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, zI = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, ku = (e) => Bf(e) || PI.has(e) || MI.test(e), Ys = (e) => Xf(e, "length", GI), Bf = (e) => !!e && !Number.isNaN(Number(e)), PT = (e) => Xf(e, "number", Bf), Em = (e) => !!e && Number.isInteger(Number(e)), jI = (e) => e.endsWith("%") && Bf(e.slice(0, -1)), Tt = (e) => ck.test(e), Ws = (e) => FI.test(e), VI = /* @__PURE__ */ new Set(["length", "size", "percentage"]), YI = (e) => Xf(e, VI, dk), WI = (e) => Xf(e, "position", dk), qI = /* @__PURE__ */ new Set(["image", "url"]), QI = (e) => Xf(e, qI, KI), $I = (e) => Xf(e, "", XI), bm = () => !0, Xf = (e, n, a) => {
-  const s = ck.exec(e);
+}, dk = /^\[(?:([a-z-]+):)?(.+)\]$/i, FI = /^\d+\/\d+$/, UI = /* @__PURE__ */ new Set(["px", "full", "screen"]), BI = /^(\d+(\.\d+)?)?(xs|sm|md|lg|xl)$/, HI = /\d+(%|px|r?em|[sdl]?v([hwib]|min|max)|pt|pc|in|cm|mm|cap|ch|ex|r?lh|cq(w|h|i|b|min|max))|\b(calc|min|max|clamp)\(.+\)|^0$/, zI = /^(rgba?|hsla?|hwb|(ok)?(lab|lch))\(.+\)$/, jI = /^(inset_)?-?((\d+)?\.?(\d+)[a-z]+|0)_-?((\d+)?\.?(\d+)[a-z]+|0)/, VI = /^(url|image|image-set|cross-fade|element|(repeating-)?(linear|radial|conic)-gradient)\(.+\)$/, ku = (e) => Bf(e) || UI.has(e) || FI.test(e), Ys = (e) => Xf(e, "length", KI), Bf = (e) => !!e && !Number.isNaN(Number(e)), PT = (e) => Xf(e, "number", Bf), Em = (e) => !!e && Number.isInteger(Number(e)), YI = (e) => e.endsWith("%") && Bf(e.slice(0, -1)), Tt = (e) => dk.test(e), Ws = (e) => BI.test(e), WI = /* @__PURE__ */ new Set(["length", "size", "percentage"]), qI = (e) => Xf(e, WI, fk), QI = (e) => Xf(e, "position", fk), $I = /* @__PURE__ */ new Set(["image", "url"]), GI = (e) => Xf(e, $I, ZI), XI = (e) => Xf(e, "", JI), bm = () => !0, Xf = (e, n, a) => {
+  const s = dk.exec(e);
   return s ? s[1] ? typeof n == "string" ? s[1] === n : n.has(s[1]) : a(s[2]) : !1;
-}, GI = (e) => (
+}, KI = (e) => (
   // `colorFunctionRegex` check is necessary because color functions can have percentages in them which which would be incorrectly classified as lengths.
   // For example, `hsl(0 0% 0%)` would be classified as a length without this check.
   // I could also use lookbehind assertion in `lengthUnitRegex` but that isn't supported widely enough.
-  UI.test(e) && !BI.test(e)
-), dk = () => !1, XI = (e) => HI.test(e), KI = (e) => zI.test(e), JI = () => {
+  HI.test(e) && !zI.test(e)
+), fk = () => !1, JI = (e) => jI.test(e), ZI = (e) => VI.test(e), e5 = () => {
   const e = hn("colors"), n = hn("spacing"), a = hn("blur"), s = hn("brightness"), f = hn("borderColor"), p = hn("borderRadius"), d = hn("borderSpacing"), g = hn("borderWidth"), E = hn("contrast"), T = hn("grayscale"), C = hn("hueRotate"), S = hn("invert"), R = hn("gap"), A = hn("gradientColorStops"), D = hn("gradientColorStopPositions"), L = hn("inset"), U = hn("margin"), H = hn("opacity"), G = hn("padding"), Y = hn("saturate"), Z = hn("scale"), K = hn("sepia"), W = hn("skew"), ce = hn("space"), Ie = hn("translate"), Pe = () => ["auto", "contain", "none"], J = () => ["auto", "hidden", "clip", "visible", "scroll"], Ee = () => ["auto", Tt, n], ge = () => [Tt, n], ke = () => ["", ku, Ys], De = () => ["auto", Bf, Tt], qe = () => ["bottom", "center", "left", "left-bottom", "left-top", "right", "right-bottom", "right-top", "top"], je = () => ["solid", "dashed", "dotted", "double", "none"], at = () => ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "hue", "saturation", "color", "luminosity"], pe = () => ["start", "end", "center", "between", "around", "evenly", "stretch"], Ne = () => ["", "0", Tt], P = () => ["auto", "avoid", "all", "avoid-page", "page", "left", "right", "column"], et = () => [Bf, Tt];
   return {
     cacheSize: 500,
@@ -262,7 +289,7 @@ const hn = (e) => {
       invert: Ne(),
       gap: ge(),
       gradientColorStops: [e],
-      gradientColorStopPositions: [jI, Ys],
+      gradientColorStopPositions: [YI, Ys],
       inset: Ee(),
       margin: Ee(),
       opacity: et(),
@@ -1175,7 +1202,7 @@ const hn = (e) => {
        * @see https://tailwindcss.com/docs/background-position
        */
       "bg-position": [{
-        bg: [...qe(), WI]
+        bg: [...qe(), QI]
       }],
       /**
        * Background Repeat
@@ -1191,7 +1218,7 @@ const hn = (e) => {
        * @see https://tailwindcss.com/docs/background-size
        */
       "bg-size": [{
-        bg: ["auto", "cover", "contain", YI]
+        bg: ["auto", "cover", "contain", qI]
       }],
       /**
        * Background Image
@@ -1200,7 +1227,7 @@ const hn = (e) => {
       "bg-image": [{
         bg: ["none", {
           "gradient-to": ["t", "tr", "r", "br", "b", "bl", "l", "tl"]
-        }, QI]
+        }, GI]
       }],
       /**
        * Background Color
@@ -1616,7 +1643,7 @@ const hn = (e) => {
        * @see https://tailwindcss.com/docs/box-shadow
        */
       shadow: [{
-        shadow: ["", "inner", "none", Ws, $I]
+        shadow: ["", "inner", "none", Ws, XI]
       }],
       /**
        * Box Shadow Color
@@ -2271,12 +2298,12 @@ const hn = (e) => {
       "font-size": ["leading"]
     }
   };
-}, ZI = /* @__PURE__ */ II(JI);
+}, t5 = /* @__PURE__ */ PI(e5);
 function Ft(...e) {
-  return ZI(nk(e));
+  return t5(ok(e));
 }
-const e5 = Um.Provider, t5 = Um.Root, n5 = Um.Trigger, fk = ie.forwardRef(({ className: e, sideOffset: n = 4, ...a }, s) => /* @__PURE__ */ X(
-  Um.Content,
+const n5 = zm.Provider, r5 = zm.Root, a5 = zm.Trigger, hk = ie.forwardRef(({ className: e, sideOffset: n = 4, ...a }, s) => /* @__PURE__ */ X(
+  zm.Content,
   {
     ref: s,
     sideOffset: n,
@@ -2287,17 +2314,17 @@ const e5 = Um.Provider, t5 = Um.Root, n5 = Um.Trigger, fk = ie.forwardRef(({ cla
     ...a
   }
 ));
-fk.displayName = Um.Content.displayName;
+hk.displayName = zm.Content.displayName;
 function hw({
   children: e,
   content: n,
   side: a,
   align: s
 }) {
-  return /* @__PURE__ */ Nt(t5, { children: [
-    /* @__PURE__ */ X(n5, { asChild: !0, children: e }),
+  return /* @__PURE__ */ Nt(r5, { children: [
+    /* @__PURE__ */ X(a5, { asChild: !0, children: e }),
     /* @__PURE__ */ X(
-      fk,
+      hk,
       {
         side: a,
         align: s,
@@ -2308,212 +2335,7 @@ function hw({
     )
   ] });
 }
-const r5 = 400, a5 = 600, qw = {
-  widgetMinHeight: "min-h-[400px]",
-  widgetMaxHeight: "max-h-[600px]",
-  widgetHeight: "h-[600px]"
-}, hk = ({ primary: e = "hsl(0, 0%, 0%)" }) => {
-  const n = o_(e).toHsl(), a = o_(e).isLight() ? "240 10% 3.9%" : "0 0% 100%";
-  return {
-    /**
-     * Spread the primary color without the `hsl()` call so that we can use tailwind opacity classes on it
-     */
-    "--opencx-primary": `${n.h} ${n.s}% ${n.l}%`,
-    "--opencx-primary-foreground": a,
-    "--opencx-background": "0 0% 100%",
-    "--opencx-foreground": "240 10% 3.9%",
-    "--opencx-accent": "240 4.8% 95.9%",
-    "--opencx-accent-foreground": "240 5.9% 10%",
-    "--opencx-destructive": "0 84.2% 60.2%",
-    "--opencx-destructive-foreground": "0 0% 98%",
-    "--opencx-secondary": "240 4.8% 95.9%",
-    "--opencx-secondary-foreground": "240 5.9% 10%",
-    "--opencx-muted": "240 4.8% 95.9%",
-    "--opencx-muted-foreground": "240 3.8% 46.1%",
-    "--opencx-input": "240 5.9% 90%",
-    "--opencx-border": "240 5.9% 90%",
-    "--opencx-ring": "240 5.9% 10%"
-    // "--opencx-trigger-offset": _.triggerOffset,
-  };
-}, i5 = 10, o5 = (e, n) => ({
-  initial: { opacity: 0, x: -e, ...n.initial },
-  animate: { opacity: 1, x: 0, ...n.animate },
-  exit: { opacity: 0, x: e, ...n.exit }
-}), u5 = (e, n) => ({
-  initial: { opacity: 0, x: e, ...n.initial },
-  animate: { opacity: 1, x: 0, ...n.animate },
-  exit: { opacity: 0, x: -e, ...n.exit }
-}), s5 = (e, n) => ({
-  initial: { opacity: 0, y: e, ...n.initial },
-  animate: { opacity: 1, y: 0, ...n.animate },
-  exit: { opacity: 0, y: -e, ...n.exit }
-}), l5 = (e, n) => ({
-  initial: { opacity: 0, y: -e, ...n.initial },
-  animate: { opacity: 1, y: 0, ...n.animate },
-  exit: { opacity: 0, y: e, ...n.exit }
-}), c5 = {
-  right: o5,
-  left: u5,
-  up: s5,
-  down: l5
-}, Du = Hw(
-  ({
-    fadeIn: e = "down",
-    distance: n = i5,
-    children: a,
-    snapExit: s = !1,
-    overrides: f = {},
-    ...p
-  }, d) => {
-    const g = e ? c5[e](n, f) : {};
-    return s && g.exit && typeof g.exit == "object" && !Array.isArray(g.exit) && (g.exit.transition = { duration: 0 }), /* @__PURE__ */ X(Sc.div, { ref: d, ...p, ...g, children: a });
-  }
-);
-Du.displayName = "MotionDiv";
-const d_ = (e) => typeof e == "boolean" ? "".concat(e) : e === 0 ? "0" : e, f_ = nk, d5 = (e, n) => (a) => {
-  var s;
-  if ((n == null ? void 0 : n.variants) == null) return f_(e, a == null ? void 0 : a.class, a == null ? void 0 : a.className);
-  const { variants: f, defaultVariants: p } = n, d = Object.keys(f).map((T) => {
-    const C = a == null ? void 0 : a[T], S = p == null ? void 0 : p[T];
-    if (C === null) return null;
-    const R = d_(C) || d_(S);
-    return f[T][R];
-  }), g = a && Object.entries(a).reduce((T, C) => {
-    let [S, R] = C;
-    return R === void 0 || (T[S] = R), T;
-  }, {}), E = n == null || (s = n.compoundVariants) === null || s === void 0 ? void 0 : s.reduce((T, C) => {
-    let { class: S, className: R, ...A } = C;
-    return Object.entries(A).every((D) => {
-      let [L, U] = D;
-      return Array.isArray(U) ? U.includes({
-        ...p,
-        ...g
-      }[L]) : {
-        ...p,
-        ...g
-      }[L] === U;
-    }) ? [
-      ...T,
-      S,
-      R
-    ] : T;
-  }, []);
-  return f_(e, d, E, a == null ? void 0 : a.class, a == null ? void 0 : a.className);
-}, h_ = {
-  x: 2,
-  y: 2
-}, f5 = {
-  1: "scale-[1]",
-  "1.01": "scale-[1.01]",
-  "1.02": "scale-[1.02]",
-  "1.1": "scale-[1.1]"
-}, B1 = X4(
-  Hw(
-    ({ children: e, className: n, scale: a = "1.02", off: s = !1 }, f) => {
-      const [p, d] = Nu(!1), [g, E] = Nu({ x: 0, y: 0 });
-      if (s || /translate/.test(
-        e.props.className || ""
-      )) return e;
-      const C = (D) => {
-        var Ie, Pe;
-        const { clientX: L, clientY: U } = D, H = D.currentTarget.getBoundingClientRect(), G = L - (H.left + H.width / 2), Y = U - (H.top + H.height / 2), Z = Math.max(
-          -1,
-          Math.min(1, G / (H.width / 2))
-        ), K = Math.max(
-          -1,
-          Math.min(1, Y / (H.height / 2))
-        ), W = Z * h_.x, ce = K * h_.y;
-        E({ x: W, y: ce }), (Pe = (Ie = e.props).onMouseMove) == null || Pe.call(Ie, D);
-      }, S = () => {
-        var D, L;
-        d(!0), (L = (D = e.props).onMouseEnter) == null || L.call(D);
-      }, R = () => {
-        var D, L;
-        d(!1), E({ x: 0, y: 0 }), (L = (D = e.props).onMouseLeave) == null || L.call(D);
-      }, A = {
-        "--opencx-wobble-x": p ? `${g.x}px` : "0px",
-        "--opencx-wobble-y": p ? `${g.y}px` : "0px"
-      };
-      return K4(e, {
-        ref: f,
-        onMouseMove: C,
-        onMouseEnter: S,
-        onMouseLeave: R,
-        style: {
-          ...A,
-          ...e.props.style
-        },
-        className: Ft(
-          "translate-x-[var(--opencx-wobble-x)]",
-          "translate-y-[var(--opencx-wobble-y)]",
-          `hover:${f5[a]}`,
-          n,
-          e.props.className,
-          "transition-all ease-out"
-        )
-      });
-    }
-  )
-);
-B1.displayName = "Wobble";
-const h5 = d5(
-  Ft(
-    "inline-flex shrink-0 items-center justify-center gap-2",
-    "text-sm font-medium whitespace-nowrap",
-    "ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-    "disabled:pointer-events-none disabled:opacity-50",
-    "shadow-sm active:shadow-none active:scale-95 hover:active:scale-95",
-    "rounded-xl",
-    // Add border to make transitions between variants smoother... because border takes 1 pixel of space in each direction
-    "border",
-    "transition"
-  ),
-  {
-    variants: {
-      variant: {
-        default: "border-primary bg-primary text-primary-foreground",
-        destructive: "border-destructive bg-destructive text-destructive-foreground",
-        outline: "bg-background hover:bg-accent hover:text-accent-foreground",
-        secondary: "bg-secondary text-secondary-foreground",
-        ghost: "border-transparent shadow-none hover:bg-accent hover:text-accent-foreground",
-        link: "border-transparent shadow-none text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-10 px-4 py-2",
-        sm: "h-8 px-3 text-xs",
-        lg: "h-11 px-8",
-        icon: "h-10 w-10",
-        fit: "size-fit p-2"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-), Zs = ie.forwardRef(
-  ({ className: e, variant: n, size: a, asChild: s = !1, ...f }, p) => /* @__PURE__ */ X(B1, { ref: p, children: /* @__PURE__ */ X(
-    s ? zw : "button",
-    {
-      className: Ft(h5({ variant: n, size: a, className: e })),
-      ...f
-    }
-  ) })
-);
-Zs.displayName = "Button";
-function p5({ options: e, onKeyboardClick: n }) {
-  return /* @__PURE__ */ X("div", { className: "flex items-center gap-2 p-2 flex-wrap", children: e.map((a, s) => /* @__PURE__ */ X(
-    Zs,
-    {
-      onClick: () => n(a),
-      className: "flex-1 rounded-full",
-      size: "sm",
-      children: a
-    },
-    s
-  )) });
-}
-const m5 = {
+const i5 = {
   ok: "حسنا",
   yes: "نعم",
   no: "لا",
@@ -2566,7 +2388,7 @@ const m5 = {
   "start-chat": "تحدث إلى الدعم",
   "starting-chat": "جاري الاتصال...",
   "hello-greeting": "مرحبًا! كيف يمكننا مساعدتك اليوم؟"
-}, g5 = {
+}, o5 = {
   ok: "OK",
   yes: "Ja",
   no: "Nein",
@@ -2619,7 +2441,7 @@ const m5 = {
   "start-chat": "Mit dem Support sprechen",
   "starting-chat": "Verbindung wird hergestellt...",
   "hello-greeting": "Hallo! Wie können wir Ihnen heute helfen?"
-}, v5 = {
+}, u5 = {
   ok: "OK",
   yes: "Yes",
   no: "No",
@@ -2672,7 +2494,7 @@ const m5 = {
   "start-chat": "Talk to support",
   "starting-chat": "Connecting...",
   "hello-greeting": "Hi there!"
-}, y5 = {
+}, s5 = {
   ok: "D'accord",
   yes: "Oui",
   no: "Non",
@@ -2725,7 +2547,7 @@ const m5 = {
   "start-chat": "Parler au support",
   "starting-chat": "Connexion...",
   "hello-greeting": "Bonjour ! Comment pouvons-nous vous aider aujourd'hui ?"
-}, E5 = {
+}, l5 = {
   ok: "OK",
   yes: "Ja",
   no: "Nee",
@@ -2778,7 +2600,7 @@ const m5 = {
   "start-chat": "Praat met ondersteuning",
   "starting-chat": "Verbinding maken...",
   "hello-greeting": "Hallo! Hoe kunnen we u vandaag helpen?"
-}, b5 = {
+}, c5 = {
   ok: "OK",
   yes: "Sim",
   no: "Não",
@@ -2832,37 +2654,203 @@ const m5 = {
   "starting-chat": "Conectando...",
   "hello-greeting": "Olá! Como podemos ajudar você hoje?"
 }, pk = {
-  en: v5,
-  ar: m5,
-  nl: E5,
-  fr: y5,
-  de: g5,
-  pt: b5
-}, T5 = Object.keys(pk), w5 = (e) => T5.includes(e);
-function x5(e, n) {
+  en: u5,
+  ar: i5,
+  nl: l5,
+  fr: s5,
+  de: o5,
+  pt: c5
+}, d5 = Object.keys(pk), f5 = (e) => d5.includes(e);
+function h5(e, n) {
   const a = pk[n];
   return a && a[e] || "";
 }
-function H1() {
+function B1() {
   const {
     widgetCtx: { config: e }
   } = $f();
   return F1(() => {
-    const a = w5(e.language) ? e.language : "en";
+    const a = f5(e.language) ? e.language : "en";
     return {
-      get: (s) => x5(s, a),
+      get: (s) => h5(s, a),
       lang: a
     };
   }, [e.language]);
 }
-function S5({
+const p5 = 10, m5 = (e, n) => ({
+  initial: { opacity: 0, x: -e, ...n.initial },
+  animate: { opacity: 1, x: 0, ...n.animate },
+  exit: { opacity: 0, x: e, ...n.exit }
+}), g5 = (e, n) => ({
+  initial: { opacity: 0, x: e, ...n.initial },
+  animate: { opacity: 1, x: 0, ...n.animate },
+  exit: { opacity: 0, x: -e, ...n.exit }
+}), v5 = (e, n) => ({
+  initial: { opacity: 0, y: e, ...n.initial },
+  animate: { opacity: 1, y: 0, ...n.animate },
+  exit: { opacity: 0, y: -e, ...n.exit }
+}), y5 = (e, n) => ({
+  initial: { opacity: 0, y: -e, ...n.initial },
+  animate: { opacity: 1, y: 0, ...n.animate },
+  exit: { opacity: 0, y: e, ...n.exit }
+}), E5 = {
+  right: m5,
+  left: g5,
+  up: v5,
+  down: y5
+}, Du = Hw(
+  ({
+    fadeIn: e = "down",
+    distance: n = p5,
+    children: a,
+    snapExit: s = !1,
+    overrides: f = {},
+    ...p
+  }, d) => {
+    const g = e ? E5[e](n, f) : {};
+    return s && g.exit && typeof g.exit == "object" && !Array.isArray(g.exit) && (g.exit.transition = { duration: 0 }), /* @__PURE__ */ X(Sc.div, { ref: d, ...p, ...g, children: a });
+  }
+);
+Du.displayName = "MotionDiv";
+const d_ = (e) => typeof e == "boolean" ? "".concat(e) : e === 0 ? "0" : e, f_ = ok, b5 = (e, n) => (a) => {
+  var s;
+  if ((n == null ? void 0 : n.variants) == null) return f_(e, a == null ? void 0 : a.class, a == null ? void 0 : a.className);
+  const { variants: f, defaultVariants: p } = n, d = Object.keys(f).map((T) => {
+    const C = a == null ? void 0 : a[T], S = p == null ? void 0 : p[T];
+    if (C === null) return null;
+    const R = d_(C) || d_(S);
+    return f[T][R];
+  }), g = a && Object.entries(a).reduce((T, C) => {
+    let [S, R] = C;
+    return R === void 0 || (T[S] = R), T;
+  }, {}), E = n == null || (s = n.compoundVariants) === null || s === void 0 ? void 0 : s.reduce((T, C) => {
+    let { class: S, className: R, ...A } = C;
+    return Object.entries(A).every((D) => {
+      let [L, U] = D;
+      return Array.isArray(U) ? U.includes({
+        ...p,
+        ...g
+      }[L]) : {
+        ...p,
+        ...g
+      }[L] === U;
+    }) ? [
+      ...T,
+      S,
+      R
+    ] : T;
+  }, []);
+  return f_(e, d, E, a == null ? void 0 : a.class, a == null ? void 0 : a.className);
+}, h_ = {
+  x: 2,
+  y: 2
+}, T5 = {
+  1: "scale-[1]",
+  "1.01": "scale-[1.01]",
+  "1.02": "scale-[1.02]",
+  "1.1": "scale-[1.1]"
+}, H1 = X4(
+  Hw(
+    ({ children: e, className: n, scale: a = "1.02", off: s = !1 }, f) => {
+      const [p, d] = Nu(!1), [g, E] = Nu({ x: 0, y: 0 });
+      if (s || /translate/.test(
+        e.props.className || ""
+      )) return e;
+      const C = (D) => {
+        var Ie, Pe;
+        const { clientX: L, clientY: U } = D, H = D.currentTarget.getBoundingClientRect(), G = L - (H.left + H.width / 2), Y = U - (H.top + H.height / 2), Z = Math.max(
+          -1,
+          Math.min(1, G / (H.width / 2))
+        ), K = Math.max(
+          -1,
+          Math.min(1, Y / (H.height / 2))
+        ), W = Z * h_.x, ce = K * h_.y;
+        E({ x: W, y: ce }), (Pe = (Ie = e.props).onMouseMove) == null || Pe.call(Ie, D);
+      }, S = () => {
+        var D, L;
+        d(!0), (L = (D = e.props).onMouseEnter) == null || L.call(D);
+      }, R = () => {
+        var D, L;
+        d(!1), E({ x: 0, y: 0 }), (L = (D = e.props).onMouseLeave) == null || L.call(D);
+      }, A = {
+        "--opencx-wobble-x": p ? `${g.x}px` : "0px",
+        "--opencx-wobble-y": p ? `${g.y}px` : "0px"
+      };
+      return K4(e, {
+        ref: f,
+        onMouseMove: C,
+        onMouseEnter: S,
+        onMouseLeave: R,
+        style: {
+          ...A,
+          ...e.props.style
+        },
+        className: Ft(
+          "translate-x-[var(--opencx-wobble-x)]",
+          "translate-y-[var(--opencx-wobble-y)]",
+          `hover:${T5[a]}`,
+          n,
+          e.props.className,
+          "transition-all ease-out"
+        )
+      });
+    }
+  )
+);
+H1.displayName = "Wobble";
+const w5 = b5(
+  Ft(
+    "inline-flex shrink-0 items-center justify-center gap-2",
+    "text-sm font-medium whitespace-nowrap",
+    "ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+    "disabled:pointer-events-none disabled:opacity-50",
+    "shadow-sm active:shadow-none active:scale-95 hover:active:scale-95",
+    "rounded-xl",
+    // Add border to make transitions between variants smoother... because border takes 1 pixel of space in each direction
+    "border",
+    "transition"
+  ),
+  {
+    variants: {
+      variant: {
+        default: "border-primary bg-primary text-primary-foreground",
+        destructive: "border-destructive bg-destructive text-destructive-foreground",
+        outline: "bg-background hover:bg-accent hover:text-accent-foreground",
+        secondary: "bg-secondary text-secondary-foreground",
+        ghost: "border-transparent shadow-none hover:bg-accent hover:text-accent-foreground",
+        link: "border-transparent shadow-none text-primary underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-10 px-4 py-2",
+        sm: "h-8 px-3 text-xs",
+        lg: "h-11 px-8",
+        icon: "h-10 w-10",
+        fit: "size-fit p-2"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+), Zs = ie.forwardRef(
+  ({ className: e, variant: n, size: a, asChild: s = !1, ...f }, p) => /* @__PURE__ */ X(H1, { ref: p, children: /* @__PURE__ */ X(
+    s ? Yw : "button",
+    {
+      className: Ft(w5({ variant: n, size: a, className: e })),
+      ...f
+    }
+  ) })
+);
+Zs.displayName = "Button";
+function x5({
   file: { status: e, file: n, error: a },
   onCancel: s
 }) {
   const [f, p] = Nu(
     null
   );
-  Bm(() => {
+  Um(() => {
     if (!n.type.startsWith("image/")) return;
     const E = new FileReader();
     return E.onload = () => p(E.result), E.onerror = () => console.error("Error reading file"), E.readAsDataURL(n), () => E.abort();
@@ -2924,7 +2912,7 @@ function S5({
                   "opacity-0 group-hover:opacity-100 transition"
                 ),
                 onClick: s,
-                children: /* @__PURE__ */ X(rk, { className: "size-4 text-primary-foreground" })
+                children: /* @__PURE__ */ X(nk, { className: "size-4 text-primary-foreground" })
               }
             ),
             /* @__PURE__ */ X(g, {})
@@ -2935,16 +2923,16 @@ function S5({
   );
 }
 const p_ = Ft("rounded-3xl");
-function C5() {
+function S5() {
   var Z;
-  const e = U1(null), { messageCtx: n } = Vw(), { session: a } = jw(), s = H1(), [f, p] = Nu(""), {
+  const e = U1(null), { messageCtx: n } = jw(), { session: a } = zw(), s = B1(), [f, p] = Nu(""), {
     allFiles: d,
     emptyTheFiles: g,
     handleCancelUpload: E,
     appendFiles: T,
     isUploading: C,
     successFiles: S
-  } = gI(), R = !!((Z = a.session) != null && Z.isHandedOff), { isAwaitingBotReply: A } = ak(), D = (K) => {
+  } = gI(), R = !!((Z = a.session) != null && Z.isHandedOff), { isAwaitingBotReply: A } = rk(), D = (K) => {
     R && T(K);
   }, L = async () => {
     if (A) return;
@@ -3008,8 +2996,8 @@ function C5() {
                 {
                   className: "flex items-center gap-1 px-2",
                   "data-test": "file-attachments-container",
-                  children: /* @__PURE__ */ X(Hm, { mode: "popLayout", children: d.map((K) => /* @__PURE__ */ X(Du, { snapExit: !0, children: /* @__PURE__ */ X(
-                    S5,
+                  children: /* @__PURE__ */ X(Bm, { mode: "popLayout", children: d.map((K) => /* @__PURE__ */ X(Du, { snapExit: !0, children: /* @__PURE__ */ X(
+                    x5,
                     {
                       onCancel: () => E(K.id),
                       file: K
@@ -3100,8 +3088,8 @@ function C5() {
     }
   );
 }
-function _5() {
-  const { widgetCtx: e } = $f(), n = H1();
+function C5() {
+  const { widgetCtx: e } = $f(), n = B1();
   return /* @__PURE__ */ X("div", { className: "p-2", "data-test": "session-closed-container", children: /* @__PURE__ */ Nt(
     "div",
     {
@@ -3132,10 +3120,10 @@ function _5() {
     }
   ) });
 }
-function A5() {
+function _5() {
   var n;
-  const { session: e } = jw();
-  return /* @__PURE__ */ X("div", { children: /* @__PURE__ */ X(Hm, { mode: "wait", children: e.session && !((n = e.session) != null && n.isOpened) ? /* @__PURE__ */ X(
+  const { session: e } = zw();
+  return /* @__PURE__ */ X("div", { children: /* @__PURE__ */ X(Bm, { mode: "wait", children: e.session && !((n = e.session) != null && n.isOpened) ? /* @__PURE__ */ X(
     Du,
     {
       className: "overflow-hidden",
@@ -3144,7 +3132,7 @@ function A5() {
         animate: { height: "auto" },
         exit: { height: 0 }
       },
-      children: /* @__PURE__ */ X(_5, {})
+      children: /* @__PURE__ */ X(C5, {})
     },
     "session-closed"
   ) : /* @__PURE__ */ X(
@@ -3156,12 +3144,12 @@ function A5() {
         animate: { height: "auto" },
         exit: { height: 0 }
       },
-      children: /* @__PURE__ */ X(C5, {})
+      children: /* @__PURE__ */ X(S5, {})
     },
     "chat-input"
   ) }) });
 }
-const k5 = Yn.Root, R5 = Yn.Trigger, N5 = Yn.Group, D5 = ie.forwardRef(({ className: e, inset: n, children: a, ...s }, f) => /* @__PURE__ */ Nt(
+const A5 = Yn.Root, k5 = Yn.Trigger, R5 = Yn.Group, N5 = ie.forwardRef(({ className: e, inset: n, children: a, ...s }, f) => /* @__PURE__ */ Nt(
   Yn.SubTrigger,
   {
     ref: f,
@@ -3177,8 +3165,8 @@ const k5 = Yn.Root, R5 = Yn.Trigger, N5 = Yn.Group, D5 = ie.forwardRef(({ classN
     ]
   }
 ));
-D5.displayName = Yn.SubTrigger.displayName;
-const O5 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
+N5.displayName = Yn.SubTrigger.displayName;
+const D5 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
   Yn.SubContent,
   {
     ref: a,
@@ -3189,7 +3177,7 @@ const O5 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
     ...n
   }
 ));
-O5.displayName = Yn.SubContent.displayName;
+D5.displayName = Yn.SubContent.displayName;
 const mk = ie.forwardRef(({ className: e, sideOffset: n = 4, ...a }, s) => /* @__PURE__ */ X(
   Yn.Content,
   {
@@ -3217,7 +3205,7 @@ const gk = ie.forwardRef(({ className: e, inset: n, ...a }, s) => /* @__PURE__ *
   }
 ) }));
 gk.displayName = Yn.Item.displayName;
-const L5 = ie.forwardRef(({ className: e, children: n, checked: a, ...s }, f) => /* @__PURE__ */ Nt(
+const O5 = ie.forwardRef(({ className: e, children: n, checked: a, ...s }, f) => /* @__PURE__ */ Nt(
   Yn.CheckboxItem,
   {
     ref: f,
@@ -3233,8 +3221,8 @@ const L5 = ie.forwardRef(({ className: e, children: n, checked: a, ...s }, f) =>
     ]
   }
 ));
-L5.displayName = Yn.CheckboxItem.displayName;
-const I5 = ie.forwardRef(({ className: e, children: n, ...a }, s) => /* @__PURE__ */ Nt(
+O5.displayName = Yn.CheckboxItem.displayName;
+const L5 = ie.forwardRef(({ className: e, children: n, ...a }, s) => /* @__PURE__ */ Nt(
   Yn.RadioItem,
   {
     ref: s,
@@ -3249,8 +3237,8 @@ const I5 = ie.forwardRef(({ className: e, children: n, ...a }, s) => /* @__PURE_
     ]
   }
 ));
-I5.displayName = Yn.RadioItem.displayName;
-const M5 = ie.forwardRef(({ className: e, inset: n, ...a }, s) => /* @__PURE__ */ X(
+L5.displayName = Yn.RadioItem.displayName;
+const I5 = ie.forwardRef(({ className: e, inset: n, ...a }, s) => /* @__PURE__ */ X(
   Yn.Label,
   {
     ref: s,
@@ -3262,8 +3250,8 @@ const M5 = ie.forwardRef(({ className: e, inset: n, ...a }, s) => /* @__PURE__ *
     ...a
   }
 ));
-M5.displayName = Yn.Label.displayName;
-const P5 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
+I5.displayName = Yn.Label.displayName;
+const M5 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
   Yn.Separator,
   {
     ref: a,
@@ -3271,8 +3259,8 @@ const P5 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
     ...n
   }
 ));
-P5.displayName = Yn.Separator.displayName;
-function F5({
+M5.displayName = Yn.Separator.displayName;
+function P5({
   className: e,
   ...n
 }) {
@@ -3284,11 +3272,11 @@ function F5({
     }
   );
 }
-function U5() {
-  const e = H1(), [n, a] = Nu(!1), { widgetCtx: s } = $f();
-  return /* @__PURE__ */ Nt(k5, { open: n, onOpenChange: a, children: [
-    /* @__PURE__ */ X(R5, { asChild: !0, children: /* @__PURE__ */ X(Zs, { variant: "ghost", size: "fit", className: "rounded-full", children: /* @__PURE__ */ X(fI, { className: "size-4" }) }) }),
-    /* @__PURE__ */ X(mk, { align: "end", className: "min-w-56", children: /* @__PURE__ */ X(N5, { children: /* @__PURE__ */ Nt(
+function F5() {
+  const e = B1(), [n, a] = Nu(!1), { widgetCtx: s } = $f();
+  return /* @__PURE__ */ Nt(A5, { open: n, onOpenChange: a, children: [
+    /* @__PURE__ */ X(k5, { asChild: !0, children: /* @__PURE__ */ X(Zs, { variant: "ghost", size: "fit", className: "rounded-full", children: /* @__PURE__ */ X(fI, { className: "size-4" }) }) }),
+    /* @__PURE__ */ X(mk, { align: "end", className: "min-w-56", children: /* @__PURE__ */ X(R5, { children: /* @__PURE__ */ Nt(
       gk,
       {
         onSelect: () => {
@@ -3309,14 +3297,80 @@ function U5() {
     ) }) })
   ] });
 }
-function B5() {
+function U5() {
   var a;
-  const { data: e, isLoading: n } = Yw();
+  const { data: e, isLoading: n } = Vw();
   return /* @__PURE__ */ X("header", { className: "p-2 border-b bg-background", children: /* @__PURE__ */ Nt("div", { className: "flex items-center gap-2", children: [
-    /* @__PURE__ */ X("div", { className: "flex-1 pl-2", children: n ? /* @__PURE__ */ X(F5, { className: "h-4 w-2/3" }) : /* @__PURE__ */ X("h2", { className: "font-semibold", children: (a = e == null ? void 0 : e.data) == null ? void 0 : a.organizationName }) }),
-    /* @__PURE__ */ X(U5, {})
+    /* @__PURE__ */ X("div", { className: "flex-1 pl-2", children: n ? /* @__PURE__ */ X(P5, { className: "h-4 w-2/3" }) : /* @__PURE__ */ X("h2", { className: "font-semibold", children: (a = e == null ? void 0 : e.data) == null ? void 0 : a.organizationName }) }),
+    /* @__PURE__ */ X(F5, {})
   ] }) });
 }
+function B5(e) {
+  const n = [];
+  let a = null;
+  return e.forEach((s) => {
+    var f, p, d, g;
+    (!a || ((f = a[0]) == null ? void 0 : f.type) !== s.type) && (a = [], n.push(a)), ((p = a[0]) == null ? void 0 : p.type) === "FROM_AGENT" && s.type === "FROM_AGENT" && ((d = s.agent) == null ? void 0 : d.id) !== ((g = a[0].agent) == null ? void 0 : g.id) && (a = [], n.push(a)), a.push(s);
+  }), n;
+}
+function H5(e) {
+  var n;
+  return ((n = e == null ? void 0 : e[0]) == null ? void 0 : n.type) === "FROM_USER";
+}
+function z5(e) {
+  var n;
+  return ((n = e == null ? void 0 : e[0]) == null ? void 0 : n.type) === "FROM_BOT";
+}
+function j5(e) {
+  var n;
+  return ((n = e == null ? void 0 : e[0]) == null ? void 0 : n.type) === "FROM_AGENT";
+}
+function pw({
+  message: e,
+  Wrapper: n,
+  wrapperProps: a
+}) {
+  const { componentStore: s } = $f(), f = s.getComponent(
+    e.component,
+    !1
+  );
+  return f ? n ? (
+    // @ts-ignore
+    /* @__PURE__ */ i_(
+      n,
+      {
+        ...a,
+        key: e.id,
+        "data-test": `message-wrapper-${e.id}`
+      },
+      /* @__PURE__ */ X(f, { ...e, id: e.id })
+    )
+  ) : /* @__PURE__ */ X("div", { "data-test": `message-${e.id}`, children: /* @__PURE__ */ i_(f, { ...e, id: e.id, key: e.id }) }) : null;
+}
+function mw({
+  children: e,
+  className: n,
+  messageId: a
+}) {
+  return /* @__PURE__ */ X(
+    "div",
+    {
+      className: Ft("w-fit space-y-2", n),
+      "data-test": `message-wrapper-${a}`,
+      children: /* @__PURE__ */ X(
+        "div",
+        {
+          "data-test": "message-content-wrapper",
+          className: Ft(
+            "w-fit p-2 rounded-2xl text-sm",
+            "bg-secondary border shadow-sm"
+          ),
+          children: e
+        }
+      )
+    }
+  );
+}
 const z1 = ie.forwardRef(({ className: e, ...n }, a) => /* @__PURE__ */ X(
   Gf.Root,
   {
@@ -3380,7 +3434,7 @@ function yk({ attachment: e }) {
     ] })
   ] });
 }
-function H5({
+function V5({
   message: e
 }) {
   var n;
@@ -3400,10 +3454,10 @@ function H5({
     e.attachments && e.attachments.length > 0 && /* @__PURE__ */ X("div", { className: "flex gap-1 flex-wrap justify-end", children: (n = e.attachments) == null ? void 0 : n.map((a) => /* @__PURE__ */ X(yk, { attachment: a }, a.id)) })
   ] });
 }
-function z5({
+function Y5({
   messages: e
 }) {
-  const { user: n } = zm();
+  const { user: n } = Hm();
   return /* @__PURE__ */ Nt(
     "div",
     {
@@ -3414,62 +3468,16 @@ function z5({
       ),
       children: [
         /* @__PURE__ */ X(z1, { className: "bg-primary text-primary-foreground", children: /* @__PURE__ */ X(Qw, { src: n == null ? void 0 : n.avatarUrl, alt: (n == null ? void 0 : n.name) || "User avatar" }) }),
-        e.map((a) => /* @__PURE__ */ X(H5, { message: a }, a.id))
+        e.map((a) => /* @__PURE__ */ X(V5, { message: a }, a.id))
       ]
     }
   );
 }
-function pw({
-  message: e,
-  Wrapper: n,
-  wrapperProps: a
-}) {
-  const { componentStore: s } = $f(), f = s.getComponent(
-    e.component,
-    !1
-  );
-  return f ? n ? (
-    // @ts-ignore
-    /* @__PURE__ */ i_(
-      n,
-      {
-        ...a,
-        key: e.id,
-        "data-test": `message-wrapper-${e.id}`
-      },
-      /* @__PURE__ */ X(f, { ...e, id: e.id })
-    )
-  ) : /* @__PURE__ */ X("div", { "data-test": `message-${e.id}`, children: /* @__PURE__ */ i_(f, { ...e, id: e.id, key: e.id }) }) : null;
-}
-function mw({
-  children: e,
-  className: n,
-  messageId: a
-}) {
-  return /* @__PURE__ */ X(
-    "div",
-    {
-      className: Ft("w-fit space-y-2", n),
-      "data-test": `message-wrapper-${a}`,
-      children: /* @__PURE__ */ X(
-        "div",
-        {
-          "data-test": "message-content-wrapper",
-          className: Ft(
-            "w-fit p-2 rounded-2xl text-sm",
-            "bg-secondary border shadow-sm"
-          ),
-          children: e
-        }
-      )
-    }
-  );
-}
-function j5({
+function W5({
   messages: e,
   agent: n
 }) {
-  const { session: a } = jw();
+  const { session: a } = zw();
   return /* @__PURE__ */ Nt("div", { className: Ft("flex flex-col items-start gap-2", "pr-8"), children: [
     /* @__PURE__ */ X(z1, { children: /* @__PURE__ */ X(Qw, { src: (n == null ? void 0 : n.avatar) ?? "", alt: "Agent Icon" }) }),
     e.map((s) => {
@@ -3489,29 +3497,12 @@ function j5({
     })
   ] });
 }
-function V5(e) {
-  const n = [];
-  let a = null;
-  return e.forEach((s) => {
-    var f, p, d;
-    (!a || a[0].type !== s.type) && (a = [], n.push(a)), ((f = a[0]) == null ? void 0 : f.type) === "FROM_AGENT" && s.type === "FROM_AGENT" && ((p = s.agent) == null ? void 0 : p.id) !== ((d = a[0].agent) == null ? void 0 : d.id) && (a = [], n.push(a)), a.push(s);
-  }), n;
-}
-function Y5(e) {
-  return (e == null ? void 0 : e[0].type) === "FROM_USER";
-}
-function W5(e) {
-  return (e == null ? void 0 : e[0].type) === "FROM_BOT";
-}
-function q5(e) {
-  return (e == null ? void 0 : e[0].type) === "FROM_AGENT";
-}
-function Q5() {
+function q5() {
   var T;
   const {
     messages: { messages: e }
-  } = Vw(), { isAwaitingBotReply: n } = ak(), { componentStore: a } = $f(), s = zm(), f = F1(
-    () => V5(e),
+  } = jw(), { isAwaitingBotReply: n } = rk(), { componentStore: a } = $f(), s = Hm(), f = F1(
+    () => B5(e),
     [e.length]
   ), p = a.getComponent(
     "loading"
@@ -3522,7 +3513,7 @@ function Q5() {
       C && (C.scrollTop = C.scrollHeight);
     }, 0);
   }
-  Bm(() => {
+  Um(() => {
     g();
   }, [e]);
   const E = e.length === 0;
@@ -3562,17 +3553,17 @@ function Q5() {
           "default-welcome"
         )),
         f.map((C, S) => {
-          var A;
-          if (!(C == null ? void 0 : C[0].type)) return null;
-          if (Y5(C))
-            return /* @__PURE__ */ X(z5, { messages: C }, S);
-          if (W5(C) || q5(C)) {
-            const D = (A = C[0]) == null ? void 0 : A.agent;
+          var A, D;
+          if (!((A = C == null ? void 0 : C[0]) == null ? void 0 : A.type)) return null;
+          if (H5(C))
+            return /* @__PURE__ */ X(Y5, { messages: C }, S);
+          if (z5(C) || j5(C)) {
+            const L = (D = C[0]) == null ? void 0 : D.agent;
             return /* @__PURE__ */ X(
-              j5,
+              W5,
               {
                 messages: C,
-                agent: D
+                agent: L
               },
               S
             );
@@ -3584,13 +3575,13 @@ function Q5() {
     }
   );
 }
-const $5 = "[data-chat-widget-content-root]";
+const Q5 = "[data-chat-widget-content-root]";
 function Ek({
   fallbackHeight: e
 }) {
   const n = U1(null);
-  return Bm(() => {
-    const a = document.querySelector($5);
+  return Um(() => {
+    const a = document.querySelector(Q5);
     if (a && n.current) {
       const s = n.current;
       let f;
@@ -3609,10 +3600,22 @@ function Ek({
     }
   }, []), { observedElementRef: n };
 }
+function $5({ options: e, onKeyboardClick: n }) {
+  return /* @__PURE__ */ X("div", { className: "flex items-center gap-2 p-2 flex-wrap", children: e.map((a, s) => /* @__PURE__ */ X(
+    Zs,
+    {
+      onClick: () => n(a),
+      className: "flex-1 rounded-full",
+      size: "sm",
+      children: a
+    },
+    s
+  )) });
+}
 function G5() {
   var d, g;
-  const { messages: e, messageCtx: n } = Vw(), s = (g = (d = Yw().data) == null ? void 0 : d.data) == null ? void 0 : g.initialQuestions, { observedElementRef: f } = Ek({
-    fallbackHeight: a5
+  const { messages: e, messageCtx: n } = jw(), s = (g = (d = Vw().data) == null ? void 0 : d.data) == null ? void 0 : g.initialQuestions, { observedElementRef: f } = Ek({
+    fallbackHeight: xI
   }), p = e.messages.length === 0;
   return /* @__PURE__ */ X(
     "div",
@@ -3620,7 +3623,7 @@ function G5() {
       ref: f,
       "data-test": "chat-screen",
       className: Ft(
-        qw.widgetHeight,
+        Ww.widgetHeight,
         "w-full flex flex-col overflow-hidden bg-background z-10 origin-bottom absolute bottom-0 inset-x-0"
       ),
       children: /* @__PURE__ */ Nt(
@@ -3632,17 +3635,17 @@ function G5() {
             background: "linear-gradient(333.89deg, rgba(75, 240, 171, 0.8) 58%, rgba(75, 240, 171, 0) 85.74%), linear-gradient(113.43deg, #46B1FF 19.77%, #1883FF 65.81%)"
           },
           children: [
-            /* @__PURE__ */ X(B5, {}),
+            /* @__PURE__ */ X(U5, {}),
             /* @__PURE__ */ Nt(
               "div",
               {
                 className: "flex bg-background shadow-lg flex-col w-full flex-1 overflow-auto",
                 "data-test": "chat-main-container",
                 children: [
-                  /* @__PURE__ */ X(Q5, {}),
+                  /* @__PURE__ */ X(q5, {}),
                   /* @__PURE__ */ Nt("footer", { "data-test": "chat-footer", children: [
                     e.suggestedReplies && /* @__PURE__ */ X(
-                      p5,
+                      $5,
                       {
                         "data-test": "chat-keyboard",
                         options: e.suggestedReplies,
@@ -3673,7 +3676,7 @@ function G5() {
                         ))
                       }
                     ),
-                    /* @__PURE__ */ X(A5, {})
+                    /* @__PURE__ */ X(_5, {})
                   ] })
                 ]
               }
@@ -3685,7 +3688,7 @@ function G5() {
   );
 }
 const gw = ie.forwardRef(
-  ({ className: e, type: n, ...a }, s) => /* @__PURE__ */ X(B1, { ref: s, children: /* @__PURE__ */ X(
+  ({ className: e, type: n, ...a }, s) => /* @__PURE__ */ X(H1, { ref: s, children: /* @__PURE__ */ X(
     "input",
     {
       type: n,
@@ -3704,8 +3707,8 @@ const X5 = MT.object({
 });
 function K5() {
   var g, E, T;
-  const { contactCtx: e } = ik(), n = zm(), a = H1(), { data: s } = Yw(), { observedElementRef: f } = Ek({
-    fallbackHeight: r5
+  const { contactCtx: e } = ak(), n = Hm(), a = B1(), { data: s } = Vw(), { observedElementRef: f } = Ek({
+    fallbackHeight: wI
   }), [p, d] = vI(
     async (C) => {
       C.preventDefault();
@@ -3722,7 +3725,7 @@ function K5() {
       ref: f,
       "data-test": "welcome-screen",
       className: Ft(
-        qw.widgetMinHeight,
+        Ww.widgetMinHeight,
         "h-fit bg-primary rounded-3xl flex flex-col"
       ),
       children: [
@@ -3836,8 +3839,8 @@ function K5() {
   );
 }
 function J5() {
-  const { contactCtx: e } = ik(), n = e.shouldCollectData();
-  return /* @__PURE__ */ X("div", { className: "bg-background size-full", "data-test": "root-screen", children: /* @__PURE__ */ X(Hm, { mode: "wait", children: n ? /* @__PURE__ */ X(
+  const { contactCtx: e } = ak(), n = e.shouldCollectData();
+  return /* @__PURE__ */ X("div", { className: "bg-background size-full", "data-test": "root-screen", children: /* @__PURE__ */ X(Bm, { mode: "wait", children: n ? /* @__PURE__ */ X(
     Du,
     {
       fadeIn: "right",
@@ -23004,7 +23007,7 @@ var S1 = vw.exports, uM = [
   "ul"
 ], ol = uM.reduce((e, n) => {
   const a = ie.forwardRef((s, f) => {
-    const { asChild: p, ...d } = s, g = p ? zw : n;
+    const { asChild: p, ...d } = s, g = p ? Yw : n;
     return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ X(g, { ...d, ref: f });
   });
   return a.displayName = `Primitive.${n}`, { ...e, [n]: a };
@@ -24392,7 +24395,7 @@ const l8 = zM, c8 = jM, d8 = UM, f8 = YM, h8 = BM, L_ = FM, p8 = VM, m8 = (e, n,
     platform: p
   });
 };
-var v1 = typeof document < "u" ? J4 : Bm;
+var v1 = typeof document < "u" ? J4 : Um;
 function k1(e, n) {
   if (e === n)
     return !0;
@@ -25114,7 +25117,7 @@ function tP(e) {
   return n.options = Xs({ async: !0, ssr: !1 }, e), n;
 }
 var Gk = function(e) {
-  var n = e.sideCar, a = ok(e, ["sideCar"]);
+  var n = e.sideCar, a = ik(e, ["sideCar"]);
   if (!n)
     throw new Error("Sidecar: please provide `sideCar` property to import the right car");
   var s = n.read();
@@ -25132,7 +25135,7 @@ var Xk = tP(), qT = function() {
     onScrollCapture: qT,
     onWheelCapture: qT,
     onTouchMoveCapture: qT
-  }), f = s[0], p = s[1], d = e.forwardProps, g = e.children, E = e.className, T = e.removeScrollBar, C = e.enabled, S = e.shards, R = e.sideCar, A = e.noIsolation, D = e.inert, L = e.allowPinchZoom, U = e.as, H = U === void 0 ? "div" : U, G = e.gapMode, Y = ok(e, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as", "gapMode"]), Z = R, K = J8([a, n]), W = Xs(Xs({}, Y), f);
+  }), f = s[0], p = s[1], d = e.forwardProps, g = e.children, E = e.className, T = e.removeScrollBar, C = e.enabled, S = e.shards, R = e.sideCar, A = e.noIsolation, D = e.inert, L = e.allowPinchZoom, U = e.as, H = U === void 0 ? "div" : U, G = e.gapMode, Y = ik(e, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as", "gapMode"]), Z = R, K = J8([a, n]), W = Xs(Xs({}, Y), f);
   return ie.createElement(
     ie.Fragment,
     null,
@@ -25525,7 +25528,7 @@ var LP = ie.forwardRef(
     return ie.useEffect(() => {
       const d = s.current;
       if (d) return Q8(d);
-    }, []), /* @__PURE__ */ X(t3, { as: zw, allowPinchZoom: !0, children: /* @__PURE__ */ X(
+    }, []), /* @__PURE__ */ X(t3, { as: Yw, allowPinchZoom: !0, children: /* @__PURE__ */ X(
       s3,
       {
         ...e,
@@ -25702,7 +25705,7 @@ var zP = /* @__PURE__ */ P1.createContext({
   }, [E]);
   F1(() => {
     !p && g.onLoad && E && g.onLoad(U.current);
-  }, [E]), Bm(() => {
+  }, [E]), Um(() => {
     if (C && !p) {
       var Z;
       (Z = C.contentWindow) == null || Z.addEventListener("DOMContentLoaded", H);
@@ -25756,7 +25759,7 @@ function VP({ className: e }) {
   );
 }
 function YP({ isOpen: e }) {
-  const { theme: n } = zm();
+  const { theme: n } = Hm();
   return /* @__PURE__ */ X(
     o3,
     {
@@ -25766,7 +25769,7 @@ function YP({ isOpen: e }) {
         fontSize: "16px",
         position: "fixed",
         zIndex: 1e7,
-        ...hk(
+        ...uk(
           { primary: n == null ? void 0 : n.primaryColor }
           // { triggerOffset: theme.triggerOffset },
         ),
@@ -25776,7 +25779,7 @@ function YP({ isOpen: e }) {
         bottom: "20px"
       },
       className: Ft("size-12 font-inter flex items-center justify-center"),
-      children: /* @__PURE__ */ X(B1, { children: /* @__PURE__ */ X(
+      children: /* @__PURE__ */ X(H1, { children: /* @__PURE__ */ X(
         "div",
         {
           className: Ft(
@@ -25790,13 +25793,13 @@ function YP({ isOpen: e }) {
             "active:scale-90",
             "[&_svg]:size-6"
           ),
-          children: /* @__PURE__ */ X(Hm, { mode: "wait", children: e ? /* @__PURE__ */ X(
+          children: /* @__PURE__ */ X(Bm, { mode: "wait", children: e ? /* @__PURE__ */ X(
             Du,
             {
               snapExit: !0,
               fadeIn: "up",
               overrides: { initial: { rotate: 45 }, animate: { rotate: 0 } },
-              children: /* @__PURE__ */ X(rk, {})
+              children: /* @__PURE__ */ X(nk, {})
             },
             "x-icon"
           ) : /* @__PURE__ */ X(
@@ -25814,7 +25817,7 @@ function YP({ isOpen: e }) {
   );
 }
 function WP() {
-  return /* @__PURE__ */ X(Hm, { children: /* @__PURE__ */ Nt(
+  return /* @__PURE__ */ X(Bm, { children: /* @__PURE__ */ Nt(
     Sc.div,
     {
       "data-test": "loading-container",
@@ -40845,7 +40848,7 @@ function ZY({
   opened: n = !1,
   ...a
 }) {
-  const s = $f(), { theme: f } = zm(), [p, d] = Nu(n);
+  const s = $f(), { theme: f } = Hm(), [p, d] = Nu(n);
   return /* @__PURE__ */ Nt(UP, { open: p, onOpenChange: d, children: [
     /* @__PURE__ */ X("style", { children: p3 }),
     /* @__PURE__ */ X(
@@ -40893,7 +40896,7 @@ function ZY({
                 style: {
                   maxHeight: "85dvh",
                   width: "350px",
-                  minHeight: qw.widgetMinHeight,
+                  minHeight: Ww.widgetMinHeight,
                   height: "var(--opencx-widget-height)",
                   overflow: "hidden",
                   /** outline is better than border because of box sizing; the outline wouldn't affect the content inside... the border will mess up how the children's border radius sits with the parent */
@@ -40906,7 +40909,7 @@ function ZY({
                   transitionDuration: "150ms"
                 },
                 children: /* @__PURE__ */ X(
-                  e5,
+                  n5,
                   {
                     delayDuration: 200,
                     disableHoverableContent: !0,
@@ -40915,7 +40918,7 @@ function ZY({
                       {
                         style: {
                           display: "contents",
-                          ...hk(
+                          ...uk(
                             { primary: f == null ? void 0 : f.primaryColor }
                             // { triggerOffset: theme.triggerOffset },
                           )