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