@epam/ai-dial-conversation-messages 1.1.0-dev.99 → 1.2.0-dev.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/index.js CHANGED
@@ -1,861 +1,338 @@
1
- import { AttachmentErrorReason as e, AttachmentType as t, CopyIconButton as n, DeploymentIcon as r, MDMessageViewer as i, MIME_TYPE_EXT_MAP as a, MessageRating as o, MessageRole as s, RequestStatus as c, ResponseFormat as l, buildCssVars as u, mergeClasses as d, useCollapsedText as f } from "@epam/ai-dial-chat-shared";
2
- import { DIAL_ICON_SIZE as p, DialInput as m, DialPopup as h, DialRadioGroup as g, DialSkeleton as _, DialSkeletonVariant as v, DialSlider as y, DialSpinner as b, DialTag as x, DialTooltip as S, ElementSize as C, GhostIconButton as w, Highlight as T, InfoMessageNotification as E, LinkButton as D, NeutralButton as O, PopupSize as k, PrimaryButton as A, RadioGroupOrientation as j } from "@epam/ai-dial-ui-kit";
3
- import { IconChevronDown as M, IconChevronUp as N, IconClipboard as P, IconDownload as F, IconExternalLink as I, IconFile as L, IconFileTypeBmp as R, IconFileTypeCss as z, IconFileTypeCsv as B, IconFileTypeDoc as V, IconFileTypeDocx as H, IconFileTypeHtml as U, IconFileTypeJpg as W, IconFileTypeJs as ee, IconFileTypeJsx as te, IconFileTypePdf as ne, IconFileTypePhp as re, IconFileTypePng as ie, IconFileTypePpt as ae, IconFileTypeRs as oe, IconFileTypeSql as se, IconFileTypeSvg as ce, IconFileTypeTs as le, IconFileTypeTsx as ue, IconFileTypeTxt as de, IconFileTypeVue as fe, IconFileTypeXls as pe, IconFileTypeXml as me, IconFileTypeZip as he, IconMusic as ge, IconPaperclip as _e, IconPencilMinus as ve, IconPhoto as G, IconRefresh as ye, IconReload as be, IconTerminal2 as xe, IconThumbDown as Se, IconThumbUp as Ce, IconTrashX as we, IconVideo as Te, IconX as Ee } from "@tabler/icons-react";
4
- import "react-dom";
5
- import { memo as De, useCallback as K, useEffect as Oe, useId as ke, useMemo as Ae, useRef as je, useState as q } from "react";
6
- import { Fragment as J, jsx as Y, jsxs as X } from "react/jsx-runtime";
7
- //#region ../attachment-input/dist/index.js
8
- var Me = (e) => {
9
- if (e == null) return "";
10
- let t = e.lastIndexOf(".");
11
- return t > 0 ? e.slice(0, t) : e;
12
- }, Ne = (e) => {
13
- if (!e) return L;
14
- if (e.startsWith("image/")) switch (e) {
15
- case "image/jpeg":
16
- case "image/jpg": return W;
17
- case "image/png": return ie;
18
- case "image/svg+xml": return ce;
19
- case "image/bmp": return R;
20
- default: return G;
21
- }
22
- if (e.startsWith("video/")) return Te;
23
- if (e.startsWith("audio/")) return ge;
24
- switch (e) {
25
- case "application/pdf": return ne;
26
- case "application/msword":
27
- case "application/vnd.ms-word": return V;
28
- case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return H;
29
- case "application/vnd.ms-powerpoint": return ae;
30
- case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return ae;
31
- case "application/vnd.ms-excel": return pe;
32
- case "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": return pe;
33
- case "application/zip":
34
- case "application/x-zip-compressed":
35
- case "application/x-rar-compressed":
36
- case "application/x-7z-compressed":
37
- case "application/gzip":
38
- case "application/x-tar": return he;
39
- case "text/csv": return B;
40
- case "text/plain": return de;
41
- case "text/html":
42
- case "application/xhtml+xml": return U;
43
- case "text/xml":
44
- case "application/xml": return me;
45
- case "application/sql":
46
- case "text/x-sql": return se;
47
- case "text/javascript":
48
- case "application/javascript": return ee;
49
- case "text/jsx": return te;
50
- case "application/typescript":
51
- case "text/typescript": return le;
52
- case "text/tsx": return ue;
53
- case "text/css": return z;
54
- case "text/x-php":
55
- case "application/x-php": return re;
56
- case "text/x-rustsrc":
57
- case "application/x-rust": return oe;
58
- case "text/x-vue": return fe;
59
- default: return L;
60
- }
61
- }, Pe = (e) => {
62
- let { type: n, contentType: r } = e;
63
- return n === t.Prompt ? xe : n === t.Pasted ? P : n === t.Image ? G : Ne(r ?? "");
64
- }, Fe = (e) => {
65
- let t = e.toLowerCase().split(";")[0].trim(), n = a[t];
66
- if (n) return n;
67
- let r = t.split("/")[1];
68
- if (r && !r.startsWith("vnd.") && !r.includes("+")) return r;
69
- }, Ie = (e, n) => {
70
- let { type: r, name: i, contentType: a } = e;
71
- if (r === t.Prompt) return n.promptLabel ?? "Prompt";
72
- if (r === t.Pasted) return n.pastedLabel ?? "Pasted";
73
- if (r === t.Image) return n.imageLabel ?? "Image";
74
- if (a) {
75
- let e = Fe(a);
76
- if (e) return `.${e}`;
77
- }
78
- let o = i.lastIndexOf(".");
79
- return o > 0 && o < i.length - 1 ? `.${i.slice(o + 1).toLowerCase()}` : i;
80
- }, Le = (e, n = {}) => {
81
- let { type: r, status: i, previewUrl: a, url: o } = e, s = i === c.Loading, l = i === c.Error, u = r === t.Image && !!(a ?? o) && !l, d = r === t.Audio && !l, f = r === t.Link && !l;
82
- return {
83
- isLoading: s,
84
- isError: l,
85
- isImage: u,
86
- isAudio: d,
87
- isLink: f,
88
- BottomIcon: f ? null : Pe(e),
89
- typeLabel: f ? null : Ie(e, n)
1
+ import { AttachmentType as e, CopyIconButton as t, DeploymentIcon as n, MDMessageViewer as r, MessageRating as i, MessageRole as a, buildCssVars as o, mergeClasses as s, useCollapsedText as c } from "@epam/ai-dial-chat-shared";
2
+ import { AttachmentGroup as l } from "@epam/ai-dial-attachment-input";
3
+ import { DIAL_ICON_SIZE as u, DIAL_KIT_ICON_STROKE as d, ElementSize as f, InfoMessageNotification as p, LinkButton as m, NeutralButton as h, ToggleIconButton as g } from "@epam/ai-dial-ui-kit";
4
+ import { useCallback as _, useEffect as v, useId as y, useRef as b, useState as x } from "react";
5
+ import { IconChevronDown as S, IconChevronUp as C, IconMarkdown as w, IconPencilMinus as T, IconRefresh as E, IconThumbDown as D, IconThumbDownFilled as O, IconThumbUp as k, IconThumbUpFilled as A, IconTrashX as j } from "@tabler/icons-react";
6
+ import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
7
+ //#region src/hooks/useInlineStartIndent/useInlineStartIndent.ts
8
+ var F = 4, I = (e) => {
9
+ let t = b(null), [n, r] = x(0);
10
+ return v(() => {
11
+ if (!e) return;
12
+ let n = t.current;
13
+ if (n == null) return;
14
+ let i = new ResizeObserver((e) => {
15
+ let t = e[0];
16
+ t != null && r(t.contentRect.width);
17
+ });
18
+ return i.observe(n), () => i.disconnect();
19
+ }, [e]), {
20
+ slotRef: t,
21
+ firstLineIndent: e ? `calc(${n}px + ${F}px)` : void 0
90
22
  };
91
- }, Z = {
92
- tile: "_tile_1x4ax_1",
93
- hovered: "_hovered_1x4ax_5",
94
- selected: "_selected_1x4ax_12",
95
- tileError: "_tileError_1x4ax_17",
96
- nameText: "_nameText_1x4ax_22",
97
- typeText: "_typeText_1x4ax_26",
98
- retryIcon: "_retryIcon_1x4ax_30",
99
- track: "_track_1x4ax_34",
100
- imageActionButton: "_imageActionButton_1x4ax_38"
101
- }, Q = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: a, className: o }) => /* @__PURE__ */ Y(w, {
102
- icon: a,
103
- size: C.Small,
104
- className: d("absolute end-1 top-1 opacity-0 focus-visible:opacity-100 group-focus-within/attachment-tile:opacity-100 group-hover/attachment-tile:opacity-100", o),
105
- "aria-label": e,
106
- "aria-describedby": t ? n : void 0,
107
- onClick: (e) => {
108
- e.stopPropagation(), r(i);
109
- }
110
- }), Re = ({ ...e }) => /* @__PURE__ */ Y(Q, {
111
- icon: /* @__PURE__ */ Y(be, {
112
- size: p.SM,
113
- "aria-hidden": !0
114
- }),
115
- className: Z.retryIcon,
116
- ...e
117
- }), ze = ({ ...e }) => /* @__PURE__ */ Y(Q, {
118
- icon: /* @__PURE__ */ Y(F, {
119
- size: p.SM,
120
- "aria-hidden": !0
121
- }),
122
- ...e
123
- }), Be = ({ ...e }) => /* @__PURE__ */ Y(Q, {
124
- icon: /* @__PURE__ */ Y(I, {
125
- size: p.SM,
126
- "aria-hidden": !0
127
- }),
128
- ...e
129
- }), Ve = ({ ...e }) => /* @__PURE__ */ Y(Q, {
130
- icon: /* @__PURE__ */ Y(Ee, {
131
- size: p.SM,
132
- "aria-hidden": !0
133
- }),
134
- className: Z.hoverIcon,
135
- ...e
136
- }), He = ({ attachment: e, searchQuery: t = "", onClick: n, onDownload: r, onRemove: i, labels: a, styles: o, cssVars: s, isSelected: c }) => {
137
- let { clickLabel: l = "Open attachment", downloadLabel: u = "Download attachment", removeLabel: f = "Remove attachment" } = a ?? {}, { typography: p, className: m } = o ?? {}, h = () => {
138
- n?.(e.id);
139
- };
140
- return /* @__PURE__ */ X("div", {
141
- style: s,
142
- ...n == null ? {} : {
143
- role: "button",
144
- tabIndex: 0,
145
- "aria-label": l,
146
- onClick: h,
147
- onKeyDown: (e) => {
148
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), h());
149
- }
150
- },
151
- className: d("group/attachment-tile relative flex w-full min-w-[280px] max-w-[300px] flex-col gap-2 rounded-xl border p-3", n && "cursor-pointer", (r || i) && "pe-8", c && Z.selected, m),
152
- children: [
153
- /* @__PURE__ */ Y("span", {
154
- title: e.name,
155
- className: d(p?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate", Z.nameText),
156
- children: t ? /* @__PURE__ */ Y(T, {
157
- text: e.name,
158
- query: t,
159
- maxLines: 1
160
- }) : e.name
161
- }),
162
- e.playUrl && /* @__PURE__ */ Y("audio", {
163
- controls: !0,
164
- src: e.playUrl,
165
- "aria-label": e.name,
166
- className: "w-full",
167
- preload: "metadata",
168
- onClick: (e) => e.stopPropagation()
169
- }),
170
- r && /* @__PURE__ */ Y(ze, {
171
- ariaLabel: u,
172
- onClick: r,
173
- id: e.id
174
- }),
175
- i && /* @__PURE__ */ Y(Ve, {
176
- ariaLabel: f,
177
- onClick: i,
178
- id: e.id
179
- })
180
- ]
181
- });
182
- }, Ue = "flex size-[84px] items-center justify-center rounded-xl border", We = {
183
- [e.Network]: "Upload failed · network error",
184
- [e.UnsupportedType]: "Upload failed · unsupported file type"
185
- }, Ge = ({ attachment: n, onClick: r, onRetry: i, labels: a, styles: o, onDownload: s, isPasted: l, isLink: u, cssVars: f, onExpand: p, isExpandable: m, onRemove: h, isSelected: g }) => {
186
- let { clickLabel: _ = "Download attachment", retryLabel: v = "Retry upload", sizeLabel: y, uploadingLabel: x = "Uploading", errorReasonLabels: S, genericErrorLabel: C = "Upload failed" } = a ?? {}, { typography: w, className: T } = o ?? {}, { id: E, name: D, status: O, errorReason: k } = n, A = O === c.Loading, j = O === c.Error, M = ke(), N = j ? k && (S?.[k] ?? We[k]) || C : "", { BottomIcon: P, typeLabel: F } = Le(n), I = !j && !A && s && !u, L = j && !!i && k !== e.UnsupportedType, R = I || L ? "pe-5" : void 0, z = (e) => {
187
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), r?.(n.id));
188
- }, B = Ae(() => l ? D : Me(D), [l, D]), V = K(() => {
189
- window.open(n.referenceUrl, "_blank", "noopener,noreferrer");
190
- }, [n]), H = d(Ue, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", Z.tile, (n.type === t.Prompt || n.type === t.Pasted) && "hovered", g && Z.selected, j && Z.tileError), U = /* @__PURE__ */ Y("div", {
191
- title: B,
192
- className: d(w?.nameClassName ?? "dial-caption-text", "line-clamp-2 min-w-0 break-all", Z.nameText, !j && R),
193
- children: B
194
- }), W = P && /* @__PURE__ */ X("div", {
195
- className: d("flex w-full items-center gap-1", j && R),
196
- children: [/* @__PURE__ */ Y(P, {
197
- size: 16,
198
- className: Z.typeText,
199
- "aria-hidden": !0
200
- }), /* @__PURE__ */ Y("span", {
201
- className: d(w?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate", Z.typeText),
202
- children: y ? `${F} · ${y}` : F
203
- })]
204
- }), ee = () => {
205
- m && p ? p(E) : r && r(E);
206
- }, te = /* @__PURE__ */ X(J, { children: [
207
- j ? /* @__PURE__ */ X(J, { children: [W, U] }) : /* @__PURE__ */ X(J, { children: [U, W] }),
208
- A && /* @__PURE__ */ Y("div", {
209
- role: "progressbar",
210
- "aria-label": x,
211
- className: d("absolute inset-x-2 bottom-2 h-[3px] overflow-hidden rounded-full", Z.track),
212
- children: /* @__PURE__ */ Y(b, { size: 32 })
213
- }),
214
- I && /* @__PURE__ */ Y(ze, {
215
- ariaLabel: _,
216
- errorTitle: N,
217
- errorDescId: M,
218
- onClick: s,
219
- id: E
220
- }),
221
- L && /* @__PURE__ */ Y(Re, {
222
- ariaLabel: v,
223
- errorTitle: N,
224
- errorDescId: M,
225
- onClick: i,
226
- id: E
227
- }),
228
- u && /* @__PURE__ */ Y(Be, {
229
- ariaLabel: v,
230
- errorTitle: N,
231
- errorDescId: M,
232
- onClick: V
233
- }),
234
- h && /* @__PURE__ */ Y(Ve, {
235
- ariaLabel: v,
236
- errorTitle: N,
237
- errorDescId: M,
238
- onClick: h,
239
- id: E
240
- }),
241
- j && /* @__PURE__ */ Y("span", {
242
- id: M,
243
- role: "status",
244
- "aria-live": "polite",
245
- className: "sr-only",
246
- children: N
247
- })
248
- ] });
249
- return /* @__PURE__ */ Y("div", {
250
- style: f,
251
- className: d("inline-flex", T),
252
- children: /* @__PURE__ */ Y("div", {
253
- role: "button",
254
- tabIndex: 0,
255
- "aria-label": _,
256
- onClick: ee,
257
- onKeyDown: z,
258
- style: f,
259
- className: d(H, "cursor-pointer focus-within:outline focus-within:outline-1 focus-within:outline-offset-1"),
260
- children: te
261
- })
262
- });
263
- }, Ke = /* @__PURE__ */ function(e) {
264
- return e.Idle = "idle", e.Loading = "loading", e.Loaded = "loaded", e.Error = "error", e;
265
- }({}), qe = ({ enabled: e, src: t }) => {
266
- let n = je(null), [r, i] = q("idle");
267
- return Oe(() => {
268
- i(e && t ? "loading" : "idle");
269
- }, [e, t]), Oe(() => {
270
- let r = n.current;
271
- if (!r || !e || !t) return;
272
- let a = () => i("loaded"), o = () => i("error");
273
- return r.addEventListener("load", a), r.addEventListener("error", o), r.complete && i(r.naturalWidth > 0 ? "loaded" : "error"), () => {
274
- r.removeEventListener("load", a), r.removeEventListener("error", o);
275
- };
276
- }, [e, t]), {
277
- imageRef: n,
278
- imageLoadStatus: r
279
- };
280
- }, Je = ({ attachment: e, onExpand: n, onClick: r, labels: i, onRemove: a, cssVars: o, onDownload: s, styles: c, isSelected: l }) => {
281
- let { clickLabel: u = "Open attachment", expandLabel: f = "Expand pasted text" } = i ?? {}, { className: m } = c ?? {}, { id: h, name: g } = e, y = e.previewUrl ?? e.url, b = e.type === t.Pasted && n !== void 0, { isLoading: x, isError: S, isImage: C } = Ae(() => Le(e), [e]), w = r !== void 0 && !b && !x && !S, { imageRef: T, imageLoadStatus: E } = qe({
282
- enabled: C,
283
- src: y
284
- }), D = () => {
285
- b && n ? n(h) : w && r && r(h);
286
- };
287
- return /* @__PURE__ */ Y("div", {
288
- className: d(Ue, "group/attachment-tile", w && "cursor-pointer", Z.tile, l && Z.selected, m),
289
- onClick: D,
290
- onKeyDown: (e) => {
291
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), D());
292
- },
293
- tabIndex: 0,
294
- role: "button",
295
- style: o,
296
- "aria-label": w ? u : b ? f : void 0,
297
- children: /* @__PURE__ */ X("div", {
298
- className: "relative h-full w-full overflow-hidden",
299
- children: [
300
- a && /* @__PURE__ */ Y(Ve, {
301
- onClick: a,
302
- id: h,
303
- className: Z.imageActionButton
304
- }),
305
- s && /* @__PURE__ */ Y(ze, {
306
- onClick: s,
307
- id: h,
308
- className: Z.imageActionButton
309
- }),
310
- E !== Ke.Loaded && /* @__PURE__ */ Y(_, {
311
- variant: v.Rectangular,
312
- width: "100%",
313
- height: "100%",
314
- active: E === Ke.Loading,
315
- overlay: /* @__PURE__ */ Y(G, {
316
- size: p.LG,
317
- className: Z.typeText,
318
- "aria-hidden": !0
319
- }),
320
- className: "absolute inset-0 rounded-xl"
321
- }),
322
- /* @__PURE__ */ Y("img", {
323
- ref: T,
324
- src: y,
325
- alt: g,
326
- loading: "lazy",
327
- decoding: "async",
328
- className: d("h-full w-full rounded-xl object-cover transition-opacity duration-200", E === Ke.Loaded ? "opacity-100" : "opacity-0")
329
- })
330
- ]
331
- })
332
- });
333
- }, Ye = ({ attachment: e, searchQuery: n = "", onRemove: r, onRetry: i, onExpand: a, onClick: o, onDownload: s, labels: c, styles: l, isSelected: d }) => {
334
- let { colors: f } = l ?? {}, p = e.type === t.Pasted, m = p && a !== void 0, h = u({
335
- "--ai-tile-bg": f?.background,
336
- "--ai-tile-border": f?.border,
337
- "--ai-tile-bg-hover": f?.backgroundHover,
338
- "--ai-tile-border-hover": f?.borderHover,
339
- "--ai-tile-bg-selected": f?.backgroundSelected,
340
- "--ai-tile-border-selected": f?.borderSelected,
341
- "--ai-tile-focus-outline": f?.focusOutline,
342
- "--ai-tile-bg-error": f?.backgroundError,
343
- "--ai-tile-border-error": f?.borderError,
344
- "--ai-tile-error-text": f?.errorText,
345
- "--ai-tile-name-text": f?.nameText,
346
- "--ai-tile-type-text": f?.typeText,
347
- "--ai-tile-hover-icon-bg": f?.hoverIconBackground,
348
- "--ai-tile-hover-icon-color": f?.hoverIconColor,
349
- "--ai-tile-progress-track": f?.trackBackground,
350
- "--ai-tile-fill-bg": f?.fillBackground
351
- }), { isImage: g, isAudio: _, isLink: v } = Ae(() => Le(e), [e]);
352
- return _ ? /* @__PURE__ */ Y(He, {
353
- attachment: e,
354
- labels: c,
355
- onClick: o,
356
- onDownload: s,
357
- onRemove: r,
358
- searchQuery: n,
359
- styles: l,
360
- cssVars: h,
361
- isSelected: d
362
- }) : g ? /* @__PURE__ */ Y(Je, {
363
- attachment: e,
364
- labels: c,
365
- onClick: o,
366
- onExpand: a,
367
- styles: l,
368
- onRemove: r,
369
- cssVars: h,
370
- onDownload: s,
371
- isSelected: d
372
- }) : /* @__PURE__ */ Y(Ge, {
373
- attachment: e,
374
- onClick: o,
375
- onRetry: i,
376
- onRemove: r,
377
- onDownload: s,
378
- isLink: v,
379
- isPasted: p,
380
- styles: l,
381
- labels: c,
382
- onExpand: a,
383
- cssVars: h,
384
- isExpandable: m,
385
- isSelected: d
386
- });
387
- }, Xe = {
388
- headerIcon: "_headerIcon_1sgtq_1",
389
- headerLabel: "_headerLabel_1sgtq_2"
390
- }, Ze = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, Qe = ({ attachments: e, onAttachmentClick: n, onDownloadAll: r, onRetry: i, labels: a, styles: o, selectedAttachmentId: s }) => {
391
- let { ariaLabel: l = "Attachments", clickLabel: f = "Download attachment", retryLabel: m = "Retry upload", downloadAllLabel: h = "Download all", openInNewTabLabel: g, getHeaderLabel: _ = (e) => Ze(e, "attachment"), promptLabel: v, pastedLabel: y, imageLabel: b } = a ?? {}, { typography: x, colors: S, className: T } = o ?? {}, E = u({ "--ai-group-text": S?.text });
392
- if (e.length === 0) return null;
393
- let D = e.some((e) => e.type === t.Image), O = e.some((e) => e.type !== t.Image), k = D && O, A = e.length >= 5, j = k ? _e : D ? G : L, M = _(e.length), N = () => {
394
- let t = e.filter((e) => e.status === c.Idle);
395
- r ? r(t) : t.forEach((e) => n?.(e.id));
396
- }, P = (t) => {
397
- let n = e.find((e) => e.id === t);
398
- n && r?.([n]);
399
- };
400
- return /* @__PURE__ */ X("div", {
401
- role: "group",
402
- "aria-label": l,
403
- style: E,
404
- className: d("flex flex-col gap-1", A ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", Xe.container, T),
405
- children: [/* @__PURE__ */ X("div", {
406
- className: "flex items-center justify-between",
407
- children: [/* @__PURE__ */ X("div", {
408
- className: "flex items-center gap-1",
409
- children: [/* @__PURE__ */ Y(j, {
410
- size: p.SM,
411
- className: d("shrink-0", Xe.headerIcon),
412
- "aria-hidden": !0
413
- }), /* @__PURE__ */ Y("span", {
414
- className: d(x?.headerLabelClassName ?? "dial-tiny-semi-text", Xe.headerLabel),
415
- children: M
416
- })]
417
- }), e.length >= 2 && (r || n) && /* @__PURE__ */ Y(w, {
418
- icon: /* @__PURE__ */ Y(F, {
419
- size: p.SM,
420
- "aria-hidden": !0
421
- }),
422
- size: C.Small,
423
- "aria-label": h,
424
- onClick: N
425
- })]
426
- }), /* @__PURE__ */ Y("div", {
427
- role: "list",
428
- "aria-label": M,
429
- className: d("gap-3", A ? "grid grid-cols-[repeat(5,83px)]" : "flex flex-wrap"),
430
- children: e.map((e, t) => /* @__PURE__ */ Y("div", {
431
- role: "listitem",
432
- children: /* @__PURE__ */ Y(Ye, {
433
- attachment: e,
434
- onClick: n,
435
- onDownload: P,
436
- onRetry: i,
437
- labels: {
438
- clickLabel: f,
439
- retryLabel: m,
440
- promptLabel: v,
441
- pastedLabel: y,
442
- imageLabel: b,
443
- openInNewTabLabel: g
444
- },
445
- isSelected: e.id === s
446
- })
447
- }, `${e.id}-${t}`))
448
- })]
449
- });
450
- }, $e = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
451
- let [s, c] = q(t), [l, u] = q(n), [d, f] = q(r), p = je(o);
452
- Oe(() => {
453
- o && !p.current && (c(t), u(n), f(r)), p.current = o;
454
- }, [
455
- o,
456
- t,
457
- n,
458
- r
459
- ]);
460
- let m = !e.responseFormat || s != null;
461
- return {
462
- responseFormat: s,
463
- systemPrompt: l,
464
- temperature: d,
465
- canSubmit: m,
466
- setResponseFormat: c,
467
- setSystemPrompt: u,
468
- setTemperature: f,
469
- handleSubmit: K(() => {
470
- if (!m) return;
471
- let t = {};
472
- e.responseFormat && s != null && (t.responseFormat = s), e.systemPrompt && (t.systemPrompt = l), e.temperature && (t.temperature = d), i(t), a();
473
- }, [
474
- m,
475
- e,
476
- s,
477
- l,
478
- d,
479
- i,
480
- a
481
- ])
482
- };
483
- }, et = { label: "_label_14i7c_1" }, tt = ({ features: e, responseFormat: t, systemPrompt: n, temperature: r, onResponseFormatChange: i, onSystemPromptChange: a, onTemperatureChange: o, responseFormatLabel: s = "Response format", responseFormatHint: c = "Applies to new and existing messages", responseFormatMarkdownLabel: f = "Markdown", responseFormatPlainTextLabel: p = "Plain text", systemPromptLabel: h = "System prompt", systemPromptTooltip: _ = "Enter a prompt", temperatureLabel: v = "Temperature", temperatureLabels: b = [
484
- "Precise",
485
- "Neutral",
486
- "Creative"
487
- ], temperatureHint: x, labelClassName: S = "!dial-small-semi-text", colors: C }) => {
488
- let w = u({ "--csf-label-text": C?.labelText }), T = d(S, et.label, "gap-1");
489
- return /* @__PURE__ */ X("div", {
490
- className: "flex flex-col gap-4 px-6 py-3",
491
- style: w,
492
- children: [
493
- e.responseFormat && /* @__PURE__ */ Y(g, {
494
- fieldTitle: s,
495
- labelClassName: T,
496
- elementId: "response-format",
497
- orientation: j.Column,
498
- activeRadioButton: t ?? l.Markdown,
499
- labelDescription: c,
500
- radioButtons: [{
501
- id: l.Markdown,
502
- name: f
503
- }, {
504
- id: l.PlainText,
505
- name: p
506
- }],
507
- onChange: (e) => i(e)
508
- }),
509
- e.systemPrompt && /* @__PURE__ */ Y(m, {
510
- value: n,
511
- placeholder: _,
512
- labelProps: {
513
- className: T,
514
- label: h
515
- },
516
- onChange: (e) => a(e ?? "")
517
- }),
518
- e.temperature && /* @__PURE__ */ Y(y, {
519
- labelProps: {
520
- label: v,
521
- className: T,
522
- caption: x
523
- },
524
- value: r,
525
- min: 0,
526
- max: 1,
527
- step: .1,
528
- labels: b,
529
- onChange: o
530
- })
531
- ]
532
- });
533
- }, nt = { modal: "_modal_14b5s_1" };
534
- De(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, title: o = "Chat settings", responseFormatLabel: s, responseFormatHint: c, responseFormatMarkdownLabel: l, responseFormatPlainTextLabel: u, systemPromptLabel: d, systemPromptTooltip: f, temperatureLabel: p, temperatureLabels: m, temperatureHint: g, saveLabel: _ = "Apply changes", saveDisabledTooltip: v, backgroundClassName: y = nt.modal }) => {
535
- let { responseFormat: b, systemPrompt: x, temperature: C, canSubmit: w, setResponseFormat: T, setSystemPrompt: E, setTemperature: D, handleSubmit: O } = $e({
536
- features: e,
537
- initialResponseFormat: t,
538
- initialSystemPrompt: n,
539
- initialTemperature: r,
540
- onSave: i,
541
- onClose: a
542
- });
543
- return /* @__PURE__ */ Y(h, {
544
- open: !0,
545
- header: o,
546
- size: k.Sm,
547
- onClose: a,
548
- className: y,
549
- footer: /* @__PURE__ */ Y("div", {
550
- className: "flex justify-end px-6 py-4",
551
- children: /* @__PURE__ */ Y(S, {
552
- tooltip: v,
553
- hideTooltip: w || !v,
554
- children: /* @__PURE__ */ Y(A, {
555
- label: _,
556
- onClick: O,
557
- disabled: !w
558
- })
559
- })
560
- }),
561
- children: /* @__PURE__ */ Y(tt, {
562
- features: e,
563
- responseFormat: b,
564
- systemPrompt: x,
565
- temperature: C,
566
- onResponseFormatChange: T,
567
- onSystemPromptChange: E,
568
- onTemperatureChange: D,
569
- responseFormatLabel: s,
570
- responseFormatHint: c,
571
- responseFormatMarkdownLabel: l,
572
- responseFormatPlainTextLabel: u,
573
- systemPromptLabel: d,
574
- systemPromptTooltip: f,
575
- temperatureLabel: p,
576
- temperatureLabels: m,
577
- temperatureHint: g
578
- })
579
- });
580
- });
581
- var rt = {
582
- tabContainer: "_tabContainer_153ct_1",
583
- tabActive: "_tabActive_153ct_13"
584
- };
585
- De(({ tabs: e, activeTabId: t, onTabChange: n, styles: r }) => {
586
- let { tabClassName: i = "dial-tiny-semi-text" } = r?.typography ?? {};
587
- return /* @__PURE__ */ Y("div", {
588
- className: "flex flex-nowrap gap-1",
589
- role: "tablist",
590
- children: e.map((e) => {
591
- let r = t === e.id;
592
- return /* @__PURE__ */ Y("div", {
593
- role: "tab",
594
- "aria-selected": r,
595
- className: "contents",
596
- children: /* @__PURE__ */ Y(x, {
597
- label: e.label,
598
- selected: r,
599
- onClick: () => n(e.id),
600
- className: d("box-border h-auto shrink-0 justify-center rounded-full p-2 text-center", i, rt.tabContainer, r && rt.tabActive)
601
- })
602
- }, e.id);
603
- })
604
- });
605
- });
606
- var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e = s.User, onEdit: t, onEditHover: r, onDelete: i, onRegenerate: a, onCopy: c, onCopyMarkdown: l, onLike: f, onDislike: m, activeRating: h, isAlwaysVisible: g, className: _, labels: v, colors: y }) => {
607
- let { tooltips: b, ariaLabels: x } = v ?? {}, [S, T] = q(null), [E, D] = q(""), O = u({ "--ma-active-rating-text": y?.activeRatingText }), k = K(() => {
608
- c?.(), T("copy"), D(x?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => T(null), at);
609
- }, [c, x?.copiedStatus]), A = K(() => {
610
- l?.(), T("markdown"), D(x?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => T(null), at);
611
- }, [l, x?.copiedMarkdownStatus]);
612
- return /* @__PURE__ */ X("div", {
23
+ }, L = { activeRating: "_activeRating_ygoee_1" }, R = 2e3, z = ({ role: e = a.User, onEdit: n, onEditHover: r, onDelete: c, onRegenerate: l, onCopy: p, onCopyMarkdown: m, onLike: h, onDislike: v, activeRating: y, isAlwaysVisible: b, isDisabled: S = !1, className: C, labels: F, colors: I }) => {
24
+ let { tooltips: z, ariaLabels: B } = F ?? {}, [V, H] = x(null), [U, W] = x(""), G = n != null || c != null || l != null || p != null || m != null || h != null || v != null, K = o({ "--ma-active-rating-text": I?.activeRatingText }), q = _(() => {
25
+ p?.(), H("copy"), W(B?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => H(null), R);
26
+ }, [p, B?.copiedStatus]), J = _(() => {
27
+ m?.(), H("markdown"), W(B?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => H(null), R);
28
+ }, [m, B?.copiedMarkdownStatus]);
29
+ return G ? /* @__PURE__ */ P("div", {
613
30
  role: "toolbar",
614
- "aria-label": x?.actionsGroup ?? "Message actions",
615
- style: O,
616
- className: d("flex gap-1", !g && "opacity-0 group-hover:opacity-100", _),
617
- children: [/* @__PURE__ */ Y("span", {
31
+ "aria-label": B?.actionsGroup ?? "Message actions",
32
+ style: K,
33
+ className: s("flex gap-1", !b && "opacity-0 group-hover:opacity-100", C),
34
+ children: [/* @__PURE__ */ N("span", {
618
35
  role: "status",
619
36
  "aria-live": "polite",
620
37
  className: "sr-only",
621
- children: E
622
- }), e === s.User ? /* @__PURE__ */ X(J, { children: [t && /* @__PURE__ */ Y(w, {
623
- icon: /* @__PURE__ */ Y(ve, {
624
- size: p.SM,
625
- "aria-hidden": !0
38
+ children: U
39
+ }), e === a.User ? /* @__PURE__ */ P(M, { children: [n && /* @__PURE__ */ N(g, {
40
+ icon: /* @__PURE__ */ N(T, {
41
+ size: u.SM,
42
+ "aria-hidden": !0,
43
+ stroke: d
626
44
  }),
627
- size: C.Small,
628
- "aria-label": x?.editMessage ?? "Edit message",
629
- tooltipProps: { tooltip: b?.edit ?? "Edit" },
630
- onClick: t,
45
+ size: f.Small,
46
+ "aria-label": B?.editMessage ?? "Edit message",
47
+ tooltipProps: { tooltip: z?.edit ?? "Edit" },
48
+ onClick: n,
631
49
  onMouseEnter: r,
632
- onFocus: r
633
- }), i && /* @__PURE__ */ Y(w, {
634
- icon: /* @__PURE__ */ Y(we, {
635
- size: p.SM,
636
- "aria-hidden": !0
50
+ onFocus: r,
51
+ disabled: S
52
+ }), c && /* @__PURE__ */ N(g, {
53
+ icon: /* @__PURE__ */ N(j, {
54
+ size: u.SM,
55
+ "aria-hidden": !0,
56
+ stroke: d
637
57
  }),
638
- size: C.Small,
639
- "aria-label": x?.deleteMessage ?? "Delete message",
640
- tooltipProps: { tooltip: b?.delete ?? "Delete" },
641
- onClick: i
642
- })] }) : /* @__PURE__ */ X(J, { children: [
643
- a && /* @__PURE__ */ Y(w, {
644
- icon: /* @__PURE__ */ Y(ye, {
645
- size: p.SM,
646
- "aria-hidden": !0
58
+ size: f.Small,
59
+ "aria-label": B?.deleteMessage ?? "Delete message",
60
+ tooltipProps: { tooltip: z?.delete ?? "Delete" },
61
+ onClick: c,
62
+ disabled: S
63
+ })] }) : /* @__PURE__ */ P(M, { children: [
64
+ l && /* @__PURE__ */ N(g, {
65
+ icon: /* @__PURE__ */ N(E, {
66
+ size: u.SM,
67
+ "aria-hidden": !0,
68
+ stroke: d
647
69
  }),
648
- size: C.Small,
649
- "aria-label": x?.regenerateResponse ?? "Regenerate response",
650
- tooltipProps: { tooltip: b?.regenerate ?? "Regenerate" },
651
- onClick: a
70
+ size: f.Small,
71
+ "aria-label": B?.regenerateResponse ?? "Regenerate response",
72
+ tooltipProps: { tooltip: z?.regenerate ?? "Regenerate" },
73
+ onClick: l,
74
+ disabled: S
652
75
  }),
653
- c && /* @__PURE__ */ Y(n, {
654
- onClick: k,
655
- size: C.Small,
656
- isCopied: S === "copy",
657
- copyLabel: b?.copy ?? "Copy",
658
- copiedLabel: b?.copied ?? "Copied!",
659
- ariaLabel: x?.copyResponse ?? "Copy response"
76
+ p && /* @__PURE__ */ N(t, {
77
+ iconSize: u.SM,
78
+ onClick: q,
79
+ size: f.Small,
80
+ isCopied: V === "copy",
81
+ copyLabel: z?.copy ?? "Copy",
82
+ copiedLabel: z?.copied ?? "Copied!",
83
+ ariaLabel: B?.copyResponse ?? "Copy response",
84
+ isDisabled: S
660
85
  }),
661
- l && /* @__PURE__ */ Y(n, {
662
- onClick: A,
663
- size: C.Small,
664
- isCopied: S === "markdown",
665
- copyLabel: b?.copyMarkdown ?? "Copy as Markdown",
666
- copiedLabel: b?.copiedMarkdown ?? "Copied!",
667
- ariaLabel: x?.copyAsMarkdown ?? "Copy as markdown"
86
+ m && /* @__PURE__ */ N(t, {
87
+ iconSize: u.SM,
88
+ onClick: J,
89
+ size: f.Small,
90
+ isCopied: V === "markdown",
91
+ iconCopy: /* @__PURE__ */ N(w, {
92
+ size: u.SM,
93
+ "aria-hidden": !0,
94
+ stroke: d
95
+ }),
96
+ copyLabel: z?.copyMarkdown ?? "Copy as Markdown",
97
+ copiedLabel: z?.copiedMarkdown ?? "Copied!",
98
+ ariaLabel: B?.copyAsMarkdown ?? "Copy as markdown",
99
+ isDisabled: S
668
100
  }),
669
- f && /* @__PURE__ */ Y(w, {
670
- icon: /* @__PURE__ */ Y(Ce, {
671
- size: p.SM,
101
+ h && /* @__PURE__ */ N(g, {
102
+ icon: y === i.Like ? /* @__PURE__ */ N(A, {
103
+ className: L.activeRating,
104
+ size: u.SM,
672
105
  "aria-hidden": !0
106
+ }) : /* @__PURE__ */ N(k, {
107
+ size: u.SM,
108
+ "aria-hidden": !0,
109
+ stroke: d
673
110
  }),
674
- size: C.Small,
675
- "aria-label": x?.likeResponse ?? "Like response",
676
- "aria-pressed": h === o.Like,
677
- className: h === o.Like ? it.activeRating : void 0,
678
- tooltipProps: { tooltip: b?.like ?? "Like" },
679
- onClick: f
111
+ size: f.Small,
112
+ "aria-label": B?.likeResponse ?? "Like response",
113
+ "aria-pressed": y === i.Like,
114
+ tooltipProps: { tooltip: z?.like ?? "Like" },
115
+ onClick: h,
116
+ disabled: S
680
117
  }),
681
- m && /* @__PURE__ */ Y(w, {
682
- icon: /* @__PURE__ */ Y(Se, {
683
- size: p.SM,
118
+ v && /* @__PURE__ */ N(g, {
119
+ icon: y === i.Dislike ? /* @__PURE__ */ N(O, {
120
+ className: L.activeRating,
121
+ size: u.SM,
684
122
  "aria-hidden": !0
123
+ }) : /* @__PURE__ */ N(D, {
124
+ size: u.SM,
125
+ "aria-hidden": !0,
126
+ stroke: d
685
127
  }),
686
- size: C.Small,
687
- "aria-label": x?.dislikeResponse ?? "Dislike response",
688
- "aria-pressed": h === o.Dislike,
689
- className: h === o.Dislike ? it.activeRating : void 0,
690
- tooltipProps: { tooltip: b?.dislike ?? "Dislike" },
691
- onClick: m
128
+ size: f.Small,
129
+ "aria-label": B?.dislikeResponse ?? "Dislike response",
130
+ "aria-pressed": y === i.Dislike,
131
+ tooltipProps: { tooltip: z?.dislike ?? "Dislike" },
132
+ onClick: v,
133
+ disabled: S
692
134
  })
693
135
  ] })]
694
- });
695
- }, $ = {
696
- userBubble: "_userBubble_ovjc1_1",
697
- collapsibleText: "_collapsibleText_ovjc1_6",
698
- expandedText: "_expandedText_ovjc1_11",
699
- collapsedText: "_collapsedText_ovjc1_15",
700
- startersDivider: "_startersDivider_ovjc1_26",
701
- text: "_text_ovjc1_30"
702
- }, st = ({ text: e, styles: n, actions: a, hasAlwaysVisibleActions: o, isStreaming: c, attachments: l, afterContent: f, starters: p, onSelectStarter: m, deploymentIconUrl: h, deploymentDisplayName: g, markdownComponents: _, onAttachmentClick: v, onDownloadAll: y, onAttachmentRetry: b, codeBlockTheme: x, labels: S, selectedAttachmentId: C }) => {
703
- let { colors: w, typography: T, className: E, bubbleClassName: D } = n ?? {}, { attachmentClickLabel: k, attachmentRetryLabel: A, attachmentOpenInNewTabLabel: j, startersAriaLabel: M = "Quick reply buttons", thinkingLabel: N, codeBlockCopyLabel: P, codeBlockCopiedLabel: F, assistantMessageAriaLabel: I = "Assistant message", deploymentIconFallbackLabel: L = "AI" } = S ?? {}, R = c ? (l ?? []).filter((e) => e.type !== t.Audio) : l ?? [], z = u({
704
- "--cm-bubble-text": w?.text,
705
- "--cm-starters-divider": w?.startersDivider
706
- }), B = d($.text, T?.fontClassName), V = !!(h || g);
707
- return /* @__PURE__ */ X("div", {
136
+ }) : null;
137
+ }, B = {
138
+ userBubble: "_userBubble_cq829_1",
139
+ collapsibleText: "_collapsibleText_cq829_6",
140
+ expandedText: "_expandedText_cq829_11",
141
+ collapsedText: "_collapsedText_cq829_15",
142
+ startersDivider: "_startersDivider_cq829_26",
143
+ text: "_text_cq829_30"
144
+ }, V = "[&>.cm-bubble-markdown>div>*:first-child]:indent-[var(--cm-bubble-first-line-indent,0px)]", H = ({ text: t, styles: i, actions: c, hasAlwaysVisibleActions: u, isStreaming: d, attachments: f, beforeContent: p, afterContent: m, starters: g, onSelectStarter: _, deploymentIconUrl: v, deploymentDisplayName: y, markdownComponents: b, markdownClassNames: x, markdownUrlTransform: S, onAttachmentClick: C, onDownloadAll: w, onAttachmentRetry: T, codeBlockTheme: E, tableOnOpenInCanvas: D, labels: O, selectedAttachmentId: k }) => {
145
+ let { colors: A, typography: j, className: M, bubbleClassName: F } = i ?? {}, { attachmentClickLabel: L, attachmentRetryLabel: R, attachmentOpenInNewTabLabel: H, startersAriaLabel: U = "Quick reply buttons", thinkingLabel: W, codeBlockCopyLabel: G, codeBlockCopiedLabel: K, tableCopyCsvLabel: q, tableCopyTxtLabel: J, tableCopyMarkdownLabel: Y, tableCopiedLabel: X, tableDownloadCsvLabel: Z, tableOpenInCanvasLabel: ee, tableDownloadFilename: te, tableScrollRegionAriaLabel: ne, assistantMessageAriaLabel: re = "Assistant message", deploymentIconFallbackLabel: Q = "AI" } = O ?? {}, ie = d ? (f ?? []).filter((t) => t.type !== e.Audio) : f ?? [], { slotRef: $, firstLineIndent: ae } = I(p != null && !!t), oe = o({
146
+ "--cm-bubble-text": A?.text,
147
+ "--cm-starters-divider": A?.startersDivider,
148
+ "--cm-bubble-first-line-indent": ae
149
+ }), se = s(B.text, j?.fontClassName), ce = !!(v || y);
150
+ return /* @__PURE__ */ P("div", {
708
151
  role: "group",
709
- "aria-label": I,
710
- style: z,
711
- className: d("flex w-full items-start gap-3", E),
712
- children: [V && /* @__PURE__ */ Y(r, {
713
- src: h,
152
+ "aria-label": re,
153
+ style: oe,
154
+ className: s("flex w-full items-start gap-3", M),
155
+ children: [ce && /* @__PURE__ */ N(n, {
156
+ src: v,
714
157
  size: 28,
715
- initialsName: g || L,
716
- labels: { tooltip: g ?? L }
717
- }), /* @__PURE__ */ X("div", {
158
+ initialsName: y || Q,
159
+ labels: { tooltip: y ?? Q }
160
+ }), /* @__PURE__ */ P("div", {
718
161
  className: "flex w-full min-w-0 max-w-full flex-col items-start gap-5",
719
- children: [/* @__PURE__ */ X("div", {
720
- className: d("flex w-full min-w-0 max-w-full flex-col items-start gap-4", D),
162
+ children: [/* @__PURE__ */ P("div", {
163
+ className: s("flex w-full min-w-0 max-w-full flex-col items-start gap-4", F),
721
164
  children: [
722
- (e || c) && /* @__PURE__ */ Y("div", {
165
+ p != null && !t && /* @__PURE__ */ N("div", {
166
+ className: "min-w-0",
167
+ children: p
168
+ }),
169
+ (t || d) && /* @__PURE__ */ P("div", {
723
170
  "aria-live": "polite",
724
171
  "aria-atomic": "false",
725
- className: d(B, "min-w-0 max-w-full text-start"),
726
- children: /* @__PURE__ */ Y(i, {
727
- content: e,
728
- isStreaming: c,
729
- thinkingLabel: N,
730
- components: _,
731
- codeBlockCopyLabel: P,
732
- codeBlockCopiedLabel: F,
733
- codeBlockTheme: x
734
- })
172
+ className: s(se, "relative min-w-0 max-w-full text-start", p != null && t && V),
173
+ children: [p != null && t && /* @__PURE__ */ N("div", {
174
+ ref: $,
175
+ className: "absolute start-0 top-0",
176
+ children: p
177
+ }), /* @__PURE__ */ N("div", {
178
+ className: "cm-bubble-markdown min-w-0 max-w-full",
179
+ children: /* @__PURE__ */ N(r, {
180
+ content: t ?? "",
181
+ isStreaming: d,
182
+ thinkingLabel: W,
183
+ components: b,
184
+ classNames: x,
185
+ urlTransform: S,
186
+ codeBlockCopyLabel: G,
187
+ codeBlockCopiedLabel: K,
188
+ codeBlockTheme: E,
189
+ tableActionLabels: {
190
+ copyCsvLabel: q,
191
+ copyTxtLabel: J,
192
+ copyMarkdownLabel: Y,
193
+ copiedLabel: X,
194
+ downloadCsvLabel: Z,
195
+ openInCanvasLabel: ee
196
+ },
197
+ tableDownloadFilename: te,
198
+ tableOnOpenInCanvas: D,
199
+ tableScrollRegionAriaLabel: ne
200
+ })
201
+ })]
735
202
  }),
736
- /* @__PURE__ */ Y(Qe, {
737
- attachments: R,
738
- onAttachmentClick: (e) => v?.(l?.find((t) => t.id === e)),
739
- onDownloadAll: y,
740
- onRetry: b,
203
+ /* @__PURE__ */ N(l, {
204
+ attachments: ie,
205
+ onAttachmentClick: (e) => C?.(f?.find((t) => t.id === e)),
206
+ onDownloadAll: w,
207
+ onRetry: T,
741
208
  labels: {
742
- clickLabel: k,
743
- retryLabel: A,
744
- openInNewTabLabel: j
209
+ clickLabel: L,
210
+ retryLabel: R,
211
+ openInNewTabLabel: H
745
212
  },
746
- selectedAttachmentId: C
213
+ selectedAttachmentId: k
747
214
  }),
748
- f,
749
- /* @__PURE__ */ Y(ot, {
750
- ...a,
751
- isAlwaysVisible: o,
752
- role: s.Assistant
215
+ m,
216
+ /* @__PURE__ */ N(z, {
217
+ ...c,
218
+ isAlwaysVisible: u,
219
+ role: a.Assistant
753
220
  })
754
221
  ]
755
- }), p && p.length > 0 && m && /* @__PURE__ */ Y("div", {
222
+ }), g && g.length > 0 && _ && /* @__PURE__ */ N("div", {
756
223
  role: "list",
757
- "aria-label": M,
758
- className: d("flex w-full flex-wrap gap-2 border-t pt-5", $.startersDivider),
759
- children: p.map((e, t) => /* @__PURE__ */ Y("div", {
224
+ "aria-label": U,
225
+ className: s("flex w-full flex-wrap gap-2 border-t pt-5", B.startersDivider),
226
+ children: g.map((e, t) => /* @__PURE__ */ N("div", {
760
227
  role: "listitem",
761
228
  className: "min-w-[40px]",
762
- children: /* @__PURE__ */ Y(O, {
229
+ children: /* @__PURE__ */ N(h, {
763
230
  label: e.title,
764
231
  className: "min-w-[40px]",
765
- onClick: () => m(e)
232
+ onClick: () => _(e)
766
233
  })
767
234
  }, t))
768
235
  })]
769
236
  })]
770
237
  });
771
- }, ct = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ Y("div", {
238
+ }, U = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ N("div", {
772
239
  role: "status",
773
240
  "aria-live": "polite",
774
- children: /* @__PURE__ */ Y(E, {
241
+ children: /* @__PURE__ */ N(p, {
775
242
  title: e,
776
243
  message: t,
777
244
  textClassName: "flex-row flex-wrap gap-1"
778
245
  })
779
- }), lt = /* @__PURE__ */ function(e) {
246
+ }), W = /* @__PURE__ */ function(e) {
780
247
  return e.Bottom = "Bottom", e.Top = "Top", e;
781
- }({}), ut = 10, dt = ({ text: e, position: t = lt.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: a, collapsedLineCount: o = ut, labels: c, onAttachmentClick: l, onDownloadAll: m, onAttachmentRetry: h, selectedAttachmentId: g }) => {
782
- let { colors: _, typography: v, className: y, bubbleClassName: b } = n ?? {}, { showMoreLabel: x = "Show more", showLessLabel: S = "Show less", showMoreAriaLabel: w, showLessAriaLabel: T, attachmentClickLabel: E, attachmentRetryLabel: O, attachmentOpenInNewTabLabel: k, userMessageAriaLabel: A = "User message" } = c ?? {}, { textRef: j, isTextCollapsed: P, isOverflowing: F, collapsedMaxHeight: I, expandedMaxHeight: L, isCollapsed: R, toggleCollapsed: z } = f({
783
- text: e,
784
- collapsedLineCount: o
785
- }), B = u({
786
- "--cm-bubble-user-bg": _?.userBackground,
787
- "--cm-bubble-user-border": _?.userBorder,
788
- "--cm-bubble-fade-start": _?.fadeStart,
789
- "--cm-bubble-text": _?.text,
790
- "--cm-bubble-collapsed-height": F ? `${I}px` : void 0,
791
- "--cm-bubble-expanded-height": F ? `${L}px` : void 0
792
- }), V = t === lt.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", H = d($.text, v?.fontClassName), U = w ?? x, W = T ?? S, ee = R ? x : S, te = R ? U : W, ne = R ? M : N, re = ke();
793
- return /* @__PURE__ */ Y("div", {
248
+ }({}), G = 10, K = ({ text: e, position: t = W.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: d, collapsedLineCount: p = G, labels: h, beforeContent: g, onAttachmentClick: _, onDownloadAll: v, onAttachmentRetry: b, selectedAttachmentId: x }) => {
249
+ let { colors: w, typography: T, className: E, bubbleClassName: D } = n ?? {}, { showMoreLabel: O = "Show more", showLessLabel: k = "Show less", showMoreAriaLabel: A, showLessAriaLabel: j, attachmentClickLabel: F, attachmentRetryLabel: I, attachmentOpenInNewTabLabel: L, userMessageAriaLabel: R = "User message" } = h ?? {}, { textRef: V, isTextCollapsed: H, isOverflowing: U, collapsedMaxHeight: K, expandedMaxHeight: q, isCollapsed: J, toggleCollapsed: Y } = c({
250
+ text: e ?? "",
251
+ collapsedLineCount: p
252
+ }), X = o({
253
+ "--cm-bubble-user-bg": w?.userBackground,
254
+ "--cm-bubble-user-border": w?.userBorder,
255
+ "--cm-bubble-fade-start": w?.fadeStart,
256
+ "--cm-bubble-text": w?.text,
257
+ "--cm-bubble-collapsed-height": U ? `${K}px` : void 0,
258
+ "--cm-bubble-expanded-height": U ? `${q}px` : void 0
259
+ }), Z = t === W.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", ee = s(B.text, T?.fontClassName), te = A ?? O, ne = j ?? k, re = J ? O : k, Q = J ? te : ne, ie = J ? S : C, $ = y();
260
+ return /* @__PURE__ */ N("div", {
794
261
  role: "group",
795
- "aria-label": A,
796
- style: B,
797
- className: d("flex w-full", y),
798
- children: /* @__PURE__ */ X("div", {
262
+ "aria-label": R,
263
+ style: X,
264
+ className: s("flex w-full", E),
265
+ children: /* @__PURE__ */ P("div", {
799
266
  className: "ms-auto flex w-fit min-w-0 max-w-full flex-col items-end gap-4",
800
267
  children: [
801
- /* @__PURE__ */ Y(Qe, {
802
- attachments: a ?? [],
803
- onAttachmentClick: (e) => l?.(a?.find((t) => t.id === e)),
804
- onDownloadAll: m,
805
- onRetry: h,
268
+ /* @__PURE__ */ N(l, {
269
+ attachments: d ?? [],
270
+ onAttachmentClick: (e) => _?.(d?.find((t) => t.id === e)),
271
+ onDownloadAll: v,
272
+ onRetry: b,
806
273
  labels: {
807
- clickLabel: E,
808
- retryLabel: O,
809
- openInNewTabLabel: k
274
+ clickLabel: F,
275
+ retryLabel: I,
276
+ openInNewTabLabel: L
810
277
  },
811
278
  styles: { className: "max-w-[640px]" },
812
- selectedAttachmentId: g
279
+ selectedAttachmentId: x
813
280
  }),
814
- e && /* @__PURE__ */ Y("div", {
815
- className: d($.userBubble, "flex w-fit items-center justify-end rounded-es-2xl rounded-ss-2xl border px-6 py-4", V, b),
816
- children: /* @__PURE__ */ X("div", {
281
+ (e || g != null) && /* @__PURE__ */ N("div", {
282
+ className: s(B.userBubble, "flex w-fit items-center justify-end rounded-es-2xl rounded-ss-2xl border px-6 py-4", Z, D),
283
+ children: /* @__PURE__ */ P("div", {
817
284
  className: "flex min-w-0 flex-col items-start",
818
- children: [/* @__PURE__ */ Y("div", {
819
- id: re,
820
- className: d("relative overflow-hidden", F && $.collapsibleText, F && !R && $.expandedText, P && $.collapsedText),
821
- children: /* @__PURE__ */ Y("p", {
822
- ref: j,
823
- className: d(H, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
824
- children: e
825
- })
826
- }), F && /* @__PURE__ */ Y(D, {
827
- label: /* @__PURE__ */ Y(J, { children: ee }),
828
- iconBefore: /* @__PURE__ */ Y(ne, {
829
- size: p.SM,
830
- "aria-hidden": "true"
285
+ children: [
286
+ e && /* @__PURE__ */ N("div", {
287
+ id: $,
288
+ className: s("relative overflow-hidden", U && B.collapsibleText, U && !J && B.expandedText, H && B.collapsedText),
289
+ children: /* @__PURE__ */ P("p", {
290
+ ref: V,
291
+ className: s(ee, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
292
+ children: [g != null && /* @__PURE__ */ N("span", {
293
+ className: "me-1",
294
+ children: g
295
+ }), e]
296
+ })
831
297
  }),
832
- "aria-label": te,
833
- "aria-expanded": !R,
834
- "aria-controls": re,
835
- className: "mt-3",
836
- onClick: z,
837
- size: C.Small
838
- })]
298
+ g != null && !e && /* @__PURE__ */ N("div", { children: g }),
299
+ U && /* @__PURE__ */ N(m, {
300
+ label: /* @__PURE__ */ N(M, { children: re }),
301
+ iconBefore: /* @__PURE__ */ N(ie, {
302
+ size: u.SM,
303
+ "aria-hidden": "true"
304
+ }),
305
+ "aria-label": Q,
306
+ "aria-expanded": !J,
307
+ "aria-controls": $,
308
+ className: "mt-3",
309
+ onClick: Y,
310
+ size: f.Small
311
+ })
312
+ ]
839
313
  })
840
314
  }),
841
- /* @__PURE__ */ Y(ot, {
315
+ /* @__PURE__ */ N(z, {
842
316
  ...r,
843
317
  isAlwaysVisible: i,
844
- role: s.User
318
+ role: a.User
845
319
  })
846
320
  ]
847
321
  })
848
322
  });
849
- }, ft = ({ role: e, onAttachmentClick: t, markdownComponents: n, ...r }) => e === s.Status ? /* @__PURE__ */ Y(ct, { labels: {
850
- titleText: r.labels?.statusTitleText,
851
- bodyText: r.labels?.statusBodyText ?? ""
852
- } }) : e === s.User ? /* @__PURE__ */ Y(dt, {
853
- ...r,
854
- onAttachmentClick: t
855
- }) : /* @__PURE__ */ Y(st, {
856
- ...r,
857
- markdownComponents: n,
858
- onAttachmentClick: t
323
+ }, q = ({ role: e, beforeContent: t, onAttachmentClick: n, markdownComponents: r, markdownUrlTransform: i, ...o }) => e === a.Status ? /* @__PURE__ */ N(U, { labels: {
324
+ titleText: o.labels?.statusTitleText,
325
+ bodyText: o.labels?.statusBodyText ?? ""
326
+ } }) : e === a.User ? /* @__PURE__ */ N(K, {
327
+ ...o,
328
+ beforeContent: t,
329
+ onAttachmentClick: n
330
+ }) : /* @__PURE__ */ N(H, {
331
+ ...o,
332
+ beforeContent: t,
333
+ markdownComponents: r,
334
+ markdownUrlTransform: i,
335
+ onAttachmentClick: n
859
336
  });
860
337
  //#endregion
861
- export { st as AssistantMessageBubble, lt as BubblePosition, ot as MessageActions, ft as MessageBubble, ct as StatusMessageBubble, dt as UserMessageBubble };
338
+ export { H as AssistantMessageBubble, W as BubblePosition, z as MessageActions, q as MessageBubble, U as StatusMessageBubble, K as UserMessageBubble };