@epam/ai-dial-conversation-messages 1.1.0-dev.113 → 1.1.0-dev.116
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 +207 -233
- package/package.json +3 -3
package/index.js
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
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,
|
|
3
|
-
import { IconChevronDown as
|
|
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, DialTooltip as x, ElementSize as S, GhostIconButton as C, Highlight as w, InfoMessageNotification as T, LinkButton as E, NeutralButton as D, PopupSize as O, PrimaryButton as k, RadioGroupOrientation as A } from "@epam/ai-dial-ui-kit";
|
|
3
|
+
import { IconChevronDown as j, IconChevronUp as M, IconClipboard as N, IconDownload as P, IconExternalLink as F, IconFile as I, IconFileTypeBmp as L, IconFileTypeCss as R, IconFileTypeCsv as z, IconFileTypeDoc as B, IconFileTypeDocx as V, IconFileTypeHtml as ee, IconFileTypeJpg as H, IconFileTypeJs as U, 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 W, 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
4
|
import "react-dom";
|
|
5
|
-
import { memo as De, useCallback as
|
|
6
|
-
import { Fragment as
|
|
5
|
+
import { memo as De, useCallback as G, useEffect as Oe, useId as ke, useMemo as Ae, useRef as je, useState as K } from "react";
|
|
6
|
+
import { Fragment as q, jsx as J, jsxs as Y } from "react/jsx-runtime";
|
|
7
7
|
//#region ../attachment-input/dist/index.js
|
|
8
8
|
var Me = (e) => {
|
|
9
9
|
if (e == null) return "";
|
|
10
10
|
let t = e.lastIndexOf(".");
|
|
11
11
|
return t > 0 ? e.slice(0, t) : e;
|
|
12
12
|
}, Ne = (e) => {
|
|
13
|
-
if (!e) return
|
|
13
|
+
if (!e) return I;
|
|
14
14
|
if (e.startsWith("image/")) switch (e) {
|
|
15
15
|
case "image/jpeg":
|
|
16
|
-
case "image/jpg": return
|
|
16
|
+
case "image/jpg": return H;
|
|
17
17
|
case "image/png": return ie;
|
|
18
18
|
case "image/svg+xml": return ce;
|
|
19
|
-
case "image/bmp": return
|
|
20
|
-
default: return
|
|
19
|
+
case "image/bmp": return L;
|
|
20
|
+
default: return W;
|
|
21
21
|
}
|
|
22
22
|
if (e.startsWith("video/")) return Te;
|
|
23
23
|
if (e.startsWith("audio/")) return ge;
|
|
24
24
|
switch (e) {
|
|
25
25
|
case "application/pdf": return ne;
|
|
26
26
|
case "application/msword":
|
|
27
|
-
case "application/vnd.ms-word": return
|
|
28
|
-
case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return
|
|
27
|
+
case "application/vnd.ms-word": return B;
|
|
28
|
+
case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return V;
|
|
29
29
|
case "application/vnd.ms-powerpoint": return ae;
|
|
30
30
|
case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return ae;
|
|
31
31
|
case "application/vnd.ms-excel": return pe;
|
|
@@ -36,31 +36,31 @@ var Me = (e) => {
|
|
|
36
36
|
case "application/x-7z-compressed":
|
|
37
37
|
case "application/gzip":
|
|
38
38
|
case "application/x-tar": return he;
|
|
39
|
-
case "text/csv": return
|
|
39
|
+
case "text/csv": return z;
|
|
40
40
|
case "text/plain": return de;
|
|
41
41
|
case "text/html":
|
|
42
|
-
case "application/xhtml+xml": return
|
|
42
|
+
case "application/xhtml+xml": return ee;
|
|
43
43
|
case "text/xml":
|
|
44
44
|
case "application/xml": return me;
|
|
45
45
|
case "application/sql":
|
|
46
46
|
case "text/x-sql": return se;
|
|
47
47
|
case "text/javascript":
|
|
48
|
-
case "application/javascript": return
|
|
48
|
+
case "application/javascript": return U;
|
|
49
49
|
case "text/jsx": return te;
|
|
50
50
|
case "application/typescript":
|
|
51
51
|
case "text/typescript": return le;
|
|
52
52
|
case "text/tsx": return ue;
|
|
53
|
-
case "text/css": return
|
|
53
|
+
case "text/css": return R;
|
|
54
54
|
case "text/x-php":
|
|
55
55
|
case "application/x-php": return re;
|
|
56
56
|
case "text/x-rustsrc":
|
|
57
57
|
case "application/x-rust": return oe;
|
|
58
58
|
case "text/x-vue": return fe;
|
|
59
|
-
default: return
|
|
59
|
+
default: return I;
|
|
60
60
|
}
|
|
61
61
|
}, Pe = (e) => {
|
|
62
62
|
let { type: n, contentType: r } = e;
|
|
63
|
-
return n === t.Prompt ? xe : n === t.Pasted ?
|
|
63
|
+
return n === t.Prompt ? xe : n === t.Pasted ? N : n === t.Image ? W : Ne(r ?? "");
|
|
64
64
|
}, Fe = (e) => {
|
|
65
65
|
let t = e.toLowerCase().split(";")[0].trim(), n = a[t];
|
|
66
66
|
if (n) return n;
|
|
@@ -88,56 +88,56 @@ var Me = (e) => {
|
|
|
88
88
|
BottomIcon: f ? null : Pe(e),
|
|
89
89
|
typeLabel: f ? null : Ie(e, n)
|
|
90
90
|
};
|
|
91
|
-
},
|
|
92
|
-
tile: "
|
|
93
|
-
hovered: "
|
|
94
|
-
selected: "
|
|
95
|
-
tileError: "
|
|
96
|
-
nameText: "
|
|
97
|
-
typeText: "
|
|
98
|
-
retryIcon: "
|
|
99
|
-
track: "
|
|
100
|
-
imageActionButton: "
|
|
101
|
-
},
|
|
91
|
+
}, X = {
|
|
92
|
+
tile: "_tile_rvzpe_1",
|
|
93
|
+
hovered: "_hovered_rvzpe_5",
|
|
94
|
+
selected: "_selected_rvzpe_15",
|
|
95
|
+
tileError: "_tileError_rvzpe_20",
|
|
96
|
+
nameText: "_nameText_rvzpe_25",
|
|
97
|
+
typeText: "_typeText_rvzpe_29",
|
|
98
|
+
retryIcon: "_retryIcon_rvzpe_33",
|
|
99
|
+
track: "_track_rvzpe_37",
|
|
100
|
+
imageActionButton: "_imageActionButton_rvzpe_41"
|
|
101
|
+
}, Z = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: a, className: o }) => /* @__PURE__ */ J(C, {
|
|
102
102
|
icon: a,
|
|
103
|
-
size:
|
|
103
|
+
size: S.Small,
|
|
104
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
105
|
"aria-label": e,
|
|
106
106
|
"aria-describedby": t ? n : void 0,
|
|
107
107
|
onClick: (e) => {
|
|
108
108
|
e.stopPropagation(), r(i);
|
|
109
109
|
}
|
|
110
|
-
}), Re = ({ ...e }) => /* @__PURE__ */
|
|
111
|
-
icon: /* @__PURE__ */
|
|
110
|
+
}), Re = ({ ...e }) => /* @__PURE__ */ J(Z, {
|
|
111
|
+
icon: /* @__PURE__ */ J(be, {
|
|
112
112
|
size: p.SM,
|
|
113
113
|
"aria-hidden": !0
|
|
114
114
|
}),
|
|
115
|
-
className:
|
|
115
|
+
className: X.retryIcon,
|
|
116
116
|
...e
|
|
117
|
-
}), ze = ({ ...e }) => /* @__PURE__ */
|
|
118
|
-
icon: /* @__PURE__ */
|
|
117
|
+
}), ze = ({ ...e }) => /* @__PURE__ */ J(Z, {
|
|
118
|
+
icon: /* @__PURE__ */ J(P, {
|
|
119
119
|
size: p.SM,
|
|
120
120
|
"aria-hidden": !0
|
|
121
121
|
}),
|
|
122
122
|
...e
|
|
123
|
-
}), Be = ({ ...e }) => /* @__PURE__ */
|
|
124
|
-
icon: /* @__PURE__ */
|
|
123
|
+
}), Be = ({ ...e }) => /* @__PURE__ */ J(Z, {
|
|
124
|
+
icon: /* @__PURE__ */ J(F, {
|
|
125
125
|
size: p.SM,
|
|
126
126
|
"aria-hidden": !0
|
|
127
127
|
}),
|
|
128
128
|
...e
|
|
129
|
-
}), Ve = ({ ...e }) => /* @__PURE__ */
|
|
130
|
-
icon: /* @__PURE__ */
|
|
129
|
+
}), Ve = ({ ...e }) => /* @__PURE__ */ J(Z, {
|
|
130
|
+
icon: /* @__PURE__ */ J(Ee, {
|
|
131
131
|
size: p.SM,
|
|
132
132
|
"aria-hidden": !0
|
|
133
133
|
}),
|
|
134
|
-
className:
|
|
134
|
+
className: X.hoverIcon,
|
|
135
135
|
...e
|
|
136
136
|
}), He = ({ attachment: e, searchQuery: t = "", onClick: n, onDownload: r, onRemove: i, labels: a, styles: o, cssVars: s, isSelected: c }) => {
|
|
137
137
|
let { clickLabel: l = "Open attachment", downloadLabel: u = "Download attachment", removeLabel: f = "Remove attachment" } = a ?? {}, { typography: p, className: m } = o ?? {}, h = () => {
|
|
138
138
|
n?.(e.id);
|
|
139
139
|
};
|
|
140
|
-
return /* @__PURE__ */
|
|
140
|
+
return /* @__PURE__ */ Y("div", {
|
|
141
141
|
style: s,
|
|
142
142
|
...n == null ? {} : {
|
|
143
143
|
role: "button",
|
|
@@ -148,18 +148,18 @@ var Me = (e) => {
|
|
|
148
148
|
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), h());
|
|
149
149
|
}
|
|
150
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 &&
|
|
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 && X.selected, m),
|
|
152
152
|
children: [
|
|
153
|
-
/* @__PURE__ */
|
|
153
|
+
/* @__PURE__ */ J("span", {
|
|
154
154
|
title: e.name,
|
|
155
|
-
className: d(p?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate",
|
|
156
|
-
children: t ? /* @__PURE__ */
|
|
155
|
+
className: d(p?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate", X.nameText),
|
|
156
|
+
children: t ? /* @__PURE__ */ J(w, {
|
|
157
157
|
text: e.name,
|
|
158
158
|
query: t,
|
|
159
159
|
maxLines: 1
|
|
160
160
|
}) : e.name
|
|
161
161
|
}),
|
|
162
|
-
e.playUrl && /* @__PURE__ */
|
|
162
|
+
e.playUrl && /* @__PURE__ */ J("audio", {
|
|
163
163
|
controls: !0,
|
|
164
164
|
src: e.playUrl,
|
|
165
165
|
"aria-label": e.name,
|
|
@@ -167,12 +167,12 @@ var Me = (e) => {
|
|
|
167
167
|
preload: "metadata",
|
|
168
168
|
onClick: (e) => e.stopPropagation()
|
|
169
169
|
}),
|
|
170
|
-
r && /* @__PURE__ */
|
|
170
|
+
r && /* @__PURE__ */ J(ze, {
|
|
171
171
|
ariaLabel: u,
|
|
172
172
|
onClick: r,
|
|
173
173
|
id: e.id
|
|
174
174
|
}),
|
|
175
|
-
i && /* @__PURE__ */
|
|
175
|
+
i && /* @__PURE__ */ J(Ve, {
|
|
176
176
|
ariaLabel: f,
|
|
177
177
|
onClick: i,
|
|
178
178
|
id: e.id
|
|
@@ -185,60 +185,60 @@ var Me = (e) => {
|
|
|
185
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
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
187
|
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), r?.(n.id));
|
|
188
|
-
}, B = Ae(() => l ? D : Me(D), [l, D]), V =
|
|
188
|
+
}, B = Ae(() => l ? D : Me(D), [l, D]), V = G(() => {
|
|
189
189
|
window.open(n.referenceUrl, "_blank", "noopener,noreferrer");
|
|
190
|
-
}, [n]),
|
|
190
|
+
}, [n]), ee = d(Ue, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", X.tile, (n.type === t.Prompt || n.type === t.Pasted) && X.hovered, g && X.selected, j && X.tileError), H = /* @__PURE__ */ J("div", {
|
|
191
191
|
title: B,
|
|
192
|
-
className: d(w?.nameClassName ?? "dial-caption-text", "line-clamp-2 min-w-0 break-all",
|
|
192
|
+
className: d(w?.nameClassName ?? "dial-caption-text", "line-clamp-2 min-w-0 break-all", X.nameText, !j && R),
|
|
193
193
|
children: B
|
|
194
|
-
}),
|
|
194
|
+
}), U = P && /* @__PURE__ */ Y("div", {
|
|
195
195
|
className: d("flex w-full items-center gap-1", j && R),
|
|
196
|
-
children: [/* @__PURE__ */
|
|
196
|
+
children: [/* @__PURE__ */ J(P, {
|
|
197
197
|
size: 16,
|
|
198
|
-
className:
|
|
198
|
+
className: X.typeText,
|
|
199
199
|
"aria-hidden": !0
|
|
200
|
-
}), /* @__PURE__ */
|
|
201
|
-
className: d(w?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate",
|
|
200
|
+
}), /* @__PURE__ */ J("span", {
|
|
201
|
+
className: d(w?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate", X.typeText),
|
|
202
202
|
children: y ? `${F} · ${y}` : F
|
|
203
203
|
})]
|
|
204
|
-
}),
|
|
204
|
+
}), te = () => {
|
|
205
205
|
m && p ? p(E) : r && r(E);
|
|
206
|
-
},
|
|
207
|
-
j ? /* @__PURE__ */
|
|
208
|
-
A && /* @__PURE__ */
|
|
206
|
+
}, ne = /* @__PURE__ */ Y(q, { children: [
|
|
207
|
+
j ? /* @__PURE__ */ Y(q, { children: [U, H] }) : /* @__PURE__ */ Y(q, { children: [H, U] }),
|
|
208
|
+
A && /* @__PURE__ */ J("div", {
|
|
209
209
|
role: "progressbar",
|
|
210
210
|
"aria-label": x,
|
|
211
|
-
className: d("absolute inset-x-2 bottom-2 h-[3px] overflow-hidden rounded-full",
|
|
212
|
-
children: /* @__PURE__ */
|
|
211
|
+
className: d("absolute inset-x-2 bottom-2 h-[3px] overflow-hidden rounded-full", X.track),
|
|
212
|
+
children: /* @__PURE__ */ J(b, { size: 32 })
|
|
213
213
|
}),
|
|
214
|
-
I && /* @__PURE__ */
|
|
214
|
+
I && /* @__PURE__ */ J(ze, {
|
|
215
215
|
ariaLabel: _,
|
|
216
216
|
errorTitle: N,
|
|
217
217
|
errorDescId: M,
|
|
218
218
|
onClick: s,
|
|
219
219
|
id: E
|
|
220
220
|
}),
|
|
221
|
-
L && /* @__PURE__ */
|
|
221
|
+
L && /* @__PURE__ */ J(Re, {
|
|
222
222
|
ariaLabel: v,
|
|
223
223
|
errorTitle: N,
|
|
224
224
|
errorDescId: M,
|
|
225
225
|
onClick: i,
|
|
226
226
|
id: E
|
|
227
227
|
}),
|
|
228
|
-
u && /* @__PURE__ */
|
|
228
|
+
u && /* @__PURE__ */ J(Be, {
|
|
229
229
|
ariaLabel: v,
|
|
230
230
|
errorTitle: N,
|
|
231
231
|
errorDescId: M,
|
|
232
232
|
onClick: V
|
|
233
233
|
}),
|
|
234
|
-
h && /* @__PURE__ */
|
|
234
|
+
h && /* @__PURE__ */ J(Ve, {
|
|
235
235
|
ariaLabel: v,
|
|
236
236
|
errorTitle: N,
|
|
237
237
|
errorDescId: M,
|
|
238
238
|
onClick: h,
|
|
239
239
|
id: E
|
|
240
240
|
}),
|
|
241
|
-
j && /* @__PURE__ */
|
|
241
|
+
j && /* @__PURE__ */ J("span", {
|
|
242
242
|
id: M,
|
|
243
243
|
role: "status",
|
|
244
244
|
"aria-live": "polite",
|
|
@@ -246,24 +246,24 @@ var Me = (e) => {
|
|
|
246
246
|
children: N
|
|
247
247
|
})
|
|
248
248
|
] });
|
|
249
|
-
return /* @__PURE__ */
|
|
249
|
+
return /* @__PURE__ */ J("div", {
|
|
250
250
|
style: f,
|
|
251
251
|
className: d("inline-flex", T),
|
|
252
|
-
children: /* @__PURE__ */
|
|
252
|
+
children: /* @__PURE__ */ J("div", {
|
|
253
253
|
role: "button",
|
|
254
254
|
tabIndex: 0,
|
|
255
255
|
"aria-label": _,
|
|
256
|
-
onClick:
|
|
256
|
+
onClick: te,
|
|
257
257
|
onKeyDown: z,
|
|
258
258
|
style: f,
|
|
259
|
-
className: d(
|
|
260
|
-
children:
|
|
259
|
+
className: d(ee, "cursor-pointer focus-within:outline focus-within:outline-1 focus-within:outline-offset-1"),
|
|
260
|
+
children: ne
|
|
261
261
|
})
|
|
262
262
|
});
|
|
263
|
-
},
|
|
263
|
+
}, Q = /* @__PURE__ */ function(e) {
|
|
264
264
|
return e.Idle = "idle", e.Loading = "loading", e.Loaded = "loaded", e.Error = "error", e;
|
|
265
|
-
}({}),
|
|
266
|
-
let n = je(null), [r, i] =
|
|
265
|
+
}({}), Ke = ({ enabled: e, src: t }) => {
|
|
266
|
+
let n = je(null), [r, i] = K("idle");
|
|
267
267
|
return Oe(() => {
|
|
268
268
|
i(e && t ? "loading" : "idle");
|
|
269
269
|
}, [e, t]), Oe(() => {
|
|
@@ -277,15 +277,15 @@ var Me = (e) => {
|
|
|
277
277
|
imageRef: n,
|
|
278
278
|
imageLoadStatus: r
|
|
279
279
|
};
|
|
280
|
-
},
|
|
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 } =
|
|
280
|
+
}, qe = ({ 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 } = Ke({
|
|
282
282
|
enabled: C,
|
|
283
283
|
src: y
|
|
284
284
|
}), D = () => {
|
|
285
285
|
b && n ? n(h) : w && r && r(h);
|
|
286
286
|
};
|
|
287
|
-
return /* @__PURE__ */
|
|
288
|
-
className: d(Ue, "group/attachment-tile", w && "cursor-pointer",
|
|
287
|
+
return /* @__PURE__ */ J("div", {
|
|
288
|
+
className: d(Ue, "group/attachment-tile", w && "cursor-pointer", X.tile, l && X.selected, m),
|
|
289
289
|
onClick: D,
|
|
290
290
|
onKeyDown: (e) => {
|
|
291
291
|
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), D());
|
|
@@ -294,43 +294,43 @@ var Me = (e) => {
|
|
|
294
294
|
role: "button",
|
|
295
295
|
style: o,
|
|
296
296
|
"aria-label": w ? u : b ? f : void 0,
|
|
297
|
-
children: /* @__PURE__ */
|
|
297
|
+
children: /* @__PURE__ */ Y("div", {
|
|
298
298
|
className: "relative h-full w-full overflow-hidden",
|
|
299
299
|
children: [
|
|
300
|
-
a && /* @__PURE__ */
|
|
300
|
+
a && /* @__PURE__ */ J(Ve, {
|
|
301
301
|
onClick: a,
|
|
302
302
|
id: h,
|
|
303
|
-
className:
|
|
303
|
+
className: X.imageActionButton
|
|
304
304
|
}),
|
|
305
|
-
s && /* @__PURE__ */
|
|
305
|
+
s && /* @__PURE__ */ J(ze, {
|
|
306
306
|
onClick: s,
|
|
307
307
|
id: h,
|
|
308
|
-
className:
|
|
308
|
+
className: X.imageActionButton
|
|
309
309
|
}),
|
|
310
|
-
E !==
|
|
310
|
+
E !== Q.Loaded && /* @__PURE__ */ J(_, {
|
|
311
311
|
variant: v.Rectangular,
|
|
312
312
|
width: "100%",
|
|
313
313
|
height: "100%",
|
|
314
|
-
active: E ===
|
|
315
|
-
overlay: /* @__PURE__ */
|
|
314
|
+
active: E === Q.Loading,
|
|
315
|
+
overlay: /* @__PURE__ */ J(W, {
|
|
316
316
|
size: p.LG,
|
|
317
|
-
className:
|
|
317
|
+
className: X.typeText,
|
|
318
318
|
"aria-hidden": !0
|
|
319
319
|
}),
|
|
320
320
|
className: "absolute inset-0 rounded-xl"
|
|
321
321
|
}),
|
|
322
|
-
/* @__PURE__ */
|
|
322
|
+
/* @__PURE__ */ J("img", {
|
|
323
323
|
ref: T,
|
|
324
324
|
src: y,
|
|
325
325
|
alt: g,
|
|
326
326
|
loading: "lazy",
|
|
327
327
|
decoding: "async",
|
|
328
|
-
className: d("h-full w-full rounded-xl object-cover transition-opacity duration-200", E ===
|
|
328
|
+
className: d("h-full w-full rounded-xl object-cover transition-opacity duration-200", E === Q.Loaded ? "opacity-100" : "opacity-0")
|
|
329
329
|
})
|
|
330
330
|
]
|
|
331
331
|
})
|
|
332
332
|
});
|
|
333
|
-
},
|
|
333
|
+
}, Je = ({ attachment: e, searchQuery: n = "", onRemove: r, onRetry: i, onExpand: a, onClick: o, onDownload: s, labels: c, styles: l, isSelected: d }) => {
|
|
334
334
|
let { colors: f } = l ?? {}, p = e.type === t.Pasted, m = p && a !== void 0, h = u({
|
|
335
335
|
"--ai-tile-bg": f?.background,
|
|
336
336
|
"--ai-tile-border": f?.border,
|
|
@@ -346,10 +346,9 @@ var Me = (e) => {
|
|
|
346
346
|
"--ai-tile-type-text": f?.typeText,
|
|
347
347
|
"--ai-tile-hover-icon-bg": f?.hoverIconBackground,
|
|
348
348
|
"--ai-tile-hover-icon-color": f?.hoverIconColor,
|
|
349
|
-
"--ai-tile-progress-track": f?.trackBackground
|
|
350
|
-
"--ai-tile-fill-bg": f?.fillBackground
|
|
349
|
+
"--ai-tile-progress-track": f?.trackBackground
|
|
351
350
|
}), { isImage: g, isAudio: _, isLink: v } = Ae(() => Le(e), [e]);
|
|
352
|
-
return _ ? /* @__PURE__ */
|
|
351
|
+
return _ ? /* @__PURE__ */ J(He, {
|
|
353
352
|
attachment: e,
|
|
354
353
|
labels: c,
|
|
355
354
|
onClick: o,
|
|
@@ -359,7 +358,7 @@ var Me = (e) => {
|
|
|
359
358
|
styles: l,
|
|
360
359
|
cssVars: h,
|
|
361
360
|
isSelected: d
|
|
362
|
-
}) : g ? /* @__PURE__ */
|
|
361
|
+
}) : g ? /* @__PURE__ */ J(qe, {
|
|
363
362
|
attachment: e,
|
|
364
363
|
labels: c,
|
|
365
364
|
onClick: o,
|
|
@@ -369,7 +368,7 @@ var Me = (e) => {
|
|
|
369
368
|
cssVars: h,
|
|
370
369
|
onDownload: s,
|
|
371
370
|
isSelected: d
|
|
372
|
-
}) : /* @__PURE__ */
|
|
371
|
+
}) : /* @__PURE__ */ J(Ge, {
|
|
373
372
|
attachment: e,
|
|
374
373
|
onClick: o,
|
|
375
374
|
onRetry: i,
|
|
@@ -384,55 +383,55 @@ var Me = (e) => {
|
|
|
384
383
|
isExpandable: m,
|
|
385
384
|
isSelected: d
|
|
386
385
|
});
|
|
387
|
-
},
|
|
386
|
+
}, Ye = {
|
|
388
387
|
headerIcon: "_headerIcon_1sgtq_1",
|
|
389
388
|
headerLabel: "_headerLabel_1sgtq_2"
|
|
390
|
-
},
|
|
391
|
-
let { ariaLabel: l = "Attachments", clickLabel: f = "Download attachment", retryLabel: m = "Retry upload", downloadAllLabel: h = "Download all", openInNewTabLabel: g, getHeaderLabel: _ = (e) =>
|
|
389
|
+
}, Xe = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, Ze = ({ attachments: e, onAttachmentClick: n, onDownloadAll: r, onRetry: i, labels: a, styles: o, selectedAttachmentId: s }) => {
|
|
390
|
+
let { ariaLabel: l = "Attachments", clickLabel: f = "Download attachment", retryLabel: m = "Retry upload", downloadAllLabel: h = "Download all", openInNewTabLabel: g, getHeaderLabel: _ = (e) => Xe(e, "attachment"), promptLabel: v, pastedLabel: y, imageLabel: b } = a ?? {}, { typography: x, colors: w, className: T } = o ?? {}, E = u({ "--ai-group-text": w?.text });
|
|
392
391
|
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 ?
|
|
392
|
+
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 ? W : I, M = _(e.length), N = () => {
|
|
394
393
|
let t = e.filter((e) => e.status === c.Idle);
|
|
395
394
|
r ? r(t) : t.forEach((e) => n?.(e.id));
|
|
396
|
-
},
|
|
395
|
+
}, F = (t) => {
|
|
397
396
|
let n = e.find((e) => e.id === t);
|
|
398
397
|
n && r?.([n]);
|
|
399
398
|
};
|
|
400
|
-
return /* @__PURE__ */
|
|
399
|
+
return /* @__PURE__ */ Y("div", {
|
|
401
400
|
role: "group",
|
|
402
401
|
"aria-label": l,
|
|
403
402
|
style: E,
|
|
404
|
-
className: d("flex flex-col gap-1", A ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]",
|
|
405
|
-
children: [/* @__PURE__ */
|
|
403
|
+
className: d("flex flex-col gap-1", A ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", Ye.container, T),
|
|
404
|
+
children: [/* @__PURE__ */ Y("div", {
|
|
406
405
|
className: "flex items-center justify-between",
|
|
407
|
-
children: [/* @__PURE__ */
|
|
406
|
+
children: [/* @__PURE__ */ Y("div", {
|
|
408
407
|
className: "flex items-center gap-1",
|
|
409
|
-
children: [/* @__PURE__ */
|
|
408
|
+
children: [/* @__PURE__ */ J(j, {
|
|
410
409
|
size: p.SM,
|
|
411
|
-
className: d("shrink-0",
|
|
410
|
+
className: d("shrink-0", Ye.headerIcon),
|
|
412
411
|
"aria-hidden": !0
|
|
413
|
-
}), /* @__PURE__ */
|
|
414
|
-
className: d(x?.headerLabelClassName ?? "dial-tiny-semi-text",
|
|
412
|
+
}), /* @__PURE__ */ J("span", {
|
|
413
|
+
className: d(x?.headerLabelClassName ?? "dial-tiny-semi-text", Ye.headerLabel),
|
|
415
414
|
children: M
|
|
416
415
|
})]
|
|
417
|
-
}), e.length >= 2 && (r || n) && /* @__PURE__ */
|
|
418
|
-
icon: /* @__PURE__ */
|
|
416
|
+
}), e.length >= 2 && (r || n) && /* @__PURE__ */ J(C, {
|
|
417
|
+
icon: /* @__PURE__ */ J(P, {
|
|
419
418
|
size: p.SM,
|
|
420
419
|
"aria-hidden": !0
|
|
421
420
|
}),
|
|
422
|
-
size:
|
|
421
|
+
size: S.Small,
|
|
423
422
|
"aria-label": h,
|
|
424
423
|
onClick: N
|
|
425
424
|
})]
|
|
426
|
-
}), /* @__PURE__ */
|
|
425
|
+
}), /* @__PURE__ */ J("div", {
|
|
427
426
|
role: "list",
|
|
428
427
|
"aria-label": M,
|
|
429
428
|
className: d("gap-3", A ? "grid grid-cols-[repeat(5,83px)]" : "flex flex-wrap"),
|
|
430
|
-
children: e.map((e, t) => /* @__PURE__ */
|
|
429
|
+
children: e.map((e, t) => /* @__PURE__ */ J("div", {
|
|
431
430
|
role: "listitem",
|
|
432
|
-
children: /* @__PURE__ */
|
|
431
|
+
children: /* @__PURE__ */ J(Je, {
|
|
433
432
|
attachment: e,
|
|
434
433
|
onClick: n,
|
|
435
|
-
onDownload:
|
|
434
|
+
onDownload: F,
|
|
436
435
|
onRetry: i,
|
|
437
436
|
labels: {
|
|
438
437
|
clickLabel: f,
|
|
@@ -447,8 +446,8 @@ var Me = (e) => {
|
|
|
447
446
|
}, `${e.id}-${t}`))
|
|
448
447
|
})]
|
|
449
448
|
});
|
|
450
|
-
},
|
|
451
|
-
let [s, c] =
|
|
449
|
+
}, Qe = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
|
|
450
|
+
let [s, c] = K(t), [l, u] = K(n), [d, f] = K(r), p = je(o);
|
|
452
451
|
Oe(() => {
|
|
453
452
|
o && !p.current && (c(t), u(n), f(r)), p.current = o;
|
|
454
453
|
}, [
|
|
@@ -466,7 +465,7 @@ var Me = (e) => {
|
|
|
466
465
|
setResponseFormat: c,
|
|
467
466
|
setSystemPrompt: u,
|
|
468
467
|
setTemperature: f,
|
|
469
|
-
handleSubmit:
|
|
468
|
+
handleSubmit: G(() => {
|
|
470
469
|
if (!m) return;
|
|
471
470
|
let t = {};
|
|
472
471
|
e.responseFormat && s != null && (t.responseFormat = s), e.systemPrompt && (t.systemPrompt = l), e.temperature && (t.temperature = d), i(t), a();
|
|
@@ -480,21 +479,21 @@ var Me = (e) => {
|
|
|
480
479
|
a
|
|
481
480
|
])
|
|
482
481
|
};
|
|
483
|
-
},
|
|
482
|
+
}, $e = { label: "_label_14i7c_1" }, et = ({ 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
483
|
"Precise",
|
|
485
484
|
"Neutral",
|
|
486
485
|
"Creative"
|
|
487
486
|
], temperatureHint: x, labelClassName: S = "!dial-small-semi-text", colors: C }) => {
|
|
488
|
-
let w = u({ "--csf-label-text": C?.labelText }), T = d(S,
|
|
489
|
-
return /* @__PURE__ */
|
|
487
|
+
let w = u({ "--csf-label-text": C?.labelText }), T = d(S, $e.label, "gap-1");
|
|
488
|
+
return /* @__PURE__ */ Y("div", {
|
|
490
489
|
className: "flex flex-col gap-4 px-6 py-3",
|
|
491
490
|
style: w,
|
|
492
491
|
children: [
|
|
493
|
-
e.responseFormat && /* @__PURE__ */
|
|
492
|
+
e.responseFormat && /* @__PURE__ */ J(g, {
|
|
494
493
|
fieldTitle: s,
|
|
495
494
|
labelClassName: T,
|
|
496
495
|
elementId: "response-format",
|
|
497
|
-
orientation:
|
|
496
|
+
orientation: A.Column,
|
|
498
497
|
activeRadioButton: t ?? l.Markdown,
|
|
499
498
|
labelDescription: c,
|
|
500
499
|
radioButtons: [{
|
|
@@ -506,7 +505,7 @@ var Me = (e) => {
|
|
|
506
505
|
}],
|
|
507
506
|
onChange: (e) => i(e)
|
|
508
507
|
}),
|
|
509
|
-
e.systemPrompt && /* @__PURE__ */
|
|
508
|
+
e.systemPrompt && /* @__PURE__ */ J(m, {
|
|
510
509
|
value: n,
|
|
511
510
|
placeholder: _,
|
|
512
511
|
labelProps: {
|
|
@@ -515,7 +514,7 @@ var Me = (e) => {
|
|
|
515
514
|
},
|
|
516
515
|
onChange: (e) => a(e ?? "")
|
|
517
516
|
}),
|
|
518
|
-
e.temperature && /* @__PURE__ */
|
|
517
|
+
e.temperature && /* @__PURE__ */ J(y, {
|
|
519
518
|
labelProps: {
|
|
520
519
|
label: v,
|
|
521
520
|
className: T,
|
|
@@ -530,9 +529,9 @@ var Me = (e) => {
|
|
|
530
529
|
})
|
|
531
530
|
]
|
|
532
531
|
});
|
|
533
|
-
},
|
|
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 =
|
|
535
|
-
let { responseFormat: b, systemPrompt:
|
|
532
|
+
}, tt = { modal: "_modal_od073_1" };
|
|
533
|
+
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 = tt.modal }) => {
|
|
534
|
+
let { responseFormat: b, systemPrompt: S, temperature: C, canSubmit: w, setResponseFormat: T, setSystemPrompt: E, setTemperature: D, handleSubmit: A } = Qe({
|
|
536
535
|
features: e,
|
|
537
536
|
initialResponseFormat: t,
|
|
538
537
|
initialSystemPrompt: n,
|
|
@@ -540,28 +539,28 @@ De(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
|
|
|
540
539
|
onSave: i,
|
|
541
540
|
onClose: a
|
|
542
541
|
});
|
|
543
|
-
return /* @__PURE__ */
|
|
542
|
+
return /* @__PURE__ */ J(h, {
|
|
544
543
|
open: !0,
|
|
545
544
|
header: o,
|
|
546
|
-
size:
|
|
545
|
+
size: O.Sm,
|
|
547
546
|
onClose: a,
|
|
548
547
|
className: y,
|
|
549
|
-
footer: /* @__PURE__ */
|
|
548
|
+
footer: /* @__PURE__ */ J("div", {
|
|
550
549
|
className: "flex justify-end px-6 py-4",
|
|
551
|
-
children: /* @__PURE__ */
|
|
550
|
+
children: /* @__PURE__ */ J(x, {
|
|
552
551
|
tooltip: v,
|
|
553
552
|
hideTooltip: w || !v,
|
|
554
|
-
children: /* @__PURE__ */
|
|
553
|
+
children: /* @__PURE__ */ J(k, {
|
|
555
554
|
label: _,
|
|
556
|
-
onClick:
|
|
555
|
+
onClick: A,
|
|
557
556
|
disabled: !w
|
|
558
557
|
})
|
|
559
558
|
})
|
|
560
559
|
}),
|
|
561
|
-
children: /* @__PURE__ */
|
|
560
|
+
children: /* @__PURE__ */ J(et, {
|
|
562
561
|
features: e,
|
|
563
562
|
responseFormat: b,
|
|
564
|
-
systemPrompt:
|
|
563
|
+
systemPrompt: S,
|
|
565
564
|
temperature: C,
|
|
566
565
|
onResponseFormatChange: T,
|
|
567
566
|
onSystemPromptChange: E,
|
|
@@ -578,115 +577,90 @@ De(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
|
|
|
578
577
|
})
|
|
579
578
|
});
|
|
580
579
|
});
|
|
581
|
-
var rt = {
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
}
|
|
585
|
-
|
|
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);
|
|
580
|
+
var nt = { activeRating: "_activeRating_7jito_1" }, rt = 2e3, it = ({ 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 }) => {
|
|
581
|
+
let { tooltips: b, ariaLabels: x } = v ?? {}, [w, T] = K(null), [E, D] = K(""), O = u({ "--ma-active-rating-text": y?.activeRatingText }), k = G(() => {
|
|
582
|
+
c?.(), T("copy"), D(x?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => T(null), rt);
|
|
583
|
+
}, [c, x?.copiedStatus]), A = G(() => {
|
|
584
|
+
l?.(), T("markdown"), D(x?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => T(null), rt);
|
|
611
585
|
}, [l, x?.copiedMarkdownStatus]);
|
|
612
|
-
return /* @__PURE__ */
|
|
586
|
+
return /* @__PURE__ */ Y("div", {
|
|
613
587
|
role: "toolbar",
|
|
614
588
|
"aria-label": x?.actionsGroup ?? "Message actions",
|
|
615
589
|
style: O,
|
|
616
590
|
className: d("flex gap-1", !g && "opacity-0 group-hover:opacity-100", _),
|
|
617
|
-
children: [/* @__PURE__ */
|
|
591
|
+
children: [/* @__PURE__ */ J("span", {
|
|
618
592
|
role: "status",
|
|
619
593
|
"aria-live": "polite",
|
|
620
594
|
className: "sr-only",
|
|
621
595
|
children: E
|
|
622
|
-
}), e === s.User ? /* @__PURE__ */
|
|
623
|
-
icon: /* @__PURE__ */
|
|
596
|
+
}), e === s.User ? /* @__PURE__ */ Y(q, { children: [t && /* @__PURE__ */ J(C, {
|
|
597
|
+
icon: /* @__PURE__ */ J(ve, {
|
|
624
598
|
size: p.SM,
|
|
625
599
|
"aria-hidden": !0
|
|
626
600
|
}),
|
|
627
|
-
size:
|
|
601
|
+
size: S.Small,
|
|
628
602
|
"aria-label": x?.editMessage ?? "Edit message",
|
|
629
603
|
tooltipProps: { tooltip: b?.edit ?? "Edit" },
|
|
630
604
|
onClick: t,
|
|
631
605
|
onMouseEnter: r,
|
|
632
606
|
onFocus: r
|
|
633
|
-
}), i && /* @__PURE__ */
|
|
634
|
-
icon: /* @__PURE__ */
|
|
607
|
+
}), i && /* @__PURE__ */ J(C, {
|
|
608
|
+
icon: /* @__PURE__ */ J(we, {
|
|
635
609
|
size: p.SM,
|
|
636
610
|
"aria-hidden": !0
|
|
637
611
|
}),
|
|
638
|
-
size:
|
|
612
|
+
size: S.Small,
|
|
639
613
|
"aria-label": x?.deleteMessage ?? "Delete message",
|
|
640
614
|
tooltipProps: { tooltip: b?.delete ?? "Delete" },
|
|
641
615
|
onClick: i
|
|
642
|
-
})] }) : /* @__PURE__ */
|
|
643
|
-
a && /* @__PURE__ */
|
|
644
|
-
icon: /* @__PURE__ */
|
|
616
|
+
})] }) : /* @__PURE__ */ Y(q, { children: [
|
|
617
|
+
a && /* @__PURE__ */ J(C, {
|
|
618
|
+
icon: /* @__PURE__ */ J(ye, {
|
|
645
619
|
size: p.SM,
|
|
646
620
|
"aria-hidden": !0
|
|
647
621
|
}),
|
|
648
|
-
size:
|
|
622
|
+
size: S.Small,
|
|
649
623
|
"aria-label": x?.regenerateResponse ?? "Regenerate response",
|
|
650
624
|
tooltipProps: { tooltip: b?.regenerate ?? "Regenerate" },
|
|
651
625
|
onClick: a
|
|
652
626
|
}),
|
|
653
|
-
c && /* @__PURE__ */
|
|
627
|
+
c && /* @__PURE__ */ J(n, {
|
|
654
628
|
onClick: k,
|
|
655
|
-
size:
|
|
656
|
-
isCopied:
|
|
629
|
+
size: S.Small,
|
|
630
|
+
isCopied: w === "copy",
|
|
657
631
|
copyLabel: b?.copy ?? "Copy",
|
|
658
632
|
copiedLabel: b?.copied ?? "Copied!",
|
|
659
633
|
ariaLabel: x?.copyResponse ?? "Copy response"
|
|
660
634
|
}),
|
|
661
|
-
l && /* @__PURE__ */
|
|
635
|
+
l && /* @__PURE__ */ J(n, {
|
|
662
636
|
onClick: A,
|
|
663
|
-
size:
|
|
664
|
-
isCopied:
|
|
637
|
+
size: S.Small,
|
|
638
|
+
isCopied: w === "markdown",
|
|
665
639
|
copyLabel: b?.copyMarkdown ?? "Copy as Markdown",
|
|
666
640
|
copiedLabel: b?.copiedMarkdown ?? "Copied!",
|
|
667
641
|
ariaLabel: x?.copyAsMarkdown ?? "Copy as markdown"
|
|
668
642
|
}),
|
|
669
|
-
f && /* @__PURE__ */
|
|
670
|
-
icon: /* @__PURE__ */
|
|
643
|
+
f && /* @__PURE__ */ J(C, {
|
|
644
|
+
icon: /* @__PURE__ */ J(Ce, {
|
|
671
645
|
size: p.SM,
|
|
672
646
|
"aria-hidden": !0
|
|
673
647
|
}),
|
|
674
|
-
size:
|
|
648
|
+
size: S.Small,
|
|
675
649
|
"aria-label": x?.likeResponse ?? "Like response",
|
|
676
650
|
"aria-pressed": h === o.Like,
|
|
677
|
-
className: h === o.Like ?
|
|
651
|
+
className: h === o.Like ? nt.activeRating : void 0,
|
|
678
652
|
tooltipProps: { tooltip: b?.like ?? "Like" },
|
|
679
653
|
onClick: f
|
|
680
654
|
}),
|
|
681
|
-
m && /* @__PURE__ */
|
|
682
|
-
icon: /* @__PURE__ */
|
|
655
|
+
m && /* @__PURE__ */ J(C, {
|
|
656
|
+
icon: /* @__PURE__ */ J(Se, {
|
|
683
657
|
size: p.SM,
|
|
684
658
|
"aria-hidden": !0
|
|
685
659
|
}),
|
|
686
|
-
size:
|
|
660
|
+
size: S.Small,
|
|
687
661
|
"aria-label": x?.dislikeResponse ?? "Dislike response",
|
|
688
662
|
"aria-pressed": h === o.Dislike,
|
|
689
|
-
className: h === o.Dislike ?
|
|
663
|
+
className: h === o.Dislike ? nt.activeRating : void 0,
|
|
690
664
|
tooltipProps: { tooltip: b?.dislike ?? "Dislike" },
|
|
691
665
|
onClick: m
|
|
692
666
|
})
|
|
@@ -699,31 +673,31 @@ var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e =
|
|
|
699
673
|
collapsedText: "_collapsedText_ovjc1_15",
|
|
700
674
|
startersDivider: "_startersDivider_ovjc1_26",
|
|
701
675
|
text: "_text_ovjc1_30"
|
|
702
|
-
},
|
|
703
|
-
let { colors: w, typography: T, className: E, bubbleClassName:
|
|
676
|
+
}, at = ({ 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 }) => {
|
|
677
|
+
let { colors: w, typography: T, className: E, bubbleClassName: O } = 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
678
|
"--cm-bubble-text": w?.text,
|
|
705
679
|
"--cm-starters-divider": w?.startersDivider
|
|
706
680
|
}), B = d($.text, T?.fontClassName), V = !!(h || g);
|
|
707
|
-
return /* @__PURE__ */
|
|
681
|
+
return /* @__PURE__ */ Y("div", {
|
|
708
682
|
role: "group",
|
|
709
683
|
"aria-label": I,
|
|
710
684
|
style: z,
|
|
711
685
|
className: d("flex w-full items-start gap-3", E),
|
|
712
|
-
children: [V && /* @__PURE__ */
|
|
686
|
+
children: [V && /* @__PURE__ */ J(r, {
|
|
713
687
|
src: h,
|
|
714
688
|
size: 28,
|
|
715
689
|
initialsName: g || L,
|
|
716
690
|
labels: { tooltip: g ?? L }
|
|
717
|
-
}), /* @__PURE__ */
|
|
691
|
+
}), /* @__PURE__ */ Y("div", {
|
|
718
692
|
className: "flex w-full min-w-0 max-w-full flex-col items-start gap-5",
|
|
719
|
-
children: [/* @__PURE__ */
|
|
720
|
-
className: d("flex w-full min-w-0 max-w-full flex-col items-start gap-4",
|
|
693
|
+
children: [/* @__PURE__ */ Y("div", {
|
|
694
|
+
className: d("flex w-full min-w-0 max-w-full flex-col items-start gap-4", O),
|
|
721
695
|
children: [
|
|
722
|
-
(e || c) && /* @__PURE__ */
|
|
696
|
+
(e || c) && /* @__PURE__ */ J("div", {
|
|
723
697
|
"aria-live": "polite",
|
|
724
698
|
"aria-atomic": "false",
|
|
725
699
|
className: d(B, "min-w-0 max-w-full text-start"),
|
|
726
|
-
children: /* @__PURE__ */
|
|
700
|
+
children: /* @__PURE__ */ J(i, {
|
|
727
701
|
content: e,
|
|
728
702
|
isStreaming: c,
|
|
729
703
|
thinkingLabel: N,
|
|
@@ -733,7 +707,7 @@ var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e =
|
|
|
733
707
|
codeBlockTheme: x
|
|
734
708
|
})
|
|
735
709
|
}),
|
|
736
|
-
/* @__PURE__ */
|
|
710
|
+
/* @__PURE__ */ J(Ze, {
|
|
737
711
|
attachments: R,
|
|
738
712
|
onAttachmentClick: (e) => v?.(l?.find((t) => t.id === e)),
|
|
739
713
|
onDownloadAll: y,
|
|
@@ -746,20 +720,20 @@ var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e =
|
|
|
746
720
|
selectedAttachmentId: C
|
|
747
721
|
}),
|
|
748
722
|
f,
|
|
749
|
-
/* @__PURE__ */
|
|
723
|
+
/* @__PURE__ */ J(it, {
|
|
750
724
|
...a,
|
|
751
725
|
isAlwaysVisible: o,
|
|
752
726
|
role: s.Assistant
|
|
753
727
|
})
|
|
754
728
|
]
|
|
755
|
-
}), p && p.length > 0 && m && /* @__PURE__ */
|
|
729
|
+
}), p && p.length > 0 && m && /* @__PURE__ */ J("div", {
|
|
756
730
|
role: "list",
|
|
757
731
|
"aria-label": M,
|
|
758
732
|
className: d("flex w-full flex-wrap gap-2 border-t pt-5", $.startersDivider),
|
|
759
|
-
children: p.map((e, t) => /* @__PURE__ */
|
|
733
|
+
children: p.map((e, t) => /* @__PURE__ */ J("div", {
|
|
760
734
|
role: "listitem",
|
|
761
735
|
className: "min-w-[40px]",
|
|
762
|
-
children: /* @__PURE__ */
|
|
736
|
+
children: /* @__PURE__ */ J(D, {
|
|
763
737
|
label: e.title,
|
|
764
738
|
className: "min-w-[40px]",
|
|
765
739
|
onClick: () => m(e)
|
|
@@ -768,18 +742,18 @@ var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e =
|
|
|
768
742
|
})]
|
|
769
743
|
})]
|
|
770
744
|
});
|
|
771
|
-
},
|
|
745
|
+
}, ot = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ J("div", {
|
|
772
746
|
role: "status",
|
|
773
747
|
"aria-live": "polite",
|
|
774
|
-
children: /* @__PURE__ */
|
|
748
|
+
children: /* @__PURE__ */ J(T, {
|
|
775
749
|
title: e,
|
|
776
750
|
message: t,
|
|
777
751
|
textClassName: "flex-row flex-wrap gap-1"
|
|
778
752
|
})
|
|
779
|
-
}),
|
|
753
|
+
}), st = /* @__PURE__ */ function(e) {
|
|
780
754
|
return e.Bottom = "Bottom", e.Top = "Top", e;
|
|
781
|
-
}({}),
|
|
782
|
-
let { colors: _, typography: v, className: y, bubbleClassName: b } = n ?? {}, { showMoreLabel: x = "Show more", showLessLabel:
|
|
755
|
+
}({}), ct = 10, lt = ({ text: e, position: t = st.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: a, collapsedLineCount: o = ct, labels: c, onAttachmentClick: l, onDownloadAll: m, onAttachmentRetry: h, selectedAttachmentId: g }) => {
|
|
756
|
+
let { colors: _, typography: v, className: y, bubbleClassName: b } = n ?? {}, { showMoreLabel: x = "Show more", showLessLabel: C = "Show less", showMoreAriaLabel: w, showLessAriaLabel: T, attachmentClickLabel: D, attachmentRetryLabel: O, attachmentOpenInNewTabLabel: k, userMessageAriaLabel: A = "User message" } = c ?? {}, { textRef: N, isTextCollapsed: P, isOverflowing: F, collapsedMaxHeight: I, expandedMaxHeight: L, isCollapsed: R, toggleCollapsed: z } = f({
|
|
783
757
|
text: e,
|
|
784
758
|
collapsedLineCount: o
|
|
785
759
|
}), B = u({
|
|
@@ -789,56 +763,56 @@ var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e =
|
|
|
789
763
|
"--cm-bubble-text": _?.text,
|
|
790
764
|
"--cm-bubble-collapsed-height": F ? `${I}px` : void 0,
|
|
791
765
|
"--cm-bubble-expanded-height": F ? `${L}px` : void 0
|
|
792
|
-
}), V = t ===
|
|
793
|
-
return /* @__PURE__ */
|
|
766
|
+
}), V = t === st.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", ee = d($.text, v?.fontClassName), H = w ?? x, U = T ?? C, te = R ? x : C, ne = R ? H : U, re = R ? j : M, ie = ke();
|
|
767
|
+
return /* @__PURE__ */ J("div", {
|
|
794
768
|
role: "group",
|
|
795
769
|
"aria-label": A,
|
|
796
770
|
style: B,
|
|
797
771
|
className: d("flex w-full", y),
|
|
798
|
-
children: /* @__PURE__ */
|
|
772
|
+
children: /* @__PURE__ */ Y("div", {
|
|
799
773
|
className: "ms-auto flex w-fit min-w-0 max-w-full flex-col items-end gap-4",
|
|
800
774
|
children: [
|
|
801
|
-
/* @__PURE__ */
|
|
775
|
+
/* @__PURE__ */ J(Ze, {
|
|
802
776
|
attachments: a ?? [],
|
|
803
777
|
onAttachmentClick: (e) => l?.(a?.find((t) => t.id === e)),
|
|
804
778
|
onDownloadAll: m,
|
|
805
779
|
onRetry: h,
|
|
806
780
|
labels: {
|
|
807
|
-
clickLabel:
|
|
781
|
+
clickLabel: D,
|
|
808
782
|
retryLabel: O,
|
|
809
783
|
openInNewTabLabel: k
|
|
810
784
|
},
|
|
811
785
|
styles: { className: "max-w-[640px]" },
|
|
812
786
|
selectedAttachmentId: g
|
|
813
787
|
}),
|
|
814
|
-
e && /* @__PURE__ */
|
|
788
|
+
e && /* @__PURE__ */ J("div", {
|
|
815
789
|
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__ */
|
|
790
|
+
children: /* @__PURE__ */ Y("div", {
|
|
817
791
|
className: "flex min-w-0 flex-col items-start",
|
|
818
|
-
children: [/* @__PURE__ */
|
|
819
|
-
id:
|
|
792
|
+
children: [/* @__PURE__ */ J("div", {
|
|
793
|
+
id: ie,
|
|
820
794
|
className: d("relative overflow-hidden", F && $.collapsibleText, F && !R && $.expandedText, P && $.collapsedText),
|
|
821
|
-
children: /* @__PURE__ */
|
|
822
|
-
ref:
|
|
823
|
-
className: d(
|
|
795
|
+
children: /* @__PURE__ */ J("p", {
|
|
796
|
+
ref: N,
|
|
797
|
+
className: d(ee, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
|
|
824
798
|
children: e
|
|
825
799
|
})
|
|
826
|
-
}), F && /* @__PURE__ */
|
|
827
|
-
label: /* @__PURE__ */
|
|
828
|
-
iconBefore: /* @__PURE__ */
|
|
800
|
+
}), F && /* @__PURE__ */ J(E, {
|
|
801
|
+
label: /* @__PURE__ */ J(q, { children: te }),
|
|
802
|
+
iconBefore: /* @__PURE__ */ J(re, {
|
|
829
803
|
size: p.SM,
|
|
830
804
|
"aria-hidden": "true"
|
|
831
805
|
}),
|
|
832
|
-
"aria-label":
|
|
806
|
+
"aria-label": ne,
|
|
833
807
|
"aria-expanded": !R,
|
|
834
|
-
"aria-controls":
|
|
808
|
+
"aria-controls": ie,
|
|
835
809
|
className: "mt-3",
|
|
836
810
|
onClick: z,
|
|
837
|
-
size:
|
|
811
|
+
size: S.Small
|
|
838
812
|
})]
|
|
839
813
|
})
|
|
840
814
|
}),
|
|
841
|
-
/* @__PURE__ */
|
|
815
|
+
/* @__PURE__ */ J(it, {
|
|
842
816
|
...r,
|
|
843
817
|
isAlwaysVisible: i,
|
|
844
818
|
role: s.User
|
|
@@ -846,16 +820,16 @@ var it = { activeRating: "_activeRating_7jito_1" }, at = 2e3, ot = ({ role: e =
|
|
|
846
820
|
]
|
|
847
821
|
})
|
|
848
822
|
});
|
|
849
|
-
},
|
|
823
|
+
}, ut = ({ role: e, onAttachmentClick: t, markdownComponents: n, ...r }) => e === s.Status ? /* @__PURE__ */ J(ot, { labels: {
|
|
850
824
|
titleText: r.labels?.statusTitleText,
|
|
851
825
|
bodyText: r.labels?.statusBodyText ?? ""
|
|
852
|
-
} }) : e === s.User ? /* @__PURE__ */
|
|
826
|
+
} }) : e === s.User ? /* @__PURE__ */ J(lt, {
|
|
853
827
|
...r,
|
|
854
828
|
onAttachmentClick: t
|
|
855
|
-
}) : /* @__PURE__ */
|
|
829
|
+
}) : /* @__PURE__ */ J(at, {
|
|
856
830
|
...r,
|
|
857
831
|
markdownComponents: n,
|
|
858
832
|
onAttachmentClick: t
|
|
859
833
|
});
|
|
860
834
|
//#endregion
|
|
861
|
-
export {
|
|
835
|
+
export { at as AssistantMessageBubble, st as BubblePosition, it as MessageActions, ut as MessageBubble, ot as StatusMessageBubble, lt as UserMessageBubble };
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epam/ai-dial-conversation-messages",
|
|
3
3
|
"description": "Message bubble components for rendering conversation history with actions and source citations",
|
|
4
|
-
"version": "1.1.0-dev.
|
|
4
|
+
"version": "1.1.0-dev.116",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./index.js",
|
|
@@ -19,8 +19,8 @@
|
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"react": "^19.0.0",
|
|
21
21
|
"@tabler/icons-react": "^3.0.0",
|
|
22
|
-
"@epam/ai-dial-chat-shared": "1.1.0-dev.
|
|
23
|
-
"@epam/ai-dial-conversation-input": "1.1.0-dev.
|
|
22
|
+
"@epam/ai-dial-chat-shared": "1.1.0-dev.116",
|
|
23
|
+
"@epam/ai-dial-conversation-input": "1.1.0-dev.116",
|
|
24
24
|
"react-markdown": "^10.1.0",
|
|
25
25
|
"@epam/ai-dial-ui-kit": "^0.13.0-dev.26"
|
|
26
26
|
},
|