@sendbird/ai-agent-messenger-react 1.2.7 → 1.3.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.
- package/dist/cjs/{D8KSxdhT.cjs → 8flIqihd.cjs} +1 -1
- package/dist/cjs/{MsdK6ffU.cjs → B3LqSSG5.cjs} +1 -1
- package/dist/cjs/{BZQfpGF3.cjs → BQqygmjw.cjs} +1 -1
- package/dist/cjs/{6Ljq47GZ.cjs → BvXE2Myz.cjs} +1 -1
- package/dist/cjs/{GZl6LE-p.cjs → DMxlnbEy.cjs} +1 -1
- package/dist/cjs/rl6FrW6Y.cjs +207 -0
- package/dist/es/3qBdtnlJ.js +4083 -0
- package/dist/es/{D4Vk_6v3.js → 4nxZMIz3.js} +1 -1
- package/dist/es/{BKhgSuql.js → CorQ5vL_.js} +1 -1
- package/dist/es/{BUIIulLp.js → DFlRbX2F.js} +1 -1
- package/dist/es/{BV3rSe2G.js → DNKomW8O.js} +1 -1
- package/dist/es/{7464aa--.js → ccfzGnJU.js} +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.ts +270 -33
- package/dist/index.js +27 -20
- package/package.json +2 -2
- package/dist/cjs/DdCvhwdF.cjs +0 -207
- package/dist/es/BaBU5Xlk.js +0 -4163
|
@@ -0,0 +1,4083 @@
|
|
|
1
|
+
import * as r from "react";
|
|
2
|
+
import { createContext as ve, useContext as X, useEffect as L, useState as _, useId as bn, useRef as N, useCallback as R, useMemo as ae, forwardRef as ye, useImperativeHandle as Er, useLayoutEffect as le, lazy as T, Suspense as ke, Component as xr, Fragment as Ut, useReducer as Cr, Children as vr } from "react";
|
|
3
|
+
import yr, { SendbirdProduct as _r, DeviceOsPlatform as Ht, SendbirdPlatform as Sr, ConnectionHandler as Je, SendbirdError as Tr, SessionHandler as wr, LogLevel as En, ConnectionState as Ar } from "@sendbird/chat";
|
|
4
|
+
import u, { css as I, ThemeProvider as kr, useTheme as xt, createGlobalStyle as Ir, StyleSheetManager as $r, keyframes as xn } from "styled-components";
|
|
5
|
+
import { format as Cn, isSameMinute as zt, isSameDay as Mr } from "date-fns";
|
|
6
|
+
import { enUS as Or } from "date-fns/locale/en-US";
|
|
7
|
+
import { AIAgentModule as Lr, ConversationStatus as W, ConversationType as Rr } from "@sendbird/chat/aiAgent";
|
|
8
|
+
import { useGroupChannelMessages as Dr, useGroupChannelHandler as Xe, useForceUpdate as Nr } from "@sendbird/uikit-tools";
|
|
9
|
+
import { GroupChannelModule as Pr, GroupChannelListOrder as vn, GroupChannelHandler as Br } from "@sendbird/chat/groupChannel";
|
|
10
|
+
import { renderer as Fr, parser as Ur, MessageProvider as Hr } from "@sendbird/react-uikit-message-template-view";
|
|
11
|
+
import { createMessageTemplate as zr } from "@sendbird/uikit-message-template";
|
|
12
|
+
import yn from "dompurify";
|
|
13
|
+
import { SendingStatus as dt, MessageMetaArray as Vr } from "@sendbird/chat/message";
|
|
14
|
+
import { isSameDay as Wr } from "date-fns/isSameDay";
|
|
15
|
+
import { createPortal as Gr } from "react-dom";
|
|
16
|
+
import jr from "@emotion/is-prop-valid";
|
|
17
|
+
const G = (e, t) => {
|
|
18
|
+
const n = ve(null), o = ({ children: i, value: l }) => /* @__PURE__ */ r.createElement(n.Provider, { value: l }, typeof i == "function" ? i(l) : i), s = ({ children: i }) => /* @__PURE__ */ r.createElement(n.Consumer, null, (l) => l ? typeof i == "function" ? i(l) : i : null), a = () => {
|
|
19
|
+
const i = X(n);
|
|
20
|
+
if (!i)
|
|
21
|
+
throw new Error(`use${e}Context must be used within a ${e}Provider`);
|
|
22
|
+
return i;
|
|
23
|
+
};
|
|
24
|
+
return n.displayName = `${e}Context`, o.displayName = `${e}Provider`, s.displayName = `${e}Consumer`, a.displayName = `use${e}Context`, { Context: n, Provider: o, Consumer: s, useContext: a };
|
|
25
|
+
};
|
|
26
|
+
function _e(e) {
|
|
27
|
+
const t = ve({
|
|
28
|
+
Template: e.template,
|
|
29
|
+
updateTemplate: () => {
|
|
30
|
+
},
|
|
31
|
+
components: e.components,
|
|
32
|
+
updateComponent: () => {
|
|
33
|
+
}
|
|
34
|
+
});
|
|
35
|
+
function n({ children: a }) {
|
|
36
|
+
const [i, l] = _(() => e.template), [c, d] = _(e.components), g = {
|
|
37
|
+
Template: i,
|
|
38
|
+
updateTemplate: (h) => l(() => h),
|
|
39
|
+
components: c,
|
|
40
|
+
updateComponent: (h, f) => d((x) => ({ ...x, [h]: f }))
|
|
41
|
+
};
|
|
42
|
+
return /* @__PURE__ */ r.createElement(t.Provider, { value: g }, a);
|
|
43
|
+
}
|
|
44
|
+
function o({ template: a, children: i }) {
|
|
45
|
+
const { updateTemplate: l } = X(t);
|
|
46
|
+
return L(() => {
|
|
47
|
+
a && l(a);
|
|
48
|
+
}, [a]), /* @__PURE__ */ r.createElement(r.Fragment, null, i);
|
|
49
|
+
}
|
|
50
|
+
function s({ children: a }) {
|
|
51
|
+
return /* @__PURE__ */ r.createElement(n, null, a);
|
|
52
|
+
}
|
|
53
|
+
return s.defaults = e, s.useContext = () => X(t), s.Context = t, s.Template = o, Object.keys(e.components).forEach((a) => {
|
|
54
|
+
s[a] = function({
|
|
55
|
+
component: l
|
|
56
|
+
}) {
|
|
57
|
+
const { updateComponent: c } = X(t);
|
|
58
|
+
return L(() => {
|
|
59
|
+
l && c(a, l);
|
|
60
|
+
}, [l]), null;
|
|
61
|
+
};
|
|
62
|
+
}), s;
|
|
63
|
+
}
|
|
64
|
+
function Kr(...e) {
|
|
65
|
+
return function({ children: n }) {
|
|
66
|
+
return e.reduce((o, s) => /* @__PURE__ */ r.createElement(s, null, o), n);
|
|
67
|
+
};
|
|
68
|
+
}
|
|
69
|
+
function ut() {
|
|
70
|
+
}
|
|
71
|
+
function Zr() {
|
|
72
|
+
const e = /iPad|iPhone|iPod/.test(navigator.userAgent), t = /Android/.test(navigator.userAgent);
|
|
73
|
+
return e || t;
|
|
74
|
+
}
|
|
75
|
+
function Yr(e) {
|
|
76
|
+
let t = 0;
|
|
77
|
+
for (let n = 0; n < e.length; n++)
|
|
78
|
+
t = (t << 5) - t + e.charCodeAt(n), t |= 0;
|
|
79
|
+
return t.toString(16);
|
|
80
|
+
}
|
|
81
|
+
const Vt = (e) => {
|
|
82
|
+
try {
|
|
83
|
+
return JSON.parse(e === "" ? "{}" : e);
|
|
84
|
+
} catch {
|
|
85
|
+
return {};
|
|
86
|
+
}
|
|
87
|
+
}, Se = {
|
|
88
|
+
isStreaming(e) {
|
|
89
|
+
const t = Vt(e.data);
|
|
90
|
+
return typeof t == "object" && !!t.stream;
|
|
91
|
+
},
|
|
92
|
+
isWelcomeMessage(e, t) {
|
|
93
|
+
var n;
|
|
94
|
+
if (((n = e.extendedMessagePayload) == null ? void 0 : n.bot_message_type) === "welcome")
|
|
95
|
+
return !0;
|
|
96
|
+
if ((e.isUserMessage() || e.isFileMessage()) && e.sender.userId === t) {
|
|
97
|
+
const o = Vt(e.data);
|
|
98
|
+
return !(o != null && o.respond_mesg_id) && !(o != null && o.stream);
|
|
99
|
+
}
|
|
100
|
+
return !1;
|
|
101
|
+
},
|
|
102
|
+
isGeneratedMessage(e) {
|
|
103
|
+
var t;
|
|
104
|
+
return ((t = e.extendedMessagePayload) == null ? void 0 : t.bot_message_type) === "generated";
|
|
105
|
+
},
|
|
106
|
+
checkExtendedFieldPresence(e) {
|
|
107
|
+
const t = e.extendedMessagePayload || {}, n = (i) => i.some((l) => typeof t[l] < "u"), o = n(ot.ui), s = n(ot.trail), a = n(ot.marking);
|
|
108
|
+
return { ui: o, trail: s, marking: a };
|
|
109
|
+
},
|
|
110
|
+
shouldScrollToBottom(e, t, n = !1) {
|
|
111
|
+
if ((e.isUserMessage() || e.isFileMessage() || e.isMultipleFilesMessage()) && e.sender.userId === t) {
|
|
112
|
+
if (this.isGeneratedMessage(e) && this.isStreaming(e))
|
|
113
|
+
return !0;
|
|
114
|
+
const { ui: a, trail: i, marking: l } = this.checkExtendedFieldPresence(e);
|
|
115
|
+
return a ? !(!n && l) : !!(n && (i || l));
|
|
116
|
+
}
|
|
117
|
+
return !0;
|
|
118
|
+
}
|
|
119
|
+
}, ot = {
|
|
120
|
+
ui: ["suggested_replies", "cta_button", "message_template", "csat"],
|
|
121
|
+
trail: ["groundedness", "manual", "function_calls"],
|
|
122
|
+
marking: ["is_hallucination", "is_moderated", "flagged_types"]
|
|
123
|
+
}, qr = "1.3.0", Ee = "sb-agent", Jr = qr, st = `@${Ee}`, Wt = ({ appId: e, aiAgentId: t, storage: n }) => {
|
|
124
|
+
const o = {
|
|
125
|
+
templateBase: `${st}-template`,
|
|
126
|
+
template: (s) => `${o.templateBase}/templates/${s}`,
|
|
127
|
+
templateToken: () => `${o.templateBase}-template/message-template/tokens`,
|
|
128
|
+
messengerSession: (s) => {
|
|
129
|
+
const a = Yr(`${e}/${t}/${s}`);
|
|
130
|
+
return `${st}-udata/${a}`;
|
|
131
|
+
},
|
|
132
|
+
anonUserSession: () => `${st}-session/${e}/${t}`
|
|
133
|
+
};
|
|
134
|
+
return {
|
|
135
|
+
template: {
|
|
136
|
+
set: (s, a) => n.set(o.template(s), a),
|
|
137
|
+
get: (s) => n.get(o.template(s)),
|
|
138
|
+
setCachedToken: (s) => n.set(o.templateToken(), s),
|
|
139
|
+
getCachedToken: () => n.get(o.templateToken()),
|
|
140
|
+
clear: () => {
|
|
141
|
+
n.getKeys(o.templateBase).forEach(n.delete);
|
|
142
|
+
}
|
|
143
|
+
},
|
|
144
|
+
messenger: {
|
|
145
|
+
getSettings: (s) => {
|
|
146
|
+
try {
|
|
147
|
+
const a = n.get(o.messengerSession(s));
|
|
148
|
+
return a ? JSON.parse(a) : null;
|
|
149
|
+
} catch {
|
|
150
|
+
return null;
|
|
151
|
+
}
|
|
152
|
+
},
|
|
153
|
+
setSettings: (s, a) => {
|
|
154
|
+
try {
|
|
155
|
+
const i = JSON.stringify(a);
|
|
156
|
+
n.set(o.messengerSession(s), i);
|
|
157
|
+
} catch {
|
|
158
|
+
return;
|
|
159
|
+
}
|
|
160
|
+
},
|
|
161
|
+
getAnonUser: () => {
|
|
162
|
+
try {
|
|
163
|
+
const s = n.get(o.anonUserSession());
|
|
164
|
+
return s ? JSON.parse(s) : null;
|
|
165
|
+
} catch {
|
|
166
|
+
return null;
|
|
167
|
+
}
|
|
168
|
+
},
|
|
169
|
+
setAnonUser: (s) => {
|
|
170
|
+
try {
|
|
171
|
+
const a = JSON.stringify(s);
|
|
172
|
+
n.set(o.anonUserSession(), a);
|
|
173
|
+
} catch {
|
|
174
|
+
return;
|
|
175
|
+
}
|
|
176
|
+
},
|
|
177
|
+
clear: (s) => {
|
|
178
|
+
try {
|
|
179
|
+
n.delete(o.messengerSession(s)), n.delete(o.anonUserSession());
|
|
180
|
+
} catch {
|
|
181
|
+
return;
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
};
|
|
186
|
+
};
|
|
187
|
+
class _n {
|
|
188
|
+
constructor(t) {
|
|
189
|
+
this.logger = t, this.subscribers = {};
|
|
190
|
+
}
|
|
191
|
+
async send(t) {
|
|
192
|
+
const n = Xr(), o = this.subscribers[t.type];
|
|
193
|
+
if (o) {
|
|
194
|
+
this.logger.debug(`messenger.dispatcher: dispatching command: ${t.type}`, t.payload);
|
|
195
|
+
const s = o.map((a) => a(t.payload));
|
|
196
|
+
await Promise.all(s).catch((a) => {
|
|
197
|
+
this.logger.error(`messenger.dispatcher: error in callback for command: ${t.type}`, a);
|
|
198
|
+
});
|
|
199
|
+
}
|
|
200
|
+
return n.resolve(), n.promise;
|
|
201
|
+
}
|
|
202
|
+
subscribe(t, n) {
|
|
203
|
+
this.subscribers[t] || (this.subscribers[t] = []), this.subscribers[t].push(n);
|
|
204
|
+
}
|
|
205
|
+
unsubscribe(t, n) {
|
|
206
|
+
this.subscribers[t] && (this.subscribers[t] = this.subscribers[t].filter((o) => o !== n));
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
const Xr = () => {
|
|
210
|
+
let e = ut, t = ut;
|
|
211
|
+
return { promise: new Promise((o, s) => {
|
|
212
|
+
e = o, t = s;
|
|
213
|
+
}), resolve: e, reject: t };
|
|
214
|
+
};
|
|
215
|
+
var Sn = /* @__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))(Sn || {});
|
|
216
|
+
class Tn {
|
|
217
|
+
constructor(t) {
|
|
218
|
+
this.level = t;
|
|
219
|
+
}
|
|
220
|
+
verbose(...t) {
|
|
221
|
+
this.level <= 0 && console.log(`[${Ee}/verbose]`, ...t);
|
|
222
|
+
}
|
|
223
|
+
debug(...t) {
|
|
224
|
+
this.level <= 1 && console.log(`[${Ee}/debug]`, ...t);
|
|
225
|
+
}
|
|
226
|
+
info(...t) {
|
|
227
|
+
this.level <= 2 && console.log(`[${Ee}/info]`, ...t);
|
|
228
|
+
}
|
|
229
|
+
warn(...t) {
|
|
230
|
+
this.level <= 3 && console.warn(`[${Ee}/warn]`, ...t);
|
|
231
|
+
}
|
|
232
|
+
error(...t) {
|
|
233
|
+
this.level <= 4 && console.error(`[${Ee}/error]`, ...t);
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
function Gt(e, t, n) {
|
|
237
|
+
const o = yr.init({
|
|
238
|
+
appId: e,
|
|
239
|
+
modules: [new Pr(), new Lr()],
|
|
240
|
+
localCacheEnabled: !0,
|
|
241
|
+
...n
|
|
242
|
+
});
|
|
243
|
+
return o.addSendbirdExtensions(
|
|
244
|
+
[{ version: Jr, product: _r.AI_AGENT, platform: t.platform }],
|
|
245
|
+
{ platform: t.deviceOSPlatform, version: t.deviceOSVersion },
|
|
246
|
+
t.customData
|
|
247
|
+
) || console.warn("Invalid Sendbird Extensions", t), o;
|
|
248
|
+
}
|
|
249
|
+
const {
|
|
250
|
+
Provider: Qr,
|
|
251
|
+
useContext: ue
|
|
252
|
+
} = G("AIAgent");
|
|
253
|
+
function eo({
|
|
254
|
+
appId: e,
|
|
255
|
+
aiAgentId: t,
|
|
256
|
+
keyValueStorage: n,
|
|
257
|
+
language: o,
|
|
258
|
+
countryCode: s,
|
|
259
|
+
context: a,
|
|
260
|
+
chatSDK: i,
|
|
261
|
+
chatParams: l,
|
|
262
|
+
children: c,
|
|
263
|
+
logger: d,
|
|
264
|
+
dispatcher: g,
|
|
265
|
+
extensions: h = {
|
|
266
|
+
platform: Sr.JS,
|
|
267
|
+
deviceOSPlatform: Zr() ? Ht.MOBILE_WEB : Ht.WEB
|
|
268
|
+
}
|
|
269
|
+
}) {
|
|
270
|
+
const [f, x] = _(() => {
|
|
271
|
+
const b = d ?? new Tn(Sn.WARN), E = g ?? new _n(b);
|
|
272
|
+
return {
|
|
273
|
+
appId: e,
|
|
274
|
+
aiAgentId: t,
|
|
275
|
+
language: o,
|
|
276
|
+
countryCode: s,
|
|
277
|
+
context: a,
|
|
278
|
+
keyValueStorage: n,
|
|
279
|
+
logger: b,
|
|
280
|
+
dispatcher: E,
|
|
281
|
+
chatSDK: i ?? Gt(e, h, l),
|
|
282
|
+
cache: Wt({ appId: e, aiAgentId: t, storage: n })
|
|
283
|
+
};
|
|
284
|
+
});
|
|
285
|
+
return L(() => {
|
|
286
|
+
x((b) => {
|
|
287
|
+
let E = b.logger, m = b.dispatcher, C = b.chatSDK;
|
|
288
|
+
return d && d !== b.logger && (E = d), g && g !== b.dispatcher && (m = g), i && i !== b.chatSDK ? C = i : !i && b.chatSDK.appId !== e && (C = Gt(e, h, { newInstance: !0, ...l })), {
|
|
289
|
+
...b,
|
|
290
|
+
appId: e,
|
|
291
|
+
aiAgentId: t,
|
|
292
|
+
keyValueStorage: n,
|
|
293
|
+
language: o,
|
|
294
|
+
countryCode: s,
|
|
295
|
+
context: a,
|
|
296
|
+
logger: E,
|
|
297
|
+
dispatcher: m,
|
|
298
|
+
chatSDK: C,
|
|
299
|
+
cache: Wt({ appId: e, aiAgentId: t, storage: n })
|
|
300
|
+
};
|
|
301
|
+
});
|
|
302
|
+
}, [e, t, o, s, a, d, g, i]), L(() => () => {
|
|
303
|
+
f.chatSDK.disconnectWebSocket();
|
|
304
|
+
}, [f.chatSDK]), /* @__PURE__ */ r.createElement(Qr, { value: f }, c);
|
|
305
|
+
}
|
|
306
|
+
const to = (e, t, n) => Dr(e, t, { ...n, strictStreamingOrder: !0 });
|
|
307
|
+
var mt = /* @__PURE__ */ ((e) => (e.ConversationClose = "conv.close", e))(mt || {});
|
|
308
|
+
class no {
|
|
309
|
+
constructor(t = {}) {
|
|
310
|
+
this.payload = t;
|
|
311
|
+
}
|
|
312
|
+
toJSON() {
|
|
313
|
+
return JSON.stringify({ type: this.type, payload: this.payload });
|
|
314
|
+
}
|
|
315
|
+
}
|
|
316
|
+
const ro = {
|
|
317
|
+
CloseConversation: (e) => new oo(e)
|
|
318
|
+
};
|
|
319
|
+
class oo extends no {
|
|
320
|
+
constructor() {
|
|
321
|
+
super(...arguments), this.type = "conv.close";
|
|
322
|
+
}
|
|
323
|
+
}
|
|
324
|
+
const {
|
|
325
|
+
Provider: so
|
|
326
|
+
} = G("AIAgentConversation");
|
|
327
|
+
function io({
|
|
328
|
+
children: e,
|
|
329
|
+
channelUrl: t,
|
|
330
|
+
onChannelDeleted: n,
|
|
331
|
+
onMessagesReceived: o,
|
|
332
|
+
onMessagesUpdated: s,
|
|
333
|
+
onConversationClosedViaDispatcher: a,
|
|
334
|
+
onBeforeSendMessage: i,
|
|
335
|
+
onAfterSendMessage: l = ut
|
|
336
|
+
}) {
|
|
337
|
+
var m;
|
|
338
|
+
const { chatSDK: c, logger: d, dispatcher: g } = ue(), { channel: h, channelFetchError: f, fetchChannel: x } = ao(t), b = to(c, h, {
|
|
339
|
+
shouldCountNewMessages: () => !1,
|
|
340
|
+
onChannelDeleted: n,
|
|
341
|
+
onMessagesReceived: (C) => o == null ? void 0 : o(C),
|
|
342
|
+
onMessagesUpdated: (C) => s == null ? void 0 : s(C),
|
|
343
|
+
logger: d
|
|
344
|
+
});
|
|
345
|
+
L(() => {
|
|
346
|
+
const C = async (v) => {
|
|
347
|
+
const S = typeof (v == null ? void 0 : v.channelUrl) == "string";
|
|
348
|
+
h && S && v.channelUrl !== h.url || (d.debug("conversation.dispatcher: try to close conversation", h), h != null && h.conversation && h.conversation.status === W.OPEN && (await h.closeConversation(), a == null || a()));
|
|
349
|
+
};
|
|
350
|
+
return g.subscribe(mt.ConversationClose, C), () => {
|
|
351
|
+
g.unsubscribe(mt.ConversationClose, C);
|
|
352
|
+
};
|
|
353
|
+
}, [g, (m = h == null ? void 0 : h.conversation) == null ? void 0 : m.status, a]);
|
|
354
|
+
const E = {
|
|
355
|
+
conversation: (h == null ? void 0 : h.conversation) ?? void 0,
|
|
356
|
+
channelSource: {
|
|
357
|
+
channel: h,
|
|
358
|
+
error: f,
|
|
359
|
+
refetch: () => x()
|
|
360
|
+
},
|
|
361
|
+
messageSource: {
|
|
362
|
+
messages: b.messages,
|
|
363
|
+
initialized: b.initialized,
|
|
364
|
+
loadPrevious: () => b.loadPrevious(),
|
|
365
|
+
loadNext: () => b.loadNext(),
|
|
366
|
+
sendUserMessage: async (C) => {
|
|
367
|
+
var S;
|
|
368
|
+
if (((S = h == null ? void 0 : h.conversation) == null ? void 0 : S.status) === W.CLOSED)
|
|
369
|
+
throw new Error("Conversation is closed");
|
|
370
|
+
i && (C = await i(C));
|
|
371
|
+
const v = await b.sendUserMessage(C, l);
|
|
372
|
+
return l == null || l(v), v;
|
|
373
|
+
},
|
|
374
|
+
sendFileMessage: async (C) => {
|
|
375
|
+
var S;
|
|
376
|
+
if (((S = h == null ? void 0 : h.conversation) == null ? void 0 : S.status) === W.CLOSED)
|
|
377
|
+
throw new Error("Conversation is closed");
|
|
378
|
+
i && (C = await i(C));
|
|
379
|
+
const v = await b.sendFileMessage(C, l);
|
|
380
|
+
return l == null || l(v), v;
|
|
381
|
+
}
|
|
382
|
+
}
|
|
383
|
+
};
|
|
384
|
+
return /* @__PURE__ */ r.createElement(so, { value: E }, e);
|
|
385
|
+
}
|
|
386
|
+
function ao(e) {
|
|
387
|
+
const { chatSDK: t, logger: n } = ue(), [o, s] = _(void 0), [a, i] = _(void 0);
|
|
388
|
+
async function l() {
|
|
389
|
+
if (n.debug("conversation.fetchChannel: start"), s(void 0), i(void 0), e)
|
|
390
|
+
try {
|
|
391
|
+
n.debug("conversation.fetchChannel: get channel", e);
|
|
392
|
+
const c = await t.groupChannel.getChannel(e);
|
|
393
|
+
s(c);
|
|
394
|
+
const d = new Je({ onReconnectSucceeded: () => c.refresh() });
|
|
395
|
+
t.addConnectionHandler(`sba-refresh-${e}`, d), n.debug("conversation.fetchChannel: fetched channel", c);
|
|
396
|
+
} catch (c) {
|
|
397
|
+
c instanceof Tr && i(c), n.error("conversation.fetchChannel: error", c);
|
|
398
|
+
}
|
|
399
|
+
}
|
|
400
|
+
return L(() => {
|
|
401
|
+
l();
|
|
402
|
+
}, [e, t]), {
|
|
403
|
+
channel: o,
|
|
404
|
+
channelFetchError: a,
|
|
405
|
+
fetchChannel: l
|
|
406
|
+
};
|
|
407
|
+
}
|
|
408
|
+
class lo {
|
|
409
|
+
/**
|
|
410
|
+
* Creates a new ConversationListCollection instance.
|
|
411
|
+
* @param sdk - The Sendbird Chat SDK instance
|
|
412
|
+
* @param params - Configuration parameters for the collection
|
|
413
|
+
*/
|
|
414
|
+
constructor(t, { filter: n, limit: o = 20 }) {
|
|
415
|
+
var s, a, i, l, c;
|
|
416
|
+
this._isDisposed = !1, this._handlerId = `handler-id-${Date.now()}`, this._order = vn.LATEST_LAST_MESSAGE, this.filter = n, this._sdk = t, this._pinnedChannels = [], this._channels = [], this._limit = o, this._query = this._sdk.aiAgent.createMyGroupChannelListQuery({
|
|
417
|
+
aiAgentChannelFilter: (s = this.filter) == null ? void 0 : s.aiAgentChannelFilter,
|
|
418
|
+
aiAgentConversationStatusFilter: (a = this.filter) == null ? void 0 : a.aiAgentConversationStatusFilter,
|
|
419
|
+
aiAgentIds: (i = this.filter) == null ? void 0 : i.aiAgentIds,
|
|
420
|
+
deskChannelFilter: (l = this.filter) == null ? void 0 : l.deskChannelFilter,
|
|
421
|
+
pinnedChannelUrls: (c = this.filter) == null ? void 0 : c.pinnedChannelUrls,
|
|
422
|
+
limit: this._limit
|
|
423
|
+
}), this._token = "", this._timestamp = Number.MAX_SAFE_INTEGER, this._isSyncing = !1, this._channelHandler = new Br({
|
|
424
|
+
onChannelChanged: (d) => {
|
|
425
|
+
d.isGroupChannel() && (this._query.belongsTo(d) ? this._addChannelsToView([d], !1) : this._removeChannelsFromView([d.url]));
|
|
426
|
+
},
|
|
427
|
+
onChannelDeleted: (d) => {
|
|
428
|
+
this._removeChannelsFromView([d]);
|
|
429
|
+
}
|
|
430
|
+
}), this._connectionHandler = new Je({
|
|
431
|
+
onReconnectSucceeded: () => {
|
|
432
|
+
this._isDefaultChangelogSyncTimestampUpdated && this._syncChannelChangelogs();
|
|
433
|
+
}
|
|
434
|
+
}), this._sdk.addConnectionHandler(this._handlerId, this._connectionHandler), this._sdk.groupChannel.addGroupChannelHandler(this._handlerId, this._channelHandler);
|
|
435
|
+
}
|
|
436
|
+
/**
|
|
437
|
+
* Checks if the default changelog sync timestamp has been updated.
|
|
438
|
+
*/
|
|
439
|
+
get _isDefaultChangelogSyncTimestampUpdated() {
|
|
440
|
+
return this._timestamp !== Number.MAX_SAFE_INTEGER;
|
|
441
|
+
}
|
|
442
|
+
/**
|
|
443
|
+
* Sets the default changelog sync timestamp based on the first non-pinned channel.
|
|
444
|
+
* @param channels - Array of channels to analyze
|
|
445
|
+
*/
|
|
446
|
+
_setDefaultChangelogsSyncTimestamp(t) {
|
|
447
|
+
var a, i;
|
|
448
|
+
const n = new Set(((a = this.filter) == null ? void 0 : a.pinnedChannelUrls) ?? []), o = t.find((l) => !n.has(l.url));
|
|
449
|
+
let s;
|
|
450
|
+
o ? s = ((i = o.lastMessage) == null ? void 0 : i.createdAt) ?? o.createdAt : s = this._query.lastResponseAt, this._timestamp > s && (this._timestamp = s);
|
|
451
|
+
}
|
|
452
|
+
/**
|
|
453
|
+
* Synchronizes channel changelogs to keep the collection up-to-date.
|
|
454
|
+
* @returns Promise that resolves to an empty array
|
|
455
|
+
*/
|
|
456
|
+
async _syncChannelChangelogs() {
|
|
457
|
+
if (this._isDisposed) return [];
|
|
458
|
+
if (this._isSyncing) return [];
|
|
459
|
+
try {
|
|
460
|
+
this._isSyncing = !0;
|
|
461
|
+
let t;
|
|
462
|
+
for (this._token ? t = await this._sdk.aiAgent.getMyGroupChannelChangeLogsByToken(this._token, this.filter) : t = await this._sdk.aiAgent.getMyGroupChannelChangeLogsByTimestamp(this._timestamp, this.filter), this._token = t.token, this._addChannelsToView(t.updatedChannels), this._removeChannelsFromView(t.deletedChannelUrls); t.hasMore && t.token; )
|
|
463
|
+
t = await this._sdk.aiAgent.getMyGroupChannelChangeLogsByToken(this._token, this.filter), this._token = t.token, this._addChannelsToView(t.updatedChannels), this._removeChannelsFromView(t.deletedChannelUrls);
|
|
464
|
+
} catch {
|
|
465
|
+
} finally {
|
|
466
|
+
this._isSyncing = !1;
|
|
467
|
+
}
|
|
468
|
+
return [];
|
|
469
|
+
}
|
|
470
|
+
/**
|
|
471
|
+
* Upserts pinned channels maintaining the order specified in pinnedChannelUrls.
|
|
472
|
+
* @param channels - Pinned channels to upsert
|
|
473
|
+
* @returns Object containing added, updated channels and unmatched URLs
|
|
474
|
+
*/
|
|
475
|
+
_upsertPinnedChannelsToArray(t) {
|
|
476
|
+
var l;
|
|
477
|
+
const n = ((l = this.filter) == null ? void 0 : l.pinnedChannelUrls) ?? [], o = new Map(n.map((c, d) => [c, d])), s = [], a = [], i = [];
|
|
478
|
+
for (const c of t) {
|
|
479
|
+
if (!this._query.belongsTo(c)) {
|
|
480
|
+
i.push(c.url);
|
|
481
|
+
continue;
|
|
482
|
+
}
|
|
483
|
+
const d = o.get(c.url);
|
|
484
|
+
if (d === void 0) continue;
|
|
485
|
+
const g = gt(this._pinnedChannels, c);
|
|
486
|
+
g >= 0 ? (this._pinnedChannels.splice(g, 1), a.push(c)) : s.push(c);
|
|
487
|
+
const f = this._pinnedChannels.findIndex((b) => (o.get(b.url) ?? 1 / 0) > d), x = f === -1 ? this._pinnedChannels.length : f;
|
|
488
|
+
this._pinnedChannels.splice(x, 0, c);
|
|
489
|
+
}
|
|
490
|
+
return { addedChannels: s, updatedChannels: a, unmatchedChannelUrls: i };
|
|
491
|
+
}
|
|
492
|
+
/**
|
|
493
|
+
* Upserts regular (non-pinned) channels with time-based sorting.
|
|
494
|
+
* @param channels - Regular channels to upsert
|
|
495
|
+
* @param forceAppend - Whether to force append channels at the end regardless of hasMore status
|
|
496
|
+
* @returns Object containing added, updated channels and unmatched URLs
|
|
497
|
+
*/
|
|
498
|
+
_upsertRegularChannelsToArray(t, n = !1) {
|
|
499
|
+
const o = [], s = [], a = [];
|
|
500
|
+
for (const i of t) {
|
|
501
|
+
if (!this._query.belongsTo(i)) {
|
|
502
|
+
o.push(i.url);
|
|
503
|
+
continue;
|
|
504
|
+
}
|
|
505
|
+
const l = gt(this._channels, i), c = l < 0;
|
|
506
|
+
!c && this._channels.splice(l, 1);
|
|
507
|
+
const g = co(this._channels, i, this._order).place, h = g === this._channels.length;
|
|
508
|
+
c ? h ? (n || !this.hasMore) && (this._channels.push(i), s.push(i)) : (this._channels.splice(g, 0, i), s.push(i)) : (this._channels.splice(g, 0, i), a.push(i));
|
|
509
|
+
}
|
|
510
|
+
return { addedChannels: s, updatedChannels: a, unmatchedChannelUrls: o };
|
|
511
|
+
}
|
|
512
|
+
/**
|
|
513
|
+
* Adds or updates channels in the collection, separating pinned and non-pinned channels.
|
|
514
|
+
* @param channels - Channels to add or update
|
|
515
|
+
* @param forceAppend - Whether to force append channels at the end
|
|
516
|
+
*/
|
|
517
|
+
_addChannelsToView(t, n = !1) {
|
|
518
|
+
var h, f, x, b, E;
|
|
519
|
+
const o = new Set(((h = this.filter) == null ? void 0 : h.pinnedChannelUrls) ?? []), s = [], a = [];
|
|
520
|
+
for (const m of t)
|
|
521
|
+
o.has(m.url) ? s.push(m) : a.push(m);
|
|
522
|
+
const i = this._upsertPinnedChannelsToArray(s), l = this._upsertRegularChannelsToArray(a, n), c = i.addedChannels.concat(l.addedChannels), d = i.updatedChannels.concat(l.updatedChannels), g = i.unmatchedChannelUrls.concat(l.unmatchedChannelUrls);
|
|
523
|
+
c.length > 0 && ((x = (f = this._collectionEventHandler) == null ? void 0 : f.onChannelsAdded) == null || x.call(f, {}, c)), d.length > 0 && ((E = (b = this._collectionEventHandler) == null ? void 0 : b.onChannelsUpdated) == null || E.call(b, {}, d)), g.length > 0 && this._removeChannelsFromView(g);
|
|
524
|
+
}
|
|
525
|
+
/**
|
|
526
|
+
* Removes channels from the collection by their URLs.
|
|
527
|
+
* @param channelUrls - Array of channel URLs to remove
|
|
528
|
+
*/
|
|
529
|
+
_removeChannelsFromView(t) {
|
|
530
|
+
var s, a, i;
|
|
531
|
+
const n = new Set(((s = this.filter) == null ? void 0 : s.pinnedChannelUrls) ?? []), o = [];
|
|
532
|
+
for (const l of t)
|
|
533
|
+
if (n.has(l)) {
|
|
534
|
+
const c = this._pinnedChannels.findIndex((d) => d.url === l);
|
|
535
|
+
c >= 0 && (o.push(l), this._pinnedChannels.splice(c, 1));
|
|
536
|
+
} else {
|
|
537
|
+
const c = this._channels.findIndex((d) => d.url === l);
|
|
538
|
+
c >= 0 && (o.push(l), this._channels.splice(c, 1));
|
|
539
|
+
}
|
|
540
|
+
o.length > 0 && ((i = (a = this._collectionEventHandler) == null ? void 0 : a.onChannelsDeleted) == null || i.call(a, {}, o));
|
|
541
|
+
}
|
|
542
|
+
/**
|
|
543
|
+
* Gets all channels in the collection.
|
|
544
|
+
* Pinned channels are always returned first, followed by non-pinned channels.
|
|
545
|
+
* @returns Array of GroupChannel objects
|
|
546
|
+
*/
|
|
547
|
+
get channels() {
|
|
548
|
+
return this._isDisposed ? [] : [...this._pinnedChannels, ...this._channels];
|
|
549
|
+
}
|
|
550
|
+
/**
|
|
551
|
+
* Indicates whether the collection has more channels to load.
|
|
552
|
+
* @returns True if more channels can be loaded, false otherwise
|
|
553
|
+
*/
|
|
554
|
+
get hasMore() {
|
|
555
|
+
return this._isDisposed ? !1 : this._query.hasNext;
|
|
556
|
+
}
|
|
557
|
+
/**
|
|
558
|
+
* Loads the next batch of channels from the server.
|
|
559
|
+
* @returns Promise that resolves to an array of newly loaded channels
|
|
560
|
+
*/
|
|
561
|
+
async loadMore() {
|
|
562
|
+
if (this._isDisposed) return [];
|
|
563
|
+
if (this.hasMore) {
|
|
564
|
+
const t = await this._query.next();
|
|
565
|
+
return this._setDefaultChangelogsSyncTimestamp(t), this._addChannelsToView(t, !0), t;
|
|
566
|
+
}
|
|
567
|
+
return [];
|
|
568
|
+
}
|
|
569
|
+
/**
|
|
570
|
+
* Sets the event handler for collection updates.
|
|
571
|
+
* @param handler - Event handler for channel collection changes
|
|
572
|
+
*/
|
|
573
|
+
setConversationListCollectionHandler(t) {
|
|
574
|
+
this._collectionEventHandler = t;
|
|
575
|
+
}
|
|
576
|
+
/**
|
|
577
|
+
* Disposes the collection and cleans up all resources.
|
|
578
|
+
* Stops all event handlers and clears all channels.
|
|
579
|
+
*/
|
|
580
|
+
dispose() {
|
|
581
|
+
this._isDisposed || (this._isDisposed = !0, this._collectionEventHandler = void 0, this._sdk.removeConnectionHandler(this._handlerId), this._sdk.groupChannel.removeGroupChannelHandler(this._handlerId), this._pinnedChannels.length = 0, this._channels.length = 0);
|
|
582
|
+
}
|
|
583
|
+
}
|
|
584
|
+
const gt = (e, t) => e.findIndex((n) => n.isIdentical(t)), co = (e, t, n) => {
|
|
585
|
+
if (e.length > 0) {
|
|
586
|
+
const o = gt(e, t);
|
|
587
|
+
let s = 0, a = e.length - 1, i = Math.floor((s + a) / 2);
|
|
588
|
+
for (; s < a; ) {
|
|
589
|
+
const c = jt(e[i], t, n);
|
|
590
|
+
if (c > 0)
|
|
591
|
+
a = i, i = Math.floor((s + a) / 2);
|
|
592
|
+
else if (c < 0)
|
|
593
|
+
s = i + 1, i = Math.floor((s + a) / 2);
|
|
594
|
+
else
|
|
595
|
+
return { place: i, oldPosition: o };
|
|
596
|
+
}
|
|
597
|
+
return { place: jt(e[i], t, n) >= 0 ? i : i + 1, oldPosition: o };
|
|
598
|
+
}
|
|
599
|
+
return { place: e.length, oldPosition: -1 };
|
|
600
|
+
}, jt = (e, t, n) => {
|
|
601
|
+
switch (n) {
|
|
602
|
+
case vn.LATEST_LAST_MESSAGE:
|
|
603
|
+
if (e.lastMessage && t.lastMessage) {
|
|
604
|
+
const o = t.lastMessage.createdAt - e.lastMessage.createdAt;
|
|
605
|
+
return o === 0 ? t.createdAt - e.createdAt : o;
|
|
606
|
+
} else return e.lastMessage ? -1 : t.lastMessage ? 1 : t.createdAt - e.createdAt;
|
|
607
|
+
default:
|
|
608
|
+
return 0;
|
|
609
|
+
}
|
|
610
|
+
};
|
|
611
|
+
function uo(e, t) {
|
|
612
|
+
var b, E, m, C, v, S, k, F;
|
|
613
|
+
const n = bn(), [o, s] = _(!1), [a, i] = _(null), [l, c] = _([]), [d, g] = _(null), h = N(!1), f = R(async () => {
|
|
614
|
+
if (!h.current && e.currentUser) {
|
|
615
|
+
h.current = !0, s(!1), i(null), c([]);
|
|
616
|
+
try {
|
|
617
|
+
d == null || d.dispose();
|
|
618
|
+
const $ = new lo(e, t);
|
|
619
|
+
$.setConversationListCollectionHandler({
|
|
620
|
+
onChannelsAdded: () => {
|
|
621
|
+
c($.channels);
|
|
622
|
+
},
|
|
623
|
+
onChannelsUpdated: () => {
|
|
624
|
+
c($.channels);
|
|
625
|
+
},
|
|
626
|
+
onChannelsDeleted: () => {
|
|
627
|
+
c($.channels);
|
|
628
|
+
}
|
|
629
|
+
}), await $.loadMore(), g($), i(null);
|
|
630
|
+
} catch ($) {
|
|
631
|
+
g(null), i($);
|
|
632
|
+
} finally {
|
|
633
|
+
s(!0), h.current = !1;
|
|
634
|
+
}
|
|
635
|
+
}
|
|
636
|
+
}, [
|
|
637
|
+
e,
|
|
638
|
+
(b = t.filter) == null ? void 0 : b.aiAgentChannelFilter,
|
|
639
|
+
(m = (E = t.filter) == null ? void 0 : E.aiAgentConversationStatusFilter) == null ? void 0 : m.join(),
|
|
640
|
+
(v = (C = t.filter) == null ? void 0 : C.aiAgentIds) == null ? void 0 : v.join(),
|
|
641
|
+
(S = t.filter) == null ? void 0 : S.deskChannelFilter,
|
|
642
|
+
(F = (k = t.filter) == null ? void 0 : k.pinnedChannelUrls) == null ? void 0 : F.join(),
|
|
643
|
+
t.limit
|
|
644
|
+
]), x = R(async () => {
|
|
645
|
+
if (d)
|
|
646
|
+
try {
|
|
647
|
+
await d.loadMore();
|
|
648
|
+
} catch ($) {
|
|
649
|
+
i($);
|
|
650
|
+
}
|
|
651
|
+
}, [d]);
|
|
652
|
+
return L(() => (e.addConnectionHandler(n, new Je({ onConnected: () => f() })), () => e.removeConnectionHandler(n)), [e, n, f]), L(() => {
|
|
653
|
+
f();
|
|
654
|
+
}, [f]), L(() => () => {
|
|
655
|
+
h.current = !1, d == null || d.dispose();
|
|
656
|
+
}, [d]), {
|
|
657
|
+
initialized: o,
|
|
658
|
+
error: a,
|
|
659
|
+
channels: l,
|
|
660
|
+
loadMore: x
|
|
661
|
+
};
|
|
662
|
+
}
|
|
663
|
+
const {
|
|
664
|
+
Provider: mo
|
|
665
|
+
} = G("AIAgentConversationList");
|
|
666
|
+
function go({ conversationListFilter: e, children: t }) {
|
|
667
|
+
const { chatSDK: n, aiAgentId: o } = ue(), s = uo(n, {
|
|
668
|
+
filter: {
|
|
669
|
+
aiAgentIds: [o],
|
|
670
|
+
aiAgentConversationStatusFilter: [W.CLOSED],
|
|
671
|
+
...e
|
|
672
|
+
}
|
|
673
|
+
}), a = {
|
|
674
|
+
listSource: {
|
|
675
|
+
initialized: s.initialized,
|
|
676
|
+
error: s.error ?? void 0,
|
|
677
|
+
channels: s.channels,
|
|
678
|
+
loadMore: () => s.loadMore()
|
|
679
|
+
}
|
|
680
|
+
};
|
|
681
|
+
return /* @__PURE__ */ r.createElement(mo, { value: a }, t);
|
|
682
|
+
}
|
|
683
|
+
const ht = {
|
|
684
|
+
DEFAULT_BOT_MSG_BG: "#eeeeee",
|
|
685
|
+
WHITE: "#ffffff",
|
|
686
|
+
BLACK: "#000000"
|
|
687
|
+
};
|
|
688
|
+
function wn(e) {
|
|
689
|
+
return e.length === 4 ? `#${[...e.slice(1)].map((t) => t + t).join("")}` : e;
|
|
690
|
+
}
|
|
691
|
+
function ho(e) {
|
|
692
|
+
const t = wn(e);
|
|
693
|
+
return [
|
|
694
|
+
parseInt(t.slice(1, 3), 16),
|
|
695
|
+
// r
|
|
696
|
+
parseInt(t.slice(3, 5), 16),
|
|
697
|
+
// g
|
|
698
|
+
parseInt(t.slice(5, 7), 16)
|
|
699
|
+
// b
|
|
700
|
+
];
|
|
701
|
+
}
|
|
702
|
+
function po(e) {
|
|
703
|
+
return `#${e.map((t) => t.toString(16).padStart(2, "0")).join("")}`;
|
|
704
|
+
}
|
|
705
|
+
function fo(e, t, n) {
|
|
706
|
+
e /= 255, t /= 255, n /= 255;
|
|
707
|
+
const o = Math.max(e, t, n), s = Math.min(e, t, n), a = o - s;
|
|
708
|
+
let i = 0, l = 0;
|
|
709
|
+
const c = (o + s) / 2;
|
|
710
|
+
return o !== s && (l = c > 0.5 ? a / (2 - o - s) : a / (o + s)), o === e ? i = (t - n) / a + (t < n ? 6 : 0) : o === t ? i = (n - e) / a + 2 : o === n && (i = (e - t) / a + 4), i /= 6, [i, l, c];
|
|
711
|
+
}
|
|
712
|
+
function bo(e, t, n) {
|
|
713
|
+
let o, s, a;
|
|
714
|
+
if (t === 0)
|
|
715
|
+
o = s = a = n;
|
|
716
|
+
else {
|
|
717
|
+
const i = function(g, h, f) {
|
|
718
|
+
return f < 0 && (f += 1), f > 1 && (f -= 1), f < 0.16666666666666666 ? g + (h - g) * 6 * f : f < 0.5 ? h : f < 0.6666666666666666 ? g + (h - g) * (0.6666666666666666 - f) * 6 : g;
|
|
719
|
+
}, l = n < 0.5 ? n * (1 + t) : n + t - n * t, c = 2 * n - l;
|
|
720
|
+
o = i(c, l, e + 1 / 3), s = i(c, l, e), a = i(c, l, e - 1 / 3);
|
|
721
|
+
}
|
|
722
|
+
return [Math.round(o * 255), Math.round(s * 255), Math.round(a * 255)];
|
|
723
|
+
}
|
|
724
|
+
function Be(e, t, n) {
|
|
725
|
+
const [o, s, a] = ho(e), [i, l, c] = fo(o, s, a), d = Math.max(0, Math.min(1, c * t)), g = Math.max(0, Math.min(1, l * n)), [h, f, x] = bo(i, g, d);
|
|
726
|
+
return po([Math.round(h), Math.round(f), Math.round(x)]);
|
|
727
|
+
}
|
|
728
|
+
function Eo(e, t = "light") {
|
|
729
|
+
return {
|
|
730
|
+
extraDark: Be(e, 0.6, 1.2),
|
|
731
|
+
dark: Be(e, 0.85, 1.1),
|
|
732
|
+
main: e,
|
|
733
|
+
light: Be(e, t === "dark" ? 1.1 : 1.5, t === "dark" ? 0.95 : 0.9),
|
|
734
|
+
extraLight: Be(e, t === "dark" ? 1.2 : 1.75, t === "dark" ? 0.9 : 0.8)
|
|
735
|
+
};
|
|
736
|
+
}
|
|
737
|
+
function pt(e) {
|
|
738
|
+
const t = wn(e), n = 149, o = +`0x${t[1]}${t[2]}`, s = +`0x${t[3]}${t[4]}`, a = +`0x${t[5]}${t[6]}`;
|
|
739
|
+
return o * 0.299 + s * 0.587 + a * 0.114 > n ? ht.BLACK : ht.WHITE;
|
|
740
|
+
}
|
|
741
|
+
function xo(e, t, n, o, s) {
|
|
742
|
+
return {
|
|
743
|
+
base: {
|
|
744
|
+
primary: t,
|
|
745
|
+
primaryContrastContent: n,
|
|
746
|
+
background: e.background50,
|
|
747
|
+
headerBackground: e.background50,
|
|
748
|
+
modalContentBackground: e.background50
|
|
749
|
+
},
|
|
750
|
+
metadata: {
|
|
751
|
+
errorContent: e.ondark.textHighEmphasis,
|
|
752
|
+
placeholderText: e.onlight.textLowEmphasis
|
|
753
|
+
},
|
|
754
|
+
messageInput: {
|
|
755
|
+
background: e.background100
|
|
756
|
+
},
|
|
757
|
+
messageIncoming: {
|
|
758
|
+
text: s,
|
|
759
|
+
background: o
|
|
760
|
+
},
|
|
761
|
+
messageOutgoing: {
|
|
762
|
+
text: n,
|
|
763
|
+
background: t
|
|
764
|
+
},
|
|
765
|
+
csat: {
|
|
766
|
+
background: e.background100
|
|
767
|
+
}
|
|
768
|
+
};
|
|
769
|
+
}
|
|
770
|
+
const Co = (e, t, n, o, s) => ({
|
|
771
|
+
base: {
|
|
772
|
+
primary: t,
|
|
773
|
+
primaryContrastContent: n,
|
|
774
|
+
background: e.background600,
|
|
775
|
+
headerBackground: e.background500,
|
|
776
|
+
modalContentBackground: e.background500
|
|
777
|
+
},
|
|
778
|
+
metadata: {
|
|
779
|
+
errorContent: e.ondark.textHighEmphasis,
|
|
780
|
+
placeholderText: e.ondark.textLowEmphasis
|
|
781
|
+
},
|
|
782
|
+
messageInput: {
|
|
783
|
+
background: e.background400
|
|
784
|
+
},
|
|
785
|
+
messageIncoming: {
|
|
786
|
+
text: s,
|
|
787
|
+
background: o
|
|
788
|
+
},
|
|
789
|
+
messageOutgoing: {
|
|
790
|
+
text: n,
|
|
791
|
+
background: t
|
|
792
|
+
},
|
|
793
|
+
csat: {
|
|
794
|
+
background: e.background400
|
|
795
|
+
}
|
|
796
|
+
}), Fe = {
|
|
797
|
+
primary: {
|
|
798
|
+
extraDark: "#491389",
|
|
799
|
+
dark: "#6211c8",
|
|
800
|
+
main: "#742ddd",
|
|
801
|
+
light: "#c2a9fa",
|
|
802
|
+
extraLight: "#dbd1ff"
|
|
803
|
+
},
|
|
804
|
+
secondary: {
|
|
805
|
+
extraDark: "#066858",
|
|
806
|
+
dark: "#027d69",
|
|
807
|
+
main: "#259c72",
|
|
808
|
+
light: "#69c085",
|
|
809
|
+
extraLight: "#a8e2ab"
|
|
810
|
+
},
|
|
811
|
+
error: {
|
|
812
|
+
extraDark: "#9d091e",
|
|
813
|
+
dark: "#bf0711",
|
|
814
|
+
main: "#de360b",
|
|
815
|
+
light: "#f66161",
|
|
816
|
+
extraLight: "#fdaaaa"
|
|
817
|
+
},
|
|
818
|
+
information: {
|
|
819
|
+
extraDark: "#241389",
|
|
820
|
+
dark: "#362ca9",
|
|
821
|
+
main: "#4a48cd",
|
|
822
|
+
light: "#a9bbfa",
|
|
823
|
+
extraLight: "#d1dbff"
|
|
824
|
+
},
|
|
825
|
+
background700: "#000000",
|
|
826
|
+
background600: "#161616",
|
|
827
|
+
background500: "#2c2c2c",
|
|
828
|
+
background400: "#393939",
|
|
829
|
+
background300: "#bdbdbd",
|
|
830
|
+
background200: "#e0e0e0",
|
|
831
|
+
background100: "#eeeeee",
|
|
832
|
+
background50: "#ffffff",
|
|
833
|
+
onlight: {
|
|
834
|
+
textHighEmphasis: "rgba(0, 0, 0, 0.88)",
|
|
835
|
+
textMidEmphasis: "rgba(0, 0, 0, 0.5)",
|
|
836
|
+
textLowEmphasis: "rgba(0, 0, 0, 0.38)",
|
|
837
|
+
textDisabled: "rgba(0, 0, 0, 0.12)"
|
|
838
|
+
},
|
|
839
|
+
ondark: {
|
|
840
|
+
textHighEmphasis: "rgba(255, 255, 255, 0.88)",
|
|
841
|
+
textMidEmphasis: "rgba(255, 255, 255, 0.5)",
|
|
842
|
+
textLowEmphasis: "rgba(255, 255, 255, 0.38)",
|
|
843
|
+
textDisabled: "rgba(255, 255, 255, 0.12)"
|
|
844
|
+
},
|
|
845
|
+
overlay: {
|
|
846
|
+
dark: "rgba(0, 0, 0, 0.55)",
|
|
847
|
+
light: "rgba(22, 22, 22, 0.32)"
|
|
848
|
+
}
|
|
849
|
+
}, it = {
|
|
850
|
+
h1: { fontSize: 18, fontWeight: 700 },
|
|
851
|
+
h2: { fontSize: 16, fontWeight: 700 },
|
|
852
|
+
subtitle1: { fontSize: 16, fontWeight: 500 },
|
|
853
|
+
subtitle2: { fontSize: 16, fontWeight: 400 },
|
|
854
|
+
body1: { fontSize: 16, fontWeight: 400 },
|
|
855
|
+
body2: { fontSize: 14, fontWeight: 500 },
|
|
856
|
+
body3: { fontSize: 14, fontWeight: 400 },
|
|
857
|
+
button: { fontSize: 14, fontWeight: 700 },
|
|
858
|
+
caption1: { fontSize: 12, fontWeight: 700 },
|
|
859
|
+
caption2: { fontSize: 12, fontWeight: 400 },
|
|
860
|
+
caption3: { fontSize: 11, fontWeight: 700 },
|
|
861
|
+
caption4: { fontSize: 11, fontWeight: 400 }
|
|
862
|
+
};
|
|
863
|
+
function Kt(e) {
|
|
864
|
+
const t = vo(e), { colors: n, aiAgentColorVariables: o } = yo(e, t), s = So(e);
|
|
865
|
+
return {
|
|
866
|
+
selectedTheme: e.selectedTheme,
|
|
867
|
+
palette: t,
|
|
868
|
+
colors: n,
|
|
869
|
+
aiAgentColorVariables: o,
|
|
870
|
+
typography: s
|
|
871
|
+
};
|
|
872
|
+
}
|
|
873
|
+
function vo({ selectedTheme: e, palette: t, primary: n }) {
|
|
874
|
+
const o = t != null && t.primary ? t.primary : n ? n === Fe.primary.main ? Fe.primary : Eo(n, e) : Fe.primary;
|
|
875
|
+
return {
|
|
876
|
+
...Fe,
|
|
877
|
+
primary: o,
|
|
878
|
+
...t
|
|
879
|
+
};
|
|
880
|
+
}
|
|
881
|
+
function yo({ selectedTheme: e, primaryContrast: t, botMessageBackground: n, botMessageBackgroundContrast: o }, s) {
|
|
882
|
+
const a = s.primary.main, i = t ?? pt(a), l = n ?? ht.DEFAULT_BOT_MSG_BG, c = o ?? pt(l);
|
|
883
|
+
return {
|
|
884
|
+
colors: (e === "light" ? xo : Co)(
|
|
885
|
+
s,
|
|
886
|
+
a,
|
|
887
|
+
i,
|
|
888
|
+
l,
|
|
889
|
+
c
|
|
890
|
+
),
|
|
891
|
+
aiAgentColorVariables: {
|
|
892
|
+
primary_color: a,
|
|
893
|
+
bot_message_bg_color: l,
|
|
894
|
+
primary_contrast_color: i,
|
|
895
|
+
bot_message_bg_contrast_color: c
|
|
896
|
+
}
|
|
897
|
+
};
|
|
898
|
+
}
|
|
899
|
+
function _o(e, t, n) {
|
|
900
|
+
const o = { ...e };
|
|
901
|
+
return n.forEach((s) => {
|
|
902
|
+
const a = t[s];
|
|
903
|
+
a != null && (o[s] = a);
|
|
904
|
+
}), o;
|
|
905
|
+
}
|
|
906
|
+
function So({ typography: e }) {
|
|
907
|
+
if (!e)
|
|
908
|
+
return it;
|
|
909
|
+
const t = { ...it };
|
|
910
|
+
return Object.keys(e).forEach((n) => {
|
|
911
|
+
const o = e[n];
|
|
912
|
+
if (o && typeof o == "object") {
|
|
913
|
+
const s = it[n], a = ["fontSize", "fontWeight", "fontFamily", "lineHeight"];
|
|
914
|
+
t[n] = _o(s, o, a);
|
|
915
|
+
}
|
|
916
|
+
}), t;
|
|
917
|
+
}
|
|
918
|
+
const {
|
|
919
|
+
Provider: To,
|
|
920
|
+
useContext: Ct
|
|
921
|
+
} = G("AIAgentTheme");
|
|
922
|
+
function wo({ logger: e, palette: t, typography: n, appearance: o, children: s }) {
|
|
923
|
+
const [a, i] = _(
|
|
924
|
+
() => Kt({
|
|
925
|
+
selectedTheme: (o == null ? void 0 : o.theme) ?? "light",
|
|
926
|
+
palette: t,
|
|
927
|
+
typography: n,
|
|
928
|
+
primary: o == null ? void 0 : o.primaryColor,
|
|
929
|
+
botMessageBackground: o == null ? void 0 : o.botMessageBackgroundColor
|
|
930
|
+
})
|
|
931
|
+
), l = R(
|
|
932
|
+
(c, d) => {
|
|
933
|
+
const g = (o == null ? void 0 : o.theme) ?? c, h = d == null ? void 0 : d(g), f = {
|
|
934
|
+
primary: o == null ? void 0 : o.primaryColor,
|
|
935
|
+
primaryContrast: void 0,
|
|
936
|
+
botMessageBackground: o == null ? void 0 : o.botMessageBackgroundColor,
|
|
937
|
+
botMessageBackgroundContrast: void 0
|
|
938
|
+
};
|
|
939
|
+
!f.primary && (h != null && h.primaryColor) && (f.primary = h.primaryColor, f.primaryContrast = h.primaryContrastColor), !f.botMessageBackground && (h != null && h.botMessageBackgroundColor) && (f.botMessageBackground = h.botMessageBackgroundColor, f.botMessageBackgroundContrast = h.botMessageBackgroundContrastColor);
|
|
940
|
+
const x = Kt({ selectedTheme: g, palette: t, typography: n, ...f });
|
|
941
|
+
i(x), e == null || e.info("theme.update:", g);
|
|
942
|
+
},
|
|
943
|
+
[o == null ? void 0 : o.theme, o == null ? void 0 : o.primaryColor, o == null ? void 0 : o.botMessageBackgroundColor, t, n, e]
|
|
944
|
+
);
|
|
945
|
+
return L(() => {
|
|
946
|
+
(o != null && o.theme || o != null && o.primaryColor || o != null && o.botMessageBackgroundColor) && l(a.selectedTheme);
|
|
947
|
+
}, [o == null ? void 0 : o.theme, o == null ? void 0 : o.primaryColor, o == null ? void 0 : o.botMessageBackgroundColor]), /* @__PURE__ */ r.createElement(To, { value: { theme: a, updateTheme: l } }, s);
|
|
948
|
+
}
|
|
949
|
+
function Ao() {
|
|
950
|
+
const { chatSDK: e, logger: t } = ue(), n = R(
|
|
951
|
+
async (s, a, i) => {
|
|
952
|
+
if (t.debug("useChatConnection.connect: start, session", s.userId), a) {
|
|
953
|
+
const l = new wr({
|
|
954
|
+
...a,
|
|
955
|
+
onSessionTokenRequired: ko(a.onSessionTokenRequired, i)
|
|
956
|
+
});
|
|
957
|
+
e.setSessionHandler(l);
|
|
958
|
+
}
|
|
959
|
+
await e.connect(s.userId, s.authToken), t.debug("useChatConnection.connect: end, currentUser", e.currentUser);
|
|
960
|
+
},
|
|
961
|
+
[e, t]
|
|
962
|
+
), o = R(async () => {
|
|
963
|
+
t.debug("useChatConnection.disconnect: start"), await e.disconnect(), t.debug("useChatConnection.disconnect: end");
|
|
964
|
+
}, [e, t]);
|
|
965
|
+
return { connect: n, disconnect: o };
|
|
966
|
+
}
|
|
967
|
+
function ko(e, t) {
|
|
968
|
+
if (e)
|
|
969
|
+
return async (n, o) => {
|
|
970
|
+
new Promise((s, a) => e == null ? void 0 : e(s, a)).then((s) => {
|
|
971
|
+
s && (t == null || t(s)), n(s);
|
|
972
|
+
}).catch((s) => {
|
|
973
|
+
o(s);
|
|
974
|
+
});
|
|
975
|
+
};
|
|
976
|
+
}
|
|
977
|
+
class Io {
|
|
978
|
+
constructor({ userId: t, authToken: n, sessionHandler: o }) {
|
|
979
|
+
this.userId = t, this.authToken = n, this.sessionHandler = o;
|
|
980
|
+
}
|
|
981
|
+
}
|
|
982
|
+
class Zt {
|
|
983
|
+
}
|
|
984
|
+
const $o = 24 * 60 * 60 * 1e3, Mo = (e) => {
|
|
985
|
+
const { logger: t, cache: n } = ue(), o = () => {
|
|
986
|
+
const a = n.messenger.getAnonUser();
|
|
987
|
+
return a ? a.expireAt - $o <= Date.now() ? (t.debug("useUserSessionCandidate.getAnonymousSessionInfo: auto session expired, clear cache"), n.messenger.clear(a.userId), null) : (t.debug("useUserSessionCandidate.getAnonymousSessionInfo: auto session info detected"), a) : null;
|
|
988
|
+
}, s = () => {
|
|
989
|
+
if (!e || e instanceof Zt)
|
|
990
|
+
throw new Error("userSessionInfo must be an instance of ManualSessionInfo");
|
|
991
|
+
const a = ["authToken", "sessionHandler"].filter((i) => !(i in e));
|
|
992
|
+
return a.length > 0 && t.error(
|
|
993
|
+
`useUserSessionCandidate.getManualSessionInfo: missing required keys in userSessionInfo: ${a.join(", ")}`
|
|
994
|
+
), t.debug("useUserSessionCandidate.getManualSessionInfo: manual session info detected"), e;
|
|
995
|
+
};
|
|
996
|
+
return ae(() => e instanceof Io ? s() : e instanceof Zt ? o() : e && typeof e == "object" ? (t.warn("Please use ManualSessionInfo instead of the old userSessionInfo format."), s()) : e === void 0 ? (t.warn("Please use AnonymousSessionInfo instead of undefined userSessionInfo."), o()) : null, [
|
|
997
|
+
t,
|
|
998
|
+
e == null ? void 0 : e.userId,
|
|
999
|
+
e == null ? void 0 : e.authToken,
|
|
1000
|
+
e == null ? void 0 : e.sessionHandler,
|
|
1001
|
+
n.messenger.getAnonUser,
|
|
1002
|
+
n.messenger.clear
|
|
1003
|
+
]);
|
|
1004
|
+
};
|
|
1005
|
+
function Oo({
|
|
1006
|
+
userSessionInfo: e,
|
|
1007
|
+
onPreAuth: t,
|
|
1008
|
+
onPostAuth: n,
|
|
1009
|
+
onErrorAuth: o,
|
|
1010
|
+
onAuthTokenRefreshed: s,
|
|
1011
|
+
onPostDeauth: a,
|
|
1012
|
+
forceCreateChannel: i
|
|
1013
|
+
}) {
|
|
1014
|
+
const { aiAgentId: l, chatSDK: c, language: d, context: g, countryCode: h, logger: f, cache: x } = ue(), { connect: b, disconnect: E } = Ao(), m = Mo(e), C = R(async () => {
|
|
1015
|
+
var $;
|
|
1016
|
+
f.debug("useAuthentication.authenticate: start");
|
|
1017
|
+
const S = (m == null ? void 0 : m.userId) && (($ = x.messenger.getSettings(m.userId)) == null ? void 0 : $.knownActiveChannelUrl), k = await c.aiAgent.requestMessengerSettings({
|
|
1018
|
+
aiAgentId: l,
|
|
1019
|
+
userId: m == null ? void 0 : m.userId,
|
|
1020
|
+
language: d,
|
|
1021
|
+
country: h,
|
|
1022
|
+
context: g,
|
|
1023
|
+
forceCreateChannel: i,
|
|
1024
|
+
knownActiveChannelUrl: S
|
|
1025
|
+
});
|
|
1026
|
+
f.debug("useAuthentication.authenticate: messenger settings response", k);
|
|
1027
|
+
let F = null;
|
|
1028
|
+
if (k.auto_created_user) {
|
|
1029
|
+
const { user_id: V, session_token: ne, expire_at: y } = k.auto_created_user;
|
|
1030
|
+
x.messenger.setAnonUser({ userId: V, authToken: ne, expireAt: y }), F = { userId: V, authToken: ne };
|
|
1031
|
+
} else
|
|
1032
|
+
F = {
|
|
1033
|
+
userId: (m == null ? void 0 : m.userId) ?? "",
|
|
1034
|
+
authToken: (m == null ? void 0 : m.authToken) ?? ""
|
|
1035
|
+
};
|
|
1036
|
+
x.messenger.setSettings(F.userId, {
|
|
1037
|
+
knownActiveChannelUrl: k.active_channel.channel_url
|
|
1038
|
+
});
|
|
1039
|
+
try {
|
|
1040
|
+
await t(k, F), await b(F, m == null ? void 0 : m.sessionHandler, s), await n(k, F);
|
|
1041
|
+
} catch (V) {
|
|
1042
|
+
V instanceof Error && (o(V), f.error("useAuthentication.authenticate: failed to connect", V));
|
|
1043
|
+
}
|
|
1044
|
+
return k;
|
|
1045
|
+
}, [
|
|
1046
|
+
c,
|
|
1047
|
+
b,
|
|
1048
|
+
m == null ? void 0 : m.userId,
|
|
1049
|
+
m == null ? void 0 : m.sessionHandler,
|
|
1050
|
+
m == null ? void 0 : m.authToken,
|
|
1051
|
+
x.messenger.setAnonUser,
|
|
1052
|
+
x.messenger.getSettings,
|
|
1053
|
+
x.messenger.setSettings,
|
|
1054
|
+
t,
|
|
1055
|
+
n,
|
|
1056
|
+
o,
|
|
1057
|
+
s
|
|
1058
|
+
]), v = R(async () => {
|
|
1059
|
+
f.debug("useAuthentication.deauthenticate: start"), await E(), a(), f.debug("useAuthentication.deauthenticate: completed");
|
|
1060
|
+
}, [E, f, a]);
|
|
1061
|
+
return {
|
|
1062
|
+
authenticate: C,
|
|
1063
|
+
deauthenticate: v,
|
|
1064
|
+
userSessionCandidate: m
|
|
1065
|
+
};
|
|
1066
|
+
}
|
|
1067
|
+
const An = (e) => {
|
|
1068
|
+
try {
|
|
1069
|
+
const t = JSON.parse(e);
|
|
1070
|
+
return typeof t == "string" ? JSON.stringify(t).slice(1, -1) : e.trim();
|
|
1071
|
+
} catch {
|
|
1072
|
+
return JSON.stringify(e).slice(1, -1);
|
|
1073
|
+
}
|
|
1074
|
+
}, $e = (e) => JSON.parse(e), Qe = (e) => JSON.parse(e);
|
|
1075
|
+
function Lo(e, t) {
|
|
1076
|
+
const [n, o] = t.split(",").map((s) => s.trim());
|
|
1077
|
+
return e === "dark" && o || n;
|
|
1078
|
+
}
|
|
1079
|
+
function Ro(e) {
|
|
1080
|
+
const t = {};
|
|
1081
|
+
function n(o, s = "") {
|
|
1082
|
+
for (const [a, i] of Object.entries(o)) {
|
|
1083
|
+
const l = s ? `${s}.${a}` : a;
|
|
1084
|
+
i && typeof i == "object" && !Array.isArray(i) ? n(i, l) : t[l] = i;
|
|
1085
|
+
}
|
|
1086
|
+
}
|
|
1087
|
+
return n(e), t;
|
|
1088
|
+
}
|
|
1089
|
+
function vt({
|
|
1090
|
+
template: e,
|
|
1091
|
+
variables: t,
|
|
1092
|
+
variableKeyPattern: n,
|
|
1093
|
+
variableValueTransformer: o
|
|
1094
|
+
}) {
|
|
1095
|
+
return Object.entries(t).reduce((s, [a, i]) => {
|
|
1096
|
+
if (!o && !["number", "boolean", "string"].includes(typeof i))
|
|
1097
|
+
throw new Error(`If transformer is not provided, value(${a}:${i}) must be a {string, number, or boolean}`);
|
|
1098
|
+
const l = o ? o(i) : String(i), c = n(a);
|
|
1099
|
+
return s.replace(c, An(l));
|
|
1100
|
+
}, e);
|
|
1101
|
+
}
|
|
1102
|
+
async function Do({
|
|
1103
|
+
template: e,
|
|
1104
|
+
variables: t,
|
|
1105
|
+
variableKeyPattern: n,
|
|
1106
|
+
variableValueTransformer: o
|
|
1107
|
+
}) {
|
|
1108
|
+
return (await Promise.all(
|
|
1109
|
+
Object.entries(t).map(async ([a, i]) => {
|
|
1110
|
+
const l = await o(i);
|
|
1111
|
+
return { regex: n(a), transformedValue: l };
|
|
1112
|
+
})
|
|
1113
|
+
)).reduce((a, { regex: i, transformedValue: l }) => a.replace(i, An(l)), e);
|
|
1114
|
+
}
|
|
1115
|
+
const No = () => {
|
|
1116
|
+
const { chatSDK: e, logger: t, cache: n } = ue(), o = R(() => {
|
|
1117
|
+
var l, c;
|
|
1118
|
+
const a = (c = (l = e.appInfo) == null ? void 0 : l.aiAgentInfo) == null ? void 0 : c.templateListToken;
|
|
1119
|
+
if (!a) return !1;
|
|
1120
|
+
const i = n.template.getCachedToken();
|
|
1121
|
+
return i ? a !== i : !0;
|
|
1122
|
+
}, [e, n.template.getCachedToken]), s = R(async () => {
|
|
1123
|
+
try {
|
|
1124
|
+
const { templates: a, token: i } = await e.aiAgent.getMessageTemplates({ limit: 20 });
|
|
1125
|
+
for (const { template: l } of a) {
|
|
1126
|
+
const { key: c } = $e(l);
|
|
1127
|
+
n.template.set(c, l);
|
|
1128
|
+
}
|
|
1129
|
+
n.template.setCachedToken(i);
|
|
1130
|
+
} catch (a) {
|
|
1131
|
+
t == null || t.error("messageTemplateContext.syncCachedTemplates: error:", a);
|
|
1132
|
+
}
|
|
1133
|
+
}, [e, t, n.template.set, n.template.setCachedToken]);
|
|
1134
|
+
return {
|
|
1135
|
+
shouldSyncCachedTemplate: o,
|
|
1136
|
+
syncCachedTemplates: s
|
|
1137
|
+
};
|
|
1138
|
+
};
|
|
1139
|
+
var je = /* @__PURE__ */ ((e) => (e.OFF = "off", e.ALWAYS = "always", e.HANDED_OFF_ONLY = "handed_off_only", e))(je || {});
|
|
1140
|
+
const Po = {
|
|
1141
|
+
off: "off",
|
|
1142
|
+
always: "always",
|
|
1143
|
+
handed_off_only: "handed_off_only"
|
|
1144
|
+
/* HANDED_OFF_ONLY */
|
|
1145
|
+
}, {
|
|
1146
|
+
Provider: Bo
|
|
1147
|
+
} = G("AIAgentMessengerSession"), Fo = ye(
|
|
1148
|
+
function({ userSessionInfo: e, forceCreateChannel: t, children: n }, o) {
|
|
1149
|
+
const { appId: s, aiAgentId: a, chatSDK: i, language: l, countryCode: c, context: d, cache: g, logger: h } = ue(), { updateTheme: f } = Ct(), [x, b] = _(void 0), [E, m] = _(
|
|
1150
|
+
void 0
|
|
1151
|
+
), [C, v] = _(null), [S, k] = _(null), [F, $] = _(null), [V, ne] = _(
|
|
1152
|
+
"handed_off_only"
|
|
1153
|
+
/* HANDED_OFF_ONLY */
|
|
1154
|
+
), { shouldSyncCachedTemplate: y, syncCachedTemplates: H } = No(), { authenticate: re, deauthenticate: Y } = Oo({
|
|
1155
|
+
userSessionInfo: e,
|
|
1156
|
+
forceCreateChannel: t,
|
|
1157
|
+
onPreAuth: R((A, D) => {
|
|
1158
|
+
const K = A.appearance.selected_theme;
|
|
1159
|
+
f(K, (q) => {
|
|
1160
|
+
const be = A.appearance.themes[q];
|
|
1161
|
+
return {
|
|
1162
|
+
primaryColor: be.primary_color,
|
|
1163
|
+
botMessageBackgroundColor: be.bot_message_bg_color,
|
|
1164
|
+
primaryContrastColor: be.primary_contrast_color,
|
|
1165
|
+
botMessageBackgroundContrastColor: be.bot_message_bg_contrast_color
|
|
1166
|
+
};
|
|
1167
|
+
}), b(void 0), v(D), k({
|
|
1168
|
+
userId: A.bot.bot_userid,
|
|
1169
|
+
profileUrl: A.bot.bot_profile_url,
|
|
1170
|
+
nickname: A.bot.bot_nickname,
|
|
1171
|
+
replyToFile: A.bot.reply_to_file,
|
|
1172
|
+
specialNotice: A.bot.special_notice,
|
|
1173
|
+
specialNoticeEnabled: A.bot.is_special_notice_enabled,
|
|
1174
|
+
showHandoffButton: A.bot.show_handoff_button ?? !0
|
|
1175
|
+
}), $({
|
|
1176
|
+
type: A.launcher.image_type || "default_icon",
|
|
1177
|
+
imageUrl: A.launcher.image_url
|
|
1178
|
+
}), ne(
|
|
1179
|
+
Po[A.active_channel.attachment_mode] ?? "handed_off_only"
|
|
1180
|
+
/* HANDED_OFF_ONLY */
|
|
1181
|
+
);
|
|
1182
|
+
}, []),
|
|
1183
|
+
onPostAuth: R(
|
|
1184
|
+
async (A) => {
|
|
1185
|
+
y() && await H(), m({ url: A.active_channel.channel_url, status: W.OPEN });
|
|
1186
|
+
},
|
|
1187
|
+
[y, H]
|
|
1188
|
+
),
|
|
1189
|
+
onErrorAuth: R((A) => {
|
|
1190
|
+
b(A);
|
|
1191
|
+
}, []),
|
|
1192
|
+
onAuthTokenRefreshed: R((A) => {
|
|
1193
|
+
v((D) => D ? { ...D, authToken: A } : null);
|
|
1194
|
+
}, []),
|
|
1195
|
+
onPostDeauth: R(() => {
|
|
1196
|
+
g.template.clear(), C != null && C.userId && g.messenger.clear(C.userId), m(void 0), v(null), k(null), $(null);
|
|
1197
|
+
}, [g.template.clear, C])
|
|
1198
|
+
}), nt = R(async () => {
|
|
1199
|
+
var A;
|
|
1200
|
+
if (C) {
|
|
1201
|
+
h.debug("agentMessengerSession.refreshActiveChannel: try to refresh active channel"), m(void 0);
|
|
1202
|
+
const D = await i.aiAgent.requestMessengerSettings({
|
|
1203
|
+
aiAgentId: a,
|
|
1204
|
+
userId: C.userId,
|
|
1205
|
+
language: l,
|
|
1206
|
+
country: c,
|
|
1207
|
+
context: d,
|
|
1208
|
+
forceCreateChannel: t,
|
|
1209
|
+
knownActiveChannelUrl: (A = g.messenger.getSettings(C.userId)) == null ? void 0 : A.knownActiveChannelUrl
|
|
1210
|
+
});
|
|
1211
|
+
return g.messenger.setSettings(C.userId, {
|
|
1212
|
+
knownActiveChannelUrl: D.active_channel.channel_url
|
|
1213
|
+
}), m({ url: D.active_channel.channel_url, status: W.OPEN }), h.info(
|
|
1214
|
+
"agentMessengerSession.refreshActiveChannel: refreshed active channel",
|
|
1215
|
+
D.active_channel.channel_url
|
|
1216
|
+
), D.active_channel.channel_url;
|
|
1217
|
+
} else
|
|
1218
|
+
throw h.error("agentMessengerSession.refreshActiveChannel: userSession is not ready"), new Error("userSession is not ready");
|
|
1219
|
+
}, [
|
|
1220
|
+
i,
|
|
1221
|
+
s,
|
|
1222
|
+
a,
|
|
1223
|
+
C == null ? void 0 : C.userId,
|
|
1224
|
+
l,
|
|
1225
|
+
c,
|
|
1226
|
+
d,
|
|
1227
|
+
t,
|
|
1228
|
+
g.messenger.getSettings,
|
|
1229
|
+
g.messenger.setSettings
|
|
1230
|
+
]), rt = R(
|
|
1231
|
+
async (A) => {
|
|
1232
|
+
if (!(C != null && C.userId))
|
|
1233
|
+
throw new Error("Current user is not authenticated. Please authenticate first.");
|
|
1234
|
+
const K = (await i.aiAgent.requestMessengerSettings({
|
|
1235
|
+
...A,
|
|
1236
|
+
userId: C.userId,
|
|
1237
|
+
knownActiveChannelUrl: void 0
|
|
1238
|
+
})).active_channel.channel_url;
|
|
1239
|
+
return g.messenger.setSettings(C.userId, { knownActiveChannelUrl: K }), K;
|
|
1240
|
+
},
|
|
1241
|
+
[C == null ? void 0 : C.userId]
|
|
1242
|
+
);
|
|
1243
|
+
return Xe(i, {
|
|
1244
|
+
onChannelChanged: (A) => {
|
|
1245
|
+
var D;
|
|
1246
|
+
A.isGroupChannel() && A.url === (E == null ? void 0 : E.url) && (h.info("agentMessengerSession.channelChanged: channel.conversation", A.conversation), m({ url: A.url, status: ((D = A.conversation) == null ? void 0 : D.status) ?? W.OPEN }));
|
|
1247
|
+
}
|
|
1248
|
+
}), Er(o, () => {
|
|
1249
|
+
const A = async () => {
|
|
1250
|
+
if (!E) throw new Error("No active conversation. Please start a conversation first.");
|
|
1251
|
+
return await i.groupChannel.getChannel(E.url);
|
|
1252
|
+
};
|
|
1253
|
+
return {
|
|
1254
|
+
activeChannel: E,
|
|
1255
|
+
chatSDK: i,
|
|
1256
|
+
authenticate: re,
|
|
1257
|
+
deauthenticate: Y,
|
|
1258
|
+
updateContext: async (D) => {
|
|
1259
|
+
const q = await (await A()).updateContext(a, D);
|
|
1260
|
+
return { ...q, context: q.context ?? {} };
|
|
1261
|
+
},
|
|
1262
|
+
patchContext: async (D) => {
|
|
1263
|
+
const q = await (await A()).patchContext(a, D);
|
|
1264
|
+
return { ...q, context: q.context ?? {} };
|
|
1265
|
+
},
|
|
1266
|
+
getContextObject: async () => {
|
|
1267
|
+
const K = await (await A()).getContextObject(a);
|
|
1268
|
+
return { ...K, context: K.context ?? {} };
|
|
1269
|
+
}
|
|
1270
|
+
};
|
|
1271
|
+
}, [re, Y, E, i, a, h]), /* @__PURE__ */ r.createElement(
|
|
1272
|
+
Bo,
|
|
1273
|
+
{
|
|
1274
|
+
value: {
|
|
1275
|
+
userSessionInfo: e,
|
|
1276
|
+
userSession: C,
|
|
1277
|
+
activeChannel: E,
|
|
1278
|
+
setActiveChannel: m,
|
|
1279
|
+
refreshActiveChannel: nt,
|
|
1280
|
+
createConversation: rt,
|
|
1281
|
+
connectionError: x,
|
|
1282
|
+
aiAgentInfo: S,
|
|
1283
|
+
launcherInfo: F,
|
|
1284
|
+
authenticate: re,
|
|
1285
|
+
deauthenticate: Y,
|
|
1286
|
+
attachmentMode: V
|
|
1287
|
+
}
|
|
1288
|
+
},
|
|
1289
|
+
n
|
|
1290
|
+
);
|
|
1291
|
+
}
|
|
1292
|
+
);
|
|
1293
|
+
function Uo(e) {
|
|
1294
|
+
let t = "pending", n = e.then((o) => {
|
|
1295
|
+
t = "resolved", n = o;
|
|
1296
|
+
}).catch((o) => {
|
|
1297
|
+
t = "rejected", n = o;
|
|
1298
|
+
});
|
|
1299
|
+
return {
|
|
1300
|
+
get value() {
|
|
1301
|
+
if (t === "resolved")
|
|
1302
|
+
return n;
|
|
1303
|
+
throw n;
|
|
1304
|
+
}
|
|
1305
|
+
};
|
|
1306
|
+
}
|
|
1307
|
+
const {
|
|
1308
|
+
Provider: Ho,
|
|
1309
|
+
useContext: kn
|
|
1310
|
+
} = G("MessageTemplateFetching");
|
|
1311
|
+
function zo({ children: e, internalVariables: t }) {
|
|
1312
|
+
const n = N({}), o = N({}), [s, a] = _({}), i = R((d, g) => {
|
|
1313
|
+
a((h) => ({
|
|
1314
|
+
...h,
|
|
1315
|
+
[d]: { fetching: !1, error: !1, ...h[d], ...g }
|
|
1316
|
+
}));
|
|
1317
|
+
}, []), l = R(
|
|
1318
|
+
async ({
|
|
1319
|
+
onRequestTemplate: d,
|
|
1320
|
+
onGetCachedTemplate: g,
|
|
1321
|
+
templateKey: h,
|
|
1322
|
+
suspense: f = !1
|
|
1323
|
+
}) => {
|
|
1324
|
+
const x = g(h);
|
|
1325
|
+
if (x) return x;
|
|
1326
|
+
const b = o.current[h];
|
|
1327
|
+
if (b) return b;
|
|
1328
|
+
f || i(h, { fetching: !0 });
|
|
1329
|
+
const E = d(h).catch((m) => {
|
|
1330
|
+
throw f || i(h, { error: !0 }), m;
|
|
1331
|
+
}).finally(() => {
|
|
1332
|
+
f || i(h, { fetching: !1 }), delete o.current[h];
|
|
1333
|
+
});
|
|
1334
|
+
return o.current[h] = E, E;
|
|
1335
|
+
},
|
|
1336
|
+
[i]
|
|
1337
|
+
), c = {
|
|
1338
|
+
internalVariables: t,
|
|
1339
|
+
fetchTemplate: l,
|
|
1340
|
+
suspend: (d, g) => {
|
|
1341
|
+
if (n.current[d])
|
|
1342
|
+
return n.current[d];
|
|
1343
|
+
const h = Uo(g());
|
|
1344
|
+
return n.current[d] = h, h;
|
|
1345
|
+
},
|
|
1346
|
+
getIsFetching: (d) => {
|
|
1347
|
+
var g;
|
|
1348
|
+
return ((g = s[d]) == null ? void 0 : g.fetching) ?? !1;
|
|
1349
|
+
},
|
|
1350
|
+
getHasError: (d) => {
|
|
1351
|
+
var g;
|
|
1352
|
+
return ((g = s[d]) == null ? void 0 : g.error) ?? !1;
|
|
1353
|
+
}
|
|
1354
|
+
};
|
|
1355
|
+
return /* @__PURE__ */ r.createElement(Ho, { value: c }, e);
|
|
1356
|
+
}
|
|
1357
|
+
const et = {
|
|
1358
|
+
VARIABLE: (e) => new RegExp(`\\{${e}\\}`, "g"),
|
|
1359
|
+
VIEW_VARIABLE: (e) => new RegExp(`"{@${e}}"`, "g")
|
|
1360
|
+
};
|
|
1361
|
+
function ce({ uiTemplateString: e, variables: t = {} }) {
|
|
1362
|
+
const n = Ro(t);
|
|
1363
|
+
return vt({
|
|
1364
|
+
template: e,
|
|
1365
|
+
variables: n,
|
|
1366
|
+
variableKeyPattern: (o) => et.VARIABLE(o)
|
|
1367
|
+
});
|
|
1368
|
+
}
|
|
1369
|
+
function de({
|
|
1370
|
+
theme: e,
|
|
1371
|
+
uiTemplateString: t,
|
|
1372
|
+
colorVariables: n = {}
|
|
1373
|
+
}) {
|
|
1374
|
+
return vt({
|
|
1375
|
+
template: t,
|
|
1376
|
+
variables: n,
|
|
1377
|
+
variableKeyPattern: (o) => et.VARIABLE(o),
|
|
1378
|
+
variableValueTransformer: (o) => Lo(e, o)
|
|
1379
|
+
});
|
|
1380
|
+
}
|
|
1381
|
+
function Vo({
|
|
1382
|
+
theme: e,
|
|
1383
|
+
uiTemplateString: t,
|
|
1384
|
+
viewVariables: n = {},
|
|
1385
|
+
aiAgentColorVariables: o,
|
|
1386
|
+
internalVariables: s,
|
|
1387
|
+
onRequestTemplate: a
|
|
1388
|
+
}) {
|
|
1389
|
+
const l = Object.values(n).flat().map((d) => d.key);
|
|
1390
|
+
return [...new Set(l)].some((d) => !a(d)) ? null : vt({
|
|
1391
|
+
template: t,
|
|
1392
|
+
variables: n,
|
|
1393
|
+
variableKeyPattern: (d) => et.VIEW_VARIABLE(d),
|
|
1394
|
+
variableValueTransformer: (d) => {
|
|
1395
|
+
const g = d.map(({ key: h, variables: f }) => {
|
|
1396
|
+
const x = a(h), { ui_template: b, color_variables: E } = $e(x);
|
|
1397
|
+
let m = JSON.stringify(b);
|
|
1398
|
+
return m = ce({
|
|
1399
|
+
uiTemplateString: m,
|
|
1400
|
+
variables: s
|
|
1401
|
+
}), m = de({
|
|
1402
|
+
theme: e,
|
|
1403
|
+
uiTemplateString: m,
|
|
1404
|
+
colorVariables: E
|
|
1405
|
+
}), m = de({
|
|
1406
|
+
theme: e,
|
|
1407
|
+
uiTemplateString: m,
|
|
1408
|
+
colorVariables: o
|
|
1409
|
+
}), m = ce({
|
|
1410
|
+
uiTemplateString: m,
|
|
1411
|
+
variables: f
|
|
1412
|
+
}), Qe(m);
|
|
1413
|
+
});
|
|
1414
|
+
return JSON.stringify(g);
|
|
1415
|
+
}
|
|
1416
|
+
});
|
|
1417
|
+
}
|
|
1418
|
+
async function Wo({
|
|
1419
|
+
theme: e,
|
|
1420
|
+
uiTemplateString: t,
|
|
1421
|
+
viewVariables: n = {},
|
|
1422
|
+
aiAgentColorVariables: o,
|
|
1423
|
+
internalVariables: s,
|
|
1424
|
+
onRequestTemplate: a
|
|
1425
|
+
}) {
|
|
1426
|
+
return Do({
|
|
1427
|
+
template: t,
|
|
1428
|
+
variables: n,
|
|
1429
|
+
variableKeyPattern: (i) => et.VIEW_VARIABLE(i),
|
|
1430
|
+
variableValueTransformer: async (i) => {
|
|
1431
|
+
const l = i.map(async ({ key: d, variables: g }) => {
|
|
1432
|
+
const h = await a(d), { ui_template: f, color_variables: x } = $e(h);
|
|
1433
|
+
let b = JSON.stringify(f);
|
|
1434
|
+
return b = ce({
|
|
1435
|
+
uiTemplateString: b,
|
|
1436
|
+
variables: s
|
|
1437
|
+
}), b = de({
|
|
1438
|
+
theme: e,
|
|
1439
|
+
uiTemplateString: b,
|
|
1440
|
+
colorVariables: x
|
|
1441
|
+
}), b = de({
|
|
1442
|
+
theme: e,
|
|
1443
|
+
uiTemplateString: b,
|
|
1444
|
+
colorVariables: o
|
|
1445
|
+
}), b = ce({
|
|
1446
|
+
uiTemplateString: b,
|
|
1447
|
+
variables: g
|
|
1448
|
+
}), Qe(b);
|
|
1449
|
+
}), c = await Promise.all(l);
|
|
1450
|
+
return JSON.stringify(c);
|
|
1451
|
+
}
|
|
1452
|
+
});
|
|
1453
|
+
}
|
|
1454
|
+
const Go = ({
|
|
1455
|
+
rawTemplate: e,
|
|
1456
|
+
aiAgentColorVariables: t,
|
|
1457
|
+
internalVariables: n,
|
|
1458
|
+
...o
|
|
1459
|
+
}) => {
|
|
1460
|
+
const { ui_template: s, color_variables: a } = $e(e);
|
|
1461
|
+
let i = JSON.stringify(s);
|
|
1462
|
+
if (Object.keys(o.viewVariables ?? {}).length > 0) {
|
|
1463
|
+
const c = Vo({
|
|
1464
|
+
...o,
|
|
1465
|
+
uiTemplateString: i,
|
|
1466
|
+
aiAgentColorVariables: t,
|
|
1467
|
+
internalVariables: n
|
|
1468
|
+
});
|
|
1469
|
+
if (c === null) return null;
|
|
1470
|
+
i = c;
|
|
1471
|
+
}
|
|
1472
|
+
return i = ce({ ...o, uiTemplateString: i, variables: n }), i = de({ ...o, uiTemplateString: i, colorVariables: a }), i = de({ ...o, uiTemplateString: i, colorVariables: t }), i = ce({ ...o, uiTemplateString: i }), Qe(i);
|
|
1473
|
+
}, jo = async ({
|
|
1474
|
+
rawTemplate: e,
|
|
1475
|
+
aiAgentColorVariables: t,
|
|
1476
|
+
internalVariables: n,
|
|
1477
|
+
...o
|
|
1478
|
+
}) => {
|
|
1479
|
+
const { ui_template: s, color_variables: a } = $e(e);
|
|
1480
|
+
let i = JSON.stringify(s);
|
|
1481
|
+
return Object.keys(o.viewVariables ?? {}).length > 0 && (i = await Wo({
|
|
1482
|
+
...o,
|
|
1483
|
+
uiTemplateString: i,
|
|
1484
|
+
aiAgentColorVariables: t,
|
|
1485
|
+
internalVariables: n
|
|
1486
|
+
})), i = ce({ ...o, uiTemplateString: i, variables: n }), i = de({ ...o, uiTemplateString: i, colorVariables: a }), i = de({ ...o, uiTemplateString: i, colorVariables: t }), i = ce({ ...o, uiTemplateString: i }), Qe(i);
|
|
1487
|
+
}, Ko = (e) => {
|
|
1488
|
+
const { aiAgentColorVariables: t = {} } = e, { internalVariables: n } = kn();
|
|
1489
|
+
return _(() => {
|
|
1490
|
+
const o = e.onGetCachedTemplate(e.templateKey);
|
|
1491
|
+
return o ? Go({
|
|
1492
|
+
...e,
|
|
1493
|
+
rawTemplate: o,
|
|
1494
|
+
aiAgentColorVariables: t,
|
|
1495
|
+
internalVariables: n,
|
|
1496
|
+
onRequestTemplate: e.onGetCachedTemplate
|
|
1497
|
+
}) : null;
|
|
1498
|
+
});
|
|
1499
|
+
}, Zo = (e) => {
|
|
1500
|
+
const [t] = Ko(e);
|
|
1501
|
+
if (t) return t;
|
|
1502
|
+
const { aiAgentColorVariables: n = {} } = e, { internalVariables: o, fetchTemplate: s, suspend: a } = kn();
|
|
1503
|
+
return a(e.templateKey, async () => {
|
|
1504
|
+
const l = await s({ ...e, suspense: !0 });
|
|
1505
|
+
return await jo({
|
|
1506
|
+
...e,
|
|
1507
|
+
rawTemplate: l,
|
|
1508
|
+
aiAgentColorVariables: n,
|
|
1509
|
+
internalVariables: o
|
|
1510
|
+
});
|
|
1511
|
+
}).value;
|
|
1512
|
+
}, Yo = '@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}', Me = "en", qo = /* @__PURE__ */ new Set([
|
|
1513
|
+
Me,
|
|
1514
|
+
"ko",
|
|
1515
|
+
"es",
|
|
1516
|
+
"pt",
|
|
1517
|
+
"fr",
|
|
1518
|
+
"hi",
|
|
1519
|
+
"it",
|
|
1520
|
+
"de",
|
|
1521
|
+
"tr",
|
|
1522
|
+
"ja"
|
|
1523
|
+
]), Jo = (e, t, n) => {
|
|
1524
|
+
const o = e[t];
|
|
1525
|
+
return o ? typeof o == "function" ? o() : Promise.resolve(o) : new Promise((s, a) => {
|
|
1526
|
+
(typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
|
|
1527
|
+
a.bind(
|
|
1528
|
+
null,
|
|
1529
|
+
new Error(
|
|
1530
|
+
"Unknown variable dynamic import: " + t + (t.split("/").length !== n ? ". Note that variables only represent file names one level deep." : "")
|
|
1531
|
+
)
|
|
1532
|
+
)
|
|
1533
|
+
);
|
|
1534
|
+
});
|
|
1535
|
+
}, Xo = Or, Qo = {
|
|
1536
|
+
// Channel - Common
|
|
1537
|
+
CHANNEL_FROZEN: "Channel frozen",
|
|
1538
|
+
PLACE_HOLDER__WRONG: "Something went wrong",
|
|
1539
|
+
PLACE_HOLDER__NO_MESSAGES: "No messages",
|
|
1540
|
+
UNKNOWN__UNKNOWN_MESSAGE_TYPE: "(Unknown message type)",
|
|
1541
|
+
// Channel - Header
|
|
1542
|
+
HEADER_BUTTON__AGENT_HANDOFF: "Connect with an agent",
|
|
1543
|
+
// Message Input
|
|
1544
|
+
MESSAGE_INPUT__PLACE_HOLDER: "Ask a question",
|
|
1545
|
+
MESSAGE_INPUT__PLACE_HOLDER__WAIT_AI_AGENT_RESPONSE: "Waiting for the agent’s reply…",
|
|
1546
|
+
MESSAGE_INPUT__PLACE_HOLDER__DISABLED: "Chat is unavailable in this channel",
|
|
1547
|
+
// Common UI
|
|
1548
|
+
BUTTON__CANCEL: "Cancel",
|
|
1549
|
+
BUTTON__SAVE: "Save",
|
|
1550
|
+
BUTTON__OK: "OK",
|
|
1551
|
+
NO_NAME: "(No name)",
|
|
1552
|
+
RETRY: "Retry",
|
|
1553
|
+
// Date format
|
|
1554
|
+
DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR: "MMMM dd, yyyy",
|
|
1555
|
+
DATE_FORMAT__MESSAGE_TIMESTAMP: "p",
|
|
1556
|
+
// File Upload
|
|
1557
|
+
FILE_UPLOAD_NOTIFICATION__COUNT_LIMIT: "You can't upload more than one image",
|
|
1558
|
+
FILE_UPLOAD_NOTIFICATION__SIZE_LIMIT: "The maximum size per file is %d MB.",
|
|
1559
|
+
// File Viewer
|
|
1560
|
+
FILE_VIEWER__UNSUPPORT: "Unsupported message",
|
|
1561
|
+
// CSAT
|
|
1562
|
+
CSAT_TITLE_UNSUBMITTED: "Your feedback matters to us",
|
|
1563
|
+
CSAT_TITLE_SUBMITTED: "Successfully submitted!",
|
|
1564
|
+
CSAT_CRE_TITLE: "Was your issue resolved?",
|
|
1565
|
+
CSAT_CRE_SOLVED: "Yes, thank you! 👍",
|
|
1566
|
+
CSAT_CRE_NOT_SOLVED: "No, that didn’t help.",
|
|
1567
|
+
CSAT_REASON_PLACEHOLDER: "Share your feedback",
|
|
1568
|
+
CSAT_RATING_TITLE: "How would you rate your experience?",
|
|
1569
|
+
CSAT5_RATING_SCORE_1: "Terrible",
|
|
1570
|
+
CSAT5_RATING_SCORE_2: "Bad",
|
|
1571
|
+
CSAT5_RATING_SCORE_3: "Okay",
|
|
1572
|
+
CSAT5_RATING_SCORE_4: "Good",
|
|
1573
|
+
CSAT5_RATING_SCORE_5: "Great",
|
|
1574
|
+
CSAT_SUBMIT_LABEL: "Submit",
|
|
1575
|
+
CSAT_SUBMISSION_EXPIRED: "We’re sorry, the survey period has ended.",
|
|
1576
|
+
POWERED_BY: "Powered by",
|
|
1577
|
+
// Conversation list
|
|
1578
|
+
CONVERSATION_CLOSED_FOOTER_LABEL: "Your conversation has ended",
|
|
1579
|
+
START_NEW_CONVERSATION: "💬 Start a new conversation",
|
|
1580
|
+
RETURN_TO_CONVERSATION: "💬 Return to conversation",
|
|
1581
|
+
CONVERSATION_LIST__HEADER_TITLE: "Conversation history",
|
|
1582
|
+
CONVERSATION_LIST__TOPICS_FALLBACK: "No category",
|
|
1583
|
+
CONVERSATION_LIST__NO_CONVERSATIONS: "No conversations yet",
|
|
1584
|
+
DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE: "MM/dd/yyyy",
|
|
1585
|
+
DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE_CAPTION: "h:mma",
|
|
1586
|
+
// Citation
|
|
1587
|
+
CITATION_SOURCE_TITLE: "Source"
|
|
1588
|
+
}, yt = { language: "en", dateLocale: Xo, stringSet: Qo }, es = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
1589
|
+
__proto__: null,
|
|
1590
|
+
default: yt
|
|
1591
|
+
}, Symbol.toStringTag, { value: "Module" })), Ke = /* @__PURE__ */ new Map([[Me, yt]]);
|
|
1592
|
+
async function ts(e) {
|
|
1593
|
+
if (Ke.has(e))
|
|
1594
|
+
return Ke.get(e);
|
|
1595
|
+
const t = qo.has(e) ? e : Me;
|
|
1596
|
+
try {
|
|
1597
|
+
const { default: n } = await Jo(/* @__PURE__ */ Object.assign({ "./languages/de.ts": () => import("./BAebVbLs.js"), "./languages/en.ts": () => Promise.resolve().then(() => es), "./languages/es.ts": () => import("./BKSUGIyL.js"), "./languages/fr.ts": () => import("./B1s75De5.js"), "./languages/hi.ts": () => import("./D0QwWNMF.js"), "./languages/it.ts": () => import("./CA1gVgSD.js"), "./languages/ja.ts": () => import("./DcqbdvlW.js"), "./languages/ko.ts": () => import("./Dxrtj2R8.js"), "./languages/pt.ts": () => import("./EylKxx4d.js"), "./languages/tr.ts": () => import("./DYR8UT_l.js") }), `./languages/${t}.ts`, 3);
|
|
1598
|
+
return Ke.set(e, n), n;
|
|
1599
|
+
} catch {
|
|
1600
|
+
return yt;
|
|
1601
|
+
}
|
|
1602
|
+
}
|
|
1603
|
+
const {
|
|
1604
|
+
Provider: ns,
|
|
1605
|
+
useContext: O
|
|
1606
|
+
} = G("Localization");
|
|
1607
|
+
function rs(e) {
|
|
1608
|
+
var t;
|
|
1609
|
+
return ((t = e.split("-")) == null ? void 0 : t[0]) ?? Me;
|
|
1610
|
+
}
|
|
1611
|
+
function os({
|
|
1612
|
+
language: e = navigator.language,
|
|
1613
|
+
logger: t,
|
|
1614
|
+
stringSet: n,
|
|
1615
|
+
children: o
|
|
1616
|
+
}) {
|
|
1617
|
+
const [s, a] = _(Ke.get(Me));
|
|
1618
|
+
return L(() => {
|
|
1619
|
+
const i = rs(e);
|
|
1620
|
+
s.language !== i && (t == null || t.debug("localization.useEffect: update language", `${s.language} -> ${i}`), ts(i).then(a));
|
|
1621
|
+
}, [e]), /* @__PURE__ */ r.createElement(
|
|
1622
|
+
ns,
|
|
1623
|
+
{
|
|
1624
|
+
value: {
|
|
1625
|
+
language: s.language,
|
|
1626
|
+
stringSet: { ...s.stringSet, ...n },
|
|
1627
|
+
dateLocale: s.dateLocale,
|
|
1628
|
+
format: (i, l, c) => Cn(i, l, { locale: s.dateLocale, ...c })
|
|
1629
|
+
}
|
|
1630
|
+
},
|
|
1631
|
+
o
|
|
1632
|
+
);
|
|
1633
|
+
}
|
|
1634
|
+
const Ze = "data-sb-agent-theme", Yt = (e) => (t, ...n) => {
|
|
1635
|
+
let o = "";
|
|
1636
|
+
return t.forEach((s, a) => {
|
|
1637
|
+
o += s + (n[a] ?? "");
|
|
1638
|
+
}), `[${Ze}='${e}'] & { ${o} }`;
|
|
1639
|
+
}, P = {
|
|
1640
|
+
light: Yt("light"),
|
|
1641
|
+
dark: Yt("dark")
|
|
1642
|
+
}, ss = I(({ theme: e }) => {
|
|
1643
|
+
const { palette: t } = e;
|
|
1644
|
+
return `
|
|
1645
|
+
:root,
|
|
1646
|
+
:host {
|
|
1647
|
+
--sendbird-primary-extra-dark: ${t.primary.extraDark};
|
|
1648
|
+
--sendbird-primary-dark: ${t.primary.dark};
|
|
1649
|
+
--sendbird-primary-main: ${t.primary.main};
|
|
1650
|
+
--sendbird-primary-light: ${t.primary.light};
|
|
1651
|
+
--sendbird-primary-extra-light: ${t.primary.extraLight};
|
|
1652
|
+
|
|
1653
|
+
--sendbird-secondary-extra-dark: ${t.secondary.extraDark};
|
|
1654
|
+
--sendbird-secondary-dark: ${t.secondary.dark};
|
|
1655
|
+
--sendbird-secondary-main: ${t.secondary.main};
|
|
1656
|
+
--sendbird-secondary-light: ${t.secondary.light};
|
|
1657
|
+
--sendbird-secondary-extra-light: ${t.secondary.extraLight};
|
|
1658
|
+
|
|
1659
|
+
--sendbird-information-extra-dark: ${t.information.extraDark};
|
|
1660
|
+
--sendbird-information-dark: ${t.information.dark};
|
|
1661
|
+
--sendbird-information-main: ${t.information.main};
|
|
1662
|
+
--sendbird-information-light: ${t.information.light};
|
|
1663
|
+
--sendbird-information-extra-light: ${t.information.extraLight};
|
|
1664
|
+
|
|
1665
|
+
--sendbird-error-extra-dark: ${t.error.extraDark};
|
|
1666
|
+
--sendbird-error-dark: ${t.error.dark};
|
|
1667
|
+
--sendbird-error-main: ${t.error.main};
|
|
1668
|
+
--sendbird-error-light: ${t.error.light};
|
|
1669
|
+
--sendbird-error-extra-light: ${t.error.extraLight};
|
|
1670
|
+
|
|
1671
|
+
--sendbird-background-700: ${t.background700};
|
|
1672
|
+
--sendbird-background-600: ${t.background600};
|
|
1673
|
+
--sendbird-background-500: ${t.background500};
|
|
1674
|
+
--sendbird-background-400: ${t.background400};
|
|
1675
|
+
--sendbird-background-300: ${t.background300};
|
|
1676
|
+
--sendbird-background-200: ${t.background200};
|
|
1677
|
+
--sendbird-background-100: ${t.background100};
|
|
1678
|
+
--sendbird-background-50: ${t.background50};
|
|
1679
|
+
|
|
1680
|
+
--sendbird-onlight-text-high-emphasis: ${t.onlight.textHighEmphasis};
|
|
1681
|
+
--sendbird-onlight-text-mid-emphasis: ${t.onlight.textMidEmphasis};
|
|
1682
|
+
--sendbird-onlight-text-low-emphasis: ${t.onlight.textLowEmphasis};
|
|
1683
|
+
--sendbird-onlight-text-disabled: ${t.onlight.textDisabled};
|
|
1684
|
+
|
|
1685
|
+
--sendbird-ondark-text-high-emphasis: ${t.ondark.textHighEmphasis};
|
|
1686
|
+
--sendbird-ondark-text-mid-emphasis: ${t.ondark.textMidEmphasis};
|
|
1687
|
+
--sendbird-ondark-text-low-emphasis: ${t.ondark.textLowEmphasis};
|
|
1688
|
+
--sendbird-ondark-text-disabled: ${t.ondark.textDisabled};
|
|
1689
|
+
|
|
1690
|
+
--sendbird-overlay-dark: ${t.overlay.dark};
|
|
1691
|
+
--sendbird-overlay-light: ${t.overlay.light};
|
|
1692
|
+
}
|
|
1693
|
+
`;
|
|
1694
|
+
}), is = I`[${Ze}='light'] &{--sb-text-high-emphasis:var(--sendbird-onlight-text-high-emphasis);--sb-text-mid-emphasis:var(--sendbird-onlight-text-mid-emphasis);--sb-text-low-emphasis:var(--sendbird-onlight-text-low-emphasis);--sb-text-disabled:var(--sendbird-onlight-text-disabled);--sb-text-high-emphasis-inverse:var(--sendbird-ondark-text-high-emphasis);--sb-text-mid-emphasis-inverse:var(--sendbird-ondark-text-mid-emphasis);--sb-text-low-emphasis-inverse:var(--sendbird-ondark-text-low-emphasis);--sb-text-disabled-inverse:var(--sendbird-ondark-text-disabled);--sb-bg-50-600:var(--sendbird-background-50);--sb-bg-100-500:var(--sendbird-background-100);--sb-bg-200-400:var(--sendbird-background-200);--sb-primary:var(--sendbird-primary-main);--sb-secondary:var(--sendbird-secondary-main);--sb-error:var(--sendbird-error-main);--sb-information:var(--sendbird-information-light);}[${Ze}='dark'] &{--sb-text-high-emphasis:var(--sendbird-ondark-text-high-emphasis);--sb-text-mid-emphasis:var(--sendbird-ondark-text-mid-emphasis);--sb-text-low-emphasis:var(--sendbird-ondark-text-low-emphasis);--sb-text-disabled:var(--sendbird-ondark-text-disabled);--sb-text-high-emphasis-inverse:var(--sendbird-onlight-text-high-emphasis);--sb-text-mid-emphasis-inverse:var(--sendbird-onlight-text-mid-emphasis);--sb-text-low-emphasis-inverse:var(--sendbird-onlight-text-low-emphasis);--sb-text-disabled-inverse:var(--sendbird-onlight-text-disabled);--sb-bg-50-600:var(--sendbird-background-600);--sb-bg-100-500:var(--sendbird-background-500);--sb-bg-200-400:var(--sendbird-background-400);--sb-primary:var(--sendbird-primary-light);--sb-secondary:var(--sendbird-secondary-light);--sb-error:var(--sendbird-error-light);--sb-information:var(--sendbird-information-light);}`, p = {
|
|
1695
|
+
color: {
|
|
1696
|
+
primary: {
|
|
1697
|
+
dark: "var(--sendbird-primary-dark)",
|
|
1698
|
+
main: "var(--sendbird-primary-main)"
|
|
1699
|
+
},
|
|
1700
|
+
error: {
|
|
1701
|
+
extraDark: "var(--sendbird-error-extra-dark)",
|
|
1702
|
+
dark: "var(--sendbird-error-dark)"
|
|
1703
|
+
},
|
|
1704
|
+
information: {
|
|
1705
|
+
main: "var(--sendbird-information-main)",
|
|
1706
|
+
light: "var(--sendbird-information-light)"
|
|
1707
|
+
},
|
|
1708
|
+
background700: "var(--sendbird-background-700)",
|
|
1709
|
+
background500: "var(--sendbird-background-500)",
|
|
1710
|
+
background400: "var(--sendbird-background-400)",
|
|
1711
|
+
background200: "var(--sendbird-background-200)",
|
|
1712
|
+
background100: "var(--sendbird-background-100)",
|
|
1713
|
+
background50: "var(--sendbird-background-50)",
|
|
1714
|
+
ondark: {
|
|
1715
|
+
textMidEmphasis: "var(--sendbird-ondark-text-mid-emphasis)",
|
|
1716
|
+
textLowEmphasis: "var(--sendbird-ondark-text-low-emphasis)",
|
|
1717
|
+
textDisabled: "var(--sendbird-ondark-text-disabled)"
|
|
1718
|
+
},
|
|
1719
|
+
overlay: {
|
|
1720
|
+
dark: "var(--sendbird-overlay-dark)"
|
|
1721
|
+
}
|
|
1722
|
+
},
|
|
1723
|
+
themedColor: {
|
|
1724
|
+
textHighEmphasis: "var(--sb-text-high-emphasis)",
|
|
1725
|
+
textMidEmphasis: "var(--sb-text-mid-emphasis)",
|
|
1726
|
+
textLowEmphasis: "var(--sb-text-low-emphasis)",
|
|
1727
|
+
textDisabled: "var(--sb-text-disabled)",
|
|
1728
|
+
textHighEmphasisInverse: "var(--sb-text-high-emphasis-inverse)",
|
|
1729
|
+
bg_50_600: "var(--sb-bg-50-600)",
|
|
1730
|
+
bg_100_500: "var(--sb-bg-100-500)",
|
|
1731
|
+
bg_200_400: "var(--sb-bg-200-400)",
|
|
1732
|
+
error: "var(--sb-error)"
|
|
1733
|
+
}
|
|
1734
|
+
}, {
|
|
1735
|
+
Provider: as,
|
|
1736
|
+
useContext: ls
|
|
1737
|
+
} = G("MessengerTheme");
|
|
1738
|
+
function cs(e) {
|
|
1739
|
+
const { theme: t, appearance: n, logger: o } = e;
|
|
1740
|
+
return /* @__PURE__ */ r.createElement(
|
|
1741
|
+
wo,
|
|
1742
|
+
{
|
|
1743
|
+
appearance: n,
|
|
1744
|
+
palette: t == null ? void 0 : t.palette,
|
|
1745
|
+
typography: t == null ? void 0 : t.typography,
|
|
1746
|
+
logger: o
|
|
1747
|
+
},
|
|
1748
|
+
/* @__PURE__ */ r.createElement(ds, { ...e })
|
|
1749
|
+
);
|
|
1750
|
+
}
|
|
1751
|
+
function ds({ rootElement: e = document.body, children: t }) {
|
|
1752
|
+
const { theme: n, updateTheme: o } = Ct();
|
|
1753
|
+
return le(() => {
|
|
1754
|
+
e.setAttribute(Ze, n.selectedTheme);
|
|
1755
|
+
}, [e, n.selectedTheme]), /* @__PURE__ */ r.createElement(kr, { theme: n }, /* @__PURE__ */ r.createElement(as, { value: { theme: n, updateTheme: o } }, t));
|
|
1756
|
+
}
|
|
1757
|
+
function pe(e, t) {
|
|
1758
|
+
const n = e.getRootNode({ composed: t });
|
|
1759
|
+
return n instanceof ShadowRoot || n instanceof Document ? n : document;
|
|
1760
|
+
}
|
|
1761
|
+
const us = (e, t) => {
|
|
1762
|
+
L(() => {
|
|
1763
|
+
const n = pe(t) instanceof ShadowRoot, o = pe(t, !0);
|
|
1764
|
+
if (!(n ? t : o).querySelector(`link[href*='${e}']`)) {
|
|
1765
|
+
const a = o.createElement("link");
|
|
1766
|
+
a.rel = "stylesheet", a.href = e, (n ? t : o.head).appendChild(a);
|
|
1767
|
+
}
|
|
1768
|
+
}, [e, t]);
|
|
1769
|
+
}, ms = (e, t = document.body) => {
|
|
1770
|
+
L(() => {
|
|
1771
|
+
const n = pe(t), s = n instanceof ShadowRoot ? t : n.head;
|
|
1772
|
+
if (!s) return;
|
|
1773
|
+
const a = `sba-${btoa(e).slice(0, 10)}`;
|
|
1774
|
+
let i = s.querySelector(`style#${a}`);
|
|
1775
|
+
i ? i.textContent !== e && (i.textContent = e) : (i = s.ownerDocument.createElement("style"), i.id = a, i.textContent = e, s.appendChild(i));
|
|
1776
|
+
}, [e, t]);
|
|
1777
|
+
}, _t = /iPad|iPhone|iPod/.test(navigator.userAgent), gs = /Android/.test(navigator.userAgent), Oe = (e) => _t || gs, {
|
|
1778
|
+
Provider: hs,
|
|
1779
|
+
Consumer: In,
|
|
1780
|
+
useContext: B
|
|
1781
|
+
} = G("Messenger");
|
|
1782
|
+
function ps({
|
|
1783
|
+
children: e,
|
|
1784
|
+
state: t,
|
|
1785
|
+
enableCloseConversationButton: n = !1,
|
|
1786
|
+
enableExpandButton: o = !0,
|
|
1787
|
+
enableAutoDisconnectInLauncher: s = !0,
|
|
1788
|
+
...a
|
|
1789
|
+
}) {
|
|
1790
|
+
const [i, l] = _(!1), [c, d] = _(!1), g = {
|
|
1791
|
+
opened: (t == null ? void 0 : t.opened) ?? i,
|
|
1792
|
+
setOpened: (t == null ? void 0 : t.setOpened) ?? l,
|
|
1793
|
+
expanded: (t == null ? void 0 : t.expanded) ?? c,
|
|
1794
|
+
setExpanded: (t == null ? void 0 : t.setExpanded) ?? d
|
|
1795
|
+
};
|
|
1796
|
+
return /* @__PURE__ */ r.createElement(eo, { ...a }, (h) => /* @__PURE__ */ r.createElement(
|
|
1797
|
+
hs,
|
|
1798
|
+
{
|
|
1799
|
+
value: {
|
|
1800
|
+
...a,
|
|
1801
|
+
...h,
|
|
1802
|
+
state: g,
|
|
1803
|
+
enableCloseConversationButton: n,
|
|
1804
|
+
enableExpandButton: o,
|
|
1805
|
+
enableAutoDisconnectInLauncher: s
|
|
1806
|
+
}
|
|
1807
|
+
},
|
|
1808
|
+
e
|
|
1809
|
+
));
|
|
1810
|
+
}
|
|
1811
|
+
const {
|
|
1812
|
+
Provider: fs,
|
|
1813
|
+
useContext: U
|
|
1814
|
+
} = G("MessengerSession"), bs = ye(function({ children: e, ...t }, n) {
|
|
1815
|
+
return /* @__PURE__ */ r.createElement(Fo, { ref: n, ...t }, (o) => /* @__PURE__ */ r.createElement(Es, { ...o }, e));
|
|
1816
|
+
}), Es = ({ children: e, ...t }) => {
|
|
1817
|
+
const { chatSDK: n, logger: o, appId: s, aiAgentId: a, agentPreviewConfigs: i, state: l } = B(), { userSessionInfo: c, authenticate: d, setActiveChannel: g, userSession: h, aiAgentInfo: f, launcherInfo: x } = t;
|
|
1818
|
+
return Xe(n, {
|
|
1819
|
+
async onUserJoined(b, E) {
|
|
1820
|
+
var C, v;
|
|
1821
|
+
if (b.conversation && b.conversation.type === Rr.PROACTIVE && E.userId === ((C = n.currentUser) == null ? void 0 : C.userId)) {
|
|
1822
|
+
o.info("messengerSession.onUserJoined: proactive channel joined", b.url);
|
|
1823
|
+
const S = ((v = b.conversation) == null ? void 0 : v.status) ?? W.OPEN;
|
|
1824
|
+
g({ url: b.url, status: S }), l.setOpened(!0), xs({ sound: document.hidden || !l.opened });
|
|
1825
|
+
}
|
|
1826
|
+
}
|
|
1827
|
+
}), L(() => {
|
|
1828
|
+
d().then(({ launcher: b }) => {
|
|
1829
|
+
b.auto_open && !Oe() && setTimeout(() => l.setOpened(!0), 500);
|
|
1830
|
+
}).catch((b) => {
|
|
1831
|
+
o.error("messengerSession: failed to initialize", b);
|
|
1832
|
+
});
|
|
1833
|
+
}, [n, s, a, c == null ? void 0 : c.userId, c == null ? void 0 : c.authToken]), !h || !f || !x ? null : /* @__PURE__ */ r.createElement(
|
|
1834
|
+
fs,
|
|
1835
|
+
{
|
|
1836
|
+
value: {
|
|
1837
|
+
...t,
|
|
1838
|
+
userSession: h,
|
|
1839
|
+
aiAgentInfo: { ...f, ...i == null ? void 0 : i.bot },
|
|
1840
|
+
launcherInfo: { ...x, ...i == null ? void 0 : i.launcher }
|
|
1841
|
+
}
|
|
1842
|
+
},
|
|
1843
|
+
e
|
|
1844
|
+
);
|
|
1845
|
+
};
|
|
1846
|
+
function xs({ sound: e }) {
|
|
1847
|
+
const t = "🔔You have received a new message", n = document.title, o = setInterval(() => {
|
|
1848
|
+
document.title = document.title === t ? n : t;
|
|
1849
|
+
}, 750);
|
|
1850
|
+
setTimeout(() => clearInterval(o), 5e3), e && import("./DP0MwObA.js").then((s) => {
|
|
1851
|
+
new Audio(s.default).play();
|
|
1852
|
+
});
|
|
1853
|
+
}
|
|
1854
|
+
const j = (e) => {
|
|
1855
|
+
const t = e;
|
|
1856
|
+
return typeof t == "number" ? `${t}px` : t;
|
|
1857
|
+
}, w = ({
|
|
1858
|
+
as: e,
|
|
1859
|
+
variant: t = "body1",
|
|
1860
|
+
color: n,
|
|
1861
|
+
className: o,
|
|
1862
|
+
...s
|
|
1863
|
+
}) => /* @__PURE__ */ r.createElement(vs, { as: e, $variant: t, className: o, $color: n, ...s }), qt = /* @__PURE__ */ new WeakMap(), Cs = (e, t) => {
|
|
1864
|
+
let n = qt.get(t);
|
|
1865
|
+
n || (n = /* @__PURE__ */ new Map(), qt.set(t, n));
|
|
1866
|
+
const o = n.get(e);
|
|
1867
|
+
if (o) return o;
|
|
1868
|
+
const s = t[e] ?? t.body1, a = I`font-size:${j(s.fontSize)};font-weight:${s.fontWeight};${s.fontFamily ? `font-family: ${s.fontFamily};` : ""}
|
|
1869
|
+
${s.lineHeight ? `line-height: ${s.lineHeight};` : "line-height: 100%;"}
|
|
1870
|
+
`;
|
|
1871
|
+
return n.set(e, a), a;
|
|
1872
|
+
}, vs = u.span`font-stretch:normal;font-style:normal;letter-spacing:normal;${({ $variant: e, theme: t }) => Cs(e, t.typography)}color:${({ $color: e }) => e};`, ie = "sb-agent", Q = {
|
|
1873
|
+
ENTRY: `${ie}-entry`,
|
|
1874
|
+
MODAL_ROOT: `${ie}-modal-root`,
|
|
1875
|
+
WINDOW: `${ie}-window`,
|
|
1876
|
+
LAUNCHER: `${ie}-launcher`
|
|
1877
|
+
}, Ue = 2147483647, fe = {
|
|
1878
|
+
MODAL: Ue - 1,
|
|
1879
|
+
// FIXME: need to cover the case where the tooltip is on the top of the modal
|
|
1880
|
+
TOOLTIP: Ue - 2,
|
|
1881
|
+
WINDOW: Ue - 3,
|
|
1882
|
+
LAUNCHER: Ue - 4
|
|
1883
|
+
}, $n = {
|
|
1884
|
+
DEFAULT_PRIMARY: "#742ddd",
|
|
1885
|
+
WHITE: "#ffffff"
|
|
1886
|
+
}, Mn = 36, ys = 100, _s = 25 * 1024 * 1024, On = ["application/pdf", "image/jpeg", "image/jpg", "image/png"], St = "noopener noreferrer nofollow", Le = 244, Ln = 640, Ye = 26, Rn = 4, ee = 12, Te = 2, Ss = 16, te = `${ie}-incoming-msg`, Ts = `${ie}-marked-text`;
|
|
1887
|
+
function Tt(e) {
|
|
1888
|
+
switch (e) {
|
|
1889
|
+
case "top":
|
|
1890
|
+
case "middle":
|
|
1891
|
+
return Te;
|
|
1892
|
+
default:
|
|
1893
|
+
return Ss;
|
|
1894
|
+
}
|
|
1895
|
+
}
|
|
1896
|
+
function wt(e, t) {
|
|
1897
|
+
if (t) {
|
|
1898
|
+
const [, n] = t.split("/");
|
|
1899
|
+
if (n)
|
|
1900
|
+
return n.toUpperCase();
|
|
1901
|
+
}
|
|
1902
|
+
if (e && !e.startsWith(".")) {
|
|
1903
|
+
const n = e.split(".").pop();
|
|
1904
|
+
if (n && n !== e)
|
|
1905
|
+
return n.toUpperCase();
|
|
1906
|
+
}
|
|
1907
|
+
return "FILE";
|
|
1908
|
+
}
|
|
1909
|
+
function Dn(e) {
|
|
1910
|
+
return e.messageType === "file" ? e.message.length > 0 && e.file.name !== e.message : e.message.length > 0;
|
|
1911
|
+
}
|
|
1912
|
+
const ws = /* @__PURE__ */ new Set(["send", "chat", "message", "chevron-right"]), As = {
|
|
1913
|
+
spinner: T(() => import("./BcUGcaq2.js")),
|
|
1914
|
+
chat: T(() => import("./DcFCGVBm.js")),
|
|
1915
|
+
message: T(() => import("./DsGXnanX.js")),
|
|
1916
|
+
error: T(() => import("./B6fvrWGq.js")),
|
|
1917
|
+
info: T(() => import("./CAIYsKDy.js")),
|
|
1918
|
+
refresh: T(() => import("./B6xd54zt.js")),
|
|
1919
|
+
"chevron-down": T(() => import("./BsimU71m.js")),
|
|
1920
|
+
"chevron-right": T(() => import("./NmJl7zv3.js")),
|
|
1921
|
+
done: T(() => import("./D_q6g3Dd.js")),
|
|
1922
|
+
user: T(() => import("./CvqfQEhO.js")),
|
|
1923
|
+
"file-document": T(() => import("./BAr50pfO.js")),
|
|
1924
|
+
download: T(() => import("./B2CtcWp3.js")),
|
|
1925
|
+
attach: T(() => import("./DY2ULcTX.js")),
|
|
1926
|
+
delete: T(() => import("./DMruRpOm.js")),
|
|
1927
|
+
close: T(() => import("./CuaBI7kd.js")),
|
|
1928
|
+
"close-filled": T(() => import("./CxQFWLnW.js")),
|
|
1929
|
+
send: T(() => import("./DZJyDpNp.js")),
|
|
1930
|
+
menu: T(() => import("./BUYabNz7.js")),
|
|
1931
|
+
expand: T(() => import("./wBtIAuNm.js")),
|
|
1932
|
+
collapse: T(() => import("./C0RFfifL.js")),
|
|
1933
|
+
agent: T(() => import("./Cc7XmLN1.js")),
|
|
1934
|
+
question: T(() => import("./dqwvRBog.js")),
|
|
1935
|
+
actionbook: T(() => import("./CrjNuryZ.js")),
|
|
1936
|
+
function: T(() => import("./CvdSjw1c.js")),
|
|
1937
|
+
"radio-on": T(() => import("./nmdo2Fbj.js")),
|
|
1938
|
+
"radio-off": T(() => import("./BnZcRFmS.js")),
|
|
1939
|
+
confluence: T(() => import("./BOnlh2zd.js")),
|
|
1940
|
+
zendesk: T(() => import("./BAJ6LEKc.js")),
|
|
1941
|
+
salesforce: T(() => import("./CT2kv4lr.js")),
|
|
1942
|
+
sprinklr: T(() => import("./m2INcyV2.js")),
|
|
1943
|
+
website: T(() => import("./BgGVGNdg.js")),
|
|
1944
|
+
snippet: T(() => import("./BFcXPuf5.js")),
|
|
1945
|
+
template: T(() => import("./awO7aBCv.js")),
|
|
1946
|
+
source: T(() => import("./_EVMCh6Y.js"))
|
|
1947
|
+
}, M = ({ type: e, size: t = 24, className: n, color: o }) => {
|
|
1948
|
+
const s = As[e];
|
|
1949
|
+
return /* @__PURE__ */ r.createElement(
|
|
1950
|
+
Is,
|
|
1951
|
+
{
|
|
1952
|
+
className: n,
|
|
1953
|
+
$rtlFlip: ws.has(e),
|
|
1954
|
+
$size: t,
|
|
1955
|
+
$color: o ?? p.color.primary.main
|
|
1956
|
+
},
|
|
1957
|
+
/* @__PURE__ */ r.createElement(ke, { fallback: null }, /* @__PURE__ */ r.createElement(s, null))
|
|
1958
|
+
);
|
|
1959
|
+
}, ks = I`[dir='rtl'] &{transform:scaleX(-1);}`, Is = u.div`width:${({ $size: e }) => j(e)};height:${({ $size: e }) => j(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 && ks};`;
|
|
1960
|
+
function At({
|
|
1961
|
+
name: e,
|
|
1962
|
+
type: t = "FILE",
|
|
1963
|
+
iconColor: n,
|
|
1964
|
+
iconBackgroundColor: o,
|
|
1965
|
+
onClick: s
|
|
1966
|
+
}) {
|
|
1967
|
+
const { colors: a } = xt();
|
|
1968
|
+
return /* @__PURE__ */ r.createElement($s, { onClick: s, $clickable: !!s }, /* @__PURE__ */ r.createElement(Os, { $bgColor: o ?? a.base.primary }, /* @__PURE__ */ r.createElement(M, { type: "file-document", size: 24, color: n ?? a.base.primaryContrastContent })), /* @__PURE__ */ r.createElement(Ls, null, /* @__PURE__ */ r.createElement(Rs, { variant: "button", color: p.themedColor.textHighEmphasis }, e), /* @__PURE__ */ r.createElement(w, { color: p.themedColor.textMidEmphasis, variant: "caption3" }, t)));
|
|
1969
|
+
}
|
|
1970
|
+
const $s = u.div`border-radius:12px;gap:8px;width:${Le}px;height:64px;display:flex;align-items:center;padding:12px;box-sizing:border-box;border:1px solid ${p.themedColor.textDisabled};background-color:${p.themedColor.bg_50_600};${({ $clickable: e }) => e && Ms}`, Ms = I`cursor:pointer;&:hover{background-color:${p.themedColor.bg_100_500};}`, Os = u.div`border-radius:8px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background-color:${({ $bgColor: e }) => e};`, Ls = u.div`display:flex;flex:1;flex-direction:column;gap:4px;min-width:0;`, Rs = u(w)`text-overflow:ellipsis;white-space:nowrap;overflow:hidden;`;
|
|
1971
|
+
function Ds({ file: e, children: t, onClickFile: n }) {
|
|
1972
|
+
return /* @__PURE__ */ r.createElement(Ns, null, /* @__PURE__ */ r.createElement(
|
|
1973
|
+
At,
|
|
1974
|
+
{
|
|
1975
|
+
name: e.name,
|
|
1976
|
+
type: wt(e.name, e.type),
|
|
1977
|
+
onClick: n && (() => n == null ? void 0 : n(e))
|
|
1978
|
+
}
|
|
1979
|
+
), t);
|
|
1980
|
+
}
|
|
1981
|
+
const Ns = u.div`display:flex;flex-direction:column;align-items:flex-start;gap:${Te}px;`;
|
|
1982
|
+
function Ps({ file: e, onClickMedia: t, children: n }) {
|
|
1983
|
+
const o = () => e.type.startsWith("image") ? /* @__PURE__ */ r.createElement(Us, { src: e.url, alt: "image-message" }) : e.type.startsWith("video") ? /* @__PURE__ */ r.createElement(Hs, { controls: !0 }, /* @__PURE__ */ r.createElement("source", { src: e.url }), /* @__PURE__ */ r.createElement("track", { kind: "captions" })) : null;
|
|
1984
|
+
if (o) {
|
|
1985
|
+
const s = {
|
|
1986
|
+
id: `${te}-media-body`,
|
|
1987
|
+
onClick: () => t == null ? void 0 : t(e)
|
|
1988
|
+
};
|
|
1989
|
+
return /* @__PURE__ */ r.createElement(Bs, null, /* @__PURE__ */ r.createElement(Fs, { ...s }, o()), n);
|
|
1990
|
+
}
|
|
1991
|
+
return null;
|
|
1992
|
+
}
|
|
1993
|
+
const Bs = u.div`display:flex;flex-direction:column;align-items:flex-start;gap:${Te}px;`, Fs = u.div`width:${Le}px;height:160px;border-radius:12px;overflow:hidden;cursor:pointer;${P.light`
|
|
1994
|
+
background-color: ${p.color.background100};
|
|
1995
|
+
`}
|
|
1996
|
+
${P.dark`
|
|
1997
|
+
background-color: ${p.color.background400};
|
|
1998
|
+
`}
|
|
1999
|
+
`, Us = u.img`width:100%;height:100%;object-fit:cover;`, Hs = u.video`width:100%;height:100%;object-fit:cover;`, zs = "✱";
|
|
2000
|
+
function Nn(e) {
|
|
2001
|
+
const t = new RegExp(`${zs}+`, "g");
|
|
2002
|
+
return e.replace(t, (n) => `<span id=${Ts} aria-label="masked-text">${n}</span>`);
|
|
2003
|
+
}
|
|
2004
|
+
function Vs(e) {
|
|
2005
|
+
return e.replace(/\*\*(.*?)\*\*/g, "<b>$1</b>");
|
|
2006
|
+
}
|
|
2007
|
+
function Ws(e) {
|
|
2008
|
+
const t = /```(\w+)?\n([\s\S]*?)```/g, n = [];
|
|
2009
|
+
let o = 0;
|
|
2010
|
+
return e.replace(t, (s, ...a) => {
|
|
2011
|
+
const [i, l, c] = a;
|
|
2012
|
+
return o < c && n.push({
|
|
2013
|
+
type: "text",
|
|
2014
|
+
value: e.slice(o, c).trim()
|
|
2015
|
+
}), n.push({
|
|
2016
|
+
type: "code",
|
|
2017
|
+
value: l.trim(),
|
|
2018
|
+
language: i ? i.trim() : "plaintext"
|
|
2019
|
+
}), o = c + s.length, s;
|
|
2020
|
+
}), o < e.length && n.push({
|
|
2021
|
+
type: "text",
|
|
2022
|
+
value: e.slice(o).trim()
|
|
2023
|
+
}), n.map((s) => s.type !== "text" ? s : { ...s, value: Nn(s.value) });
|
|
2024
|
+
}
|
|
2025
|
+
const Gs = T(async () => ({ default: (await import("./4nxZMIz3.js")).MarkdownText })), js = T(async () => ({ default: (await import("./Ch_6OPTz.js")).CodeBlock }));
|
|
2026
|
+
function Jt(e) {
|
|
2027
|
+
var s, a;
|
|
2028
|
+
const t = e.maxBodyWidth ?? Le, n = ae(() => Ws(e.message), [e.message]), o = {
|
|
2029
|
+
id: `${te}-text-body`,
|
|
2030
|
+
$maxWidth: t,
|
|
2031
|
+
$color: (s = e.customStyle) == null ? void 0 : s.bubbleContentColor,
|
|
2032
|
+
$bgColor: (a = e.customStyle) == null ? void 0 : a.bubbleBackgroundColor
|
|
2033
|
+
};
|
|
2034
|
+
return n.length === 0 ? e.children ? /* @__PURE__ */ r.createElement(Xt, { ...o }, e.children) : null : /* @__PURE__ */ r.createElement(Xt, { ...o }, n.map((i, l) => i.type === "text" ? /* @__PURE__ */ r.createElement(Qt, { key: l, variant: "body3" }, /* @__PURE__ */ r.createElement(ke, { fallback: i.value }, /* @__PURE__ */ r.createElement(Gs, { onClickImage: (c) => {
|
|
2035
|
+
var d;
|
|
2036
|
+
return (d = e.onClickMedia) == null ? void 0 : d.call(e, { url: c, type: "image/*" });
|
|
2037
|
+
} }, i.value))) : i.type === "code" ? /* @__PURE__ */ r.createElement(ke, { key: l, fallback: /* @__PURE__ */ r.createElement(Qt, { variant: "body3" }, i.value) }, /* @__PURE__ */ r.createElement(js, { code: i.value, language: i.language })) : null), e.children);
|
|
2038
|
+
}
|
|
2039
|
+
const Xt = u.div`display:flex;flex-direction:column;border-radius:12px;overflow:hidden;max-width:${({ $maxWidth: e }) => e}px;${({ theme: e, $color: t, $bgColor: n }) => I`
|
|
2040
|
+
color: ${t || e.colors.messageIncoming.text};
|
|
2041
|
+
background-color: ${n || e.colors.messageIncoming.background};
|
|
2042
|
+
`}
|
|
2043
|
+
padding: 12px 0;
|
|
2044
|
+
transition: max-width 0.3s;
|
|
2045
|
+
overflow-wrap: break-word;
|
|
2046
|
+
`, Qt = u(w)`align-items:flex-start;line-height:140%;white-space:pre-wrap;padding:0 12px;`;
|
|
2047
|
+
function Ks(e) {
|
|
2048
|
+
const { stringSet: t } = O(), n = Dn(e) ? /* @__PURE__ */ r.createElement(Jt, { ...e }) : null;
|
|
2049
|
+
if (e.messageType === "user")
|
|
2050
|
+
return n;
|
|
2051
|
+
if (e.messageType === "file") {
|
|
2052
|
+
const o = e.file;
|
|
2053
|
+
return o.type.startsWith("image") || o.type.startsWith("video") ? /* @__PURE__ */ r.createElement(Ps, { ...e }, n) : /* @__PURE__ */ r.createElement(Ds, { ...e }, n);
|
|
2054
|
+
}
|
|
2055
|
+
return /* @__PURE__ */ r.createElement(Jt, { ...e, message: t.UNKNOWN__UNKNOWN_MESSAGE_TYPE });
|
|
2056
|
+
}
|
|
2057
|
+
const kt = (e) => /* @__PURE__ */ r.createElement("svg", { width: 24, height: 24, viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ r.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" }));
|
|
2058
|
+
function It({ id: e, src: t, size: n = 56, onClick: o, style: s }) {
|
|
2059
|
+
return /* @__PURE__ */ r.createElement(Zs, { id: e, tabIndex: 0, onClick: o, $size: j(n), style: s }, t ? /* @__PURE__ */ r.createElement(Ys, { src: t }) : /* @__PURE__ */ r.createElement(M, { type: "user", size: n }));
|
|
2060
|
+
}
|
|
2061
|
+
const Zs = u.div`border-radius:50%;display:inline-block;overflow:hidden;position:relative;flex-shrink:0;height:${(e) => e.$size};width:${(e) => e.$size};background-color:${p.themedColor.bg_100_500};&:focus{outline:none;}`, Ys = u.img`object-fit:cover;width:100%;height:100%;position:absolute;`;
|
|
2062
|
+
function qs({ sender: e, isBotMessage: t }) {
|
|
2063
|
+
const n = `${te}-sender-avatar`;
|
|
2064
|
+
return !e.profileUrl && t ? /* @__PURE__ */ r.createElement(Js, { id: n }, /* @__PURE__ */ r.createElement(kt, null)) : /* @__PURE__ */ r.createElement(It, { id: n, size: Ye, src: e.profileUrl });
|
|
2065
|
+
}
|
|
2066
|
+
const Js = u.div`flex-shrink:0;width:${Ye}px;height:${Ye}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};}}`;
|
|
2067
|
+
function Xs({ sender: e }) {
|
|
2068
|
+
return /* @__PURE__ */ r.createElement(Qs, { id: `${te}-sender-name`, variant: "caption1", color: p.themedColor.textMidEmphasis }, e.nickname);
|
|
2069
|
+
}
|
|
2070
|
+
const Qs = u(w)`text-align:start;width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-block:5px;padding-inline:0 7px;`;
|
|
2071
|
+
function ei({ createdAt: e }) {
|
|
2072
|
+
const { stringSet: t, format: n } = O();
|
|
2073
|
+
return e ? /* @__PURE__ */ r.createElement(w, { id: `${te}-sent-time`, variant: "caption4", color: p.themedColor.textLowEmphasis }, n(e, t.DATE_FORMAT__MESSAGE_TIMESTAMP)) : null;
|
|
2074
|
+
}
|
|
2075
|
+
function ti({ customStyle: e }) {
|
|
2076
|
+
return /* @__PURE__ */ r.createElement(ni, { $bgColor: e == null ? void 0 : e.bubbleBackgroundColor }, [0, 1, 2].map((t) => /* @__PURE__ */ r.createElement(ri, { key: t, $color: e == null ? void 0 : e.bubbleContentColor })));
|
|
2077
|
+
}
|
|
2078
|
+
const ni = u.div`align-items:center;border-radius:12px;display:flex;gap:6px;justify-content:center;padding:16px 12px;background-color:${({ theme: e, $bgColor: t }) => t || e.colors.messageIncoming.background};`, ri = u.span`animation:blink 1.4s infinite;animation-fill-mode:both;border-radius:50%;height:8px;width:8px;background:${({ theme: e, $color: t }) => t || 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;}`;
|
|
2079
|
+
function Ie() {
|
|
2080
|
+
}
|
|
2081
|
+
async function $t(e) {
|
|
2082
|
+
let t = e;
|
|
2083
|
+
t && (!t.startsWith("http://") && !t.startsWith("https://") && (t = "https://" + t), window.open(t, "_blank", "noopener,noreferrer"));
|
|
2084
|
+
}
|
|
2085
|
+
function Pn(e) {
|
|
2086
|
+
return !e || !e.conversation ? !1 : e.conversation.status === W.CLOSED;
|
|
2087
|
+
}
|
|
2088
|
+
function Bn(e) {
|
|
2089
|
+
return !e || !e.conversation ? !1 : e.conversation.status === W.OPEN;
|
|
2090
|
+
}
|
|
2091
|
+
function Fn(e) {
|
|
2092
|
+
var n;
|
|
2093
|
+
const t = (n = e == null ? void 0 : e.conversation) == null ? void 0 : n.handoff;
|
|
2094
|
+
return !!(t != null && t.timestamp);
|
|
2095
|
+
}
|
|
2096
|
+
function oi(e) {
|
|
2097
|
+
return Bn(e) && !Fn(e);
|
|
2098
|
+
}
|
|
2099
|
+
function si({
|
|
2100
|
+
extendedMessagePayload: e,
|
|
2101
|
+
onClickCTA: t = ({ url: n }) => $t(n)
|
|
2102
|
+
}) {
|
|
2103
|
+
const n = e == null ? void 0 : e.cta_button;
|
|
2104
|
+
return n ? /* @__PURE__ */ r.createElement(ii, { id: `${te}-ext-cta-button`, role: "button", onClick: () => t(n) }, /* @__PURE__ */ r.createElement(ai, { variant: "button" }, n.label)) : null;
|
|
2105
|
+
}
|
|
2106
|
+
const ii = u.div`display:flex;align-items:center;justify-content:center;cursor:pointer;border-radius:6px;padding:8px;color:${p.themedColor.textHighEmphasis};background-color:${p.color.background50};${P.dark`
|
|
2107
|
+
background-color: ${p.color.ondark.textDisabled};
|
|
2108
|
+
`}
|
|
2109
|
+
`, ai = u(w)`overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`;
|
|
2110
|
+
function li({
|
|
2111
|
+
extendedMessagePayload: e,
|
|
2112
|
+
onClickCitation: t = (n) => $t(n.link)
|
|
2113
|
+
}) {
|
|
2114
|
+
const { stringSet: n } = O(), { theme: o } = Ct(), s = e == null ? void 0 : e.citations;
|
|
2115
|
+
return !s || s.length === 0 ? null : /* @__PURE__ */ r.createElement(ci, { id: `${te}-ext-citation` }, /* @__PURE__ */ r.createElement(di, { variant: "caption1", color: o.colors.messageIncoming.text }, n.CITATION_SOURCE_TITLE), /* @__PURE__ */ r.createElement(ui, null, s.map((a, i) => /* @__PURE__ */ r.createElement(
|
|
2116
|
+
gi,
|
|
2117
|
+
{
|
|
2118
|
+
key: `${a.embedding_id}-${i}`,
|
|
2119
|
+
role: "button",
|
|
2120
|
+
onClick: () => t(a)
|
|
2121
|
+
},
|
|
2122
|
+
/* @__PURE__ */ r.createElement(M, { type: "source", size: 16, color: o.colors.messageIncoming.text }),
|
|
2123
|
+
/* @__PURE__ */ r.createElement(mi, { variant: "body3", color: o.colors.messageIncoming.text }, a.title)
|
|
2124
|
+
))));
|
|
2125
|
+
}
|
|
2126
|
+
const ci = u.div`display:flex;flex-direction:column;gap:8px;border-radius:8px;padding:8px 12px 6px;`, di = u(w)`opacity:0.5;`, ui = u.div`display:flex;flex-direction:column;gap:8px;`, mi = u(w)`text-decoration:underline;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`, gi = u.div`display:flex;align-items:center;gap:4px;cursor:pointer;&:hover{opacity:0.5;}`;
|
|
2127
|
+
function hi(e) {
|
|
2128
|
+
return /* @__PURE__ */ r.createElement(r.Fragment, null);
|
|
2129
|
+
}
|
|
2130
|
+
class pi extends xr {
|
|
2131
|
+
constructor(t) {
|
|
2132
|
+
super(t), this.state = {
|
|
2133
|
+
hasError: !1
|
|
2134
|
+
};
|
|
2135
|
+
}
|
|
2136
|
+
static getDerivedStateFromError() {
|
|
2137
|
+
return { hasError: !0 };
|
|
2138
|
+
}
|
|
2139
|
+
render() {
|
|
2140
|
+
return this.state.hasError ? this.props.errorFallback : /* @__PURE__ */ r.createElement(ke, { fallback: this.props.loadingFallback }, this.props.children);
|
|
2141
|
+
}
|
|
2142
|
+
}
|
|
2143
|
+
const fi = /* @__PURE__ */ new Set(["default"]), { MessageTemplate: bi } = zr({
|
|
2144
|
+
parser: Ur,
|
|
2145
|
+
renderer: Fr,
|
|
2146
|
+
Container: (e) => /* @__PURE__ */ r.createElement("div", { ...e })
|
|
2147
|
+
});
|
|
2148
|
+
function Ei(e) {
|
|
2149
|
+
return /* @__PURE__ */ r.createElement(
|
|
2150
|
+
pi,
|
|
2151
|
+
{
|
|
2152
|
+
errorFallback: e.messageTemplateErrorFallback,
|
|
2153
|
+
loadingFallback: e.messageTemplateLoadingFallback
|
|
2154
|
+
},
|
|
2155
|
+
/* @__PURE__ */ r.createElement(xi, { ...e })
|
|
2156
|
+
);
|
|
2157
|
+
}
|
|
2158
|
+
const xi = ({
|
|
2159
|
+
extendedMessagePayload: e,
|
|
2160
|
+
onGetCachedMessageTemplate: t = () => null,
|
|
2161
|
+
onRequestMessageTemplate: n,
|
|
2162
|
+
onHandleTemplateInternalAction: o = Ie
|
|
2163
|
+
}) => {
|
|
2164
|
+
const s = e == null ? void 0 : e.message_template;
|
|
2165
|
+
if (!fi.has((s == null ? void 0 : s.type) ?? "default")) throw new Error("Unsupported template type");
|
|
2166
|
+
if (!n) throw new Error("onRequestMessageTemplate is required");
|
|
2167
|
+
const { theme: i } = ls(), l = Zo({
|
|
2168
|
+
onRequestTemplate: n,
|
|
2169
|
+
onGetCachedTemplate: t,
|
|
2170
|
+
theme: i.selectedTheme,
|
|
2171
|
+
templateKey: (s == null ? void 0 : s.key) ?? "invalid",
|
|
2172
|
+
variables: s == null ? void 0 : s.variables,
|
|
2173
|
+
viewVariables: s == null ? void 0 : s.view_variables,
|
|
2174
|
+
aiAgentColorVariables: i.aiAgentColorVariables
|
|
2175
|
+
});
|
|
2176
|
+
return /* @__PURE__ */ r.createElement(Ci, { id: `${te}-ext-message-template` }, /* @__PURE__ */ r.createElement(
|
|
2177
|
+
Hr,
|
|
2178
|
+
{
|
|
2179
|
+
handleInternalAction: (c, d) => {
|
|
2180
|
+
c.stopPropagation(), o == null || o(d);
|
|
2181
|
+
}
|
|
2182
|
+
},
|
|
2183
|
+
/* @__PURE__ */ r.createElement(bi, { templateItems: l.body.items, templateVersion: l.version })
|
|
2184
|
+
));
|
|
2185
|
+
}, Ci = u.div`box-sizing:border-box;overflow:hidden;width:100%;`;
|
|
2186
|
+
function vi({
|
|
2187
|
+
extendedMessagePayload: e,
|
|
2188
|
+
onClickSuggestedReply: t,
|
|
2189
|
+
suggestedRepliesDirection: n = "vertical"
|
|
2190
|
+
}) {
|
|
2191
|
+
const [o, s] = _(!1), a = (e == null ? void 0 : e.suggested_replies) ?? [];
|
|
2192
|
+
return a.length === 0 || o ? null : /* @__PURE__ */ r.createElement(yi, { id: `${te}-ext-suggested-replies`, $type: n }, a.map((i, l) => /* @__PURE__ */ r.createElement(
|
|
2193
|
+
_i,
|
|
2194
|
+
{
|
|
2195
|
+
key: l,
|
|
2196
|
+
$type: n,
|
|
2197
|
+
variant: "body3",
|
|
2198
|
+
onClick: () => {
|
|
2199
|
+
t && (t == null || t({ reply: i }), s(!0));
|
|
2200
|
+
}
|
|
2201
|
+
},
|
|
2202
|
+
i
|
|
2203
|
+
)));
|
|
2204
|
+
}
|
|
2205
|
+
const yi = u.div`margin:16px 0;padding:0 ${ee}px;position:relative;display:flex;gap:8px;${({ $type: e }) => e === "vertical" ? Si : Ti};`, _i = u(w)`box-sizing:border-box;padding:8px 12px;display:flex;align-items:center;border-radius:20px / clamp(20px,5%,100px);cursor:pointer;word-break:break-word;color:${p.color.primary.main};border:1px solid ${p.color.primary.main};background-color:${p.themedColor.bg_50_600};&:hover{background-color:${p.themedColor.bg_100_500};}${({ $type: e, theme: t }) => I`
|
|
2206
|
+
${e === "vertical" ? wi : Ai};
|
|
2207
|
+
&:active {
|
|
2208
|
+
background-color: ${t.colors.base.primary};
|
|
2209
|
+
color: ${t.colors.base.primaryContrastContent};
|
|
2210
|
+
}
|
|
2211
|
+
`}
|
|
2212
|
+
`, Si = I`flex-direction:column;align-items:flex-end;`, Ti = I`flex-direction:row;overflow-x:scroll;-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none;}`, wi = I`max-width:calc(100% - 70px);white-space:pre-wrap;`, Ai = I`white-space:nowrap;`;
|
|
2213
|
+
function Mt(e) {
|
|
2214
|
+
return e();
|
|
2215
|
+
}
|
|
2216
|
+
const xe = _e({
|
|
2217
|
+
template: ki,
|
|
2218
|
+
components: {
|
|
2219
|
+
SenderName: Xs,
|
|
2220
|
+
SenderAvatar: qs,
|
|
2221
|
+
SentTime: ei,
|
|
2222
|
+
MessageBody: Ks,
|
|
2223
|
+
TypingIndicator: ti,
|
|
2224
|
+
SuggestedReplies: vi,
|
|
2225
|
+
MessageTemplate: Ei,
|
|
2226
|
+
CTAButton: si,
|
|
2227
|
+
Citation: li,
|
|
2228
|
+
MessageLogs: hi
|
|
2229
|
+
}
|
|
2230
|
+
});
|
|
2231
|
+
function ki(e) {
|
|
2232
|
+
return /* @__PURE__ */ r.createElement(Un, { ...e, testerMode: !1 });
|
|
2233
|
+
}
|
|
2234
|
+
function Un(e) {
|
|
2235
|
+
var f, x, b, E, m;
|
|
2236
|
+
const { components: t } = xe.useContext(), n = !!e.isTyping, o = e.testerMode, s = !!((f = e.extendedMessagePayload) != null && f.message_template), a = !!((x = e.extendedMessagePayload) != null && x.cta_button), i = !!((b = e.extendedMessagePayload) != null && b.citations) && e.extendedMessagePayload.citations.length > 0, l = !!e.createdAt, c = Mt(() => e.messageType === "user" ? e.message.length > 0 : !0), d = e.groupType === "top" || e.groupType === "single", g = e.groupType === "bottom" || e.groupType === "single", h = o ? 0 : Ye;
|
|
2237
|
+
return /* @__PURE__ */ r.createElement(Ii, { $marginBottom: n ? 0 : Tt(e.groupType) }, d && /* @__PURE__ */ r.createElement($i, null, !o && /* @__PURE__ */ r.createElement(t.SenderAvatar, { ...e }), /* @__PURE__ */ r.createElement(t.SenderName, { ...e })), /* @__PURE__ */ r.createElement(Ut, null, /* @__PURE__ */ r.createElement(at, { $extraStartPadding: h }, n && /* @__PURE__ */ r.createElement(t.TypingIndicator, { ...e }), /* @__PURE__ */ r.createElement(t.MessageBody, { ...e }, a && /* @__PURE__ */ r.createElement("div", { style: { marginTop: 12, marginInline: 12 } }, /* @__PURE__ */ r.createElement(t.CTAButton, { ...e })), i && /* @__PURE__ */ r.createElement(t.Citation, { ...e }))), s && /* @__PURE__ */ r.createElement(en, { $startPadding: 0, $endPadding: 0, style: { marginTop: c ? Te : 0 } }, /* @__PURE__ */ r.createElement(
|
|
2238
|
+
t.MessageTemplate,
|
|
2239
|
+
{
|
|
2240
|
+
...e,
|
|
2241
|
+
messageTemplateErrorFallback: e.messageTemplateErrorFallback ?? /* @__PURE__ */ r.createElement(at, { $extraStartPadding: h }, /* @__PURE__ */ r.createElement(
|
|
2242
|
+
t.MessageBody,
|
|
2243
|
+
{
|
|
2244
|
+
...e,
|
|
2245
|
+
messageType: "user",
|
|
2246
|
+
message: ((m = (E = e.extendedMessagePayload) == null ? void 0 : E.message_template) == null ? void 0 : m.fallback_message) ?? "Cannot read this template."
|
|
2247
|
+
}
|
|
2248
|
+
)),
|
|
2249
|
+
messageTemplateLoadingFallback: e.messageTemplateLoadingFallback ?? /* @__PURE__ */ r.createElement(at, { $extraStartPadding: h }, /* @__PURE__ */ r.createElement(t.TypingIndicator, { ...e }))
|
|
2250
|
+
}
|
|
2251
|
+
))), g && l && /* @__PURE__ */ r.createElement(Mi, { $extraStartPadding: h + 8 }, /* @__PURE__ */ r.createElement(t.SentTime, { ...e })), /* @__PURE__ */ r.createElement(Ut, null, e.suggestedRepliesVisible && /* @__PURE__ */ r.createElement(en, null, /* @__PURE__ */ r.createElement(t.SuggestedReplies, { ...e })), /* @__PURE__ */ r.createElement(t.MessageLogs, { ...e })));
|
|
2252
|
+
}
|
|
2253
|
+
const Ii = u.div`display:flex;flex-direction:column;align-items:flex-start;margin-bottom:${({ $marginBottom: e }) => `${e}px`};
|
|
2254
|
+
`, tt = u.div`display:flex;align-self:stretch;justify-content:flex-start;${({ $startPadding: e = ee, $endPadding: t = ee, $extraStartPadding: n = 0 }) => `
|
|
2255
|
+
padding-inline: ${e + n}px ${t}px;
|
|
2256
|
+
`}
|
|
2257
|
+
`, $i = u(tt)`display:flex;flex-direction:row;align-items:center;gap:8px;`, at = u(tt)`display:flex;`, Mi = u(tt)`margin-top:${Rn}px;display:flex;align-items:flex-start;justify-content:flex-start;`, en = u(tt)`display:flex;flex-direction:column;${({ $startPadding: e = ee, $endPadding: t = ee, $extraStartPadding: n = 0 }) => `
|
|
2258
|
+
padding-inline: ${e + n}px ${t}px;
|
|
2259
|
+
`}
|
|
2260
|
+
`;
|
|
2261
|
+
function Oi({ file: e, children: t, onClickFile: n }) {
|
|
2262
|
+
return /* @__PURE__ */ r.createElement(Li, null, /* @__PURE__ */ r.createElement(
|
|
2263
|
+
At,
|
|
2264
|
+
{
|
|
2265
|
+
name: e.name,
|
|
2266
|
+
type: wt(e.name, e.type),
|
|
2267
|
+
onClick: n && (() => n == null ? void 0 : n(e))
|
|
2268
|
+
}
|
|
2269
|
+
), t);
|
|
2270
|
+
}
|
|
2271
|
+
const Li = u.div`display:flex;flex-direction:column;align-items:flex-end;gap:${Te}px;`, Hn = ({ className: e, children: t, size: n = 26 }) => /* @__PURE__ */ r.createElement(Ri, { className: e, $size: n }, t ?? /* @__PURE__ */ r.createElement(M, { type: "spinner", size: n })), Ri = u.div`display:flex;align-items:center;justify-content:center;width:${({ $size: e }) => j(e)};height:${({ $size: e }) => j(e)};animation:1s infinite linear;animation-name:rotate;@keyframes rotate{from{transform:rotate(0);}to{transform:rotate(360deg);}}`;
|
|
2272
|
+
function Di({ file: e, metadata: t, onClickMedia: n, children: o }) {
|
|
2273
|
+
const { aspectRatio: s, localFile: a } = t, [i] = _(() => a instanceof File ? URL.createObjectURL(a) : e.url), [l, c] = _(!1), d = {
|
|
2274
|
+
onClick: () => n == null ? void 0 : n(e),
|
|
2275
|
+
$ratio: s
|
|
2276
|
+
};
|
|
2277
|
+
return /* @__PURE__ */ r.createElement(Ni, null, /* @__PURE__ */ r.createElement(Pi, { ...d }, !l && /* @__PURE__ */ r.createElement(Hn, { size: 26 }, /* @__PURE__ */ r.createElement(M, { type: "spinner", color: "textLowEmphasis", size: 26 })), /* @__PURE__ */ r.createElement(Bi, { $loaded: l, src: i, alt: "image-message", onLoad: () => c(!0) })), o);
|
|
2278
|
+
}
|
|
2279
|
+
const Ni = u.div`display:flex;flex-direction:column;align-items:flex-end;gap:${Te}px;`, Pi = u.div`width:${Le}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;${P.light`
|
|
2280
|
+
background-color: ${p.color.background100};
|
|
2281
|
+
`}
|
|
2282
|
+
${P.dark`
|
|
2283
|
+
background-color: ${p.color.background400};
|
|
2284
|
+
`}
|
|
2285
|
+
`, Bi = u.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;`;
|
|
2286
|
+
function tn(e) {
|
|
2287
|
+
var n, o;
|
|
2288
|
+
const t = ae(() => {
|
|
2289
|
+
const s = Vs(Nn(e.message));
|
|
2290
|
+
return yn.sanitize(s);
|
|
2291
|
+
}, [e.message]);
|
|
2292
|
+
return /* @__PURE__ */ r.createElement(
|
|
2293
|
+
Fi,
|
|
2294
|
+
{
|
|
2295
|
+
$maxWidth: e.maxBodyWidth ?? Le,
|
|
2296
|
+
$color: (n = e.customStyle) == null ? void 0 : n.bubbleContentColor,
|
|
2297
|
+
$bgColor: (o = e.customStyle) == null ? void 0 : o.bubbleBackgroundColor
|
|
2298
|
+
},
|
|
2299
|
+
/* @__PURE__ */ r.createElement(Ui, { variant: "body3", dangerouslySetInnerHTML: { __html: t } })
|
|
2300
|
+
);
|
|
2301
|
+
}
|
|
2302
|
+
const Fi = u.div`display:flex;flex-direction:column;border-radius:12px;overflow:hidden;max-width:${({ $maxWidth: e }) => e}px;${({ theme: e, $color: t, $bgColor: n }) => I`
|
|
2303
|
+
color: ${t || e.colors.messageOutgoing.text};
|
|
2304
|
+
background-color: ${n || e.colors.messageOutgoing.background};
|
|
2305
|
+
`}
|
|
2306
|
+
padding: 12px 0;
|
|
2307
|
+
transition: max-width 0.3s;
|
|
2308
|
+
overflow-wrap: break-word;
|
|
2309
|
+
`, Ui = u(w)`align-items:flex-start;line-height:140%;white-space:pre-wrap;padding:0 12px;`;
|
|
2310
|
+
function Hi(e) {
|
|
2311
|
+
const { stringSet: t } = O(), n = Dn(e) ? /* @__PURE__ */ r.createElement(tn, { ...e }) : null;
|
|
2312
|
+
return e.messageType === "user" ? n : e.messageType === "file" ? e.file.type.startsWith("image") ? /* @__PURE__ */ r.createElement(Di, { ...e }, n) : /* @__PURE__ */ r.createElement(Oi, { ...e }, n) : /* @__PURE__ */ r.createElement(tn, { ...e, message: t.UNKNOWN__UNKNOWN_MESSAGE_TYPE });
|
|
2313
|
+
}
|
|
2314
|
+
function zi({ sendingStatus: e }) {
|
|
2315
|
+
const t = xt();
|
|
2316
|
+
switch (e) {
|
|
2317
|
+
case "pending":
|
|
2318
|
+
return /* @__PURE__ */ r.createElement(Vi, { size: 16 }, /* @__PURE__ */ r.createElement(M, { type: "spinner", color: t.colors.messageOutgoing.background, size: 16 }));
|
|
2319
|
+
case "failed":
|
|
2320
|
+
return /* @__PURE__ */ r.createElement("div", { style: { marginBottom: 2 } }, /* @__PURE__ */ r.createElement(M, { type: "error", color: p.themedColor.error, size: 16 }));
|
|
2321
|
+
case "scheduled":
|
|
2322
|
+
case "canceled":
|
|
2323
|
+
return null;
|
|
2324
|
+
default:
|
|
2325
|
+
return /* @__PURE__ */ r.createElement("div", null, /* @__PURE__ */ r.createElement(M, { type: "chevron-down" }));
|
|
2326
|
+
}
|
|
2327
|
+
}
|
|
2328
|
+
const Vi = u(Hn)`margin-bottom:2px;width:16px;height:16px;`;
|
|
2329
|
+
function Wi({ createdAt: e }) {
|
|
2330
|
+
const { stringSet: t, format: n } = O();
|
|
2331
|
+
return e ? /* @__PURE__ */ r.createElement(w, { variant: "caption4", color: p.themedColor.textLowEmphasis }, n(e, t.DATE_FORMAT__MESSAGE_TIMESTAMP)) : null;
|
|
2332
|
+
}
|
|
2333
|
+
const Ot = _e({
|
|
2334
|
+
template: Gi,
|
|
2335
|
+
components: {
|
|
2336
|
+
SendingStatus: zi,
|
|
2337
|
+
SentTime: Wi,
|
|
2338
|
+
MessageBody: Hi
|
|
2339
|
+
}
|
|
2340
|
+
});
|
|
2341
|
+
function Gi(e) {
|
|
2342
|
+
const { components: t } = Ot.useContext(), n = e.sendingStatus === "succeeded", o = e.groupType === "bottom" || e.groupType === "single";
|
|
2343
|
+
return /* @__PURE__ */ r.createElement(ji, { $marginBottom: Tt(e.groupType) }, /* @__PURE__ */ r.createElement(Ki, null, /* @__PURE__ */ r.createElement(t.MessageBody, { ...e })), o && /* @__PURE__ */ r.createElement(Zi, { $extraEndPadding: 8 }, n ? /* @__PURE__ */ r.createElement(t.SentTime, { ...e }) : /* @__PURE__ */ r.createElement(t.SendingStatus, { ...e })));
|
|
2344
|
+
}
|
|
2345
|
+
const ji = u.div`display:flex;flex:1;flex-direction:column;align-items:flex-end;margin-bottom:${({ $marginBottom: e }) => `${e}px`};
|
|
2346
|
+
`, zn = u.div`display:flex;align-self:stretch;justify-content:flex-end;${({ $startPadding: e = ee, $endPadding: t = ee, $extraEndPadding: n = 0 }) => `padding-inline: ${e}px ${t + n}px;`};
|
|
2347
|
+
`, Ki = u(zn)``, Zi = u(zn)`margin-top:${Rn}px;`;
|
|
2348
|
+
function Yi(e) {
|
|
2349
|
+
return e.messageType !== "admin" ? null : /* @__PURE__ */ r.createElement(qi, null, /* @__PURE__ */ r.createElement(w, { variant: "caption2", color: p.themedColor.textMidEmphasis }, Ji(yn.sanitize(e.message))));
|
|
2350
|
+
}
|
|
2351
|
+
const qi = u.div`text-align:center;text-wrap:pretty;a{text-decoration:none;color:inherit;}`, Ji = (e) => {
|
|
2352
|
+
const t = /\[([^\]]+)\]\((https?:\/\/[^\s]+)\)/g, n = [];
|
|
2353
|
+
let o = 0;
|
|
2354
|
+
return e.replace(t, (s, a, i, l) => (n.push(e.slice(o, l)), n.push(
|
|
2355
|
+
/* @__PURE__ */ r.createElement("a", { key: i, href: i, target: "_blank", rel: St }, a)
|
|
2356
|
+
), o = l + s.length, s)), n.push(e.slice(o)), n;
|
|
2357
|
+
}, Xi = ({ submitted: e, defaultValue: t, value: n, onChange: o }) => {
|
|
2358
|
+
const { stringSet: s } = O();
|
|
2359
|
+
return L(() => {
|
|
2360
|
+
typeof n > "u" && typeof t == "boolean" && (o == null || o(t));
|
|
2361
|
+
}, [n, t]), /* @__PURE__ */ r.createElement(Qi, null, /* @__PURE__ */ r.createElement(w, { variant: "caption2", color: p.themedColor.textMidEmphasis }, s.CSAT_CRE_TITLE), /* @__PURE__ */ r.createElement("div", null, /* @__PURE__ */ r.createElement(
|
|
2362
|
+
nn,
|
|
2363
|
+
{
|
|
2364
|
+
checked: n === !0,
|
|
2365
|
+
label: s.CSAT_CRE_SOLVED,
|
|
2366
|
+
disabled: e,
|
|
2367
|
+
onClick: () => o == null ? void 0 : o(!0)
|
|
2368
|
+
}
|
|
2369
|
+
), /* @__PURE__ */ r.createElement(
|
|
2370
|
+
nn,
|
|
2371
|
+
{
|
|
2372
|
+
checked: n === !1,
|
|
2373
|
+
label: s.CSAT_CRE_NOT_SOLVED,
|
|
2374
|
+
disabled: e,
|
|
2375
|
+
onClick: () => o == null ? void 0 : o(!1)
|
|
2376
|
+
}
|
|
2377
|
+
)));
|
|
2378
|
+
}, nn = ({ onClick: e, checked: t, label: n, disabled: o }) => {
|
|
2379
|
+
const s = t ? p.color.primary.main : o ? p.themedColor.textDisabled : p.themedColor.textLowEmphasis, a = t ? p.themedColor.textHighEmphasis : o ? p.themedColor.textLowEmphasis : p.themedColor.textHighEmphasis;
|
|
2380
|
+
return /* @__PURE__ */ r.createElement(ea, { onClick: e, disabled: o }, /* @__PURE__ */ r.createElement(M, { size: 24, type: t ? "radio-on" : "radio-off", color: s }), /* @__PURE__ */ r.createElement(w, { variant: "caption2", color: a }, n));
|
|
2381
|
+
}, Qi = u.div`display:flex;flex-direction:column;gap:8px;`, ea = u.button`all:unset;display:flex;align-items:center;justify-content:flex-start;gap:2px;span{line-height:initial;}&:enabled{cursor:pointer;}`, ta = (e) => /* @__PURE__ */ r.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", id: "csat1", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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__ */ r.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 })), na = (e) => /* @__PURE__ */ r.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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__ */ r.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__ */ r.createElement("defs", null, /* @__PURE__ */ r.createElement("linearGradient", { id: "paint0_linear_159_173206", x1: 20, y1: 2.08325, x2: 20, y2: 37.9166, gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ r.createElement("stop", { stopColor: "#FF2D1D" }), /* @__PURE__ */ r.createElement("stop", { offset: 1, stopColor: "#FFA540" })))), ra = (e) => /* @__PURE__ */ r.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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" })), oa = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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__ */ r.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" })), sa = (e) => /* @__PURE__ */ r.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ r.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__ */ r.createElement("path", { d: "M13.348 15H13.333M26.6663 15H26.6513", stroke: "black", strokeOpacity: 0.12, strokeWidth: 3.33333, strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ r.createElement("path", { d: "M15 26.6667H25", stroke: "black", strokeOpacity: 0.12, strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round" })), ia = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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" })), aa = (e) => /* @__PURE__ */ r.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.createElement("path", { d: "M13.348 15H13.333M26.6663 15H26.6513", stroke: "black", strokeOpacity: 0.12, strokeWidth: 3.33333, strokeLinecap: "round", strokeLinejoin: "round" })), la = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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" })), ca = (e) => /* @__PURE__ */ r.createElement("svg", { width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...e }, /* @__PURE__ */ r.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__ */ r.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__ */ r.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" })), da = (e) => /* @__PURE__ */ r.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 40, height: 40, viewBox: "0 0 40 40", fill: "none", ...e }, /* @__PURE__ */ r.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__ */ r.createElement("g", { clipPath: "url(#clip0_159_173224)" }, /* @__PURE__ */ r.createElement("g", { clipPath: "url(#clip1_159_173224)" }, /* @__PURE__ */ r.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__ */ r.createElement("mask", { id: "mask0_159_173224", style: {
|
|
2382
|
+
maskType: "alpha"
|
|
2383
|
+
}, maskUnits: "userSpaceOnUse", x: 12, y: 22, width: 16, height: 9 }, /* @__PURE__ */ r.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__ */ r.createElement("g", { mask: "url(#mask0_159_173224)" }, /* @__PURE__ */ r.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__ */ r.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__ */ r.createElement("defs", null, /* @__PURE__ */ r.createElement("clipPath", { id: "clip0_159_173224" }, /* @__PURE__ */ r.createElement("rect", { width: 15.83, height: 7.915, fill: "white", transform: "translate(12.085 22.709)" })), /* @__PURE__ */ r.createElement("clipPath", { id: "clip1_159_173224" }, /* @__PURE__ */ r.createElement("rect", { width: 15.83, height: 7.915, fill: "white", transform: "translate(12.085 22.709)" })))), ua = [
|
|
2384
|
+
{
|
|
2385
|
+
value: 1,
|
|
2386
|
+
Icon: {
|
|
2387
|
+
Active: na,
|
|
2388
|
+
Inactive: ta
|
|
2389
|
+
},
|
|
2390
|
+
isActive: (e) => e <= 1,
|
|
2391
|
+
getTooltip: (e) => e.CSAT5_RATING_SCORE_1
|
|
2392
|
+
},
|
|
2393
|
+
{
|
|
2394
|
+
value: 2,
|
|
2395
|
+
Icon: {
|
|
2396
|
+
Active: oa,
|
|
2397
|
+
Inactive: ra
|
|
2398
|
+
},
|
|
2399
|
+
isActive: (e) => e === 2,
|
|
2400
|
+
getTooltip: (e) => e.CSAT5_RATING_SCORE_2
|
|
2401
|
+
},
|
|
2402
|
+
{
|
|
2403
|
+
value: 3,
|
|
2404
|
+
Icon: {
|
|
2405
|
+
Active: ia,
|
|
2406
|
+
Inactive: sa
|
|
2407
|
+
},
|
|
2408
|
+
isActive: (e) => e === 3,
|
|
2409
|
+
getTooltip: (e) => e.CSAT5_RATING_SCORE_3
|
|
2410
|
+
},
|
|
2411
|
+
{
|
|
2412
|
+
value: 4,
|
|
2413
|
+
Icon: {
|
|
2414
|
+
Active: la,
|
|
2415
|
+
Inactive: aa
|
|
2416
|
+
},
|
|
2417
|
+
isActive: (e) => e === 4,
|
|
2418
|
+
getTooltip: (e) => e.CSAT5_RATING_SCORE_4
|
|
2419
|
+
},
|
|
2420
|
+
{
|
|
2421
|
+
value: 5,
|
|
2422
|
+
Icon: {
|
|
2423
|
+
Active: da,
|
|
2424
|
+
Inactive: ca
|
|
2425
|
+
},
|
|
2426
|
+
isActive: (e) => 5 <= e,
|
|
2427
|
+
getTooltip: (e) => e.CSAT5_RATING_SCORE_5
|
|
2428
|
+
}
|
|
2429
|
+
], ma = () => ua, Vn = ({ label: e, children: t, position: n = "top", disabled: o }) => o ? t : /* @__PURE__ */ r.createElement(ft, null, t, /* @__PURE__ */ r.createElement(pa, { $position: n }, /* @__PURE__ */ r.createElement(fa, { variant: "caption1" }, e), /* @__PURE__ */ r.createElement(ga, { $position: n }))), ga = ({ $position: e }) => /* @__PURE__ */ r.createElement(
|
|
2430
|
+
"svg",
|
|
2431
|
+
{
|
|
2432
|
+
style: { transform: e === "top" ? "rotate(0)" : "rotate(180deg)" },
|
|
2433
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2434
|
+
width: "12",
|
|
2435
|
+
height: "6",
|
|
2436
|
+
viewBox: "0 0 12 6",
|
|
2437
|
+
fill: "none"
|
|
2438
|
+
},
|
|
2439
|
+
/* @__PURE__ */ r.createElement("path", { d: "M6 6L0 0h12L6 6Z", fill: p.themedColor.textHighEmphasis })
|
|
2440
|
+
), ha = {
|
|
2441
|
+
top: I`flex-direction:column;top:0;transform:translate(-50%,-100%);`,
|
|
2442
|
+
bottom: I`flex-direction:column-reverse;bottom:0;transform:translate(-50%,100%);`
|
|
2443
|
+
}, ft = u.div`position:relative;`, pa = u.div`display:flex;align-items:center;position:absolute;left:50%;z-index:${fe.TOOLTIP};${({ $position: e }) => ha[e]}opacity:0;transition:opacity 0.2s ease-in-out;pointer-events:none;${ft}:hover &,${ft}:focus-within &{opacity:1;}`, fa = u(w)`padding:6px 8px;background:${p.themedColor.textHighEmphasis};color:${p.themedColor.textHighEmphasisInverse};border-radius:4px;font-size:12px;white-space:nowrap;`, ba = ({ submitted: e, value: t, onChange: n }) => {
|
|
2444
|
+
const { stringSet: o } = O(), s = ma(), a = typeof t == "number";
|
|
2445
|
+
return /* @__PURE__ */ r.createElement(Ea, null, /* @__PURE__ */ r.createElement(w, { variant: "caption2", color: p.themedColor.textMidEmphasis }, o.CSAT_RATING_TITLE), /* @__PURE__ */ r.createElement(xa, null, s.map((i) => /* @__PURE__ */ r.createElement(Vn, { disabled: e, key: i.value, label: i.getTooltip(o) }, /* @__PURE__ */ r.createElement(
|
|
2446
|
+
Ca,
|
|
2447
|
+
{
|
|
2448
|
+
disabled: e,
|
|
2449
|
+
onClick: () => n(i.value),
|
|
2450
|
+
$inactive: a && !i.isActive(t)
|
|
2451
|
+
},
|
|
2452
|
+
a ? i.isActive(t) ? /* @__PURE__ */ r.createElement(i.Icon.Active, null) : /* @__PURE__ */ r.createElement(i.Icon.Inactive, null) : /* @__PURE__ */ r.createElement(i.Icon.Active, null)
|
|
2453
|
+
)))));
|
|
2454
|
+
}, Ea = u.div`display:flex;flex-direction:column;gap:8px;`, xa = u.div`display:flex;justify-content:space-between;width:100%;max-width:320px;`, Ca = u.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:${p.color.background200};${P.dark`
|
|
2455
|
+
background-color: ${p.color.background500};
|
|
2456
|
+
`}
|
|
2457
|
+
}
|
|
2458
|
+
|
|
2459
|
+
${({ $inactive: e, theme: t }) => e && t.selectedTheme === "dark" && va};
|
|
2460
|
+
`, va = I`[fill]{fill:white;fill-opacity:0.12;}[stroke]{stroke:white;stroke-opacity:0.12;}`, ya = ({ submitted: e, value: t = "", onChange: n }) => {
|
|
2461
|
+
const { stringSet: o } = O();
|
|
2462
|
+
return e && !t ? null : /* @__PURE__ */ r.createElement(
|
|
2463
|
+
_a,
|
|
2464
|
+
{
|
|
2465
|
+
disabled: e,
|
|
2466
|
+
maxLength: 255,
|
|
2467
|
+
value: t,
|
|
2468
|
+
onChange: (s) => n(s.target.value),
|
|
2469
|
+
placeholder: o.CSAT_REASON_PLACEHOLDER
|
|
2470
|
+
}
|
|
2471
|
+
);
|
|
2472
|
+
}, _a = u.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:${p.themedColor.textHighEmphasis};&::placeholder{color:${p.themedColor.textLowEmphasis};}background-color:${p.color.background50};${P.dark`
|
|
2473
|
+
background-color: ${p.themedColor.textDisabled};
|
|
2474
|
+
`}
|
|
2475
|
+
|
|
2476
|
+
&:disabled {
|
|
2477
|
+
cursor: not-allowed;
|
|
2478
|
+
color: ${p.themedColor.textLowEmphasis};
|
|
2479
|
+
background-color: ${p.color.background200};
|
|
2480
|
+
${P.dark`
|
|
2481
|
+
color: ${p.color.ondark.textDisabled};
|
|
2482
|
+
background-color: ${p.themedColor.textDisabled};
|
|
2483
|
+
`}
|
|
2484
|
+
}
|
|
2485
|
+
`, Sa = ({ submitted: e }) => {
|
|
2486
|
+
const { stringSet: t } = O();
|
|
2487
|
+
return e ? /* @__PURE__ */ r.createElement(w, { variant: "h2", color: p.themedColor.textHighEmphasis }, t.CSAT_TITLE_SUBMITTED) : /* @__PURE__ */ r.createElement(w, { variant: "h2", color: p.themedColor.textHighEmphasis }, t.CSAT_TITLE_UNSUBMITTED);
|
|
2488
|
+
};
|
|
2489
|
+
var J = /* @__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.HELPDESK_CSAT_5 = "HELPDESK_CSAT_5", e))(J || {});
|
|
2490
|
+
const Ta = (e) => Cr((t, n) => ({ ...t, ...n }), e), lt = ({
|
|
2491
|
+
type: e,
|
|
2492
|
+
renderSubmitButton: t,
|
|
2493
|
+
initialCsat: n,
|
|
2494
|
+
initialCsatReason: o,
|
|
2495
|
+
initialIsResolved: s
|
|
2496
|
+
}) => {
|
|
2497
|
+
const [a, i] = Ta({
|
|
2498
|
+
csatType: e,
|
|
2499
|
+
csat: n,
|
|
2500
|
+
csatReason: o,
|
|
2501
|
+
isResolved: s
|
|
2502
|
+
}), l = typeof n == "number" ? "submitted" : (e === J.AI_AGENT_CSAT_5 || e === J.HELPDESK_CSAT_5) && typeof a.csat == "number" || e === J.AI_AGENT_CSAT_5_WITH_CRE && typeof a.csat == "number" && typeof a.isResolved == "boolean" ? "submittable" : "unsubmittable", c = { state: l, submitted: l === "submitted" };
|
|
2503
|
+
return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(wa, null, /* @__PURE__ */ r.createElement(Sa, { ...c }), e === J.AI_AGENT_CSAT_5_WITH_CRE && /* @__PURE__ */ r.createElement(
|
|
2504
|
+
Xi,
|
|
2505
|
+
{
|
|
2506
|
+
...c,
|
|
2507
|
+
defaultValue: s,
|
|
2508
|
+
value: a.isResolved,
|
|
2509
|
+
onChange: (d) => i({ isResolved: d })
|
|
2510
|
+
}
|
|
2511
|
+
), /* @__PURE__ */ r.createElement(ba, { ...c, value: a.csat, onChange: (d) => i({ csat: d }) }), a.csat && /* @__PURE__ */ r.createElement(
|
|
2512
|
+
ya,
|
|
2513
|
+
{
|
|
2514
|
+
...c,
|
|
2515
|
+
value: a.csatReason,
|
|
2516
|
+
onChange: (d) => i({ csatReason: d })
|
|
2517
|
+
}
|
|
2518
|
+
)), l !== "submitted" && t({ state: l, params: a }));
|
|
2519
|
+
}, wa = u.div`display:flex;flex-direction:column;gap:12px;`, Aa = () => {
|
|
2520
|
+
const { stringSet: e } = O();
|
|
2521
|
+
return /* @__PURE__ */ r.createElement(w, { variant: "body2", color: p.themedColor.textMidEmphasis, style: { textAlign: "center" } }, e.CSAT_SUBMISSION_EXPIRED);
|
|
2522
|
+
}, ka = (e) => {
|
|
2523
|
+
if (e.messageType !== "admin.csat")
|
|
2524
|
+
throw new Error("Invalid message type");
|
|
2525
|
+
const t = Nr(), { stringSet: n } = O(), { extendedMessagePayload: o, csat: s, csatReason: a, csatExpireAt: i, isResolvedWhenDeterminedByUser: l, onSubmitCSAT: c } = e, { visibility: d, type: g } = (o == null ? void 0 : o.csat) ?? {};
|
|
2526
|
+
if (!d || !g || !J[g]) return null;
|
|
2527
|
+
const h = g === J.AI_AGENT_CSAT_5 || g === J.AI_AGENT_CSAT_5_WITH_CRE || g === J.HELPDESK_CSAT_5 ? lt : () => null, f = (x) => {
|
|
2528
|
+
x.csat && !rn(i) ? c({
|
|
2529
|
+
csatType: x.csatType,
|
|
2530
|
+
csat: x.csat,
|
|
2531
|
+
csatReason: x.csatReason,
|
|
2532
|
+
isResolved: x.isResolved
|
|
2533
|
+
}) : t();
|
|
2534
|
+
};
|
|
2535
|
+
return /* @__PURE__ */ r.createElement(Ia, null, !s && rn(i) ? /* @__PURE__ */ r.createElement(Aa, null) : /* @__PURE__ */ r.createElement(
|
|
2536
|
+
h,
|
|
2537
|
+
{
|
|
2538
|
+
type: g,
|
|
2539
|
+
initialCsat: s,
|
|
2540
|
+
initialCsatReason: a,
|
|
2541
|
+
initialIsResolved: l,
|
|
2542
|
+
renderSubmitButton: ({ state: x, params: b }) => /* @__PURE__ */ r.createElement($a, { disabled: x !== "submittable", onClick: () => f(b) }, /* @__PURE__ */ r.createElement(w, { variant: "button" }, n.CSAT_SUBMIT_LABEL))
|
|
2543
|
+
}
|
|
2544
|
+
));
|
|
2545
|
+
}, Ia = u.div`display:flex;flex-direction:column;background-color:${({ theme: e }) => e.colors.csat.background};border-radius:16px;gap:16px;padding:24px;`, $a = u.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:${p.color.primary.dark};}&:disabled{color:${p.color.ondark.textLowEmphasis};background-color:${p.themedColor.textDisabled};cursor:not-allowed;}`;
|
|
2546
|
+
function rn(e) {
|
|
2547
|
+
return !!e && e < Date.now();
|
|
2548
|
+
}
|
|
2549
|
+
const Lt = _e({
|
|
2550
|
+
template: Ma,
|
|
2551
|
+
components: {
|
|
2552
|
+
AdminMessage: Yi,
|
|
2553
|
+
CSATMessage: ka
|
|
2554
|
+
}
|
|
2555
|
+
});
|
|
2556
|
+
function Ma(e) {
|
|
2557
|
+
const { components: t } = Lt.useContext(), n = Mt(() => e.messageType === "admin" ? /* @__PURE__ */ r.createElement(t.AdminMessage, { ...e }) : e.messageType === "admin.csat" ? /* @__PURE__ */ r.createElement(t.CSATMessage, { ...e }) : null);
|
|
2558
|
+
return /* @__PURE__ */ r.createElement(Oa, { $marginBottom: Tt(e.groupType) }, n);
|
|
2559
|
+
}
|
|
2560
|
+
const Oa = u.div`padding-inline:${ee}px;margin-bottom:${({ $marginBottom: e }) => e}px;`, on = {
|
|
2561
|
+
file: "attach",
|
|
2562
|
+
snippet: "snippet",
|
|
2563
|
+
site: "website",
|
|
2564
|
+
sb_sprinklr: "sprinklr",
|
|
2565
|
+
sb_salesforce: "salesforce",
|
|
2566
|
+
sb_confluence: "confluence",
|
|
2567
|
+
sb_zendesk: "zendesk",
|
|
2568
|
+
sb_desk: "snippet"
|
|
2569
|
+
// TODO: request icon
|
|
2570
|
+
}, La = ({
|
|
2571
|
+
actionbook: e,
|
|
2572
|
+
functionCalls: t,
|
|
2573
|
+
groundedness: n,
|
|
2574
|
+
agentMessageTemplates: o,
|
|
2575
|
+
onClickActionbook: s,
|
|
2576
|
+
onClickFunctionCall: a,
|
|
2577
|
+
onClickFunctionCallDetail: i,
|
|
2578
|
+
onClickGroundedness: l,
|
|
2579
|
+
onClickAgentMessageTemplate: c,
|
|
2580
|
+
bottomContent: d,
|
|
2581
|
+
renderCustomGroundednessIcon: g = (f) => f.default,
|
|
2582
|
+
style: h = {}
|
|
2583
|
+
}) => {
|
|
2584
|
+
const {
|
|
2585
|
+
// Note: This component is used with the dashboard, so cssVars should not be used.
|
|
2586
|
+
iconColor: f = "#000000",
|
|
2587
|
+
textColor: x = "#000000",
|
|
2588
|
+
highlightColor: b = $n.DEFAULT_PRIMARY
|
|
2589
|
+
} = h;
|
|
2590
|
+
return /* @__PURE__ */ r.createElement(sn, null, e && /* @__PURE__ */ r.createElement(sn, null, /* @__PURE__ */ r.createElement(qe, null, /* @__PURE__ */ r.createElement(ze, null, /* @__PURE__ */ r.createElement(M, { size: 16, type: "actionbook", color: f })), /* @__PURE__ */ r.createElement(
|
|
2591
|
+
He,
|
|
2592
|
+
{
|
|
2593
|
+
$clickable: !!s,
|
|
2594
|
+
$highlightColor: b,
|
|
2595
|
+
variant: "body2",
|
|
2596
|
+
color: x,
|
|
2597
|
+
onClick: () => s == null ? void 0 : s(e)
|
|
2598
|
+
},
|
|
2599
|
+
e.name
|
|
2600
|
+
))), t == null ? void 0 : t.map((E) => /* @__PURE__ */ r.createElement(ct, { key: E.key }, /* @__PURE__ */ r.createElement(ze, null, /* @__PURE__ */ r.createElement(M, { size: 16, type: "function", color: f })), /* @__PURE__ */ r.createElement(qe, null, /* @__PURE__ */ r.createElement(
|
|
2601
|
+
He,
|
|
2602
|
+
{
|
|
2603
|
+
$clickable: !!a,
|
|
2604
|
+
$highlightColor: b,
|
|
2605
|
+
variant: "body2",
|
|
2606
|
+
color: x,
|
|
2607
|
+
onClick: () => a == null ? void 0 : a(E)
|
|
2608
|
+
},
|
|
2609
|
+
E.name
|
|
2610
|
+
), i && /* @__PURE__ */ r.createElement(Da, { role: "button", onClick: () => i == null ? void 0 : i(E) }, /* @__PURE__ */ r.createElement(w, { variant: "body2", color: b }, "View details"), /* @__PURE__ */ r.createElement(M, { type: "chevron-right", size: 16, color: b }))))), n == null ? void 0 : n.map((E) => /* @__PURE__ */ r.createElement(ct, { key: E.id }, /* @__PURE__ */ r.createElement(ze, null, g({
|
|
2611
|
+
default: /* @__PURE__ */ r.createElement(M, { size: 16, type: on[E.source_type] ?? on.snippet, color: f }),
|
|
2612
|
+
sourceType: E.source_type
|
|
2613
|
+
})), /* @__PURE__ */ r.createElement(
|
|
2614
|
+
He,
|
|
2615
|
+
{
|
|
2616
|
+
$clickable: !!l,
|
|
2617
|
+
$highlightColor: b,
|
|
2618
|
+
variant: "body2",
|
|
2619
|
+
color: x,
|
|
2620
|
+
onClick: () => l == null ? void 0 : l(E)
|
|
2621
|
+
},
|
|
2622
|
+
E.preview_title
|
|
2623
|
+
))), o == null ? void 0 : o.map((E) => /* @__PURE__ */ r.createElement(ct, { key: E.key }, /* @__PURE__ */ r.createElement(ze, null, /* @__PURE__ */ r.createElement(M, { size: 16, type: "template", color: f })), /* @__PURE__ */ r.createElement(
|
|
2624
|
+
He,
|
|
2625
|
+
{
|
|
2626
|
+
$clickable: !!c,
|
|
2627
|
+
$highlightColor: b,
|
|
2628
|
+
variant: "body2",
|
|
2629
|
+
color: x,
|
|
2630
|
+
onClick: () => c == null ? void 0 : c(E)
|
|
2631
|
+
},
|
|
2632
|
+
E.name
|
|
2633
|
+
))), d);
|
|
2634
|
+
}, Ra = u(w)`font-weight:400;`, He = u(Ra)`${({ $clickable: e, $highlightColor: t }) => e && I`
|
|
2635
|
+
cursor: pointer;
|
|
2636
|
+
text-decoration: underline;
|
|
2637
|
+
&:hover {
|
|
2638
|
+
color: ${t};
|
|
2639
|
+
}
|
|
2640
|
+
`}
|
|
2641
|
+
`, ze = u.div`display:flex;align-items:center;justify-content:center;flex-shrink:0;`, qe = u.div`display:flex;gap:8px;align-items:center;`, Da = u(qe)`cursor:pointer;gap:4px;`, ct = u(qe)`flex-direction:row;align-items:center;`, sn = u.div`display:flex;gap:4px;flex-direction:column;align-items:flex-start;`, Wn = ve(null);
|
|
2642
|
+
function Na({ testerType: e, children: t }) {
|
|
2643
|
+
return /* @__PURE__ */ r.createElement(
|
|
2644
|
+
Wn.Provider,
|
|
2645
|
+
{
|
|
2646
|
+
value: { testerType: e, isActionbookTester: e === "actionbook" }
|
|
2647
|
+
},
|
|
2648
|
+
e && /* @__PURE__ */ r.createElement(Pa, null),
|
|
2649
|
+
t
|
|
2650
|
+
);
|
|
2651
|
+
}
|
|
2652
|
+
const Re = () => {
|
|
2653
|
+
const e = X(Wn);
|
|
2654
|
+
if (!e) throw new Error("_UNSAFE_INTERNAL_DashboardTesterProvider not found");
|
|
2655
|
+
return e;
|
|
2656
|
+
}, Pa = () => {
|
|
2657
|
+
const { isActionbookTester: e } = Re();
|
|
2658
|
+
return /* @__PURE__ */ r.createElement(xe.Template, { template: e ? Ba : void 0 }, /* @__PURE__ */ r.createElement(xe.MessageLogs, { component: Fa }));
|
|
2659
|
+
}, Ba = (e) => /* @__PURE__ */ r.createElement(Un, { ...e, testerMode: !0, maxBodyWidth: Ln }), Fa = ({ extendedMessagePayload: e = {} }) => {
|
|
2660
|
+
const { handlers: t } = B(), { manual: n, groundedness: o, function_calls: s, agent_message_templates: a, is_thinking: i } = e;
|
|
2661
|
+
return i || !n && !(o != null && o.length) && !(s != null && s.length) && !(a != null && a.length) ? /* @__PURE__ */ r.createElement(r.Fragment, null) : /* @__PURE__ */ r.createElement(Ua, null, /* @__PURE__ */ r.createElement(Ha, { width: 4 }), /* @__PURE__ */ r.createElement(
|
|
2662
|
+
La,
|
|
2663
|
+
{
|
|
2664
|
+
actionbook: n,
|
|
2665
|
+
functionCalls: s,
|
|
2666
|
+
groundedness: o,
|
|
2667
|
+
agentMessageTemplates: a,
|
|
2668
|
+
onClickFunctionCallDetail: t == null ? void 0 : t.onFunctionCallDetailClick,
|
|
2669
|
+
style: {
|
|
2670
|
+
iconColor: p.themedColor.textHighEmphasis,
|
|
2671
|
+
textColor: p.themedColor.textHighEmphasis,
|
|
2672
|
+
barColor: p.themedColor.textDisabled
|
|
2673
|
+
},
|
|
2674
|
+
bottomContent: /* @__PURE__ */ r.createElement(za, { variant: "caption2", color: p.themedColor.textLowEmphasis }, "Only visible in the tester")
|
|
2675
|
+
}
|
|
2676
|
+
));
|
|
2677
|
+
}, Ua = u.div`display:flex;gap:16px;margin:16px ${ee}px 0;align-self:stretch;`, Ha = u.div`width:${({ width: e }) => e}px;background-color:${p.themedColor.textDisabled};border-radius:100px;flex-shrink:0;`, za = u(w)`margin-top:5px;`;
|
|
2678
|
+
function Va(e) {
|
|
2679
|
+
return "sendingStatus" in e ? e.sendingStatus === "succeeded" ? String(e.messageId) : e.reqId : String(e.messageId);
|
|
2680
|
+
}
|
|
2681
|
+
const Wa = (e, t, n, o = !0) => {
|
|
2682
|
+
if (!o || !e.isUserMessage() && !e.isFileMessage())
|
|
2683
|
+
return "single";
|
|
2684
|
+
const s = () => {
|
|
2685
|
+
if (!t || !t.isUserMessage() && !t.isFileMessage()) return !1;
|
|
2686
|
+
const c = t.sender.userId === e.sender.userId, d = zt(t.createdAt, e.createdAt);
|
|
2687
|
+
return c && d;
|
|
2688
|
+
}, a = () => {
|
|
2689
|
+
if (!n || !n.isUserMessage() && !n.isFileMessage()) return !1;
|
|
2690
|
+
const c = n.sender.userId === e.sender.userId, d = zt(n.createdAt, e.createdAt);
|
|
2691
|
+
return c && d;
|
|
2692
|
+
}, i = s(), l = a();
|
|
2693
|
+
return i && l ? "middle" : i ? "bottom" : l ? "top" : "single";
|
|
2694
|
+
};
|
|
2695
|
+
function Ga(e, t) {
|
|
2696
|
+
return e.filter((n) => Se.isWelcomeMessage(n, t));
|
|
2697
|
+
}
|
|
2698
|
+
function Gn(e, t) {
|
|
2699
|
+
return ja(e) === t;
|
|
2700
|
+
}
|
|
2701
|
+
function ja(e) {
|
|
2702
|
+
var t;
|
|
2703
|
+
if (e)
|
|
2704
|
+
return e.isUserMessage() || e.isFileMessage() || e.isMultipleFilesMessage() ? e.sender.userId : ((t = e == null ? void 0 : e.sender) == null ? void 0 : t.userId) ?? void 0;
|
|
2705
|
+
}
|
|
2706
|
+
function Ka(e) {
|
|
2707
|
+
return e.isAdminMessage() ? e.message === "The channel's custom_type was updated." : !1;
|
|
2708
|
+
}
|
|
2709
|
+
const bt = (e) => !!e && "sender" in e, jn = (e) => e.startsWith("image/"), Kn = (e) => e.startsWith("video/"), an = (e) => jn(e) || Kn(e), Ve = {
|
|
2710
|
+
isAdmin: (e) => e.isAdminMessage(),
|
|
2711
|
+
isCSAT: (e) => {
|
|
2712
|
+
var t;
|
|
2713
|
+
return e.isAdminMessage() && !!((t = e.extendedMessagePayload) != null && t.csat);
|
|
2714
|
+
},
|
|
2715
|
+
isIncoming: (e, t) => bt(e) && e.sender.userId !== t,
|
|
2716
|
+
isOutgoing: (e, t) => bt(e) && (e.sender.userId === t || e.sendingStatus === dt.PENDING)
|
|
2717
|
+
}, Za = (e) => {
|
|
2718
|
+
const { chatSDK: t, handlers: n } = B(), { aiAgentInfo: o } = U(), s = N(/* @__PURE__ */ new Set()), a = (i, l) => {
|
|
2719
|
+
var c;
|
|
2720
|
+
i.url === e && bt(l) && l.sender.userId === o.userId && !Se.isStreaming(l) && !s.current.has(l.messageId) && ((c = n == null ? void 0 : n.onCustomEvent) == null || c.call(n, { type: "bot-message-received", data: { message: l } }), s.current.add(l.messageId));
|
|
2721
|
+
};
|
|
2722
|
+
Xe(t, {
|
|
2723
|
+
onMessageUpdated: a,
|
|
2724
|
+
onMessageReceived: a
|
|
2725
|
+
});
|
|
2726
|
+
}, Ya = ({ publishSynchronous: e = !1 }) => {
|
|
2727
|
+
const t = /* @__PURE__ */ new Set();
|
|
2728
|
+
return {
|
|
2729
|
+
publish: (n) => {
|
|
2730
|
+
t.forEach((o) => {
|
|
2731
|
+
e ? o(n) : setTimeout(() => o(n), 0);
|
|
2732
|
+
});
|
|
2733
|
+
},
|
|
2734
|
+
subscribe: (n) => (t.add(n), () => t.delete(n))
|
|
2735
|
+
};
|
|
2736
|
+
};
|
|
2737
|
+
function qa(e, t = []) {
|
|
2738
|
+
const n = N(null), o = N(0), s = N(0), [a] = _(() => Ya({ publishSynchronous: !0 })), [i, l] = _(!0);
|
|
2739
|
+
return le(() => {
|
|
2740
|
+
o.current = 0, s.current = 0, l(!0), n.current && (n.current.scrollTop = n.current.scrollHeight);
|
|
2741
|
+
}, t), le(() => a.subscribe(({ type: c, data: d }) => {
|
|
2742
|
+
const { resolve: g, animated: h } = d ?? {};
|
|
2743
|
+
if (!n.current) return g == null ? void 0 : g();
|
|
2744
|
+
if (c === "scrollToBottom" && (n.current.scroll ? n.current.scroll({
|
|
2745
|
+
top: n.current.scrollHeight,
|
|
2746
|
+
behavior: ln(e, h)
|
|
2747
|
+
}) : n.current.scrollTop = n.current.scrollHeight, s.current = 0, l(!0), g == null || g()), c === "scroll") {
|
|
2748
|
+
const f = d == null ? void 0 : d.top, { scrollTop: x, scrollHeight: b, clientHeight: E } = n.current;
|
|
2749
|
+
n.current.scroll ? n.current.scroll({ top: f, behavior: ln(e, h) }) : typeof f == "number" && (n.current.scrollTop = f), s.current = Math.max(0, b - x - E), l(s.current === 0), g == null || g();
|
|
2750
|
+
}
|
|
2751
|
+
}), [e]), {
|
|
2752
|
+
scrollRef: n,
|
|
2753
|
+
scrollPubSub: a,
|
|
2754
|
+
isScrollBottomReached: i,
|
|
2755
|
+
setIsScrollBottomReached: l,
|
|
2756
|
+
scrollDistanceFromBottomRef: s,
|
|
2757
|
+
scrollPositionRef: o
|
|
2758
|
+
};
|
|
2759
|
+
}
|
|
2760
|
+
function ln(e, t) {
|
|
2761
|
+
return typeof t == "boolean" ? t ? "smooth" : "auto" : e;
|
|
2762
|
+
}
|
|
2763
|
+
function Ja(e) {
|
|
2764
|
+
return new Promise((t) => {
|
|
2765
|
+
const n = new Image();
|
|
2766
|
+
n.onload = function() {
|
|
2767
|
+
const o = String(n.width), s = String(n.height);
|
|
2768
|
+
URL.revokeObjectURL(n.src), t({ width: o, height: s });
|
|
2769
|
+
}, n.src = URL.createObjectURL(e);
|
|
2770
|
+
});
|
|
2771
|
+
}
|
|
2772
|
+
async function Xa(e) {
|
|
2773
|
+
if ("file" in e && e.file instanceof File && e.file.type.startsWith("image/")) {
|
|
2774
|
+
const { width: t, height: n } = await Ja(e.file);
|
|
2775
|
+
return new Vr({
|
|
2776
|
+
key: Zn,
|
|
2777
|
+
value: [t, n]
|
|
2778
|
+
});
|
|
2779
|
+
}
|
|
2780
|
+
}
|
|
2781
|
+
const Zn = "KEY_IMG_ASPECT_RATIO", Qa = ({ onScrollAfterSendMessage: e }) => {
|
|
2782
|
+
const { agentPreviewConfigs: t, handlers: n } = B(), o = N(t == null ? void 0 : t.agentAttributes);
|
|
2783
|
+
return o.current = t == null ? void 0 : t.agentAttributes, {
|
|
2784
|
+
onBeforeSendMessage: async (s) => {
|
|
2785
|
+
const a = await Xa(s), i = {
|
|
2786
|
+
...s,
|
|
2787
|
+
metaArrays: a ? [a] : void 0
|
|
2788
|
+
}, l = el(o.current);
|
|
2789
|
+
return l ? { ...i, data: JSON.stringify(l) } : i;
|
|
2790
|
+
},
|
|
2791
|
+
onAfterSendMessage: (s) => {
|
|
2792
|
+
var a, i, l;
|
|
2793
|
+
e(), (a = n == null ? void 0 : n.onMessageSend) == null || a.call(n, s.message), s.sendingStatus === dt.SUCCEEDED ? (i = n == null ? void 0 : n.onCustomEvent) == null || i.call(n, { type: "message-sent-succeeded", data: { message: s } }) : s.sendingStatus === dt.PENDING && ((l = n == null ? void 0 : n.onCustomEvent) == null || l.call(n, { type: "message-sent-pending", data: { message: s } }));
|
|
2794
|
+
}
|
|
2795
|
+
};
|
|
2796
|
+
}, el = (e) => {
|
|
2797
|
+
if (!e) return null;
|
|
2798
|
+
const t = {};
|
|
2799
|
+
return e.ai && Object.keys(e.ai).length > 0 && (t.ai_attrs = e.ai), e.safeguard && Object.keys(e.safeguard).length > 0 && (t.safeguard_attrs = e.safeguard), typeof e.use_prompt_cache == "boolean" && (t.use_prompt_cache = e.use_prompt_cache), Object.keys(t).length > 0 ? t : null;
|
|
2800
|
+
}, {
|
|
2801
|
+
Provider: tl,
|
|
2802
|
+
Context: ou,
|
|
2803
|
+
useContext: Z
|
|
2804
|
+
} = G("Conversation"), nl = ({
|
|
2805
|
+
closedChannelUrl: e,
|
|
2806
|
+
onClearClosedChannelUrl: t,
|
|
2807
|
+
onNavigateToConversationList: n,
|
|
2808
|
+
children: o
|
|
2809
|
+
}) => {
|
|
2810
|
+
const { aiAgentInfo: s, activeChannel: a, refreshActiveChannel: i } = U(), { testerType: l } = Re(), c = qa("smooth"), { onBeforeSendMessage: d, onAfterSendMessage: g } = Qa({
|
|
2811
|
+
onScrollAfterSendMessage: () => {
|
|
2812
|
+
c.scrollPubSub.publish({ type: "scrollToBottom", data: { animated: !1 } });
|
|
2813
|
+
}
|
|
2814
|
+
}), h = e || (a == null ? void 0 : a.url);
|
|
2815
|
+
Za(h);
|
|
2816
|
+
const f = (b) => {
|
|
2817
|
+
const E = b[b.length - 1];
|
|
2818
|
+
E && Se.shouldScrollToBottom(E, s.userId, !!l) && setTimeout(() => c.scrollPubSub.publish({ type: "scrollToBottom", data: { animated: !0 } }), 100);
|
|
2819
|
+
}, x = R(async () => {
|
|
2820
|
+
await i(), e && (t == null || t());
|
|
2821
|
+
}, [i, e, t]);
|
|
2822
|
+
return /* @__PURE__ */ r.createElement(
|
|
2823
|
+
io,
|
|
2824
|
+
{
|
|
2825
|
+
channelUrl: h,
|
|
2826
|
+
onBeforeSendMessage: d,
|
|
2827
|
+
onAfterSendMessage: g,
|
|
2828
|
+
onMessagesUpdated: f,
|
|
2829
|
+
onMessagesReceived: f,
|
|
2830
|
+
onChannelDeleted: x,
|
|
2831
|
+
onConversationClosedViaDispatcher: x
|
|
2832
|
+
},
|
|
2833
|
+
(b) => /* @__PURE__ */ r.createElement(
|
|
2834
|
+
tl,
|
|
2835
|
+
{
|
|
2836
|
+
value: { ...b, scrollSource: c, goToActiveConversation: x, onNavigateToConversationList: n }
|
|
2837
|
+
},
|
|
2838
|
+
o
|
|
2839
|
+
)
|
|
2840
|
+
);
|
|
2841
|
+
}, Rt = ve({
|
|
2842
|
+
onDrop: Ie,
|
|
2843
|
+
subscribe: () => Ie
|
|
2844
|
+
}), Et = ({ children: e }) => {
|
|
2845
|
+
const t = N(/* @__PURE__ */ new Set());
|
|
2846
|
+
return /* @__PURE__ */ r.createElement(
|
|
2847
|
+
Rt.Provider,
|
|
2848
|
+
{
|
|
2849
|
+
value: {
|
|
2850
|
+
onDrop: (n) => {
|
|
2851
|
+
var o;
|
|
2852
|
+
if (n.preventDefault(), (o = n.dataTransfer) != null && o.files) {
|
|
2853
|
+
const s = Array.from(n.dataTransfer.files);
|
|
2854
|
+
s.length > 0 && t.current.forEach((a) => a(s));
|
|
2855
|
+
}
|
|
2856
|
+
},
|
|
2857
|
+
subscribe: (n) => (t.current.add(n), () => t.current.delete(n))
|
|
2858
|
+
}
|
|
2859
|
+
},
|
|
2860
|
+
e
|
|
2861
|
+
);
|
|
2862
|
+
}, rl = ({ onDropFiles: e }) => {
|
|
2863
|
+
const { subscribe: t } = X(Rt);
|
|
2864
|
+
L(() => t(e), [e]);
|
|
2865
|
+
};
|
|
2866
|
+
Et.Consumer = ({ children: e }) => {
|
|
2867
|
+
const { onDrop: t } = X(Rt);
|
|
2868
|
+
return e({ onDrop: t, onDragOver: (s) => s.preventDefault() });
|
|
2869
|
+
};
|
|
2870
|
+
const su = ({ iconSize: e = 64, icon: t, className: n, label: o, children: s }) => /* @__PURE__ */ r.createElement(sl, { className: n }, /* @__PURE__ */ r.createElement(M, { type: t, size: e, color: p.themedColor.textLowEmphasis }), /* @__PURE__ */ r.createElement(w, { variant: "body1", color: p.themedColor.textMidEmphasis }, o), s), ol = u.div`position:relative;display:flex;justify-content:center;align-items:center;width:100%;height:100%;`, sl = u.div`display:flex;flex-direction:column;min-height:104px;align-items:center;gap:20px;text-align:center;`, il = {
|
|
2871
|
+
loading: T(() => import("./CorQ5vL_.js")),
|
|
2872
|
+
error: T(() => import("./ccfzGnJU.js")),
|
|
2873
|
+
noChannels: T(() => import("./DFlRbX2F.js")),
|
|
2874
|
+
noMessages: T(() => import("./DNKomW8O.js"))
|
|
2875
|
+
}, Ce = ({ className: e, type: t = "loading", ...n }) => {
|
|
2876
|
+
const o = il[t];
|
|
2877
|
+
return /* @__PURE__ */ r.createElement(ol, { className: e }, /* @__PURE__ */ r.createElement(ke, { fallback: null }, /* @__PURE__ */ r.createElement(o, { ...n })));
|
|
2878
|
+
}, Yn = ({ rootElementId: e, visible: t, onClose: n, children: o }) => {
|
|
2879
|
+
if (!t) return null;
|
|
2880
|
+
const { rootElement: s } = B(), a = pe(s), i = pe(s, !0);
|
|
2881
|
+
return Gr(
|
|
2882
|
+
/* @__PURE__ */ r.createElement(al, { onClick: n }, /* @__PURE__ */ r.createElement(ll, { onClick: (l) => l.stopPropagation() }, o)),
|
|
2883
|
+
a.getElementById(e) ?? a.getElementById(Q.MODAL_ROOT) ?? i.body
|
|
2884
|
+
);
|
|
2885
|
+
}, al = u.div`position:fixed;top:0;left:0;width:100%;height:100%;background:${p.color.overlay.dark};display:flex;justify-content:center;align-items:center;z-index:${fe.MODAL};`, ll = u.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};`, cl = u.div`flex-shrink:0;width:${({ $size: e }) => j(e)};height:${({ $size: e }) => j(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;}`, dl = u(kt)`path{fill:${({ theme: e }) => e.colors.base.primaryContrastContent};}`;
|
|
2886
|
+
function qn({ size: e }) {
|
|
2887
|
+
const { aiAgentInfo: t } = U();
|
|
2888
|
+
return t.profileUrl ? /* @__PURE__ */ r.createElement(It, { size: e, src: t.profileUrl }) : /* @__PURE__ */ r.createElement(cl, { $size: e }, /* @__PURE__ */ r.createElement(dl, null));
|
|
2889
|
+
}
|
|
2890
|
+
const ul = u.div`width:100%;height:100%;position:fixed;top:0;left:0;outline:none;`, ml = u.div`height:64px;min-height:64px;box-sizing:border-box;display:flex;justify-content:space-between;border-bottom:1px solid ${p.themedColor.textDisabled};background-color:${p.themedColor.bg_50_600};@media screen and (max-width:768px){position:relative;}`, gl = u.div`box-sizing:border-box;display:flex;flex-direction:row;align-items:center;height:64px;padding:16px 20px;width:calc(100% - 128px);`, hl = u.div`margin-inline-end:8px;`, pl = u.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);}`, fl = u.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;}`, bl = u.div`display:flex;width:160px;justify-content:flex-end;`, El = u.div`inset-inline-end:0;display:flex;flex-direction:row;`, Jn = u.div`width:64px;padding:21px;box-sizing:border-box;cursor:${(e) => e.disabled ? "not-allowed" : "pointer"};`, xl = u(Jn)`border-inline-start:1px solid ${p.themedColor.textDisabled};`, Cl = u.div`width:100%;height:100%;display:flex;align-items:center;justify-content:center;`, vl = u.video`max-width:100%;max-height:100%;user-select:none;-webkit-user-drag:none;`, yl = u.img`max-width:calc(90% - 60px);max-height:calc(90% - 60px);user-select:none;-webkit-user-drag:none;`, _l = u.div`max-width:100%;max-height:100%;display:flex;justify-content:center;align-items:center;`, Sl = ({ file: e, sender: t = {}, onClose: n, onDownloadClick: o }) => {
|
|
2891
|
+
const { type: s, url: a, name: i = "" } = e, { profileUrl: l, nickname: c, userId: d } = t, { aiAgentInfo: g } = U();
|
|
2892
|
+
return /* @__PURE__ */ r.createElement(
|
|
2893
|
+
wl,
|
|
2894
|
+
{
|
|
2895
|
+
profileUrl: l ?? "",
|
|
2896
|
+
nickname: c ?? "",
|
|
2897
|
+
type: s,
|
|
2898
|
+
url: a,
|
|
2899
|
+
name: i,
|
|
2900
|
+
onClose: n,
|
|
2901
|
+
isBotMessage: d === g.userId,
|
|
2902
|
+
onDownloadClick: o
|
|
2903
|
+
}
|
|
2904
|
+
);
|
|
2905
|
+
}, Tl = ({ profileUrl: e, isBotMessage: t }) => !e && t ? /* @__PURE__ */ r.createElement(qn, { size: 32 }) : /* @__PURE__ */ r.createElement(It, { size: 32, src: e }), wl = ({
|
|
2906
|
+
profileUrl: e,
|
|
2907
|
+
isBotMessage: t,
|
|
2908
|
+
nickname: n,
|
|
2909
|
+
name: o,
|
|
2910
|
+
type: s,
|
|
2911
|
+
url: a,
|
|
2912
|
+
onClose: i,
|
|
2913
|
+
onDownloadClick: l
|
|
2914
|
+
}) => {
|
|
2915
|
+
const { stringSet: c } = O();
|
|
2916
|
+
return /* @__PURE__ */ r.createElement(Yn, { onClose: i, visible: !0, rootElementId: Q.MODAL_ROOT }, /* @__PURE__ */ r.createElement(ul, null, /* @__PURE__ */ r.createElement(ml, null, /* @__PURE__ */ r.createElement(gl, null, /* @__PURE__ */ r.createElement(hl, null, /* @__PURE__ */ r.createElement(Tl, { profileUrl: e, isBotMessage: t })), /* @__PURE__ */ r.createElement(pl, null, /* @__PURE__ */ r.createElement(w, { variant: "h2", color: p.themedColor.textHighEmphasis }, o)), /* @__PURE__ */ r.createElement(fl, null, /* @__PURE__ */ r.createElement(w, { variant: "body1", color: p.color.ondark.textMidEmphasis }, n))), /* @__PURE__ */ r.createElement(bl, null, an(s) && /* @__PURE__ */ r.createElement(El, null, /* @__PURE__ */ r.createElement(Jn, { as: "a", href: a, target: "_blank", rel: St, onClick: l }, /* @__PURE__ */ r.createElement(M, { type: "download", color: p.themedColor.textHighEmphasis, size: 24 }))), /* @__PURE__ */ r.createElement(xl, { onClick: i }, /* @__PURE__ */ r.createElement(M, { type: "close", color: p.themedColor.textHighEmphasis, size: 24 })))), /* @__PURE__ */ r.createElement(Cl, { onClick: (d) => d.currentTarget === d.target && i() }, Kn(s) && /* @__PURE__ */ r.createElement(vl, { controls: !0 }, /* @__PURE__ */ r.createElement("source", { src: a, type: s })), jn(s) && /* @__PURE__ */ r.createElement(yl, { src: a, alt: o }), !an(s) && /* @__PURE__ */ r.createElement(_l, null, /* @__PURE__ */ r.createElement(w, { variant: "h1", color: p.themedColor.textHighEmphasis }, c.FILE_VIEWER__UNSUPPORT)))));
|
|
2917
|
+
}, Xn = ({
|
|
2918
|
+
className: e,
|
|
2919
|
+
locale: t,
|
|
2920
|
+
date: n = Date.now(),
|
|
2921
|
+
formatString: o = "MMMM dd, yyyy",
|
|
2922
|
+
style: s
|
|
2923
|
+
}) => /* @__PURE__ */ r.createElement(Al, { style: s, className: e }, /* @__PURE__ */ r.createElement(w, { variant: "caption4", color: p.themedColor.textMidEmphasis }, Cn(n, o, { locale: t }))), Al = u.div`display:flex;justify-content:center;align-items:center;`, kl = ye(function(t, n) {
|
|
2924
|
+
const {
|
|
2925
|
+
messages: o,
|
|
2926
|
+
renderMessage: s,
|
|
2927
|
+
messageTopArea: a,
|
|
2928
|
+
messageBottomArea: i,
|
|
2929
|
+
overlayArea: l,
|
|
2930
|
+
onLoadPrev: c,
|
|
2931
|
+
onLoadNext: d,
|
|
2932
|
+
loadThreshold: g = 0.05,
|
|
2933
|
+
onScrollPosition: h = Ie,
|
|
2934
|
+
depsForResetScrollPositionToBottom: f,
|
|
2935
|
+
scrollPositionRef: x,
|
|
2936
|
+
scrollDistanceFromBottomRef: b,
|
|
2937
|
+
stackDirection: E = "top"
|
|
2938
|
+
} = t, m = n && "current" in n ? n : { current: null }, C = N(!1), v = N(void 0), S = N(0), k = N(0), F = N(0), $ = x ?? k, V = b ?? F;
|
|
2939
|
+
le(() => {
|
|
2940
|
+
m.current && (m.current.scrollTop = m.current.scrollHeight);
|
|
2941
|
+
}, f), le(() => {
|
|
2942
|
+
m.current && (v.current === "top" && (m.current.scrollTop = m.current.scrollHeight - $.current), v.current === "bottom" && (m.current.scrollTop = S.current), v.current = void 0);
|
|
2943
|
+
}, [m.current, o.length]);
|
|
2944
|
+
const ne = async () => {
|
|
2945
|
+
if (!m.current) return;
|
|
2946
|
+
const y = m.current;
|
|
2947
|
+
if (h(Il(y)), $.current = y.scrollHeight - y.scrollTop, V.current = $.current - y.clientHeight, S.current = y.scrollTop, C.current) return;
|
|
2948
|
+
const H = y.clientHeight * Math.min(Math.max(0, g), 1);
|
|
2949
|
+
y.scrollTop <= H ? (C.current = !0, v.current = "top", await c(), C.current = !1) : y.scrollHeight - y.scrollTop - y.clientHeight <= H ? (C.current = !0, v.current = "bottom", await d(), C.current = !1) : v.current = void 0;
|
|
2950
|
+
};
|
|
2951
|
+
return /* @__PURE__ */ r.createElement($l, { id: "infinite-list-container" }, /* @__PURE__ */ r.createElement(Ml, { id: "infinite-list-inner", ref: m, onScroll: ne }, E === "bottom" && /* @__PURE__ */ r.createElement("div", { style: { flexGrow: 1 } }), a, o.map((y, H) => s({ message: y, index: H })), i), /* @__PURE__ */ r.createElement(Ol, { id: "infinite-list-overlay-container" }, /* @__PURE__ */ r.createElement(Ll, { id: "infinite-list-overlay" }, l)));
|
|
2952
|
+
}), cn = 50;
|
|
2953
|
+
function Il(e) {
|
|
2954
|
+
return e.scrollTop <= cn ? "top" : e.scrollHeight - (e.scrollTop + e.clientHeight) <= cn ? "bottom" : "middle";
|
|
2955
|
+
}
|
|
2956
|
+
const $l = u.div`display:flex;position:relative;flex:1;overflow:hidden;`, Ml = u.div`display:flex;flex:1;flex-direction:column;overflow-y:auto;scrollbar-color:${p.themedColor.textLowEmphasis}transparent;&::-webkit-scrollbar-thumb:hover{background-color:transparent;}`, Ol = u.div`position:absolute;top:0;bottom:0;left:0;right:0;pointer-events:none;`, Ll = u.div`pointer-events:auto;`, Rl = ({ className: e, onClick: t }) => /* @__PURE__ */ r.createElement(Dl, { className: e, onClick: t, tabIndex: 0 }, /* @__PURE__ */ r.createElement(M, { size: 24, type: "chevron-down", color: p.color.primary.main })), Dl = u.button`all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:24px;box-shadow:0 2px 8px 0 rgba(0,0,0,0.08),0 4px 6px 0 rgba(0,0,0,0.12);${P.light`
|
|
2957
|
+
background-color: ${p.color.background50};
|
|
2958
|
+
&:hover {
|
|
2959
|
+
background-color: ${p.color.background100};
|
|
2960
|
+
}
|
|
2961
|
+
&:active {
|
|
2962
|
+
background-color: ${p.color.background200};
|
|
2963
|
+
}
|
|
2964
|
+
`}
|
|
2965
|
+
${P.dark`
|
|
2966
|
+
background-color: ${p.color.background400};
|
|
2967
|
+
&:hover {
|
|
2968
|
+
background-color: ${p.color.background500};
|
|
2969
|
+
}
|
|
2970
|
+
&:active {
|
|
2971
|
+
background-color: ${p.color.background700};
|
|
2972
|
+
}
|
|
2973
|
+
`}
|
|
2974
|
+
|
|
2975
|
+
&:focus {
|
|
2976
|
+
outline: none;
|
|
2977
|
+
}
|
|
2978
|
+
`, Qn = () => {
|
|
2979
|
+
const { chatSDK: e } = B(), { channelSource: t } = Z(), [n, o] = _([]);
|
|
2980
|
+
return Xe(e, {
|
|
2981
|
+
onTypingStatusUpdated(s) {
|
|
2982
|
+
var a;
|
|
2983
|
+
if (s.url === ((a = t.channel) == null ? void 0 : a.url)) {
|
|
2984
|
+
const i = s.getTypingUsers();
|
|
2985
|
+
o(i);
|
|
2986
|
+
}
|
|
2987
|
+
}
|
|
2988
|
+
}), n;
|
|
2989
|
+
}, Nl = () => {
|
|
2990
|
+
const { agentPreviewConfigs: e = {}, aiAgentId: t } = B(), { aiAgentInfo: n } = U(), { stringSet: o, dateLocale: s } = O(), { messageSource: a } = Z(), { Template: i } = xe.useContext(), l = e.welcomeMessages ?? [], c = a.messages, d = Ga(c, t), g = c[d.length + 1], h = d[0] ?? g;
|
|
2991
|
+
return {
|
|
2992
|
+
/**
|
|
2993
|
+
* Returns a list of messages filtered according to business requirements.
|
|
2994
|
+
*/
|
|
2995
|
+
filteredMessages: c.filter((f) => Ka(f) ? !1 : l.length > 0 ? !Se.isWelcomeMessage(f, t) : !0),
|
|
2996
|
+
/**
|
|
2997
|
+
* Determines whether to display the DateSeparator in the data list by comparing it with the welcome messages from Bot Studio.
|
|
2998
|
+
*/
|
|
2999
|
+
shouldShowOriginalDate: (f) => f > 0 || l.length === 0 ? !0 : g && !Mr(g.createdAt, (h == null ? void 0 : h.createdAt) ?? 0),
|
|
3000
|
+
/**
|
|
3001
|
+
* Renders the list of welcome messages from Bot Studio.
|
|
3002
|
+
*/
|
|
3003
|
+
renderAgentPreviewWelcomeMessages: () => l.length === 0 ? null : /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(
|
|
3004
|
+
Xn,
|
|
3005
|
+
{
|
|
3006
|
+
style: { margin: "16px 0" },
|
|
3007
|
+
date: h == null ? void 0 : h.createdAt,
|
|
3008
|
+
locale: s,
|
|
3009
|
+
formatString: o.DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR
|
|
3010
|
+
}
|
|
3011
|
+
), l.map((f, x) => {
|
|
3012
|
+
const b = x === l.length - 1, E = d.length !== c.length, m = l.length === 1 ? "single" : x === 0 ? "top" : b || E ? "bottom" : "middle";
|
|
3013
|
+
return /* @__PURE__ */ r.createElement(
|
|
3014
|
+
i,
|
|
3015
|
+
{
|
|
3016
|
+
messageType: "user",
|
|
3017
|
+
message: f.message,
|
|
3018
|
+
sender: n,
|
|
3019
|
+
groupType: m,
|
|
3020
|
+
createdAt: (h == null ? void 0 : h.createdAt) ?? Date.now(),
|
|
3021
|
+
extendedMessagePayload: { suggested_replies: f.suggestedReplies },
|
|
3022
|
+
suggestedRepliesDirection: e.suggestedRepliesDirection,
|
|
3023
|
+
suggestedRepliesVisible: b && !E,
|
|
3024
|
+
isBotMessage: !0,
|
|
3025
|
+
onClickSuggestedReply: async ({ reply: C }) => {
|
|
3026
|
+
a.sendUserMessage({ message: C });
|
|
3027
|
+
}
|
|
3028
|
+
}
|
|
3029
|
+
);
|
|
3030
|
+
}))
|
|
3031
|
+
};
|
|
3032
|
+
}, Pl = (e) => u(e).withConfig({ shouldForwardProp: jr });
|
|
3033
|
+
function Bl(e) {
|
|
3034
|
+
var o;
|
|
3035
|
+
const t = "remove_powered_by", n = (o = e == null ? void 0 : e.appInfo) == null ? void 0 : o.applicationAttributes;
|
|
3036
|
+
return Array.isArray(n) && n.includes(t);
|
|
3037
|
+
}
|
|
3038
|
+
const Fl = ({ style: e }) => {
|
|
3039
|
+
const { stringSet: t } = O(), { chatSDK: n } = B(), { isActionbookTester: o } = Re();
|
|
3040
|
+
return Bl(n) || o ? null : /* @__PURE__ */ r.createElement(Ul, { variant: "caption2", style: e }, t.POWERED_BY + " ", /* @__PURE__ */ r.createElement(
|
|
3041
|
+
Hl,
|
|
3042
|
+
{
|
|
3043
|
+
variant: "caption2",
|
|
3044
|
+
as: "a",
|
|
3045
|
+
href: "https://sendbird.com?utm_medium=product&utm_source=aiagent&utm_campaign=fy26-glbl-ai-agent-poweredby",
|
|
3046
|
+
"aria-label": "Learn more about Sendbird",
|
|
3047
|
+
rel: St,
|
|
3048
|
+
target: "_blank"
|
|
3049
|
+
},
|
|
3050
|
+
"Sendbird"
|
|
3051
|
+
));
|
|
3052
|
+
}, Ul = u(w)`color:${p.themedColor.textLowEmphasis};text-align:center;`, Hl = Pl(w)`
|
|
3053
|
+
color: ${p.themedColor.textLowEmphasis};
|
|
3054
|
+
cursor: pointer;
|
|
3055
|
+
text-decoration: none;
|
|
3056
|
+
`, zl = () => {
|
|
3057
|
+
var c;
|
|
3058
|
+
const { stringSet: e } = O(), { activeChannel: t } = U(), { channelSource: n, goToActiveConversation: o, scrollSource: s } = Z(), a = Pn(n.channel), l = t && ((c = n.channel) == null ? void 0 : c.url) === (t == null ? void 0 : t.url) && a;
|
|
3059
|
+
return le(() => {
|
|
3060
|
+
l && s.scrollPubSub.publish({ type: "scrollToBottom", data: { animated: !0 } });
|
|
3061
|
+
}, [l]), l ? /* @__PURE__ */ r.createElement(Vl, null, /* @__PURE__ */ r.createElement(
|
|
3062
|
+
Wl,
|
|
3063
|
+
{
|
|
3064
|
+
variant: "button",
|
|
3065
|
+
role: "button",
|
|
3066
|
+
color: p.themedColor.textHighEmphasis,
|
|
3067
|
+
onClick: () => o()
|
|
3068
|
+
},
|
|
3069
|
+
e.START_NEW_CONVERSATION
|
|
3070
|
+
)) : null;
|
|
3071
|
+
}, Vl = u.div`display:flex;justify-content:center;margin:16px 0;`, Wl = u(w)`border-radius:6px;box-sizing:border-box;padding:10px 20px;border:1px solid ${p.themedColor.textDisabled};cursor:pointer;user-select:none;`, Gl = !0, jl = () => {
|
|
3072
|
+
const { Template: e } = Ot.useContext(), { Template: t } = xe.useContext(), { Template: n } = Lt.useContext(), [o, s] = _(null), { userSession: a, aiAgentInfo: i } = U(), { cache: l, agentPreviewConfigs: c, chatSDK: d, state: g } = B(), { stringSet: h, dateLocale: f } = O(), { conversation: x, channelSource: b, messageSource: E, scrollSource: m } = Z(), { isActionbookTester: C } = Re(), { filteredMessages: v, shouldShowOriginalDate: S, renderAgentPreviewWelcomeMessages: k } = Nl(), F = Qn(), $ = Mt(() => {
|
|
3073
|
+
const y = F[0];
|
|
3074
|
+
if (!y) return null;
|
|
3075
|
+
const H = y.userId === i.userId;
|
|
3076
|
+
return { user: H ? i : y, isBot: H };
|
|
3077
|
+
});
|
|
3078
|
+
L(() => {
|
|
3079
|
+
$ && m.scrollPubSub.publish({ type: "scrollToBottom", data: { animated: !0 } });
|
|
3080
|
+
}, [!!$, m.scrollPubSub.publish]);
|
|
3081
|
+
const V = (y, H = !1) => {
|
|
3082
|
+
var re;
|
|
3083
|
+
return H ? i : ((re = b.channel) == null ? void 0 : re.members.find((Y) => Y.userId === y.sender.userId)) ?? y.sender;
|
|
3084
|
+
}, ne = () => {
|
|
3085
|
+
if (!E.initialized)
|
|
3086
|
+
return /* @__PURE__ */ r.createElement(Ce, { type: "loading" });
|
|
3087
|
+
if (E.messages.length === 0) {
|
|
3088
|
+
const y = k();
|
|
3089
|
+
return y ? /* @__PURE__ */ r.createElement("div", { style: { width: "100%" } }, y) : /* @__PURE__ */ r.createElement(Ce, { type: "noMessages", label: h.PLACE_HOLDER__NO_MESSAGES });
|
|
3090
|
+
}
|
|
3091
|
+
return /* @__PURE__ */ r.createElement(
|
|
3092
|
+
kl,
|
|
3093
|
+
{
|
|
3094
|
+
ref: m.scrollRef,
|
|
3095
|
+
scrollPositionRef: m.scrollPositionRef,
|
|
3096
|
+
scrollDistanceFromBottomRef: m.scrollDistanceFromBottomRef,
|
|
3097
|
+
onScrollPosition: (y) => m.setIsScrollBottomReached(y === "bottom"),
|
|
3098
|
+
stackDirection: c == null ? void 0 : c.messageStackDirection,
|
|
3099
|
+
messages: v,
|
|
3100
|
+
onLoadPrev: E.loadPrevious,
|
|
3101
|
+
onLoadNext: E.loadNext,
|
|
3102
|
+
depsForResetScrollPositionToBottom: [E.initialized, E.messages.length !== 0],
|
|
3103
|
+
messageTopArea: /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(Fl, { style: { marginTop: 16 } }), k()),
|
|
3104
|
+
messageBottomArea: /* @__PURE__ */ r.createElement(r.Fragment, null, $ && /* @__PURE__ */ r.createElement(
|
|
3105
|
+
t,
|
|
3106
|
+
{
|
|
3107
|
+
isTyping: !0,
|
|
3108
|
+
isBotMessage: $.isBot,
|
|
3109
|
+
sender: $.user,
|
|
3110
|
+
messageType: "user",
|
|
3111
|
+
groupType: "single",
|
|
3112
|
+
message: ""
|
|
3113
|
+
}
|
|
3114
|
+
), /* @__PURE__ */ r.createElement(zl, null)),
|
|
3115
|
+
overlayArea: /* @__PURE__ */ r.createElement(r.Fragment, null, !m.isScrollBottomReached && /* @__PURE__ */ r.createElement(Zl, { onClick: () => m.scrollPubSub.publish({ type: "scrollToBottom" }) })),
|
|
3116
|
+
renderMessage: ({ message: y, index: H }) => {
|
|
3117
|
+
const re = Va(y), Y = v[H - 1], nt = v[H + 1], rt = v[v.length - 1], A = y === rt, D = Wa(y, Y, nt, Gl), K = !Wr((Y == null ? void 0 : Y.createdAt) ?? 0, y.createdAt) && S(H) && !C, q = (Pe) => {
|
|
3118
|
+
(y.isFileMessage() || y.isUserMessage()) && s({ file: Pe, sender: V(y, y.sender.userId === i.userId) });
|
|
3119
|
+
}, be = () => {
|
|
3120
|
+
y.isFileMessage() && $t(y.url);
|
|
3121
|
+
}, fr = K ? /* @__PURE__ */ r.createElement(
|
|
3122
|
+
Xn,
|
|
3123
|
+
{
|
|
3124
|
+
style: { margin: "16px 0" },
|
|
3125
|
+
date: y.createdAt,
|
|
3126
|
+
locale: f,
|
|
3127
|
+
formatString: h.DATE_FORMAT__MESSAGE_LIST__DATE_SEPARATOR
|
|
3128
|
+
}
|
|
3129
|
+
) : null, Ne = {
|
|
3130
|
+
maxBodyWidth: g.expanded ? Ln : void 0,
|
|
3131
|
+
extendedMessagePayload: y.extendedMessagePayload,
|
|
3132
|
+
createdAt: y.createdAt,
|
|
3133
|
+
groupType: D,
|
|
3134
|
+
onClickMedia: q,
|
|
3135
|
+
onClickFile: be
|
|
3136
|
+
}, br = (() => {
|
|
3137
|
+
var Pe, Ft;
|
|
3138
|
+
if (Ve.isAdmin(y))
|
|
3139
|
+
return Ve.isCSAT(y) ? x ? /* @__PURE__ */ r.createElement(
|
|
3140
|
+
n,
|
|
3141
|
+
{
|
|
3142
|
+
...Ne,
|
|
3143
|
+
...x,
|
|
3144
|
+
isResolvedWhenDeterminedByUser: Yl(x),
|
|
3145
|
+
messageType: "admin.csat",
|
|
3146
|
+
onSubmitCSAT: ({ csat: oe, csatType: me, csatReason: z, isResolved: se }) => {
|
|
3147
|
+
var ge;
|
|
3148
|
+
oe && ((ge = b.channel) == null || ge.submitCSAT({ csat: oe, csatType: me, csatReason: z, isResolved: se }));
|
|
3149
|
+
}
|
|
3150
|
+
}
|
|
3151
|
+
) : null : /* @__PURE__ */ r.createElement(n, { ...Ne, messageType: "admin", message: y.message });
|
|
3152
|
+
if (Ve.isOutgoing(y, a.userId)) {
|
|
3153
|
+
const oe = {
|
|
3154
|
+
...Ne,
|
|
3155
|
+
message: y.message,
|
|
3156
|
+
sender: V(y),
|
|
3157
|
+
sendingStatus: y.sendingStatus
|
|
3158
|
+
};
|
|
3159
|
+
if (y.isUserMessage())
|
|
3160
|
+
return /* @__PURE__ */ r.createElement(e, { messageType: "user", ...oe });
|
|
3161
|
+
if (y.isFileMessage()) {
|
|
3162
|
+
const [me, z] = ((Pe = y.metaArrays.find((se) => se.key === Zn)) == null ? void 0 : Pe.value) ?? [];
|
|
3163
|
+
return /* @__PURE__ */ r.createElement(
|
|
3164
|
+
e,
|
|
3165
|
+
{
|
|
3166
|
+
messageType: "file",
|
|
3167
|
+
file: y,
|
|
3168
|
+
metadata: {
|
|
3169
|
+
aspectRatio: me && z ? `${me}/${z}` : "1/1",
|
|
3170
|
+
localFile: (Ft = y.messageParams) == null ? void 0 : Ft.file
|
|
3171
|
+
},
|
|
3172
|
+
...oe
|
|
3173
|
+
}
|
|
3174
|
+
);
|
|
3175
|
+
}
|
|
3176
|
+
}
|
|
3177
|
+
if (Ve.isIncoming(y, a.userId)) {
|
|
3178
|
+
const oe = y.sender.userId === i.userId, me = {
|
|
3179
|
+
...Ne,
|
|
3180
|
+
sender: V(y, oe),
|
|
3181
|
+
message: y.message,
|
|
3182
|
+
suggestedRepliesVisible: A,
|
|
3183
|
+
suggestedRepliesDirection: c == null ? void 0 : c.suggestedRepliesDirection,
|
|
3184
|
+
isBotMessage: oe,
|
|
3185
|
+
isStreaming: Se.isStreaming(y),
|
|
3186
|
+
onClickSuggestedReply: async ({ reply: z }) => {
|
|
3187
|
+
E.sendUserMessage({ message: z });
|
|
3188
|
+
},
|
|
3189
|
+
onRequestMessageTemplate: async (z) => {
|
|
3190
|
+
const { template: se } = await d.aiAgent.getMessageTemplate(z);
|
|
3191
|
+
return l.template.set(z, se), se;
|
|
3192
|
+
},
|
|
3193
|
+
onGetCachedMessageTemplate: (z) => l.template.get(z),
|
|
3194
|
+
onHandleTemplateInternalAction: (z) => {
|
|
3195
|
+
if (z.type === "internal" && z.internalData) {
|
|
3196
|
+
const { method: se, payload: ge } = z.internalData;
|
|
3197
|
+
se === "message.send" && (ge != null && ge.message) && E.sendUserMessage({ message: ge.message });
|
|
3198
|
+
}
|
|
3199
|
+
}
|
|
3200
|
+
};
|
|
3201
|
+
if (y.isUserMessage())
|
|
3202
|
+
return /* @__PURE__ */ r.createElement(t, { messageType: "user", ...me });
|
|
3203
|
+
if (y.isFileMessage())
|
|
3204
|
+
return /* @__PURE__ */ r.createElement(t, { messageType: "file", file: y, ...me });
|
|
3205
|
+
}
|
|
3206
|
+
})();
|
|
3207
|
+
return /* @__PURE__ */ r.createElement("div", { key: re, id: `${ie}-message-item` }, fr, br);
|
|
3208
|
+
}
|
|
3209
|
+
}
|
|
3210
|
+
);
|
|
3211
|
+
};
|
|
3212
|
+
return /* @__PURE__ */ r.createElement(Kl, { id: `${ie}-message-list` }, ne(), o && /* @__PURE__ */ r.createElement(Sl, { onClose: () => s(null), sender: o.sender, file: o.file }));
|
|
3213
|
+
}, Kl = u.div`overflow-y:hidden;display:flex;flex:1;position:relative;`, Zl = u(Rl)`position:absolute;bottom:20px;inset-inline-end:20px;`;
|
|
3214
|
+
function Yl(e) {
|
|
3215
|
+
var t;
|
|
3216
|
+
if (((t = e == null ? void 0 : e.resolution) == null ? void 0 : t.determinedBy) === "user")
|
|
3217
|
+
return e.resolution.isResolved;
|
|
3218
|
+
}
|
|
3219
|
+
const ql = () => {
|
|
3220
|
+
const { stringSet: e } = O(), { connectionError: t } = U(), { channelSource: n } = Z(), o = t || n.error;
|
|
3221
|
+
if (o) {
|
|
3222
|
+
const s = t ? void 0 : { label: e.RETRY, onClick: () => n.refetch() };
|
|
3223
|
+
return /* @__PURE__ */ r.createElement(Ce, { type: "error", label: o.message, action: s });
|
|
3224
|
+
}
|
|
3225
|
+
return n.channel ? /* @__PURE__ */ r.createElement(jl, null) : /* @__PURE__ */ r.createElement(Ce, { type: "loading" });
|
|
3226
|
+
}, er = () => {
|
|
3227
|
+
const { stringSet: e } = O(), { activeChannel: t } = U(), [n] = _(() => (t == null ? void 0 : t.status) === W.OPEN);
|
|
3228
|
+
return n ? e.RETURN_TO_CONVERSATION : e.START_NEW_CONVERSATION;
|
|
3229
|
+
}, Jl = () => {
|
|
3230
|
+
const { stringSet: e } = O(), { goToActiveConversation: t } = Z(), n = er();
|
|
3231
|
+
return /* @__PURE__ */ r.createElement(Xl, null, /* @__PURE__ */ r.createElement(w, { variant: "body1", color: p.themedColor.textMidEmphasis }, e.CONVERSATION_CLOSED_FOOTER_LABEL), /* @__PURE__ */ r.createElement(Ql, { onClick: t }, /* @__PURE__ */ r.createElement(w, { variant: "button", color: p.themedColor.textHighEmphasis }, n)));
|
|
3232
|
+
}, Xl = u.div`display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 0;gap:14px;${P.light`
|
|
3233
|
+
background-color: ${p.color.background100};
|
|
3234
|
+
`}
|
|
3235
|
+
${P.dark`
|
|
3236
|
+
background-color: ${p.color.background500};
|
|
3237
|
+
`}
|
|
3238
|
+
`, Ql = u.button`all:unset;padding:10px 20px;border-radius:6px;border:1px solid ${p.themedColor.textDisabled};cursor:pointer;${P.light`
|
|
3239
|
+
background-color: ${p.color.background50};
|
|
3240
|
+
`}
|
|
3241
|
+
${P.dark`
|
|
3242
|
+
background-color: ${p.color.background700};
|
|
3243
|
+
`}
|
|
3244
|
+
`, tr = ve(void 0), ec = ({ children: e }) => {
|
|
3245
|
+
const { stringSet: t } = O(), { attachmentMode: n } = U(), { channelSource: o } = Z(), [s, a] = _([]), [i, l] = _({
|
|
3246
|
+
visible: !1,
|
|
3247
|
+
title: "",
|
|
3248
|
+
buttonText: t.BUTTON__OK
|
|
3249
|
+
}), c = Fn(o.channel), d = ae(() => {
|
|
3250
|
+
switch (n) {
|
|
3251
|
+
case je.OFF:
|
|
3252
|
+
return !1;
|
|
3253
|
+
case je.ALWAYS:
|
|
3254
|
+
return !0;
|
|
3255
|
+
case je.HANDED_OFF_ONLY:
|
|
3256
|
+
return c;
|
|
3257
|
+
default:
|
|
3258
|
+
return c;
|
|
3259
|
+
}
|
|
3260
|
+
}, [n, c]), g = (x) => {
|
|
3261
|
+
if (!d) return;
|
|
3262
|
+
const b = x.filter((E) => On.includes(E.type));
|
|
3263
|
+
if (b.length !== 0) {
|
|
3264
|
+
if (b.some((E) => E.size > _s)) {
|
|
3265
|
+
l((E) => ({
|
|
3266
|
+
...E,
|
|
3267
|
+
visible: !0,
|
|
3268
|
+
title: t.FILE_UPLOAD_NOTIFICATION__SIZE_LIMIT.replace("%d", "25")
|
|
3269
|
+
}));
|
|
3270
|
+
return;
|
|
3271
|
+
}
|
|
3272
|
+
if (b.length > 1 || b.length > 0 && s.length > 0) {
|
|
3273
|
+
l((E) => ({
|
|
3274
|
+
...E,
|
|
3275
|
+
visible: !0,
|
|
3276
|
+
title: t.FILE_UPLOAD_NOTIFICATION__COUNT_LIMIT
|
|
3277
|
+
}));
|
|
3278
|
+
return;
|
|
3279
|
+
}
|
|
3280
|
+
a((E) => [
|
|
3281
|
+
...E,
|
|
3282
|
+
...b.map((m) => ({
|
|
3283
|
+
file: m,
|
|
3284
|
+
preview: { url: URL.createObjectURL(m), type: m.type, name: m.name }
|
|
3285
|
+
}))
|
|
3286
|
+
]);
|
|
3287
|
+
}
|
|
3288
|
+
}, h = (x) => {
|
|
3289
|
+
a((b) => {
|
|
3290
|
+
var m;
|
|
3291
|
+
const E = (m = b[x]) == null ? void 0 : m.preview;
|
|
3292
|
+
return E && URL.revokeObjectURL(E.url), b.filter((C, v) => v !== x);
|
|
3293
|
+
});
|
|
3294
|
+
}, f = () => {
|
|
3295
|
+
a((x) => (x.forEach((b) => URL.revokeObjectURL(b.preview.url)), []));
|
|
3296
|
+
};
|
|
3297
|
+
return /* @__PURE__ */ r.createElement(
|
|
3298
|
+
tr.Provider,
|
|
3299
|
+
{
|
|
3300
|
+
value: {
|
|
3301
|
+
files: s,
|
|
3302
|
+
addFiles: g,
|
|
3303
|
+
removeFile: h,
|
|
3304
|
+
clearFiles: f,
|
|
3305
|
+
isFileUploadEnabled: d
|
|
3306
|
+
}
|
|
3307
|
+
},
|
|
3308
|
+
e,
|
|
3309
|
+
/* @__PURE__ */ r.createElement(tc, { ...i, onClose: () => l((x) => ({ ...x, visible: !1, title: "" })) })
|
|
3310
|
+
);
|
|
3311
|
+
}, Dt = () => {
|
|
3312
|
+
const e = X(tr);
|
|
3313
|
+
if (!e)
|
|
3314
|
+
throw new Error("useFileUpload must be used within FileUploadProvider");
|
|
3315
|
+
return e;
|
|
3316
|
+
}, tc = ({
|
|
3317
|
+
title: e,
|
|
3318
|
+
buttonText: t,
|
|
3319
|
+
visible: n,
|
|
3320
|
+
onClose: o
|
|
3321
|
+
}) => /* @__PURE__ */ r.createElement(Yn, { rootElementId: Q.WINDOW, visible: n, onClose: o }, /* @__PURE__ */ r.createElement(nc, null, /* @__PURE__ */ r.createElement(oc, null, /* @__PURE__ */ r.createElement(w, { variant: "h1", color: p.themedColor.textHighEmphasis }, e)), /* @__PURE__ */ r.createElement(rc, null, /* @__PURE__ */ r.createElement(sc, { onClick: o }, /* @__PURE__ */ r.createElement(w, { variant: "button", color: p.themedColor.textHighEmphasisInverse }, t))))), nc = u.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};`, rc = u.div`display:flex;flex-direction:row;justify-content:flex-end;`, oc = u.div`margin-bottom:16px;`, sc = u.button`display:flex;justify-content:center;align-items:center;border-radius:4px;cursor:pointer;background-color:${p.themedColor.error};border:1px solid ${p.themedColor.error};padding:10px 16px;&:hover{background-color:${p.color.error.dark};border-color:${p.color.error.dark};}&:active{background-color:${p.color.error.extraDark};}`;
|
|
3322
|
+
function ic({ blurred: e, elementRef: t, document: n = window.document }) {
|
|
3323
|
+
const o = N(!1);
|
|
3324
|
+
e && t.current && n.activeElement === t.current && (o.current = !0), le(() => {
|
|
3325
|
+
var s;
|
|
3326
|
+
!e && o.current && ((s = t.current) == null || s.focus(), o.current = !1);
|
|
3327
|
+
}, [e]);
|
|
3328
|
+
}
|
|
3329
|
+
const ac = (e, t) => {
|
|
3330
|
+
L(() => {
|
|
3331
|
+
t ? e == null || e.startTyping() : e == null || e.endTyping();
|
|
3332
|
+
}, [e, t]);
|
|
3333
|
+
}, lc = u.div`&::-webkit-scrollbar{display:none;}overflow-x:auto;display:flex;flex-direction:row;gap:10px;padding:8px 16px;background-color:transparent;`, cc = u.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;}`, dc = u.div`display:flex;align-items:center;justify-content:center;position:absolute;inset-inline-end:-8px;inset-block-start:-8px;cursor:pointer;border-radius:50%;${P.light`
|
|
3334
|
+
background-color: ${p.color.background50};
|
|
3335
|
+
`}
|
|
3336
|
+
${P.dark`
|
|
3337
|
+
background-color: ${p.color.background500};
|
|
3338
|
+
`}
|
|
3339
|
+
path {
|
|
3340
|
+
fill: ${p.themedColor.textMidEmphasis};
|
|
3341
|
+
}
|
|
3342
|
+
|
|
3343
|
+
&:hover {
|
|
3344
|
+
path {
|
|
3345
|
+
fill: ${p.themedColor.textHighEmphasis};
|
|
3346
|
+
}
|
|
3347
|
+
}
|
|
3348
|
+
|
|
3349
|
+
circle {
|
|
3350
|
+
stroke: ${p.themedColor.bg_50_600};
|
|
3351
|
+
}
|
|
3352
|
+
`, uc = () => {
|
|
3353
|
+
const e = Oe(), [t, n] = _(), { files: o, removeFile: s, isFileUploadEnabled: a } = Dt();
|
|
3354
|
+
return !a || o.length === 0 ? null : /* @__PURE__ */ r.createElement(lc, null, o.map(({ preview: { type: i, name: l, url: c } }, d) => /* @__PURE__ */ r.createElement(cc, { key: c, onMouseOver: () => n(d), onMouseLeave: () => n(void 0) }, (e || t === d) && /* @__PURE__ */ r.createElement(dc, { title: "Remove file", onClick: () => s(d) }, /* @__PURE__ */ r.createElement(M, { type: "close-filled", color: p.themedColor.textMidEmphasis })), i.startsWith("image/") ? /* @__PURE__ */ r.createElement("img", { alt: "file-image", src: c }) : /* @__PURE__ */ r.createElement(At, { name: l, type: wt(l, i) }))));
|
|
3355
|
+
}, mc = ({ channel: e, messages: t }) => {
|
|
3356
|
+
const { stringSet: n } = O(), { aiAgentInfo: o } = U(), s = gc(), a = hc({
|
|
3357
|
+
lastMessage: t[t.length - 1],
|
|
3358
|
+
aiAgentUserId: o.userId
|
|
3359
|
+
});
|
|
3360
|
+
return !e || !s || Pn(e) ? [!0, n.MESSAGE_INPUT__PLACE_HOLDER__DISABLED] : a ? [!0, n.MESSAGE_INPUT__PLACE_HOLDER__WAIT_AI_AGENT_RESPONSE] : [!1, n.MESSAGE_INPUT__PLACE_HOLDER];
|
|
3361
|
+
}, gc = () => {
|
|
3362
|
+
const e = bn(), { chatSDK: t } = B(), [n, o] = _(!0);
|
|
3363
|
+
return L(() => {
|
|
3364
|
+
const s = new Je({
|
|
3365
|
+
onDisconnected: () => o(!1),
|
|
3366
|
+
onConnected: () => o(!0),
|
|
3367
|
+
onReconnectSucceeded: () => o(!0)
|
|
3368
|
+
});
|
|
3369
|
+
return t.addConnectionHandler(e, s), () => {
|
|
3370
|
+
t.removeConnectionHandler(e);
|
|
3371
|
+
};
|
|
3372
|
+
}, [t]), n;
|
|
3373
|
+
}, hc = ({
|
|
3374
|
+
lastMessage: e,
|
|
3375
|
+
aiAgentUserId: t
|
|
3376
|
+
}) => {
|
|
3377
|
+
const [n, o] = _(!1), s = Qn();
|
|
3378
|
+
return L(() => {
|
|
3379
|
+
if (!e) return;
|
|
3380
|
+
const a = s.some((l) => l.userId === t), i = Gn(e, t) && Se.isStreaming(e);
|
|
3381
|
+
o(!!(i || a));
|
|
3382
|
+
}, [s, e, t]), n;
|
|
3383
|
+
}, nr = {
|
|
3384
|
+
textArea: I`min-height:40px;height:40px;font-size:16px;line-height:24px;`,
|
|
3385
|
+
attachIcon: I`margin-bottom:4px;`
|
|
3386
|
+
}, rr = u.button`all:unset;cursor:pointer;display:flex;align-items:center;justify-content:center;width:32px;height:32px;`, pc = u(rr)`flex-shrink:0;margin-inline-end:12px;margin-bottom:2px;&:disabled{cursor:not-allowed;}&:not(:disabled){&:hover{path{fill:${p.themedColor.textHighEmphasis};}}&:active{border-radius:4px;background-color:${p.themedColor.bg_200_400};}}${_t && nr.attachIcon};`, fc = u.input`display:none;`, dn = u.div`width:100%;position:relative;background-color:${p.themedColor.bg_100_500};border-radius:20px;`, un = u.div`display:flex;flex-direction:row;align-items:flex-end;position:relative;`, mn = u.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:${p.themedColor.textHighEmphasis};resize:none;width:100%;height:${Mn}px;overflow-wrap:break-word;white-space:pre-wrap;overflow-x:hidden;${_t && nr.textArea};&::placeholder{color:${p.themedColor.textLowEmphasis};}&:disabled{cursor:not-allowed;&::placeholder{color:${p.themedColor.textDisabled};}}`, gn = u.div`padding:12px 16px;position:relative;display:flex;align-items:center;`, hn = ({ disabled: e }) => {
|
|
3387
|
+
const t = N(null), { addFiles: n, clearFiles: o, files: s, isFileUploadEnabled: a } = Dt();
|
|
3388
|
+
return !a || s.length > 0 ? null : /* @__PURE__ */ r.createElement(
|
|
3389
|
+
pc,
|
|
3390
|
+
{
|
|
3391
|
+
disabled: e,
|
|
3392
|
+
onClick: () => {
|
|
3393
|
+
var i;
|
|
3394
|
+
o(), (i = t.current) == null || i.click();
|
|
3395
|
+
}
|
|
3396
|
+
},
|
|
3397
|
+
/* @__PURE__ */ r.createElement(
|
|
3398
|
+
M,
|
|
3399
|
+
{
|
|
3400
|
+
type: "attach",
|
|
3401
|
+
color: e ? p.themedColor.textDisabled : p.themedColor.textMidEmphasis,
|
|
3402
|
+
size: 16
|
|
3403
|
+
}
|
|
3404
|
+
),
|
|
3405
|
+
/* @__PURE__ */ r.createElement(
|
|
3406
|
+
fc,
|
|
3407
|
+
{
|
|
3408
|
+
type: "file",
|
|
3409
|
+
ref: t,
|
|
3410
|
+
onChange: (i) => {
|
|
3411
|
+
const l = i.currentTarget.files;
|
|
3412
|
+
l && n(Array.from(l)), i.target.value = "";
|
|
3413
|
+
},
|
|
3414
|
+
accept: On.join(",")
|
|
3415
|
+
}
|
|
3416
|
+
)
|
|
3417
|
+
);
|
|
3418
|
+
}, bc = () => {
|
|
3419
|
+
const e = N(null), [t, n] = _(""), { rootElement: o } = B(), { channelSource: s, messageSource: a } = Z(), [i, l] = mc({
|
|
3420
|
+
channel: s.channel,
|
|
3421
|
+
messages: a.messages
|
|
3422
|
+
}), { files: c, addFiles: d, clearFiles: g } = Dt();
|
|
3423
|
+
rl({ onDropFiles: d }), ic({ blurred: i, elementRef: e, document: pe(o) }), ac(s.channel, t);
|
|
3424
|
+
const h = t.trim().length > 0, f = c.length > 0, x = !i && (h || f), b = () => {
|
|
3425
|
+
e.current && (e.current.value = "", e.current.style.height = ""), g(), n("");
|
|
3426
|
+
}, E = async () => {
|
|
3427
|
+
const S = t.trim(), k = { message: S };
|
|
3428
|
+
if (!(!S && !c.length)) {
|
|
3429
|
+
if (c.length > 0) {
|
|
3430
|
+
const F = c[0].file, $ = { ...k, file: F };
|
|
3431
|
+
a.sendFileMessage($), b();
|
|
3432
|
+
return;
|
|
3433
|
+
}
|
|
3434
|
+
a.sendUserMessage(k), b();
|
|
3435
|
+
}
|
|
3436
|
+
}, m = (S) => {
|
|
3437
|
+
const k = Array.from(S.clipboardData.files);
|
|
3438
|
+
k.length > 0 && (S.preventDefault(), d(k));
|
|
3439
|
+
}, C = (S) => {
|
|
3440
|
+
S.key !== "Enter" || S.nativeEvent.isComposing || S.shiftKey || (S.preventDefault(), E());
|
|
3441
|
+
}, v = (S) => {
|
|
3442
|
+
if (e.current) {
|
|
3443
|
+
e.current.style.height = "";
|
|
3444
|
+
const k = Math.min(ys, e.current.scrollHeight);
|
|
3445
|
+
Mn < k && (e.current.style.height = `${k}px`);
|
|
3446
|
+
}
|
|
3447
|
+
n(S.target.value);
|
|
3448
|
+
};
|
|
3449
|
+
return i ? /* @__PURE__ */ r.createElement(gn, null, /* @__PURE__ */ r.createElement(dn, null, /* @__PURE__ */ r.createElement(un, null, /* @__PURE__ */ r.createElement(mn, { disabled: !0, placeholder: l }), /* @__PURE__ */ r.createElement(hn, { disabled: !0 })))) : /* @__PURE__ */ r.createElement(gn, null, /* @__PURE__ */ r.createElement(dn, null, /* @__PURE__ */ r.createElement(uc, null), /* @__PURE__ */ r.createElement(un, null, /* @__PURE__ */ r.createElement(
|
|
3450
|
+
mn,
|
|
3451
|
+
{
|
|
3452
|
+
ref: e,
|
|
3453
|
+
role: "textbox",
|
|
3454
|
+
"aria-label": "Text Input",
|
|
3455
|
+
placeholder: l,
|
|
3456
|
+
maxLength: 5e3,
|
|
3457
|
+
onKeyDown: C,
|
|
3458
|
+
onChange: v,
|
|
3459
|
+
onPaste: m
|
|
3460
|
+
}
|
|
3461
|
+
), /* @__PURE__ */ r.createElement(hn, null))), x && /* @__PURE__ */ r.createElement(rr, { onClick: () => E() }, /* @__PURE__ */ r.createElement(M, { type: "send", color: p.color.primary.main, size: 20 })));
|
|
3462
|
+
}, Ec = u.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:${p.themedColor.textLowEmphasis};&& a{font-weight:700;text-decoration:none;${P.light`
|
|
3463
|
+
color: ${p.color.information.light};
|
|
3464
|
+
`};
|
|
3465
|
+
${P.dark`
|
|
3466
|
+
color: ${p.color.information.main};
|
|
3467
|
+
`};
|
|
3468
|
+
}
|
|
3469
|
+
`, xc = T(() => import("./4nxZMIz3.js").then((e) => ({ default: e.MarkdownText }))), Cc = () => {
|
|
3470
|
+
const { aiAgentInfo: e } = U(), { messageSource: t } = Z(), { userSession: n } = U();
|
|
3471
|
+
return !e.specialNoticeEnabled || !e.specialNotice || !(t.initialized && !t.messages.some((s) => Gn(s, n.userId))) ? null : /* @__PURE__ */ r.createElement(Ec, null, /* @__PURE__ */ r.createElement(xc, null, e.specialNotice));
|
|
3472
|
+
}, vc = () => /* @__PURE__ */ r.createElement(yc, null, /* @__PURE__ */ r.createElement(Cc, null), /* @__PURE__ */ r.createElement(ec, null, /* @__PURE__ */ r.createElement(bc, null))), yc = u.div`z-index:0;border:none;width:100%;`, _c = () => {
|
|
3473
|
+
var a, i, l;
|
|
3474
|
+
const { activeChannel: e } = U(), { channelSource: t } = Z(), n = ((i = (a = t.channel) == null ? void 0 : a.conversation) == null ? void 0 : i.status) === W.CLOSED;
|
|
3475
|
+
return !(((l = t.channel) == null ? void 0 : l.url) === (e == null ? void 0 : e.url)) && n ? /* @__PURE__ */ r.createElement(Jl, null) : /* @__PURE__ */ r.createElement(vc, null);
|
|
3476
|
+
}, Sc = () => {
|
|
3477
|
+
var v;
|
|
3478
|
+
const { state: e, logger: t, enableCloseConversationButton: n, enableExpandButton: o, dispatcher: s } = B(), { stringSet: a } = O(), { aiAgentInfo: i, activeChannel: l } = U(), { channelSource: c, onNavigateToConversationList: d } = Z(), g = c.channel, f = Oe() ? 24 : 16, x = () => {
|
|
3479
|
+
e.setOpened(!1);
|
|
3480
|
+
}, b = async () => {
|
|
3481
|
+
try {
|
|
3482
|
+
const S = await (g == null ? void 0 : g.markConversationAsHandoff());
|
|
3483
|
+
t.info("conversation.handleAgentHandoff: success", S);
|
|
3484
|
+
} catch (S) {
|
|
3485
|
+
t.error("conversation.handleAgentHandoff: error", S);
|
|
3486
|
+
}
|
|
3487
|
+
}, E = async () => {
|
|
3488
|
+
g && await s.send(ro.CloseConversation({ channelUrl: g.url }));
|
|
3489
|
+
}, m = l && (g == null ? void 0 : g.url) === l.url, C = i.showHandoffButton && !!((v = g == null ? void 0 : g.conversation) != null && v.handoff) && m;
|
|
3490
|
+
return /* @__PURE__ */ r.createElement(Ic, null, /* @__PURE__ */ r.createElement($c, null, d && /* @__PURE__ */ r.createElement(De, { onClick: () => d() }, /* @__PURE__ */ r.createElement(M, { type: "menu", size: 24, color: p.themedColor.textHighEmphasis })), m && /* @__PURE__ */ r.createElement(qn, { size: 34 }), /* @__PURE__ */ r.createElement(Oc, { variant: "h2", color: p.themedColor.textHighEmphasis }, i.nickname || (g == null ? void 0 : g.name))), /* @__PURE__ */ r.createElement(Mc, null, C && /* @__PURE__ */ r.createElement(
|
|
3491
|
+
kc,
|
|
3492
|
+
{
|
|
3493
|
+
tooltipLabel: a.HEADER_BUTTON__AGENT_HANDOFF,
|
|
3494
|
+
disabled: !oi(g),
|
|
3495
|
+
size: f,
|
|
3496
|
+
onClick: b
|
|
3497
|
+
}
|
|
3498
|
+
), n && /* @__PURE__ */ r.createElement(
|
|
3499
|
+
Ac,
|
|
3500
|
+
{
|
|
3501
|
+
disabled: !Bn(g),
|
|
3502
|
+
size: f,
|
|
3503
|
+
onClick: E
|
|
3504
|
+
}
|
|
3505
|
+
), o && /* @__PURE__ */ r.createElement(Tc, { size: f }), /* @__PURE__ */ r.createElement(wc, { size: f, onClick: x })));
|
|
3506
|
+
}, Tc = ({ size: e, disabled: t }) => {
|
|
3507
|
+
const { state: n } = B();
|
|
3508
|
+
return /* @__PURE__ */ r.createElement(De, { "aria-label": "expand", onClick: () => n.setExpanded(!n.expanded), disabled: t }, /* @__PURE__ */ r.createElement(M, { type: n.expanded ? "collapse" : "expand", size: e, color: p.themedColor.textHighEmphasis }));
|
|
3509
|
+
}, wc = ({ size: e, disabled: t, onClick: n }) => /* @__PURE__ */ r.createElement(De, { "aria-label": "close messenger", onClick: n, disabled: t }, /* @__PURE__ */ r.createElement(M, { type: "close", size: e, color: p.themedColor.textHighEmphasis })), Ac = ({ size: e, disabled: t, onClick: n }) => /* @__PURE__ */ r.createElement(De, { "aria-label": "close conversation", onClick: n, disabled: t }, /* @__PURE__ */ r.createElement(
|
|
3510
|
+
M,
|
|
3511
|
+
{
|
|
3512
|
+
type: "refresh",
|
|
3513
|
+
size: e,
|
|
3514
|
+
color: t ? p.themedColor.textDisabled : p.themedColor.textHighEmphasis
|
|
3515
|
+
}
|
|
3516
|
+
)), kc = ({ size: e, onClick: t, disabled: n, tooltipLabel: o }) => /* @__PURE__ */ r.createElement(Vn, { label: o, position: "bottom", disabled: n }, /* @__PURE__ */ r.createElement(De, { "aria-label": "agent", onClick: t, disabled: n }, /* @__PURE__ */ r.createElement(
|
|
3517
|
+
M,
|
|
3518
|
+
{
|
|
3519
|
+
type: "agent",
|
|
3520
|
+
size: e,
|
|
3521
|
+
color: n ? p.themedColor.textDisabled : p.themedColor.textHighEmphasis
|
|
3522
|
+
}
|
|
3523
|
+
))), Ic = u.div`height:56px;box-sizing:border-box;display:flex;align-items:center;padding:11px 12px;border-bottom:1px solid ${p.themedColor.textDisabled};background-color:${({ theme: e }) => e.colors.base.headerBackground};`, $c = u.div`display:flex;flex:1;flex-direction:row;align-items:center;gap:6px;overflow:hidden;`, Mc = u.div`display:flex;gap:10px;align-items:center;justify-content:center;`, Oc = u(w)`text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:2px 0;`, De = u.button`all:unset;padding:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;&:disabled{cursor:not-allowed;}`, Lc = () => {
|
|
3524
|
+
const { isActionbookTester: e } = Re();
|
|
3525
|
+
return e ? null : /* @__PURE__ */ r.createElement(Sc, null);
|
|
3526
|
+
}, pn = ({
|
|
3527
|
+
children: e,
|
|
3528
|
+
onNavigateToConversationList: t,
|
|
3529
|
+
closedChannelUrl: n,
|
|
3530
|
+
onClearClosedChannelUrl: o
|
|
3531
|
+
}) => {
|
|
3532
|
+
const { Template: s } = Nt.useContext();
|
|
3533
|
+
return /* @__PURE__ */ r.createElement(
|
|
3534
|
+
nl,
|
|
3535
|
+
{
|
|
3536
|
+
onNavigateToConversationList: t,
|
|
3537
|
+
closedChannelUrl: n,
|
|
3538
|
+
onClearClosedChannelUrl: o
|
|
3539
|
+
},
|
|
3540
|
+
/* @__PURE__ */ r.createElement(Et, null, /* @__PURE__ */ r.createElement(Et.Consumer, null, (a) => /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(Dc, { ...a }, /* @__PURE__ */ r.createElement(s, null)), e)))
|
|
3541
|
+
);
|
|
3542
|
+
}, Nt = _e({
|
|
3543
|
+
template: Rc,
|
|
3544
|
+
components: {
|
|
3545
|
+
Header: Lc,
|
|
3546
|
+
Body: ql,
|
|
3547
|
+
Footer: _c
|
|
3548
|
+
}
|
|
3549
|
+
});
|
|
3550
|
+
function Rc() {
|
|
3551
|
+
const { components: e } = Nt.useContext();
|
|
3552
|
+
return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(e.Header, null), /* @__PURE__ */ r.createElement(e.Body, null), /* @__PURE__ */ r.createElement(e.Footer, null));
|
|
3553
|
+
}
|
|
3554
|
+
const Dc = u.div`height:100%;width:100%;display:flex;flex-direction:column;flex:1;background-color:${({ theme: e }) => e.colors.base.background};`, {
|
|
3555
|
+
Provider: Nc,
|
|
3556
|
+
Context: iu,
|
|
3557
|
+
useContext: or
|
|
3558
|
+
} = G("ConversationList");
|
|
3559
|
+
function Pc({
|
|
3560
|
+
conversationListFilter: e,
|
|
3561
|
+
onOpenConversationView: t = Ie,
|
|
3562
|
+
children: n
|
|
3563
|
+
}) {
|
|
3564
|
+
return /* @__PURE__ */ r.createElement(go, { conversationListFilter: e }, (o) => /* @__PURE__ */ r.createElement(Nc, { value: { ...o, onOpenConversationView: t } }, n));
|
|
3565
|
+
}
|
|
3566
|
+
const sr = _e({
|
|
3567
|
+
template: Bc,
|
|
3568
|
+
// Note: 리스트 변경되면 디자인 변경 가능성이 있어서 일단 컴포넌트는 비워둠
|
|
3569
|
+
components: {}
|
|
3570
|
+
});
|
|
3571
|
+
function Bc({
|
|
3572
|
+
title: e = "",
|
|
3573
|
+
lastMessageTimestamp: t = Date.now(),
|
|
3574
|
+
onClick: n
|
|
3575
|
+
}) {
|
|
3576
|
+
const { stringSet: o, format: s } = O();
|
|
3577
|
+
return /* @__PURE__ */ r.createElement(Fc, { role: "button", onClick: () => n == null ? void 0 : n() }, /* @__PURE__ */ r.createElement(Hc, null, /* @__PURE__ */ r.createElement(zc, null, /* @__PURE__ */ r.createElement(w, { variant: "subtitle1", color: p.themedColor.textHighEmphasis }, s(t, o.DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE)), /* @__PURE__ */ r.createElement(w, { variant: "caption2", color: p.themedColor.textLowEmphasis }, s(t, o.DATE_FORMAT__CONVERSATION_LIST__LIST_ITEM_TITLE_CAPTION))), /* @__PURE__ */ r.createElement(w, { variant: "body3", color: p.themedColor.textMidEmphasis }, e || o.CONVERSATION_LIST__TOPICS_FALLBACK)), /* @__PURE__ */ r.createElement(M, { type: "chevron-right", size: 16, color: p.themedColor.textHighEmphasis }), /* @__PURE__ */ r.createElement(Uc, null));
|
|
3578
|
+
}
|
|
3579
|
+
const Fc = u.div`display:flex;flex-direction:row;align-items:center;position:relative;width:100%;padding:14px 16px;box-sizing:border-box;gap:4px;cursor:pointer;`, Uc = u.div`position:absolute;bottom:0;height:1px;width:calc(100% - 32px);background-color:${p.themedColor.textDisabled};`, Hc = u.div`gap:4px;display:flex;flex-direction:column;flex:1;`, zc = u.div`display:flex;justify-content:flex-start;align-items:center;gap:6px;`, Vc = ({ items: e, renderItem: t, onEndReached: n }) => {
|
|
3580
|
+
const o = (s) => {
|
|
3581
|
+
const a = s.target;
|
|
3582
|
+
a.scrollHeight - a.scrollTop === a.clientHeight && (n == null || n());
|
|
3583
|
+
};
|
|
3584
|
+
return /* @__PURE__ */ r.createElement(Wc, { onScroll: (s) => o(s) }, e.map((s, a) => t(s, a)));
|
|
3585
|
+
}, Wc = u.div`width:100%;height:100%;display:flex;flex-direction:column;flex:1;overflow:auto;`, Gc = () => {
|
|
3586
|
+
const { stringSet: e } = O(), { listSource: t, onOpenConversationView: n } = or(), { Template: o } = sr.useContext();
|
|
3587
|
+
return t.initialized ? t.channels.length === 0 ? /* @__PURE__ */ r.createElement(Ce, { type: "noChannels", label: e.CONVERSATION_LIST__NO_CONVERSATIONS }) : /* @__PURE__ */ r.createElement(
|
|
3588
|
+
Vc,
|
|
3589
|
+
{
|
|
3590
|
+
items: t.channels,
|
|
3591
|
+
renderItem: (s) => {
|
|
3592
|
+
var a, i, l;
|
|
3593
|
+
return /* @__PURE__ */ r.createElement(
|
|
3594
|
+
o,
|
|
3595
|
+
{
|
|
3596
|
+
key: s.url,
|
|
3597
|
+
channelUrl: s.url,
|
|
3598
|
+
title: (i = (a = s.conversation) == null ? void 0 : a.topics) == null ? void 0 : i.join(", "),
|
|
3599
|
+
lastMessageTimestamp: (l = s.lastMessage) == null ? void 0 : l.createdAt,
|
|
3600
|
+
onClick: () => n(s.url, W.CLOSED),
|
|
3601
|
+
channel: s
|
|
3602
|
+
}
|
|
3603
|
+
);
|
|
3604
|
+
},
|
|
3605
|
+
onEndReached: () => {
|
|
3606
|
+
t.loadMore();
|
|
3607
|
+
}
|
|
3608
|
+
}
|
|
3609
|
+
) : /* @__PURE__ */ r.createElement(Ce, { type: "loading" });
|
|
3610
|
+
}, jc = () => {
|
|
3611
|
+
const { refreshActiveChannel: e } = U(), { onOpenConversationView: t } = or(), n = er();
|
|
3612
|
+
return /* @__PURE__ */ r.createElement(
|
|
3613
|
+
Kc,
|
|
3614
|
+
{
|
|
3615
|
+
role: "button",
|
|
3616
|
+
onClick: async () => {
|
|
3617
|
+
const o = await e();
|
|
3618
|
+
t(o, W.OPEN);
|
|
3619
|
+
}
|
|
3620
|
+
},
|
|
3621
|
+
/* @__PURE__ */ r.createElement(Zc, { variant: "h1" }, n)
|
|
3622
|
+
);
|
|
3623
|
+
}, Kc = u.div`background-color:${({ theme: e }) => e.colors.base.primary};display:flex;align-items:center;justify-content:center;padding:16px;cursor:pointer;`, Zc = u(w)`color:${({ theme: e }) => e.colors.base.primaryContrastContent};overflow:hidden;text-overflow:ellipsis;white-space:nowrap;`, Yc = () => {
|
|
3624
|
+
const { stringSet: e } = O();
|
|
3625
|
+
return /* @__PURE__ */ r.createElement(qc, null, /* @__PURE__ */ r.createElement(Jc, { variant: "h2", color: p.themedColor.textHighEmphasis }, e.CONVERSATION_LIST__HEADER_TITLE), /* @__PURE__ */ r.createElement(Xc, null));
|
|
3626
|
+
}, qc = u.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};`, Jc = u(w)`padding:0 12px;width:100%;box-sizing:border-box;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;`, Xc = u.div`position:absolute;bottom:0;width:100%;height:1px;background-color:${p.themedColor.textDisabled};`, Qc = ({ conversationListFilter: e, children: t, onOpenConversationView: n }) => {
|
|
3627
|
+
const { Template: o } = Pt.useContext();
|
|
3628
|
+
return /* @__PURE__ */ r.createElement(
|
|
3629
|
+
Pc,
|
|
3630
|
+
{
|
|
3631
|
+
conversationListFilter: e,
|
|
3632
|
+
onOpenConversationView: n
|
|
3633
|
+
},
|
|
3634
|
+
/* @__PURE__ */ r.createElement(td, null, /* @__PURE__ */ r.createElement(o, null)),
|
|
3635
|
+
t
|
|
3636
|
+
);
|
|
3637
|
+
}, Pt = _e({
|
|
3638
|
+
template: ed,
|
|
3639
|
+
components: {
|
|
3640
|
+
Header: Yc,
|
|
3641
|
+
Body: Gc,
|
|
3642
|
+
Footer: jc
|
|
3643
|
+
}
|
|
3644
|
+
});
|
|
3645
|
+
function ed() {
|
|
3646
|
+
const { components: e } = Pt.useContext();
|
|
3647
|
+
return /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(e.Header, null), /* @__PURE__ */ r.createElement(e.Body, null), /* @__PURE__ */ r.createElement(e.Footer, null));
|
|
3648
|
+
}
|
|
3649
|
+
const td = u.div`height:100%;width:100%;display:flex;flex-direction:column;flex:1;background-color:${({ theme: e }) => e.colors.base.background};`, nd = I`:where(#${Q.ENTRY}) :not(code *){font-family:'Roboto',sans-serif;box-sizing:border-box;}`, rd = [nd, ss, is], od = (e, ...t) => Ir(e, ...rd, ...t), sd = od``, id = Kr(
|
|
3650
|
+
Nt,
|
|
3651
|
+
xe,
|
|
3652
|
+
Ot,
|
|
3653
|
+
Lt,
|
|
3654
|
+
Pt,
|
|
3655
|
+
sr
|
|
3656
|
+
);
|
|
3657
|
+
function ad({
|
|
3658
|
+
appearance: e,
|
|
3659
|
+
rootElement: t,
|
|
3660
|
+
logger: n,
|
|
3661
|
+
language: o,
|
|
3662
|
+
stringSet: s,
|
|
3663
|
+
children: a,
|
|
3664
|
+
messageTemplate: i,
|
|
3665
|
+
theme: l
|
|
3666
|
+
}) {
|
|
3667
|
+
return ms(Yo, t), /* @__PURE__ */ r.createElement($r, { target: t }, /* @__PURE__ */ r.createElement(cs, { rootElement: t, logger: n, appearance: e, theme: l }, /* @__PURE__ */ r.createElement(zo, { internalVariables: i == null ? void 0 : i.__internalVariables }, /* @__PURE__ */ r.createElement(os, { stringSet: s, logger: n, language: o }, /* @__PURE__ */ r.createElement(id, null, a, /* @__PURE__ */ r.createElement(sd, null))))));
|
|
3668
|
+
}
|
|
3669
|
+
const We = {}, Ge = {
|
|
3670
|
+
getItem: (e) => {
|
|
3671
|
+
try {
|
|
3672
|
+
return localStorage.getItem(e);
|
|
3673
|
+
} catch {
|
|
3674
|
+
return We[e] ?? null;
|
|
3675
|
+
}
|
|
3676
|
+
},
|
|
3677
|
+
setItem: (e, t) => {
|
|
3678
|
+
try {
|
|
3679
|
+
localStorage.setItem(e, t);
|
|
3680
|
+
} catch {
|
|
3681
|
+
We[e] = t;
|
|
3682
|
+
}
|
|
3683
|
+
},
|
|
3684
|
+
deleteItem: (e) => {
|
|
3685
|
+
try {
|
|
3686
|
+
localStorage.removeItem(e);
|
|
3687
|
+
} catch {
|
|
3688
|
+
delete We[e];
|
|
3689
|
+
}
|
|
3690
|
+
},
|
|
3691
|
+
getKeys: (e) => {
|
|
3692
|
+
try {
|
|
3693
|
+
const t = [];
|
|
3694
|
+
for (let n = 0; n < localStorage.length; n++) {
|
|
3695
|
+
const o = localStorage.key(n);
|
|
3696
|
+
o && o.startsWith(e) && t.push(o);
|
|
3697
|
+
}
|
|
3698
|
+
return t;
|
|
3699
|
+
} catch {
|
|
3700
|
+
return Object.keys(We).filter((t) => t.startsWith(e));
|
|
3701
|
+
}
|
|
3702
|
+
}
|
|
3703
|
+
}, ir = ye(function({
|
|
3704
|
+
rootElement: t = document.body,
|
|
3705
|
+
logLevel: n = En.WARN,
|
|
3706
|
+
language: o = navigator.language,
|
|
3707
|
+
userSessionInfo: s,
|
|
3708
|
+
children: a,
|
|
3709
|
+
...i
|
|
3710
|
+
}, l) {
|
|
3711
|
+
var c, d;
|
|
3712
|
+
return we.level !== n && (we.level = n), us("https://fonts.googleapis.com/css2?family=Roboto&display=swap", t), /* @__PURE__ */ r.createElement("div", { id: Q.ENTRY, style: { width: "fit-content", height: "fit-content", ...i.entryStyle } }, /* @__PURE__ */ r.createElement(
|
|
3713
|
+
ad,
|
|
3714
|
+
{
|
|
3715
|
+
logger: we,
|
|
3716
|
+
rootElement: t,
|
|
3717
|
+
appearance: (c = i.agentPreviewConfigs) == null ? void 0 : c.appearance,
|
|
3718
|
+
stringSet: i.stringSet,
|
|
3719
|
+
language: o,
|
|
3720
|
+
messageTemplate: i.messageTemplate,
|
|
3721
|
+
theme: i.theme
|
|
3722
|
+
},
|
|
3723
|
+
/* @__PURE__ */ r.createElement(
|
|
3724
|
+
ps,
|
|
3725
|
+
{
|
|
3726
|
+
rootElement: t,
|
|
3727
|
+
keyValueStorage: {
|
|
3728
|
+
get: Ge.getItem,
|
|
3729
|
+
set: Ge.setItem,
|
|
3730
|
+
delete: Ge.deleteItem,
|
|
3731
|
+
getKeys: Ge.getKeys
|
|
3732
|
+
},
|
|
3733
|
+
language: o,
|
|
3734
|
+
logger: we,
|
|
3735
|
+
dispatcher: ld,
|
|
3736
|
+
chatParams: { customApiHost: i.customApiHost, customWebSocketHost: i.customWebSocketHost },
|
|
3737
|
+
...i
|
|
3738
|
+
},
|
|
3739
|
+
/* @__PURE__ */ r.createElement(
|
|
3740
|
+
bs,
|
|
3741
|
+
{
|
|
3742
|
+
ref: l,
|
|
3743
|
+
userSessionInfo: s,
|
|
3744
|
+
forceCreateChannel: (d = i.agentPreviewConfigs) == null ? void 0 : d.forceCreateChannel
|
|
3745
|
+
},
|
|
3746
|
+
/* @__PURE__ */ r.createElement(Na, { ...i._UNSAFE_INTERNAL_dashboardTester }, a, /* @__PURE__ */ r.createElement("div", { id: Q.MODAL_ROOT }))
|
|
3747
|
+
)
|
|
3748
|
+
)
|
|
3749
|
+
));
|
|
3750
|
+
}), we = new Tn(En.WARN), ld = new _n(we), ar = ({ children: e, isOpened: t }) => {
|
|
3751
|
+
const { dir: n, rootElement: o } = B(), s = pe(o, !0);
|
|
3752
|
+
return L(() => {
|
|
3753
|
+
const a = "sb-agent-block-scroll";
|
|
3754
|
+
return t ? s.body.classList.add(a) : s.body.classList.remove(a), () => {
|
|
3755
|
+
s.body.classList.remove(a);
|
|
3756
|
+
};
|
|
3757
|
+
}, [s, t]), /* @__PURE__ */ r.createElement(cd, { dir: n, $visible: t }, e);
|
|
3758
|
+
}, cd = u.div`width:100%;height:100%;position:fixed;top:0;left:0;z-index:${fe.WINDOW};visibility:${({ $visible: e }) => e ? "visible" : "hidden"};`, dd = 48, ud = 2 / 3;
|
|
3759
|
+
function md({
|
|
3760
|
+
className: e,
|
|
3761
|
+
isOpened: t,
|
|
3762
|
+
onClick: n,
|
|
3763
|
+
type: o,
|
|
3764
|
+
imageUrl: s,
|
|
3765
|
+
dir: a,
|
|
3766
|
+
animated: i = !0,
|
|
3767
|
+
backgroundColor: l,
|
|
3768
|
+
size: c = dd
|
|
3769
|
+
}) {
|
|
3770
|
+
const d = pt(l), g = Math.round(c * ud);
|
|
3771
|
+
return /* @__PURE__ */ r.createElement(
|
|
3772
|
+
pd,
|
|
3773
|
+
{
|
|
3774
|
+
dir: a,
|
|
3775
|
+
id: Q.LAUNCHER,
|
|
3776
|
+
className: e,
|
|
3777
|
+
"aria-label": "Sendbird AIAgent Launcher",
|
|
3778
|
+
onClick: n,
|
|
3779
|
+
$animated: i,
|
|
3780
|
+
$backgroundColor: l,
|
|
3781
|
+
$size: c
|
|
3782
|
+
},
|
|
3783
|
+
/* @__PURE__ */ r.createElement(fd, { $isOpened: t, $animated: i, $fillColor: d, $iconSize: g }, /* @__PURE__ */ r.createElement(fn.Open, { url: s, isDefaultIcon: o === "default_icon" })),
|
|
3784
|
+
/* @__PURE__ */ r.createElement(bd, { $isOpened: t, $animated: i, $fillColor: d, $iconSize: g }, /* @__PURE__ */ r.createElement(fn.Close, { size: g }))
|
|
3785
|
+
);
|
|
3786
|
+
}
|
|
3787
|
+
const gd = I`&:hover{transition:transform 250ms cubic-bezier(0.33,0,0,1);transform:scale(1.1);}&:active{transform:scale(0.8);}`, hd = I`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:${({ $iconSize: e }) => e}px;height:${({ $iconSize: e }) => e}px;filter:${({ $fillColor: e }) => e === $n.WHITE ? "grayscale(100%) brightness(2000%)" : "grayscale(100%) invert(100%) saturate(0%) brightness(0%) contrast(1000%)"};}}`, lr = I`svg{width:${({ $iconSize: e }) => e}px;height:${({ $iconSize: e }) => e}px;${({ $fillColor: e }) => I`
|
|
3788
|
+
path {
|
|
3789
|
+
fill: ${e};
|
|
3790
|
+
}
|
|
3791
|
+
[class*='fill'] {
|
|
3792
|
+
fill: ${e};
|
|
3793
|
+
}
|
|
3794
|
+
`}
|
|
3795
|
+
}
|
|
3796
|
+
`, pd = u.button`position:relative;padding:0;width:${({ $size: e }) => e}px;height:${({ $size: e }) => e}px;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 && gd}`, cr = u.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;`, fd = u(cr)`opacity:${({ $isOpened: e }) => e ? 0 : 1};transform:${({ $animated: e, $isOpened: t }) => e && (t ? "rotate(-90deg) scale(0)" : "rotate(0deg)")};${hd}${lr}`, bd = u(cr)`scale:${({ $isOpened: e }) => e ? 1 : 0};transform:${({ $animated: e, $isOpened: t }) => e && (t ? "rotate(0deg)" : "rotate(-90deg)")};${lr}`, fn = {
|
|
3797
|
+
Open: (e) => e.url ? /* @__PURE__ */ r.createElement("img", { src: e.url, alt: "launcher-img", "data-default-icon": e.isDefaultIcon }) : /* @__PURE__ */ r.createElement(kt, null),
|
|
3798
|
+
Close: ({ size: e }) => /* @__PURE__ */ r.createElement(M, { size: e, type: "chevron-down" })
|
|
3799
|
+
};
|
|
3800
|
+
function dr({ className: e, size: t }) {
|
|
3801
|
+
const { colors: n } = xt(), { dir: o, state: s } = B(), { launcherInfo: a } = U();
|
|
3802
|
+
return xd(), /* @__PURE__ */ r.createElement(
|
|
3803
|
+
md,
|
|
3804
|
+
{
|
|
3805
|
+
dir: o,
|
|
3806
|
+
className: e,
|
|
3807
|
+
isOpened: s.opened,
|
|
3808
|
+
onClick: () => s.setOpened(!s.opened),
|
|
3809
|
+
type: a.type,
|
|
3810
|
+
imageUrl: a.imageUrl,
|
|
3811
|
+
backgroundColor: n.base.primary,
|
|
3812
|
+
size: t
|
|
3813
|
+
}
|
|
3814
|
+
);
|
|
3815
|
+
}
|
|
3816
|
+
const Ed = 1e3 * 60;
|
|
3817
|
+
function xd() {
|
|
3818
|
+
const { chatSDK: e, state: t, logger: n, enableAutoDisconnectInLauncher: o } = B(), s = N(null);
|
|
3819
|
+
L(() => {
|
|
3820
|
+
if (!o) return;
|
|
3821
|
+
function a() {
|
|
3822
|
+
s.current && (clearTimeout(s.current), s.current = null);
|
|
3823
|
+
}
|
|
3824
|
+
function i() {
|
|
3825
|
+
e.connectionState === Ar.CLOSED && (e.reconnect(), n.debug("useSDKInactivityTimeout: reconnected")), a(), n.debug("useSDKInactivityTimeout: clear disconnect schedule");
|
|
3826
|
+
}
|
|
3827
|
+
function l() {
|
|
3828
|
+
a(), s.current = setTimeout(async () => {
|
|
3829
|
+
await e.disconnectWebSocket(), n.debug("useSDKInactivityTimeout: disconnected");
|
|
3830
|
+
}, Ed);
|
|
3831
|
+
}
|
|
3832
|
+
t.opened ? i() : (l(), n.debug("useSDKInactivityTimeout: schedule disconnect"));
|
|
3833
|
+
}, [o, e, t.opened]);
|
|
3834
|
+
}
|
|
3835
|
+
const ur = ve(null);
|
|
3836
|
+
function Cd() {
|
|
3837
|
+
const e = X(ur);
|
|
3838
|
+
if (!e)
|
|
3839
|
+
throw new Error("useNavigator() must be used within <Navigator />");
|
|
3840
|
+
return e;
|
|
3841
|
+
}
|
|
3842
|
+
function mr({ children: e }) {
|
|
3843
|
+
const t = Cd();
|
|
3844
|
+
return typeof e == "function" ? e(t) : /* @__PURE__ */ r.createElement(r.Fragment, null, e);
|
|
3845
|
+
}
|
|
3846
|
+
const vd = xn`0%{transform:translateY(40px);opacity:0;}100%{transform:translateY(0px);opacity:1;}`, yd = xn`0%{transform:translateY(0px);opacity:1;}100%{transform:translateY(40px);opacity:0;}`, _d = I`animation-name:${vd};animation-duration:0.3s;animation-fill-mode:forwards;`, Sd = I``, Td = I`animation-name:${yd};animation-duration:0.3s;animation-fill-mode:forwards;`, wd = I`visibility:hidden;`, Ad = u.div`position:absolute;top:0;left:0;width:100%;height:100%;${({ $transitionState: e }) => {
|
|
3847
|
+
switch (e) {
|
|
3848
|
+
case "entering":
|
|
3849
|
+
return _d;
|
|
3850
|
+
case "entered":
|
|
3851
|
+
return Sd;
|
|
3852
|
+
case "exiting":
|
|
3853
|
+
return Td;
|
|
3854
|
+
case "exited":
|
|
3855
|
+
return wd;
|
|
3856
|
+
default:
|
|
3857
|
+
return "";
|
|
3858
|
+
}
|
|
3859
|
+
}}${({ $active: e }) => e ? I`
|
|
3860
|
+
z-index: 999;
|
|
3861
|
+
` : I`z-index:1;pointer-events:none;`}
|
|
3862
|
+
`;
|
|
3863
|
+
function Ae({ initialId: e, children: t }) {
|
|
3864
|
+
const n = R((m, C) => {
|
|
3865
|
+
c((v) => [...v, m]), g((v) => ({ ...v, [m]: !0 })), C != null && C.reset && b((v) => ({
|
|
3866
|
+
...v,
|
|
3867
|
+
[m]: (v[m] || 0) + 1
|
|
3868
|
+
})), f((v) => ({
|
|
3869
|
+
...v,
|
|
3870
|
+
[m]: "entering"
|
|
3871
|
+
})), setTimeout(() => {
|
|
3872
|
+
f((v) => ({
|
|
3873
|
+
...v,
|
|
3874
|
+
[m]: "entered"
|
|
3875
|
+
}));
|
|
3876
|
+
}, 300);
|
|
3877
|
+
}, []), o = R(() => {
|
|
3878
|
+
c((m) => {
|
|
3879
|
+
if (m.length <= 1) return m;
|
|
3880
|
+
const C = m[m.length - 1];
|
|
3881
|
+
return f((v) => ({
|
|
3882
|
+
...v,
|
|
3883
|
+
[C]: "exiting"
|
|
3884
|
+
})), setTimeout(() => {
|
|
3885
|
+
f((v) => ({
|
|
3886
|
+
...v,
|
|
3887
|
+
[C]: "exited"
|
|
3888
|
+
})), c((v) => v.slice(0, -1));
|
|
3889
|
+
}, 300), m;
|
|
3890
|
+
});
|
|
3891
|
+
}, []), s = ae(() => ({
|
|
3892
|
+
navigation: {
|
|
3893
|
+
navigate: n,
|
|
3894
|
+
pop: o
|
|
3895
|
+
}
|
|
3896
|
+
}), [n, o]), a = ae(() => vr.toArray(t).filter(
|
|
3897
|
+
(m) => m.type === mr
|
|
3898
|
+
), [t]), i = ae(() => {
|
|
3899
|
+
const m = {};
|
|
3900
|
+
return a.forEach((C) => {
|
|
3901
|
+
const { id: v, lazy: S, children: k } = C.props;
|
|
3902
|
+
m[v] = { lazy: S, element: typeof k == "function" ? k(s) : k };
|
|
3903
|
+
}), m;
|
|
3904
|
+
}, [a]), [l, c] = _([e]), [d, g] = _(() => {
|
|
3905
|
+
const m = {};
|
|
3906
|
+
return Object.entries(i).forEach(([C, { lazy: v }]) => {
|
|
3907
|
+
v === !1 && (m[C] = !0);
|
|
3908
|
+
}), m[e] = !0, m;
|
|
3909
|
+
}), [h, f] = _(() => {
|
|
3910
|
+
const m = {};
|
|
3911
|
+
return Object.keys(i).forEach((C) => {
|
|
3912
|
+
C === e ? m[C] = "entered" : m[C] = "exited";
|
|
3913
|
+
}), m;
|
|
3914
|
+
}), [x, b] = _({}), E = l[l.length - 1];
|
|
3915
|
+
return /* @__PURE__ */ r.createElement(ur.Provider, { value: s }, /* @__PURE__ */ r.createElement(kd, null, Object.keys(i).map((m) => {
|
|
3916
|
+
var k;
|
|
3917
|
+
if (!d[m]) return null;
|
|
3918
|
+
const C = h[m] || "exited", v = m === E, S = `${m}-${x[m] || 0}`;
|
|
3919
|
+
return /* @__PURE__ */ r.createElement(Ad, { key: S, $transitionState: C, $active: v }, (k = i[m]) == null ? void 0 : k.element);
|
|
3920
|
+
})));
|
|
3921
|
+
}
|
|
3922
|
+
const kd = u.div`position:relative;width:100%;height:100%;`;
|
|
3923
|
+
Ae.Screen = mr;
|
|
3924
|
+
const he = {
|
|
3925
|
+
activeConv: "active-conv",
|
|
3926
|
+
closedConv: "closed-conv",
|
|
3927
|
+
convList: "conv-list"
|
|
3928
|
+
}, gr = ({ setClosedChannelUrl: e, closedChannelUrl: t }) => /* @__PURE__ */ r.createElement(Ae, { initialId: he.activeConv }, /* @__PURE__ */ r.createElement(Ae.Screen, { id: he.activeConv }, ({ navigation: n }) => /* @__PURE__ */ r.createElement(pn, { onNavigateToConversationList: () => n.navigate(he.convList, { reset: !0 }) })), /* @__PURE__ */ r.createElement(Ae.Screen, { id: he.closedConv }, ({ navigation: n }) => /* @__PURE__ */ r.createElement(
|
|
3929
|
+
pn,
|
|
3930
|
+
{
|
|
3931
|
+
onNavigateToConversationList: () => n.pop(),
|
|
3932
|
+
closedChannelUrl: t,
|
|
3933
|
+
onClearClosedChannelUrl: () => e(void 0)
|
|
3934
|
+
}
|
|
3935
|
+
)), /* @__PURE__ */ r.createElement(Ae.Screen, { id: he.convList, lazy: !0 }, ({ navigation: n }) => /* @__PURE__ */ r.createElement(
|
|
3936
|
+
Qc,
|
|
3937
|
+
{
|
|
3938
|
+
onOpenConversationView: (o, s) => {
|
|
3939
|
+
s === "closed" ? (e(o), n.navigate(he.closedConv, { reset: !0 })) : n.navigate(he.activeConv);
|
|
3940
|
+
}
|
|
3941
|
+
}
|
|
3942
|
+
)));
|
|
3943
|
+
function Id({ isExpanded: e, isOpened: t, children: n, launcher: o }) {
|
|
3944
|
+
const { dir: s } = B();
|
|
3945
|
+
return /* @__PURE__ */ r.createElement($d, null, /* @__PURE__ */ r.createElement(Md, { dir: s, id: Q.WINDOW, $isExpanded: e, $isOpened: t }, n), o);
|
|
3946
|
+
}
|
|
3947
|
+
const $d = u.div`display:flex;flex-direction:column;gap:8px;align-items:flex-end;`, Md = u.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 && Ld};${({ $isExpanded: e }) => e && Od};`, Od = I`width:743px;height:723px;`, Ld = I`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;`, au = ye(function({ children: e, ...t }, n) {
|
|
3948
|
+
const o = Oe(), [s, a] = _(), i = o ? ar : Id;
|
|
3949
|
+
return /* @__PURE__ */ r.createElement(ir, { enableExpandButton: !o, ref: n, ...t }, /* @__PURE__ */ r.createElement(In, null, ({ state: l }) => /* @__PURE__ */ r.createElement(r.Fragment, null, /* @__PURE__ */ r.createElement(i, { isExpanded: l.expanded, isOpened: l.opened, launcher: /* @__PURE__ */ r.createElement(dr, null) }, /* @__PURE__ */ r.createElement(
|
|
3950
|
+
gr,
|
|
3951
|
+
{
|
|
3952
|
+
closedChannelUrl: s,
|
|
3953
|
+
setClosedChannelUrl: a
|
|
3954
|
+
}
|
|
3955
|
+
)), e)));
|
|
3956
|
+
}), {
|
|
3957
|
+
Provider: Rd,
|
|
3958
|
+
useContext: Bt
|
|
3959
|
+
} = G("FixedMessengerStyle");
|
|
3960
|
+
function hr(e, t, n, o = 0) {
|
|
3961
|
+
const { top: s, bottom: a, start: i, end: l } = n;
|
|
3962
|
+
let c = "", d = "";
|
|
3963
|
+
switch (e) {
|
|
3964
|
+
case "start":
|
|
3965
|
+
d = `inset-inline-start: ${j(i)}`;
|
|
3966
|
+
break;
|
|
3967
|
+
case "end":
|
|
3968
|
+
d = `inset-inline-end: ${j(l)}`;
|
|
3969
|
+
break;
|
|
3970
|
+
}
|
|
3971
|
+
switch (t) {
|
|
3972
|
+
case "top":
|
|
3973
|
+
c = `top: calc(${j(s)} + ${o}px)`;
|
|
3974
|
+
break;
|
|
3975
|
+
case "bottom":
|
|
3976
|
+
c = `bottom: calc(${j(a)} + ${o}px)`;
|
|
3977
|
+
break;
|
|
3978
|
+
}
|
|
3979
|
+
return I`${c};${d};`;
|
|
3980
|
+
}
|
|
3981
|
+
function Dd(e) {
|
|
3982
|
+
const { horizontal: t, vertical: n, margin: o, launcherSize: s } = Bt();
|
|
3983
|
+
return /* @__PURE__ */ r.createElement(Nd, { ...e, size: s, $horizontal: t, $vertical: n, $margin: o });
|
|
3984
|
+
}
|
|
3985
|
+
const Nd = u(dr)`position:fixed;z-index:${fe.LAUNCHER};${({ $horizontal: e, $vertical: t, $margin: n }) => hr(e, t, n)};`;
|
|
3986
|
+
function Pd({ isExpanded: e, isOpened: t, children: n }) {
|
|
3987
|
+
const { dir: o } = B(), { horizontal: s, vertical: a, margin: i, launcherSize: l } = Bt();
|
|
3988
|
+
return /* @__PURE__ */ r.createElement(
|
|
3989
|
+
Bd,
|
|
3990
|
+
{
|
|
3991
|
+
dir: o,
|
|
3992
|
+
id: Q.WINDOW,
|
|
3993
|
+
$isExpanded: e,
|
|
3994
|
+
$isOpened: t,
|
|
3995
|
+
$horizontal: s,
|
|
3996
|
+
$vertical: a,
|
|
3997
|
+
$margin: i,
|
|
3998
|
+
$launcherSize: l
|
|
3999
|
+
},
|
|
4000
|
+
n
|
|
4001
|
+
);
|
|
4002
|
+
}
|
|
4003
|
+
const Bd = u.div`background:${({ theme: e }) => e.colors.base.background};display:flex;overscroll-behavior:none;-webkit-overflow-scrolling:auto;position:fixed;${({ $horizontal: e, $vertical: t, $margin: n, $launcherSize: o }) => hr(e, t, n, o + 12)};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:${({ $horizontal: e, $vertical: t }) => `${e === "start" ? "left" : "right"} ${t}`};
|
|
4004
|
+
[dir='rtl'] &:not([dir='ltr']),
|
|
4005
|
+
&[dir='rtl'] {
|
|
4006
|
+
transform-origin: ${({ $horizontal: e, $vertical: t }) => `${e === "start" ? "right" : "left"} ${t}`};
|
|
4007
|
+
}
|
|
4008
|
+
|
|
4009
|
+
${({ $isOpened: e }) => e && Ud};
|
|
4010
|
+
${({ $isExpanded: e }) => e && Fd};
|
|
4011
|
+
`, Fd = I`width:743px;height:723px;`, Ud = I`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;`, pr = { top: 24, bottom: 24, start: 24, end: 24 }, Hd = ye(function({ children: e, ...t }, n) {
|
|
4012
|
+
const [o, s] = _(), [a, i] = _("end-bottom"), [l, c] = _(pr), [d, g] = _(48), h = Oe(), f = h ? ar : Pd, { horizontal: x, vertical: b } = ae(() => {
|
|
4013
|
+
const [E, m] = a.split("-");
|
|
4014
|
+
return { horizontal: E === "start" ? "start" : "end", vertical: m === "top" ? "top" : "bottom" };
|
|
4015
|
+
}, [a]);
|
|
4016
|
+
return /* @__PURE__ */ r.createElement(ir, { enableExpandButton: !h, ref: n, ...t }, /* @__PURE__ */ r.createElement(In, null, ({ state: E }) => /* @__PURE__ */ r.createElement(
|
|
4017
|
+
Rd,
|
|
4018
|
+
{
|
|
4019
|
+
value: { horizontal: x, vertical: b, margin: l, launcherSize: d, setPosition: i, setMargin: c, setLauncherSize: g }
|
|
4020
|
+
},
|
|
4021
|
+
/* @__PURE__ */ r.createElement(f, { isExpanded: E.expanded, isOpened: E.opened }, /* @__PURE__ */ r.createElement(
|
|
4022
|
+
gr,
|
|
4023
|
+
{
|
|
4024
|
+
closedChannelUrl: o,
|
|
4025
|
+
setClosedChannelUrl: s
|
|
4026
|
+
}
|
|
4027
|
+
)),
|
|
4028
|
+
/* @__PURE__ */ r.createElement(Dd, null),
|
|
4029
|
+
e
|
|
4030
|
+
)));
|
|
4031
|
+
}), zd = (e) => {
|
|
4032
|
+
var s, a, i, l;
|
|
4033
|
+
const { setPosition: t, setMargin: n, setLauncherSize: o } = Bt();
|
|
4034
|
+
return le(() => {
|
|
4035
|
+
e.position && t(e.position), e.margin && n({ ...pr, ...e.margin }), e.launcherSize && o(e.launcherSize);
|
|
4036
|
+
}, [
|
|
4037
|
+
e.position,
|
|
4038
|
+
(s = e.margin) == null ? void 0 : s.top,
|
|
4039
|
+
(a = e.margin) == null ? void 0 : a.bottom,
|
|
4040
|
+
(i = e.margin) == null ? void 0 : i.start,
|
|
4041
|
+
(l = e.margin) == null ? void 0 : l.end,
|
|
4042
|
+
e.launcherSize
|
|
4043
|
+
]), null;
|
|
4044
|
+
}, lu = Object.assign(Hd, {
|
|
4045
|
+
Style: zd
|
|
4046
|
+
});
|
|
4047
|
+
export {
|
|
4048
|
+
St as A,
|
|
4049
|
+
ro as C,
|
|
4050
|
+
au as D,
|
|
4051
|
+
lu as F,
|
|
4052
|
+
M as I,
|
|
4053
|
+
Hn as L,
|
|
4054
|
+
La as M,
|
|
4055
|
+
Ot as O,
|
|
4056
|
+
su as P,
|
|
4057
|
+
Lt as S,
|
|
4058
|
+
w as a,
|
|
4059
|
+
ir as b,
|
|
4060
|
+
p as c,
|
|
4061
|
+
ad as d,
|
|
4062
|
+
U as e,
|
|
4063
|
+
O as f,
|
|
4064
|
+
md as g,
|
|
4065
|
+
xe as h,
|
|
4066
|
+
J as i,
|
|
4067
|
+
sr as j,
|
|
4068
|
+
pn as k,
|
|
4069
|
+
Nt as l,
|
|
4070
|
+
ld as m,
|
|
4071
|
+
ou as n,
|
|
4072
|
+
nl as o,
|
|
4073
|
+
Z as p,
|
|
4074
|
+
Qc as q,
|
|
4075
|
+
Pt as r,
|
|
4076
|
+
iu as s,
|
|
4077
|
+
Pc as t,
|
|
4078
|
+
B as u,
|
|
4079
|
+
or as v,
|
|
4080
|
+
Sn as w,
|
|
4081
|
+
Io as x,
|
|
4082
|
+
Zt as y
|
|
4083
|
+
};
|