@sendbird/ai-agent-messenger-react 1.0.0 → 1.1.0

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.
@@ -1,3304 +0,0 @@
1
- import * as n from "react";
2
- import { createContext as _e, useContext as X, useEffect as P, useState as C, useCallback as W, useRef as F, Suspense as Ae, lazy as _, useMemo as ve, Component as er, Fragment as kt, useReducer as tr, useLayoutEffect as ye, forwardRef as nr, useId as rr, Children as or } from "react";
3
- import ar, { SendbirdProduct as sr, DeviceOsPlatform as wt, SendbirdPlatform as ir, SendbirdError as on, SessionHandler as lr, LogLevel as an, ConnectionState as cr, ConnectionHandler as sn } from "@sendbird/chat";
4
- import c, { css as k, ThemeProvider as dr, createGlobalStyle as ur, useTheme as st, StyleSheetManager as mr, keyframes as ln } from "styled-components";
5
- import { format as He, isSameMinute as At, isSameDay as pr } from "date-fns";
6
- import { enUS as gr } from "date-fns/locale/en-US";
7
- import { AIAgentModule as hr, ConversationStatus as j, ConversationType as fr, ConversationListOrder as br } from "@sendbird/chat/aiAgent";
8
- import { renderer as Er, parser as xr, MessageProvider as vr } from "@sendbird/react-uikit-message-template-view";
9
- import { createMessageTemplate as yr } from "@sendbird/uikit-message-template";
10
- import { useGroupChannelMessages as Cr, useForceUpdate as _r, useGroupChannelHandler as cn } from "@sendbird/uikit-tools";
11
- import dn from "dompurify";
12
- import { GroupChannelModule as Tr } from "@sendbird/chat/groupChannel";
13
- import { MessageMetaArray as Sr, SendingStatus as kr } from "@sendbird/chat/message";
14
- import { isSameDay as wr } from "date-fns/isSameDay";
15
- import { createPortal as Ar } from "react-dom";
16
- import Ir from "@emotion/is-prop-valid";
17
- const ee = (e, t) => {
18
- const r = _e(null), o = () => {
19
- const a = X(r);
20
- if (!a)
21
- throw new Error(`use${e}Context must be used within a ${e}Provider`);
22
- return a;
23
- };
24
- return r.displayName = `${e}Context`, o.displayName = `use${e}Context`, [r, o];
25
- };
26
- function it(e) {
27
- const t = _e({
28
- Template: e.template,
29
- updateTemplate: () => {
30
- },
31
- components: e.components,
32
- updateComponent: () => {
33
- }
34
- });
35
- function r({ children: s }) {
36
- const [i, l] = C(() => e.template), [u, m] = C(e.components), g = {
37
- Template: i,
38
- updateTemplate: (p) => l(() => p),
39
- components: u,
40
- updateComponent: (p, h) => m((f) => ({ ...f, [p]: h }))
41
- };
42
- return /* @__PURE__ */ n.createElement(t.Provider, { value: g }, s);
43
- }
44
- function o({ template: s, children: i }) {
45
- const { updateTemplate: l } = X(t);
46
- return P(() => {
47
- s && l(s);
48
- }, [s]), /* @__PURE__ */ n.createElement(n.Fragment, null, i);
49
- }
50
- function a({ children: s }) {
51
- return /* @__PURE__ */ n.createElement(r, null, s);
52
- }
53
- return a.defaults = e, a.useContext = () => X(t), a.Context = t, a.Template = o, Object.keys(e.components).forEach((s) => {
54
- a[s] = function({
55
- component: l
56
- }) {
57
- const { updateComponent: u } = X(t);
58
- return P(() => {
59
- l && u(s, l);
60
- }, [l]), null;
61
- };
62
- }), a;
63
- }
64
- function Mr(...e) {
65
- return function({ children: r }) {
66
- return e.reduce((o, a) => /* @__PURE__ */ n.createElement(a, null, o), r);
67
- };
68
- }
69
- function It() {
70
- }
71
- function $r() {
72
- const e = /iPad|iPhone|iPod/.test(navigator.userAgent), t = /Android/.test(navigator.userAgent);
73
- return e || t;
74
- }
75
- function Or(e) {
76
- return JSON.parse(e);
77
- }
78
- class un {
79
- constructor(t) {
80
- this.logger = t, this.subscribers = {};
81
- }
82
- async send(t) {
83
- const r = Rr(), o = this.subscribers[t.type];
84
- if (o) {
85
- this.logger.debug(`messenger.dispatcher: dispatching command: ${t.type}`, t.payload);
86
- const a = o.map((s) => s(t.payload));
87
- await Promise.all(a).catch((s) => {
88
- this.logger.error(`messenger.dispatcher: error in callback for command: ${t.type}`, s);
89
- });
90
- }
91
- return r.resolve(), r.promise;
92
- }
93
- subscribe(t, r) {
94
- this.subscribers[t] || (this.subscribers[t] = []), this.subscribers[t].push(r);
95
- }
96
- unsubscribe(t, r) {
97
- this.subscribers[t] && (this.subscribers[t] = this.subscribers[t].filter((o) => o !== r));
98
- }
99
- }
100
- const Rr = () => {
101
- let e = It, t = It;
102
- return { promise: new Promise((o, a) => {
103
- e = o, t = a;
104
- }), resolve: e, reject: t };
105
- }, Lr = "1.0.0", ke = "sb-agent", Nr = Lr;
106
- var mn = /* @__PURE__ */ ((e) => (e[e.VERBOSE = 0] = "VERBOSE", e[e.DEBUG = 1] = "DEBUG", e[e.INFO = 2] = "INFO", e[e.WARN = 3] = "WARN", e[e.ERROR = 4] = "ERROR", e[e.NONE = 5] = "NONE", e))(mn || {});
107
- class pn {
108
- constructor(t) {
109
- this.level = t;
110
- }
111
- verbose(...t) {
112
- this.level <= 0 && console.log(`[${ke}/verbose]`, ...t);
113
- }
114
- debug(...t) {
115
- this.level <= 1 && console.log(`[${ke}/debug]`, ...t);
116
- }
117
- info(...t) {
118
- this.level <= 2 && console.log(`[${ke}/info]`, ...t);
119
- }
120
- warn(...t) {
121
- this.level <= 3 && console.warn(`[${ke}/warn]`, ...t);
122
- }
123
- error(...t) {
124
- this.level <= 4 && console.error(`[${ke}/error]`, ...t);
125
- }
126
- }
127
- function Mt(e, t, r) {
128
- const o = ar.init({
129
- appId: e,
130
- modules: [new Tr(), new hr()],
131
- localCacheEnabled: !0,
132
- ...r
133
- });
134
- return o.addSendbirdExtensions(
135
- [{ version: Nr, product: sr.AI_AGENT, platform: t.platform }],
136
- { platform: t.deviceOSPlatform, version: t.deviceOSVersion },
137
- t.customData
138
- ) || console.warn("Invalid Sendbird Extensions", t), o;
139
- }
140
- const [Br, Dr] = ee("AIAgent");
141
- function Pr({
142
- appId: e,
143
- aiAgentId: t,
144
- language: r,
145
- countryCode: o,
146
- context: a,
147
- chatSDK: s,
148
- chatParams: i,
149
- dispatcher: l,
150
- logger: u,
151
- children: m,
152
- extensions: g = {
153
- platform: ir.JS,
154
- deviceOSPlatform: $r() ? wt.MOBILE_WEB : wt.WEB
155
- }
156
- }) {
157
- const [p, h] = C(() => {
158
- const f = u ?? new pn(mn.WARN), E = l ?? new un(f);
159
- return {
160
- appId: e,
161
- aiAgentId: t,
162
- language: r,
163
- countryCode: o,
164
- context: a,
165
- chatSDK: s ?? Mt(e, g, i),
166
- logger: f,
167
- dispatcher: E
168
- };
169
- });
170
- return (r !== p.language || o !== p.countryCode) && h((f) => ({ ...f, language: r, countryCode: o, context: a })), s && s !== p.chatSDK ? h((f) => ({ ...f, aiAgentId: t, chatSDK: s })) : !s && p.chatSDK.appId !== e && h((f) => ({
171
- ...f,
172
- aiAgentId: t,
173
- chatSDK: Mt(e, g, { newInstance: !0, ...i })
174
- })), P(() => () => {
175
- p.chatSDK.disconnectWebSocket();
176
- }, [p.chatSDK]), /* @__PURE__ */ n.createElement(Br.Provider, { value: p }, typeof m == "function" ? m(p) : m);
177
- }
178
- const Fr = (e) => ({
179
- setTemplate: (t, r) => e.onSetTemplate(t, r),
180
- getTemplate: (t) => e.onGetTemplate(t),
181
- setCachedToken: (t) => e.onSetCachedToken(t),
182
- getCachedToken: () => e.onGetCachedToken(),
183
- clear: () => e.onClear()
184
- }), [Ur, gn] = ee("MessageCacheTemplate");
185
- function Vr({ logger: e, storage: t, children: r }) {
186
- const o = W(
187
- (i) => {
188
- var m, g;
189
- const l = (g = (m = i.appInfo) == null ? void 0 : m.aiAgentInfo) == null ? void 0 : g.templateListToken;
190
- if (!l) return !1;
191
- const u = t.getCachedToken();
192
- return u ? l !== u : !0;
193
- },
194
- [t]
195
- ), a = W(
196
- async (i) => {
197
- try {
198
- const { templates: l, token: u } = await i.aiAgent.getMessageTemplates({ limit: 20 });
199
- for (const { template: m } of l) {
200
- const { key: g } = Or(m);
201
- t.setTemplate(g, m);
202
- }
203
- t.setCachedToken(u);
204
- } catch (l) {
205
- e == null || e.error("messageTemplateContext.syncCachedTemplates: error:", l);
206
- }
207
- },
208
- [t, e]
209
- ), s = W(() => {
210
- t.clear();
211
- }, [t]);
212
- return /* @__PURE__ */ n.createElement(
213
- Ur.Provider,
214
- {
215
- value: {
216
- shouldSyncCachedTemplate: o,
217
- syncCachedTemplates: a,
218
- clearCachedTemplates: s,
219
- storage: t
220
- }
221
- },
222
- r
223
- );
224
- }
225
- const Hr = (e, t, r) => Cr(e, t, r), Wr = (e, t) => {
226
- const r = () => {
227
- const f = e.aiAgent.createConversationListQuery(t);
228
- return f.next().then((E) => {
229
- p(E);
230
- }).catch((E) => {
231
- E instanceof on && l(E);
232
- }).finally(() => {
233
- s(!0);
234
- }), f;
235
- }, o = F(!1), [a, s] = C(!1), [i, l] = C(null), [u, m] = C(() => r()), [g, p] = C([]), h = W(() => {
236
- u.next().then((f) => {
237
- p((E) => [...E, ...f]);
238
- }).catch(() => {
239
- });
240
- }, [u]);
241
- return P(() => {
242
- o.current ? m(r()) : o.current = !0;
243
- }, [e, t.status, t.aiAgentId, t.limit]), {
244
- initialized: a,
245
- error: i,
246
- conversations: g,
247
- loadMore: h
248
- };
249
- };
250
- var rt = /* @__PURE__ */ ((e) => (e.ConversationClose = "conv.close", e))(rt || {});
251
- class zr {
252
- constructor(t = {}) {
253
- this.payload = t;
254
- }
255
- toJSON() {
256
- return JSON.stringify({ type: this.type, payload: this.payload });
257
- }
258
- }
259
- class Gr extends zr {
260
- constructor() {
261
- super(...arguments), this.type = "conv.close";
262
- }
263
- }
264
- const jr = {
265
- CloseConversation: () => new Gr()
266
- }, J = "sb-agent", Q = {
267
- ENTRY: `${J}-entry`,
268
- MODAL_ROOT: `${J}-modal-root`,
269
- WINDOW: `${J}-window`,
270
- LAUNCHER: `${J}-launcher`
271
- }, Ne = 2147483647, fe = {
272
- MODAL: Ne - 1,
273
- // FIXME: need to cover the case where the tooltip is on the top of the modal
274
- TOOLTIP: Ne - 2,
275
- WINDOW: Ne - 3,
276
- LAUNCHER: Ne - 4
277
- }, Kr = {
278
- SESSION: `@${J}-session`
279
- }, me = {
280
- DEFAULT_PRIMARY: "#742ddd",
281
- DEFAULT_BOT_MSG_BG: "#eeeeee",
282
- WHITE: "#ffffff",
283
- BLACK: "#000000"
284
- }, hn = 36, Zr = 100, Yr = 25 * 1024 * 1024, fn = ["application/pdf", "image/jpeg", "image/jpg", "image/png"], lt = "noopener noreferrer nofollow";
285
- function bn(e) {
286
- return e.length === 4 ? `#${[...e.slice(1)].map((t) => t + t).join("")}` : e;
287
- }
288
- function qr(e) {
289
- const t = bn(e);
290
- return [
291
- parseInt(t.slice(1, 3), 16),
292
- // r
293
- parseInt(t.slice(3, 5), 16),
294
- // g
295
- parseInt(t.slice(5, 7), 16)
296
- // b
297
- ];
298
- }
299
- function Jr(e) {
300
- return `#${e.map((t) => t.toString(16).padStart(2, "0")).join("")}`;
301
- }
302
- function Xr(e, t, r) {
303
- e /= 255, t /= 255, r /= 255;
304
- const o = Math.max(e, t, r), a = Math.min(e, t, r), s = o - a;
305
- let i = 0, l = 0;
306
- const u = (o + a) / 2;
307
- return o !== a && (l = u > 0.5 ? s / (2 - o - a) : s / (o + a)), o === e ? i = (t - r) / s + (t < r ? 6 : 0) : o === t ? i = (r - e) / s + 2 : o === r && (i = (e - t) / s + 4), i /= 6, [i, l, u];
308
- }
309
- function Qr(e, t, r) {
310
- let o, a, s;
311
- if (t === 0)
312
- o = a = s = r;
313
- else {
314
- const i = function(g, p, h) {
315
- return h < 0 && (h += 1), h > 1 && (h -= 1), h < 0.16666666666666666 ? g + (p - g) * 6 * h : h < 0.5 ? p : h < 0.6666666666666666 ? g + (p - g) * (0.6666666666666666 - h) * 6 : g;
316
- }, l = r < 0.5 ? r * (1 + t) : r + t - r * t, u = 2 * r - l;
317
- o = i(u, l, e + 1 / 3), a = i(u, l, e), s = i(u, l, e - 1 / 3);
318
- }
319
- return [Math.round(o * 255), Math.round(a * 255), Math.round(s * 255)];
320
- }
321
- function Be(e, t, r) {
322
- const [o, a, s] = qr(e), [i, l, u] = Xr(o, a, s), m = Math.max(0, Math.min(1, u * t)), g = Math.max(0, Math.min(1, l * r)), [p, h, f] = Qr(i, g, m);
323
- return Jr([Math.round(p), Math.round(h), Math.round(f)]);
324
- }
325
- function eo(e, t = "light") {
326
- return e === me.DEFAULT_PRIMARY ? { extraDark: "#491389", dark: "#6211c8", main: "#742ddd", light: "#c2a9fa", extraLight: "#dbd1ff" } : {
327
- extraDark: Be(e, 0.6, 1.2),
328
- dark: Be(e, 0.85, 1.1),
329
- main: e,
330
- light: Be(e, t === "dark" ? 1.1 : 1.5, t === "dark" ? 0.95 : 0.9),
331
- extraLight: Be(e, t === "dark" ? 1.2 : 1.75, t === "dark" ? 0.9 : 0.8)
332
- };
333
- }
334
- function We(e) {
335
- const t = bn(e), r = 149, o = +`0x${t[1]}${t[2]}`, a = +`0x${t[3]}${t[4]}`, s = +`0x${t[5]}${t[6]}`;
336
- return o * 0.299 + a * 0.587 + s * 0.114 > r ? me.BLACK : me.WHITE;
337
- }
338
- const Ie = "data-sb-agent-theme", $t = (e) => (t, ...r) => {
339
- let o = "";
340
- return t.forEach((a, s) => {
341
- o += a + (r[s] ?? "");
342
- }), `[${Ie}='${e}'] & { ${o} }`;
343
- }, V = {
344
- light: $t("light"),
345
- dark: $t("dark")
346
- }, to = k`:root,:host{--sendbird-primary-extra-dark:${(e) => e.theme.palette.primary.extraDark};--sendbird-primary-dark:${(e) => e.theme.palette.primary.dark};--sendbird-primary-main:${(e) => e.theme.palette.primary.main};--sendbird-primary-light:${(e) => e.theme.palette.primary.light};--sendbird-primary-extra-light:${(e) => e.theme.palette.primary.extraLight};--sendbird-secondary-extra-dark:#066858;--sendbird-secondary-dark:#027d69;--sendbird-secondary-main:#259c72;--sendbird-secondary-light:#69c085;--sendbird-secondary-extra-light:#a8e2ab;--sendbird-information-extra-dark:#241389;--sendbird-information-dark:#362ca9;--sendbird-information-main:#4a48cd;--sendbird-information-light:#a9bbfa;--sendbird-information-extra-light:#d1dbff;--sendbird-highlight-100:#fff2b6;--sendbird-error-extra-dark:#9d091e;--sendbird-error-dark:#bf0711;--sendbird-error-main:#de360b;--sendbird-error-light:#f66161;--sendbird-error-extra-light:#fdaaaa;--sendbird-background-700:#000000;--sendbird-background-600:#161616;--sendbird-background-500:#2c2c2c;--sendbird-background-400:#393939;--sendbird-background-300:#bdbdbd;--sendbird-background-200:#e0e0e0;--sendbird-background-100:#eeeeee;--sendbird-background-50:#ffffff;--sendbird-onlight-01:rgba(0,0,0,0.88);--sendbird-onlight-02:rgba(0,0,0,0.5);--sendbird-onlight-03:rgba(0,0,0,0.38);--sendbird-onlight-04:rgba(0,0,0,0.12);--sendbird-ondark-01:rgba(255,255,255,0.88);--sendbird-ondark-02:rgba(255,255,255,0.5);--sendbird-ondark-03:rgba(255,255,255,0.38);--sendbird-ondark-04:rgba(255,255,255,0.12);--sendbird-overlay-01:rgba(0,0,0,0.55);--sendbird-overlay-02:rgba(0,0,0,0.32);--sendbird-shadow-01:0 1px 5px 0 rgba(33,34,66,0.04),0 0 3px 0 rgba(0,0,0,0.08),0 2px 1px 0 rgba(0,0,0,0.12);--sendbird-shadow-02:0 3px 5px -3px rgba(33,34,66,0.04),0 3px 14px 2px rgba(0,0,0,0.08),0 8px 10px 1px rgba(0,0,0,0.12);--sendbird-shadow-03:0 6px 10px -5px rgba(0,0,0,0.04),0 6px 30px 5px rgba(0,0,0,0.08),0 16px 24px 2px rgba(0,0,0,0.12);--sendbird-shadow-04:0 9px 15px -7px rgba(0,0,0,0.04),0 9px 46px 8px rgba(0,0,0,0.08),0 24px 38px 3px rgba(0,0,0,0.12);--sendbird-shadow-05:0 2px 8px 0 rgba(0,0,0,0.08),0 4px 6px 0 rgba(0,0,0,0.12);--sendbird-shadow-message-input:0 1px 5px 0 rgba(33,34,66,0.12),0 0 1px 0 rgba(33,34,66,0.16),0 2px 1px 0 rgba(33,34,66,0.08),0 1px 5px 0 rgba(0,0,0,0.12);}`, no = k`[${Ie}='light'] &{--sb-on-bg-1:var(--sendbird-onlight-01);--sb-on-bg-2:var(--sendbird-onlight-02);--sb-on-bg-3:var(--sendbird-onlight-03);--sb-on-bg-4:var(--sendbird-onlight-04);--sb-bg-1:var(--sendbird-background-50);--sb-bg-2:var(--sendbird-background-100);--sb-bg-3:var(--sendbird-background-200);--sb-on-content-1:var(--sendbird-ondark-01);--sb-on-content-2:var(--sendbird-ondark-02);--sb-on-content-inverse-1:var(--sendbird-onlight-01);--sb-on-content-inverse-2:var(--sendbird-onlight-02);--sb-primary:var(--sendbird-primary-main);--sb-secondary:var(--sendbird-secondary-main);--sb-error:var(--sendbird-error-main);--sb-information:var(--sendbird-information-light);}[${Ie}='dark'] &{--sb-on-bg-1:var(--sendbird-ondark-01);--sb-on-bg-2:var(--sendbird-ondark-02);--sb-on-bg-3:var(--sendbird-ondark-03);--sb-on-bg-4:var(--sendbird-ondark-04);--sb-bg-1:var(--sendbird-background-600);--sb-bg-2:var(--sendbird-background-500);--sb-bg-3:var(--sendbird-background-400);--sb-on-content-1:var(--sendbird-onlight-01);--sb-on-content-2:var(--sendbird-onlight-02);--sb-on-content-inverse-1:var(--sendbird-ondark-01);--sb-on-content-inverse-2:var(--sendbird-ondark-02);--sb-primary:var(--sendbird-primary-light);--sb-secondary:var(--sendbird-secondary-light);--sb-error:var(--sendbird-error-light);--sb-information:var(--sendbird-information-light);}`, d = {
347
- color: {
348
- primary: {
349
- dark: "var(--sendbird-primary-dark)",
350
- main: "var(--sendbird-primary-main)"
351
- },
352
- error: {
353
- extraDark: "var(--sendbird-error-extra-dark)",
354
- dark: "var(--sendbird-error-dark)"
355
- },
356
- information: {
357
- main: "var(--sendbird-information-main)",
358
- light: "var(--sendbird-information-light)"
359
- },
360
- background700: "var(--sendbird-background-700)",
361
- background600: "var(--sendbird-background-600)",
362
- background500: "var(--sendbird-background-500)",
363
- background400: "var(--sendbird-background-400)",
364
- background200: "var(--sendbird-background-200)",
365
- background100: "var(--sendbird-background-100)",
366
- background50: "var(--sendbird-background-50)",
367
- onlight03: "var(--sendbird-onlight-03)",
368
- ondark01: "var(--sendbird-ondark-01)",
369
- ondark02: "var(--sendbird-ondark-02)",
370
- ondark03: "var(--sendbird-ondark-03)",
371
- ondark04: "var(--sendbird-ondark-04)",
372
- overlay01: "var(--sendbird-overlay-01)",
373
- shadow05: "var(--sendbird-shadow-05)"
374
- },
375
- themedColor: {
376
- onbackground1: "var(--sb-on-bg-1)",
377
- onbackground2: "var(--sb-on-bg-2)",
378
- onbackground3: "var(--sb-on-bg-3)",
379
- onbackground4: "var(--sb-on-bg-4)",
380
- textHighEmphasis: "var(--sb-on-bg-1)",
381
- // === onbackground1
382
- textMidEmphasis: "var(--sb-on-bg-2)",
383
- // === onbackground2
384
- textLowEmphasis: "var(--sb-on-bg-3)",
385
- // === onbackground3
386
- textDisabled: "var(--sb-on-bg-4)",
387
- // === onbackground4
388
- background1: "var(--sb-bg-1)",
389
- background2: "var(--sb-bg-2)",
390
- background3: "var(--sb-bg-3)",
391
- oncontent1: "var(--sb-on-content-1)",
392
- oncontent_inverse1: "var(--sb-on-content-inverse-1)",
393
- error: "var(--sb-error)"
394
- }
395
- };
396
- function Ot(e = "light", t) {
397
- const r = {
398
- primary: (t == null ? void 0 : t.primary) || me.DEFAULT_PRIMARY,
399
- botMessageBackground: (t == null ? void 0 : t.botMessageBackground) || me.DEFAULT_BOT_MSG_BG,
400
- primaryContrast: t == null ? void 0 : t.primaryContrast,
401
- botMessageBackgroundContrast: t == null ? void 0 : t.botMessageBackgroundContrast
402
- }, { contrastColors: o, aiAgentColorVariables: a } = ao(r), i = (e === "light" ? ro : oo)(r, o);
403
- return {
404
- selected: e,
405
- palette: {
406
- primary: eo(r.primary)
407
- },
408
- colors: i,
409
- aiAgentColorVariables: a
410
- };
411
- }
412
- const ro = (e, t) => ({
413
- base: {
414
- primary: e.primary,
415
- primaryContrastContent: t.primary,
416
- background: d.color.background50,
417
- headerBackground: d.color.background50,
418
- modalContentBackground: d.color.background50
419
- },
420
- metadata: {
421
- errorContent: d.color.ondark01,
422
- placeholderText: d.color.onlight03
423
- },
424
- messageInput: {
425
- background: d.color.background100
426
- },
427
- messageIncoming: {
428
- text: t.botMessageBackground,
429
- background: e.botMessageBackground
430
- },
431
- messageOutgoing: {
432
- text: t.primary,
433
- background: e.primary
434
- },
435
- csat: {
436
- background: d.color.background100
437
- }
438
- }), oo = (e, t) => ({
439
- base: {
440
- primary: e.primary,
441
- primaryContrastContent: t.primary,
442
- background: d.color.background600,
443
- headerBackground: d.color.background500,
444
- modalContentBackground: d.color.background500
445
- },
446
- metadata: {
447
- errorContent: d.color.ondark01,
448
- placeholderText: d.color.ondark03
449
- },
450
- messageInput: {
451
- background: d.color.background400
452
- },
453
- messageIncoming: {
454
- text: t.botMessageBackground,
455
- background: e.botMessageBackground
456
- },
457
- messageOutgoing: {
458
- text: t.primary,
459
- background: e.primary
460
- },
461
- csat: {
462
- background: d.color.background400
463
- }
464
- });
465
- function ao(e) {
466
- const t = {
467
- primary: e.primaryContrast ?? We(e.primary),
468
- botMessageBackground: e.botMessageBackgroundContrast ?? We(e.botMessageBackground)
469
- };
470
- return {
471
- contrastColors: t,
472
- aiAgentColorVariables: {
473
- primary_color: e.primary,
474
- bot_message_bg_color: e.botMessageBackground,
475
- primary_contrast_color: t.primary,
476
- bot_message_bg_contrast_color: t.botMessageBackground
477
- }
478
- };
479
- }
480
- const [so, je] = ee("AgentTheme");
481
- function io({
482
- appearance: e,
483
- rootElement: t = document.body,
484
- logger: r,
485
- children: o
486
- }) {
487
- const a = e == null ? void 0 : e.theme, s = e == null ? void 0 : e.primaryColor, i = e == null ? void 0 : e.botMessageBackgroundColor, [l, u] = C(() => (t.setAttribute(Ie, a ?? "light"), Ot(a, {
488
- primary: s,
489
- botMessageBackground: i
490
- }))), m = W(
491
- (g, p) => {
492
- const h = p == null ? void 0 : p(a), f = a ?? g, E = {
493
- primary: s ?? (h == null ? void 0 : h.primary),
494
- botMessageBackground: i ?? (h == null ? void 0 : h.botMessageBackground),
495
- primaryContrast: h == null ? void 0 : h.primaryContrast,
496
- botMessageBackgroundContrast: h == null ? void 0 : h.botMessageBackgroundContrast
497
- };
498
- s && delete E.primaryContrast, i && delete E.botMessageBackgroundContrast, t.setAttribute(Ie, f), u(Ot(f, E)), r == null || r.info("theme.update:", f, E);
499
- },
500
- [t, a, s, i]
501
- );
502
- return P(() => {
503
- (a || s || i) && m(l.selected);
504
- }, [a, s, i]), /* @__PURE__ */ n.createElement(dr, { theme: l }, /* @__PURE__ */ n.createElement(so.Provider, { value: { theme: l, updateTheme: m } }, o));
505
- }
506
- const $e = "en", lo = /* @__PURE__ */ new Set([
507
- $e,
508
- "ko",
509
- "es",
510
- "pt",
511
- "fr",
512
- "hi",
513
- "it",
514
- "de",
515
- "tr",
516
- "ja"
517
- ]), co = (e, t, r) => {
518
- const o = e[t];
519
- return o ? typeof o == "function" ? o() : Promise.resolve(o) : new Promise((a, s) => {
520
- (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
521
- s.bind(
522
- null,
523
- new Error(
524
- "Unknown variable dynamic import: " + t + (t.split("/").length !== r ? ". Note that variables only represent file names one level deep." : "")
525
- )
526
- )
527
- );
528
- });
529
- }, uo = gr, mo = {
530
- // Channel - Common
531
- CHANNEL_FROZEN: "Channel frozen",
532
- PLACE_HOLDER__WRONG: "Something went wrong",
533
- PLACE_HOLDER__NO_MESSAGES: "No messages",
534
- UNKNOWN__UNKNOWN_MESSAGE_TYPE: "(Unknown message type)",
535
- // Channel - Header
536
- HEADER_BUTTON__AGENT_HANDOFF: "Connect with an agent",
537
- // Message Input
538
- MESSAGE_INPUT__PLACE_HOLDER: "Ask a question",
539
- MESSAGE_INPUT__PLACE_HOLDER__WAIT_AI_AGENT_RESPONSE: "Waiting for the agent’s reply…",
540
- MESSAGE_INPUT__PLACE_HOLDER__DISABLED: "Chat is unavailable in this channel",
541
- // Common UI
542
- BUTTON__CANCEL: "Cancel",
543
- BUTTON__SAVE: "Save",
544
- BUTTON__OK: "OK",
545
- NO_NAME: "(No name)",
546
- RETRY: "Retry",
547
- // Date format
548
- DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR: "MMMM dd, yyyy",
549
- DATE_FORMAT__MESSAGE_TIMESTAMP: "p",
550
- // File Upload
551
- FILE_UPLOAD_NOTIFICATION__COUNT_LIMIT: "You can't upload more than one image",
552
- FILE_UPLOAD_NOTIFICATION__SIZE_LIMIT: "The maximum size per file is %d MB.",
553
- // File Viewer
554
- FILE_VIEWER__UNSUPPORT: "Unsupported message",
555
- // CSAT
556
- CSAT_TITLE_UNSUBMITTED: "Your feedback matters to us",
557
- CSAT_TITLE_SUBMITTED: "Successfully submitted!",
558
- CSAT_CRE_TITLE: "Was your issue resolved?",
559
- CSAT_CRE_SOLVED: "Yes, thank you! 👍",
560
- CSAT_CRE_NOT_SOLVED: "No, that didn’t help.",
561
- CSAT_REASON_PLACEHOLDER: "Share your feedback",
562
- CSAT_RATING_TITLE: "How would you rate your experience?",
563
- CSAT5_RATING_SCORE_1: "Terrible",
564
- CSAT5_RATING_SCORE_2: "Bad",
565
- CSAT5_RATING_SCORE_3: "Okay",
566
- CSAT5_RATING_SCORE_4: "Good",
567
- CSAT5_RATING_SCORE_5: "Great",
568
- CSAT_SUBMIT_LABEL: "Submit",
569
- CSAT_SUBMISSION_EXPIRED: "We’re sorry, the survey period has ended.",
570
- POWERED_BY: "Powered by",
571
- // Conversation list
572
- CONVERSATION_CLOSED_FOOTER_LABEL: "Your conversation has ended",
573
- START_NEW_CONVERSATION: "💬 Start a new conversation",
574
- RETURN_TO_CONVERSATION: "💬 Return to conversation",
575
- CONVERSATION_LIST__HEADER_TITLE: "Conversation history",
576
- CONVERSATION_LIST__TOPICS_FALLBACK: "No category",
577
- CONVERSATION_LIST__NO_CONVERSATIONS: "No conversations yet",
578
- DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE: "MM/dd/yyyy",
579
- DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE_CAPTION: "h:mma"
580
- }, ct = { language: "en", dateLocale: uo, stringSet: mo }, po = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
581
- __proto__: null,
582
- default: ct
583
- }, Symbol.toStringTag, { value: "Module" })), Ve = /* @__PURE__ */ new Map([[$e, ct]]);
584
- async function go(e) {
585
- if (Ve.has(e))
586
- return Ve.get(e);
587
- const t = lo.has(e) ? e : $e;
588
- try {
589
- const { default: r } = await co(/* @__PURE__ */ Object.assign({ "./languages/de.ts": () => import("./DvjrAXLD.js"), "./languages/en.ts": () => Promise.resolve().then(() => po), "./languages/es.ts": () => import("./zI14HLvP.js"), "./languages/fr.ts": () => import("./B9V0T5ZP.js"), "./languages/hi.ts": () => import("./YRQ0vk5Q.js"), "./languages/it.ts": () => import("./BQWJPfGp.js"), "./languages/ja.ts": () => import("./sl-YrKkN.js"), "./languages/ko.ts": () => import("./B8c_rqvH.js"), "./languages/pt.ts": () => import("./BSz49qaD.js"), "./languages/tr.ts": () => import("./D_eZyIAR.js") }), `./languages/${t}.ts`, 3);
590
- return Ve.set(e, r), r;
591
- } catch {
592
- return ct;
593
- }
594
- }
595
- const [ho, M] = ee("Localization");
596
- function fo(e) {
597
- var t;
598
- return ((t = e.split("-")) == null ? void 0 : t[0]) ?? $e;
599
- }
600
- function bo({
601
- language: e = navigator.language,
602
- logger: t,
603
- stringSet: r,
604
- children: o
605
- }) {
606
- const [a, s] = C(Ve.get($e));
607
- return P(() => {
608
- const i = fo(e);
609
- a.language !== i && (t == null || t.debug("localization.useEffect: update language", `${a.language} -> ${i}`), go(i).then(s));
610
- }, [e]), /* @__PURE__ */ n.createElement(
611
- ho.Provider,
612
- {
613
- value: {
614
- language: a.language,
615
- stringSet: { ...a.stringSet, ...r },
616
- dateLocale: a.dateLocale,
617
- format: (i, l, u) => He(i, l, { locale: a.dateLocale, ...u })
618
- }
619
- },
620
- o
621
- );
622
- }
623
- const Eo = '@import"https://fonts.googleapis.com/css?family=Roboto:400,500,600,700&display=swap";.sb-message-template__border{position:relative}.sb-message-template__border:after{content:"";position:absolute;top:0;bottom:0;left:0;right:0;z-index:1;box-shadow:inset 0 0 0 var(--border-width) var(--border-color);border-radius:var(--border-radius);pointer-events:none}.sb-message-template__action{cursor:pointer}.sb-message-template__parent{font-family:Roboto,serif}.sb-message-template__text{font-family:inherit;font-size:14px;font-weight:400;font-stretch:normal;font-style:normal;letter-spacing:normal;text-align:left}.sb-message-template__text-button{font-family:inherit;background-color:#e0e0e0;text-align:center;padding:10px;border-radius:6px;font-size:14px;font-weight:600;font-stretch:normal;font-style:normal;letter-spacing:normal}.sendbird-theme--light .sb-message-template__text-button{color:#742ddd}.sendbird-theme--dark .sb-message-template__text-button{color:#c2a9fa}.sb-message-template__text-button:hover{opacity:1;box-shadow:#0000001a 0 1px 3px,#0000000f 0 1px 2px}.sb-message-template__text-button,.sb-message-template__image-button{cursor:pointer;border-style:none}.sb-message-template__parent{border-radius:unset;background-color:transparent;overflow:hidden}.sb-message-template__parent *{box-sizing:border-box;line-height:1.3}.sb-message-template__carousel{display:flex;width:100%;box-sizing:border-box;touch-action:pan-y}';
624
- function pe(e, t) {
625
- const r = e.getRootNode({ composed: t });
626
- return r instanceof ShadowRoot || r instanceof Document ? r : document;
627
- }
628
- const xo = (e, t) => {
629
- P(() => {
630
- const r = pe(t) instanceof ShadowRoot, o = pe(t, !0);
631
- if (!(r ? t : o).querySelector(`link[href*='${e}']`)) {
632
- const s = o.createElement("link");
633
- s.rel = "stylesheet", s.href = e, (r ? t : o.head).appendChild(s);
634
- }
635
- }, [e, t]);
636
- }, vo = (e, t = document.body) => {
637
- P(() => {
638
- const r = pe(t), a = r instanceof ShadowRoot ? t : r.head;
639
- if (!a) return;
640
- const s = `sba-${btoa(e).slice(0, 10)}`;
641
- let i = a.querySelector(`style#${s}`);
642
- i ? i.textContent !== e && (i.textContent = e) : (i = a.ownerDocument.createElement("style"), i.id = s, i.textContent = e, a.appendChild(i));
643
- }, [e, t]);
644
- }, [yo, En] = ee("MessageTemplateFetching");
645
- function Co({
646
- children: e,
647
- rootElement: t,
648
- internalVariables: r
649
- }) {
650
- vo(Eo, t);
651
- const o = F({}), a = F({}), [s, i] = C({}), l = W((m, g) => {
652
- i((p) => ({
653
- ...p,
654
- [m]: { fetching: !1, error: !1, ...p[m], ...g }
655
- }));
656
- }, []), u = W(
657
- async ({
658
- onRequestTemplate: m,
659
- onGetCachedTemplate: g,
660
- templateKey: p,
661
- suspense: h = !1
662
- }) => {
663
- const f = g(p);
664
- if (f) return f;
665
- const E = a.current[p];
666
- if (E) return E;
667
- h || l(p, { fetching: !0 });
668
- const x = m(p).catch((b) => {
669
- throw h || l(p, { error: !0 }), b;
670
- }).finally(() => {
671
- h || l(p, { fetching: !1 }), delete a.current[p];
672
- });
673
- return a.current[p] = x, x;
674
- },
675
- [l]
676
- );
677
- return /* @__PURE__ */ n.createElement(
678
- yo.Provider,
679
- {
680
- value: {
681
- internalVariables: r,
682
- fetchTemplate: u,
683
- suspend: (m, g) => {
684
- if (o.current[m])
685
- return o.current[m];
686
- const p = _o(g());
687
- return o.current[m] = p, p;
688
- },
689
- getIsFetching: (m) => {
690
- var g;
691
- return ((g = s[m]) == null ? void 0 : g.fetching) ?? !1;
692
- },
693
- getHasError: (m) => {
694
- var g;
695
- return ((g = s[m]) == null ? void 0 : g.error) ?? !1;
696
- }
697
- }
698
- },
699
- e
700
- );
701
- }
702
- function _o(e) {
703
- let t = "pending", r = e.then((o) => {
704
- t = "resolved", r = o;
705
- }).catch((o) => {
706
- t = "rejected", r = o;
707
- });
708
- return {
709
- get value() {
710
- if (t === "resolved")
711
- return r;
712
- throw r;
713
- }
714
- };
715
- }
716
- const To = k`#${Q.ENTRY}{*:not(code *){font-family:'Roboto',sans-serif;box-sizing:border-box;}}`, So = [To, to, no], ko = (e, ...t) => ur(e, ...So, ...t), Oe = 244, xn = 640, Me = 26, vn = 4, Z = 12, Ke = 2, wo = 16, ie = `${J}-incoming-msg`, Ao = `${J}-marked-text`;
717
- function dt(e) {
718
- switch (e) {
719
- case "top":
720
- case "middle":
721
- return Ke;
722
- default:
723
- return wo;
724
- }
725
- }
726
- function ut(e, t) {
727
- if (t) {
728
- const [, r] = t.split("/");
729
- if (r)
730
- return r.toUpperCase();
731
- }
732
- if (e && !e.startsWith(".")) {
733
- const r = e.split(".").pop();
734
- if (r && r !== e)
735
- return r.toUpperCase();
736
- }
737
- return "FILE";
738
- }
739
- const ge = (e) => {
740
- const t = e;
741
- return typeof t == "number" ? `${t}px` : t;
742
- }, Io = /* @__PURE__ */ new Set(["send", "chat", "message", "chevron-right"]), Mo = {
743
- spinner: _(() => import("./BcUGcaq2.js")),
744
- chat: _(() => import("./DcFCGVBm.js")),
745
- message: _(() => import("./DsGXnanX.js")),
746
- error: _(() => import("./B6fvrWGq.js")),
747
- info: _(() => import("./CAIYsKDy.js")),
748
- refresh: _(() => import("./B6xd54zt.js")),
749
- "chevron-down": _(() => import("./BsimU71m.js")),
750
- "chevron-right": _(() => import("./NmJl7zv3.js")),
751
- done: _(() => import("./D_q6g3Dd.js")),
752
- user: _(() => import("./CvqfQEhO.js")),
753
- "file-document": _(() => import("./BAr50pfO.js")),
754
- download: _(() => import("./B2CtcWp3.js")),
755
- attach: _(() => import("./DY2ULcTX.js")),
756
- delete: _(() => import("./DMruRpOm.js")),
757
- close: _(() => import("./CuaBI7kd.js")),
758
- "close-filled": _(() => import("./CxQFWLnW.js")),
759
- send: _(() => import("./DZJyDpNp.js")),
760
- menu: _(() => import("./BUYabNz7.js")),
761
- expand: _(() => import("./wBtIAuNm.js")),
762
- collapse: _(() => import("./C0RFfifL.js")),
763
- agent: _(() => import("./Cc7XmLN1.js")),
764
- question: _(() => import("./dqwvRBog.js")),
765
- actionbook: _(() => import("./CrjNuryZ.js")),
766
- function: _(() => import("./CvdSjw1c.js")),
767
- "radio-on": _(() => import("./nmdo2Fbj.js")),
768
- "radio-off": _(() => import("./BnZcRFmS.js")),
769
- confluence: _(() => import("./BOnlh2zd.js")),
770
- zendesk: _(() => import("./BAJ6LEKc.js")),
771
- salesforce: _(() => import("./CT2kv4lr.js")),
772
- sprinklr: _(() => import("./m2INcyV2.js")),
773
- website: _(() => import("./BgGVGNdg.js")),
774
- snippet: _(() => import("./BFcXPuf5.js")),
775
- template: _(() => import("./awO7aBCv.js"))
776
- }, A = ({ type: e, size: t = 24, className: r, color: o }) => {
777
- const a = Mo[e];
778
- return /* @__PURE__ */ n.createElement(
779
- Oo,
780
- {
781
- className: r,
782
- $rtlFlip: Io.has(e),
783
- $size: t,
784
- $color: o ?? d.color.primary.main
785
- },
786
- /* @__PURE__ */ n.createElement(Ae, { fallback: null }, /* @__PURE__ */ n.createElement(a, null))
787
- );
788
- }, $o = k`[dir='rtl'] &{transform:scaleX(-1);}`, Oo = c.div`width:${({ $size: e }) => ge(e)};height:${({ $size: e }) => ge(e)};display:inline-block;&:focus{outline:none;}svg{display:block;}[class*='fill']{fill:${({ $color: e }) => e};}[class*='stroke']{stroke:${({ $color: e }) => e};stroke-width:2px;stroke-linejoin:round;}${({ $rtlFlip: e }) => e && $o};`, T = ({ as: e, variant: t, color: r, className: o, ...a }) => /* @__PURE__ */ n.createElement(Lo, { as: e, $variant: t, className: o, $color: r, ...a }), Rt = {
789
- h1: { fs: "18px", fw: 700 },
790
- h2: { fs: "16px", fw: 700 },
791
- subtitle1: { fs: "16px", fw: 500 },
792
- subtitle2: { fs: "16px", fw: 400 },
793
- body1: { fs: "16px", fw: 400 },
794
- body2: { fs: "14px", fw: 500 },
795
- body3: { fs: "14px", fw: 400 },
796
- button: { fs: "14px", fw: 700 },
797
- caption1: { fs: "12px", fw: 700 },
798
- caption2: { fs: "12px", fw: 400 },
799
- caption3: { fs: "11px", fw: 700 },
800
- caption4: { fs: "11px", fw: 400 }
801
- }, Qe = /* @__PURE__ */ new Map();
802
- function Ro(e) {
803
- if (!e || !Rt[e]) return "";
804
- if (Qe.has(e)) return Qe.get(e);
805
- const { fs: t, fw: r } = Rt[e], o = k`font-size:${t};font-weight:${r};`;
806
- return Qe.set(e, o), o;
807
- }
808
- const Lo = c.span`font-stretch:normal;font-style:normal;letter-spacing:normal;line-height:100%;${({ $variant: e }) => Ro(e)}color:${({ $color: e }) => e};`;
809
- function mt({ name: e, type: t = "FILE", iconColor: r, iconBackgroundColor: o }) {
810
- const { colors: a } = st();
811
- return /* @__PURE__ */ n.createElement(No, null, /* @__PURE__ */ n.createElement(Bo, { $bgColor: o ?? a.base.primary }, /* @__PURE__ */ n.createElement(A, { type: "file-document", size: 24, color: r ?? a.base.primaryContrastContent })), /* @__PURE__ */ n.createElement(Do, null, /* @__PURE__ */ n.createElement(Po, { variant: "button", color: d.themedColor.onbackground1 }, e), /* @__PURE__ */ n.createElement(T, { color: d.themedColor.onbackground2, variant: "caption3" }, t)));
812
- }
813
- const No = c.div`border-radius:12px;gap:8px;width:${Oe}px;height:64px;display:flex;align-items:center;padding:12px;box-sizing:border-box;border:1px solid ${d.themedColor.onbackground4};background-color:${d.themedColor.background1};`, Bo = c.div`border-radius:8px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:${({ $bgColor: e }) => e};`, Do = c.div`display:flex;flex:1;flex-direction:column;gap:4px;min-width:0;`, Po = c(T)`text-overflow:ellipsis;white-space:nowrap;overflow:hidden;`;
814
- function Fo({ file: e }) {
815
- return /* @__PURE__ */ n.createElement(mt, { name: e.name, type: ut(e.name, e.type) });
816
- }
817
- function Uo({ file: e, onClickMedia: t }) {
818
- const r = () => e.type.startsWith("image") ? /* @__PURE__ */ n.createElement(Ho, { src: e.url, alt: "image-message" }) : e.type.startsWith("video") ? /* @__PURE__ */ n.createElement(Wo, { controls: !0 }, /* @__PURE__ */ n.createElement("source", { src: e.url }), /* @__PURE__ */ n.createElement("track", { kind: "captions" })) : null;
819
- return r ? /* @__PURE__ */ n.createElement(Vo, { id: `${ie}-media-body`, onClick: () => t == null ? void 0 : t(e) }, r()) : null;
820
- }
821
- const Vo = c.div`width:${Oe}px;height:160px;border-radius:12px;overflow:hidden;background-color:${({ theme: e }) => e.colors.messageIncoming.background};cursor:pointer;`, Ho = c.img`width:100%;height:100%;object-fit:cover;`, Wo = c.video`width:100%;height:100%;object-fit:cover;`, zo = "✱";
822
- function yn(e) {
823
- const t = new RegExp(`${zo}+`, "g");
824
- return e.replace(t, (r) => `<span id=${Ao} aria-label="marked-text">${r}</span>`);
825
- }
826
- function Go(e) {
827
- const t = /```(\w+)?\n([\s\S]*?)```/g, r = [];
828
- let o = 0;
829
- return e.replace(t, (a, ...s) => {
830
- const [i, l, u] = s;
831
- return o < u && r.push({
832
- type: "text",
833
- value: e.slice(o, u).trim()
834
- }), r.push({
835
- type: "code",
836
- value: l.trim(),
837
- language: i ? i.trim() : "plaintext"
838
- }), o = u + a.length, a;
839
- }), o < e.length && r.push({
840
- type: "text",
841
- value: e.slice(o).trim()
842
- }), r.map((a) => a.type !== "text" ? a : { ...a, value: yn(a.value) });
843
- }
844
- const jo = _(async () => ({ default: (await import("./DiXu6nm5.js")).MarkdownText })), Ko = _(async () => ({ default: (await import("./DH2PekOm.js")).CodeBlock }));
845
- function Lt(e) {
846
- const t = e.maxBodyWidth ?? Oe, r = ve(() => Go(e.message), [e.message]), o = {
847
- id: `${ie}-text-body`,
848
- $maxWidth: t
849
- };
850
- return r.length === 0 ? e.children ? /* @__PURE__ */ n.createElement(Nt, { ...o }, e.children) : null : /* @__PURE__ */ n.createElement(Nt, { ...o }, r.map((a, s) => a.type === "text" ? /* @__PURE__ */ n.createElement(Bt, { key: s, variant: "body3" }, /* @__PURE__ */ n.createElement(Ae, { fallback: a.value }, /* @__PURE__ */ n.createElement(jo, null, a.value))) : a.type === "code" ? /* @__PURE__ */ n.createElement(Ae, { key: s, fallback: /* @__PURE__ */ n.createElement(Bt, { variant: "body3" }, a.value) }, /* @__PURE__ */ n.createElement(Ko, { code: a.value, language: a.language })) : null), e.children);
851
- }
852
- const Nt = c.div`display:flex;flex-direction:column;border-radius:12px;overflow:hidden;max-width:${({ $maxWidth: e }) => e}px;${({ theme: e }) => k`
853
- color: ${e.colors.messageIncoming.text};
854
- background-color: ${e.colors.messageIncoming.background};
855
- `}
856
- padding: 12px 0;
857
- transition: max-width 0.3s;
858
- overflow-wrap: break-word;
859
- `, Bt = c(T)`align-items:flex-start;line-height:18px;white-space:pre-wrap;padding:0 12px;`;
860
- function Zo(e) {
861
- const { stringSet: t } = M();
862
- if (e.messageType === "user")
863
- return /* @__PURE__ */ n.createElement(Lt, { ...e });
864
- if (e.messageType === "file") {
865
- const r = e.file;
866
- return r.type.startsWith("image") || r.type.startsWith("video") ? /* @__PURE__ */ n.createElement(Uo, { ...e }) : /* @__PURE__ */ n.createElement(Fo, { ...e });
867
- }
868
- return /* @__PURE__ */ n.createElement(Lt, { ...e, message: t.UNKNOWN__UNKNOWN_MESSAGE_TYPE });
869
- }
870
- const pt = (e) => /* @__PURE__ */ n.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.0008 0.973633C10.6172 0.973633 9.49558 2.09527 9.49558 3.47888C9.49558 4.50705 10.115 5.39055 11.0009 5.77664V7.47887H13.0009V5.77653C13.8868 5.3904 14.5061 4.50696 14.5061 3.47888C14.5061 2.09527 13.3844 0.973633 12.0008 0.973633ZM0.250977 16.5788L0.250977 10.5789H2.25098L2.25098 16.5788H0.250977ZM21.7511 10.5789V16.5788H23.7511V10.5789H21.7511ZM18.251 7.47888H3.25097V18.9789C3.25097 20.3596 4.37026 21.4789 5.75097 21.4789H18.251C19.6317 21.4789 20.751 20.3596 20.751 18.9789V9.97887C20.751 8.59816 19.6317 7.47888 18.251 7.47888ZM9.78434 11.9539V15.2038C9.78434 15.7561 9.33663 16.2038 8.78434 16.2038C8.23206 16.2038 7.78434 15.7561 7.78434 15.2038V11.9539C7.78434 11.4016 8.23206 10.9539 8.78434 10.9539C9.33663 10.9539 9.78434 11.4016 9.78434 11.9539ZM16.2677 11.9539V15.2038C16.2677 15.7561 15.82 16.2038 15.2677 16.2038C14.7154 16.2038 14.2677 15.7561 14.2677 15.2038V11.9539C14.2677 11.4016 14.7154 10.9539 15.2677 10.9539C15.82 10.9539 16.2677 11.4016 16.2677 11.9539Z", fill: "#0D0D0D" }));
871
- function gt({ id: e, src: t, size: r = 56, onClick: o, style: a }) {
872
- return /* @__PURE__ */ n.createElement(Yo, { id: e, tabIndex: 0, onClick: o, $size: ge(r), style: a }, t ? /* @__PURE__ */ n.createElement(qo, { src: t }) : /* @__PURE__ */ n.createElement(A, { type: "user", size: r }));
873
- }
874
- const Yo = c.div`border-radius:50%;display:inline-block;overflow:hidden;position:relative;flex-shrink:0;height:${(e) => e.$size};width:${(e) => e.$size};background-color:${d.themedColor.background2};&:focus{outline:none;}`, qo = c.img`object-fit:cover;width:100%;height:100%;position:absolute;`;
875
- function Jo({ sender: e, isBotMessage: t }) {
876
- const r = `${ie}-sender-avatar`;
877
- return !e.profileUrl && t ? /* @__PURE__ */ n.createElement(Xo, { id: r }, /* @__PURE__ */ n.createElement(pt, null)) : /* @__PURE__ */ n.createElement(gt, { id: r, size: Me, src: e.profileUrl });
878
- }
879
- const Xo = c.div`flex-shrink:0;width:${Me}px;height:${Me}px;box-sizing:border-box;padding:6px;border-radius:50%;display:flex;justify-content:center;align-items:center;background-color:${({ theme: e }) => e.colors.base.primary};path{fill:${({ theme: e }) => e.colors.base.primaryContrastContent};}}`;
880
- function Qo({ sender: e }) {
881
- return /* @__PURE__ */ n.createElement(ea, { id: `${ie}-sender-name`, variant: "caption1", color: d.themedColor.textMidEmphasis }, e.nickname);
882
- }
883
- const ea = c(T)`text-align:start;width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-block:5px;padding-inline:0 7px;`;
884
- function ta({ createdAt: e }) {
885
- const { stringSet: t, format: r } = M();
886
- return /* @__PURE__ */ n.createElement(T, { id: `${ie}-sent-time`, variant: "caption4", color: d.themedColor.textLowEmphasis }, r(e, t.DATE_FORMAT__MESSAGE_TIMESTAMP));
887
- }
888
- function ze() {
889
- }
890
- async function na(e) {
891
- let t = e;
892
- t && (!t.startsWith("http://") && !t.startsWith("https://") && (t = "https://" + t), window.open(t, "_blank", "noopener,noreferrer"));
893
- }
894
- function Dt(e) {
895
- try {
896
- return JSON.parse(e === "" ? "{}" : e);
897
- } catch {
898
- return {};
899
- }
900
- }
901
- function Cn(e) {
902
- return !e || !e.conversation ? !1 : e.conversation.status === j.CLOSED;
903
- }
904
- function ht(e) {
905
- return !e || !e.conversation ? !1 : e.conversation.status === j.OPEN;
906
- }
907
- function ra(e) {
908
- var o;
909
- const t = (o = e == null ? void 0 : e.conversation) == null ? void 0 : o.handoff, r = !!(t != null && t.timestamp);
910
- return ht(e) && !r;
911
- }
912
- function oa({
913
- extendedMessagePayload: e,
914
- onClickCTA: t = ({ url: r }) => na(r)
915
- }) {
916
- const r = e == null ? void 0 : e.cta_button;
917
- return r ? /* @__PURE__ */ n.createElement(aa, { id: `${ie}-ext-cta-button`, role: "button", onClick: () => t(r) }, /* @__PURE__ */ n.createElement(sa, { variant: "button" }, r.label)) : null;
918
- }
919
- const aa = c.div`display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:6px;padding:8px;background-color:${d.color.primary.main};color:${({ theme: e }) => e.colors.base.primaryContrastContent};&:hover{background-color:${d.color.primary.dark};}`, sa = c(T)`overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`;
920
- function ia(e) {
921
- return /* @__PURE__ */ n.createElement(n.Fragment, null);
922
- }
923
- const _n = (e) => {
924
- try {
925
- const t = JSON.parse(e);
926
- return typeof t == "string" ? JSON.stringify(t).slice(1, -1) : e.trim();
927
- } catch {
928
- return JSON.stringify(e).slice(1, -1);
929
- }
930
- }, Ze = (e) => JSON.parse(e), Ye = (e) => JSON.parse(e);
931
- function la(e, t) {
932
- const [r, o] = t.split(",").map((a) => a.trim());
933
- return e === "dark" && o || r;
934
- }
935
- function ca(e) {
936
- const t = {};
937
- function r(o, a = "") {
938
- for (const [s, i] of Object.entries(o)) {
939
- const l = a ? `${a}.${s}` : s;
940
- i && typeof i == "object" && !Array.isArray(i) ? r(i, l) : t[l] = i;
941
- }
942
- }
943
- return r(e), t;
944
- }
945
- function ft({
946
- template: e,
947
- variables: t,
948
- variableKeyPattern: r,
949
- variableValueTransformer: o
950
- }) {
951
- return Object.entries(t).reduce((a, [s, i]) => {
952
- if (!o && !["number", "boolean", "string"].includes(typeof i))
953
- throw new Error("If transformer is not provided, value must be a {string, number, or boolean}");
954
- const l = o ? o(i) : String(i), u = r(s);
955
- return a.replace(u, _n(l));
956
- }, e);
957
- }
958
- async function da({
959
- template: e,
960
- variables: t,
961
- variableKeyPattern: r,
962
- variableValueTransformer: o
963
- }) {
964
- return (await Promise.all(
965
- Object.entries(t).map(async ([s, i]) => {
966
- const l = await o(i);
967
- return { regex: r(s), transformedValue: l };
968
- })
969
- )).reduce((s, { regex: i, transformedValue: l }) => s.replace(i, _n(l)), e);
970
- }
971
- const qe = {
972
- VARIABLE: (e) => new RegExp(`\\{${e}\\}`, "g"),
973
- VIEW_VARIABLE: (e) => new RegExp(`"{@${e}}"`, "g")
974
- };
975
- function ae({ uiTemplateString: e, variables: t = {} }) {
976
- const r = ca(t);
977
- return ft({
978
- template: e,
979
- variables: r,
980
- variableKeyPattern: (o) => qe.VARIABLE(o)
981
- });
982
- }
983
- function se({
984
- theme: e,
985
- uiTemplateString: t,
986
- colorVariables: r = {}
987
- }) {
988
- return ft({
989
- template: t,
990
- variables: r,
991
- variableKeyPattern: (o) => qe.VARIABLE(o),
992
- variableValueTransformer: (o) => la(e, o)
993
- });
994
- }
995
- function ua({
996
- theme: e,
997
- uiTemplateString: t,
998
- viewVariables: r = {},
999
- aiAgentColorVariables: o,
1000
- internalVariables: a,
1001
- onRequestTemplate: s
1002
- }) {
1003
- const l = Object.values(r).flat().map((m) => m.key);
1004
- return [...new Set(l)].some((m) => !s(m)) ? null : ft({
1005
- template: t,
1006
- variables: r,
1007
- variableKeyPattern: (m) => qe.VIEW_VARIABLE(m),
1008
- variableValueTransformer: (m) => {
1009
- const g = m.map(({ key: p, variables: h }) => {
1010
- const f = s(p), { ui_template: E, color_variables: x } = Ze(f);
1011
- let b = JSON.stringify(E);
1012
- return b = ae({
1013
- uiTemplateString: b,
1014
- variables: a
1015
- }), b = se({
1016
- theme: e,
1017
- uiTemplateString: b,
1018
- colorVariables: x
1019
- }), b = se({
1020
- theme: e,
1021
- uiTemplateString: b,
1022
- colorVariables: o
1023
- }), b = ae({
1024
- uiTemplateString: b,
1025
- variables: h
1026
- }), Ye(b);
1027
- });
1028
- return JSON.stringify(g);
1029
- }
1030
- });
1031
- }
1032
- async function ma({
1033
- theme: e,
1034
- uiTemplateString: t,
1035
- viewVariables: r = {},
1036
- aiAgentColorVariables: o,
1037
- internalVariables: a,
1038
- onRequestTemplate: s
1039
- }) {
1040
- return da({
1041
- template: t,
1042
- variables: r,
1043
- variableKeyPattern: (i) => qe.VIEW_VARIABLE(i),
1044
- variableValueTransformer: async (i) => {
1045
- const l = i.map(async ({ key: m, variables: g }) => {
1046
- const p = await s(m), { ui_template: h, color_variables: f } = Ze(p);
1047
- let E = JSON.stringify(h);
1048
- return E = ae({
1049
- uiTemplateString: E,
1050
- variables: a
1051
- }), E = se({
1052
- theme: e,
1053
- uiTemplateString: E,
1054
- colorVariables: f
1055
- }), E = se({
1056
- theme: e,
1057
- uiTemplateString: E,
1058
- colorVariables: o
1059
- }), E = ae({
1060
- uiTemplateString: E,
1061
- variables: g
1062
- }), Ye(E);
1063
- }), u = await Promise.all(l);
1064
- return JSON.stringify(u);
1065
- }
1066
- });
1067
- }
1068
- const pa = ({
1069
- rawTemplate: e,
1070
- aiAgentColorVariables: t,
1071
- internalVariables: r,
1072
- ...o
1073
- }) => {
1074
- const { ui_template: a, color_variables: s } = Ze(e);
1075
- let i = JSON.stringify(a);
1076
- if (Object.keys(o.viewVariables ?? {}).length > 0) {
1077
- const u = ua({
1078
- ...o,
1079
- uiTemplateString: i,
1080
- aiAgentColorVariables: t,
1081
- internalVariables: r
1082
- });
1083
- if (u === null) return null;
1084
- i = u;
1085
- }
1086
- return i = ae({ ...o, uiTemplateString: i, variables: r }), i = se({ ...o, uiTemplateString: i, colorVariables: s }), i = se({ ...o, uiTemplateString: i, colorVariables: t }), i = ae({ ...o, uiTemplateString: i }), Ye(i);
1087
- }, ga = async ({
1088
- rawTemplate: e,
1089
- aiAgentColorVariables: t,
1090
- internalVariables: r,
1091
- ...o
1092
- }) => {
1093
- const { ui_template: a, color_variables: s } = Ze(e);
1094
- let i = JSON.stringify(a);
1095
- return Object.keys(o.viewVariables ?? {}).length > 0 && (i = await ma({
1096
- ...o,
1097
- uiTemplateString: i,
1098
- aiAgentColorVariables: t,
1099
- internalVariables: r
1100
- })), i = ae({ ...o, uiTemplateString: i, variables: r }), i = se({ ...o, uiTemplateString: i, colorVariables: s }), i = se({ ...o, uiTemplateString: i, colorVariables: t }), i = ae({ ...o, uiTemplateString: i }), Ye(i);
1101
- }, ha = (e) => {
1102
- const { aiAgentColorVariables: t } = je().theme, { internalVariables: r } = En();
1103
- return C(() => {
1104
- const o = e.onGetCachedTemplate(e.templateKey);
1105
- return o ? pa({
1106
- ...e,
1107
- rawTemplate: o,
1108
- aiAgentColorVariables: t,
1109
- internalVariables: r,
1110
- onRequestTemplate: e.onGetCachedTemplate
1111
- }) : null;
1112
- });
1113
- }, fa = (e) => {
1114
- const [t] = ha(e);
1115
- if (t) return t;
1116
- const { aiAgentColorVariables: r } = je().theme, { internalVariables: o, fetchTemplate: a, suspend: s } = En();
1117
- return s(e.templateKey, async () => {
1118
- const l = await a({ ...e, suspense: !0 });
1119
- return await ga({
1120
- ...e,
1121
- rawTemplate: l,
1122
- aiAgentColorVariables: r,
1123
- internalVariables: o
1124
- });
1125
- }).value;
1126
- };
1127
- class ba extends er {
1128
- constructor(t) {
1129
- super(t), this.state = {
1130
- hasError: !1
1131
- };
1132
- }
1133
- static getDerivedStateFromError() {
1134
- return { hasError: !0 };
1135
- }
1136
- render() {
1137
- return this.state.hasError ? this.props.errorFallback : /* @__PURE__ */ n.createElement(Ae, { fallback: this.props.loadingFallback }, this.props.children);
1138
- }
1139
- }
1140
- const Ea = /* @__PURE__ */ new Set(["default"]), { MessageTemplate: xa } = yr({
1141
- parser: xr,
1142
- renderer: Er,
1143
- Container: (e) => /* @__PURE__ */ n.createElement("div", { ...e })
1144
- });
1145
- function va(e) {
1146
- return /* @__PURE__ */ n.createElement(
1147
- ba,
1148
- {
1149
- errorFallback: e.messageTemplateErrorFallback,
1150
- loadingFallback: e.messageTemplateLoadingFallback
1151
- },
1152
- /* @__PURE__ */ n.createElement(ya, { ...e })
1153
- );
1154
- }
1155
- const ya = ({
1156
- extendedMessagePayload: e,
1157
- onGetCachedMessageTemplate: t = () => null,
1158
- onRequestMessageTemplate: r
1159
- }) => {
1160
- const o = e == null ? void 0 : e.message_template;
1161
- if (!Ea.has((o == null ? void 0 : o.type) ?? "default")) throw new Error("Unsupported template type");
1162
- if (!r) throw new Error("onRequestMessageTemplate is required");
1163
- const { theme: s } = je(), i = fa({
1164
- onRequestTemplate: r,
1165
- onGetCachedTemplate: t,
1166
- theme: s.selected,
1167
- templateKey: (o == null ? void 0 : o.key) ?? "invalid",
1168
- variables: o == null ? void 0 : o.variables,
1169
- viewVariables: o == null ? void 0 : o.view_variables
1170
- });
1171
- return /* @__PURE__ */ n.createElement(Ca, { id: `${ie}-ext-message-template` }, /* @__PURE__ */ n.createElement(vr, { message: {} }, /* @__PURE__ */ n.createElement(xa, { templateItems: i.body.items, templateVersion: i.version })));
1172
- }, Ca = c.div`box-sizing:border-box;overflow:hidden;width:100%;`;
1173
- function _a({
1174
- extendedMessagePayload: e,
1175
- onClickSuggestedReply: t,
1176
- suggestedRepliesDirection: r = "vertical"
1177
- }) {
1178
- const [o, a] = C(!1), s = (e == null ? void 0 : e.suggested_replies) ?? [];
1179
- return s.length === 0 || o ? null : /* @__PURE__ */ n.createElement(Ta, { id: `${ie}-ext-suggested-replies`, $type: r }, s.map((i, l) => /* @__PURE__ */ n.createElement(
1180
- Sa,
1181
- {
1182
- key: l,
1183
- $type: r,
1184
- variant: "body3",
1185
- onClick: () => {
1186
- t && (t == null || t({ reply: i }), a(!0));
1187
- }
1188
- },
1189
- i
1190
- )));
1191
- }
1192
- const Ta = c.div`margin:16px 0;padding:0 ${Z}px;position:relative;display:flex;gap:8px;${({ $type: e }) => e === "vertical" ? ka : wa};`, Sa = c(T)`box-sizing:border-box;padding:8px 12px;display:flex;align-items:center;border-radius:100px;cursor:pointer;word-break:break-word;color:${d.color.primary.main};border:1px solid ${d.color.primary.main};background-color:${d.themedColor.background1};&:hover{background-color:${d.themedColor.background2};}${({ $type: e, theme: t }) => k`
1193
- ${e === "vertical" ? Aa : Ia};
1194
- &:active {
1195
- background-color: ${t.colors.base.primary};
1196
- color: ${t.colors.base.primaryContrastContent};
1197
- }
1198
- `}
1199
- `, ka = k`flex-direction:column;align-items:flex-end;`, wa = k`flex-direction:row;overflow-x:scroll;-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none;}`, Aa = k`max-width:calc(100% - 70px);white-space:pre-wrap;`, Ia = k`white-space:nowrap;`, Tn = ({ className: e }) => /* @__PURE__ */ n.createElement(Ma, { className: e }, [0, 1, 2].map((t) => /* @__PURE__ */ n.createElement($a, { key: t }))), Ma = c.div`align-items:center;border-radius:12px;display:flex;gap:6px;justify-content:center;padding:16px 12px;background-color:${({ theme: e }) => e.colors.messageIncoming.background};`, $a = c.span`animation:blink 1.4s infinite;animation-fill-mode:both;border-radius:50%;height:8px;width:8px;background:${({ theme: e }) => e.colors.messageIncoming.text};@keyframes blink{0%{opacity:0.12;transform:scale(1);}21.43%{opacity:0.38;transform:scale(1.2);}42.86%{opacity:0.12;transform:scale(1);}100%{opacity:0.12;transform:scale(1);}}&:nth-child(1){animation-delay:0.4s;}&:nth-child(2){animation-delay:0.6s;}&:nth-child(3){animation-delay:0.8s;}`;
1200
- function Sn(e) {
1201
- return e();
1202
- }
1203
- const he = it({
1204
- template: Oa,
1205
- components: {
1206
- SenderName: Qo,
1207
- SenderAvatar: Jo,
1208
- SentTime: ta,
1209
- MessageBody: Zo,
1210
- SuggestedReplies: _a,
1211
- MessageTemplate: va,
1212
- CTAButton: oa,
1213
- MessageLogs: ia
1214
- }
1215
- });
1216
- function Oa(e) {
1217
- return /* @__PURE__ */ n.createElement(kn, { ...e, testerMode: !1 });
1218
- }
1219
- function kn(e) {
1220
- var m, g, p, h;
1221
- const { components: t } = he.useContext(), r = e.testerMode, o = !!((m = e.extendedMessagePayload) != null && m.message_template), a = !!((g = e.extendedMessagePayload) != null && g.cta_button), s = Sn(() => e.messageType === "user" ? e.message.length > 0 : !0), i = e.groupType === "top" || e.groupType === "single", l = e.groupType === "bottom" || e.groupType === "single", u = r ? 0 : Me;
1222
- return /* @__PURE__ */ n.createElement(Ra, { $marginBottom: dt(e.groupType) }, i && /* @__PURE__ */ n.createElement(La, null, !r && /* @__PURE__ */ n.createElement(t.SenderAvatar, { ...e }), /* @__PURE__ */ n.createElement(t.SenderName, { ...e })), /* @__PURE__ */ n.createElement(kt, null, /* @__PURE__ */ n.createElement(et, { $extraStartPadding: u }, /* @__PURE__ */ n.createElement(t.MessageBody, { ...e }, a && /* @__PURE__ */ n.createElement("div", { style: { marginTop: 12, marginInline: 12 } }, /* @__PURE__ */ n.createElement(t.CTAButton, { ...e })))), o && /* @__PURE__ */ n.createElement(Pt, { $startPadding: 0, $endPadding: 0, style: { marginTop: s ? Ke : 0 } }, /* @__PURE__ */ n.createElement(
1223
- t.MessageTemplate,
1224
- {
1225
- ...e,
1226
- messageTemplateErrorFallback: e.messageTemplateErrorFallback ?? /* @__PURE__ */ n.createElement(et, { $extraStartPadding: u }, /* @__PURE__ */ n.createElement(
1227
- t.MessageBody,
1228
- {
1229
- ...e,
1230
- messageType: "user",
1231
- message: ((h = (p = e.extendedMessagePayload) == null ? void 0 : p.message_template) == null ? void 0 : h.fallback_message) ?? "Cannot read this template."
1232
- }
1233
- )),
1234
- messageTemplateLoadingFallback: e.messageTemplateLoadingFallback ?? /* @__PURE__ */ n.createElement(et, { $extraStartPadding: u }, /* @__PURE__ */ n.createElement(Tn, null))
1235
- }
1236
- ))), l && /* @__PURE__ */ n.createElement(Na, { $extraStartPadding: u + 8 }, /* @__PURE__ */ n.createElement(t.SentTime, { ...e })), /* @__PURE__ */ n.createElement(kt, null, e.suggestedRepliesVisible && /* @__PURE__ */ n.createElement(Pt, null, /* @__PURE__ */ n.createElement(t.SuggestedReplies, { ...e })), /* @__PURE__ */ n.createElement(t.MessageLogs, { ...e })));
1237
- }
1238
- const Ra = c.div`display:flex;flex-direction:column;align-items:flex-start;margin-bottom:${({ $marginBottom: e }) => `${e}px`};
1239
- `, Je = c.div`display:flex;align-self:stretch;justify-content:flex-start;${({ $startPadding: e = Z, $endPadding: t = Z, $extraStartPadding: r = 0 }) => `
1240
- padding-inline: ${e + r}px ${t}px;
1241
- `}
1242
- `, La = c(Je)`display:flex;flex-direction:row;align-items:center;gap:8px;`, et = c(Je)`display:flex;`, Na = c(Je)`margin-top:${vn}px;display:flex;align-items:flex-start;justify-content:flex-start;`, Pt = c(Je)`display:flex;flex-direction:column;${({ $startPadding: e = Z, $endPadding: t = Z, $extraStartPadding: r = 0 }) => `
1243
- padding-inline: ${e + r}px ${t}px;
1244
- `}
1245
- `;
1246
- function Ba({ file: e, children: t }) {
1247
- return /* @__PURE__ */ n.createElement(Da, null, /* @__PURE__ */ n.createElement(mt, { name: e.name, type: ut(e.name, e.type) }), t);
1248
- }
1249
- const Da = c.div`display:flex;flex-direction:column;align-items:flex-end;gap:${Ke}px;`, wn = ({ className: e, children: t, size: r = 26 }) => /* @__PURE__ */ n.createElement(Pa, { className: e, $size: r }, t ?? /* @__PURE__ */ n.createElement(A, { type: "spinner", size: r })), Pa = c.div`display:flex;align-items:center;justify-content:center;width:${({ $size: e }) => ge(e)};height:${({ $size: e }) => ge(e)};animation:1s infinite linear;animation-name:rotate;@keyframes rotate{from{transform:rotate(0);}to{transform:rotate(360deg);}}`;
1250
- function Fa({ file: e, metadata: t, onClickMedia: r, children: o }) {
1251
- const { aspectRatio: a, localFile: s } = t, [i] = C(() => s instanceof File ? URL.createObjectURL(s) : e.url), [l, u] = C(!1);
1252
- return /* @__PURE__ */ n.createElement(Ua, null, /* @__PURE__ */ n.createElement(Va, { $ratio: a, onClick: () => r == null ? void 0 : r(e) }, !l && /* @__PURE__ */ n.createElement(wn, { size: 26 }, /* @__PURE__ */ n.createElement(A, { type: "spinner", color: "onbackground3", size: 26 })), /* @__PURE__ */ n.createElement(Ha, { $loaded: l, src: i, alt: "image-message", onLoad: () => u(!0) })), o);
1253
- }
1254
- const Ua = c.div`display:flex;flex-direction:column;align-items:flex-end;gap:${Ke}px;`, Va = c.div`width:${Oe}px;border-radius:12px;overflow:hidden;cursor:pointer;height:auto;aspect-ratio:${(e) => e.$ratio};position:relative;display:flex;align-items:center;justify-content:center;${V.light`
1255
- background-color: ${d.color.background100};
1256
- `}
1257
- ${V.dark`
1258
- background-color: ${d.color.background400};
1259
- `}
1260
- `, Ha = c.img`position:absolute;width:100%;height:100%;inset-block-start:0;inset-inline-start:0;object-fit:cover;opacity:${(e) => e.$loaded ? 1 : 0};transition:opacity 0.5s ease;`;
1261
- function Ft(e) {
1262
- const t = ve(() => dn.sanitize(yn(e.message)), [e.message]);
1263
- return /* @__PURE__ */ n.createElement(Wa, { $maxWidth: e.maxBodyWidth ?? Oe }, /* @__PURE__ */ n.createElement(za, { variant: "body3", dangerouslySetInnerHTML: { __html: t } }));
1264
- }
1265
- const Wa = c.div`display:flex;flex-direction:column;border-radius:12px;overflow:hidden;max-width:${({ $maxWidth: e }) => e}px;${({ theme: e }) => k`
1266
- color: ${e.colors.messageOutgoing.text};
1267
- background-color: ${e.colors.messageOutgoing.background};
1268
- `}
1269
- padding: 12px 0;
1270
- transition: max-width 0.3s;
1271
- overflow-wrap: break-word;
1272
- `, za = c(T)`align-items:flex-start;line-height:18px;white-space:pre-wrap;padding:0 12px;`;
1273
- function Ga(e) {
1274
- const { stringSet: t } = M(), r = e.message.length > 0 ? /* @__PURE__ */ n.createElement(Ft, { ...e }) : null;
1275
- return e.messageType === "user" ? r : e.messageType === "file" ? e.file.type.startsWith("image") ? /* @__PURE__ */ n.createElement(Fa, { ...e }, r) : /* @__PURE__ */ n.createElement(Ba, { ...e }, r) : /* @__PURE__ */ n.createElement(Ft, { ...e, message: t.UNKNOWN__UNKNOWN_MESSAGE_TYPE });
1276
- }
1277
- function ja({ sendingStatus: e }) {
1278
- const t = st();
1279
- switch (e) {
1280
- case "pending":
1281
- return /* @__PURE__ */ n.createElement(Ka, { size: 16 }, /* @__PURE__ */ n.createElement(A, { type: "spinner", color: t.colors.messageOutgoing.background, size: 16 }));
1282
- case "failed":
1283
- return /* @__PURE__ */ n.createElement("div", { style: { marginBottom: 2 } }, /* @__PURE__ */ n.createElement(A, { type: "error", color: d.themedColor.error, size: 16 }));
1284
- case "scheduled":
1285
- case "canceled":
1286
- return null;
1287
- default:
1288
- return /* @__PURE__ */ n.createElement("div", null, /* @__PURE__ */ n.createElement(A, { type: "chevron-down" }));
1289
- }
1290
- }
1291
- const Ka = c(wn)`margin-bottom:2px;width:16px;height:16px;`;
1292
- function Za({ createdAt: e }) {
1293
- const { stringSet: t, format: r } = M();
1294
- return /* @__PURE__ */ n.createElement(T, { variant: "caption4", color: d.themedColor.textLowEmphasis }, r(e, t.DATE_FORMAT__MESSAGE_TIMESTAMP));
1295
- }
1296
- const bt = it({
1297
- template: Ya,
1298
- components: {
1299
- SendingStatus: ja,
1300
- SentTime: Za,
1301
- MessageBody: Ga
1302
- }
1303
- });
1304
- function Ya(e) {
1305
- const { components: t } = bt.useContext(), r = e.sendingStatus === "succeeded", o = e.groupType === "bottom" || e.groupType === "single";
1306
- return /* @__PURE__ */ n.createElement(qa, { $marginBottom: dt(e.groupType) }, /* @__PURE__ */ n.createElement(Ja, null, /* @__PURE__ */ n.createElement(t.MessageBody, { ...e })), o && /* @__PURE__ */ n.createElement(Xa, { $extraEndPadding: 8 }, r ? /* @__PURE__ */ n.createElement(t.SentTime, { ...e }) : /* @__PURE__ */ n.createElement(t.SendingStatus, { ...e })));
1307
- }
1308
- const qa = c.div`display:flex;flex:1;flex-direction:column;align-items:flex-end;margin-bottom:${({ $marginBottom: e }) => `${e}px`};
1309
- `, An = c.div`display:flex;align-self:stretch;justify-content:flex-end;${({ $startPadding: e = Z, $endPadding: t = Z, $extraEndPadding: r = 0 }) => `padding-inline: ${e}px ${t + r}px;`};
1310
- `, Ja = c(An)``, Xa = c(An)`margin-top:${vn}px;`;
1311
- function Qa(e) {
1312
- return e.messageType !== "admin" ? null : /* @__PURE__ */ n.createElement(es, null, /* @__PURE__ */ n.createElement(T, { variant: "caption2", color: d.themedColor.textMidEmphasis }, ts(dn.sanitize(e.message))));
1313
- }
1314
- const es = c.div`text-align:center;text-wrap:pretty;a{text-decoration:none;color:inherit;}`, ts = (e) => {
1315
- const t = /\[([^\]]+)\]\((https?:\/\/[^\s]+)\)/g, r = [];
1316
- let o = 0;
1317
- return e.replace(t, (a, s, i, l) => (r.push(e.slice(o, l)), r.push(
1318
- /* @__PURE__ */ n.createElement("a", { key: i, href: i, target: "_blank", rel: lt }, s)
1319
- ), o = l + a.length, a)), r.push(e.slice(o)), r;
1320
- }, ns = ({ submitted: e, defaultValue: t, value: r, onChange: o }) => {
1321
- const { stringSet: a } = M();
1322
- return P(() => {
1323
- typeof r > "u" && typeof t == "boolean" && (o == null || o(t));
1324
- }, [r, t]), /* @__PURE__ */ n.createElement(rs, null, /* @__PURE__ */ n.createElement(T, { variant: "caption2", color: d.themedColor.textMidEmphasis }, a.CSAT_CRE_TITLE), /* @__PURE__ */ n.createElement("div", null, /* @__PURE__ */ n.createElement(
1325
- Ut,
1326
- {
1327
- checked: r === !0,
1328
- label: a.CSAT_CRE_SOLVED,
1329
- disabled: e,
1330
- onClick: () => o == null ? void 0 : o(!0)
1331
- }
1332
- ), /* @__PURE__ */ n.createElement(
1333
- Ut,
1334
- {
1335
- checked: r === !1,
1336
- label: a.CSAT_CRE_NOT_SOLVED,
1337
- disabled: e,
1338
- onClick: () => o == null ? void 0 : o(!1)
1339
- }
1340
- )));
1341
- }, Ut = ({ onClick: e, checked: t, label: r, disabled: o }) => {
1342
- const a = t ? d.color.primary.main : o ? d.themedColor.textDisabled : d.themedColor.textLowEmphasis, s = t ? d.themedColor.textHighEmphasis : o ? d.themedColor.textLowEmphasis : d.themedColor.textHighEmphasis;
1343
- return /* @__PURE__ */ n.createElement(os, { onClick: e, disabled: o }, /* @__PURE__ */ n.createElement(A, { size: 24, type: t ? "radio-on" : "radio-off", color: a }), /* @__PURE__ */ n.createElement(T, { variant: "caption2", color: s }, r));
1344
- }, rs = c.div`display:flex;flex-direction:column;gap:8px;`, os = c.button`all:unset;display:flex;align-items:center;justify-content:flex-start;gap:2px;span{line-height:initial;}&:enabled{cursor:pointer;}`, as = (e) => /* @__PURE__ */ n.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", id: "csat1", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.08301 20C2.08301 10.1049 10.1046 2.08334 19.9997 2.08334C29.8948 2.08334 37.9163 10.1049 37.9163 20C37.9163 29.8952 29.8948 37.9167 19.9997 37.9167C10.1046 37.9167 2.08301 29.8952 2.08301 20Z", fill: "#E0E0E0" }), /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.5824 29.3328C13.1344 29.7473 13.918 29.636 14.3326 29.084C15.6269 27.3607 17.6835 26.25 19.9997 26.25C22.316 26.25 24.3727 27.3607 25.6668 29.084C26.0815 29.636 26.865 29.7473 27.4172 29.3328C27.9692 28.9182 28.0805 28.1347 27.6658 27.5825C25.9198 25.2577 23.1357 23.75 19.9997 23.75C16.8638 23.75 14.0797 25.2577 12.3336 27.5825C11.919 28.1347 12.0304 28.9182 12.5824 29.3328Z", fill: "black", fillOpacity: 0.12 }), /* @__PURE__ */ n.createElement("path", { d: "M28.4449 13.7707C29.1324 13.8328 29.64 14.4406 29.578 15.1281C29.516 15.8153 28.909 16.3221 28.2219 16.2608C28.2219 16.2608 28.0282 16.2502 27.9267 16.2487C27.7224 16.2457 27.4382 16.2509 27.1224 16.2833C26.7864 16.3177 26.4644 16.3782 26.1799 16.4662L26.304 16.86C26.7792 18.3675 25.5094 19.5813 24.2057 19.5813C23.504 19.5813 22.8319 19.2617 22.4295 18.6857C22.0025 18.0745 21.9417 17.241 22.4075 16.5344C22.7505 16.0143 23.2444 15.3831 23.8959 14.8657C24.8355 14.1195 26.0435 13.8809 26.867 13.7963C27.3024 13.7517 28.0149 13.7319 28.4449 13.7707Z", fill: "black", fillOpacity: 0.12 }), /* @__PURE__ */ n.createElement("path", { d: "M11.5553 13.7707C10.8677 13.8328 10.3601 14.4406 10.4221 15.1281C10.4842 15.8153 11.0912 16.3221 11.7782 16.2608C11.7782 16.2608 11.972 16.2502 12.0734 16.2487C12.2778 16.2457 12.562 16.2509 12.8778 16.2833C13.2137 16.3177 13.5357 16.3782 13.8203 16.4662L13.6962 16.86C13.2209 18.3675 14.4907 19.5813 15.7944 19.5813C16.4962 19.5813 17.1683 19.2617 17.5707 18.6857C17.9975 18.0745 18.0585 17.241 17.5925 16.5344C17.2497 16.0143 16.7557 15.3831 16.1043 14.8657C15.1646 14.1195 13.9566 13.8809 13.1331 13.7963C12.6978 13.7517 11.9853 13.7319 11.5553 13.7707Z", fill: "black", fillOpacity: 0.12 })), ss = (e) => /* @__PURE__ */ n.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.08337 19.9999C2.08337 10.1048 10.1049 2.08325 20 2.08325C29.8952 2.08325 37.9167 10.1048 37.9167 19.9999C37.9167 29.8951 29.8952 37.9166 20 37.9166C10.1049 37.9166 2.08337 29.8951 2.08337 19.9999Z", fill: "url(#paint0_linear_159_173206)" }), /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.5828 29.3328C13.1348 29.7473 13.9184 29.636 14.3329 29.084C15.6272 27.3607 17.6839 26.25 20 26.25C22.3164 26.25 24.373 27.3607 25.6672 29.084C26.0819 29.636 26.8654 29.7473 27.4175 29.3328C27.9695 28.9182 28.0809 28.1347 27.6662 27.5825C25.9202 25.2577 23.136 23.75 20 23.75C16.8642 23.75 14.0801 25.2577 12.334 27.5825C11.9194 28.1347 12.0308 28.9182 12.5828 29.3328Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("path", { d: "M28.4454 13.7707C29.1329 13.8328 29.6405 14.4406 29.5785 15.1281C29.5165 15.8153 28.9095 16.3221 28.2224 16.2608C28.2224 16.2608 28.0287 16.2502 27.9272 16.2487C27.7229 16.2457 27.4387 16.2509 27.1229 16.2833C26.7869 16.3177 26.4649 16.3782 26.1804 16.4662L26.3045 16.86C26.7797 18.3675 25.5099 19.5813 24.2062 19.5813C23.5045 19.5813 22.8324 19.2617 22.43 18.6857C22.003 18.0745 21.9422 17.241 22.408 16.5344C22.751 16.0143 23.2449 15.3831 23.8964 14.8657C24.836 14.1195 26.044 13.8809 26.8675 13.7963C27.3029 13.7517 28.0154 13.7319 28.4454 13.7707Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("path", { d: "M11.5549 13.7707C10.8674 13.8328 10.3597 14.4406 10.4218 15.1281C10.4838 15.8153 11.0908 16.3221 11.7779 16.2608C11.7779 16.2608 11.9716 16.2502 12.073 16.2487C12.2774 16.2457 12.5616 16.2509 12.8774 16.2833C13.2134 16.3177 13.5353 16.3782 13.8199 16.4662L13.6958 16.86C13.2205 18.3675 14.4904 19.5813 15.794 19.5813C16.4958 19.5813 17.168 19.2617 17.5703 18.6857C17.9971 18.0745 18.0581 17.241 17.5921 16.5344C17.2493 16.0143 16.7553 15.3831 16.1039 14.8657C15.1643 14.1195 13.9562 13.8809 13.1327 13.7963C12.6974 13.7517 11.9849 13.7319 11.5549 13.7707Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("defs", null, /* @__PURE__ */ n.createElement("linearGradient", { id: "paint0_linear_159_173206", x1: 20, y1: 2.08325, x2: 20, y2: 37.9166, gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ n.createElement("stop", { stopColor: "#FF2D1D" }), /* @__PURE__ */ n.createElement("stop", { offset: 1, stopColor: "#FFA540" })))), is = (e) => /* @__PURE__ */ n.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M19.9997 36.6667C29.2044 36.6667 36.6663 29.2048 36.6663 20C36.6663 10.7953 29.2044 3.33334 19.9997 3.33334C10.7949 3.33334 3.33301 10.7953 3.33301 20C3.33301 29.2048 10.7949 36.6667 19.9997 36.6667Z", fill: "#E0E0E0" }), /* @__PURE__ */ n.createElement("path", { d: "M15 28.333C16.3927 27.2867 18.124 26.6667 20 26.6667C21.876 26.6667 23.6073 27.2867 25 28.333", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ n.createElement("path", { d: "M11.667 13.3511C11.667 13.3511 14.0161 13.139 15.3268 14.18M15.3268 14.18L14.8882 15.5711C14.7153 16.1199 15.1675 16.6667 15.7943 16.6667C16.4531 16.6667 16.8882 16.0723 16.549 15.5579C16.2483 15.102 15.8388 14.5866 15.3268 14.18ZM23.3337 13.3511C23.3337 13.3511 25.6827 13.139 26.9935 14.18M26.9935 14.18L26.555 15.5711C26.382 16.1199 26.8342 16.6667 27.461 16.6667C28.1198 16.6667 28.5548 16.0723 28.2157 15.5579C27.915 15.102 27.5055 14.5866 26.9935 14.18Z", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })), ls = (e) => /* @__PURE__ */ n.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.083 20C2.083 10.105 10.105 2.083 20 2.083c9.895 0 17.917 8.021 17.917 17.917 0 9.895-8.022 17.917-17.917 17.917C10.105 37.917 2.083 29.895 2.083 20Z", fill: "#FFD46E" }), /* @__PURE__ */ n.createElement("path", { d: "M14.249 27.334C15.851 26.13 17.844 25.417 20 25.417c2.156 0 4.149.714 5.751 1.917.553.415.664 1.199.25 1.751-.415.552-1.199.664-1.751.25-1.183-.889-2.652-1.416-4.25-1.416s-3.067.527-4.25 1.416c-.553.414-1.336.302-1.751-.25-.415-.552-.303-1.336.249-1.751Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("path", { d: "M23.445 14.596c-.687.062-1.294-.445-1.356-1.132-.062-.687.445-1.295 1.132-1.357.082-.005.342-.02.482-.022.277-.004.662.002 1.097.047.823.085 2.031.323 2.97 1.07.652.518 1.146 1.15 1.489 1.67.466.706.405 1.54-.022 2.15-.402.576-1.074.896-1.775.896-1.304 0-2.573-1.214-2.098-2.722l.125-.394c-.285-.088-.607-.148-.942-.182-.316-.033-.6-.038-.804-.035-.101.002-.242.01-.294.013Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("path", { d: "M11.779 14.596c-.687.062-1.294-.445-1.356-1.132-.062-.687.445-1.295 1.132-1.357.082-.005.342-.02.482-.022.277-.004.662.002 1.097.047.823.085 2.031.323 2.97 1.07.652.518 1.146 1.15 1.489 1.67.466.706.405 1.54-.022 2.15-.402.576-1.074.896-1.775.896-1.304 0-2.573-1.214-2.098-2.722l.124-.394c-.284-.088-.606-.148-.941-.182-.316-.033-.6-.038-.804-.035-.101.002-.243.01-.294.013Z", fill: "#141B34" })), cs = (e) => /* @__PURE__ */ n.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M19.9997 36.6667C29.2044 36.6667 36.6663 29.2048 36.6663 20C36.6663 10.7953 29.2044 3.33334 19.9997 3.33334C10.7949 3.33334 3.33301 10.7953 3.33301 20C3.33301 29.2048 10.7949 36.6667 19.9997 36.6667Z", fill: "#E0E0E0" }), /* @__PURE__ */ n.createElement("path", { d: "M13.348 15H13.333M26.6663 15H26.6513", stroke: "black", strokeOpacity: 0.12, strokeWidth: 3.33333, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ n.createElement("path", { d: "M15 26.6667H25", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })), ds = (e) => /* @__PURE__ */ n.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.083 20C2.083 10.105 10.105 2.083 20 2.083c9.895 0 17.917 8.021 17.917 17.917 0 9.895-8.022 17.917-17.917 17.917C10.105 37.917 2.083 29.895 2.083 20Z", fill: "#FFD46E" }), /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.25 15c0-1.151.933-2.083 2.083-2.083h.015c1.151 0 2.084.933 2.084 2.083 0 1.151-.933 2.083-2.084 2.083h-.015c-1.15 0-2.083-.933-2.083-2.083ZM24.568 15c0-1.151.933-2.083 2.084-2.083h.015c1.151 0 2.083.933 2.083 2.083 0 1.151-.932 2.083-2.083 2.083h-.015c-1.151 0-2.084-.933-2.084-2.083Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.75 26.667c0-.691.56-1.25 1.25-1.25h10c.69 0 1.25.559 1.25 1.25 0 .691-.56 1.25-1.25 1.25h-10c-.69 0-1.25-.559-1.25-1.25Z", fill: "#141B34" })), us = (e) => /* @__PURE__ */ n.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M19.9997 36.6667C29.2044 36.6667 36.6663 29.2048 36.6663 20C36.6663 10.7953 29.2044 3.33334 19.9997 3.33334C10.7949 3.33334 3.33301 10.7953 3.33301 20C3.33301 29.2048 10.7949 36.6667 19.9997 36.6667Z", fill: "#E0E0E0" }), /* @__PURE__ */ n.createElement("path", { d: "M13.333 25C14.8532 27.024 17.2735 28.3333 19.9997 28.3333C22.7258 28.3333 25.1462 27.024 26.6663 25", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ n.createElement("path", { d: "M13.348 15H13.333M26.6663 15H26.6513", stroke: "black", strokeOpacity: 0.12, strokeWidth: 3.33333, strokeLinecap: "round", strokeLinejoin: "round" })), ms = (e) => /* @__PURE__ */ n.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.083 20C2.083 10.105 10.105 2.083 20 2.083c9.895 0 17.917 8.021 17.917 17.917 0 9.895-8.022 17.917-17.917 17.917C10.105 37.917 2.083 29.895 2.083 20Z", fill: "#FFD46E" }), /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12.583 24.001c.552-.414 1.335-.302 1.75.25 1.294 1.723 3.35 2.834 5.667 2.834s4.373-1.11 5.667-2.834c.415-.552 1.199-.664 1.751-.25.552.415.664 1.199.25 1.751C25.92 28.076 23.136 29.584 20 29.584s-5.92-1.508-7.666-3.832c-.415-.552-.303-1.336.249-1.751Z", fill: "#141B34" }), /* @__PURE__ */ n.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.25 15c0-1.151.933-2.083 2.083-2.083h.015c1.151 0 2.084.933 2.084 2.083 0 1.151-.933 2.083-2.084 2.083h-.015c-1.15 0-2.083-.933-2.083-2.083ZM24.568 15c0-1.151.933-2.083 2.084-2.083h.015c1.151 0 2.083.933 2.083 2.083 0 1.151-.932 2.083-2.083 2.083h-.015c-1.151 0-2.084-.933-2.084-2.083Z", fill: "#141B34" })), ps = (e) => /* @__PURE__ */ n.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M19.9997 36.6663C29.2044 36.6663 36.6663 29.2044 36.6663 19.9997C36.6663 10.7949 29.2044 3.33301 19.9997 3.33301C10.7949 3.33301 3.33301 10.7949 3.33301 19.9997C3.33301 29.2044 10.7949 36.6663 19.9997 36.6663Z", fill: "#E0E0E0" }), /* @__PURE__ */ n.createElement("path", { d: "M19.9997 30C23.16 30 25.8145 27.867 26.56 24.9832C26.9068 23.6413 26.4033 23.3333 25.0765 23.3333H14.9228C13.5959 23.3333 13.0925 23.6413 13.4393 24.9832C14.1848 27.867 16.8393 30 19.9997 30Z", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ n.createElement("path", { d: "M11.667 15.8333C11.667 14.4526 12.7863 13.3333 14.167 13.3333C15.5477 13.3333 16.667 14.4526 16.667 15.8333M23.3337 15.8333C23.3337 14.4526 24.453 13.3333 25.8337 13.3333C27.2143 13.3333 28.3337 14.4526 28.3337 15.8333", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })), gs = (e) => /* @__PURE__ */ n.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ n.createElement("path", { d: "M2.083 20C2.083 10.105 10.105 2.083 20 2.083c9.895 0 17.917 8.021 17.917 17.917 0 9.895-8.022 17.917-17.917 17.917C10.105 37.917 2.083 29.895 2.083 20Z", fill: "#FFD46E" }), /* @__PURE__ */ n.createElement("g", { clipPath: "url(#clip0_159_173224)" }, /* @__PURE__ */ n.createElement("g", { clipPath: "url(#clip1_159_173224)" }, /* @__PURE__ */ n.createElement("path", { d: "M20 30.624c3.752 0 6.904-2.532 7.789-5.956.412-1.593-.185-1.959-1.76-1.959H13.973c-1.575 0-2.173.366-1.761 1.959.885 3.424 4.037 5.956 7.788 5.956Z", fill: "#141B34" })), /* @__PURE__ */ n.createElement("mask", { id: "mask0_159_173224", style: {
1345
- maskType: "alpha"
1346
- }, maskUnits: "userSpaceOnUse", x: 12, y: 22, width: 16, height: 9 }, /* @__PURE__ */ n.createElement("path", { d: "M20 30.624c3.752 0 6.904-2.532 7.789-5.956.412-1.593-.185-1.959-1.76-1.959H13.973c-1.575 0-2.173.366-1.761 1.959.885 3.424 4.037 5.956 7.788 5.956Z", fill: "#141B34" })), /* @__PURE__ */ n.createElement("g", { mask: "url(#mask0_159_173224)" }, /* @__PURE__ */ n.createElement("path", { d: "M20 32.998c3.278 0 5.936-1.594 5.936-3.561 0-1.968-2.658-3.562-5.936-3.562-3.278 0-5.936 1.594-5.936 3.562 0 1.967 2.658 3.561 5.936 3.561Z", fill: "#FF493B" }))), /* @__PURE__ */ n.createElement("path", { d: "M11.667 15.833c0-1.381 1.12-2.5 2.5-2.5s2.5 1.12 2.5 2.5M23.333 15.833c0-1.381 1.12-2.5 2.5-2.5s2.5 1.12 2.5 2.5", stroke: "#141B34", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ n.createElement("defs", null, /* @__PURE__ */ n.createElement("clipPath", { id: "clip0_159_173224" }, /* @__PURE__ */ n.createElement("rect", { width: 15.83, height: 7.915, fill: "white", transform: "translate(12.085 22.709)" })), /* @__PURE__ */ n.createElement("clipPath", { id: "clip1_159_173224" }, /* @__PURE__ */ n.createElement("rect", { width: 15.83, height: 7.915, fill: "white", transform: "translate(12.085 22.709)" })))), hs = [
1347
- {
1348
- value: 1,
1349
- Icon: {
1350
- Active: ss,
1351
- Inactive: as
1352
- },
1353
- isActive: (e) => e <= 1,
1354
- getTooltip: (e) => e.CSAT5_RATING_SCORE_1
1355
- },
1356
- {
1357
- value: 2,
1358
- Icon: {
1359
- Active: ls,
1360
- Inactive: is
1361
- },
1362
- isActive: (e) => e === 2,
1363
- getTooltip: (e) => e.CSAT5_RATING_SCORE_2
1364
- },
1365
- {
1366
- value: 3,
1367
- Icon: {
1368
- Active: ds,
1369
- Inactive: cs
1370
- },
1371
- isActive: (e) => e === 3,
1372
- getTooltip: (e) => e.CSAT5_RATING_SCORE_3
1373
- },
1374
- {
1375
- value: 4,
1376
- Icon: {
1377
- Active: ms,
1378
- Inactive: us
1379
- },
1380
- isActive: (e) => e === 4,
1381
- getTooltip: (e) => e.CSAT5_RATING_SCORE_4
1382
- },
1383
- {
1384
- value: 5,
1385
- Icon: {
1386
- Active: gs,
1387
- Inactive: ps
1388
- },
1389
- isActive: (e) => 5 <= e,
1390
- getTooltip: (e) => e.CSAT5_RATING_SCORE_5
1391
- }
1392
- ], fs = () => hs, In = ({ label: e, children: t, position: r = "top", disabled: o }) => {
1393
- const [a, s] = C(!1);
1394
- return o ? t : /* @__PURE__ */ n.createElement("div", { style: { position: "relative" }, onMouseEnter: () => s(!0), onMouseLeave: () => s(!1) }, t, /* @__PURE__ */ n.createElement(xs, { $visible: a, $position: r }, /* @__PURE__ */ n.createElement(vs, { variant: "caption1" }, e), /* @__PURE__ */ n.createElement(bs, { $position: r })));
1395
- }, bs = ({ $position: e }) => /* @__PURE__ */ n.createElement(
1396
- "svg",
1397
- {
1398
- style: { transform: e === "top" ? "rotate(0)" : "rotate(180deg)" },
1399
- xmlns: "http://www.w3.org/2000/svg",
1400
- width: "12",
1401
- height: "6",
1402
- viewBox: "0 0 12 6",
1403
- fill: "none"
1404
- },
1405
- /* @__PURE__ */ n.createElement("path", { d: "M6 6L0 0h12L6 6Z", fill: d.themedColor.oncontent_inverse1 })
1406
- ), Es = {
1407
- top: k`flex-direction:column;top:0;transform:translate(-50%,-100%);`,
1408
- bottom: k`flex-direction:column-reverse;bottom:0;transform:translate(-50%,100%);`
1409
- }, xs = c.div`display:${({ $visible: e }) => e ? "flex" : "none"};align-items:center;position:absolute;left:50%;z-index:${fe.TOOLTIP};${({ $position: e }) => Es[e]}`, vs = c(T)`padding:6px 8px;color:${d.themedColor.oncontent1};background:${d.themedColor.oncontent_inverse1};border-radius:4px;font-size:12px;white-space:nowrap;`, ys = ({ submitted: e, value: t, onChange: r }) => {
1410
- const { stringSet: o } = M(), a = fs(), s = typeof t == "number";
1411
- return /* @__PURE__ */ n.createElement(Cs, null, /* @__PURE__ */ n.createElement(T, { variant: "caption2", color: d.themedColor.textMidEmphasis }, o.CSAT_RATING_TITLE), /* @__PURE__ */ n.createElement(_s, null, a.map((i) => /* @__PURE__ */ n.createElement(In, { disabled: e, key: i.value, label: i.getTooltip(o) }, /* @__PURE__ */ n.createElement(
1412
- Ts,
1413
- {
1414
- disabled: e,
1415
- onClick: () => r(i.value),
1416
- $inactive: s && !i.isActive(t)
1417
- },
1418
- s ? i.isActive(t) ? /* @__PURE__ */ n.createElement(i.Icon.Active, null) : /* @__PURE__ */ n.createElement(i.Icon.Inactive, null) : /* @__PURE__ */ n.createElement(i.Icon.Active, null)
1419
- )))));
1420
- }, Cs = c.div`display:flex;flex-direction:column;gap:8px;`, _s = c.div`display:flex;justify-content:space-between;width:100%;max-width:320px;`, Ts = c.button`background-color:transparent;border:none;border-radius:4px;padding:0;display:flex;align-items:center;justify-content:center;box-sizing:border-box;&:enabled:hover{cursor:pointer;background-color:${d.color.background200};${V.dark`
1421
- background-color: ${d.color.background500};
1422
- `}
1423
- }
1424
-
1425
- ${({ $inactive: e, theme: t }) => e && t.selected === "dark" && Ss};
1426
- `, Ss = k`[fill]{fill:white;fill-opacity:0.12;}[stroke]{stroke:white;stroke-opacity:0.12;}`, ks = ({ submitted: e, value: t = "", onChange: r }) => {
1427
- const { stringSet: o } = M();
1428
- return e && !t ? null : /* @__PURE__ */ n.createElement(
1429
- ws,
1430
- {
1431
- disabled: e,
1432
- maxLength: 255,
1433
- value: t,
1434
- onChange: (a) => r(a.target.value),
1435
- placeholder: o.CSAT_REASON_PLACEHOLDER
1436
- }
1437
- );
1438
- }, ws = c.input`box-sizing:border-box;width:100%;border-radius:4px;padding:10px 16px;font-size:14px;font-weight:400;font-style:normal;border:unset;&:focus{outline:none;}color:${d.themedColor.textHighEmphasis};&::placeholder{color:${d.themedColor.onbackground3};}background-color:${d.color.background50};${V.dark`
1439
- background-color: ${d.themedColor.textDisabled};
1440
- `}
1441
-
1442
- &:disabled {
1443
- cursor: not-allowed;
1444
- color: ${d.themedColor.textLowEmphasis};
1445
- background-color: ${d.color.background200};
1446
- ${V.dark`
1447
- color: ${d.color.ondark04};
1448
- background-color: ${d.themedColor.textDisabled};
1449
- `}
1450
- }
1451
- `, As = ({ submitted: e }) => {
1452
- const { stringSet: t } = M();
1453
- return e ? /* @__PURE__ */ n.createElement(T, { variant: "h2", color: d.themedColor.onbackground1 }, t.CSAT_TITLE_SUBMITTED) : /* @__PURE__ */ n.createElement(T, { variant: "h2", color: d.themedColor.onbackground1 }, t.CSAT_TITLE_UNSUBMITTED);
1454
- };
1455
- var ue = /* @__PURE__ */ ((e) => (e.AI_AGENT_CSAT_5 = "AI_AGENT_CSAT_5", e.AI_AGENT_CSAT_5_WITH_CRE = "AI_AGENT_CSAT_5_WITH_CRE", e))(ue || {});
1456
- const Is = (e) => tr((t, r) => ({ ...t, ...r }), e), Vt = ({
1457
- type: e,
1458
- renderSubmitButton: t,
1459
- initialCsat: r,
1460
- initialCsatReason: o,
1461
- initialIsResolved: a
1462
- }) => {
1463
- const [s, i] = Is({
1464
- csatType: e,
1465
- csat: r,
1466
- csatReason: o,
1467
- isResolved: a
1468
- }), l = typeof r == "number" ? "submitted" : e === ue.AI_AGENT_CSAT_5 && typeof s.csat == "number" || e === ue.AI_AGENT_CSAT_5_WITH_CRE && typeof s.csat == "number" && typeof s.isResolved == "boolean" ? "submittable" : "unsubmittable", u = { state: l, submitted: l === "submitted" };
1469
- return /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(Ms, null, /* @__PURE__ */ n.createElement(As, { ...u }), e === ue.AI_AGENT_CSAT_5_WITH_CRE && /* @__PURE__ */ n.createElement(
1470
- ns,
1471
- {
1472
- ...u,
1473
- defaultValue: a,
1474
- value: s.isResolved,
1475
- onChange: (m) => i({ isResolved: m })
1476
- }
1477
- ), /* @__PURE__ */ n.createElement(ys, { ...u, value: s.csat, onChange: (m) => i({ csat: m }) }), s.csat && /* @__PURE__ */ n.createElement(
1478
- ks,
1479
- {
1480
- ...u,
1481
- value: s.csatReason,
1482
- onChange: (m) => i({ csatReason: m })
1483
- }
1484
- )), l !== "submitted" && t({ state: l, params: s }));
1485
- }, Ms = c.div`display:flex;flex-direction:column;gap:12px;`, $s = () => {
1486
- const { stringSet: e } = M();
1487
- return /* @__PURE__ */ n.createElement(T, { variant: "body2", color: d.themedColor.textMidEmphasis, style: { textAlign: "center" } }, e.CSAT_SUBMISSION_EXPIRED);
1488
- }, Os = (e) => {
1489
- if (e.messageType !== "admin.csat")
1490
- throw new Error("Invalid message type");
1491
- const t = _r(), { stringSet: r } = M(), { extendedMessagePayload: o, csat: a, csatReason: s, csatExpireAt: i, isResolvedWhenDeterminedByUser: l, onSubmitCSAT: u } = e, { visibility: m, type: g } = (o == null ? void 0 : o.csat) ?? {};
1492
- if (!m || !g || !ue[g]) return null;
1493
- const p = g === ue.AI_AGENT_CSAT_5 || g === ue.AI_AGENT_CSAT_5_WITH_CRE ? Vt : () => null, h = (f) => {
1494
- f.csat && !Ht(i) ? u({
1495
- csatType: f.csatType,
1496
- csat: f.csat,
1497
- csatReason: f.csatReason,
1498
- isResolved: f.isResolved
1499
- }) : t();
1500
- };
1501
- return /* @__PURE__ */ n.createElement(Rs, null, !a && Ht(i) ? /* @__PURE__ */ n.createElement($s, null) : /* @__PURE__ */ n.createElement(
1502
- p,
1503
- {
1504
- type: g,
1505
- initialCsat: a,
1506
- initialCsatReason: s,
1507
- initialIsResolved: l,
1508
- renderSubmitButton: ({ state: f, params: E }) => /* @__PURE__ */ n.createElement(Ls, { disabled: f !== "submittable", onClick: () => h(E) }, /* @__PURE__ */ n.createElement(T, { variant: "button" }, r.CSAT_SUBMIT_LABEL))
1509
- }
1510
- ));
1511
- }, Rs = c.div`display:flex;flex-direction:column;background-color:${({ theme: e }) => e.colors.csat.background};border-radius:16px;gap:16px;padding:24px;`, Ls = c.button`all:unset;background-color:${({ theme: e }) => e.colors.base.primary};color:${({ theme: e }) => e.colors.base.primaryContrastContent};border-radius:6px;padding:10px 20px;display:flex;align-items:center;justify-content:center;cursor:pointer;&:hover{background-color:${d.color.primary.dark};}&:disabled{color:${d.color.ondark03};background-color:${d.themedColor.textDisabled};cursor:not-allowed;}`;
1512
- function Ht(e) {
1513
- return !!e && e < Date.now();
1514
- }
1515
- const Et = it({
1516
- template: Ns,
1517
- components: {
1518
- AdminMessage: Qa,
1519
- CSATMessage: Os
1520
- }
1521
- });
1522
- function Ns(e) {
1523
- const { components: t } = Et.useContext(), r = Sn(() => e.messageType === "admin" ? /* @__PURE__ */ n.createElement(t.AdminMessage, { ...e }) : e.messageType === "admin.csat" ? /* @__PURE__ */ n.createElement(t.CSATMessage, { ...e }) : null);
1524
- return /* @__PURE__ */ n.createElement(Bs, { $marginBottom: dt(e.groupType) }, r);
1525
- }
1526
- const Bs = c.div`padding-inline:${Z}px;margin-bottom:${({ $marginBottom: e }) => e}px;`, Ds = ko``, Ps = Mr(he, bt, Et);
1527
- function Fs({
1528
- appearance: e,
1529
- rootElement: t,
1530
- logger: r,
1531
- language: o,
1532
- stringSet: a,
1533
- children: s,
1534
- messageTemplate: i
1535
- }) {
1536
- var u, m;
1537
- const l = ve(() => {
1538
- const g = {}, { carousel_padding_left: p, carousel_padding_right: h } = (i == null ? void 0 : i.__internalVariables) || {}, f = p, E = h;
1539
- return typeof f == "number" && (g.carousel_padding_left = f), typeof E == "number" && (g.carousel_padding_right = E), Object.keys(g).length > 0 ? g : void 0;
1540
- }, [
1541
- (u = i == null ? void 0 : i.__internalVariables) == null ? void 0 : u.carousel_padding_left,
1542
- (m = i == null ? void 0 : i.__internalVariables) == null ? void 0 : m.carousel_padding_right
1543
- ]);
1544
- return /* @__PURE__ */ n.createElement(mr, { target: t }, /* @__PURE__ */ n.createElement(io, { rootElement: t, logger: r, appearance: e }, /* @__PURE__ */ n.createElement(Co, { rootElement: t, internalVariables: l }, /* @__PURE__ */ n.createElement(bo, { stringSet: a, logger: r, language: o }, /* @__PURE__ */ n.createElement(Ps, null, s, /* @__PURE__ */ n.createElement(Ds, null))))));
1545
- }
1546
- const Wt = {
1547
- key_payment_plan_container: {
1548
- color_variables: {},
1549
- created_at: 1232,
1550
- updated_at: 4563,
1551
- key: "key_payment_plan_container",
1552
- ui_template: {
1553
- body: {
1554
- items: [
1555
- {
1556
- carouselStyle: { maxChildWidth: 265, spacing: 10 },
1557
- items: "{@templates}",
1558
- type: "carouselView",
1559
- viewStyle: { padding: { top: 0, bottom: 0, left: 50, right: 16 } }
1560
- }
1561
- ]
1562
- },
1563
- version: 2
1564
- }
1565
- },
1566
- key_payment_plan: {
1567
- color_variables: {},
1568
- created_at: 123,
1569
- updated_at: 456,
1570
- key: "key_payment_plan",
1571
- ui_template: {
1572
- version: 1,
1573
- body: {
1574
- items: [
1575
- {
1576
- viewStyle: { radius: 16, backgroundColor: "#FFFFFF", borderWidth: "1", borderColor: "#E0E0E0" },
1577
- width: { type: "fixed", value: "264" },
1578
- height: { type: "fixed", value: "275" },
1579
- type: "box",
1580
- layout: "column",
1581
- items: [
1582
- {
1583
- viewStyle: {
1584
- padding: { left: 16, right: 16, top: 16, bottom: 16 },
1585
- backgroundImageUrl: "https://storage-66w.pages.dev/carousel-bg.png"
1586
- },
1587
- action: { type: "web", data: "{action_url}" },
1588
- type: "box",
1589
- layout: "column",
1590
- items: [
1591
- {
1592
- type: "text",
1593
- text: "{header_plan}",
1594
- textStyle: { size: 14, weight: "bold", color: "#FFFFFF" }
1595
- },
1596
- { type: "text", text: "{header_desc}", textStyle: { size: 12, color: "#FFFFFF" } }
1597
- ]
1598
- },
1599
- {
1600
- viewStyle: { padding: { left: 16, right: 16, top: 16, bottom: 16 } },
1601
- action: { type: "web", data: "{action_url}" },
1602
- type: "box",
1603
- layout: "column",
1604
- items: [
1605
- { type: "text", text: "{price}", textStyle: { size: 20, weight: "bold" } },
1606
- {
1607
- viewStyle: { padding: { left: 0, right: 0, top: 16, bottom: 16 } },
1608
- type: "box",
1609
- layout: "column",
1610
- items: [
1611
- {
1612
- viewStyle: { backgroundColor: "#E0E0E0" },
1613
- width: { type: "flex", value: 0 },
1614
- height: { type: "fixed", value: "1" },
1615
- type: "box",
1616
- layout: "column"
1617
- }
1618
- ]
1619
- },
1620
- {
1621
- viewStyle: { margin: { bottom: 8, top: 0, left: 0, right: 0 } },
1622
- type: "text",
1623
- text: "{description}",
1624
- textStyle: { size: 14, weight: "normal", color: "#7F7F7F" }
1625
- }
1626
- ]
1627
- }
1628
- ]
1629
- }
1630
- ]
1631
- }
1632
- }
1633
- },
1634
- key_content_preview: {
1635
- color_variables: {},
1636
- created_at: 1232,
1637
- updated_at: 4563,
1638
- key: "key_content_preview",
1639
- ui_template: {
1640
- version: 1,
1641
- body: {
1642
- items: [
1643
- {
1644
- viewStyle: {
1645
- radius: 16,
1646
- borderWidth: 1,
1647
- borderColor: "#1F000000",
1648
- backgroundColor: "#FFFFFF"
1649
- },
1650
- width: {
1651
- type: "fixed",
1652
- value: 264
1653
- },
1654
- action: { type: "web", data: "{action_url}" },
1655
- type: "box",
1656
- layout: "column",
1657
- items: [
1658
- {
1659
- action: { type: "web", data: "{action_url}" },
1660
- width: {
1661
- type: "flex",
1662
- value: 0
1663
- },
1664
- height: {
1665
- type: "fixed",
1666
- value: 200
1667
- },
1668
- type: "image",
1669
- imageUrl: "{image}",
1670
- imageStyle: {
1671
- contentMode: "aspectFill"
1672
- }
1673
- },
1674
- {
1675
- action: { type: "web", data: "{action_url}" },
1676
- viewStyle: {
1677
- padding: {
1678
- left: 16,
1679
- right: 16,
1680
- top: 16,
1681
- bottom: 16
1682
- }
1683
- },
1684
- type: "box",
1685
- layout: "column",
1686
- items: [
1687
- {
1688
- viewStyle: {
1689
- margin: {
1690
- bottom: 4,
1691
- top: 0,
1692
- left: 0,
1693
- right: 0
1694
- }
1695
- },
1696
- height: {
1697
- type: "fixed",
1698
- value: 16
1699
- },
1700
- type: "text",
1701
- text: "{title}",
1702
- maxTextLines: 1,
1703
- textStyle: {
1704
- size: 14,
1705
- weight: "bold",
1706
- color: "#000000"
1707
- }
1708
- },
1709
- {
1710
- height: {
1711
- type: "fixed",
1712
- value: 16
1713
- },
1714
- type: "text",
1715
- text: "{release_date}",
1716
- maxTextLines: 1,
1717
- textStyle: {
1718
- size: 14,
1719
- weight: "normal",
1720
- color: "#80000000"
1721
- }
1722
- }
1723
- ]
1724
- }
1725
- ]
1726
- }
1727
- ]
1728
- }
1729
- }
1730
- }
1731
- }, [Mn, B] = ee("Agent"), $n = ({ children: e }) => /* @__PURE__ */ n.createElement(Mn.Consumer, null, (t) => t ? e(t) : null);
1732
- function Us({
1733
- children: e,
1734
- state: t,
1735
- enableCloseConversationButton: r = !1,
1736
- enableExpandButton: o = !0,
1737
- enableAutoDisconnectInLauncher: a = !0,
1738
- ...s
1739
- }) {
1740
- const i = Dr(), [l, u] = C(!1), [m, g] = C(!1), p = {
1741
- opened: (t == null ? void 0 : t.opened) ?? l,
1742
- setOpened: (t == null ? void 0 : t.setOpened) ?? u,
1743
- expanded: (t == null ? void 0 : t.expanded) ?? m,
1744
- setExpanded: (t == null ? void 0 : t.setExpanded) ?? g
1745
- };
1746
- return /* @__PURE__ */ n.createElement(
1747
- Mn.Provider,
1748
- {
1749
- value: {
1750
- ...s,
1751
- ...i,
1752
- state: p,
1753
- enableCloseConversationButton: r,
1754
- enableExpandButton: o,
1755
- enableAutoDisconnectInLauncher: a
1756
- }
1757
- },
1758
- e
1759
- );
1760
- }
1761
- const De = {}, q = {
1762
- getItem: (e) => {
1763
- try {
1764
- return localStorage.getItem(e);
1765
- } catch {
1766
- return De[e] ?? null;
1767
- }
1768
- },
1769
- setItem: (e, t) => {
1770
- try {
1771
- localStorage.setItem(e, t);
1772
- } catch {
1773
- De[e] = t;
1774
- }
1775
- },
1776
- deleteItem: (e) => {
1777
- try {
1778
- localStorage.removeItem(e);
1779
- } catch {
1780
- delete De[e];
1781
- }
1782
- },
1783
- getKeys: (e) => {
1784
- try {
1785
- const t = [];
1786
- for (let r = 0; r < localStorage.length; r++) {
1787
- const o = localStorage.key(r);
1788
- o && o.startsWith(e) && t.push(o);
1789
- }
1790
- return t;
1791
- } catch {
1792
- return Object.keys(De).filter((t) => t.startsWith(e));
1793
- }
1794
- }
1795
- }, xt = /iPad|iPhone|iPod/.test(navigator.userAgent), Vs = /Android/.test(navigator.userAgent), Re = (e) => xt || Vs, vt = (e, t) => `${Kr.SESSION}/${e}/${t}`, tt = {
1796
- get: Hs,
1797
- set: Ws,
1798
- clear: zs
1799
- };
1800
- function Hs(e) {
1801
- const t = vt(e.appId, e.aiAgentId), r = q.getItem(t);
1802
- try {
1803
- return r ? JSON.parse(r) : null;
1804
- } catch {
1805
- return null;
1806
- }
1807
- }
1808
- function Ws(e) {
1809
- const t = vt(e.appId, e.aiAgentId), r = JSON.stringify(e.data);
1810
- q.setItem(t, r);
1811
- }
1812
- function zs(e) {
1813
- const t = vt(e.appId, e.aiAgentId);
1814
- q.deleteItem(t);
1815
- }
1816
- function Gs() {
1817
- const { chatSDK: e, logger: t } = B(), { shouldSyncCachedTemplate: r, syncCachedTemplates: o, clearCachedTemplates: a } = gn(), s = W(
1818
- async (l, u) => {
1819
- t.debug("authManager.authenticate: session:", l.userId), u && e.setSessionHandler(new lr(u)), await e.connect(l.userId, l.authToken), t.debug("authManager.authenticate: user:", e.currentUser), r(e) && await o(e);
1820
- },
1821
- [e, t, r, o]
1822
- ), i = W(async () => {
1823
- t.debug("authManager.deauthenticate: disconnect"), await e.disconnect(), a();
1824
- }, [e, t, a]);
1825
- return {
1826
- authenticate: s,
1827
- deauthenticate: i
1828
- };
1829
- }
1830
- const js = 24 * 60 * 60 * 1e3, [Ks, U] = ee("MessengerSession");
1831
- function Zs({
1832
- userSessionInfo: e,
1833
- children: t
1834
- }) {
1835
- const { appId: r, aiAgentId: o, chatSDK: a, agentPreviewConfigs: s, state: i, logger: l, language: u, countryCode: m, context: g, handlers: p } = B(), { updateTheme: h } = je(), { authenticate: f, deauthenticate: E } = Gs(), [x, b] = C(
1836
- void 0
1837
- ), [S, v] = C(void 0), [$, N] = C(null), [w, D] = C(null), [te, y] = C(null), I = (s == null ? void 0 : s.forceCreateChannel) ?? !1;
1838
- function H() {
1839
- if (e) {
1840
- l.debug("messengerSession.initialize: manual session info detected");
1841
- const R = ["userId", "authToken", "sessionHandler"].filter((L) => !(L in e));
1842
- return R.length > 0 && l.error(
1843
- `messengerSession.initialize: missing required keys in userSessionInfo: ${R.join(", ")}`
1844
- ), e;
1845
- }
1846
- const O = tt.get({ appId: r, aiAgentId: o });
1847
- return O ? O.expireAt - js <= Date.now() ? (l.debug("messengerSession.initialize: auto session expired, clear cache"), tt.clear({ appId: r, aiAgentId: o }), null) : (l.debug("messengerSession.initialize: auto session info detected"), O) : null;
1848
- }
1849
- const be = W(async () => {
1850
- if ($) {
1851
- l.debug("messengerSession.refreshActiveChannel: try to refresh active channel"), b(void 0);
1852
- const O = await a.aiAgent.requestMessengerSettings({
1853
- aiAgentId: o,
1854
- userId: $.userId,
1855
- language: u,
1856
- country: m,
1857
- context: g,
1858
- forceCreateChannel: I
1859
- });
1860
- return b({ url: O.active_channel.channel_url, status: j.OPEN }), l.info(
1861
- "messengerSession.refreshActiveChannel: refreshed active channel",
1862
- O.active_channel.channel_url
1863
- ), O.active_channel.channel_url;
1864
- } else
1865
- throw l.error("messengerSession.refreshActiveChannel: userSession is not ready"), new Error("userSession is not ready");
1866
- }, [a, o, $ == null ? void 0 : $.userId, u, m, g, I]);
1867
- return cn(a, {
1868
- onChannelChanged: (O) => {
1869
- var R;
1870
- O.isGroupChannel() && O.url === (x == null ? void 0 : x.url) && (l.info("messengerSession.channelChanged: channel.conversation", O.conversation), b({ url: O.url, status: ((R = O.conversation) == null ? void 0 : R.status) ?? j.OPEN }));
1871
- },
1872
- async onUserJoined(O, R) {
1873
- var Y, Ee;
1874
- if (O.conversation && O.conversation.type === fr.PROACTIVE && R.userId === ((Y = a.currentUser) == null ? void 0 : Y.userId)) {
1875
- l.info("messengerSession.onUserJoined: proactive channel joined", O.url);
1876
- const Te = ((Ee = O.conversation) == null ? void 0 : Ee.status) ?? j.OPEN;
1877
- b({ url: O.url, status: Te }), i.setOpened(!0), Ys({
1878
- sound: document.hidden || !i.opened
1879
- });
1880
- }
1881
- }
1882
- }), P(() => {
1883
- async function O() {
1884
- l.debug("messengerSession.initialize: start");
1885
- const R = H(), L = await a.aiAgent.requestMessengerSettings({
1886
- aiAgentId: o,
1887
- userId: R == null ? void 0 : R.userId,
1888
- language: u,
1889
- country: m,
1890
- context: g,
1891
- forceCreateChannel: I
1892
- });
1893
- l.debug("messengerSession.initialize: messenger settings response", L);
1894
- let Y = null;
1895
- if (L.auto_created_user) {
1896
- const { user_id: z, session_token: ne, expire_at: Se } = L.auto_created_user;
1897
- tt.set({ appId: r, aiAgentId: o, data: { userId: z, authToken: ne, expireAt: Se } }), Y = { userId: z, authToken: ne };
1898
- } else
1899
- Y = {
1900
- userId: (R == null ? void 0 : R.userId) ?? "",
1901
- authToken: (R == null ? void 0 : R.authToken) ?? ""
1902
- };
1903
- function Ee() {
1904
- const z = L.appearance.selected_theme;
1905
- h(z, (Se) => {
1906
- const le = L.appearance.themes[Se ?? z];
1907
- return {
1908
- primary: le.primary_color,
1909
- botMessageBackground: le.bot_message_bg_color,
1910
- primaryContrast: le.primary_contrast_color,
1911
- botMessageBackgroundContrast: le.bot_message_bg_contrast_color
1912
- };
1913
- }), v(void 0), N(Y), D({
1914
- userId: L.bot.bot_userid,
1915
- profileUrl: L.bot.bot_profile_url,
1916
- nickname: L.bot.bot_nickname,
1917
- replyToFile: L.bot.reply_to_file,
1918
- specialNotice: L.bot.special_notice,
1919
- specialNoticeEnabled: L.bot.is_special_notice_enabled,
1920
- showHandoffButton: L.bot.show_handoff_button ?? !0
1921
- }), y({
1922
- type: L.launcher.image_type || "default_icon",
1923
- imageUrl: L.launcher.image_url
1924
- }), L.launcher.auto_open && !Re() && setTimeout(() => i.setOpened(!0), 500);
1925
- }
1926
- function Te() {
1927
- b({ url: L.active_channel.channel_url, status: j.OPEN });
1928
- }
1929
- try {
1930
- Ee(), await f(Y, e == null ? void 0 : e.sessionHandler), Te();
1931
- } catch (z) {
1932
- z instanceof Error && (l.error("messengerSession.initialize: failed to connect", z), v(z));
1933
- }
1934
- }
1935
- O().catch((R) => {
1936
- l.error("messengerSession: failed to initialize", R);
1937
- });
1938
- }, [a, o, e == null ? void 0 : e.userId, e == null ? void 0 : e.authToken]), P(() => {
1939
- p != null && p.onRegisterDeauthenticateHandler && (l.debug("messengerSession: registering deauthenticate handler"), p.onRegisterDeauthenticateHandler(E));
1940
- }, [p == null ? void 0 : p.onRegisterDeauthenticateHandler, E]), !$ || !w || !te ? null : /* @__PURE__ */ n.createElement(
1941
- Ks.Provider,
1942
- {
1943
- value: {
1944
- userSession: $,
1945
- activeChannel: x,
1946
- refreshActiveChannel: be,
1947
- connectionError: S,
1948
- aiAgentInfo: { ...w, ...s == null ? void 0 : s.bot },
1949
- launcherInfo: { ...te, ...s == null ? void 0 : s.launcher }
1950
- }
1951
- },
1952
- t
1953
- );
1954
- }
1955
- function Ys({ sound: e }) {
1956
- const t = "🔔You have received a new message", r = document.title, o = setInterval(() => {
1957
- document.title = document.title === t ? r : t;
1958
- }, 750);
1959
- setTimeout(() => clearInterval(o), 5e3), e && import("./DP0MwObA.js").then((a) => {
1960
- new Audio(a.default).play();
1961
- });
1962
- }
1963
- const zt = {
1964
- file: "attach",
1965
- snippet: "snippet",
1966
- site: "website",
1967
- sb_sprinklr: "sprinklr",
1968
- sb_salesforce: "salesforce",
1969
- sb_confluence: "confluence",
1970
- sb_zendesk: "zendesk",
1971
- sb_desk: "snippet"
1972
- // TODO: request icon
1973
- }, qs = ({
1974
- actionbook: e,
1975
- functionCalls: t,
1976
- groundedness: r,
1977
- agentMessageTemplates: o,
1978
- onClickActionbook: a,
1979
- onClickFunctionCall: s,
1980
- onClickFunctionCallDetail: i,
1981
- onClickGroundedness: l,
1982
- onClickAgentMessageTemplate: u,
1983
- bottomContent: m,
1984
- renderCustomGroundednessIcon: g = (h) => h.default,
1985
- style: p = {}
1986
- }) => {
1987
- const {
1988
- // Note: This component is used with the dashboard, so cssVars should not be used.
1989
- iconColor: h = "#000000",
1990
- textColor: f = "#000000",
1991
- highlightColor: E = me.DEFAULT_PRIMARY
1992
- } = p;
1993
- return /* @__PURE__ */ n.createElement(Gt, null, e && /* @__PURE__ */ n.createElement(Gt, null, /* @__PURE__ */ n.createElement(Ge, null, /* @__PURE__ */ n.createElement(Fe, null, /* @__PURE__ */ n.createElement(A, { size: 16, type: "actionbook", color: h })), /* @__PURE__ */ n.createElement(
1994
- Pe,
1995
- {
1996
- $clickable: !!a,
1997
- $highlightColor: E,
1998
- variant: "body2",
1999
- color: f,
2000
- onClick: () => a == null ? void 0 : a(e)
2001
- },
2002
- e.name
2003
- ))), t == null ? void 0 : t.map((x) => /* @__PURE__ */ n.createElement(nt, { key: x.key }, /* @__PURE__ */ n.createElement(Fe, null, /* @__PURE__ */ n.createElement(A, { size: 16, type: "function", color: h })), /* @__PURE__ */ n.createElement(Ge, null, /* @__PURE__ */ n.createElement(
2004
- Pe,
2005
- {
2006
- $clickable: !!a,
2007
- $highlightColor: E,
2008
- variant: "body2",
2009
- color: f,
2010
- onClick: () => s == null ? void 0 : s(x)
2011
- },
2012
- x.name
2013
- ), /* @__PURE__ */ n.createElement(Xs, { role: "button", onClick: () => i == null ? void 0 : i(x) }, /* @__PURE__ */ n.createElement(T, { variant: "body2", color: E }, "View details"), /* @__PURE__ */ n.createElement(A, { type: "chevron-right", size: 16, color: E }))))), r == null ? void 0 : r.map((x) => /* @__PURE__ */ n.createElement(nt, { key: x.id }, /* @__PURE__ */ n.createElement(Fe, null, g({
2014
- default: /* @__PURE__ */ n.createElement(A, { size: 16, type: zt[x.source_type] ?? zt.snippet, color: h }),
2015
- sourceType: x.source_type
2016
- })), /* @__PURE__ */ n.createElement(
2017
- Pe,
2018
- {
2019
- $clickable: !!l,
2020
- $highlightColor: E,
2021
- variant: "body2",
2022
- color: f,
2023
- onClick: () => l == null ? void 0 : l(x)
2024
- },
2025
- x.preview_title
2026
- ))), o == null ? void 0 : o.map((x) => /* @__PURE__ */ n.createElement(nt, { key: x.key }, /* @__PURE__ */ n.createElement(Fe, null, /* @__PURE__ */ n.createElement(A, { size: 16, type: "template", color: h })), /* @__PURE__ */ n.createElement(
2027
- Pe,
2028
- {
2029
- $clickable: !!u,
2030
- $highlightColor: E,
2031
- variant: "body2",
2032
- color: f,
2033
- onClick: () => u == null ? void 0 : u(x)
2034
- },
2035
- x.name
2036
- ))), m);
2037
- }, Js = c(T)`font-weight:400;`, Pe = c(Js)`${({ $clickable: e, $highlightColor: t }) => e && k`
2038
- cursor: pointer;
2039
- text-decoration: underline;
2040
- &:hover {
2041
- color: ${t};
2042
- }
2043
- `}
2044
- `, Fe = c.div`display:flex;align-items:center;justify-content:center;flex-shrink:0;`, Ge = c.div`display:flex;gap:8px;align-items:center;`, Xs = c(Ge)`cursor:pointer;gap:4px;`, nt = c(Ge)`flex-direction:row;align-items:center;`, Gt = c.div`display:flex;gap:4px;flex-direction:column;align-items:flex-start;`, On = _e(
2045
- null
2046
- );
2047
- function Qs({
2048
- isDashboardActionbookTester: e = !1,
2049
- children: t
2050
- }) {
2051
- return /* @__PURE__ */ n.createElement(On.Provider, { value: { isDashboardActionbookTester: e } }, e && /* @__PURE__ */ n.createElement(ei, null), t);
2052
- }
2053
- const Xe = () => {
2054
- const e = X(On);
2055
- if (!e) throw new Error("_UNSAFE_INTERNAL_DashboardActionbookTesterProvider not found");
2056
- return e;
2057
- }, ei = () => /* @__PURE__ */ n.createElement(he.Template, { template: ti }, /* @__PURE__ */ n.createElement(he.MessageLogs, { component: ni })), ti = (e) => /* @__PURE__ */ n.createElement(kn, { ...e, testerMode: !0, maxBodyWidth: xn }), ni = ({ extendedMessagePayload: e = {} }) => {
2058
- const { handlers: t } = B(), { manual: r, groundedness: o, function_calls: a, agent_message_templates: s, is_thinking: i } = e;
2059
- return i || !r && !o && !a && !s ? /* @__PURE__ */ n.createElement(n.Fragment, null) : /* @__PURE__ */ n.createElement(ri, null, /* @__PURE__ */ n.createElement(oi, { width: 4 }), /* @__PURE__ */ n.createElement(
2060
- qs,
2061
- {
2062
- actionbook: r,
2063
- functionCalls: a,
2064
- groundedness: o,
2065
- agentMessageTemplates: s,
2066
- onClickFunctionCallDetail: t == null ? void 0 : t.onFunctionCallDetailClick,
2067
- style: {
2068
- iconColor: d.themedColor.textHighEmphasis,
2069
- textColor: d.themedColor.textHighEmphasis,
2070
- barColor: d.themedColor.textDisabled
2071
- },
2072
- bottomContent: /* @__PURE__ */ n.createElement(ai, { variant: "caption2", color: d.themedColor.textLowEmphasis }, "Only visible in the tester")
2073
- }
2074
- ));
2075
- }, ri = c.div`display:flex;gap:16px;margin:16px ${Z}px 0;align-self:stretch;`, oi = c.div`width:${({ width: e }) => e}px;background-color:${d.themedColor.textDisabled};border-radius:100px;flex-shrink:0;`, ai = c(T)`margin-top:5px;`;
2076
- function Rn({
2077
- rootElement: e = document.body,
2078
- logLevel: t = an.WARN,
2079
- language: r = navigator.language,
2080
- userSessionInfo: o,
2081
- children: a,
2082
- ...s
2083
- }) {
2084
- var i;
2085
- return xe.level !== t && (xe.level = t), xo("https://fonts.googleapis.com/css2?family=Roboto&display=swap", e), /* @__PURE__ */ n.createElement("div", { id: Q.ENTRY, style: { width: "fit-content", height: "fit-content" } }, /* @__PURE__ */ n.createElement(Vr, { logger: xe, storage: si }, /* @__PURE__ */ n.createElement(
2086
- Fs,
2087
- {
2088
- logger: xe,
2089
- rootElement: e,
2090
- appearance: (i = s.agentPreviewConfigs) == null ? void 0 : i.appearance,
2091
- stringSet: s.stringSet,
2092
- language: r,
2093
- messageTemplate: s.messageTemplate
2094
- },
2095
- /* @__PURE__ */ n.createElement(
2096
- Pr,
2097
- {
2098
- appId: s.appId,
2099
- aiAgentId: s.aiAgentId,
2100
- language: r,
2101
- countryCode: s.countryCode,
2102
- context: s.context,
2103
- logger: xe,
2104
- chatParams: { customApiHost: s.customApiHost, customWebSocketHost: s.customWebSocketHost }
2105
- },
2106
- /* @__PURE__ */ n.createElement(Us, { rootElement: e, ...s }, /* @__PURE__ */ n.createElement(Zs, { userSessionInfo: o }, /* @__PURE__ */ n.createElement(
2107
- Qs,
2108
- {
2109
- isDashboardActionbookTester: s._UNSAFE_INTERNAL_isActionbookTester
2110
- },
2111
- a,
2112
- /* @__PURE__ */ n.createElement("div", { id: Q.MODAL_ROOT })
2113
- )))
2114
- )
2115
- )));
2116
- }
2117
- const xe = new pn(an.WARN), cd = new un(xe), yt = "@sba/message-template", jt = (e) => `${yt}/templates/${e}`, Kt = () => `${yt}/token`, si = Fr({
2118
- onSetTemplate: (e, t) => {
2119
- Wt[e] || q.setItem(jt(e), t);
2120
- },
2121
- onGetTemplate: (e) => {
2122
- const t = Wt[e];
2123
- return t ? JSON.stringify(t) : q.getItem(jt(e));
2124
- },
2125
- onSetCachedToken(e) {
2126
- q.setItem(Kt(), e);
2127
- },
2128
- onGetCachedToken() {
2129
- return q.getItem(Kt());
2130
- },
2131
- onClear: () => {
2132
- q.getKeys(yt).forEach(q.deleteItem);
2133
- }
2134
- }), Ln = ({ children: e, isOpened: t }) => {
2135
- const { dir: r, rootElement: o } = B(), a = pe(o, !0);
2136
- return P(() => {
2137
- const s = "sb-agent-block-scroll";
2138
- return t ? a.body.classList.add(s) : a.body.classList.remove(s), () => {
2139
- a.body.classList.remove(s);
2140
- };
2141
- }, [a, t]), /* @__PURE__ */ n.createElement(ii, { dir: r, $visible: t }, e);
2142
- }, ii = c.div`width:100%;height:100%;position:fixed;top:0;left:0;z-index:${fe.WINDOW};visibility:${({ $visible: e }) => e ? "visible" : "hidden"};`;
2143
- function li({
2144
- className: e,
2145
- isOpened: t,
2146
- onClick: r,
2147
- type: o,
2148
- imageUrl: a,
2149
- dir: s,
2150
- animated: i = !0,
2151
- backgroundColor: l
2152
- }) {
2153
- const u = We(l);
2154
- return /* @__PURE__ */ n.createElement(
2155
- ui,
2156
- {
2157
- dir: s,
2158
- id: Q.LAUNCHER,
2159
- className: e,
2160
- "aria-label": "Sendbird AIAgent Launcher",
2161
- onClick: r,
2162
- $animated: i,
2163
- $backgroundColor: l
2164
- },
2165
- /* @__PURE__ */ n.createElement(mi, { $isOpened: t, $animated: i, $fillColor: u }, /* @__PURE__ */ n.createElement(Zt.Open, { url: a, isDefaultIcon: o === "default_icon" })),
2166
- /* @__PURE__ */ n.createElement(pi, { $isOpened: t, $animated: i, $fillColor: u }, /* @__PURE__ */ n.createElement(Zt.Close, null))
2167
- );
2168
- }
2169
- const ci = k`&:hover{transition:transform 250ms cubic-bezier(0.33,0,0,1);transform:scale(1.1);}&:active{transform:scale(0.8);}`, di = k`img{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-webkit-user-drag:none;&[data-default-icon='true']{width:32px;height:32px;filter:${({ $fillColor: e }) => e === me.WHITE ? "grayscale(100%) brightness(2000%)" : "grayscale(100%) invert(100%) saturate(0%) brightness(0%) contrast(1000%)"};}}`, Nn = k`svg{width:32px;height:32px;${({ $fillColor: e }) => k`
2170
- path {
2171
- fill: ${e};
2172
- }
2173
- [class*='fill'] {
2174
- fill: ${e};
2175
- }
2176
- `}
2177
- }
2178
- `, ui = c.button`position:relative;padding:0;width:48px;height:48px;background:${({ $backgroundColor: e }) => e};border-radius:50%;transition:all 0.3s cubic-bezier(0.31,-0.105,0.43,1.4);border:none;display:flex;justify-content:center;align-items:center;box-shadow:0 16px 24px 2px rgba(33,33,33,0.12),0 6px 30px 5px rgba(33,33,33,0.08),0 6px 10px -5px rgba(33,33,33,0.04);${({ $animated: e }) => e && ci}`, Bn = c.span`position:absolute;width:100%;height:100%;border-radius:50%;overflow:hidden;transition:transform 0.16s linear,opacity 0.08s linear,scale 0.16s linear;user-select:none;display:flex;justify-content:center;align-items:center;`, mi = c(Bn)`opacity:${({ $isOpened: e }) => e ? 0 : 1};transform:${({ $animated: e, $isOpened: t }) => e && (t ? "rotate(-90deg) scale(0)" : "rotate(0deg)")};${di}${Nn}`, pi = c(Bn)`scale:${({ $isOpened: e }) => e ? 1 : 0};transform:${({ $animated: e, $isOpened: t }) => e && (t ? "rotate(0deg)" : "rotate(-90deg)")};${Nn}`, Zt = {
2179
- Open: (e) => e.url ? /* @__PURE__ */ n.createElement("img", { src: e.url, alt: "launcher-img", "data-default-icon": e.isDefaultIcon }) : /* @__PURE__ */ n.createElement(pt, null),
2180
- Close: () => /* @__PURE__ */ n.createElement(A, { size: 32, type: "chevron-down" })
2181
- };
2182
- function Dn({ className: e }) {
2183
- const { colors: t } = st(), { dir: r, state: o } = B(), { launcherInfo: a } = U();
2184
- return hi(), /* @__PURE__ */ n.createElement(
2185
- li,
2186
- {
2187
- dir: r,
2188
- className: e,
2189
- isOpened: o.opened,
2190
- onClick: () => o.setOpened(!o.opened),
2191
- type: a.type,
2192
- imageUrl: a.imageUrl,
2193
- backgroundColor: t.base.primary
2194
- }
2195
- );
2196
- }
2197
- const gi = 1e3 * 60;
2198
- function hi() {
2199
- const { chatSDK: e, state: t, logger: r, enableAutoDisconnectInLauncher: o } = B(), a = F(null);
2200
- P(() => {
2201
- if (!o) return;
2202
- function s() {
2203
- a.current && (clearTimeout(a.current), a.current = null);
2204
- }
2205
- function i() {
2206
- e.connectionState === cr.CLOSED && (e.reconnect(), r.debug("useSDKInactivityTimeout: reconnected")), s(), r.debug("useSDKInactivityTimeout: clear disconnect schedule");
2207
- }
2208
- function l() {
2209
- s(), a.current = setTimeout(async () => {
2210
- await e.disconnectWebSocket(), r.debug("useSDKInactivityTimeout: disconnected");
2211
- }, gi);
2212
- }
2213
- t.opened ? i() : (l(), r.debug("useSDKInactivityTimeout: schedule disconnect"));
2214
- }, [o, e, t.opened]);
2215
- }
2216
- const fi = ({ publishSynchronous: e = !1 }) => {
2217
- const t = /* @__PURE__ */ new Set();
2218
- return {
2219
- publish: (r) => {
2220
- t.forEach((o) => {
2221
- e ? o(r) : setTimeout(() => o(r), 0);
2222
- });
2223
- },
2224
- subscribe: (r) => (t.add(r), () => t.delete(r))
2225
- };
2226
- };
2227
- function bi(e, t = []) {
2228
- const r = F(null), o = F(0), a = F(0), [s] = C(() => fi({ publishSynchronous: !0 })), [i, l] = C(!0);
2229
- return ye(() => {
2230
- o.current = 0, a.current = 0, l(!0), r.current && (r.current.scrollTop = r.current.scrollHeight);
2231
- }, t), ye(() => s.subscribe(({ type: u, data: m }) => {
2232
- const { resolve: g, animated: p } = m ?? {};
2233
- if (!r.current) return g == null ? void 0 : g();
2234
- if (u === "scrollToBottom" && (r.current.scroll ? r.current.scroll({
2235
- top: r.current.scrollHeight,
2236
- behavior: Yt(e, p)
2237
- }) : r.current.scrollTop = r.current.scrollHeight, a.current = 0, l(!0), g == null || g()), u === "scroll") {
2238
- const h = m == null ? void 0 : m.top, { scrollTop: f, scrollHeight: E, clientHeight: x } = r.current;
2239
- r.current.scroll ? r.current.scroll({ top: h, behavior: Yt(e, p) }) : typeof h == "number" && (r.current.scrollTop = h), a.current = Math.max(0, E - f - x), l(a.current === 0), g == null || g();
2240
- }
2241
- }), [e]), {
2242
- scrollRef: r,
2243
- scrollPubSub: s,
2244
- isScrollBottomReached: i,
2245
- setIsScrollBottomReached: l,
2246
- scrollDistanceFromBottomRef: a,
2247
- scrollPositionRef: o
2248
- };
2249
- }
2250
- function Yt(e, t) {
2251
- return typeof t == "boolean" ? t ? "smooth" : "auto" : e;
2252
- }
2253
- function Ei(e) {
2254
- return new Promise((t) => {
2255
- const r = new Image();
2256
- r.onload = function() {
2257
- const o = String(r.width), a = String(r.height);
2258
- URL.revokeObjectURL(r.src), t({ width: o, height: a });
2259
- }, r.src = URL.createObjectURL(e);
2260
- });
2261
- }
2262
- async function xi(e) {
2263
- if ("file" in e && e.file instanceof File && e.file.type.startsWith("image/")) {
2264
- const { width: t, height: r } = await Ei(e.file);
2265
- return new Sr({
2266
- key: Pn,
2267
- value: [t, r]
2268
- });
2269
- }
2270
- }
2271
- const Pn = "KEY_IMG_ASPECT_RATIO", vi = ({ onScroll: e }) => {
2272
- const { agentPreviewConfigs: t, handlers: r } = B(), o = F(t == null ? void 0 : t.agentAttributes);
2273
- return o.current = t == null ? void 0 : t.agentAttributes, {
2274
- onBeforeSendMessage: async (a) => {
2275
- var g, p;
2276
- const s = await xi(a), i = {
2277
- ...a,
2278
- metaArrays: s ? [s] : void 0
2279
- }, l = ((g = o.current) == null ? void 0 : g.ai) ?? {}, u = ((p = o.current) == null ? void 0 : p.safeguard) ?? {};
2280
- return Object.keys(l).length > 0 || Object.keys(u).length > 0 ? { ...i, data: JSON.stringify({ ai_attrs: l, safeguard_attrs: u }) } : i;
2281
- },
2282
- onAfterSendMessage: (a) => {
2283
- var s;
2284
- e(), (s = r == null ? void 0 : r.onMessageSend) == null || s.call(r, a.message);
2285
- }
2286
- };
2287
- }, [yi, K] = ee("Conversation");
2288
- function Ci({
2289
- children: e,
2290
- closedChannelUrl: t,
2291
- onClearClosedChannelUrl: r,
2292
- onNavigateToConversationList: o
2293
- }) {
2294
- const { logger: a, chatSDK: s, dispatcher: i } = B(), { activeChannel: l, refreshActiveChannel: u } = U(), m = t || (l == null ? void 0 : l.url), g = async () => {
2295
- await u(), t && (r == null || r());
2296
- }, p = bi("smooth"), h = () => {
2297
- setTimeout(() => p.scrollPubSub.publish({ type: "scrollToBottom" }), 25);
2298
- }, { onBeforeSendMessage: f, onAfterSendMessage: E } = vi({ onScroll: h }), [x, b] = C(), [S, v] = C(), $ = Hr(s, x, {
2299
- shouldCountNewMessages: () => !1,
2300
- onChannelDeleted: () => g(),
2301
- onMessagesReceived: h,
2302
- onMessagesUpdated: h,
2303
- logger: a
2304
- });
2305
- async function N() {
2306
- if (a.debug("conversation.fetchChannel: start"), b(void 0), v(void 0), m)
2307
- try {
2308
- a.debug("conversation.fetchChannel: get channel", m);
2309
- const w = await s.groupChannel.getChannel(m);
2310
- b(w);
2311
- const D = new sn({ onReconnectSucceeded: () => w.refresh() });
2312
- s.addConnectionHandler("sba-refresh", D), a.debug("conversation.fetchChannel: fetched channel", w);
2313
- } catch (w) {
2314
- w instanceof on && v(w), a.error("conversation.fetchChannel: error", w);
2315
- }
2316
- }
2317
- return P(() => {
2318
- N();
2319
- }, [m]), P(() => {
2320
- const w = async () => {
2321
- a.debug("conversation.dispatcher: try to close conversation", x), x != null && x.conversation && ht(x) && (await x.closeConversation(), await u());
2322
- };
2323
- return i.subscribe(rt.ConversationClose, w), () => {
2324
- i.unsubscribe(rt.ConversationClose, w);
2325
- };
2326
- }, [i, x, u]), /* @__PURE__ */ n.createElement(
2327
- yi.Provider,
2328
- {
2329
- value: {
2330
- channel: x,
2331
- channelFetchError: S,
2332
- fetchChannel: N,
2333
- dataSource: $,
2334
- scrollSource: p,
2335
- goToActiveConversation: g,
2336
- onBeforeSendMessage: f,
2337
- onAfterSendMessage: E,
2338
- onNavigateToConversationList: o
2339
- }
2340
- },
2341
- e
2342
- );
2343
- }
2344
- const Ct = _e({
2345
- onDrop: ze,
2346
- subscribe: () => ze
2347
- }), ot = ({ children: e }) => {
2348
- const t = F(/* @__PURE__ */ new Set());
2349
- return /* @__PURE__ */ n.createElement(
2350
- Ct.Provider,
2351
- {
2352
- value: {
2353
- onDrop: (r) => {
2354
- var o;
2355
- if (r.preventDefault(), (o = r.dataTransfer) != null && o.files) {
2356
- const a = Array.from(r.dataTransfer.files);
2357
- a.length > 0 && t.current.forEach((s) => s(a));
2358
- }
2359
- },
2360
- subscribe: (r) => (t.current.add(r), () => t.current.delete(r))
2361
- }
2362
- },
2363
- e
2364
- );
2365
- }, _i = ({ onDropFiles: e }) => {
2366
- const { subscribe: t } = X(Ct);
2367
- P(() => t(e), [e]);
2368
- };
2369
- ot.Consumer = ({ children: e }) => {
2370
- const { onDrop: t } = X(Ct);
2371
- return e({ onDrop: t, onDragOver: (a) => a.preventDefault() });
2372
- };
2373
- const dd = ({ iconSize: e = 64, icon: t, className: r, label: o, children: a }) => /* @__PURE__ */ n.createElement(Si, { className: r }, /* @__PURE__ */ n.createElement(A, { type: t, size: e, color: d.themedColor.onbackground3 }), /* @__PURE__ */ n.createElement(T, { variant: "body1", color: d.themedColor.onbackground2 }, o), a), Ti = c.div`position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:100%;`, Si = c.div`display:flex;flex-direction:column;min-height:104px;align-items:center;gap:20px;text-align:center;`, ki = {
2374
- loading: _(() => import("./DnKaqbmp.js")),
2375
- error: _(() => import("./DfJKEre2.js")),
2376
- noChannels: _(() => import("./BLrqIqwk.js")),
2377
- noMessages: _(() => import("./DAMSBm7t.js"))
2378
- }, Ce = ({ className: e, type: t = "loading", ...r }) => {
2379
- const o = ki[t];
2380
- return /* @__PURE__ */ n.createElement(Ti, { className: e }, /* @__PURE__ */ n.createElement(Ae, { fallback: null }, /* @__PURE__ */ n.createElement(o, { ...r })));
2381
- }, _t = {
2382
- isStreaming(e) {
2383
- const t = Dt(e.data);
2384
- return typeof t == "object" ? !!t.stream : !1;
2385
- },
2386
- isWelcomeMessage(e, t) {
2387
- var r;
2388
- if (((r = e.extendedMessagePayload) == null ? void 0 : r.bot_message_type) === "welcome")
2389
- return !0;
2390
- if ((e.isUserMessage() || e.isFileMessage()) && e.sender.userId === t) {
2391
- const o = Dt(e.data);
2392
- return !(o != null && o.respond_mesg_id) && !(o != null && o.stream);
2393
- }
2394
- return !1;
2395
- }
2396
- };
2397
- function wi(e) {
2398
- return "sendingStatus" in e ? e.sendingStatus === "succeeded" ? String(e.messageId) : e.reqId : String(e.messageId);
2399
- }
2400
- const Ai = (e, t, r, o = !0) => {
2401
- if (!o || !e.isUserMessage() && !e.isFileMessage())
2402
- return "single";
2403
- const a = () => {
2404
- if (!t || !t.isUserMessage() && !t.isFileMessage()) return !1;
2405
- const u = t.sender.userId === e.sender.userId, m = At(t.createdAt, e.createdAt);
2406
- return u && m;
2407
- }, s = () => {
2408
- if (!r || !r.isUserMessage() && !r.isFileMessage()) return !1;
2409
- const u = r.sender.userId === e.sender.userId, m = At(r.createdAt, e.createdAt);
2410
- return u && m;
2411
- }, i = a(), l = s();
2412
- return i && l ? "middle" : i ? "bottom" : l ? "top" : "single";
2413
- };
2414
- function Ii(e, t) {
2415
- return e.filter((r) => _t.isWelcomeMessage(r, t));
2416
- }
2417
- function Fn(e, t) {
2418
- return Mi(e) === t;
2419
- }
2420
- function Mi(e) {
2421
- var t;
2422
- if (e)
2423
- return e.isUserMessage() || e.isFileMessage() || e.isMultipleFilesMessage() ? e.sender.userId : ((t = e == null ? void 0 : e.sender) == null ? void 0 : t.userId) ?? void 0;
2424
- }
2425
- function $i(e) {
2426
- return e.isAdminMessage() ? e.message === "The channel's custom_type was updated." : !1;
2427
- }
2428
- const qt = (e) => !!e && "sender" in e, Un = (e) => e.startsWith("image/"), Vn = (e) => e.startsWith("video/"), Jt = (e) => Un(e) || Vn(e), Ue = {
2429
- isAdmin: (e) => e.isAdminMessage(),
2430
- isCSAT: (e) => {
2431
- var t;
2432
- return e.isAdminMessage() && !!((t = e.extendedMessagePayload) != null && t.csat);
2433
- },
2434
- isIncoming: (e, t) => qt(e) && e.sender.userId !== t,
2435
- isOutgoing: (e, t) => qt(e) && (e.sender.userId === t || e.sendingStatus === kr.PENDING)
2436
- }, Hn = ({ rootElementId: e, visible: t, onClose: r, children: o }) => {
2437
- if (!t) return null;
2438
- const { rootElement: a } = B(), s = pe(a), i = pe(a, !0);
2439
- return Ar(
2440
- /* @__PURE__ */ n.createElement(Oi, { onClick: r }, /* @__PURE__ */ n.createElement(Ri, { onClick: (l) => l.stopPropagation() }, o)),
2441
- s.getElementById(e) ?? s.getElementById(Q.MODAL_ROOT) ?? i.body
2442
- );
2443
- }, Oi = c.div`position:fixed;top:0;left:0;width:100%;height:100%;background:${d.color.overlay01};display:flex;justify-content:center;align-items:center;z-index:${fe.MODAL};`, Ri = c.div`border-radius:4px;overflow:hidden;box-shadow:0 16px 24px 2px rgba(13,13,13,0.12),0 6px 30px 5px rgba(13,13,13,0.08),0 6px 10px -5px rgba(13,13,13,0.04);z-index:${fe.MODAL};`, Li = c.div`flex-shrink:0;width:${({ $size: e }) => ge(e)};height:${({ $size: e }) => ge(e)};background-color:${({ theme: e }) => e.colors.base.primary};box-sizing:border-box;padding:6px;border-radius:50%;display:flex;justify-content:center;align-items:center;}`, Ni = c(pt)`path{fill:${({ theme: e }) => We(e.colors.base.primary)};}`;
2444
- function Wn({ size: e }) {
2445
- const { aiAgentInfo: t } = U();
2446
- return t.profileUrl ? /* @__PURE__ */ n.createElement(gt, { size: e, src: t.profileUrl }) : /* @__PURE__ */ n.createElement(Li, { $size: e }, /* @__PURE__ */ n.createElement(Ni, null));
2447
- }
2448
- const Bi = c.div`width:100%;height:100%;position:fixed;top:0;left:0;outline:none;`, Di = c.div`height:64px;min-height:64px;box-sizing:border-box;display:flex;justify-content:space-between;border-bottom:1px solid ${d.themedColor.onbackground4};background-color:${d.themedColor.background1};@media screen and (max-width:768px){position:relative;}`, Pi = c.div`box-sizing:border-box;display:flex;flex-direction:row;align-items:center;height:64px;padding:16px 20px;width:calc(100% - 128px);`, Fi = c.div`margin-inline-end:8px;`, Ui = c.div`max-width:500px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:inline-block;@media screen and (max-width:768px){position:absolute;inset-inline-start:64px;top:10px;display:block;max-width:calc(100vw - 240px);}`, Vi = c.div`display:inline-block;margin-inline-start:8px;padding-top:5px;@media screen and (max-width:768px){position:absolute;inset-inline-start:56px;top:24px;}`, Hi = c.div`display:flex;width:160px;justify-content:flex-end;`, Wi = c.div`inset-inline-end:0;display:flex;flex-direction:row;`, at = c.div`width:64px;padding:21px;box-sizing:border-box;cursor:${(e) => e.disabled ? "not-allowed" : "pointer"};`, zi = c(at)`border-inline-start:1px solid ${d.themedColor.onbackground4};`, Gi = c.div`width:100%;height:100%;display:flex;align-items:center;justify-content:center;`, ji = c.video`max-width:100%;max-height:100%;user-select:none;-webkit-user-drag:none;`, Ki = c.img`max-width:90%;max-height:90%;user-select:none;-webkit-user-drag:none;`, Zi = c.div`max-width:100%;max-height:100%;display:flex;justify-content:center;align-items:center;`, Yi = ({ message: e, onClose: t, onDownloadClick: r }) => {
2449
- const { sender: o, type: a, url: s, name: i = "", threadInfo: l } = e, { profileUrl: u, nickname: m, userId: g } = o, { userSession: p, aiAgentInfo: h } = U();
2450
- return /* @__PURE__ */ n.createElement(
2451
- Ji,
2452
- {
2453
- profileUrl: u,
2454
- nickname: m,
2455
- type: a,
2456
- url: s,
2457
- name: i,
2458
- onClose: t,
2459
- isBotMessage: g === h.userId,
2460
- isByMe: p.userId === g,
2461
- disableDelete: l != null && l.replyCount ? l.replyCount > 0 : !1,
2462
- onDownloadClick: r
2463
- }
2464
- );
2465
- }, qi = ({ profileUrl: e, isBotMessage: t }) => !e && t ? /* @__PURE__ */ n.createElement(Wn, { size: 32 }) : /* @__PURE__ */ n.createElement(gt, { size: 32, src: e }), Ji = ({
2466
- profileUrl: e,
2467
- isBotMessage: t,
2468
- nickname: r,
2469
- name: o,
2470
- type: a,
2471
- url: s,
2472
- isByMe: i,
2473
- onClose: l,
2474
- onDelete: u,
2475
- disableDelete: m,
2476
- onDownloadClick: g
2477
- }) => {
2478
- const { stringSet: p } = M();
2479
- return /* @__PURE__ */ n.createElement(Hn, { onClose: l, visible: !0, rootElementId: Q.MODAL_ROOT }, /* @__PURE__ */ n.createElement(Bi, null, /* @__PURE__ */ n.createElement(Di, null, /* @__PURE__ */ n.createElement(Pi, null, /* @__PURE__ */ n.createElement(Fi, null, /* @__PURE__ */ n.createElement(qi, { profileUrl: e, isBotMessage: t })), /* @__PURE__ */ n.createElement(Ui, null, /* @__PURE__ */ n.createElement(T, { variant: "h2", color: d.themedColor.onbackground1 }, o)), /* @__PURE__ */ n.createElement(Vi, null, /* @__PURE__ */ n.createElement(T, { variant: "body1", color: d.color.ondark02 }, r))), /* @__PURE__ */ n.createElement(Hi, null, Jt(a) && /* @__PURE__ */ n.createElement(Wi, null, /* @__PURE__ */ n.createElement(at, { as: "a", href: s, target: "_blank", rel: lt, onClick: g }, /* @__PURE__ */ n.createElement(A, { type: "download", color: d.themedColor.onbackground1, size: 24 })), u && i && /* @__PURE__ */ n.createElement(
2480
- at,
2481
- {
2482
- disabled: m,
2483
- onClick: () => {
2484
- m || u();
2485
- }
2486
- },
2487
- /* @__PURE__ */ n.createElement(
2488
- A,
2489
- {
2490
- type: "delete",
2491
- color: m ? "gray" : d.themedColor.onbackground1,
2492
- size: 24
2493
- }
2494
- )
2495
- )), /* @__PURE__ */ n.createElement(zi, { onClick: l }, /* @__PURE__ */ n.createElement(A, { type: "close", color: d.themedColor.onbackground1, size: 24 })))), /* @__PURE__ */ n.createElement(Gi, { onClick: (h) => h.currentTarget === h.target && l() }, Vn(a) && /* @__PURE__ */ n.createElement(ji, { controls: !0 }, /* @__PURE__ */ n.createElement("source", { src: s, type: a })), Un(a) && /* @__PURE__ */ n.createElement(Ki, { src: s, alt: o }), !Jt(a) && /* @__PURE__ */ n.createElement(Zi, null, /* @__PURE__ */ n.createElement(T, { variant: "h1", color: d.themedColor.onbackground1 }, p.FILE_VIEWER__UNSUPPORT)))));
2496
- }, zn = ({
2497
- className: e,
2498
- locale: t,
2499
- date: r = Date.now(),
2500
- formatString: o = "MMMM dd, yyyy",
2501
- style: a
2502
- }) => /* @__PURE__ */ n.createElement(Xi, { style: a, className: e }, /* @__PURE__ */ n.createElement(T, { variant: "caption4", color: d.themedColor.textMidEmphasis }, He(r, o, { locale: t }))), Xi = c.div`display:flex;justify-content:center;align-items:center;`, Qi = nr(function(t, r) {
2503
- const {
2504
- messages: o,
2505
- renderMessage: a,
2506
- messageTopArea: s,
2507
- messageBottomArea: i,
2508
- overlayArea: l,
2509
- onLoadPrev: u,
2510
- onLoadNext: m,
2511
- loadThreshold: g = 0.05,
2512
- onScrollPosition: p = ze,
2513
- depsForResetScrollPositionToBottom: h,
2514
- scrollPositionRef: f,
2515
- scrollDistanceFromBottomRef: E,
2516
- stackDirection: x = "top"
2517
- } = t, b = r && "current" in r ? r : { current: null }, S = F(!1), v = F(void 0), $ = F(0), N = F(0), w = F(0), D = f ?? N, te = E ?? w;
2518
- ye(() => {
2519
- b.current && (b.current.scrollTop = b.current.scrollHeight);
2520
- }, h), ye(() => {
2521
- b.current && (v.current === "top" && (b.current.scrollTop = b.current.scrollHeight - D.current), v.current === "bottom" && (b.current.scrollTop = $.current), v.current = void 0);
2522
- }, [b.current, o.length]);
2523
- const y = async () => {
2524
- if (!b.current) return;
2525
- const I = b.current;
2526
- if (p(el(I)), D.current = I.scrollHeight - I.scrollTop, te.current = D.current - I.clientHeight, $.current = I.scrollTop, S.current) return;
2527
- const H = I.clientHeight * Math.min(Math.max(0, g), 1);
2528
- I.scrollTop <= H ? (S.current = !0, v.current = "top", await u(), S.current = !1) : I.scrollHeight - I.scrollTop - I.clientHeight <= H ? (S.current = !0, v.current = "bottom", await m(), S.current = !1) : v.current = void 0;
2529
- };
2530
- return /* @__PURE__ */ n.createElement(tl, { id: "infinite-list-container" }, /* @__PURE__ */ n.createElement(nl, { id: "infinite-list-inner", ref: b, onScroll: y }, x === "bottom" && /* @__PURE__ */ n.createElement("div", { style: { flexGrow: 1 } }), s, o.map((I, H) => a({ message: I, index: H })), i), /* @__PURE__ */ n.createElement(rl, { id: "infinite-list-overlay-container" }, /* @__PURE__ */ n.createElement(ol, { id: "infinite-list-overlay" }, l)));
2531
- });
2532
- function el(e) {
2533
- return e.scrollTop <= 10 ? "top" : e.scrollHeight - (e.scrollTop + e.clientHeight) <= 10 ? "bottom" : "middle";
2534
- }
2535
- const tl = c.div`display:flex;position:relative;flex:1;overflow:hidden;`, nl = c.div`display:flex;flex:1;flex-direction:column;overflow-y:auto;scrollbar-color:${d.themedColor.onbackground3}transparent;&::-webkit-scrollbar-thumb:hover{background-color:transparent;}`, rl = c.div`position:absolute;top:0;bottom:0;left:0;right:0;pointer-events:none;`, ol = c.div`pointer-events:auto;`, al = ({ className: e, onClick: t }) => /* @__PURE__ */ n.createElement(sl, { className: e, onClick: t, tabIndex: 0 }, /* @__PURE__ */ n.createElement(A, { size: 24, type: "chevron-down", color: d.color.primary.main })), sl = c.button`all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:24px;box-shadow:${d.color.shadow05};${V.light`
2536
- background-color: ${d.color.background50};
2537
- &:hover {
2538
- background-color: ${d.color.background100};
2539
- }
2540
- &:active {
2541
- background-color: ${d.color.background200};
2542
- }
2543
- `}
2544
- ${V.dark`
2545
- background-color: ${d.color.background400};
2546
- &:hover {
2547
- background-color: ${d.color.background500};
2548
- }
2549
- &:active {
2550
- background-color: ${d.color.background700};
2551
- }
2552
- `}
2553
-
2554
- &:focus {
2555
- outline: none;
2556
- }
2557
- `, il = () => {
2558
- const { agentPreviewConfigs: e = {}, aiAgentId: t } = B(), { aiAgentInfo: r } = U(), { stringSet: o, dateLocale: a } = M(), { dataSource: s, onAfterSendMessage: i, onBeforeSendMessage: l } = K(), { Template: u } = he.useContext(), m = e.welcomeMessages ?? [], { messages: g } = s, p = Ii(g, t), h = g[p.length + 1], f = p[0] ?? h;
2559
- return {
2560
- /**
2561
- * Returns a list of messages filtered according to business requirements.
2562
- */
2563
- filteredMessages: g.filter((E) => $i(E) ? !1 : m.length > 0 ? !_t.isWelcomeMessage(E, t) : !0),
2564
- /**
2565
- * Determines whether to display the DateSeparator in the data list by comparing it with the welcome messages from Bot Studio.
2566
- */
2567
- shouldShowOriginalDate: (E) => E > 0 || m.length === 0 ? !0 : h && !pr(h.createdAt, (f == null ? void 0 : f.createdAt) ?? 0),
2568
- /**
2569
- * Renders the list of welcome messages from Bot Studio.
2570
- */
2571
- renderAgentPreviewWelcomeMessages: () => m.length === 0 ? null : /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(
2572
- zn,
2573
- {
2574
- style: { margin: "16px 0" },
2575
- date: f == null ? void 0 : f.createdAt,
2576
- locale: a,
2577
- formatString: o.DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR
2578
- }
2579
- ), m.map((E, x) => {
2580
- const b = x === m.length - 1, S = p.length !== g.length, v = m.length === 1 ? "single" : x === 0 ? "top" : b || S ? "bottom" : "middle";
2581
- return /* @__PURE__ */ n.createElement(
2582
- u,
2583
- {
2584
- messageType: "user",
2585
- message: E.message,
2586
- sender: r,
2587
- groupType: v,
2588
- createdAt: (f == null ? void 0 : f.createdAt) ?? Date.now(),
2589
- extendedMessagePayload: { suggested_replies: E.suggestedReplies },
2590
- suggestedRepliesDirection: e.suggestedRepliesDirection,
2591
- suggestedRepliesVisible: b && !S,
2592
- isBotMessage: !0,
2593
- onClickSuggestedReply: async ({ reply: $ }) => {
2594
- const N = await l({ message: $ });
2595
- s.sendUserMessage(N, i).then(i);
2596
- }
2597
- }
2598
- );
2599
- }))
2600
- };
2601
- }, Gn = () => {
2602
- const { chatSDK: e } = B(), { channel: t } = K(), [r, o] = C([]);
2603
- return cn(e, {
2604
- onTypingStatusUpdated(a) {
2605
- if (a.url === (t == null ? void 0 : t.url)) {
2606
- const s = a.getTypingUsers();
2607
- o(s);
2608
- }
2609
- }
2610
- }), r;
2611
- };
2612
- function ll() {
2613
- const { isDashboardActionbookTester: e } = Xe(), { aiAgentInfo: t } = U(), { scrollSource: r } = K(), o = Gn(), { components: a } = he.useContext(), [s] = o, i = !!s, l = e ? 0 : Me, u = (s == null ? void 0 : s.userId) === t.userId;
2614
- return P(() => {
2615
- i && setTimeout(() => r.scrollPubSub.publish({ type: "scrollToBottom", data: { animated: !0 } }), 25);
2616
- }, [i]), i ? /* @__PURE__ */ n.createElement(cl, null, /* @__PURE__ */ n.createElement(dl, null, !e && /* @__PURE__ */ n.createElement(a.SenderAvatar, { isBotMessage: u, sender: u ? t : s }), /* @__PURE__ */ n.createElement(a.SenderName, { sender: s })), /* @__PURE__ */ n.createElement(ul, { $startPadding: l }, /* @__PURE__ */ n.createElement(Tn, null))) : null;
2617
- }
2618
- const cl = c.div`display:flex;flex-direction:column;padding:0 ${Z}px;`, dl = c.div`display:flex;align-items:center;gap:8px;`, ul = c.div`display:flex;padding-inline-start:${({ $startPadding: e }) => `${e}px`};
2619
- `, ml = (e) => c(e).withConfig({ shouldForwardProp: Ir });
2620
- function pl(e) {
2621
- var o;
2622
- const t = "remove_powered_by", r = (o = e == null ? void 0 : e.appInfo) == null ? void 0 : o.applicationAttributes;
2623
- return Array.isArray(r) && r.includes(t);
2624
- }
2625
- const gl = ({ style: e }) => {
2626
- const { stringSet: t } = M(), { chatSDK: r } = B(), { isDashboardActionbookTester: o } = Xe();
2627
- return pl(r) || o ? null : /* @__PURE__ */ n.createElement(hl, { variant: "caption2", style: e }, t.POWERED_BY + " ", /* @__PURE__ */ n.createElement(
2628
- fl,
2629
- {
2630
- variant: "caption2",
2631
- as: "a",
2632
- href: "https://sendbird.com?utm_medium=product&utm_source=aiagent&utm_campaign=fy26-glbl-ai-agent-poweredby",
2633
- "aria-label": "Learn more about Sendbird",
2634
- rel: lt,
2635
- target: "_blank"
2636
- },
2637
- "Sendbird"
2638
- ));
2639
- }, hl = c(T)`color:${d.themedColor.onbackground3};text-align:center;`, fl = ml(T)`
2640
- color: ${d.themedColor.onbackground3};
2641
- cursor: pointer;
2642
- text-decoration: none;
2643
- `, bl = () => {
2644
- const { stringSet: e } = M(), { activeChannel: t } = U(), { channel: r, goToActiveConversation: o, scrollSource: a } = K(), s = Cn(r), l = t && (r == null ? void 0 : r.url) === (t == null ? void 0 : t.url) && s;
2645
- return ye(() => {
2646
- l && a.scrollPubSub.publish({ type: "scrollToBottom", data: { animated: !0 } });
2647
- }, [l]), l ? /* @__PURE__ */ n.createElement(El, null, /* @__PURE__ */ n.createElement(
2648
- xl,
2649
- {
2650
- variant: "button",
2651
- role: "button",
2652
- color: d.themedColor.textHighEmphasis,
2653
- onClick: () => o()
2654
- },
2655
- e.START_NEW_CONVERSATION
2656
- )) : null;
2657
- }, El = c.div`display:flex;justify-content:center;margin:16px 0;`, xl = c(T)`border-radius:6px;box-sizing:border-box;padding:10px 20px;border:1px solid ${d.themedColor.onbackground4};cursor:pointer;user-select:none;`, vl = !0, yl = () => {
2658
- const [e, t] = C(null), { userSession: r, aiAgentInfo: o } = U(), { agentPreviewConfigs: a, chatSDK: s, state: i } = B(), { stringSet: l, dateLocale: u } = M(), { channel: m, dataSource: g, scrollSource: p, onAfterSendMessage: h, onBeforeSendMessage: f } = K(), { isDashboardActionbookTester: E } = Xe(), { filteredMessages: x, shouldShowOriginalDate: b, renderAgentPreviewWelcomeMessages: S } = il(), { storage: v } = gn(), { Template: $ } = bt.useContext(), { Template: N } = he.useContext(), { Template: w } = Et.useContext(), D = (y, I = !1) => I ? o : (m == null ? void 0 : m.members.find((H) => H.userId === y.sender.userId)) ?? y.sender, te = () => {
2659
- if (!g.initialized)
2660
- return /* @__PURE__ */ n.createElement(Ce, { type: "loading" });
2661
- if (g.messages.length === 0) {
2662
- const y = S();
2663
- return y ? /* @__PURE__ */ n.createElement("div", { style: { width: "100%" } }, y) : /* @__PURE__ */ n.createElement(Ce, { type: "noMessages", label: l.PLACE_HOLDER__NO_MESSAGES });
2664
- }
2665
- return /* @__PURE__ */ n.createElement(
2666
- Qi,
2667
- {
2668
- ref: p.scrollRef,
2669
- scrollPositionRef: p.scrollPositionRef,
2670
- scrollDistanceFromBottomRef: p.scrollDistanceFromBottomRef,
2671
- onScrollPosition: (y) => p.setIsScrollBottomReached(y === "bottom"),
2672
- stackDirection: a == null ? void 0 : a.messageStackDirection,
2673
- messages: x,
2674
- onLoadPrev: g.loadPrevious,
2675
- onLoadNext: g.loadNext,
2676
- depsForResetScrollPositionToBottom: [g.initialized, g.messages.length !== 0],
2677
- messageTopArea: /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(gl, { style: { marginTop: 16 } }), S()),
2678
- messageBottomArea: /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(ll, null), /* @__PURE__ */ n.createElement(bl, null)),
2679
- overlayArea: /* @__PURE__ */ n.createElement(n.Fragment, null, !p.isScrollBottomReached && /* @__PURE__ */ n.createElement(_l, { onClick: () => p.scrollPubSub.publish({ type: "scrollToBottom" }) })),
2680
- renderMessage: ({ message: y, index: I }) => {
2681
- const H = wi(y), be = x[I - 1], O = x[I + 1], R = x[x.length - 1], L = y === R, Y = Ai(y, be, O, vl), Ee = !wr((be == null ? void 0 : be.createdAt) ?? 0, y.createdAt) && b(I) && !E, Te = () => {
2682
- y.isFileMessage() && t(y);
2683
- }, z = Ee ? /* @__PURE__ */ n.createElement(
2684
- zn,
2685
- {
2686
- style: { margin: "16px 0" },
2687
- date: y.createdAt,
2688
- locale: u,
2689
- formatString: l.DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR
2690
- }
2691
- ) : null, ne = {
2692
- maxBodyWidth: i.expanded ? xn : void 0,
2693
- extendedMessagePayload: y.extendedMessagePayload,
2694
- createdAt: y.createdAt,
2695
- groupType: Y,
2696
- onClickMedia: Te
2697
- }, Se = (() => {
2698
- var le, St;
2699
- if (Ue.isAdmin(y))
2700
- return Ue.isCSAT(y) ? m != null && m.conversation ? /* @__PURE__ */ n.createElement(
2701
- w,
2702
- {
2703
- ...ne,
2704
- ...m.conversation,
2705
- isResolvedWhenDeterminedByUser: Tl(m.conversation),
2706
- messageType: "admin.csat",
2707
- onSubmitCSAT: ({ csat: re, csatType: ce, csatReason: G, isResolved: oe }) => {
2708
- re && m.submitCSAT({ csat: re, csatType: ce, csatReason: G, isResolved: oe });
2709
- }
2710
- }
2711
- ) : null : /* @__PURE__ */ n.createElement(w, { ...ne, messageType: "admin", message: y.message });
2712
- if (Ue.isOutgoing(y, r.userId)) {
2713
- const re = {
2714
- ...ne,
2715
- message: y.message,
2716
- sender: D(y),
2717
- sendingStatus: y.sendingStatus
2718
- };
2719
- if (y.isUserMessage())
2720
- return /* @__PURE__ */ n.createElement($, { messageType: "user", ...re });
2721
- if (y.isFileMessage()) {
2722
- const [ce, G] = ((le = y.metaArrays.find((oe) => oe.key === Pn)) == null ? void 0 : le.value) ?? [];
2723
- return /* @__PURE__ */ n.createElement(
2724
- $,
2725
- {
2726
- messageType: "file",
2727
- file: y,
2728
- metadata: {
2729
- aspectRatio: ce && G ? `${ce}/${G}` : "1/1",
2730
- localFile: (St = y.messageParams) == null ? void 0 : St.file
2731
- },
2732
- ...re
2733
- }
2734
- );
2735
- }
2736
- }
2737
- if (Ue.isIncoming(y, r.userId)) {
2738
- const re = y.sender.userId === o.userId, ce = {
2739
- ...ne,
2740
- sender: D(y, re),
2741
- message: y.message,
2742
- suggestedRepliesVisible: L,
2743
- suggestedRepliesDirection: a == null ? void 0 : a.suggestedRepliesDirection,
2744
- isBotMessage: re,
2745
- onClickSuggestedReply: async ({ reply: G }) => {
2746
- const oe = await f({ message: G });
2747
- g.sendUserMessage(oe, h).then(h);
2748
- },
2749
- onRequestMessageTemplate: async (G) => {
2750
- const { template: oe } = await s.aiAgent.getMessageTemplate(G);
2751
- return v.setTemplate(G, oe), oe;
2752
- },
2753
- onGetCachedMessageTemplate: (G) => v.getTemplate(G)
2754
- };
2755
- if (y.isUserMessage())
2756
- return /* @__PURE__ */ n.createElement(N, { messageType: "user", ...ce });
2757
- if (y.isFileMessage())
2758
- return /* @__PURE__ */ n.createElement(N, { messageType: "file", file: y, ...ce });
2759
- }
2760
- })();
2761
- return /* @__PURE__ */ n.createElement("div", { key: H, id: `${J}-message-item` }, z, Se);
2762
- }
2763
- }
2764
- );
2765
- };
2766
- return /* @__PURE__ */ n.createElement(Cl, { id: `${J}-message-list` }, te(), e && /* @__PURE__ */ n.createElement(Yi, { onClose: () => t(null), message: e }));
2767
- }, Cl = c.div`overflow-y:hidden;display:flex;flex:1;position:relative;`, _l = c(al)`position:absolute;bottom:20px;inset-inline-end:20px;`;
2768
- function Tl(e) {
2769
- var t;
2770
- if (((t = e == null ? void 0 : e.resolution) == null ? void 0 : t.determinedBy) === "user")
2771
- return e.resolution.isResolved;
2772
- }
2773
- const Sl = () => {
2774
- const { stringSet: e } = M(), { connectionError: t } = U(), { channel: r, channelFetchError: o, fetchChannel: a } = K(), s = t || o;
2775
- if (s) {
2776
- const i = t ? void 0 : { label: e.RETRY, onClick: () => a() };
2777
- return /* @__PURE__ */ n.createElement(Ce, { type: "error", label: s.message, action: i });
2778
- }
2779
- return r ? /* @__PURE__ */ n.createElement(yl, null) : /* @__PURE__ */ n.createElement(Ce, { type: "loading" });
2780
- }, jn = () => {
2781
- const { stringSet: e } = M(), { activeChannel: t } = U(), [r] = C(() => (t == null ? void 0 : t.status) === j.OPEN);
2782
- return r ? e.RETURN_TO_CONVERSATION : e.START_NEW_CONVERSATION;
2783
- }, kl = () => {
2784
- const { stringSet: e } = M(), { goToActiveConversation: t } = K(), r = jn();
2785
- return /* @__PURE__ */ n.createElement(wl, null, /* @__PURE__ */ n.createElement(T, { variant: "body1", color: d.themedColor.textMidEmphasis }, e.CONVERSATION_CLOSED_FOOTER_LABEL), /* @__PURE__ */ n.createElement(Al, { onClick: t }, /* @__PURE__ */ n.createElement(T, { variant: "button", color: d.themedColor.textHighEmphasis }, r)));
2786
- }, wl = c.div`display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 0;gap:14px;${V.light`
2787
- background-color: ${d.color.background100};
2788
- `}
2789
- ${V.dark`
2790
- background-color: ${d.color.background500};
2791
- `}
2792
- `, Al = c.button`all:unset;padding:10px 20px;border-radius:6px;border:1px solid ${d.themedColor.textDisabled};cursor:pointer;${V.light`
2793
- background-color: ${d.color.background50};
2794
- `}
2795
- ${V.dark`
2796
- background-color: ${d.color.background700};
2797
- `}
2798
- `, Kn = _e(void 0), Il = ({ children: e }) => {
2799
- const { stringSet: t } = M(), { aiAgentInfo: r } = U(), [o, a] = C([]), [s, i] = C({
2800
- visible: !1,
2801
- title: "",
2802
- buttonText: t.BUTTON__OK
2803
- }), l = r == null ? void 0 : r.replyToFile, u = (p) => {
2804
- if (!l) return;
2805
- const h = p.filter((f) => fn.includes(f.type));
2806
- if (h.length !== 0) {
2807
- if (h.some((f) => f.size > Yr)) {
2808
- i((f) => ({
2809
- ...f,
2810
- visible: !0,
2811
- title: t.FILE_UPLOAD_NOTIFICATION__SIZE_LIMIT.replace("%d", "25")
2812
- }));
2813
- return;
2814
- }
2815
- if (h.length > 1 || h.length > 0 && o.length > 0) {
2816
- i((f) => ({
2817
- ...f,
2818
- visible: !0,
2819
- title: t.FILE_UPLOAD_NOTIFICATION__COUNT_LIMIT
2820
- }));
2821
- return;
2822
- }
2823
- a((f) => [
2824
- ...f,
2825
- ...h.map((E) => ({
2826
- file: E,
2827
- preview: { url: URL.createObjectURL(E), type: E.type, name: E.name }
2828
- }))
2829
- ]);
2830
- }
2831
- }, m = (p) => {
2832
- a((h) => {
2833
- var E;
2834
- const f = (E = h[p]) == null ? void 0 : E.preview;
2835
- return f && URL.revokeObjectURL(f.url), h.filter((x, b) => b !== p);
2836
- });
2837
- }, g = () => {
2838
- a((p) => (p.forEach((h) => URL.revokeObjectURL(h.preview.url)), []));
2839
- };
2840
- return /* @__PURE__ */ n.createElement(
2841
- Kn.Provider,
2842
- {
2843
- value: {
2844
- files: o,
2845
- addFiles: u,
2846
- removeFile: m,
2847
- clearFiles: g,
2848
- isFileUploadEnabled: l
2849
- }
2850
- },
2851
- e,
2852
- /* @__PURE__ */ n.createElement(Ml, { ...s, onClose: () => i((p) => ({ ...p, visible: !1, title: "" })) })
2853
- );
2854
- }, Tt = () => {
2855
- const e = X(Kn);
2856
- if (!e)
2857
- throw new Error("useFileUpload must be used within FileUploadProvider");
2858
- return e;
2859
- }, Ml = ({
2860
- title: e,
2861
- buttonText: t,
2862
- visible: r,
2863
- onClose: o
2864
- }) => /* @__PURE__ */ n.createElement(Hn, { rootElementId: Q.WINDOW, visible: r, onClose: o }, /* @__PURE__ */ n.createElement($l, null, /* @__PURE__ */ n.createElement(Rl, null, /* @__PURE__ */ n.createElement(T, { variant: "h1", color: d.themedColor.onbackground1 }, e)), /* @__PURE__ */ n.createElement(Ol, null, /* @__PURE__ */ n.createElement(Ll, { onClick: o }, /* @__PURE__ */ n.createElement(T, { variant: "button", color: d.themedColor.oncontent1 }, t))))), $l = c.div`width:100%;height:auto;padding-block:18px 24px;padding-inline:24px;margin:0 auto;border-radius:4px;box-sizing:border-box;background-color:${({ theme: e }) => e.colors.base.modalContentBackground};`, Ol = c.div`display:flex;flex-direction:row;justify-content:flex-end;`, Rl = c.div`margin-bottom:16px;`, Ll = c.button`display:flex;justify-content:center;align-items:center;border-radius:4px;cursor:pointer;background-color:${d.themedColor.error};border:1px solid ${d.themedColor.error};padding:10px 16px;&:hover{background-color:${d.color.error.dark};border-color:${d.color.error.dark};}&:active{background-color:${d.color.error.extraDark};}`;
2865
- function Nl({ blurred: e, elementRef: t, document: r = window.document }) {
2866
- const o = F(!1);
2867
- e && t.current && r.activeElement === t.current && (o.current = !0), ye(() => {
2868
- var a;
2869
- !e && o.current && ((a = t.current) == null || a.focus(), o.current = !1);
2870
- }, [e]);
2871
- }
2872
- const Bl = c.div`&::-webkit-scrollbar{display:none;}overflow-x:auto;display:flex;flex-direction:row;gap:10px;padding:8px 16px;background-color:transparent;`, Dl = c.div`display:flex;flex-shrink:0;position:relative;margin-block-start:8px;border-radius:12px;height:64px;img{border-radius:12px;object-fit:cover;width:64px;-webkit-user-drag:none;}`, Pl = c.div`display:flex;align-items:center;justify-content:center;position:absolute;inset-inline-end:-8px;inset-block-start:-8px;cursor:pointer;border-radius:50%;${V.light`
2873
- background-color: ${d.color.background50};
2874
- `}
2875
- ${V.dark`
2876
- background-color: ${d.color.background500};
2877
- `}
2878
- path {
2879
- fill: ${d.themedColor.onbackground2};
2880
- }
2881
-
2882
- &:hover {
2883
- path {
2884
- fill: ${d.themedColor.onbackground1};
2885
- }
2886
- }
2887
-
2888
- circle {
2889
- stroke: ${d.themedColor.background1};
2890
- }
2891
- `, Fl = () => {
2892
- const e = Re(), [t, r] = C(), { files: o, removeFile: a, isFileUploadEnabled: s } = Tt();
2893
- return !s || o.length === 0 ? null : /* @__PURE__ */ n.createElement(Bl, null, o.map(({ preview: { type: i, name: l, url: u } }, m) => /* @__PURE__ */ n.createElement(Dl, { key: u, onMouseOver: () => r(m), onMouseLeave: () => r(void 0) }, (e || t === m) && /* @__PURE__ */ n.createElement(Pl, { title: "Remove file", onClick: () => a(m) }, /* @__PURE__ */ n.createElement(A, { type: "close-filled", color: d.themedColor.onbackground2 })), i.startsWith("image/") ? /* @__PURE__ */ n.createElement("img", { alt: "file-image", src: u }) : /* @__PURE__ */ n.createElement(mt, { name: l, type: ut(l, i) }))));
2894
- }, Ul = ({ channel: e, messages: t }) => {
2895
- const { stringSet: r } = M(), { aiAgentInfo: o } = U(), a = Vl(), s = Hl({
2896
- lastMessage: t[t.length - 1],
2897
- aiAgentUserId: o.userId
2898
- });
2899
- return !e || !a || Cn(e) ? [!0, r.MESSAGE_INPUT__PLACE_HOLDER__DISABLED] : s ? [!0, r.MESSAGE_INPUT__PLACE_HOLDER__WAIT_AI_AGENT_RESPONSE] : [!1, r.MESSAGE_INPUT__PLACE_HOLDER];
2900
- }, Vl = () => {
2901
- const e = rr(), { chatSDK: t } = B(), [r, o] = C(!0);
2902
- return P(() => {
2903
- const a = new sn({
2904
- onDisconnected: () => o(!1),
2905
- onConnected: () => o(!0),
2906
- onReconnectSucceeded: () => o(!0)
2907
- });
2908
- return t.addConnectionHandler(e, a), () => {
2909
- t.removeConnectionHandler(e);
2910
- };
2911
- }, [t]), r;
2912
- }, Hl = ({
2913
- lastMessage: e,
2914
- aiAgentUserId: t
2915
- }) => {
2916
- const [r, o] = C(!1), a = Gn();
2917
- return P(() => {
2918
- if (!e) return;
2919
- const s = a.some((l) => l.userId === t), i = Fn(e, t) && _t.isStreaming(e);
2920
- o(!!(i || s));
2921
- }, [a, e, t]), r;
2922
- }, Zn = {
2923
- textArea: k`min-height:40px;height:40px;font-size:16px;line-height:24px;`,
2924
- attachIcon: k`margin-bottom:4px;`
2925
- }, Yn = c.button`all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;width:32px;height:32px;`, Wl = c(Yn)`flex-shrink:0;margin-inline-end:12px;margin-bottom:2px;&:disabled{cursor:not-allowed;}&:not(:disabled){&:hover{path{fill:${d.themedColor.onbackground1};}}&:active{border-radius:4px;background-color:${d.themedColor.background3};}}${xt && Zn.attachIcon};`, zl = c.input`display:none;`, Xt = c.div`width:100%;position:relative;background-color:${d.themedColor.background2};border-radius:20px;`, Qt = c.div`display:flex;flex-direction:row;align-items:flex-end;position:relative;`, en = c.textarea`all:unset;display:block;flex:1;min-width:0;padding-top:8px;padding-bottom:8px;padding-inline-start:16px;padding-inline-end:12px;box-sizing:border-box;font-size:14px;line-height:20px;color:${d.themedColor.onbackground1};resize:none;width:100%;height:${hn}px;overflow-wrap:break-word;white-space:pre-wrap;overflow-x:hidden;${xt && Zn.textArea};&::placeholder{color:${d.themedColor.onbackground3};}&:disabled{cursor:not-allowed;&::placeholder{color:${d.themedColor.onbackground4};}}`, tn = c.div`padding:12px 16px;position:relative;display:flex;align-items:center;`, nn = ({ disabled: e }) => {
2926
- const t = F(null), { addFiles: r, clearFiles: o, files: a, isFileUploadEnabled: s } = Tt();
2927
- return !s || a.length > 0 ? null : /* @__PURE__ */ n.createElement(
2928
- Wl,
2929
- {
2930
- disabled: e,
2931
- onClick: () => {
2932
- var i;
2933
- o(), (i = t.current) == null || i.click();
2934
- }
2935
- },
2936
- /* @__PURE__ */ n.createElement(
2937
- A,
2938
- {
2939
- type: "attach",
2940
- color: e ? d.themedColor.onbackground4 : d.themedColor.onbackground2,
2941
- size: 16
2942
- }
2943
- ),
2944
- /* @__PURE__ */ n.createElement(
2945
- zl,
2946
- {
2947
- type: "file",
2948
- ref: t,
2949
- onChange: (i) => {
2950
- const l = i.currentTarget.files;
2951
- l && r(Array.from(l)), i.target.value = "";
2952
- },
2953
- accept: fn.join(",")
2954
- }
2955
- )
2956
- );
2957
- }, Gl = () => {
2958
- const e = F(null), [t, r] = C(""), { rootElement: o } = B(), { channel: a, dataSource: s, onBeforeSendMessage: i, onAfterSendMessage: l } = K(), [u, m] = Ul({ channel: a, messages: s.messages }), { files: g, addFiles: p, clearFiles: h } = Tt();
2959
- _i({ onDropFiles: p }), Nl({ blurred: u, elementRef: e, document: pe(o) });
2960
- const f = t.trim().length > 0, E = g.length > 0, x = !u && (f || E), b = () => {
2961
- e.current && (e.current.value = "", e.current.style.height = ""), h(), r("");
2962
- }, S = async () => {
2963
- const w = t.trim(), D = { message: w };
2964
- if (!w && !g.length) return;
2965
- if (g.length > 0) {
2966
- const y = g[0].file, I = { ...D, file: y }, H = await i(I);
2967
- s.sendFileMessage(H, l).then(l), b();
2968
- return;
2969
- }
2970
- const te = await i(D);
2971
- s.sendUserMessage(te, l).then(l), b();
2972
- }, v = (w) => {
2973
- const D = Array.from(w.clipboardData.files);
2974
- D.length > 0 && (w.preventDefault(), p(D));
2975
- }, $ = (w) => {
2976
- w.key !== "Enter" || w.nativeEvent.isComposing || w.shiftKey || (w.preventDefault(), S());
2977
- }, N = (w) => {
2978
- if (e.current) {
2979
- e.current.style.height = "";
2980
- const D = Math.min(Zr, e.current.scrollHeight);
2981
- hn < D && (e.current.style.height = `${D}px`);
2982
- }
2983
- r(w.target.value);
2984
- };
2985
- return u ? /* @__PURE__ */ n.createElement(tn, null, /* @__PURE__ */ n.createElement(Xt, null, /* @__PURE__ */ n.createElement(Qt, null, /* @__PURE__ */ n.createElement(en, { disabled: !0, placeholder: m }), /* @__PURE__ */ n.createElement(nn, { disabled: !0 })))) : /* @__PURE__ */ n.createElement(tn, null, /* @__PURE__ */ n.createElement(Xt, null, /* @__PURE__ */ n.createElement(Fl, null), /* @__PURE__ */ n.createElement(Qt, null, /* @__PURE__ */ n.createElement(
2986
- en,
2987
- {
2988
- ref: e,
2989
- role: "textbox",
2990
- "aria-label": "Text Input",
2991
- placeholder: m,
2992
- maxLength: 5e3,
2993
- onKeyDown: $,
2994
- onChange: N,
2995
- onPaste: v
2996
- }
2997
- ), /* @__PURE__ */ n.createElement(nn, null))), x && /* @__PURE__ */ n.createElement(Yn, { onClick: () => S() }, /* @__PURE__ */ n.createElement(A, { type: "send", color: d.color.primary.main, size: 20 })));
2998
- }, jl = c.div`padding:8px 16px;text-align:center;word-break:break-word;white-space:pre-wrap;line-height:1.43;letter-spacing:-0.2px;font-size:14px;font-weight:400;color:${d.themedColor.textLowEmphasis};&& a{font-weight:700;text-decoration:none;${V.light`
2999
- color: ${d.color.information.light};
3000
- `};
3001
- ${V.dark`
3002
- color: ${d.color.information.main};
3003
- `};
3004
- }
3005
- `, Kl = _(() => import("./DiXu6nm5.js").then((e) => ({ default: e.MarkdownText }))), Zl = () => {
3006
- const { aiAgentInfo: e } = U(), { dataSource: t } = K(), { userSession: r } = U();
3007
- return !e.specialNoticeEnabled || !e.specialNotice || !(t.initialized && !t.messages.some((a) => Fn(a, r.userId))) ? null : /* @__PURE__ */ n.createElement(jl, null, /* @__PURE__ */ n.createElement(Kl, null, e.specialNotice));
3008
- }, Yl = () => /* @__PURE__ */ n.createElement(ql, null, /* @__PURE__ */ n.createElement(Zl, null), /* @__PURE__ */ n.createElement(Il, null, /* @__PURE__ */ n.createElement(Gl, null))), ql = c.div`z-index:0;border:none;width:100%;`, Jl = () => {
3009
- var s;
3010
- const { activeChannel: e } = U(), { channel: t } = K(), r = ((s = t == null ? void 0 : t.conversation) == null ? void 0 : s.status) === j.CLOSED;
3011
- return !((t == null ? void 0 : t.url) === (e == null ? void 0 : e.url)) && r ? /* @__PURE__ */ n.createElement(kl, null) : /* @__PURE__ */ n.createElement(Yl, null);
3012
- }, Xl = () => {
3013
- var S;
3014
- const { state: e, logger: t, enableCloseConversationButton: r, enableExpandButton: o, dispatcher: a } = B(), { stringSet: s } = M(), { aiAgentInfo: i, activeChannel: l } = U(), { channel: u, onNavigateToConversationList: m } = K(), p = Re() ? 24 : 16, h = () => {
3015
- e.setOpened(!1);
3016
- }, f = async () => {
3017
- try {
3018
- const v = await (u == null ? void 0 : u.markConversationAsHandoff());
3019
- t.info("conversation.handleAgentHandoff: success", v);
3020
- } catch (v) {
3021
- t.error("conversation.handleAgentHandoff: error", v);
3022
- }
3023
- }, E = async () => {
3024
- u && await a.send(jr.CloseConversation());
3025
- }, x = l && (u == null ? void 0 : u.url) === l.url, b = i.showHandoffButton && !!((S = u == null ? void 0 : u.conversation) != null && S.handoff) && x;
3026
- return /* @__PURE__ */ n.createElement(rc, null, /* @__PURE__ */ n.createElement(oc, null, m && /* @__PURE__ */ n.createElement(Le, { onClick: () => m() }, /* @__PURE__ */ n.createElement(A, { type: "menu", size: 24, color: d.themedColor.textHighEmphasis })), x && /* @__PURE__ */ n.createElement(Wn, { size: 34 }), /* @__PURE__ */ n.createElement(sc, { variant: "h2", color: d.themedColor.onbackground1 }, i.nickname || (u == null ? void 0 : u.name))), /* @__PURE__ */ n.createElement(ac, null, b && /* @__PURE__ */ n.createElement(
3027
- nc,
3028
- {
3029
- tooltipLabel: s.HEADER_BUTTON__AGENT_HANDOFF,
3030
- disabled: !ra(u),
3031
- size: p,
3032
- onClick: f
3033
- }
3034
- ), r && /* @__PURE__ */ n.createElement(
3035
- tc,
3036
- {
3037
- disabled: !ht(u),
3038
- size: p,
3039
- onClick: E
3040
- }
3041
- ), o && /* @__PURE__ */ n.createElement(Ql, { size: p }), /* @__PURE__ */ n.createElement(ec, { size: p, onClick: h })));
3042
- }, Ql = ({ size: e, disabled: t }) => {
3043
- const { state: r } = B();
3044
- return /* @__PURE__ */ n.createElement(Le, { "aria-label": "expand", onClick: () => r.setExpanded(!r.expanded), disabled: t }, /* @__PURE__ */ n.createElement(A, { type: r.expanded ? "collapse" : "expand", size: e, color: d.themedColor.textHighEmphasis }));
3045
- }, ec = ({ size: e, disabled: t, onClick: r }) => /* @__PURE__ */ n.createElement(Le, { "aria-label": "close messenger", onClick: r, disabled: t }, /* @__PURE__ */ n.createElement(A, { type: "close", size: e, color: d.themedColor.textHighEmphasis })), tc = ({ size: e, disabled: t, onClick: r }) => /* @__PURE__ */ n.createElement(Le, { "aria-label": "close conversation", onClick: r, disabled: t }, /* @__PURE__ */ n.createElement(
3046
- A,
3047
- {
3048
- type: "refresh",
3049
- size: e,
3050
- color: t ? d.themedColor.textDisabled : d.themedColor.textHighEmphasis
3051
- }
3052
- )), nc = ({ size: e, onClick: t, disabled: r, tooltipLabel: o }) => /* @__PURE__ */ n.createElement(In, { label: o, position: "bottom", disabled: r }, /* @__PURE__ */ n.createElement(Le, { "aria-label": "agent", onClick: t, disabled: r }, /* @__PURE__ */ n.createElement(
3053
- A,
3054
- {
3055
- type: "agent",
3056
- size: e,
3057
- color: r ? d.themedColor.textDisabled : d.themedColor.textHighEmphasis
3058
- }
3059
- ))), rc = c.div`height:56px;box-sizing:border-box;display:flex;align-items:center;padding:11px 12px;border-bottom:1px solid ${d.themedColor.onbackground4};background-color:${({ theme: e }) => e.colors.base.headerBackground};`, oc = c.div`display:flex;flex:1;flex-direction:row;align-items:center;gap:6px;overflow:hidden;`, ac = c.div`display:flex;gap:10px;align-items:center;justify-content:center;`, sc = c(T)`text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:2px 0;`, Le = c.button`all:unset;padding:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;&:disabled{cursor:not-allowed;}`, ic = () => {
3060
- const { isDashboardActionbookTester: e } = Xe();
3061
- return e ? null : /* @__PURE__ */ n.createElement(Xl, null);
3062
- }, rn = ({
3063
- children: e,
3064
- onNavigateToConversationList: t,
3065
- closedChannelUrl: r,
3066
- onClearClosedChannelUrl: o
3067
- }) => /* @__PURE__ */ n.createElement(
3068
- Ci,
3069
- {
3070
- onNavigateToConversationList: t,
3071
- closedChannelUrl: r,
3072
- onClearClosedChannelUrl: o
3073
- },
3074
- /* @__PURE__ */ n.createElement(ot, null, /* @__PURE__ */ n.createElement(ot.Consumer, null, (a) => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(lc, { ...a }, /* @__PURE__ */ n.createElement(ic, null), /* @__PURE__ */ n.createElement(Sl, null), /* @__PURE__ */ n.createElement(Jl, null)), e)))
3075
- ), lc = c.div`height:100%;width:100%;display:flex;flex-direction:column;flex:1;background-color:${({ theme: e }) => e.colors.base.background};`, [cc, qn] = ee("ConversationList");
3076
- function dc({
3077
- onOpenConversationView: e = ze,
3078
- children: t
3079
- }) {
3080
- const { chatSDK: r, aiAgentId: o } = B(), a = Wr(r, {
3081
- aiAgentId: o,
3082
- status: j.CLOSED,
3083
- order: br.UPDATED_AT,
3084
- reverse: !0
3085
- });
3086
- return /* @__PURE__ */ n.createElement(cc.Provider, { value: { dataSource: a, onOpenConversationView: e } }, t);
3087
- }
3088
- const uc = ({ onClick: e, conversation: t }) => {
3089
- var a;
3090
- const { stringSet: r, dateLocale: o } = M();
3091
- return /* @__PURE__ */ n.createElement(mc, { role: "button", onClick: () => e == null ? void 0 : e() }, /* @__PURE__ */ n.createElement(gc, null, /* @__PURE__ */ n.createElement(hc, null, /* @__PURE__ */ n.createElement(T, { variant: "subtitle1", color: d.themedColor.textHighEmphasis }, He(t.channelInfo.lastMessageTs, r.DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE, {
3092
- locale: o
3093
- })), /* @__PURE__ */ n.createElement(T, { variant: "caption2", color: d.themedColor.textLowEmphasis }, He(
3094
- t.channelInfo.lastMessageTs,
3095
- r.DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE_CAPTION,
3096
- { locale: o }
3097
- ))), /* @__PURE__ */ n.createElement(T, { variant: "body3", color: d.themedColor.textMidEmphasis }, ((a = t.topics) == null ? void 0 : a.join(", ")) || r.CONVERSATION_LIST__TOPICS_FALLBACK)), /* @__PURE__ */ n.createElement(A, { type: "chevron-right", size: 16, color: d.themedColor.textHighEmphasis }), /* @__PURE__ */ n.createElement(pc, null));
3098
- }, mc = c.div`display:flex;flex-direction:row;align-items:center;position:relative;width:100%;padding:14px 16px;box-sizing:border-box;gap:4px;cursor:pointer;`, pc = c.div`position:absolute;bottom:0;height:1px;width:calc(100% - 32px);background-color:${d.themedColor.onbackground4};`, gc = c.div`gap:4px;display:flex;flex-direction:column;flex:1;`, hc = c.div`display:flex;justify-content:flex-start;align-items:center;gap:6px;`, fc = ({ items: e, renderItem: t, onEndReached: r }) => {
3099
- const o = (a) => {
3100
- const s = a.target;
3101
- s.scrollHeight - s.scrollTop === s.clientHeight && (r == null || r());
3102
- };
3103
- return /* @__PURE__ */ n.createElement(bc, { onScroll: (a) => o(a) }, e.map((a, s) => t(a, s)));
3104
- }, bc = c.div`width:100%;height:100%;display:flex;flex-direction:column;flex:1;overflow:auto;`, Ec = () => {
3105
- const { stringSet: e } = M(), { dataSource: t, onOpenConversationView: r } = qn();
3106
- return t.initialized ? t.conversations.length === 0 ? /* @__PURE__ */ n.createElement(Ce, { type: "noChannels", label: e.CONVERSATION_LIST__NO_CONVERSATIONS }) : /* @__PURE__ */ n.createElement(
3107
- fc,
3108
- {
3109
- items: t.conversations,
3110
- renderItem: (o, a) => /* @__PURE__ */ n.createElement(
3111
- uc,
3112
- {
3113
- key: a,
3114
- conversation: o,
3115
- onClick: () => r(o.channelInfo.url, j.CLOSED)
3116
- }
3117
- ),
3118
- onEndReached: () => {
3119
- t.loadMore();
3120
- }
3121
- }
3122
- ) : /* @__PURE__ */ n.createElement(Ce, { type: "loading" });
3123
- }, xc = () => {
3124
- const { refreshActiveChannel: e } = U(), { onOpenConversationView: t } = qn(), r = jn();
3125
- return /* @__PURE__ */ n.createElement(
3126
- vc,
3127
- {
3128
- role: "button",
3129
- onClick: async () => {
3130
- const o = await e();
3131
- t(o, j.OPEN);
3132
- }
3133
- },
3134
- /* @__PURE__ */ n.createElement(yc, { variant: "h1" }, r)
3135
- );
3136
- }, vc = c.div`background-color:${({ theme: e }) => e.colors.base.primary};display:flex;align-items:center;justify-content:center;padding:16px;cursor:pointer;`, yc = c(T)`color:${({ theme: e }) => e.colors.base.primaryContrastContent};overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`, Cc = () => {
3137
- const { stringSet: e } = M();
3138
- return /* @__PURE__ */ n.createElement(_c, null, /* @__PURE__ */ n.createElement(Tc, { variant: "h2", color: d.themedColor.textHighEmphasis }, e.CONVERSATION_LIST__HEADER_TITLE), /* @__PURE__ */ n.createElement(Sc, null));
3139
- }, _c = c.div`display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;flex-shrink:0;height:56px;position:relative;background-color:${({ theme: e }) => e.colors.base.headerBackground};`, Tc = c(T)`padding:0 12px;width:100%;box-sizing:border-box;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;`, Sc = c.div`position:absolute;bottom:0;width:100%;height:1px;background-color:${d.themedColor.onbackground4};`, kc = ({ children: e, onOpenConversationView: t }) => /* @__PURE__ */ n.createElement(dc, { onOpenConversationView: t }, /* @__PURE__ */ n.createElement(wc, null, /* @__PURE__ */ n.createElement(Cc, null), /* @__PURE__ */ n.createElement(Ec, null), /* @__PURE__ */ n.createElement(xc, null)), e), wc = c.div`height:100%;width:100%;display:flex;flex-direction:column;flex:1;background-color:${({ theme: e }) => e.colors.base.background};`, Jn = _e(null);
3140
- function Ac() {
3141
- const e = X(Jn);
3142
- if (!e)
3143
- throw new Error("useNavigator() must be used within <Navigator />");
3144
- return e;
3145
- }
3146
- function Xn({ children: e }) {
3147
- const t = Ac();
3148
- return typeof e == "function" ? e(t) : /* @__PURE__ */ n.createElement(n.Fragment, null, e);
3149
- }
3150
- const Ic = ln`0%{transform:translateY(40px);opacity:0;}100%{transform:translateY(0px);opacity:1;}`, Mc = ln`0%{transform:translateY(0px);opacity:1;}100%{transform:translateY(40px);opacity:0;}`, $c = k`animation:${Ic} 0.3s forwards;`, Oc = k``, Rc = k`animation:${Mc} 0.3s forwards;`, Lc = k`visibility:hidden;`, Nc = c.div`position:absolute;top:0;left:0;width:100%;height:100%;${({ $transitionState: e }) => {
3151
- switch (e) {
3152
- case "entering":
3153
- return $c;
3154
- case "entered":
3155
- return Oc;
3156
- case "exiting":
3157
- return Rc;
3158
- case "exited":
3159
- return Lc;
3160
- default:
3161
- return "";
3162
- }
3163
- }}${({ $active: e }) => e ? k`
3164
- z-index: 999;
3165
- ` : k`z-index:1;pointer-events:none;`}
3166
- `;
3167
- function we({ initialId: e, children: t }) {
3168
- const r = W((b, S) => {
3169
- u((v) => [...v, b]), g((v) => ({ ...v, [b]: !0 })), S != null && S.reset && E((v) => ({
3170
- ...v,
3171
- [b]: (v[b] || 0) + 1
3172
- })), h((v) => ({
3173
- ...v,
3174
- [b]: "entering"
3175
- })), setTimeout(() => {
3176
- h((v) => ({
3177
- ...v,
3178
- [b]: "entered"
3179
- }));
3180
- }, 300);
3181
- }, []), o = W(() => {
3182
- u((b) => {
3183
- if (b.length <= 1) return b;
3184
- const S = b[b.length - 1];
3185
- return h((v) => ({
3186
- ...v,
3187
- [S]: "exiting"
3188
- })), setTimeout(() => {
3189
- h((v) => ({
3190
- ...v,
3191
- [S]: "exited"
3192
- })), u((v) => v.slice(0, -1));
3193
- }, 300), b;
3194
- });
3195
- }, []), a = ve(() => ({
3196
- navigation: {
3197
- navigate: r,
3198
- pop: o
3199
- }
3200
- }), [r, o]), s = ve(() => or.toArray(t).filter(
3201
- (b) => b.type === Xn
3202
- ), [t]), i = ve(() => {
3203
- const b = {};
3204
- return s.forEach((S) => {
3205
- const { id: v, lazy: $, children: N } = S.props;
3206
- b[v] = { lazy: $, element: typeof N == "function" ? N(a) : N };
3207
- }), b;
3208
- }, [s]), [l, u] = C([e]), [m, g] = C(() => {
3209
- const b = {};
3210
- return Object.entries(i).forEach(([S, { lazy: v }]) => {
3211
- v === !1 && (b[S] = !0);
3212
- }), b[e] = !0, b;
3213
- }), [p, h] = C(() => {
3214
- const b = {};
3215
- return Object.keys(i).forEach((S) => {
3216
- S === e ? b[S] = "entered" : b[S] = "exited";
3217
- }), b;
3218
- }), [f, E] = C({}), x = l[l.length - 1];
3219
- return /* @__PURE__ */ n.createElement(Jn.Provider, { value: a }, /* @__PURE__ */ n.createElement(Bc, null, Object.keys(i).map((b) => {
3220
- var N;
3221
- if (!m[b]) return null;
3222
- const S = p[b] || "exited", v = b === x, $ = `${b}-${f[b] || 0}`;
3223
- return /* @__PURE__ */ n.createElement(Nc, { key: $, $transitionState: S, $active: v }, (N = i[b]) == null ? void 0 : N.element);
3224
- })));
3225
- }
3226
- const Bc = c.div`position:relative;width:100%;height:100%;`;
3227
- we.Screen = Xn;
3228
- const de = {
3229
- activeConv: "active-conv",
3230
- closedConv: "closed-conv",
3231
- convList: "conv-list"
3232
- }, Qn = ({ setClosedChannelUrl: e, closedChannelUrl: t }) => /* @__PURE__ */ n.createElement(we, { initialId: de.activeConv }, /* @__PURE__ */ n.createElement(we.Screen, { id: de.activeConv }, ({ navigation: r }) => /* @__PURE__ */ n.createElement(rn, { onNavigateToConversationList: () => r.navigate(de.convList, { reset: !0 }) })), /* @__PURE__ */ n.createElement(we.Screen, { id: de.closedConv }, ({ navigation: r }) => /* @__PURE__ */ n.createElement(
3233
- rn,
3234
- {
3235
- onNavigateToConversationList: () => r.pop(),
3236
- closedChannelUrl: t,
3237
- onClearClosedChannelUrl: () => e(void 0)
3238
- }
3239
- )), /* @__PURE__ */ n.createElement(we.Screen, { id: de.convList, lazy: !0 }, ({ navigation: r }) => /* @__PURE__ */ n.createElement(
3240
- kc,
3241
- {
3242
- onOpenConversationView: (o, a) => {
3243
- a === "closed" ? (e(o), r.navigate(de.closedConv, { reset: !0 })) : r.navigate(de.activeConv);
3244
- }
3245
- }
3246
- )));
3247
- function Dc({ isExpanded: e, isOpened: t, children: r, launcher: o }) {
3248
- const { dir: a } = B();
3249
- return /* @__PURE__ */ n.createElement(Pc, null, /* @__PURE__ */ n.createElement(Fc, { dir: a, id: Q.WINDOW, $isExpanded: e, $isOpened: t }, r), o);
3250
- }
3251
- const Pc = c.div`display:flex;flex-direction:column;gap:8px;align-items:flex-end;`, Fc = c.div`background:${({ theme: e }) => e.colors.base.background};display:flex;overscroll-behavior:none;-webkit-overflow-scrolling:auto;height:640px;min-height:80px;width:400px;max-width:80vw;max-height:80vh;box-shadow:0px 16px 24px 2px rgba(33,33,33,0.12),0px 6px 30px 5px rgba(33,33,33,0.08),0px 6px 10px -5px rgba(33,33,33,0.04);border-radius:16px;overflow:hidden;transition:width 200ms ease 0s,height 200ms ease 0s,max-height 200ms ease 0s,transform 150ms cubic-bezier(0,1.2,1,1) 0s,opacity 83ms ease-out 0s;transform:scale(0.15);opacity:0;transform-origin:right bottom;[dir='rtl'] &:not([dir='ltr']),&[dir='rtl']{transform-origin:left bottom;}${({ $isOpened: e }) => e && Vc};${({ $isExpanded: e }) => e && Uc};`, Uc = k`width:743px;height:723px;`, Vc = k`z-index:${fe.WINDOW};pointer-events:all;transform:scale(1);opacity:1;transition:width 200ms ease 0s,height 200ms ease 0s,max-height 200ms ease 0s,transform 300ms cubic-bezier(0,1.2,1,1) 0s,opacity 83ms ease-out 0s;`, ud = ({ children: e, ...t }) => {
3252
- const r = Re(), [o, a] = C(), s = r ? Ln : Dc;
3253
- return /* @__PURE__ */ n.createElement(Rn, { enableExpandButton: !r, ...t }, /* @__PURE__ */ n.createElement($n, null, ({ state: i }) => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(s, { isExpanded: i.expanded, isOpened: i.opened, launcher: /* @__PURE__ */ n.createElement(Dn, null) }, /* @__PURE__ */ n.createElement(
3254
- Qn,
3255
- {
3256
- closedChannelUrl: o,
3257
- setClosedChannelUrl: a
3258
- }
3259
- )), e)));
3260
- };
3261
- function Hc(e) {
3262
- return /* @__PURE__ */ n.createElement(Wc, { ...e });
3263
- }
3264
- const Wc = c(Dn)`position:fixed;z-index:${fe.LAUNCHER};bottom:24px;inset-inline-end:24px;`;
3265
- function zc({ isExpanded: e, isOpened: t, children: r }) {
3266
- const { dir: o } = B();
3267
- return /* @__PURE__ */ n.createElement(Gc, { dir: o, id: Q.WINDOW, $isExpanded: e, $isOpened: t }, r);
3268
- }
3269
- const Gc = c.div`background:${({ theme: e }) => e.colors.base.background};display:flex;overscroll-behavior:none;-webkit-overflow-scrolling:auto;position:fixed;bottom:84px;inset-inline-end:20px;height:640px;min-height:80px;width:400px;max-width:80vw;max-height:80vh;box-shadow:0px 16px 24px 2px rgba(33,33,33,0.12),0px 6px 30px 5px rgba(33,33,33,0.08),0px 6px 10px -5px rgba(33,33,33,0.04);border-radius:16px;overflow:hidden;transition:width 200ms ease 0s,height 200ms ease 0s,max-height 200ms ease 0s,transform 150ms cubic-bezier(0,1.2,1,1) 0s,opacity 83ms ease-out 0s;transform:scale(0.15);opacity:0;transform-origin:right bottom;[dir='rtl'] &:not([dir='ltr']),&[dir='rtl']{transform-origin:left bottom;}${({ $isOpened: e }) => e && Kc};${({ $isExpanded: e }) => e && jc};`, jc = k`width:743px;height:723px;`, Kc = k`z-index:${fe.WINDOW};pointer-events:all;transform:scale(1);opacity:1;transition:width 200ms ease 0s,height 200ms ease 0s,max-height 200ms ease 0s,transform 300ms cubic-bezier(0,1.2,1,1) 0s,opacity 83ms ease-out 0s;`, md = ({ children: e, ...t }) => {
3270
- const r = Re(), [o, a] = C(), s = r ? Ln : zc;
3271
- return /* @__PURE__ */ n.createElement(Rn, { enableExpandButton: !r, ...t }, /* @__PURE__ */ n.createElement($n, null, ({ state: i }) => /* @__PURE__ */ n.createElement(n.Fragment, null, /* @__PURE__ */ n.createElement(s, { isExpanded: i.expanded, isOpened: i.opened }, /* @__PURE__ */ n.createElement(
3272
- Qn,
3273
- {
3274
- closedChannelUrl: o,
3275
- setClosedChannelUrl: a
3276
- }
3277
- )), /* @__PURE__ */ n.createElement(Hc, null), e)));
3278
- };
3279
- export {
3280
- lt as A,
3281
- jr as C,
3282
- ud as D,
3283
- md as F,
3284
- A as I,
3285
- wn as L,
3286
- qs as M,
3287
- bt as O,
3288
- dd as P,
3289
- Et as S,
3290
- T as a,
3291
- Rn as b,
3292
- d as c,
3293
- Fs as d,
3294
- U as e,
3295
- M as f,
3296
- li as g,
3297
- he as h,
3298
- ue as i,
3299
- rn as j,
3300
- kc as k,
3301
- mn as l,
3302
- cd as m,
3303
- B as u
3304
- };