@paramms/chat-widget 1.0.37 → 1.0.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/react.js CHANGED
@@ -1,266 +1,284 @@
1
- import { jsxs as B, jsx as f, Fragment as O } from "react/jsx-runtime";
2
- import { useState as D, useRef as $, useEffect as F } from "react";
3
- import { mount as W } from "./index.js";
4
- function P({
5
- url: h,
6
- apiUrl: n,
7
- profileId: l,
8
- token: e,
9
- refreshToken: o,
10
- userId: i,
11
- userName: c,
12
- userEmail: a,
13
- userAvatar: m,
14
- contextTitle: v,
1
+ import { jsxs as k, jsx as e, Fragment as O } from "react/jsx-runtime";
2
+ import { useState as _, useRef as z, useEffect as D } from "react";
3
+ import { mount as A } from "./index.js";
4
+ function G({ size: o = 26 }) {
5
+ 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(
6
+ "path",
7
+ {
8
+ 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",
9
+ fill: "currentColor",
10
+ stroke: "currentColor",
11
+ strokeWidth: "2",
12
+ strokeLinecap: "round",
13
+ strokeLinejoin: "round"
14
+ }
15
+ ) });
16
+ }
17
+ function Y({ size: o = 22 }) {
18
+ 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" }) });
19
+ }
20
+ function V({
21
+ url: o,
22
+ apiUrl: i,
23
+ profileId: d,
24
+ token: n,
25
+ refreshToken: r,
26
+ userId: l,
27
+ userName: s,
28
+ userEmail: h,
29
+ userAvatar: v,
30
+ contextTitle: m,
15
31
  contextSubtitle: u,
16
32
  contextStatus: b,
17
- subjectId: C,
18
- accent: j,
33
+ subjectId: L,
34
+ accent: C,
19
35
  launcher: x,
20
36
  position: t,
21
- quickReplies: p,
22
- height: g = "100%",
23
- i18n: R,
24
- translateLang: w,
25
- inbox: M,
26
- inboxScope: S
37
+ launcherMessage: f,
38
+ quickReplies: a,
39
+ height: M = "100%",
40
+ i18n: w,
41
+ translateLang: R,
42
+ inbox: p,
43
+ inboxScope: j
27
44
  }) {
28
- const d = $(null), r = $(null), [s, L] = D(!1);
29
- return F(() => {
30
- var _;
31
- if (!s && d.current)
32
- return (_ = r.current) == null || _.close(), r.current = W({
33
- el: d.current,
34
- url: h,
35
- ...n ? { apiUrl: n } : {},
36
- profileId: l,
37
- ...C ? { subjectId: C } : {},
38
- ...e ? { token: e } : {},
39
- ...o ? { refreshToken: o } : {},
40
- ...i ? { userId: i } : {},
41
- ...i || c || a || m ? {
45
+ const c = z(null), g = z(null), [S, $] = _(!1);
46
+ return D(() => {
47
+ var B;
48
+ if (!S && c.current)
49
+ return (B = g.current) == null || B.close(), g.current = A({
50
+ el: c.current,
51
+ url: o,
52
+ ...i ? { apiUrl: i } : {},
53
+ profileId: d,
54
+ ...L ? { subjectId: L } : {},
55
+ ...n ? { token: n } : {},
56
+ ...r ? { refreshToken: r } : {},
57
+ ...l ? { userId: l } : {},
58
+ ...l || s || h || v ? {
42
59
  user: {
43
- ...c ? { name: c } : {},
44
- ...a ? { email: a } : {},
45
- ...m ? { avatar: m } : {}
60
+ ...s ? { name: s } : {},
61
+ ...h ? { email: h } : {},
62
+ ...v ? { avatar: v } : {}
46
63
  }
47
64
  } : {},
48
- ...v ? {
65
+ ...m ? {
49
66
  subject: {
50
- title: v,
67
+ title: m,
51
68
  ...u ? { subtitle: u } : {},
52
69
  ...b ? { status: b } : {}
53
70
  }
54
71
  } : {},
55
- ...p ? { quickReplies: p } : {},
56
- ...j ? { accent: j } : {},
57
- ...w ? { translateLang: w } : {},
58
- ...R ? { i18n: R } : {},
59
- ...M && !x ? { onBack: () => L(!0) } : {},
60
- ...x ? { launcher: x, position: t ?? "bottom-right" } : {}
72
+ ...a ? { quickReplies: a } : {},
73
+ ...C ? { accent: C } : {},
74
+ ...R ? { translateLang: R } : {},
75
+ ...w ? { i18n: w } : {},
76
+ ...p && !x ? { onBack: () => $(!0) } : {},
77
+ ...x ? { launcher: x, position: t ?? "bottom-right", ...f ? { launcherMessage: f } : {} } : {}
61
78
  }), () => {
62
- var z;
63
- (z = r.current) == null || z.close(), r.current = null;
79
+ var y;
80
+ (y = g.current) == null || y.close(), g.current = null;
64
81
  };
65
- }, [h, n, l, C, e, i, c, a, j, x, t, w, M, s]), M && !x && s ? /* @__PURE__ */ f(
66
- H,
82
+ }, [o, i, d, L, n, l, s, h, C, x, t, f, R, p, S]), p && !x && S ? /* @__PURE__ */ e(
83
+ F,
67
84
  {
68
- url: h,
69
- ...n ? { apiUrl: n } : {},
70
- profileId: l,
71
- ...e ? { token: e } : {},
72
- ...o ? { refreshToken: o } : {},
73
- ...i ? { userId: i } : {},
74
- ...c ? { userName: c } : {},
75
- ...a ? { userEmail: a } : {},
76
- ...j ? { accent: j } : {},
77
- scope: S ?? "tenant",
78
- height: g,
79
- onClose: () => L(!1)
85
+ url: o,
86
+ ...i ? { apiUrl: i } : {},
87
+ profileId: d,
88
+ ...n ? { token: n } : {},
89
+ ...r ? { refreshToken: r } : {},
90
+ ...l ? { userId: l } : {},
91
+ ...s ? { userName: s } : {},
92
+ ...h ? { userEmail: h } : {},
93
+ ...C ? { accent: C } : {},
94
+ scope: j ?? "tenant",
95
+ height: M,
96
+ onClose: () => $(!1)
80
97
  }
81
- ) : /* @__PURE__ */ f(
98
+ ) : /* @__PURE__ */ e(
82
99
  "div",
83
100
  {
84
- ref: d,
85
- style: x ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: g, minHeight: g === "100%" ? "480px" : void 0 }
101
+ ref: c,
102
+ style: x ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: M, minHeight: M === "100%" ? "480px" : void 0 }
86
103
  }
87
104
  );
88
105
  }
89
- const k = [
106
+ const q = [
90
107
  "Is this still available?",
91
108
  "Can I schedule a viewing?",
92
109
  "What is your best price?"
93
110
  ];
94
- function Q({
95
- url: h,
96
- apiUrl: n,
97
- profileId: l,
98
- token: e,
99
- refreshToken: o,
100
- listingId: i,
101
- listingTitle: c,
102
- listingMeta: a,
103
- listingPrice: m,
104
- listingStatus: v,
111
+ function X({
112
+ url: o,
113
+ apiUrl: i,
114
+ profileId: d,
115
+ token: n,
116
+ refreshToken: r,
117
+ listingId: l,
118
+ listingTitle: s,
119
+ listingMeta: h,
120
+ listingPrice: v,
121
+ listingStatus: m,
105
122
  userId: u,
106
123
  userName: b,
107
- userEmail: C,
108
- userAvatar: j,
124
+ userEmail: L,
125
+ userAvatar: C,
109
126
  accent: x,
110
127
  launcher: t,
111
- position: p,
112
- quickReplies: g,
113
- height: R = "100%",
114
- i18n: w,
115
- translateLang: M,
116
- inbox: S,
117
- inboxScope: d
128
+ position: f,
129
+ launcherMessage: a,
130
+ quickReplies: M,
131
+ height: w = "100%",
132
+ i18n: R,
133
+ translateLang: p,
134
+ inbox: j,
135
+ inboxScope: c
118
136
  }) {
119
- const r = $(null), s = $(null), [L, _] = D(!1);
120
- return F(() => {
121
- if (L || !r.current) return;
122
- let z = !1;
123
- const A = setTimeout(() => {
124
- var y;
125
- z || !r.current || ((y = s.current) == null || y.close(), s.current = W({
126
- el: r.current,
127
- url: h,
128
- ...n ? { apiUrl: n } : {},
129
- profileId: l,
130
- ...i ? { subjectId: `listing_${i}` } : {},
131
- ...e ? { token: e } : {},
132
- ...o ? { refreshToken: o } : {},
137
+ const g = z(null), S = z(null), [$, B] = _(!1);
138
+ return D(() => {
139
+ if ($ || !g.current) return;
140
+ let y = !1;
141
+ const H = setTimeout(() => {
142
+ var W;
143
+ y || !g.current || ((W = S.current) == null || W.close(), S.current = A({
144
+ el: g.current,
145
+ url: o,
146
+ ...i ? { apiUrl: i } : {},
147
+ profileId: d,
148
+ ...l ? { subjectId: `listing_${l}` } : {},
149
+ ...n ? { token: n } : {},
150
+ ...r ? { refreshToken: r } : {},
133
151
  ...u ? { userId: u } : {},
134
- ...u || b || C || j ? {
152
+ ...u || b || L || C ? {
135
153
  user: {
136
154
  ...b ? { name: b } : {},
137
- ...C ? { email: C } : {},
138
- ...j ? { avatar: j } : {},
139
- ...i ? { meta: { listingId: i } } : {}
155
+ ...L ? { email: L } : {},
156
+ ...C ? { avatar: C } : {},
157
+ ...l ? { meta: { listingId: l } } : {}
140
158
  }
141
159
  } : {},
142
- ...c ? {
160
+ ...s ? {
143
161
  subject: {
144
- title: c,
145
- ...a ? { subtitle: a } : {},
146
- ...m ? { tags: [`$${m.toLocaleString()}`] } : {},
147
- ...v ? { status: v } : {}
162
+ title: s,
163
+ ...h ? { subtitle: h } : {},
164
+ ...v ? { tags: [`$${v.toLocaleString()}`] } : {},
165
+ ...m ? { status: m } : {}
148
166
  }
149
167
  } : {},
150
- quickReplies: g ?? k,
168
+ quickReplies: M ?? q,
151
169
  ...x ? { accent: x } : {},
152
- ...M ? { translateLang: M } : {},
153
- ...w ? { i18n: w } : {},
154
- ...S && !t ? { onBack: () => _(!0) } : {},
155
- ...t ? { launcher: t, position: p ?? "bottom-right" } : {}
170
+ ...p ? { translateLang: p } : {},
171
+ ...R ? { i18n: R } : {},
172
+ ...j && !t ? { onBack: () => B(!0) } : {},
173
+ ...t ? { launcher: t, position: f ?? "bottom-right", ...a ? { launcherMessage: a } : {} } : {}
156
174
  }));
157
175
  }, 0);
158
176
  return () => {
159
- var y;
160
- z = !0, clearTimeout(A), (y = s.current) == null || y.close(), s.current = null;
177
+ var W;
178
+ y = !0, clearTimeout(H), (W = S.current) == null || W.close(), S.current = null;
161
179
  };
162
- }, [h, n, l, i, e, u, x, t, p, M, S, L]), S && !t && L ? /* @__PURE__ */ f(
163
- H,
180
+ }, [o, i, d, l, n, u, x, t, f, a, p, j, $]), j && !t && $ ? /* @__PURE__ */ e(
181
+ F,
164
182
  {
165
- url: h,
166
- ...n ? { apiUrl: n } : {},
167
- profileId: l,
168
- ...e ? { token: e } : {},
169
- ...o ? { refreshToken: o } : {},
183
+ url: o,
184
+ ...i ? { apiUrl: i } : {},
185
+ profileId: d,
186
+ ...n ? { token: n } : {},
187
+ ...r ? { refreshToken: r } : {},
170
188
  ...u ? { userId: u } : {},
171
189
  ...b ? { userName: b } : {},
172
- ...C ? { userEmail: C } : {},
190
+ ...L ? { userEmail: L } : {},
173
191
  ...x ? { accent: x } : {},
174
- scope: d ?? "tenant",
175
- height: R,
176
- onClose: () => _(!1)
192
+ scope: c ?? "tenant",
193
+ height: w,
194
+ onClose: () => B(!1)
177
195
  }
178
- ) : /* @__PURE__ */ f(
196
+ ) : /* @__PURE__ */ e(
179
197
  "div",
180
198
  {
181
- ref: r,
182
- style: t ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: R, minHeight: R === "100%" ? "480px" : void 0 }
199
+ ref: g,
200
+ style: t ? { width: 0, height: 0, overflow: "hidden" } : { width: "100%", height: w, minHeight: w === "100%" ? "480px" : void 0 }
183
201
  }
184
202
  );
185
203
  }
186
- function q(h) {
187
- const [n, l] = D(
188
- typeof window < "u" && window.innerWidth <= h
204
+ function K(o) {
205
+ const [i, d] = _(
206
+ typeof window < "u" && window.innerWidth <= o
189
207
  );
190
- return F(() => {
208
+ return D(() => {
191
209
  if (typeof window > "u" || !window.matchMedia) return;
192
- const e = window.matchMedia(`(max-width: ${h}px)`), o = (i) => l(i.matches);
193
- return l(e.matches), e.addEventListener("change", o), () => e.removeEventListener("change", o);
194
- }, [h]), n;
210
+ const n = window.matchMedia(`(max-width: ${o}px)`), r = (l) => d(l.matches);
211
+ return d(n.matches), n.addEventListener("change", r), () => n.removeEventListener("change", r);
212
+ }, [o]), i;
195
213
  }
196
- function H({
197
- url: h,
198
- apiUrl: n,
199
- profileId: l,
200
- tenantId: e,
201
- token: o,
202
- refreshToken: i,
203
- userId: c,
204
- userName: a,
205
- userEmail: m,
206
- accent: v,
214
+ function F({
215
+ url: o,
216
+ apiUrl: i,
217
+ profileId: d,
218
+ tenantId: n,
219
+ token: r,
220
+ refreshToken: l,
221
+ userId: s,
222
+ userName: h,
223
+ userEmail: v,
224
+ accent: m,
207
225
  height: u = "100%",
208
226
  i18n: b,
209
- onClose: C,
210
- scope: j = "tenant"
227
+ onClose: L,
228
+ scope: C = "tenant"
211
229
  }) {
212
- const x = !l && !e, [t, p] = D(null), g = $(null), R = $(null), w = $(null), M = $(null);
213
- return F(() => {
214
- if (!g.current) return;
215
- let S = !1;
216
- return import("./chatlist.js").then(({ mountChatList: d }) => {
217
- S || !g.current || (w.current = d({
218
- el: g.current,
219
- url: h,
220
- ...n ? { apiUrl: n } : {},
221
- ...l ? { profileId: l } : {},
222
- ...e ? { tenantId: e } : {},
223
- scope: j,
224
- onSelect: (r) => p(r),
230
+ const x = !d && !n, [t, f] = _(null), a = z(null), M = z(null), w = z(null), R = z(null);
231
+ return D(() => {
232
+ if (!a.current) return;
233
+ let p = !1;
234
+ return import("./chatlist.js").then(({ mountChatList: j }) => {
235
+ p || !a.current || (w.current = j({
236
+ el: a.current,
237
+ url: o,
238
+ ...i ? { apiUrl: i } : {},
239
+ ...d ? { profileId: d } : {},
240
+ ...n ? { tenantId: n } : {},
241
+ scope: C,
242
+ onSelect: (c) => f(c),
225
243
  // Compose (✎) opens the chatroom's general support thread — without
226
244
  // this a user with no conversations yet had an empty list and no way
227
245
  // to ever start one, which is what made ChatApp feel broken.
228
246
  // Compose target: the configured chatroom, else the tenant's default
229
247
  // (oldest chatroom, reported by the server on the first list fetch).
230
248
  onNewChat: () => {
231
- var s;
232
- const r = (s = w.current) == null ? void 0 : s.defaultProfileId();
233
- r && p({ id: "__new__", profileId: r, state: "open", updatedAt: Date.now() });
249
+ var g;
250
+ const c = (g = w.current) == null ? void 0 : g.defaultProfileId();
251
+ c && f({ id: "__new__", profileId: c, state: "open", updatedAt: Date.now() });
234
252
  },
235
- ...o ? { token: o } : {},
236
- ...c ? { userId: c } : {},
237
- ...v ? { accent: v } : {},
253
+ ...r ? { token: r } : {},
254
+ ...s ? { userId: s } : {},
255
+ ...m ? { accent: m } : {},
238
256
  ...b ? { i18n: b } : {}
239
257
  }));
240
258
  }), () => {
241
- var d;
242
- S = !0, (d = w.current) == null || d.close(), w.current = null;
259
+ var j;
260
+ p = !0, (j = w.current) == null || j.close(), w.current = null;
243
261
  };
244
- }, [h, n, l, e, o, c, j]), F(() => {
245
- var d;
246
- if (!R.current || !t) return;
247
- (d = M.current) == null || d.close(), M.current = W({
248
- el: R.current,
249
- url: h,
250
- ...n ? { apiUrl: n } : {},
251
- profileId: t.profileId ?? l,
262
+ }, [o, i, d, n, r, s, C]), D(() => {
263
+ var j;
264
+ if (!M.current || !t) return;
265
+ (j = R.current) == null || j.close(), R.current = A({
266
+ el: M.current,
267
+ url: o,
268
+ ...i ? { apiUrl: i } : {},
269
+ profileId: t.profileId ?? d,
252
270
  // rows always carry theirs; compose sets one explicitly
253
271
  // DM rows open as direct conversations (kind + peer). Opening them via
254
272
  // their dm:… subjectId only works for the participant that OWNS the
255
273
  // thread key — the other side would silently fork a duplicate.
256
274
  ...t.kind === "direct" && t.peerId ? { kind: "direct", peerId: t.peerId } : t.subjectId ? { subjectId: t.subjectId } : {},
257
- ...o ? { token: o } : {},
258
- ...i ? { refreshToken: i } : {},
259
- ...c ? { userId: c } : {},
260
- ...c || a || m ? {
275
+ ...r ? { token: r } : {},
276
+ ...l ? { refreshToken: l } : {},
277
+ ...s ? { userId: s } : {},
278
+ ...s || h || v ? {
261
279
  user: {
262
- ...a ? { name: a } : {},
263
- ...m ? { email: m } : {}
280
+ ...h ? { name: h } : {},
281
+ ...v ? { email: v } : {}
264
282
  }
265
283
  } : {},
266
284
  ...t.subjectTitle ? {
@@ -269,29 +287,29 @@ function H({
269
287
  ...t.subjectMeta ? { subtitle: t.subjectMeta } : {}
270
288
  }
271
289
  } : {},
272
- ...v ? { accent: v } : {},
290
+ ...m ? { accent: m } : {},
273
291
  // Stack navigation: the chatroom's back chevron returns to the list.
274
- onBack: () => p(null)
292
+ onBack: () => f(null)
275
293
  });
276
- const S = setInterval(() => {
277
- var r;
278
- return (r = w.current) == null ? void 0 : r.refresh();
294
+ const p = setInterval(() => {
295
+ var c;
296
+ return (c = w.current) == null ? void 0 : c.refresh();
279
297
  }, 2e4);
280
298
  return () => {
281
- var r, s;
282
- clearInterval(S), (r = M.current) == null || r.close(), M.current = null, (s = w.current) == null || s.refresh();
299
+ var c, g;
300
+ clearInterval(p), (c = R.current) == null || c.close(), R.current = null, (g = w.current) == null || g.refresh();
283
301
  };
284
- }, [t == null ? void 0 : t.id]), x ? /* @__PURE__ */ B("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
302
+ }, [t == null ? void 0 : t.id]), x ? /* @__PURE__ */ k("div", { style: { padding: 16, font: "13px system-ui", color: "#b91c1c", background: "#fef2f2", borderRadius: 8 }, children: [
285
303
  "[relay] <ChatApp/> needs a ",
286
- /* @__PURE__ */ f("code", { children: "profileId" }),
304
+ /* @__PURE__ */ e("code", { children: "profileId" }),
287
305
  " or a ",
288
- /* @__PURE__ */ f("code", { children: "tenantId" }),
306
+ /* @__PURE__ */ e("code", { children: "tenantId" }),
289
307
  "."
290
- ] }) : /* @__PURE__ */ B("div", { style: { position: "relative", width: "100%", height: u, minHeight: "400px", overflow: "hidden", background: "#fff" }, children: [
291
- C && !t && /* @__PURE__ */ f(
308
+ ] }) : /* @__PURE__ */ k("div", { style: { position: "relative", width: "100%", height: u, minHeight: "400px", overflow: "hidden", background: "#fff" }, children: [
309
+ L && !t && /* @__PURE__ */ e(
292
310
  "button",
293
311
  {
294
- onClick: C,
312
+ onClick: L,
295
313
  "aria-label": (b == null ? void 0 : b.close) ?? "Close",
296
314
  style: {
297
315
  position: "absolute",
@@ -311,44 +329,44 @@ function H({
311
329
  lineHeight: 1,
312
330
  cursor: "pointer"
313
331
  },
314
- children: "✕"
332
+ children: /* @__PURE__ */ e(Y, { size: 18 })
315
333
  }
316
334
  ),
317
- /* @__PURE__ */ f("div", { style: {
335
+ /* @__PURE__ */ e("div", { style: {
318
336
  position: "absolute",
319
337
  inset: 0,
320
338
  display: t ? "none" : "flex",
321
339
  flexDirection: "column"
322
- }, children: /* @__PURE__ */ f("div", { ref: g, style: { width: "100%", height: "100%" } }) }),
323
- t && /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ f("div", { ref: R, style: { width: "100%", height: "100%" } }) })
340
+ }, children: /* @__PURE__ */ e("div", { ref: a, style: { width: "100%", height: "100%" } }) }),
341
+ t && /* @__PURE__ */ e("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column" }, children: /* @__PURE__ */ e("div", { ref: M, style: { width: "100%", height: "100%" } }) })
324
342
  ] });
325
343
  }
326
- function V({
327
- url: h,
328
- apiUrl: n,
329
- profileId: l,
330
- tenantId: e,
331
- token: o,
332
- refreshToken: i,
333
- userId: c,
334
- userName: a,
335
- userEmail: m,
336
- scope: v,
344
+ function Z({
345
+ url: o,
346
+ apiUrl: i,
347
+ profileId: d,
348
+ tenantId: n,
349
+ token: r,
350
+ refreshToken: l,
351
+ userId: s,
352
+ userName: h,
353
+ userEmail: v,
354
+ scope: m,
337
355
  accent: u = "#4F63F5",
338
356
  floating: b = !0,
339
- position: C = "bottom-right",
340
- label: j,
357
+ position: L = "bottom-right",
358
+ label: C,
341
359
  panelWidth: x,
342
360
  panelHeight: t = "600px"
343
361
  }) {
344
- const [p, g] = D(!1), R = $(null), w = C === "bottom-right", S = j ?? (b ? "💬" : "Messages"), d = q(479);
345
- if (F(() => {
346
- const y = (Y) => {
347
- Y.key === "Escape" && g(!1);
362
+ const [f, a] = _(!1), M = z(null), w = L === "bottom-right", R = C ?? (b ? void 0 : "Messages"), p = K(479);
363
+ if (D(() => {
364
+ const y = (H) => {
365
+ H.key === "Escape" && a(!1);
348
366
  };
349
367
  return document.addEventListener("keydown", y), () => document.removeEventListener("keydown", y);
350
368
  }, []), b)
351
- return /* @__PURE__ */ B("div", { style: {
369
+ return /* @__PURE__ */ k("div", { style: {
352
370
  position: "fixed",
353
371
  [w ? "right" : "left"]: "20px",
354
372
  bottom: "20px",
@@ -358,8 +376,8 @@ function V({
358
376
  alignItems: w ? "flex-end" : "flex-start",
359
377
  gap: "12px"
360
378
  }, children: [
361
- /* @__PURE__ */ f("div", { style: {
362
- ...d ? {
379
+ /* @__PURE__ */ e("div", { style: {
380
+ ...p ? {
363
381
  position: "fixed",
364
382
  inset: 0,
365
383
  width: "100%",
@@ -372,35 +390,37 @@ function V({
372
390
  borderRadius: "16px"
373
391
  },
374
392
  overflow: "hidden",
375
- boxShadow: d ? "none" : "0 8px 40px rgba(0,0,0,.18)",
393
+ boxShadow: p ? "none" : "0 8px 40px rgba(0,0,0,.18)",
376
394
  background: "#fff",
377
- display: p ? "flex" : "none",
395
+ display: f ? "flex" : "none",
378
396
  flexDirection: "column",
379
397
  transformOrigin: `bottom ${w ? "right" : "left"}`,
380
- animation: p ? "ocl-pop-in .18s ease" : "none"
381
- }, children: /* @__PURE__ */ f(
382
- H,
398
+ animation: f ? "ocl-pop-in .18s ease" : "none"
399
+ }, children: /* @__PURE__ */ e(
400
+ F,
383
401
  {
384
- url: h,
385
- ...n ? { apiUrl: n } : {},
386
- ...l ? { profileId: l } : {},
387
- ...e ? { tenantId: e } : {},
388
- ...o ? { token: o } : {},
389
- ...i ? { refreshToken: i } : {},
390
- ...c ? { userId: c } : {},
391
- ...a ? { userName: a } : {},
392
- ...m ? { userEmail: m } : {},
393
- ...v ? { scope: v } : {},
402
+ url: o,
403
+ ...i ? { apiUrl: i } : {},
404
+ ...d ? { profileId: d } : {},
405
+ ...n ? { tenantId: n } : {},
406
+ ...r ? { token: r } : {},
407
+ ...l ? { refreshToken: l } : {},
408
+ ...s ? { userId: s } : {},
409
+ ...h ? { userName: h } : {},
410
+ ...v ? { userEmail: v } : {},
411
+ ...m ? { scope: m } : {},
394
412
  accent: u,
395
413
  height: "100%",
396
- onClose: () => g(!1)
414
+ onClose: () => a(!1)
397
415
  }
398
416
  ) }),
399
- /* @__PURE__ */ f(
417
+ /* @__PURE__ */ e(
400
418
  "button",
401
419
  {
402
- ref: R,
403
- onClick: () => g((y) => !y),
420
+ ref: M,
421
+ onClick: () => a((y) => !y),
422
+ "aria-label": f ? "Close chat" : typeof R == "string" ? R : "Open chat",
423
+ "aria-expanded": f,
404
424
  style: {
405
425
  width: "56px",
406
426
  height: "56px",
@@ -408,41 +428,43 @@ function V({
408
428
  background: u,
409
429
  color: "#fff",
410
430
  border: "none",
411
- fontSize: "24px",
431
+ fontSize: "20px",
412
432
  cursor: "pointer",
413
433
  flexShrink: 0,
414
434
  boxShadow: "0 4px 16px rgba(0,0,0,.25)",
415
435
  transition: "transform .15s",
416
- display: p && d ? "none" : "block"
436
+ alignItems: "center",
437
+ justifyContent: "center",
438
+ display: f && p ? "none" : "flex"
417
439
  },
418
440
  onMouseEnter: (y) => {
419
- y.target.style.transform = "scale(1.08)";
441
+ y.currentTarget.style.transform = "scale(1.08)";
420
442
  },
421
443
  onMouseLeave: (y) => {
422
- y.target.style.transform = "scale(1)";
444
+ y.currentTarget.style.transform = "scale(1)";
423
445
  },
424
- children: p ? "✕" : S
446
+ children: f ? /* @__PURE__ */ e(Y, {}) : C ?? /* @__PURE__ */ e(G, {})
425
447
  }
426
448
  ),
427
- /* @__PURE__ */ f("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
449
+ /* @__PURE__ */ e("style", { children: "@keyframes ocl-pop-in { from { opacity:0; transform:scale(.95) } to { opacity:1; transform:scale(1) } }" })
428
450
  ] });
429
- const r = `min(${x ?? "420px"}, calc(100vw - 16px))`, [s, L] = D(null), _ = () => {
430
- !p && R.current && L(R.current.getBoundingClientRect()), g((y) => !y);
431
- }, z = s ? s.bottom + 8 : 0, A = s ? Math.max(8, window.innerWidth - s.right) : 0;
432
- return /* @__PURE__ */ B(O, { children: [
433
- /* @__PURE__ */ B(
451
+ const j = `min(${x ?? "420px"}, calc(100vw - 16px))`, [c, g] = _(null), S = () => {
452
+ !f && M.current && g(M.current.getBoundingClientRect()), a((y) => !y);
453
+ }, $ = c ? c.bottom + 8 : 0, B = c ? Math.max(8, window.innerWidth - c.right) : 0;
454
+ return /* @__PURE__ */ k(O, { children: [
455
+ /* @__PURE__ */ k(
434
456
  "button",
435
457
  {
436
- ref: R,
437
- onClick: _,
458
+ ref: M,
459
+ onClick: S,
438
460
  style: {
439
461
  display: "inline-flex",
440
462
  alignItems: "center",
441
463
  gap: "6px",
442
464
  padding: "8px 16px",
443
465
  borderRadius: "8px",
444
- background: p ? u : "transparent",
445
- color: p ? "#fff" : u,
466
+ background: f ? u : "transparent",
467
+ color: f ? "#fff" : u,
446
468
  border: `2px solid ${u}`,
447
469
  fontSize: "14px",
448
470
  fontWeight: 600,
@@ -450,64 +472,65 @@ function V({
450
472
  transition: "background .15s, color .15s"
451
473
  },
452
474
  children: [
453
- "💬 ",
454
- S
475
+ /* @__PURE__ */ e(G, { size: 16 }),
476
+ " ",
477
+ R
455
478
  ]
456
479
  }
457
480
  ),
458
- p && s && /* @__PURE__ */ B(O, { children: [
459
- /* @__PURE__ */ f(
481
+ f && c && /* @__PURE__ */ k(O, { children: [
482
+ /* @__PURE__ */ e(
460
483
  "div",
461
484
  {
462
- onClick: () => g(!1),
485
+ onClick: () => a(!1),
463
486
  style: { position: "fixed", inset: 0, zIndex: 9998 }
464
487
  }
465
488
  ),
466
- /* @__PURE__ */ f("div", { style: {
489
+ /* @__PURE__ */ e("div", { style: {
467
490
  position: "fixed",
468
- ...d ? {
491
+ ...p ? {
469
492
  inset: 0,
470
493
  width: "100%",
471
494
  height: "100dvh",
472
495
  borderRadius: "0"
473
496
  } : {
474
- top: z,
475
- right: A,
476
- width: r,
477
- height: `min(${t}, calc(100dvh - ${z}px - 12px))`,
497
+ top: $,
498
+ right: B,
499
+ width: j,
500
+ height: `min(${t}, calc(100dvh - ${$}px - 12px))`,
478
501
  borderRadius: "16px"
479
502
  },
480
503
  overflow: "hidden",
481
- boxShadow: d ? "none" : "0 8px 40px rgba(0,0,0,.2)",
504
+ boxShadow: p ? "none" : "0 8px 40px rgba(0,0,0,.2)",
482
505
  background: "#fff",
483
506
  zIndex: 9999,
484
507
  animation: "ocl-slide-in .18s ease"
485
- }, children: /* @__PURE__ */ f(
486
- H,
508
+ }, children: /* @__PURE__ */ e(
509
+ F,
487
510
  {
488
- url: h,
489
- ...n ? { apiUrl: n } : {},
490
- ...l ? { profileId: l } : {},
491
- ...e ? { tenantId: e } : {},
492
- ...o ? { token: o } : {},
493
- ...i ? { refreshToken: i } : {},
494
- ...c ? { userId: c } : {},
495
- ...a ? { userName: a } : {},
496
- ...m ? { userEmail: m } : {},
497
- ...v ? { scope: v } : {},
511
+ url: o,
512
+ ...i ? { apiUrl: i } : {},
513
+ ...d ? { profileId: d } : {},
514
+ ...n ? { tenantId: n } : {},
515
+ ...r ? { token: r } : {},
516
+ ...l ? { refreshToken: l } : {},
517
+ ...s ? { userId: s } : {},
518
+ ...h ? { userName: h } : {},
519
+ ...v ? { userEmail: v } : {},
520
+ ...m ? { scope: m } : {},
498
521
  accent: u,
499
522
  height: "100%",
500
- onClose: () => g(!1)
523
+ onClose: () => a(!1)
501
524
  }
502
525
  ) }),
503
- /* @__PURE__ */ f("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
526
+ /* @__PURE__ */ e("style", { children: "@keyframes ocl-slide-in { from { opacity:0; transform:translateY(-8px) } to { opacity:1; transform:translateY(0) } }" })
504
527
  ] })
505
528
  ] });
506
529
  }
507
530
  export {
508
- H as ChatApp,
509
- V as ChatAppLauncher,
510
- P as ChatWidget,
511
- Q as MarketplaceChat
531
+ F as ChatApp,
532
+ Z as ChatAppLauncher,
533
+ V as ChatWidget,
534
+ X as MarketplaceChat
512
535
  };
513
536
  //# sourceMappingURL=react.js.map