@paramms/chat-widget 1.0.36 → 1.0.38

package/dist/react.js

@@ -1,228 +1,282 @@
-import { jsxs as z, jsx as a, Fragment as F } from "react/jsx-runtime";
-import { useState as _, useRef as L, useEffect as k } from "react";
-import { mount as D } from "./index.js";
-function J({
-  url: u,
-  apiUrl: o,
-  profileId: r,
-  token: e,
+import { jsxs as _, jsx as e, Fragment as A } from "react/jsx-runtime";
+import { useState as D, useRef as S, useEffect as W } from "react";
+import { mount as H } from "./index.js";
+function O({ size: i = 26 }) {
+  return /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: i, height: i, fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", children: /* @__PURE__ */ e(
+    "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",
+      fill: "currentColor",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    }
+  ) });
+}
+function G({ size: i = 22 }) {
+  return /* @__PURE__ */ e("svg", { viewBox: "0 0 24 24", width: i, height: i, 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 Q({
+  url: i,
+  apiUrl: r,
+  profileId: s,
+  token: o,
   refreshToken: l,
-  userId: i,
-  userName: c,
-  userEmail: p,
-  userAvatar: g,
+  userId: c,
+  userName: d,
+  userEmail: h,
+  userAvatar: v,
   contextTitle: m,
-  contextSubtitle: b,
-  contextStatus: w,
+  contextSubtitle: a,
+  contextStatus: u,
   subjectId: j,
-  accent: M,
-  launcher: v,
+  accent: C,
+  launcher: p,
   position: t,
-  quickReplies: d,
-  height: x = "100%",
-  i18n: y,
-  translateLang: f
+  quickReplies: f,
+  height: b = "100%",
+  i18n: R,
+  translateLang: x,
+  inbox: w,
+  inboxScope: g
 }) {
-  const R = L(null), h = L(null);
-  return k(() => {
-    var n;
-    if (R.current)
-      return (n = h.current) == null || n.close(), h.current = D({
-        el: R.current,
-        url: u,
-        ...o ? { apiUrl: o } : {},
-        profileId: r,
+  const M = S(null), n = S(null), [y, $] = D(!1);
+  return W(() => {
+    var z;
+    if (!y && M.current)
+      return (z = n.current) == null || z.close(), n.current = H({
+        el: M.current,
+        url: i,
+        ...r ? { apiUrl: r } : {},
+        profileId: s,
         ...j ? { subjectId: j } : {},
-        ...e ? { token: e } : {},
+        ...o ? { token: o } : {},
         ...l ? { refreshToken: l } : {},
-        ...i ? { userId: i } : {},
-        ...i || c || p || g ? {
+        ...c ? { userId: c } : {},
+        ...c || d || h || v ? {
           user: {
-            ...c ? { name: c } : {},
-            ...p ? { email: p } : {},
-            ...g ? { avatar: g } : {}
+            ...d ? { name: d } : {},
+            ...h ? { email: h } : {},
+            ...v ? { avatar: v } : {}
           }
         } : {},
         ...m ? {
           subject: {
             title: m,
-            ...b ? { subtitle: b } : {},
-            ...w ? { status: w } : {}
+            ...a ? { subtitle: a } : {},
+            ...u ? { status: u } : {}
           }
         } : {},
-        ...d ? { quickReplies: d } : {},
-        ...M ? { accent: M } : {},
-        ...f ? { translateLang: f } : {},
-        ...y ? { i18n: y } : {},
-        ...v ? { launcher: v, position: t ?? "bottom-right" } : {}
+        ...f ? { quickReplies: f } : {},
+        ...C ? { accent: C } : {},
+        ...x ? { translateLang: x } : {},
+        ...R ? { i18n: R } : {},
+        ...w && !p ? { onBack: () => $(!0) } : {},
+        ...p ? { launcher: p, position: t ?? "bottom-right" } : {}
       }), () => {
-        var s;
-        (s = h.current) == null || s.close(), h.current = null;
+        var B;
+        (B = n.current) == null || B.close(), n.current = null;
       };
-  }, [u, o, r, j, e, i, c, p, M, v, t, f]), /* @__PURE__ */ a(
+  }, [i, r, s, j, o, c, d, h, C, p, t, x, w, y]), w && !p && y ? /* @__PURE__ */ e(
+    F,
+    {
+      url: i,
+      ...r ? { apiUrl: r } : {},
+      profileId: s,
+      ...o ? { token: o } : {},
+      ...l ? { refreshToken: l } : {},
+      ...c ? { userId: c } : {},
+      ...d ? { userName: d } : {},
+      ...h ? { userEmail: h } : {},
+      ...C ? { accent: C } : {},
+      scope: g ?? "tenant",
+      height: b,
+      onClose: () => $(!1)
+    }
+  ) : /* @__PURE__ */ e(
     "div",
     {
-      ref: R,
-      style: v ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: x, minHeight: x === "100%" ? "480px" : void 0 }
+      ref: M,
+      style: p ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: b, minHeight: b === "100%" ? "480px" : void 0 }
     }
   );
 }
-const O = [
+const Y = [
   "Is this still available?",
   "Can I schedule a viewing?",
   "What is your best price?"
 ];
-function P({
-  url: u,
-  apiUrl: o,
-  profileId: r,
-  token: e,
+function V({
+  url: i,
+  apiUrl: r,
+  profileId: s,
+  token: o,
   refreshToken: l,
-  listingId: i,
-  listingTitle: c,
-  listingMeta: p,
-  listingPrice: g,
+  listingId: c,
+  listingTitle: d,
+  listingMeta: h,
+  listingPrice: v,
   listingStatus: m,
-  userId: b,
-  userName: w,
+  userId: a,
+  userName: u,
   userEmail: j,
-  userAvatar: M,
-  accent: v,
+  userAvatar: C,
+  accent: p,
   launcher: t,
-  position: d,
-  quickReplies: x,
-  height: y = "100%",
-  i18n: f,
-  translateLang: R
+  position: f,
+  quickReplies: b,
+  height: R = "100%",
+  i18n: x,
+  translateLang: w,
+  inbox: g,
+  inboxScope: M
 }) {
-  const h = L(null), n = L(null);
-  return k(() => {
-    if (!h.current) return;
-    let s = !1;
-    const C = setTimeout(() => {
-      var S;
-      s || !h.current || ((S = n.current) == null || S.close(), n.current = D({
-        el: h.current,
-        url: u,
-        ...o ? { apiUrl: o } : {},
-        profileId: r,
-        ...i ? { subjectId: `listing_${i}` } : {},
-        ...e ? { token: e } : {},
+  const n = S(null), y = S(null), [$, z] = D(!1);
+  return W(() => {
+    if ($ || !n.current) return;
+    let B = !1;
+    const L = setTimeout(() => {
+      var k;
+      B || !n.current || ((k = y.current) == null || k.close(), y.current = H({
+        el: n.current,
+        url: i,
+        ...r ? { apiUrl: r } : {},
+        profileId: s,
+        ...c ? { subjectId: `listing_${c}` } : {},
+        ...o ? { token: o } : {},
         ...l ? { refreshToken: l } : {},
-        ...b ? { userId: b } : {},
-        ...b || w || j || M ? {
+        ...a ? { userId: a } : {},
+        ...a || u || j || C ? {
           user: {
-            ...w ? { name: w } : {},
+            ...u ? { name: u } : {},
             ...j ? { email: j } : {},
-            ...M ? { avatar: M } : {},
-            ...i ? { meta: { listingId: i } } : {}
+            ...C ? { avatar: C } : {},
+            ...c ? { meta: { listingId: c } } : {}
           }
         } : {},
-        ...c ? {
+        ...d ? {
           subject: {
-            title: c,
-            ...p ? { subtitle: p } : {},
-            ...g ? { tags: [`$${g.toLocaleString()}`] } : {},
+            title: d,
+            ...h ? { subtitle: h } : {},
+            ...v ? { tags: [`$${v.toLocaleString()}`] } : {},
             ...m ? { status: m } : {}
           }
         } : {},
-        quickReplies: x ?? O,
-        ...v ? { accent: v } : {},
-        ...R ? { translateLang: R } : {},
-        ...f ? { i18n: f } : {},
-        ...t ? { launcher: t, position: d ?? "bottom-right" } : {}
+        quickReplies: b ?? Y,
+        ...p ? { accent: p } : {},
+        ...w ? { translateLang: w } : {},
+        ...x ? { i18n: x } : {},
+        ...g && !t ? { onBack: () => z(!0) } : {},
+        ...t ? { launcher: t, position: f ?? "bottom-right" } : {}
       }));
     }, 0);
     return () => {
-      var S;
-      s = !0, clearTimeout(C), (S = n.current) == null || S.close(), n.current = null;
+      var k;
+      B = !0, clearTimeout(L), (k = y.current) == null || k.close(), y.current = null;
     };
-  }, [u, o, r, i, e, b, v, t, d, R]), /* @__PURE__ */ a(
+  }, [i, r, s, c, o, a, p, t, f, w, g, $]), g && !t && $ ? /* @__PURE__ */ e(
+    F,
+    {
+      url: i,
+      ...r ? { apiUrl: r } : {},
+      profileId: s,
+      ...o ? { token: o } : {},
+      ...l ? { refreshToken: l } : {},
+      ...a ? { userId: a } : {},
+      ...u ? { userName: u } : {},
+      ...j ? { userEmail: j } : {},
+      ...p ? { accent: p } : {},
+      scope: M ?? "tenant",
+      height: R,
+      onClose: () => z(!1)
+    }
+  ) : /* @__PURE__ */ e(
     "div",
     {
-      ref: h,
-      style: t ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: y, minHeight: y === "100%" ? "480px" : void 0 }
+      ref: n,
+      style: t ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: R, minHeight: R === "100%" ? "480px" : void 0 }
     }
   );
 }
-function Y(u) {
-  const [o, r] = _(
-    typeof window < "u" && window.innerWidth <= u
+function q(i) {
+  const [r, s] = D(
+    typeof window < "u" && window.innerWidth <= i
   );
-  return k(() => {
+  return W(() => {
     if (typeof window > "u" || !window.matchMedia) return;
-    const e = window.matchMedia(`(max-width: ${u}px)`), l = (i) => r(i.matches);
-    return r(e.matches), e.addEventListener("change", l), () => e.removeEventListener("change", l);
-  }, [u]), o;
+    const o = window.matchMedia(`(max-width: ${i}px)`), l = (c) => s(c.matches);
+    return s(o.matches), o.addEventListener("change", l), () => o.removeEventListener("change", l);
+  }, [i]), r;
 }
-function H({
-  url: u,
-  apiUrl: o,
-  profileId: r,
-  tenantId: e,
+function F({
+  url: i,
+  apiUrl: r,
+  profileId: s,
+  tenantId: o,
   token: l,
-  refreshToken: i,
-  userId: c,
-  userName: p,
-  userEmail: g,
+  refreshToken: c,
+  userId: d,
+  userName: h,
+  userEmail: v,
   accent: m,
-  height: b = "100%",
-  i18n: w,
+  height: a = "100%",
+  i18n: u,
   onClose: j,
-  scope: M = "tenant"
+  scope: C = "tenant"
 }) {
-  const v = !r && !e, [t, d] = _(null), x = L(null), y = L(null), f = L(null), R = L(null);
-  return k(() => {
-    if (!x.current) return;
-    let h = !1;
-    return import("./chatlist.js").then(({ mountChatList: n }) => {
-      h || !x.current || (f.current = n({
-        el: x.current,
-        url: u,
-        ...o ? { apiUrl: o } : {},
-        ...r ? { profileId: r } : {},
-        ...e ? { tenantId: e } : {},
-        scope: M,
-        onSelect: (s) => d(s),
+  const p = !s && !o, [t, f] = D(null), b = S(null), R = S(null), x = S(null), w = S(null);
+  return W(() => {
+    if (!b.current) return;
+    let g = !1;
+    return import("./chatlist.js").then(({ mountChatList: M }) => {
+      g || !b.current || (x.current = M({
+        el: b.current,
+        url: i,
+        ...r ? { apiUrl: r } : {},
+        ...s ? { profileId: s } : {},
+        ...o ? { tenantId: o } : {},
+        scope: C,
+        onSelect: (n) => f(n),
         // 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 C;
-          const s = (C = f.current) == null ? void 0 : C.defaultProfileId();
-          s && d({ id: "__new__", profileId: s, state: "open", updatedAt: Date.now() });
+          var y;
+          const n = (y = x.current) == null ? void 0 : y.defaultProfileId();
+          n && f({ id: "__new__", profileId: n, state: "open", updatedAt: Date.now() });
         },
         ...l ? { token: l } : {},
-        ...c ? { userId: c } : {},
+        ...d ? { userId: d } : {},
         ...m ? { accent: m } : {},
-        ...w ? { i18n: w } : {}
+        ...u ? { i18n: u } : {}
       }));
     }), () => {
-      var n;
-      h = !0, (n = f.current) == null || n.close(), f.current = null;
+      var M;
+      g = !0, (M = x.current) == null || M.close(), x.current = null;
     };
-  }, [u, o, r, e, l, c, M]), k(() => {
-    var n;
-    if (!y.current || !t) return;
-    (n = R.current) == null || n.close(), R.current = D({
-      el: y.current,
-      url: u,
-      ...o ? { apiUrl: o } : {},
-      profileId: t.profileId ?? r,
+  }, [i, r, s, o, l, d, C]), W(() => {
+    var M;
+    if (!R.current || !t) return;
+    (M = w.current) == null || M.close(), w.current = H({
+      el: R.current,
+      url: i,
+      ...r ? { apiUrl: r } : {},
+      profileId: t.profileId ?? s,
       // 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 } : {},
       ...l ? { token: l } : {},
-      ...i ? { refreshToken: i } : {},
-      ...c ? { userId: c } : {},
-      ...c || p || g ? {
+      ...c ? { refreshToken: c } : {},
+      ...d ? { userId: d } : {},
+      ...d || h || v ? {
         user: {
-          ...p ? { name: p } : {},
-          ...g ? { email: g } : {}
+          ...h ? { name: h } : {},
+          ...v ? { email: v } : {}
         }
       } : {},
       ...t.subjectTitle ? {
@@ -233,28 +287,28 @@ function H({
       } : {},
       ...m ? { accent: m } : {},
       // Stack navigation: the chatroom's back chevron returns to the list.
-      onBack: () => d(null)
+      onBack: () => f(null)
     });
-    const h = setInterval(() => {
-      var s;
-      return (s = f.current) == null ? void 0 : s.refresh();
+    const g = setInterval(() => {
+      var n;
+      return (n = x.current) == null ? void 0 : n.refresh();
     }, 2e4);
     return () => {
-      var s, C;
-      clearInterval(h), (s = R.current) == null || s.close(), R.current = null, (C = f.current) == null || C.refresh();
+      var n, y;
+      clearInterval(g), (n = w.current) == null || n.close(), w.current = null, (y = x.current) == null || y.refresh();
     };
-  }, [t == null ? void 0 : t.id]), v ? /* @__PURE__ */ z("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
+  }, [t == null ? void 0 : t.id]), p ? /* @__PURE__ */ _("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
     "[relay] <ChatApp/> needs a ",
-    /* @__PURE__ */ a("code", { children: "profileId" }),
+    /* @__PURE__ */ e("code", { children: "profileId" }),
     " or a ",
-    /* @__PURE__ */ a("code", { children: "tenantId" }),
+    /* @__PURE__ */ e("code", { children: "tenantId" }),
     "."
-  ] }) : /* @__PURE__ */ z("div", { style: { position: "relative", width: "100%", height: b, minHeight: "400px", overflow: "hidden", background: "#fff" }, children: [
-    j && !t && /* @__PURE__ */ a(
+  ] }) : /* @__PURE__ */ _("div", { style: { position: "relative", width: "100%", height: a, minHeight: "400px", overflow: "hidden", background: "#fff" }, children: [
+    j && !t && /* @__PURE__ */ e(
       "button",
       {
         onClick: j,
-        "aria-label": (w == null ? void 0 : w.close) ?? "Close",
+        "aria-label": (u == null ? void 0 : u.close) ?? "Close",
         style: {
           position: "absolute",
           top: 8,
@@ -273,55 +327,55 @@ function H({
           lineHeight: 1,
           cursor: "pointer"
         },
-        children: "✕"
+        children: /* @__PURE__ */ e(G, { size: 18 })
       }
     ),
-    /* @__PURE__ */ a("div", { style: {
+    /* @__PURE__ */ e("div", { style: {
       position: "absolute",
       inset: 0,
       display: t ? "none" : "flex",
       flexDirection: "column"
-    }, children: /* @__PURE__ */ a("div", { ref: x, style: { width: "100%", height: "100%" } }) }),
-    t && /* @__PURE__ */ a("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ a("div", { ref: y, style: { width: "100%", height: "100%" } }) })
+    }, children: /* @__PURE__ */ e("div", { ref: b, style: { width: "100%", height: "100%" } }) }),
+    t && /* @__PURE__ */ e("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ e("div", { ref: R, style: { width: "100%", height: "100%" } }) })
   ] });
 }
-function Q({
-  url: u,
-  apiUrl: o,
-  profileId: r,
-  tenantId: e,
+function X({
+  url: i,
+  apiUrl: r,
+  profileId: s,
+  tenantId: o,
   token: l,
-  refreshToken: i,
-  userId: c,
-  userName: p,
-  userEmail: g,
+  refreshToken: c,
+  userId: d,
+  userName: h,
+  userEmail: v,
   scope: m,
-  accent: b = "#4F63F5",
-  floating: w = !0,
+  accent: a = "#4F63F5",
+  floating: u = !0,
   position: j = "bottom-right",
-  label: M,
-  panelWidth: v,
+  label: C,
+  panelWidth: p,
   panelHeight: t = "600px"
 }) {
-  const [d, x] = _(!1), y = L(null), f = j === "bottom-right", h = M ?? (w ? "💬" : "Messages"), n = Y(479);
-  if (k(() => {
-    const $ = (E) => {
-      E.key === "Escape" && x(!1);
+  const [f, b] = D(!1), R = S(null), x = j === "bottom-right", w = C ?? (u ? void 0 : "Messages"), g = q(479);
+  if (W(() => {
+    const L = (k) => {
+      k.key === "Escape" && b(!1);
     };
-    return document.addEventListener("keydown", $), () => document.removeEventListener("keydown", $);
-  }, []), w)
-    return /* @__PURE__ */ z("div", { style: {
+    return document.addEventListener("keydown", L), () => document.removeEventListener("keydown", L);
+  }, []), u)
+    return /* @__PURE__ */ _("div", { style: {
       position: "fixed",
-      [f ? "right" : "left"]: "20px",
+      [x ? "right" : "left"]: "20px",
       bottom: "20px",
       zIndex: 9999,
       display: "flex",
       flexDirection: "column",
-      alignItems: f ? "flex-end" : "flex-start",
+      alignItems: x ? "flex-end" : "flex-start",
       gap: "12px"
     }, children: [
-      /* @__PURE__ */ a("div", { style: {
-        ...n ? {
+      /* @__PURE__ */ e("div", { style: {
+        ...g ? {
           position: "fixed",
           inset: 0,
           width: "100%",
@@ -329,147 +383,152 @@ function Q({
           borderRadius: "0",
           zIndex: 9998
         } : {
-          width: `min(${v ?? "420px"}, calc(100vw - 40px))`,
+          width: `min(${p ?? "420px"}, calc(100vw - 40px))`,
           height: `min(${t}, calc(100dvh - 108px))`,
           borderRadius: "16px"
         },
         overflow: "hidden",
-        boxShadow: n ? "none" : "0 8px 40px rgba(0,0,0,.18)",
+        boxShadow: g ? "none" : "0 8px 40px rgba(0,0,0,.18)",
         background: "#fff",
-        display: d ? "flex" : "none",
+        display: f ? "flex" : "none",
         flexDirection: "column",
-        transformOrigin: `bottom ${f ? "right" : "left"}`,
-        animation: d ? "ocl-pop-in .18s ease" : "none"
-      }, children: /* @__PURE__ */ a(
-        H,
+        transformOrigin: `bottom ${x ? "right" : "left"}`,
+        animation: f ? "ocl-pop-in .18s ease" : "none"
+      }, children: /* @__PURE__ */ e(
+        F,
         {
-          url: u,
-          ...o ? { apiUrl: o } : {},
-          ...r ? { profileId: r } : {},
-          ...e ? { tenantId: e } : {},
+          url: i,
+          ...r ? { apiUrl: r } : {},
+          ...s ? { profileId: s } : {},
+          ...o ? { tenantId: o } : {},
           ...l ? { token: l } : {},
-          ...i ? { refreshToken: i } : {},
-          ...c ? { userId: c } : {},
-          ...p ? { userName: p } : {},
-          ...g ? { userEmail: g } : {},
+          ...c ? { refreshToken: c } : {},
+          ...d ? { userId: d } : {},
+          ...h ? { userName: h } : {},
+          ...v ? { userEmail: v } : {},
           ...m ? { scope: m } : {},
-          accent: b,
+          accent: a,
           height: "100%",
-          onClose: () => x(!1)
+          onClose: () => b(!1)
         }
       ) }),
-      /* @__PURE__ */ a(
+      /* @__PURE__ */ e(
         "button",
         {
-          ref: y,
-          onClick: () => x(($) => !$),
+          ref: R,
+          onClick: () => b((L) => !L),
+          "aria-label": f ? "Close chat" : typeof w == "string" ? w : "Open chat",
+          "aria-expanded": f,
           style: {
             width: "56px",
             height: "56px",
             borderRadius: "50%",
-            background: b,
+            background: a,
             color: "#fff",
             border: "none",
-            fontSize: "24px",
+            fontSize: "20px",
             cursor: "pointer",
             flexShrink: 0,
             boxShadow: "0 4px 16px rgba(0,0,0,.25)",
             transition: "transform .15s",
-            display: d && n ? "none" : "block"
+            alignItems: "center",
+            justifyContent: "center",
+            display: f && g ? "none" : "flex"
           },
-          onMouseEnter: ($) => {
-            $.target.style.transform = "scale(1.08)";
+          onMouseEnter: (L) => {
+            L.currentTarget.style.transform = "scale(1.08)";
           },
-          onMouseLeave: ($) => {
-            $.target.style.transform = "scale(1)";
+          onMouseLeave: (L) => {
+            L.currentTarget.style.transform = "scale(1)";
           },
-          children: d ? "✕" : h
+          children: f ? /* @__PURE__ */ e(G, {}) : C ?? /* @__PURE__ */ e(O, {})
         }
       ),
-      /* @__PURE__ */ a("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
+      /* @__PURE__ */ e("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
     ] });
-  const s = `min(${v ?? "420px"}, calc(100vw - 16px))`, [C, S] = _(null), A = () => {
-    !d && y.current && S(y.current.getBoundingClientRect()), x(($) => !$);
-  }, B = C ? C.bottom + 8 : 0, W = C ? Math.max(8, window.innerWidth - C.right) : 0;
-  return /* @__PURE__ */ z(F, { children: [
-    /* @__PURE__ */ z(
+  const M = `min(${p ?? "420px"}, calc(100vw - 16px))`, [n, y] = D(null), $ = () => {
+    !f && R.current && y(R.current.getBoundingClientRect()), b((L) => !L);
+  }, z = n ? n.bottom + 8 : 0, B = n ? Math.max(8, window.innerWidth - n.right) : 0;
+  return /* @__PURE__ */ _(A, { children: [
+    /* @__PURE__ */ _(
       "button",
       {
-        ref: y,
-        onClick: A,
+        ref: R,
+        onClick: $,
         style: {
           display: "inline-flex",
           alignItems: "center",
           gap: "6px",
           padding: "8px 16px",
           borderRadius: "8px",
-          background: d ? b : "transparent",
-          color: d ? "#fff" : b,
-          border: `2px solid ${b}`,
+          background: f ? a : "transparent",
+          color: f ? "#fff" : a,
+          border: `2px solid ${a}`,
           fontSize: "14px",
           fontWeight: 600,
           cursor: "pointer",
           transition: "background .15s, color .15s"
         },
         children: [
-          "💬 ",
-          h
+          /* @__PURE__ */ e(O, { size: 16 }),
+          " ",
+          w
         ]
       }
     ),
-    d && C && /* @__PURE__ */ z(F, { children: [
-      /* @__PURE__ */ a(
+    f && n && /* @__PURE__ */ _(A, { children: [
+      /* @__PURE__ */ e(
         "div",
         {
-          onClick: () => x(!1),
+          onClick: () => b(!1),
           style: { position: "fixed", inset: 0, zIndex: 9998 }
         }
       ),
-      /* @__PURE__ */ a("div", { style: {
+      /* @__PURE__ */ e("div", { style: {
         position: "fixed",
-        ...n ? {
+        ...g ? {
           inset: 0,
           width: "100%",
           height: "100dvh",
           borderRadius: "0"
         } : {
-          top: B,
-          right: W,
-          width: s,
-          height: `min(${t}, calc(100dvh - ${B}px - 12px))`,
+          top: z,
+          right: B,
+          width: M,
+          height: `min(${t}, calc(100dvh - ${z}px - 12px))`,
           borderRadius: "16px"
         },
         overflow: "hidden",
-        boxShadow: n ? "none" : "0 8px 40px rgba(0,0,0,.2)",
+        boxShadow: g ? "none" : "0 8px 40px rgba(0,0,0,.2)",
         background: "#fff",
         zIndex: 9999,
         animation: "ocl-slide-in .18s ease"
-      }, children: /* @__PURE__ */ a(
-        H,
+      }, children: /* @__PURE__ */ e(
+        F,
         {
-          url: u,
-          ...o ? { apiUrl: o } : {},
-          ...r ? { profileId: r } : {},
-          ...e ? { tenantId: e } : {},
+          url: i,
+          ...r ? { apiUrl: r } : {},
+          ...s ? { profileId: s } : {},
+          ...o ? { tenantId: o } : {},
           ...l ? { token: l } : {},
-          ...i ? { refreshToken: i } : {},
-          ...c ? { userId: c } : {},
-          ...p ? { userName: p } : {},
-          ...g ? { userEmail: g } : {},
+          ...c ? { refreshToken: c } : {},
+          ...d ? { userId: d } : {},
+          ...h ? { userName: h } : {},
+          ...v ? { userEmail: v } : {},
           ...m ? { scope: m } : {},
-          accent: b,
+          accent: a,
           height: "100%",
-          onClose: () => x(!1)
+          onClose: () => b(!1)
         }
       ) }),
-      /* @__PURE__ */ a("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
+      /* @__PURE__ */ e("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
     ] })
   ] });
 }
 export {
-  H as ChatApp,
-  Q as ChatAppLauncher,
-  J as ChatWidget,
-  P as MarketplaceChat
+  F as ChatApp,
+  X as ChatAppLauncher,
+  Q as ChatWidget,
+  V as MarketplaceChat
 };
 //# sourceMappingURL=react.js.map