@paramms/chat-widget 1.0.33 → 1.0.34

package/dist/react.js

@@ -1,321 +1,352 @@
-import { jsxs as W, jsx as p, Fragment as k } from "react/jsx-runtime";
-import { useState as D, useRef as M, useEffect as z } from "react";
-import { mount as H } from "./index.js";
-function P({
-  url: g,
-  apiUrl: l,
-  profileId: v,
-  token: d,
-  refreshToken: w,
-  userId: n,
+import { jsxs as L, jsx as u, Fragment as F } from "react/jsx-runtime";
+import { useState as D, useRef as $, useEffect as _ } from "react";
+import { mount as W } from "./index.js";
+function J({
+  url: a,
+  apiUrl: n,
+  profileId: r,
+  token: t,
+  refreshToken: l,
+  userId: o,
   userName: c,
-  userEmail: s,
-  userAvatar: f,
-  contextTitle: x,
-  contextSubtitle: y,
-  contextStatus: R,
-  subjectId: t,
-  accent: b,
-  launcher: h,
-  position: i,
-  quickReplies: u,
-  height: m = "100%",
-  i18n: a,
-  translateLang: C
+  userEmail: p,
+  userAvatar: b,
+  contextTitle: m,
+  contextSubtitle: x,
+  contextStatus: C,
+  subjectId: M,
+  accent: j,
+  launcher: e,
+  position: y,
+  quickReplies: d,
+  height: v = "100%",
+  i18n: f,
+  translateLang: g
 }) {
-  const r = M(null), o = M(null);
-  return z(() => {
-    var e;
-    if (r.current)
-      return (e = o.current) == null || e.close(), o.current = H({
-        el: r.current,
-        url: g,
-        ...l ? { apiUrl: l } : {},
-        profileId: v,
-        ...t ? { subjectId: t } : {},
-        ...d ? { token: d } : {},
-        ...w ? { refreshToken: w } : {},
-        ...n ? { userId: n } : {},
-        ...n || c || s || f ? {
+  const w = $(null), h = $(null);
+  return _(() => {
+    var i;
+    if (w.current)
+      return (i = h.current) == null || i.close(), h.current = W({
+        el: w.current,
+        url: a,
+        ...n ? { apiUrl: n } : {},
+        profileId: r,
+        ...M ? { subjectId: M } : {},
+        ...t ? { token: t } : {},
+        ...l ? { refreshToken: l } : {},
+        ...o ? { userId: o } : {},
+        ...o || c || p || b ? {
           user: {
             ...c ? { name: c } : {},
-            ...s ? { email: s } : {},
-            ...f ? { avatar: f } : {}
+            ...p ? { email: p } : {},
+            ...b ? { avatar: b } : {}
           }
         } : {},
-        ...x ? {
+        ...m ? {
           subject: {
-            title: x,
-            ...y ? { subtitle: y } : {},
-            ...R ? { status: R } : {}
+            title: m,
+            ...x ? { subtitle: x } : {},
+            ...C ? { status: C } : {}
           }
         } : {},
-        ...u ? { quickReplies: u } : {},
-        ...b ? { accent: b } : {},
-        ...C ? { translateLang: C } : {},
-        ...a ? { i18n: a } : {},
-        ...h ? { launcher: h, position: i ?? "bottom-right" } : {}
+        ...d ? { quickReplies: d } : {},
+        ...j ? { accent: j } : {},
+        ...g ? { translateLang: g } : {},
+        ...f ? { i18n: f } : {},
+        ...e ? { launcher: e, position: y ?? "bottom-right" } : {}
       }), () => {
-        var j;
-        (j = o.current) == null || j.close(), o.current = null;
+        var s;
+        (s = h.current) == null || s.close(), h.current = null;
       };
-  }, [g, l, v, t, d, n, c, s, b, h, i, C]), /* @__PURE__ */ p(
+  }, [a, n, r, M, t, o, c, p, j, e, y, g]), /* @__PURE__ */ u(
     "div",
     {
-      ref: r,
-      style: h ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: m, minHeight: m === "100%" ? "480px" : void 0 }
+      ref: w,
+      style: e ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: v, minHeight: v === "100%" ? "480px" : void 0 }
     }
   );
 }
-const O = [
+const Y = [
   "Is this still available?",
   "Can I schedule a viewing?",
   "What is your best price?"
 ];
-function G({
-  url: g,
-  apiUrl: l,
-  profileId: v,
-  token: d,
-  refreshToken: w,
-  listingId: n,
+function P({
+  url: a,
+  apiUrl: n,
+  profileId: r,
+  token: t,
+  refreshToken: l,
+  listingId: o,
   listingTitle: c,
-  listingMeta: s,
-  listingPrice: f,
-  listingStatus: x,
-  userId: y,
-  userName: R,
-  userEmail: t,
-  userAvatar: b,
-  accent: h,
-  launcher: i,
-  position: u,
-  quickReplies: m,
-  height: a = "100%",
-  i18n: C,
-  translateLang: r
+  listingMeta: p,
+  listingPrice: b,
+  listingStatus: m,
+  userId: x,
+  userName: C,
+  userEmail: M,
+  userAvatar: j,
+  accent: e,
+  launcher: y,
+  position: d,
+  quickReplies: v,
+  height: f = "100%",
+  i18n: g,
+  translateLang: w
 }) {
-  const o = M(null), e = M(null);
-  return z(() => {
-    if (!o.current) return;
-    let j = !1;
-    const $ = setTimeout(() => {
-      var L;
-      j || !o.current || ((L = e.current) == null || L.close(), e.current = H({
-        el: o.current,
-        url: g,
-        ...l ? { apiUrl: l } : {},
-        profileId: v,
-        ...n ? { subjectId: `listing_${n}` } : {},
-        ...d ? { token: d } : {},
-        ...w ? { refreshToken: w } : {},
-        ...y ? { userId: y } : {},
-        ...y || R || t || b ? {
+  const h = $(null), i = $(null);
+  return _(() => {
+    if (!h.current) return;
+    let s = !1;
+    const R = setTimeout(() => {
+      var z;
+      s || !h.current || ((z = i.current) == null || z.close(), i.current = W({
+        el: h.current,
+        url: a,
+        ...n ? { apiUrl: n } : {},
+        profileId: r,
+        ...o ? { subjectId: `listing_${o}` } : {},
+        ...t ? { token: t } : {},
+        ...l ? { refreshToken: l } : {},
+        ...x ? { userId: x } : {},
+        ...x || C || M || j ? {
           user: {
-            ...R ? { name: R } : {},
-            ...t ? { email: t } : {},
-            ...b ? { avatar: b } : {},
-            ...n ? { meta: { listingId: n } } : {}
+            ...C ? { name: C } : {},
+            ...M ? { email: M } : {},
+            ...j ? { avatar: j } : {},
+            ...o ? { meta: { listingId: o } } : {}
           }
         } : {},
         ...c ? {
           subject: {
             title: c,
-            ...s ? { subtitle: s } : {},
-            ...f ? { tags: [`$${f.toLocaleString()}`] } : {},
-            ...x ? { status: x } : {}
+            ...p ? { subtitle: p } : {},
+            ...b ? { tags: [`$${b.toLocaleString()}`] } : {},
+            ...m ? { status: m } : {}
           }
         } : {},
-        quickReplies: m ?? O,
-        ...h ? { accent: h } : {},
-        ...r ? { translateLang: r } : {},
-        ...C ? { i18n: C } : {},
-        ...i ? { launcher: i, position: u ?? "bottom-right" } : {}
+        quickReplies: v ?? Y,
+        ...e ? { accent: e } : {},
+        ...w ? { translateLang: w } : {},
+        ...g ? { i18n: g } : {},
+        ...y ? { launcher: y, position: d ?? "bottom-right" } : {}
       }));
     }, 0);
     return () => {
-      var L;
-      j = !0, clearTimeout($), (L = e.current) == null || L.close(), e.current = null;
+      var z;
+      s = !0, clearTimeout(R), (z = i.current) == null || z.close(), i.current = null;
     };
-  }, [g, l, v, n, d, y, h, i, u, r]), /* @__PURE__ */ p(
+  }, [a, n, r, o, t, x, e, y, d, w]), /* @__PURE__ */ u(
     "div",
     {
-      ref: o,
-      style: i ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: a, minHeight: a === "100%" ? "480px" : void 0 }
+      ref: h,
+      style: y ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: f, minHeight: f === "100%" ? "480px" : void 0 }
     }
   );
 }
-function B({
-  url: g,
-  apiUrl: l,
-  profileId: v,
-  token: d,
-  refreshToken: w,
-  userId: n,
-  userName: c,
-  userEmail: s,
-  accent: f,
+function B(a) {
+  const [n, r] = D(
+    typeof window < "u" && window.innerWidth <= a
+  );
+  return _(() => {
+    if (typeof window > "u" || !window.matchMedia) return;
+    const t = window.matchMedia(`(max-width: ${a}px)`), l = (o) => r(o.matches);
+    return r(t.matches), t.addEventListener("change", l), () => t.removeEventListener("change", l);
+  }, [a]), n;
+}
+function A({
+  url: a,
+  apiUrl: n,
+  profileId: r,
+  tenantId: t,
+  token: l,
+  refreshToken: o,
+  userId: c,
+  userName: p,
+  userEmail: b,
+  accent: m,
   height: x = "100%",
-  i18n: y,
-  scope: R = "tenant"
+  i18n: C,
+  scope: M = "tenant"
 }) {
-  const [t, b] = D(null), h = M(null), i = M(null), u = M(null), m = M(null);
-  z(() => {
-    if (!h.current) return;
-    let r = !1;
-    return import("./chatlist.js").then(({ mountChatList: o }) => {
-      r || !h.current || (u.current = o({
-        el: h.current,
-        url: g,
-        ...l ? { apiUrl: l } : {},
-        profileId: v,
-        scope: R,
-        onSelect: (e) => b(e),
+  const j = !r && !t, [e, y] = D(null), d = $(null), v = $(null), f = $(null), g = $(null);
+  _(() => {
+    if (!d.current) return;
+    let h = !1;
+    return import("./chatlist.js").then(({ mountChatList: i }) => {
+      h || !d.current || (f.current = i({
+        el: d.current,
+        url: a,
+        ...n ? { apiUrl: n } : {},
+        ...r ? { profileId: r } : {},
+        ...t ? { tenantId: t } : {},
+        scope: M,
+        onSelect: (s) => y(s),
         // 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.
-        onNewChat: () => b({ id: "__new__", state: "open", updatedAt: Date.now() }),
-        ...d ? { token: d } : {},
-        ...n ? { userId: n } : {},
-        ...f ? { accent: f } : {},
-        ...y ? { i18n: y } : {}
+        // Compose target: the configured chatroom, else the tenant's default
+        // (oldest chatroom, reported by the server on the first list fetch).
+        onNewChat: () => {
+          var R;
+          const s = (R = f.current) == null ? void 0 : R.defaultProfileId();
+          s && y({ id: "__new__", profileId: s, state: "open", updatedAt: Date.now() });
+        },
+        ...l ? { token: l } : {},
+        ...c ? { userId: c } : {},
+        ...m ? { accent: m } : {},
+        ...C ? { i18n: C } : {}
       }));
     }), () => {
-      var o;
-      r = !0, (o = u.current) == null || o.close(), u.current = null;
+      var i;
+      h = !0, (i = f.current) == null || i.close(), f.current = null;
     };
-  }, [g, l, v, d, n, R]), z(() => {
-    var o;
-    if (!i.current || !t) return;
-    (o = m.current) == null || o.close(), m.current = H({
-      el: i.current,
-      url: g,
-      ...l ? { apiUrl: l } : {},
-      profileId: t.profileId ?? v,
+  }, [a, n, r, t, l, c, M]), _(() => {
+    var i;
+    if (!v.current || !e) return;
+    (i = g.current) == null || i.close(), g.current = W({
+      el: v.current,
+      url: a,
+      ...n ? { apiUrl: n } : {},
+      profileId: e.profileId ?? r,
+      // 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 } : {},
-      ...d ? { token: d } : {},
-      ...w ? { refreshToken: w } : {},
-      ...n ? { userId: n } : {},
-      ...n || c || s ? {
+      ...e.kind === "direct" && e.peerId ? { kind: "direct", peerId: e.peerId } : e.subjectId ? { subjectId: e.subjectId } : {},
+      ...l ? { token: l } : {},
+      ...o ? { refreshToken: o } : {},
+      ...c ? { userId: c } : {},
+      ...c || p || b ? {
         user: {
-          ...c ? { name: c } : {},
-          ...s ? { email: s } : {}
+          ...p ? { name: p } : {},
+          ...b ? { email: b } : {}
         }
       } : {},
-      ...t.subjectTitle ? {
+      ...e.subjectTitle ? {
         subject: {
-          title: t.subjectTitle,
-          ...t.subjectMeta ? { subtitle: t.subjectMeta } : {}
+          title: e.subjectTitle,
+          ...e.subjectMeta ? { subtitle: e.subjectMeta } : {}
         }
       } : {},
-      ...f ? { accent: f } : {}
+      ...m ? { accent: m } : {}
     });
-    const r = setInterval(() => {
-      var e;
-      return (e = u.current) == null ? void 0 : e.refresh();
+    const h = setInterval(() => {
+      var s;
+      return (s = f.current) == null ? void 0 : s.refresh();
     }, 2e4);
     return () => {
-      var e, j;
-      clearInterval(r), (e = m.current) == null || e.close(), m.current = null, (j = u.current) == null || j.refresh();
+      var s, R;
+      clearInterval(h), (s = g.current) == null || s.close(), g.current = null, (R = f.current) == null || R.refresh();
     };
-  }, [t == null ? void 0 : t.id]);
-  const [a, C] = D(typeof window < "u" && window.innerWidth < 768);
-  return z(() => {
-    if (typeof window > "u" || !window.matchMedia) return;
-    const r = window.matchMedia("(max-width: 767px)"), o = (e) => C(e.matches);
-    return C(r.matches), r.addEventListener("change", o), () => r.removeEventListener("change", o);
-  }, []), /* @__PURE__ */ W("div", { style: { display: "flex", width: "100%", height: x, minHeight: "400px", overflow: "hidden" }, children: [
-    /* @__PURE__ */ p("div", { style: {
-      width: a ? "100%" : "360px",
-      flex: a && t ? "none" : void 0,
-      display: a && t ? "none" : "flex",
+  }, [e == null ? void 0 : e.id]);
+  const w = B(767);
+  return j ? /* @__PURE__ */ L("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
+    "[relay] <ChatApp/> needs a ",
+    /* @__PURE__ */ u("code", { children: "profileId" }),
+    " or a ",
+    /* @__PURE__ */ u("code", { children: "tenantId" }),
+    "."
+  ] }) : /* @__PURE__ */ L("div", { style: { display: "flex", width: "100%", height: x, minHeight: "400px", overflow: "hidden" }, children: [
+    /* @__PURE__ */ u("div", { style: {
+      width: w ? "100%" : "360px",
+      flex: w && e ? "none" : void 0,
+      display: w && e ? "none" : "flex",
       flexDirection: "column",
-      borderRight: a ? "none" : "1px solid #e8eaed",
+      borderRight: w ? "none" : "1px solid #e8eaed",
       minWidth: 0
-    }, children: /* @__PURE__ */ p("div", { ref: h, style: { width: "100%", height: "100%" } }) }),
-    t ? /* @__PURE__ */ W("div", { style: { flex: 1, display: "flex", flexDirection: "column", minWidth: 0, position: "relative" }, children: [
-      a && /* @__PURE__ */ p(
+    }, children: /* @__PURE__ */ u("div", { ref: d, style: { width: "100%", height: "100%" } }) }),
+    e ? /* @__PURE__ */ L("div", { style: { flex: 1, display: "flex", flexDirection: "column", minWidth: 0, position: "relative" }, children: [
+      w && /* @__PURE__ */ u(
         "button",
         {
-          onClick: () => b(null),
+          onClick: () => y(null),
           style: { position: "absolute", top: 12, left: 12, zIndex: 10, background: "none", border: "none", fontSize: 22, cursor: "pointer", color: "#1c1b1a" },
           children: "←"
         }
       ),
-      /* @__PURE__ */ p("div", { ref: i, style: { width: "100%", height: "100%" } })
-    ] }) : /* @__PURE__ */ p("div", { style: { flex: 1, display: a ? "none" : "flex", alignItems: "center", justifyContent: "center", color: "#9b9690", fontSize: 14 }, children: "Select a conversation" })
+      /* @__PURE__ */ u("div", { ref: v, style: { width: "100%", height: "100%" } })
+    ] }) : /* @__PURE__ */ u("div", { style: { flex: 1, display: w ? "none" : "flex", alignItems: "center", justifyContent: "center", color: "#9b9690", fontSize: 14 }, children: "Select a conversation" })
   ] });
 }
-function J({
-  url: g,
-  apiUrl: l,
-  profileId: v,
-  token: d,
-  refreshToken: w,
-  userId: n,
-  userName: c,
-  userEmail: s,
-  scope: f,
+function Q({
+  url: a,
+  apiUrl: n,
+  profileId: r,
+  tenantId: t,
+  token: l,
+  refreshToken: o,
+  userId: c,
+  userName: p,
+  userEmail: b,
+  scope: m,
   accent: x = "#4F63F5",
-  floating: y = !0,
-  position: R = "bottom-right",
-  label: t,
-  panelWidth: b,
-  panelHeight: h = "600px"
+  floating: C = !0,
+  position: M = "bottom-right",
+  label: j,
+  panelWidth: e,
+  panelHeight: y = "600px"
 }) {
-  const [i, u] = D(!1), m = M(null), a = R === "bottom-right", r = t ?? (y ? "💬" : "Messages");
-  if (z(() => {
-    const S = (F) => {
-      F.key === "Escape" && u(!1);
+  const [d, v] = D(!1), f = $(null), g = M === "bottom-right", h = j ?? (C ? "💬" : "Messages"), i = B(479);
+  if (_(() => {
+    const S = (O) => {
+      O.key === "Escape" && v(!1);
     };
     return document.addEventListener("keydown", S), () => document.removeEventListener("keydown", S);
-  }, []), y) {
-    const S = typeof window < "u" && window.innerWidth < 480, F = S ? "100vw" : b ?? "420px", E = S ? "100dvh" : h;
-    return /* @__PURE__ */ W("div", { style: {
+  }, []), C)
+    return /* @__PURE__ */ L("div", { style: {
       position: "fixed",
-      [a ? "right" : "left"]: "20px",
+      [g ? "right" : "left"]: "20px",
       bottom: "20px",
       zIndex: 9999,
       display: "flex",
       flexDirection: "column",
-      alignItems: a ? "flex-end" : "flex-start",
+      alignItems: g ? "flex-end" : "flex-start",
       gap: "12px"
     }, children: [
-      /* @__PURE__ */ p("div", { style: {
-        width: F,
-        height: E,
-        borderRadius: S ? "0" : "16px",
+      /* @__PURE__ */ u("div", { style: {
+        ...i ? {
+          position: "fixed",
+          inset: 0,
+          width: "100%",
+          height: "100dvh",
+          borderRadius: "0",
+          zIndex: 9998
+        } : {
+          width: `min(${e ?? "420px"}, calc(100vw - 40px))`,
+          height: `min(${y}, calc(100dvh - 108px))`,
+          borderRadius: "16px"
+        },
         overflow: "hidden",
-        boxShadow: "0 8px 40px rgba(0,0,0,.18)",
+        boxShadow: i ? "none" : "0 8px 40px rgba(0,0,0,.18)",
         background: "#fff",
-        display: i ? "flex" : "none",
+        display: d ? "flex" : "none",
         flexDirection: "column",
-        transformOrigin: `bottom ${a ? "right" : "left"}`,
-        animation: i ? "ocl-pop-in .18s ease" : "none"
-      }, children: /* @__PURE__ */ p(
-        B,
+        transformOrigin: `bottom ${g ? "right" : "left"}`,
+        animation: d ? "ocl-pop-in .18s ease" : "none"
+      }, children: /* @__PURE__ */ u(
+        A,
         {
-          url: g,
-          ...l ? { apiUrl: l } : {},
-          profileId: v,
-          ...d ? { token: d } : {},
-          ...w ? { refreshToken: w } : {},
-          ...n ? { userId: n } : {},
-          ...c ? { userName: c } : {},
-          ...s ? { userEmail: s } : {},
-          ...f ? { scope: f } : {},
+          url: a,
+          ...n ? { apiUrl: n } : {},
+          ...r ? { profileId: r } : {},
+          ...t ? { tenantId: t } : {},
+          ...l ? { token: l } : {},
+          ...o ? { refreshToken: o } : {},
+          ...c ? { userId: c } : {},
+          ...p ? { userName: p } : {},
+          ...b ? { userEmail: b } : {},
+          ...m ? { scope: m } : {},
           accent: x,
           height: "100%"
         }
       ) }),
-      /* @__PURE__ */ p(
+      /* @__PURE__ */ u(
         "button",
         {
-          ref: m,
-          onClick: () => u((_) => !_),
+          ref: f,
+          onClick: () => v((S) => !S),
           style: {
             width: "56px",
             height: "56px",
@@ -329,35 +360,34 @@ function J({
             boxShadow: "0 4px 16px rgba(0,0,0,.25)",
             transition: "transform .15s"
           },
-          onMouseEnter: (_) => {
-            _.target.style.transform = "scale(1.08)";
+          onMouseEnter: (S) => {
+            S.target.style.transform = "scale(1.08)";
           },
-          onMouseLeave: (_) => {
-            _.target.style.transform = "scale(1)";
+          onMouseLeave: (S) => {
+            S.target.style.transform = "scale(1)";
           },
-          children: i ? "✕" : r
+          children: d ? "✕" : h
         }
       ),
-      /* @__PURE__ */ p("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
+      /* @__PURE__ */ u("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
     ] });
-  }
-  const o = b ?? "420px", [e, j] = D(null), $ = () => {
-    !i && m.current && j(m.current.getBoundingClientRect()), u((S) => !S);
-  }, L = e ? e.bottom + 8 : 0, A = e ? window.innerWidth - e.right : 0;
-  return /* @__PURE__ */ W(k, { children: [
-    /* @__PURE__ */ W(
+  const s = `min(${e ?? "420px"}, calc(100vw - 16px))`, [R, z] = D(null), H = () => {
+    !d && f.current && z(f.current.getBoundingClientRect()), v((S) => !S);
+  }, k = R ? R.bottom + 8 : 0, E = R ? Math.max(8, window.innerWidth - R.right) : 0;
+  return /* @__PURE__ */ L(F, { children: [
+    /* @__PURE__ */ L(
       "button",
       {
-        ref: m,
-        onClick: $,
+        ref: f,
+        onClick: H,
         style: {
           display: "inline-flex",
           alignItems: "center",
           gap: "6px",
           padding: "8px 16px",
           borderRadius: "8px",
-          background: i ? x : "transparent",
-          color: i ? "#fff" : x,
+          background: d ? x : "transparent",
+          color: d ? "#fff" : x,
           border: `2px solid ${x}`,
           fontSize: "14px",
           fontWeight: 600,
@@ -366,54 +396,62 @@ function J({
         },
         children: [
           "💬 ",
-          r
+          h
         ]
       }
     ),
-    i && e && /* @__PURE__ */ W(k, { children: [
-      /* @__PURE__ */ p(
+    d && R && /* @__PURE__ */ L(F, { children: [
+      /* @__PURE__ */ u(
         "div",
         {
-          onClick: () => u(!1),
+          onClick: () => v(!1),
           style: { position: "fixed", inset: 0, zIndex: 9998 }
         }
       ),
-      /* @__PURE__ */ p("div", { style: {
+      /* @__PURE__ */ u("div", { style: {
         position: "fixed",
-        top: L,
-        right: A,
-        width: o,
-        height: h,
-        borderRadius: "16px",
+        ...i ? {
+          inset: 0,
+          width: "100%",
+          height: "100dvh",
+          borderRadius: "0"
+        } : {
+          top: k,
+          right: E,
+          width: s,
+          height: `min(${y}, calc(100dvh - ${k}px - 12px))`,
+          borderRadius: "16px"
+        },
         overflow: "hidden",
-        boxShadow: "0 8px 40px rgba(0,0,0,.2)",
+        boxShadow: i ? "none" : "0 8px 40px rgba(0,0,0,.2)",
         background: "#fff",
         zIndex: 9999,
         animation: "ocl-slide-in .18s ease"
-      }, children: /* @__PURE__ */ p(
-        B,
+      }, children: /* @__PURE__ */ u(
+        A,
         {
-          url: g,
-          ...l ? { apiUrl: l } : {},
-          profileId: v,
-          ...d ? { token: d } : {},
-          ...w ? { refreshToken: w } : {},
-          ...n ? { userId: n } : {},
-          ...c ? { userName: c } : {},
-          ...s ? { userEmail: s } : {},
-          ...f ? { scope: f } : {},
+          url: a,
+          ...n ? { apiUrl: n } : {},
+          ...r ? { profileId: r } : {},
+          ...t ? { tenantId: t } : {},
+          ...l ? { token: l } : {},
+          ...o ? { refreshToken: o } : {},
+          ...c ? { userId: c } : {},
+          ...p ? { userName: p } : {},
+          ...b ? { userEmail: b } : {},
+          ...m ? { scope: m } : {},
           accent: x,
           height: "100%"
         }
       ) }),
-      /* @__PURE__ */ p("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
+      /* @__PURE__ */ u("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
     ] })
   ] });
 }
 export {
-  B as ChatApp,
-  J as ChatAppLauncher,
-  P as ChatWidget,
-  G as MarketplaceChat
+  A as ChatApp,
+  Q as ChatAppLauncher,
+  J as ChatWidget,
+  P as MarketplaceChat
 };
 //# sourceMappingURL=react.js.map