@paramms/chat-widget 1.0.44 → 1.0.46

package/dist/react.js

@@ -1,8 +1,8 @@
-import { jsxs as _, jsx as e, Fragment as O } from "react/jsx-runtime";
-import { useState as k, useRef as B, useEffect as D } from "react";
-import { mount as H } from "./index.js";
-function G({ size: o = 26 }) {
-  return /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: o, height: o, fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ e(
+import { jsxs as W, jsx as n, Fragment as q } from "react/jsx-runtime";
+import { useState as _, useRef as k, useEffect as A } from "react";
+import { mount as Y } from "./index.js";
+function K({ size: r = 26 }) {
+  return /* @__PURE__ */ n("svg", { viewBox: "0 0 24 24", width: r, height: r, fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ n(
     "path",
     {
       d: "M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z",
@@ -14,276 +14,302 @@ function G({ size: o = 26 }) {
     }
   ) });
 }
-function Y({ size: o = 22 }) {
-  return /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: o, height: o, fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M18 6 6 18M6 6l12 12", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round" }) });
+function E({ size: r = 22 }) {
+  return /* @__PURE__ */ n("svg", { viewBox: "0 0 24 24", width: r, height: r, fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ n("path", { d: "M18 6 6 18M6 6l12 12", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round" }) });
 }
-function Q({
-  url: o,
-  apiUrl: r,
-  profileId: s,
-  token: n,
-  refreshToken: i,
-  userId: l,
+function T({
+  url: r,
+  apiUrl: i,
+  profileId: c,
+  token: o,
+  refreshToken: l,
+  userId: s,
   userName: d,
-  userEmail: u,
-  userAvatar: v,
-  contextTitle: m,
-  contextSubtitle: p,
-  contextStatus: h,
-  subjectId: C,
-  accent: R,
-  launcher: b,
-  position: t,
-  launcherMessage: f,
-  quickReplies: j,
-  height: M = "100%",
-  i18n: L,
+  userEmail: p,
+  userAvatar: y,
+  contextTitle: v,
+  contextSubtitle: a,
+  contextStatus: j,
+  subjectId: L,
+  accent: f,
+  accent2: w,
+  theme: m,
+  webfont: h,
+  launcher: t,
+  position: b,
+  launcherMessage: $,
+  quickReplies: z,
+  height: g = "100%",
+  i18n: B,
+  features: x,
   translateLang: S,
-  inbox: a,
-  inboxScope: $
+  inbox: C,
+  inboxScope: u
 }) {
-  const w = B(null), c = B(null), [x, g] = k(!1);
-  return D(() => {
-    var z;
-    if (!x && w.current)
-      return (z = c.current) == null || z.close(), c.current = H({
-        el: w.current,
-        url: o,
-        ...r ? { apiUrl: r } : {},
-        profileId: s,
-        ...C ? { subjectId: C } : {},
-        ...n ? { token: n } : {},
-        ...i ? { refreshToken: i } : {},
-        ...l ? { userId: l } : {},
-        ...l || d || u || v ? {
+  const R = k(null), e = k(null), [M, D] = _(!1);
+  return A(() => {
+    var H;
+    if (!M && R.current)
+      return (H = e.current) == null || H.close(), e.current = Y({
+        el: R.current,
+        url: r,
+        ...i ? { apiUrl: i } : {},
+        profileId: c,
+        ...L ? { subjectId: L } : {},
+        ...o ? { token: o } : {},
+        ...l ? { refreshToken: l } : {},
+        ...s ? { userId: s } : {},
+        ...s || d || p || y ? {
           user: {
             ...d ? { name: d } : {},
-            ...u ? { email: u } : {},
-            ...v ? { avatar: v } : {}
+            ...p ? { email: p } : {},
+            ...y ? { avatar: y } : {}
           }
         } : {},
-        ...m ? {
+        ...v ? {
           subject: {
-            title: m,
-            ...p ? { subtitle: p } : {},
-            ...h ? { status: h } : {}
+            title: v,
+            ...a ? { subtitle: a } : {},
+            ...j ? { status: j } : {}
           }
         } : {},
-        ...j ? { quickReplies: j } : {},
-        ...R ? { accent: R } : {},
+        ...z ? { quickReplies: z } : {},
+        ...f ? { accent: f } : {},
+        ...w ? { accent2: w } : {},
+        ...m ? { theme: m } : {},
+        ...h === !1 ? { webfont: !1 } : {},
         ...S ? { translateLang: S } : {},
-        ...L ? { i18n: L } : {},
-        ...a && !b ? { onBack: () => g(!0) } : {},
-        ...b ? { launcher: b, position: t ?? "bottom-right", ...f ? { launcherMessage: f } : {} } : {}
+        ...B ? { i18n: B } : {},
+        ...x ? { features: x } : {},
+        ...C && !t ? { onBack: () => D(!0) } : {},
+        ...t ? { launcher: t, position: b ?? "bottom-right", ...$ ? { launcherMessage: $ } : {} } : {}
       }), () => {
-        var y;
-        (y = c.current) == null || y.close(), c.current = null;
+        var O;
+        (O = e.current) == null || O.close(), e.current = null;
       };
-  }, [o, r, s, C, n, l, d, u, R, b, t, f, S, a, x]), a && !b && x ? /* @__PURE__ */ e(
-    A,
+  }, [r, i, c, L, o, s, d, p, f, t, b, $, S, C, M]), C && !t && M ? /* @__PURE__ */ n(
+    G,
     {
-      url: o,
-      ...r ? { apiUrl: r } : {},
-      profileId: s,
-      ...n ? { token: n } : {},
-      ...i ? { refreshToken: i } : {},
-      ...l ? { userId: l } : {},
+      url: r,
+      ...i ? { apiUrl: i } : {},
+      profileId: c,
+      ...o ? { token: o } : {},
+      ...l ? { refreshToken: l } : {},
+      ...s ? { userId: s } : {},
       ...d ? { userName: d } : {},
-      ...u ? { userEmail: u } : {},
-      ...R ? { accent: R } : {},
-      scope: $ ?? "tenant",
-      height: M,
-      onClose: () => g(!1)
+      ...p ? { userEmail: p } : {},
+      ...f ? { accent: f } : {},
+      ...w ? { accent2: w } : {},
+      ...m ? { theme: m } : {},
+      ...h === !1 ? { webfont: !1 } : {},
+      scope: u ?? "tenant",
+      height: g,
+      onClose: () => D(!1)
     }
-  ) : /* @__PURE__ */ e(
+  ) : /* @__PURE__ */ n(
     "div",
     {
-      ref: w,
-      style: b ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: M, minHeight: M === "100%" ? "480px" : void 0 }
+      ref: R,
+      style: t ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: g, minHeight: g === "100%" ? "480px" : void 0 }
     }
   );
 }
-const q = [
+const P = [
   "Is this still available?",
   "Can I schedule a viewing?",
   "What is your best price?"
 ];
-function V({
-  url: o,
-  apiUrl: r,
-  profileId: s,
-  token: n,
-  refreshToken: i,
-  listingId: l,
+function I({
+  url: r,
+  apiUrl: i,
+  profileId: c,
+  token: o,
+  refreshToken: l,
+  listingId: s,
   listingTitle: d,
-  listingMeta: u,
-  listingPrice: v,
-  listingStatus: m,
-  userId: p,
-  userName: h,
-  userEmail: C,
-  userAvatar: R,
-  accent: b,
-  launcher: t,
-  position: f,
-  launcherMessage: j,
-  quickReplies: M,
-  height: L = "100%",
-  i18n: S,
-  translateLang: a,
-  inbox: $,
-  inboxScope: w
+  listingMeta: p,
+  listingPrice: y,
+  listingStatus: v,
+  userId: a,
+  userName: j,
+  userEmail: L,
+  userAvatar: f,
+  accent: w,
+  accent2: m,
+  theme: h,
+  webfont: t,
+  launcher: b,
+  position: $,
+  launcherMessage: z,
+  quickReplies: g,
+  height: B = "100%",
+  i18n: x,
+  features: S,
+  translateLang: C,
+  inbox: u,
+  inboxScope: R
 }) {
-  const c = B(null), x = B(null), [g, z] = k(!1);
-  return D(() => {
-    if (g || !c.current) return;
-    let y = !1;
-    const F = setTimeout(() => {
-      var W;
-      y || !c.current || ((W = x.current) == null || W.close(), x.current = H({
-        el: c.current,
-        url: o,
-        ...r ? { apiUrl: r } : {},
-        profileId: s,
-        ...l ? { subjectId: `listing_${l}` } : {},
-        ...n ? { token: n } : {},
-        ...i ? { refreshToken: i } : {},
-        ...p ? { userId: p } : {},
-        ...p || h || C || R ? {
+  const e = k(null), M = k(null), [D, H] = _(!1);
+  return A(() => {
+    if (D || !e.current) return;
+    let O = !1;
+    const J = setTimeout(() => {
+      var F;
+      O || !e.current || ((F = M.current) == null || F.close(), M.current = Y({
+        el: e.current,
+        url: r,
+        ...i ? { apiUrl: i } : {},
+        profileId: c,
+        ...s ? { subjectId: `listing_${s}` } : {},
+        ...o ? { token: o } : {},
+        ...l ? { refreshToken: l } : {},
+        ...a ? { userId: a } : {},
+        ...a || j || L || f ? {
           user: {
-            ...h ? { name: h } : {},
-            ...C ? { email: C } : {},
-            ...R ? { avatar: R } : {},
-            ...l ? { meta: { listingId: l } } : {}
+            ...j ? { name: j } : {},
+            ...L ? { email: L } : {},
+            ...f ? { avatar: f } : {},
+            ...s ? { meta: { listingId: s } } : {}
           }
         } : {},
         ...d ? {
           subject: {
             title: d,
-            ...u ? { subtitle: u } : {},
-            ...v ? { tags: [`$${v.toLocaleString()}`] } : {},
-            ...m ? { status: m } : {}
+            ...p ? { subtitle: p } : {},
+            ...y ? { tags: [`$${y.toLocaleString()}`] } : {},
+            ...v ? { status: v } : {}
           }
         } : {},
-        quickReplies: M ?? q,
-        ...b ? { accent: b } : {},
-        ...a ? { translateLang: a } : {},
-        ...S ? { i18n: S } : {},
-        ...$ && !t ? { onBack: () => z(!0) } : {},
-        ...t ? { launcher: t, position: f ?? "bottom-right", ...j ? { launcherMessage: j } : {} } : {}
+        quickReplies: g ?? P,
+        ...w ? { accent: w } : {},
+        ...m ? { accent2: m } : {},
+        ...h ? { theme: h } : {},
+        ...t === !1 ? { webfont: !1 } : {},
+        ...C ? { translateLang: C } : {},
+        ...x ? { i18n: x } : {},
+        ...S ? { features: S } : {},
+        ...u && !b ? { onBack: () => H(!0) } : {},
+        ...b ? { launcher: b, position: $ ?? "bottom-right", ...z ? { launcherMessage: z } : {} } : {}
       }));
     }, 0);
     return () => {
-      var W;
-      y = !0, clearTimeout(F), (W = x.current) == null || W.close(), x.current = null;
+      var F;
+      O = !0, clearTimeout(J), (F = M.current) == null || F.close(), M.current = null;
     };
-  }, [o, r, s, l, n, p, b, t, f, j, a, $, g]), $ && !t && g ? /* @__PURE__ */ e(
-    A,
+  }, [r, i, c, s, o, a, w, b, $, z, C, u, D]), u && !b && D ? /* @__PURE__ */ n(
+    G,
     {
-      url: o,
-      ...r ? { apiUrl: r } : {},
-      profileId: s,
-      ...n ? { token: n } : {},
-      ...i ? { refreshToken: i } : {},
-      ...p ? { userId: p } : {},
-      ...h ? { userName: h } : {},
-      ...C ? { userEmail: C } : {},
-      ...b ? { accent: b } : {},
-      scope: w ?? "tenant",
-      height: L,
-      onClose: () => z(!1)
+      url: r,
+      ...i ? { apiUrl: i } : {},
+      profileId: c,
+      ...o ? { token: o } : {},
+      ...l ? { refreshToken: l } : {},
+      ...a ? { userId: a } : {},
+      ...j ? { userName: j } : {},
+      ...L ? { userEmail: L } : {},
+      ...w ? { accent: w } : {},
+      ...m ? { accent2: m } : {},
+      ...h ? { theme: h } : {},
+      ...t === !1 ? { webfont: !1 } : {},
+      scope: R ?? "tenant",
+      height: B,
+      onClose: () => H(!1)
     }
-  ) : /* @__PURE__ */ e(
+  ) : /* @__PURE__ */ n(
     "div",
     {
-      ref: c,
-      style: t ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: L, minHeight: L === "100%" ? "480px" : void 0 }
+      ref: e,
+      style: b ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: B, minHeight: B === "100%" ? "480px" : void 0 }
     }
   );
 }
-function K(o) {
-  const [r, s] = k(
-    typeof window < "u" && window.innerWidth <= o
+function Q(r) {
+  const [i, c] = _(
+    typeof window < "u" && window.innerWidth <= r
   );
-  return D(() => {
+  return A(() => {
     if (typeof window > "u" || !window.matchMedia) return;
-    const n = window.matchMedia(`(max-width: ${o}px)`), i = (l) => s(l.matches);
-    return s(n.matches), n.addEventListener("change", i), () => n.removeEventListener("change", i);
-  }, [o]), r;
+    const o = window.matchMedia(`(max-width: ${r}px)`), l = (s) => c(s.matches);
+    return c(o.matches), o.addEventListener("change", l), () => o.removeEventListener("change", l);
+  }, [r]), i;
 }
-function A({
-  url: o,
-  apiUrl: r,
-  profileId: s,
-  tenantId: n,
-  token: i,
-  refreshToken: l,
+function G({
+  url: r,
+  apiUrl: i,
+  profileId: c,
+  tenantId: o,
+  token: l,
+  refreshToken: s,
   userId: d,
-  userName: u,
-  userEmail: v,
-  accent: m,
-  height: p = "100%",
-  i18n: h,
-  onClose: C,
-  scope: R = "tenant"
+  userName: p,
+  userEmail: y,
+  accent: v,
+  theme: a,
+  webfont: j,
+  height: L = "100%",
+  i18n: f,
+  onClose: w,
+  scope: m = "tenant"
 }) {
-  const b = !s && !n, [t, f] = k(null), [j, M] = k(!1), L = B(null), S = B(null), a = B(null), $ = B(null);
-  return D(() => {
-    if (!L.current) return;
-    let w = !1;
-    return import("./chatlist.js").catch((c) => (console.error("[relay] could not load the conversation list module.", c), w || M(!0), null)).then((c) => {
-      if (!c) return;
-      const { mountChatList: x } = c;
-      w || !L.current || (a.current = x({
-        el: L.current,
-        url: o,
-        ...r ? { apiUrl: r } : {},
-        ...s ? { profileId: s } : {},
-        ...n ? { tenantId: n } : {},
-        scope: R,
+  const h = !c && !o, [t, b] = _(null), [$, z] = _(!1), g = k(null), B = k(null), x = k(null), S = k(null);
+  return A(() => {
+    if (!g.current) return;
+    let C = !1;
+    return import("./chatlist.js").catch((u) => (console.error("[relay] could not load the conversation list module.", u), C || z(!0), null)).then((u) => {
+      if (!u) return;
+      const { mountChatList: R } = u;
+      C || !g.current || (x.current = R({
+        el: g.current,
+        url: r,
+        ...i ? { apiUrl: i } : {},
+        ...c ? { profileId: c } : {},
+        ...o ? { tenantId: o } : {},
+        ...a ? { theme: a } : {},
+        ...j === !1 ? { webfont: !1 } : {},
+        scope: m,
         // We overlay a ✕ at top-right when `onClose` is given — tell the list to
         // keep its header clear so the ✕ doesn't land on the ✎ compose button.
-        ...C ? { reserveCloseSpace: !0 } : {},
-        onSelect: (g) => f(g),
+        ...w ? { reserveCloseSpace: !0 } : {},
+        onSelect: (e) => b(e),
         // Compose (✎) opens the chatroom's general support thread — without
         // this a user with no conversations yet had an empty list and no way
         // to ever start one, which is what made ChatApp feel broken.
         // Compose target: the configured chatroom, else the tenant's default
         // (oldest chatroom, reported by the server on the first list fetch).
         onNewChat: () => {
-          var z;
-          const g = (z = a.current) == null ? void 0 : z.defaultProfileId();
-          g && f({ id: "__new__", profileId: g, state: "open", updatedAt: Date.now() });
+          var M;
+          const e = (M = x.current) == null ? void 0 : M.defaultProfileId();
+          e && b({ id: "__new__", profileId: e, state: "open", updatedAt: Date.now() });
         },
-        ...i ? { token: i } : {},
+        ...l ? { token: l } : {},
         ...d ? { userId: d } : {},
-        ...m ? { accent: m } : {},
-        ...h ? { i18n: h } : {}
+        ...v ? { accent: v } : {},
+        ...f ? { i18n: f } : {}
       }));
     }), () => {
-      var c;
-      w = !0, (c = a.current) == null || c.close(), a.current = null;
+      var u;
+      C = !0, (u = x.current) == null || u.close(), x.current = null;
     };
-  }, [o, r, s, n, i, d, R]), D(() => {
-    var c;
-    if (!S.current || !t) return;
-    (c = $.current) == null || c.close(), $.current = H({
-      el: S.current,
-      url: o,
-      ...r ? { apiUrl: r } : {},
-      profileId: t.profileId ?? s,
+  }, [r, i, c, o, l, d, m]), A(() => {
+    var u;
+    if (!B.current || !t) return;
+    (u = S.current) == null || u.close(), S.current = Y({
+      el: B.current,
+      url: r,
+      ...i ? { apiUrl: i } : {},
+      profileId: t.profileId ?? c,
       // rows always carry theirs; compose sets one explicitly
       // DM rows open as direct conversations (kind + peer). Opening them via
       // their dm:… subjectId only works for the participant that OWNS the
       // thread key — the other side would silently fork a duplicate.
       ...t.kind === "direct" && t.peerId ? { kind: "direct", peerId: t.peerId } : t.subjectId ? { subjectId: t.subjectId } : {},
-      ...i ? { token: i } : {},
-      ...l ? { refreshToken: l } : {},
+      ...l ? { token: l } : {},
+      ...s ? { refreshToken: s } : {},
       ...d ? { userId: d } : {},
-      ...d || u || v ? {
+      ...d || p || y ? {
         user: {
-          ...u ? { name: u } : {},
-          ...v ? { email: v } : {}
+          ...p ? { name: p } : {},
+          ...y ? { email: y } : {}
         }
       } : {},
       ...t.subjectTitle ? {
@@ -292,30 +318,30 @@ function A({
           ...t.subjectMeta ? { subtitle: t.subjectMeta } : {}
         }
       } : {},
-      ...m ? { accent: m } : {},
+      ...v ? { accent: v } : {},
       // Stack navigation: the chatroom's back chevron returns to the list.
-      onBack: () => f(null)
+      onBack: () => b(null)
     });
-    const w = setInterval(() => {
-      var x;
-      return (x = a.current) == null ? void 0 : x.refresh();
+    const C = setInterval(() => {
+      var R;
+      return (R = x.current) == null ? void 0 : R.refresh();
     }, 2e4);
     return () => {
-      var x, g;
-      clearInterval(w), (x = $.current) == null || x.close(), $.current = null, (g = a.current) == null || g.refresh();
+      var R, e;
+      clearInterval(C), (R = S.current) == null || R.close(), S.current = null, (e = x.current) == null || e.refresh();
     };
-  }, [t == null ? void 0 : t.id]), b ? /* @__PURE__ */ _("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
+  }, [t == null ? void 0 : t.id]), h ? /* @__PURE__ */ W("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
     "[relay] <ChatApp/> needs a ",
-    /* @__PURE__ */ e("code", { children: "profileId" }),
+    /* @__PURE__ */ n("code", { children: "profileId" }),
     " or a ",
-    /* @__PURE__ */ e("code", { children: "tenantId" }),
+    /* @__PURE__ */ n("code", { children: "tenantId" }),
     "."
-  ] }) : /* @__PURE__ */ _("div", { style: { position: "relative", width: "100%", height: p, minHeight: "400px", overflow: "hidden", background: "#fff" }, children: [
-    C && !t && /* @__PURE__ */ e(
+  ] }) : /* @__PURE__ */ W("div", { style: { position: "relative", width: "100%", height: L, minHeight: "400px", overflow: "hidden", background: "#fff" }, children: [
+    w && !t && /* @__PURE__ */ n(
       "button",
       {
-        onClick: C,
-        "aria-label": (h == null ? void 0 : h.close) ?? "Close",
+        onClick: w,
+        "aria-label": (f == null ? void 0 : f.close) ?? "Close",
         style: {
           position: "absolute",
           top: 8,
@@ -334,55 +360,55 @@ function A({
           lineHeight: 1,
           cursor: "pointer"
         },
-        children: /* @__PURE__ */ e(Y, { size: 18 })
+        children: /* @__PURE__ */ n(E, { size: 18 })
       }
     ),
-    /* @__PURE__ */ e("div", { style: {
+    /* @__PURE__ */ n("div", { style: {
       position: "absolute",
       inset: 0,
       display: t ? "none" : "flex",
       flexDirection: "column"
-    }, children: j ? /* @__PURE__ */ e("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%", padding: 16, font: "13px system-ui", color: "#b91c1c", textAlign: "center" }, children: (h == null ? void 0 : h.error) ?? "Could not load conversations." }) : /* @__PURE__ */ e("div", { ref: L, style: { width: "100%", height: "100%" } }) }),
-    t && /* @__PURE__ */ e("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ e("div", { ref: S, style: { width: "100%", height: "100%" } }) })
+    }, children: $ ? /* @__PURE__ */ n("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", width: "100%", height: "100%", padding: 16, font: "13px system-ui", color: "#b91c1c", textAlign: "center" }, children: (f == null ? void 0 : f.error) ?? "Could not load conversations." }) : /* @__PURE__ */ n("div", { ref: g, style: { width: "100%", height: "100%" } }) }),
+    t && /* @__PURE__ */ n("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ n("div", { ref: B, style: { width: "100%", height: "100%" } }) })
   ] });
 }
-function X({
-  url: o,
-  apiUrl: r,
-  profileId: s,
-  tenantId: n,
-  token: i,
-  refreshToken: l,
+function N({
+  url: r,
+  apiUrl: i,
+  profileId: c,
+  tenantId: o,
+  token: l,
+  refreshToken: s,
   userId: d,
-  userName: u,
-  userEmail: v,
-  scope: m,
-  accent: p = "#4F63F5",
-  floating: h = !0,
-  position: C = "bottom-right",
-  label: R,
-  panelWidth: b,
-  panelHeight: t = "600px"
+  userName: p,
+  userEmail: y,
+  scope: v,
+  accent: a = "#6c5ce7",
+  floating: j = !0,
+  position: L = "bottom-right",
+  label: f,
+  panelWidth: w,
+  panelHeight: m = "600px"
 }) {
-  const [f, j] = k(!1), M = B(null), L = C === "bottom-right", S = R ?? (h ? void 0 : "Messages"), a = K(479);
-  if (D(() => {
-    const y = (F) => {
-      F.key === "Escape" && j(!1);
+  const [h, t] = _(!1), b = k(null), $ = L === "bottom-right", z = f ?? (j ? void 0 : "Messages"), g = Q(479);
+  if (A(() => {
+    const e = (M) => {
+      M.key === "Escape" && t(!1);
     };
-    return document.addEventListener("keydown", y), () => document.removeEventListener("keydown", y);
-  }, []), h)
-    return /* @__PURE__ */ _("div", { style: {
+    return document.addEventListener("keydown", e), () => document.removeEventListener("keydown", e);
+  }, []), j)
+    return /* @__PURE__ */ W("div", { style: {
       position: "fixed",
-      [L ? "right" : "left"]: "20px",
+      [$ ? "right" : "left"]: "20px",
       bottom: "20px",
       zIndex: 9999,
       display: "flex",
       flexDirection: "column",
-      alignItems: L ? "flex-end" : "flex-start",
+      alignItems: $ ? "flex-end" : "flex-start",
       gap: "12px"
     }, children: [
-      /* @__PURE__ */ e("div", { style: {
-        ...a ? {
+      /* @__PURE__ */ n("div", { style: {
+        ...g ? {
           position: "fixed",
           inset: 0,
           width: "100%",
@@ -390,152 +416,152 @@ function X({
           borderRadius: "0",
           zIndex: 9998
         } : {
-          width: `min(${b ?? "420px"}, calc(100vw - 40px))`,
-          height: `min(${t}, calc(100dvh - 108px))`,
-          borderRadius: "16px"
+          width: `min(${w ?? "420px"}, calc(100vw - 40px))`,
+          height: `min(${m}, calc(100dvh - 108px))`,
+          borderRadius: "28px"
         },
         overflow: "hidden",
-        boxShadow: a ? "none" : "0 8px 40px rgba(0,0,0,.18)",
+        boxShadow: g ? "none" : "0 12px 32px rgba(108,92,231,.14)",
         background: "#fff",
-        display: f ? "flex" : "none",
+        display: h ? "flex" : "none",
         flexDirection: "column",
-        transformOrigin: `bottom ${L ? "right" : "left"}`,
-        animation: f ? "ocl-pop-in .18s ease" : "none"
-      }, children: /* @__PURE__ */ e(
-        A,
+        transformOrigin: `bottom ${$ ? "right" : "left"}`,
+        animation: h ? "ocl-pop-in .18s ease" : "none"
+      }, children: /* @__PURE__ */ n(
+        G,
         {
-          url: o,
-          ...r ? { apiUrl: r } : {},
-          ...s ? { profileId: s } : {},
-          ...n ? { tenantId: n } : {},
-          ...i ? { token: i } : {},
-          ...l ? { refreshToken: l } : {},
+          url: r,
+          ...i ? { apiUrl: i } : {},
+          ...c ? { profileId: c } : {},
+          ...o ? { tenantId: o } : {},
+          ...l ? { token: l } : {},
+          ...s ? { refreshToken: s } : {},
           ...d ? { userId: d } : {},
-          ...u ? { userName: u } : {},
-          ...v ? { userEmail: v } : {},
-          ...m ? { scope: m } : {},
-          accent: p,
+          ...p ? { userName: p } : {},
+          ...y ? { userEmail: y } : {},
+          ...v ? { scope: v } : {},
+          accent: a,
           height: "100%",
-          onClose: () => j(!1)
+          onClose: () => t(!1)
         }
       ) }),
-      /* @__PURE__ */ e(
+      /* @__PURE__ */ n(
         "button",
         {
-          ref: M,
-          onClick: () => j((y) => !y),
-          "aria-label": f ? "Close chat" : typeof S == "string" ? S : "Open chat",
-          "aria-expanded": f,
+          ref: b,
+          onClick: () => t((e) => !e),
+          "aria-label": h ? "Close chat" : typeof z == "string" ? z : "Open chat",
+          "aria-expanded": h,
           style: {
             width: "56px",
             height: "56px",
             borderRadius: "50%",
-            background: p,
+            background: a,
             color: "#fff",
             border: "none",
             fontSize: "20px",
             cursor: "pointer",
             flexShrink: 0,
-            boxShadow: "0 4px 16px rgba(0,0,0,.25)",
+            boxShadow: "0 12px 32px rgba(108,92,231,.14)",
             transition: "transform .15s",
             alignItems: "center",
             justifyContent: "center",
-            display: f && a ? "none" : "flex"
+            display: h && g ? "none" : "flex"
           },
-          onMouseEnter: (y) => {
-            y.currentTarget.style.transform = "scale(1.08)";
+          onMouseEnter: (e) => {
+            e.currentTarget.style.transform = "scale(1.08)";
           },
-          onMouseLeave: (y) => {
-            y.currentTarget.style.transform = "scale(1)";
+          onMouseLeave: (e) => {
+            e.currentTarget.style.transform = "scale(1)";
           },
-          children: f ? /* @__PURE__ */ e(Y, {}) : R ?? /* @__PURE__ */ e(G, {})
+          children: h ? /* @__PURE__ */ n(E, {}) : f ?? /* @__PURE__ */ n(K, {})
         }
       ),
-      /* @__PURE__ */ e("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
+      /* @__PURE__ */ n("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
     ] });
-  const $ = `min(${b ?? "420px"}, calc(100vw - 16px))`, [w, c] = k(null), x = () => {
-    !f && M.current && c(M.current.getBoundingClientRect()), j((y) => !y);
-  }, g = w ? w.bottom + 8 : 0, z = w ? Math.max(8, window.innerWidth - w.right) : 0;
-  return /* @__PURE__ */ _(O, { children: [
-    /* @__PURE__ */ _(
+  const B = `min(${w ?? "420px"}, calc(100vw - 16px))`, [x, S] = _(null), C = () => {
+    !h && b.current && S(b.current.getBoundingClientRect()), t((e) => !e);
+  }, u = x ? x.bottom + 8 : 0, R = x ? Math.max(8, window.innerWidth - x.right) : 0;
+  return /* @__PURE__ */ W(q, { children: [
+    /* @__PURE__ */ W(
       "button",
       {
-        ref: M,
-        onClick: x,
+        ref: b,
+        onClick: C,
         style: {
           display: "inline-flex",
           alignItems: "center",
           gap: "6px",
           padding: "8px 16px",
           borderRadius: "8px",
-          background: f ? p : "transparent",
-          color: f ? "#fff" : p,
-          border: `2px solid ${p}`,
+          background: h ? a : "transparent",
+          color: h ? "#fff" : a,
+          border: `2px solid ${a}`,
           fontSize: "14px",
           fontWeight: 600,
           cursor: "pointer",
           transition: "background .15s, color .15s"
         },
         children: [
-          /* @__PURE__ */ e(G, { size: 16 }),
+          /* @__PURE__ */ n(K, { size: 16 }),
           " ",
-          S
+          z
         ]
       }
     ),
-    f && w && /* @__PURE__ */ _(O, { children: [
-      /* @__PURE__ */ e(
+    h && x && /* @__PURE__ */ W(q, { children: [
+      /* @__PURE__ */ n(
         "div",
         {
-          onClick: () => j(!1),
+          onClick: () => t(!1),
           style: { position: "fixed", inset: 0, zIndex: 9998 }
         }
       ),
-      /* @__PURE__ */ e("div", { style: {
+      /* @__PURE__ */ n("div", { style: {
         position: "fixed",
-        ...a ? {
+        ...g ? {
           inset: 0,
           width: "100%",
           height: "100dvh",
           borderRadius: "0"
         } : {
-          top: g,
-          right: z,
-          width: $,
-          height: `min(${t}, calc(100dvh - ${g}px - 12px))`,
-          borderRadius: "16px"
+          top: u,
+          right: R,
+          width: B,
+          height: `min(${m}, calc(100dvh - ${u}px - 12px))`,
+          borderRadius: "28px"
         },
         overflow: "hidden",
-        boxShadow: a ? "none" : "0 8px 40px rgba(0,0,0,.2)",
+        boxShadow: g ? "none" : "0 12px 32px rgba(108,92,231,.14)",
         background: "#fff",
         zIndex: 9999,
         animation: "ocl-slide-in .18s ease"
-      }, children: /* @__PURE__ */ e(
-        A,
+      }, children: /* @__PURE__ */ n(
+        G,
         {
-          url: o,
-          ...r ? { apiUrl: r } : {},
-          ...s ? { profileId: s } : {},
-          ...n ? { tenantId: n } : {},
-          ...i ? { token: i } : {},
-          ...l ? { refreshToken: l } : {},
+          url: r,
+          ...i ? { apiUrl: i } : {},
+          ...c ? { profileId: c } : {},
+          ...o ? { tenantId: o } : {},
+          ...l ? { token: l } : {},
+          ...s ? { refreshToken: s } : {},
           ...d ? { userId: d } : {},
-          ...u ? { userName: u } : {},
-          ...v ? { userEmail: v } : {},
-          ...m ? { scope: m } : {},
-          accent: p,
+          ...p ? { userName: p } : {},
+          ...y ? { userEmail: y } : {},
+          ...v ? { scope: v } : {},
+          accent: a,
           height: "100%",
-          onClose: () => j(!1)
+          onClose: () => t(!1)
         }
       ) }),
-      /* @__PURE__ */ e("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
+      /* @__PURE__ */ n("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
     ] })
   ] });
 }
 export {
-  A as ChatApp,
-  X as ChatAppLauncher,
-  Q as ChatWidget,
-  V as MarketplaceChat
+  G as ChatApp,
+  N as ChatAppLauncher,
+  T as ChatWidget,
+  I as MarketplaceChat
 };
 //# sourceMappingURL=react.js.map