@epam/ai-dial-conversation-stages 1.0.0-dev.486 → 1.0.0-dev.491

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.
Files changed (2) hide show
  1. package/index.js +331 -310
  2. package/package.json +3 -3
package/index.js CHANGED
@@ -1,17 +1,17 @@
1
1
  import { AttachmentErrorReason as e, AttachmentType as t, CodeBlockTheme as n, Highlight as r, MIME_TYPE_EXT_MAP as i, MarkdownRenderer as a, RequestStatus as o, ResponseFormat as s, StageStatus as c, buildCssVars as l, copyToClipboard as u, mergeClasses as d, messageAttachmentToDisplayAttachment as f } from "@epam/ai-dial-chat-shared";
2
2
  import { DIAL_ICON_SIZE as p, DialEllipsisTooltip as m, DialGhostIconButton as h, DialInput as g, DialLinkButton as _, DialPopup as v, DialPrimaryButton as y, DialRadioGroup as b, DialSkeleton as x, DialSkeletonVariant as S, DialSlider as C, DialSpinner as w, DialTag as T, DialTooltip as E, ElementSize as D, PopupSize as O, RadioGroupOrientation as k } from "@epam/ai-dial-ui-kit";
3
- import { IconAlertCircle as A, IconCheck as j, IconChevronDown as M, IconChevronRight as N, IconChevronUp as P, IconCircleCheck as F, IconClipboard as I, IconCopy as L, IconDownload as R, IconFile as z, IconFileTypeBmp as ee, IconFileTypeCss as te, IconFileTypeCsv as ne, IconFileTypeDoc as B, IconFileTypeDocx as re, IconFileTypeHtml as ie, IconFileTypeJpg as ae, IconFileTypeJs as oe, IconFileTypeJsx as se, IconFileTypePdf as ce, IconFileTypePhp as le, IconFileTypePng as ue, IconFileTypePpt as V, IconFileTypeRs as de, IconFileTypeSql as fe, IconFileTypeSvg as pe, IconFileTypeTs as me, IconFileTypeTsx as he, IconFileTypeTxt as ge, IconFileTypeVue as _e, IconFileTypeXls as ve, IconFileTypeXml as ye, IconFileTypeZip as be, IconMusic as xe, IconPaperclip as Se, IconPhoto as H, IconReload as Ce, IconTerminal2 as we, IconVideo as Te, IconX as Ee } from "@tabler/icons-react";
4
- import { memo as De, useCallback as Oe, useEffect as U, useMemo as ke, useRef as Ae, useState as W } from "react";
3
+ import { IconAlertCircle as A, IconCheck as j, IconChevronDown as M, IconChevronRight as N, IconChevronUp as P, IconCircleCheck as F, IconClipboard as I, IconCopy as L, IconDownload as ee, IconFile as R, IconFileTypeBmp as z, IconFileTypeCss as B, IconFileTypeCsv as V, IconFileTypeDoc as te, IconFileTypeDocx as ne, IconFileTypeHtml as re, IconFileTypeJpg as ie, IconFileTypeJs as H, IconFileTypeJsx as ae, IconFileTypePdf as oe, IconFileTypePhp as U, IconFileTypePng as se, IconFileTypePpt as ce, IconFileTypeRs as W, IconFileTypeSql as le, IconFileTypeSvg as ue, IconFileTypeTs as de, IconFileTypeTsx as fe, IconFileTypeTxt as pe, IconFileTypeVue as me, IconFileTypeXls as he, IconFileTypeXml as ge, IconFileTypeZip as _e, IconMusic as ve, IconPaperclip as ye, IconPhoto as be, IconReload as xe, IconTerminal2 as Se, IconVideo as Ce, IconX as we } from "@tabler/icons-react";
4
+ import { memo as Te, useCallback as Ee, useEffect as De, useId as Oe, useMemo as ke, useRef as Ae, useState as G } from "react";
5
5
  import "react-dom";
6
- import { Fragment as G, jsx as K, jsxs as q } from "react/jsx-runtime";
6
+ import { Fragment as K, jsx as q, jsxs as J } from "react/jsx-runtime";
7
7
  //#region ../attachment-input/dist/index.js
8
8
  var je = /* @__PURE__ */ function(e) {
9
9
  return e.Idle = "idle", e.Loading = "loading", e.Loaded = "loaded", e.Error = "error", e;
10
10
  }({}), Me = ({ enabled: e, src: t }) => {
11
- let n = Ae(null), [r, i] = W("idle");
12
- return U(() => {
11
+ let n = Ae(null), [r, i] = G("idle");
12
+ return De(() => {
13
13
  i(e && t ? "loading" : "idle");
14
- }, [e, t]), U(() => {
14
+ }, [e, t]), De(() => {
15
15
  let r = n.current;
16
16
  if (!r || !e || !t) return;
17
17
  let a = () => i("loaded"), o = () => i("error");
@@ -22,7 +22,7 @@ var je = /* @__PURE__ */ function(e) {
22
22
  imageRef: n,
23
23
  imageLoadStatus: r
24
24
  };
25
- }, J = {
25
+ }, Y = {
26
26
  card: "_card_ywrb5_1",
27
27
  cardError: "_cardError_ywrb5_6",
28
28
  cardSelected: "_cardSelected_ywrb5_10",
@@ -34,277 +34,285 @@ var je = /* @__PURE__ */ function(e) {
34
34
  actionBtn: "_actionBtn_ywrb5_32",
35
35
  removeBtnImage: "_removeBtnImage_ywrb5_43",
36
36
  hoverDownloadIcon: "_hoverDownloadIcon_ywrb5_51"
37
- }, Y = /* @__PURE__ */ function(e) {
37
+ }, Ne = /* @__PURE__ */ function(e) {
38
38
  return e.None = "none", e.AllVisible = "all-visible", e.Collapsed = "collapsed", e;
39
- }({}), Ne = (e) => {
39
+ }({}), Pe = (e) => {
40
40
  let t = e.lastIndexOf(".");
41
41
  return t > 0 ? e.slice(0, t) : e;
42
- }, Pe = (e) => {
43
- if (!e) return z;
42
+ }, Fe = (e) => {
43
+ if (!e) return R;
44
44
  if (e.startsWith("image/")) switch (e) {
45
45
  case "image/jpeg":
46
- case "image/jpg": return ae;
47
- case "image/png": return ue;
48
- case "image/svg+xml": return pe;
49
- case "image/bmp": return ee;
50
- default: return H;
46
+ case "image/jpg": return ie;
47
+ case "image/png": return se;
48
+ case "image/svg+xml": return ue;
49
+ case "image/bmp": return z;
50
+ default: return be;
51
51
  }
52
- if (e.startsWith("video/")) return Te;
53
- if (e.startsWith("audio/")) return xe;
52
+ if (e.startsWith("video/")) return Ce;
53
+ if (e.startsWith("audio/")) return ve;
54
54
  switch (e) {
55
- case "application/pdf": return ce;
55
+ case "application/pdf": return oe;
56
56
  case "application/msword":
57
- case "application/vnd.ms-word": return B;
58
- case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return re;
59
- case "application/vnd.ms-powerpoint": return V;
60
- case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return V;
61
- case "application/vnd.ms-excel": return ve;
62
- case "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": return ve;
57
+ case "application/vnd.ms-word": return te;
58
+ case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return ne;
59
+ case "application/vnd.ms-powerpoint": return ce;
60
+ case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return ce;
61
+ case "application/vnd.ms-excel": return he;
62
+ case "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": return he;
63
63
  case "application/zip":
64
64
  case "application/x-zip-compressed":
65
65
  case "application/x-rar-compressed":
66
66
  case "application/x-7z-compressed":
67
67
  case "application/gzip":
68
- case "application/x-tar": return be;
69
- case "text/csv": return ne;
70
- case "text/plain": return ge;
68
+ case "application/x-tar": return _e;
69
+ case "text/csv": return V;
70
+ case "text/plain": return pe;
71
71
  case "text/html":
72
- case "application/xhtml+xml": return ie;
72
+ case "application/xhtml+xml": return re;
73
73
  case "text/xml":
74
- case "application/xml": return ye;
74
+ case "application/xml": return ge;
75
75
  case "application/sql":
76
- case "text/x-sql": return fe;
76
+ case "text/x-sql": return le;
77
77
  case "text/javascript":
78
- case "application/javascript": return oe;
79
- case "text/jsx": return se;
78
+ case "application/javascript": return H;
79
+ case "text/jsx": return ae;
80
80
  case "application/typescript":
81
- case "text/typescript": return me;
82
- case "text/tsx": return he;
83
- case "text/css": return te;
81
+ case "text/typescript": return de;
82
+ case "text/tsx": return fe;
83
+ case "text/css": return B;
84
84
  case "text/x-php":
85
- case "application/x-php": return le;
85
+ case "application/x-php": return U;
86
86
  case "text/x-rustsrc":
87
- case "application/x-rust": return de;
88
- case "text/x-vue": return _e;
89
- default: return z;
87
+ case "application/x-rust": return W;
88
+ case "text/x-vue": return me;
89
+ default: return R;
90
90
  }
91
- }, Fe = (e) => {
92
- let { type: n, contentType: r } = e;
93
- return n === t.Prompt ? we : n === t.Pasted ? I : n === t.Image ? H : Pe(r ?? "");
94
91
  }, Ie = (e) => {
92
+ let { type: n, contentType: r } = e;
93
+ return n === t.Prompt ? Se : n === t.Pasted ? I : n === t.Image ? be : Fe(r ?? "");
94
+ }, Le = (e) => {
95
95
  let t = e.toLowerCase().split(";")[0].trim(), n = i[t];
96
96
  if (n) return n;
97
97
  let r = t.split("/")[1];
98
98
  if (r && !r.startsWith("vnd.") && !r.includes("+")) return r;
99
- }, Le = (e) => {
100
- let { type: n, name: r, contentType: i } = e;
101
- if (n === t.Prompt) return "Prompt";
102
- if (n === t.Pasted) return "Pasted";
103
- if (n === t.Image) return "Image";
104
- if (i) {
105
- let e = Ie(i);
99
+ }, Re = (e, n) => {
100
+ let { type: r, name: i, contentType: a } = e;
101
+ if (r === t.Prompt) return n.promptLabel ?? "Prompt";
102
+ if (r === t.Pasted) return n.pastedLabel ?? "Pasted";
103
+ if (r === t.Image) return n.imageLabel ?? "Image";
104
+ if (a) {
105
+ let e = Le(a);
106
106
  if (e) return `.${e}`;
107
107
  }
108
- let a = r.lastIndexOf(".");
109
- return a > 0 && a < r.length - 1 ? `.${r.slice(a + 1).toLowerCase()}` : r;
110
- }, Re = (e, n, r) => {
111
- let { type: i, status: a, previewUrl: s, url: c } = e, l = a === o.Loading, u = a === o.Error, f = i === t.Image && !!(s ?? c) && !u, p = i === t.Audio && !u, m = d(J.card, u && J.cardError, n && J.cardSelected, !u && !n && i === t.Prompt && J.cardPrompt, !u && !n && i === t.Pasted && J.cardPasted);
108
+ let o = i.lastIndexOf(".");
109
+ return o > 0 && o < i.length - 1 ? `.${i.slice(o + 1).toLowerCase()}` : i;
110
+ }, ze = (e, n, r, i = {}) => {
111
+ let { type: a, status: s, previewUrl: c, url: l } = e, u = s === o.Loading, f = s === o.Error, p = a === t.Image && !!(c ?? l) && !f, m = a === t.Audio && !f, h = d(Y.card, f && Y.cardError, n && Y.cardSelected, !f && !n && a === t.Prompt && Y.cardPrompt, !f && !n && a === t.Pasted && Y.cardPasted);
112
112
  return {
113
- isLoading: l,
114
- isError: u,
115
- isImage: f,
116
- isAudio: p,
117
- areActionsVisible: u || r,
118
- BottomIcon: Fe(e),
119
- typeLabel: Le(e),
120
- cardColorClass: m,
121
- removeBtnClass: f ? J.removeBtnImage : J.actionBtn
113
+ isLoading: u,
114
+ isError: f,
115
+ isImage: p,
116
+ isAudio: m,
117
+ areActionsVisible: f || r,
118
+ BottomIcon: Ie(e),
119
+ typeLabel: Re(e, i),
120
+ cardColorClass: h,
121
+ removeBtnClass: p ? Y.removeBtnImage : Y.actionBtn
122
122
  };
123
- }, ze = (e, t) => e <= 0 ? {
124
- layout: Y.None,
123
+ }, Be = (e, t) => e <= 0 ? {
124
+ layout: Ne.None,
125
125
  visibleCount: 0,
126
126
  hiddenCount: 0
127
127
  } : e < 5 || t ? {
128
- layout: Y.AllVisible,
128
+ layout: Ne.AllVisible,
129
129
  visibleCount: e,
130
130
  hiddenCount: 0
131
131
  } : {
132
- layout: Y.Collapsed,
132
+ layout: Ne.Collapsed,
133
133
  visibleCount: 4,
134
134
  hiddenCount: e - 4
135
- }, Be = ({ attachment: n, searchQuery: i = "", onRemove: a, onRetry: o, onExpand: s, onClick: c, isSelected: u, shouldAlwaysShowActions: f, labels: m, styles: g, showHoverDownloadIcon: _ = !1, className: v }) => {
136
- let { removeLabel: y = "Remove attachment", retryLabel: b = "Retry upload", clickLabel: C = "Open attachment" } = m ?? {}, { colors: T, typography: E, roundedClassName: O = "rounded-xl" } = g ?? {}, { id: k, name: A } = n, j = n.previewUrl ?? n.url, M = n.type === t.Pasted, N = M && s !== void 0, P = ke(() => M ? A : Ne(A), [M, A]), F = l({
137
- "--ci-card-border": T?.border,
138
- "--ci-card-bg": T?.background,
139
- "--ci-card-name": T?.nameText,
140
- "--ci-card-meta": T?.metaText
141
- }), { isLoading: I, isError: L, isImage: z, isAudio: ee, areActionsVisible: te, BottomIcon: ne, typeLabel: B, cardColorClass: re, removeBtnClass: ie } = ke(() => Re(n, u ?? !1, f ?? !1), [
135
+ }, Ve = ({ attachment: n, searchQuery: i = "", onRemove: a, onRetry: o, onExpand: s, onClick: c, isSelected: u, shouldAlwaysShowActions: f, labels: m, typeLabels: g, styles: _, showHoverDownloadIcon: v = !1, className: y }) => {
136
+ let { removeLabel: b = "Remove attachment", retryLabel: C = "Retry upload", clickLabel: T = "Open attachment", expandLabel: E = "Expand pasted text", loadingLabel: O = "Loading attachment", uploadFailedStatusLabel: k = "Upload failed" } = m ?? {}, { colors: A, typography: j, roundedClassName: M = "rounded-xl" } = _ ?? {}, { id: N, name: P } = n, F = n.previewUrl ?? n.url, I = n.type === t.Pasted, L = I && s !== void 0, R = ke(() => I ? P : Pe(P), [I, P]), z = l({
137
+ "--ci-card-border": A?.border,
138
+ "--ci-card-bg": A?.background,
139
+ "--ci-card-name": A?.nameText,
140
+ "--ci-card-meta": A?.metaText
141
+ }), { isLoading: B, isError: V, isImage: te, isAudio: ne, areActionsVisible: re, BottomIcon: ie, typeLabel: H, cardColorClass: ae, removeBtnClass: oe } = ke(() => ze(n, u ?? !1, f ?? !1, g), [
142
142
  n,
143
143
  u,
144
- f
145
- ]), ae = c !== void 0 && !N && !I && !L, oe = N || ae, { imageRef: se, imageLoadStatus: ce } = Me({
146
- enabled: z,
147
- src: j
144
+ f,
145
+ g
146
+ ]), U = c !== void 0 && !L && !B && !V, se = L || U, { imageRef: ce, imageLoadStatus: W } = Me({
147
+ enabled: te,
148
+ src: F
148
149
  }), le = () => {
149
- N && s ? s(k) : ae && c && c(k);
150
+ L && s ? s(N) : U && c && c(N);
150
151
  }, ue = (e) => {
151
152
  (e.key === "Enter" || e.key === " ") && (e.preventDefault(), le());
152
153
  };
153
- if (ee) return /* @__PURE__ */ q("div", {
154
- style: F,
155
- className: d("group flex w-full min-w-[280px] max-w-[300px] flex-col gap-2 border p-3", O, re, v),
156
- children: [/* @__PURE__ */ q("div", {
154
+ if (ne) return /* @__PURE__ */ J("div", {
155
+ style: z,
156
+ className: d("group flex w-full min-w-[280px] max-w-[300px] flex-col gap-2 border p-3", M, ae, y),
157
+ children: [/* @__PURE__ */ J("div", {
157
158
  className: "flex items-center justify-between gap-2",
158
- children: [/* @__PURE__ */ K("span", {
159
+ children: [/* @__PURE__ */ q("span", {
159
160
  title: n.name,
160
- className: d(E?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate", J.name),
161
- children: i ? /* @__PURE__ */ K(r, {
161
+ className: d(j?.fontClassName ?? "dial-tiny-text", "min-w-0 truncate", Y.name),
162
+ children: i ? /* @__PURE__ */ q(r, {
162
163
  text: n.name,
163
164
  query: i,
164
165
  maxLines: 1
165
166
  }) : n.name
166
- }), c && /* @__PURE__ */ K(h, {
167
- icon: /* @__PURE__ */ K(R, {
167
+ }), c && /* @__PURE__ */ q(h, {
168
+ icon: /* @__PURE__ */ q(ee, {
168
169
  size: p.SM,
169
170
  "aria-hidden": !0
170
171
  }),
171
172
  size: D.Small,
172
- className: d("h-6 w-6 shrink-0 rounded", ie),
173
- "aria-label": C,
173
+ className: d("h-6 w-6 shrink-0 rounded", oe),
174
+ "aria-label": T,
174
175
  onClick: (e) => {
175
- e.stopPropagation(), c(k);
176
+ e.stopPropagation(), c(N);
176
177
  }
177
178
  })]
178
- }), n.playUrl && /* @__PURE__ */ K("audio", {
179
+ }), n.playUrl && /* @__PURE__ */ q("audio", {
179
180
  controls: !0,
180
181
  src: n.playUrl,
182
+ "aria-label": n.name,
181
183
  className: "w-full",
182
184
  preload: "metadata"
183
185
  })]
184
186
  });
185
- let V = d("group relative flex h-[100px] w-[100px] flex-shrink-0 border focus-within:outline focus-within:outline-1 focus-within:outline-offset-1", O, re, !z && "flex-col gap-3 p-3", oe && "cursor-pointer", v), de = /* @__PURE__ */ q(G, { children: [
186
- z ? /* @__PURE__ */ q("div", {
187
+ let de = d("group relative flex h-[100px] w-[100px] flex-shrink-0 border focus-within:outline focus-within:outline-1 focus-within:outline-offset-1", M, ae, !te && "flex-col gap-3 p-3", se && "cursor-pointer", y), fe = /* @__PURE__ */ J(K, { children: [
188
+ te ? /* @__PURE__ */ J("div", {
187
189
  className: "relative h-full w-full overflow-hidden",
188
- children: [ce !== je.Loaded && /* @__PURE__ */ K(x, {
190
+ children: [W !== je.Loaded && /* @__PURE__ */ q(x, {
189
191
  variant: S.Rectangular,
190
192
  width: "100%",
191
193
  height: "100%",
192
- active: ce === je.Loading,
193
- overlay: /* @__PURE__ */ K(H, {
194
+ active: W === je.Loading,
195
+ overlay: /* @__PURE__ */ q(be, {
194
196
  size: p.LG,
195
- className: E?.placeholderIconClassName ?? "text-secondary",
197
+ className: j?.placeholderIconClassName ?? "text-secondary",
196
198
  "aria-hidden": !0
197
199
  }),
198
- className: d("absolute inset-0", O)
199
- }), /* @__PURE__ */ K("img", {
200
- ref: se,
201
- src: j,
202
- alt: A,
200
+ className: d("absolute inset-0", M)
201
+ }), /* @__PURE__ */ q("img", {
202
+ ref: ce,
203
+ src: F,
204
+ alt: P,
203
205
  loading: "lazy",
204
206
  decoding: "async",
205
- className: d("h-full w-full object-cover transition-opacity duration-200", ce === je.Loaded ? "opacity-100" : "opacity-0", O)
207
+ className: d("h-full w-full object-cover transition-opacity duration-200", W === je.Loaded ? "opacity-100" : "opacity-0", M)
206
208
  })]
207
- }) : L ? /* @__PURE__ */ q(G, { children: [/* @__PURE__ */ q("div", {
209
+ }) : V ? /* @__PURE__ */ J(K, { children: [/* @__PURE__ */ J("div", {
208
210
  className: "flex flex-row items-center gap-1 overflow-hidden",
209
- children: [/* @__PURE__ */ K(ne, {
211
+ children: [/* @__PURE__ */ q(ie, {
210
212
  size: p.SM,
211
- className: d("shrink-0", J.meta),
213
+ className: d("shrink-0", Y.meta),
212
214
  "aria-hidden": !0
213
- }), /* @__PURE__ */ K("span", {
214
- title: B,
215
- className: d(E?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", J.meta),
216
- children: B
215
+ }), /* @__PURE__ */ q("span", {
216
+ title: H,
217
+ className: d(j?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", Y.meta),
218
+ children: H
217
219
  })]
218
- }), /* @__PURE__ */ K("div", {
220
+ }), /* @__PURE__ */ q("div", {
219
221
  className: "min-w-0 flex-1",
220
- children: /* @__PURE__ */ K("div", {
221
- title: P,
222
- className: d(E?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", J.name),
223
- children: i ? /* @__PURE__ */ K(r, {
224
- text: P,
222
+ children: /* @__PURE__ */ q("div", {
223
+ title: R,
224
+ className: d(j?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", Y.name),
225
+ children: i ? /* @__PURE__ */ q(r, {
226
+ text: R,
225
227
  query: i,
226
228
  maxLines: 3
227
- }) : P
229
+ }) : R
228
230
  })
229
- })] }) : /* @__PURE__ */ q(G, { children: [/* @__PURE__ */ K("div", {
231
+ })] }) : /* @__PURE__ */ J(K, { children: [/* @__PURE__ */ q("div", {
230
232
  className: "min-w-0 flex-1",
231
- children: /* @__PURE__ */ K("div", {
232
- title: P,
233
- className: d(E?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", J.name),
234
- children: i ? /* @__PURE__ */ K(r, {
235
- text: P,
233
+ children: /* @__PURE__ */ q("div", {
234
+ title: R,
235
+ className: d(j?.fontClassName ?? "dial-tiny-text", "line-clamp-3 break-words", Y.name),
236
+ children: i ? /* @__PURE__ */ q(r, {
237
+ text: R,
236
238
  query: i,
237
239
  maxLines: 3
238
- }) : P
240
+ }) : R
239
241
  })
240
- }), /* @__PURE__ */ q("div", {
242
+ }), /* @__PURE__ */ J("div", {
241
243
  className: "flex flex-row items-center gap-1 overflow-hidden",
242
- children: [/* @__PURE__ */ K(ne, {
244
+ children: [/* @__PURE__ */ q(ie, {
243
245
  size: p.SM,
244
- className: d("shrink-0", J.meta),
246
+ className: d("shrink-0", Y.meta),
245
247
  "aria-hidden": !0
246
- }), /* @__PURE__ */ K("span", {
247
- title: B,
248
- className: d(E?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", J.meta),
249
- children: B
248
+ }), /* @__PURE__ */ q("span", {
249
+ title: H,
250
+ className: d(j?.metaClassName ?? "dial-tiny-text", "min-w-0 truncate", Y.meta),
251
+ children: H
250
252
  })]
251
253
  })] }),
252
- I && /* @__PURE__ */ K("span", {
253
- className: d("absolute inset-0 flex items-center justify-center", O, J.loadingOverlay),
254
- children: /* @__PURE__ */ K(w, {
254
+ B && /* @__PURE__ */ q("span", {
255
+ className: d("absolute inset-0 flex items-center justify-center", M, Y.loadingOverlay),
256
+ children: /* @__PURE__ */ q(w, {
255
257
  size: 40,
256
- ariaLabel: "Loading attachment",
258
+ ariaLabel: O,
257
259
  className: "z-50"
258
260
  })
259
261
  }),
260
- !I && /* @__PURE__ */ q("div", {
261
- className: d("absolute end-1 top-1 flex gap-1 transition-opacity", te ? "opacity-100" : "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 mobile:opacity-100"),
262
+ /* @__PURE__ */ q("span", {
263
+ role: "status",
264
+ "aria-live": "polite",
265
+ className: "sr-only",
266
+ children: V ? k : ""
267
+ }),
268
+ !B && /* @__PURE__ */ J("div", {
269
+ className: d("absolute end-1 top-1 flex gap-1 transition-opacity", re ? "opacity-100" : "opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 mobile:opacity-100"),
262
270
  children: [
263
- L && o && n.errorReason !== e.UnsupportedType && /* @__PURE__ */ K(h, {
264
- icon: /* @__PURE__ */ K(Ce, {
271
+ V && o && n.errorReason !== e.UnsupportedType && /* @__PURE__ */ q(h, {
272
+ icon: /* @__PURE__ */ q(xe, {
265
273
  size: p.SM,
266
274
  "aria-hidden": !0
267
275
  }),
268
276
  size: D.Small,
269
- className: d("h-6 w-6 rounded", ie),
270
- "aria-label": b,
277
+ className: d("h-6 w-6 rounded", oe),
278
+ "aria-label": C,
271
279
  onClick: (e) => {
272
- e.stopPropagation(), o(k);
280
+ e.stopPropagation(), o(N);
273
281
  }
274
282
  }),
275
- a && /* @__PURE__ */ K(h, {
276
- icon: /* @__PURE__ */ K(Ee, {
283
+ a && /* @__PURE__ */ q(h, {
284
+ icon: /* @__PURE__ */ q(we, {
277
285
  size: p.SM,
278
286
  "aria-hidden": !0
279
287
  }),
280
288
  size: D.Small,
281
- className: d("h-6 w-6 rounded", ie),
282
- "aria-label": y,
289
+ className: d("h-6 w-6 rounded", oe),
290
+ "aria-label": b,
283
291
  onClick: (e) => {
284
- e.stopPropagation(), a?.(k);
292
+ e.stopPropagation(), a?.(N);
285
293
  }
286
294
  }),
287
- _ && !a && !L && /* @__PURE__ */ K(R, {
295
+ v && !a && !V && /* @__PURE__ */ q(ee, {
288
296
  size: p.SM,
289
297
  "aria-hidden": !0,
290
- className: d("h-6 w-6 rounded-lg p-1", J.hoverDownloadIcon)
298
+ className: d("h-6 w-6 rounded-lg p-1", Y.hoverDownloadIcon)
291
299
  })
292
300
  ]
293
301
  })
294
302
  ] });
295
- return oe ? /* @__PURE__ */ K("div", {
296
- style: F,
297
- className: V,
303
+ return se ? /* @__PURE__ */ q("div", {
304
+ style: z,
305
+ className: de,
298
306
  onClick: le,
299
307
  onKeyDown: ue,
300
308
  tabIndex: 0,
301
309
  role: "button",
302
- "aria-label": ae ? C : void 0,
303
- children: de
304
- }) : /* @__PURE__ */ K("div", {
305
- style: F,
306
- className: V,
307
- children: de
310
+ "aria-label": U ? T : L ? E : void 0,
311
+ children: fe
312
+ }) : /* @__PURE__ */ q("div", {
313
+ style: z,
314
+ className: de,
315
+ children: fe
308
316
  });
309
317
  }, X = {
310
318
  tile: "_tile_488nu_1",
@@ -317,76 +325,87 @@ var je = /* @__PURE__ */ function(e) {
317
325
  track: "_track_488nu_45",
318
326
  indeterminateFill: "_indeterminateFill_488nu_49",
319
327
  "attachment-tile-indeterminate": "_attachment-tile-indeterminate_488nu_1"
320
- }, Ve = {
328
+ }, He = {
321
329
  [e.Network]: "Upload failed · network error",
322
330
  [e.UnsupportedType]: "Upload failed · unsupported file type"
323
- }, He = ({ attachment: t, onClick: r, onRetry: i, labels: a, styles: s, theme: c = n.Dark, className: l }) => {
324
- let { clickLabel: u = "Download attachment", retryLabel: f = "Retry upload", sizeLabel: m } = a ?? {}, { nameClassName: g = "dial-caption-text", metaClassName: _ = "dial-caption-text" } = s ?? {}, { id: v, name: y, status: b, errorReason: x } = t, S = b === o.Loading, C = b === o.Error, w = C && (x && Ve[x] || "Upload failed"), { BottomIcon: T, typeLabel: E } = Re(t, !1, !1), O = !C && !S && r !== void 0, k = C && !!i && x !== e.UnsupportedType, A = O || k ? "pe-5" : void 0, j = () => {
325
- O && r?.(t);
326
- }, M = (e) => {
327
- (e.key === "Enter" || e.key === " ") && O && (e.preventDefault(), j());
328
- }, N = d("group relative flex size-[84px] flex-col justify-between gap-1 overflow-hidden rounded-xl border p-1.5", X.tile, !C && c === n.Light && X.tileLight, C && X.tileError), P = /* @__PURE__ */ K("div", {
329
- title: y,
330
- className: d(g, "line-clamp-2 min-w-0 break-words", X.nameText, !C && A),
331
- children: y
332
- }), F = /* @__PURE__ */ q("div", {
333
- className: d("flex items-center gap-1 overflow-hidden", C && A),
334
- children: [/* @__PURE__ */ K(T, {
331
+ }, Ue = ({ attachment: t, onClick: r, onRetry: i, labels: a, typeLabels: s, styles: c, theme: l = n.Dark, className: u }) => {
332
+ let { clickLabel: f = "Download attachment", retryLabel: m = "Retry upload", sizeLabel: g, uploadingLabel: _ = "Uploading", errorReasonLabels: v, genericErrorLabel: y = "Upload failed" } = a ?? {}, { nameClassName: b = "dial-caption-text", metaClassName: x = "dial-caption-text" } = c ?? {}, { id: S, name: C, status: w, errorReason: T } = t, E = w === o.Loading, O = w === o.Error, k = Oe(), A = O && (T && (v?.[T] ?? He[T]) || y), { BottomIcon: j, typeLabel: M } = ze(t, !1, !1, s), N = !O && !E && r !== void 0, P = O && !!i && T !== e.UnsupportedType, F = N || P ? "pe-5" : void 0, I = () => {
333
+ N && r?.(t);
334
+ }, L = (e) => {
335
+ (e.key === "Enter" || e.key === " ") && N && (e.preventDefault(), I());
336
+ }, R = d("group relative flex size-[84px] flex-col justify-between gap-1 overflow-hidden rounded-xl border p-1.5", X.tile, !O && l === n.Light && X.tileLight, O && X.tileError), z = /* @__PURE__ */ q("div", {
337
+ title: C,
338
+ className: d(b, "line-clamp-2 min-w-0 break-words", X.nameText, !O && F),
339
+ children: C
340
+ }), B = /* @__PURE__ */ J("div", {
341
+ className: d("flex items-center gap-1 overflow-hidden", O && F),
342
+ children: [/* @__PURE__ */ q(j, {
335
343
  size: 16,
336
344
  className: X.typeText,
337
345
  "aria-hidden": !0
338
- }), /* @__PURE__ */ K("span", {
339
- className: d(_, "truncate", X.typeText),
340
- children: m ? `${E} · ${m}` : E
346
+ }), /* @__PURE__ */ q("span", {
347
+ className: d(x, "truncate", X.typeText),
348
+ children: g ? `${M} · ${g}` : M
341
349
  })]
342
- }), I = /* @__PURE__ */ q(G, { children: [
343
- C ? /* @__PURE__ */ q(G, { children: [F, P] }) : /* @__PURE__ */ q(G, { children: [P, F] }),
344
- S && /* @__PURE__ */ K("div", {
350
+ }), V = /* @__PURE__ */ J(K, { children: [
351
+ O ? /* @__PURE__ */ J(K, { children: [B, z] }) : /* @__PURE__ */ J(K, { children: [z, B] }),
352
+ E && /* @__PURE__ */ q("div", {
345
353
  role: "progressbar",
346
- "aria-label": "Uploading",
354
+ "aria-label": _,
347
355
  className: d("absolute inset-x-2 bottom-2 h-[3px] overflow-hidden rounded-full", X.track),
348
- children: /* @__PURE__ */ K("div", { className: d("h-full w-1/3 rounded-full", X.indeterminateFill) })
356
+ children: /* @__PURE__ */ q("div", { className: d("h-full w-1/3 rounded-full", X.indeterminateFill) })
349
357
  }),
350
- O && /* @__PURE__ */ K(R, {
358
+ N && /* @__PURE__ */ q(ee, {
351
359
  size: p.SM,
352
360
  "aria-hidden": !0,
353
361
  className: d("absolute end-1 top-1 h-6 w-6 rounded-lg p-1 opacity-0 transition-opacity group-hover:opacity-100 mobile:opacity-100", X.hoverIcon)
354
362
  }),
355
- k && /* @__PURE__ */ K(h, {
356
- icon: /* @__PURE__ */ K(Ce, {
363
+ P && /* @__PURE__ */ q(h, {
364
+ icon: /* @__PURE__ */ q(xe, {
357
365
  size: p.SM,
358
366
  "aria-hidden": !0
359
367
  }),
360
368
  size: D.Small,
361
369
  className: d("absolute end-1 top-1 h-6 w-6 rounded-lg", X.retryIcon),
362
- "aria-label": f,
370
+ "aria-label": m,
371
+ "aria-describedby": A ? k : void 0,
363
372
  onClick: (e) => {
364
- e.stopPropagation(), i(v);
373
+ e.stopPropagation(), i(S);
365
374
  }
375
+ }),
376
+ O && /* @__PURE__ */ q("span", {
377
+ id: k,
378
+ role: "status",
379
+ "aria-live": "polite",
380
+ className: "sr-only",
381
+ children: A
366
382
  })
367
383
  ] });
368
- return /* @__PURE__ */ K("div", {
369
- className: d("inline-flex", l),
370
- children: O ? /* @__PURE__ */ K("div", {
384
+ return /* @__PURE__ */ q("div", {
385
+ className: d("inline-flex", u),
386
+ children: N ? /* @__PURE__ */ q("div", {
371
387
  role: "button",
372
388
  tabIndex: 0,
373
- "aria-label": u,
374
- onClick: j,
375
- onKeyDown: M,
376
- className: d(N, "cursor-pointer focus-within:outline focus-within:outline-1 focus-within:outline-offset-1"),
377
- children: I
378
- }) : /* @__PURE__ */ K("div", {
379
- className: N,
380
- title: w || void 0,
381
- children: I
389
+ "aria-label": f,
390
+ onClick: I,
391
+ onKeyDown: L,
392
+ className: d(R, "cursor-pointer focus-within:outline focus-within:outline-1 focus-within:outline-offset-1"),
393
+ children: V
394
+ }) : /* @__PURE__ */ q("div", {
395
+ className: R,
396
+ title: A || void 0,
397
+ role: O ? "group" : void 0,
398
+ "aria-describedby": O ? k : void 0,
399
+ tabIndex: O ? 0 : void 0,
400
+ children: V
382
401
  })
383
402
  });
384
- }, Ue = { tile: "_tile_1s4d7_1" }, We = ({ count: e, onClick: t, ariaLabel: n, children: r, fontClassName: i = "dial-small-semi-text", className: a }) => /* @__PURE__ */ K("button", {
403
+ }, We = { tile: "_tile_1s4d7_1" }, Ge = ({ count: e, onClick: t, ariaLabel: n, children: r, fontClassName: i = "dial-small-semi-text", className: a }) => /* @__PURE__ */ q("button", {
385
404
  type: "button",
386
405
  onClick: t,
387
406
  "aria-label": n ?? `Show ${e} more attachments`,
388
- className: d("flex size-[84px] items-center justify-center rounded-xl border", i, Ue.tile, a),
389
- children: r ?? /* @__PURE__ */ K("bdi", {
407
+ className: d("flex size-[84px] items-center justify-center rounded-xl border", i, We.tile, a),
408
+ children: r ?? /* @__PURE__ */ q("bdi", {
390
409
  dir: "ltr",
391
410
  children: `+${e}`
392
411
  })
@@ -396,83 +415,85 @@ var je = /* @__PURE__ */ function(e) {
396
415
  headerLabel: "_headerLabel_7fktb_7",
397
416
  downloadAllButton: "_downloadAllButton_7fktb_8",
398
417
  imageTile: "_imageTile_7fktb_12"
399
- }, Ge = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, Ke = ({ attachments: e, onAttachmentClick: n, onDownloadAll: r, onRetry: i, getSizeLabel: a, labels: s, styles: c, theme: l, className: u }) => {
400
- let { ariaLabel: f = "Attachments", clickLabel: m = "Download attachment", retryLabel: g = "Retry upload", showLessLabel: _ = "Show less", downloadAllLabel: v = "Download all" } = s ?? {}, { headerLabelClassName: y = "dial-tiny-semi-text" } = c ?? {}, [b, x] = W(!1), S = ke(() => ze(e.length, b), [e.length, b]);
418
+ }, Ke = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, qe = ({ attachments: e, onAttachmentClick: n, onDownloadAll: r, onRetry: i, getSizeLabel: a, labels: s, typeLabels: c, styles: l, theme: u, className: f }) => {
419
+ let { ariaLabel: m = "Attachments", clickLabel: g = "Download attachment", retryLabel: _ = "Retry upload", showLessLabel: v = "Show less", downloadAllLabel: y = "Download all", getHeaderLabel: b = (e) => Ke(e, "attachment") } = s ?? {}, { headerLabelClassName: x = "dial-tiny-semi-text" } = l ?? {}, [S, C] = G(!1), w = ke(() => Be(e.length, S), [e.length, S]);
401
420
  if (e.length === 0) return null;
402
- let C = e.some((e) => e.type === t.Image), w = e.some((e) => e.type !== t.Image), T = C && w, E = e.length >= 5, D = T ? Se : C ? H : z, O = Ge(e.length, "attachment"), k = e.slice(0, S.visibleCount);
403
- return /* @__PURE__ */ q("div", {
421
+ let T = e.some((e) => e.type === t.Image), E = e.some((e) => e.type !== t.Image), D = T && E, O = e.length >= 5, k = D ? ye : T ? be : R, A = b(e.length), j = e.slice(0, w.visibleCount);
422
+ return /* @__PURE__ */ J("div", {
404
423
  role: "group",
405
- "aria-label": f,
406
- className: d("rounded-2xl border p-3", E ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", Z.container, u),
407
- children: [/* @__PURE__ */ q("div", {
424
+ "aria-label": m,
425
+ className: d("rounded-2xl border p-3", O ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", Z.container, f),
426
+ children: [/* @__PURE__ */ J("div", {
408
427
  className: "mb-3 flex min-h-6 items-center gap-2",
409
428
  children: [
410
- /* @__PURE__ */ K(D, {
429
+ /* @__PURE__ */ q(k, {
411
430
  size: p.SM,
412
431
  className: d("shrink-0", Z.headerIcon),
413
432
  "aria-hidden": !0
414
433
  }),
415
- /* @__PURE__ */ K("span", {
416
- className: d(y, Z.headerLabel),
417
- children: O
434
+ /* @__PURE__ */ q("span", {
435
+ className: d(x, Z.headerLabel),
436
+ children: A
418
437
  }),
419
- e.length >= 2 && (r || n) && /* @__PURE__ */ K(h, {
420
- icon: /* @__PURE__ */ K(R, {
438
+ e.length >= 2 && (r || n) && /* @__PURE__ */ q(h, {
439
+ icon: /* @__PURE__ */ q(ee, {
421
440
  size: p.SM,
422
441
  "aria-hidden": !0
423
442
  }),
424
443
  className: d("ms-auto h-6 w-6 rounded-lg", Z.downloadAllButton),
425
- "aria-label": v,
444
+ "aria-label": y,
426
445
  onClick: () => {
427
446
  let t = e.filter((e) => e.status === o.Idle);
428
447
  r ? r(t) : t.forEach((e) => n?.(e));
429
448
  }
430
449
  })
431
450
  ]
432
- }), /* @__PURE__ */ q("div", {
451
+ }), /* @__PURE__ */ J("div", {
433
452
  role: "list",
434
- "aria-label": O,
435
- className: d("gap-3", E ? "grid grid-cols-[repeat(5,84px)] overflow-x-auto" : "flex flex-wrap"),
453
+ "aria-label": A,
454
+ className: d("gap-3", O ? "grid grid-cols-[repeat(5,84px)] overflow-x-auto" : "flex flex-wrap"),
436
455
  children: [
437
- k.map((e) => /* @__PURE__ */ K("div", {
456
+ j.map((e) => /* @__PURE__ */ q("div", {
438
457
  role: "listitem",
439
- children: e.type === t.Image ? /* @__PURE__ */ K(Be, {
458
+ children: e.type === t.Image ? /* @__PURE__ */ q(Ve, {
440
459
  attachment: e,
441
460
  onClick: n ? () => n(e) : void 0,
442
461
  onRetry: i,
443
462
  labels: {
444
- clickLabel: m,
445
- retryLabel: g
463
+ clickLabel: g,
464
+ retryLabel: _
446
465
  },
466
+ typeLabels: c,
447
467
  styles: { roundedClassName: "rounded-xl" },
448
468
  showHoverDownloadIcon: !0,
449
469
  className: d("size-[84px]", Z.imageTile)
450
- }) : /* @__PURE__ */ K(He, {
470
+ }) : /* @__PURE__ */ q(Ue, {
451
471
  attachment: e,
452
472
  onClick: n,
453
473
  onRetry: i,
454
474
  labels: {
455
- clickLabel: m,
456
- retryLabel: g,
475
+ clickLabel: g,
476
+ retryLabel: _,
457
477
  sizeLabel: a?.(e)
458
478
  },
459
- theme: l
479
+ typeLabels: c,
480
+ theme: u
460
481
  })
461
482
  }, e.id)),
462
- S.layout === Y.Collapsed && /* @__PURE__ */ K("div", {
483
+ w.layout === Ne.Collapsed && /* @__PURE__ */ q("div", {
463
484
  role: "listitem",
464
- children: /* @__PURE__ */ K(We, {
465
- count: S.hiddenCount,
466
- onClick: () => x(!0)
485
+ children: /* @__PURE__ */ q(Ge, {
486
+ count: w.hiddenCount,
487
+ onClick: () => C(!0)
467
488
  })
468
489
  }),
469
- E && b && /* @__PURE__ */ K("div", {
490
+ O && S && /* @__PURE__ */ q("div", {
470
491
  role: "listitem",
471
- children: /* @__PURE__ */ K(We, {
492
+ children: /* @__PURE__ */ q(Ge, {
472
493
  count: 0,
473
- onClick: () => x(!1),
474
- ariaLabel: _,
475
- children: /* @__PURE__ */ K(P, {
494
+ onClick: () => C(!1),
495
+ ariaLabel: v,
496
+ children: /* @__PURE__ */ q(P, {
476
497
  size: p.MD,
477
498
  "aria-hidden": !0
478
499
  })
@@ -481,25 +502,25 @@ var je = /* @__PURE__ */ function(e) {
481
502
  ]
482
503
  })]
483
504
  });
484
- }, qe = {
505
+ }, Je = {
485
506
  tab: "_tab_1mi6x_1",
486
507
  tabActive: "_tabActive_1mi6x_13"
487
508
  };
488
- De(({ tabs: e, activeTabId: t, onTabChange: n, tabClassName: r = "dial-tiny-semi-text" }) => /* @__PURE__ */ K("div", {
509
+ Te(({ tabs: e, activeTabId: t, onTabChange: n, tabClassName: r = "dial-tiny-semi-text" }) => /* @__PURE__ */ q("div", {
489
510
  className: "flex flex-nowrap gap-1",
490
511
  children: e.map((e) => {
491
512
  let i = t === e.id;
492
- return /* @__PURE__ */ K(T, {
513
+ return /* @__PURE__ */ q(T, {
493
514
  label: e.label,
494
515
  selected: i,
495
516
  onClick: () => n(e.id),
496
- className: d("box-border h-auto shrink-0 justify-center rounded-full p-2 text-center", r, qe.tab, i && qe.tabActive)
517
+ className: d("box-border h-auto shrink-0 justify-center rounded-full p-2 text-center", r, Je.tab, i && Je.tabActive)
497
518
  }, e.id);
498
519
  })
499
520
  }));
500
- var Je = (e) => /* @__PURE__ */ K(y, { ...e }), Ye = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
501
- let [s, c] = W(t), [l, u] = W(n), [d, f] = W(r), p = Ae(o);
502
- U(() => {
521
+ var Ye = (e) => /* @__PURE__ */ q(y, { ...e }), Xe = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
522
+ let [s, c] = G(t), [l, u] = G(n), [d, f] = G(r), p = Ae(o);
523
+ De(() => {
503
524
  o && !p.current && (c(t), u(n), f(r)), p.current = o;
504
525
  }, [
505
526
  o,
@@ -516,7 +537,7 @@ var Je = (e) => /* @__PURE__ */ K(y, { ...e }), Ye = ({ features: e, initialResp
516
537
  setResponseFormat: c,
517
538
  setSystemPrompt: u,
518
539
  setTemperature: f,
519
- handleSubmit: Oe(() => {
540
+ handleSubmit: Ee(() => {
520
541
  if (!m) return;
521
542
  let t = {};
522
543
  e.responseFormat && s != null && (t.responseFormat = s), e.systemPrompt && (t.systemPrompt = l), e.temperature && (t.temperature = d), i(t), a();
@@ -530,16 +551,16 @@ var Je = (e) => /* @__PURE__ */ K(y, { ...e }), Ye = ({ features: e, initialResp
530
551
  a
531
552
  ])
532
553
  };
533
- }, Xe = "!text-[14px] !leading-[20px] font-semibold !text-primary gap-1", Ze = ({ features: e, responseFormat: t, systemPrompt: n, temperature: r, onResponseFormatChange: i, onSystemPromptChange: a, onTemperatureChange: o, responseFormatLabel: c = "Response format", responseFormatHint: l = "Applies to new and existing messages", responseFormatMarkdownLabel: u = "Markdown", responseFormatPlainTextLabel: d = "Plain text", systemPromptLabel: f = "System prompt", systemPromptTooltip: p = "Enter a prompt", temperatureLabel: m = "Temperature", temperatureLabels: h = [
554
+ }, Ze = "!text-[14px] !leading-[20px] font-semibold !text-primary gap-1", Qe = ({ features: e, responseFormat: t, systemPrompt: n, temperature: r, onResponseFormatChange: i, onSystemPromptChange: a, onTemperatureChange: o, responseFormatLabel: c = "Response format", responseFormatHint: l = "Applies to new and existing messages", responseFormatMarkdownLabel: u = "Markdown", responseFormatPlainTextLabel: d = "Plain text", systemPromptLabel: f = "System prompt", systemPromptTooltip: p = "Enter a prompt", temperatureLabel: m = "Temperature", temperatureLabels: h = [
534
555
  "Precise",
535
556
  "Neutral",
536
557
  "Creative"
537
- ], temperatureHint: _ }) => /* @__PURE__ */ q("div", {
558
+ ], temperatureHint: _ }) => /* @__PURE__ */ J("div", {
538
559
  className: "flex flex-col gap-4 px-6 py-3",
539
560
  children: [
540
- e.responseFormat && /* @__PURE__ */ K(b, {
561
+ e.responseFormat && /* @__PURE__ */ q(b, {
541
562
  fieldTitle: c,
542
- labelClassName: Xe,
563
+ labelClassName: Ze,
543
564
  elementId: "response-format",
544
565
  orientation: k.Column,
545
566
  activeRadioButton: t ?? s.Markdown,
@@ -553,19 +574,19 @@ var Je = (e) => /* @__PURE__ */ K(y, { ...e }), Ye = ({ features: e, initialResp
553
574
  }],
554
575
  onChange: (e) => i(e)
555
576
  }),
556
- e.systemPrompt && /* @__PURE__ */ K(g, {
577
+ e.systemPrompt && /* @__PURE__ */ q(g, {
557
578
  value: n,
558
579
  placeholder: p,
559
580
  labelProps: {
560
- className: Xe,
581
+ className: Ze,
561
582
  label: f
562
583
  },
563
584
  onChange: (e) => a(e ?? "")
564
585
  }),
565
- e.temperature && /* @__PURE__ */ K(C, {
586
+ e.temperature && /* @__PURE__ */ q(C, {
566
587
  labelProps: {
567
588
  label: m,
568
- className: Xe,
589
+ className: Ze,
569
590
  caption: _
570
591
  },
571
592
  value: r,
@@ -577,8 +598,8 @@ var Je = (e) => /* @__PURE__ */ K(y, { ...e }), Ye = ({ features: e, initialResp
577
598
  })
578
599
  ]
579
600
  });
580
- 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: h, saveLabel: g = "Apply changes", saveDisabledTooltip: _ }) => {
581
- let { responseFormat: y, systemPrompt: b, temperature: x, canSubmit: S, setResponseFormat: C, setSystemPrompt: w, setTemperature: T, handleSubmit: D } = Ye({
601
+ Te(({ 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: h, saveLabel: g = "Apply changes", saveDisabledTooltip: _ }) => {
602
+ let { responseFormat: y, systemPrompt: b, temperature: x, canSubmit: S, setResponseFormat: C, setSystemPrompt: w, setTemperature: T, handleSubmit: D } = Xe({
582
603
  features: e,
583
604
  initialResponseFormat: t,
584
605
  initialSystemPrompt: n,
@@ -586,25 +607,25 @@ De(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
586
607
  onSave: i,
587
608
  onClose: a
588
609
  });
589
- return /* @__PURE__ */ K(v, {
610
+ return /* @__PURE__ */ q(v, {
590
611
  open: !0,
591
612
  header: o,
592
613
  size: O.Sm,
593
614
  onClose: a,
594
615
  className: "!bg-layer-2",
595
- footer: /* @__PURE__ */ K("div", {
616
+ footer: /* @__PURE__ */ q("div", {
596
617
  className: "flex justify-end px-6 py-4",
597
- children: /* @__PURE__ */ K(E, {
618
+ children: /* @__PURE__ */ q(E, {
598
619
  tooltip: _,
599
620
  hideTooltip: S || !_,
600
- children: /* @__PURE__ */ K(Je, {
621
+ children: /* @__PURE__ */ q(Ye, {
601
622
  label: g,
602
623
  onClick: D,
603
624
  disabled: !S
604
625
  })
605
626
  })
606
627
  }),
607
- children: /* @__PURE__ */ K(Ze, {
628
+ children: /* @__PURE__ */ q(Qe, {
608
629
  features: e,
609
630
  responseFormat: y,
610
631
  systemPrompt: b,
@@ -635,40 +656,40 @@ var Q = {
635
656
  blockquote: "_blockquote_1yr1w_34",
636
657
  tableCell: "_tableCell_1yr1w_39",
637
658
  tableHeader: "_tableHeader_1yr1w_44"
638
- }, Qe = ({ status: e, isLive: t }) => e ? e === c.Completed ? /* @__PURE__ */ K(F, {
659
+ }, $e = ({ status: e, isLive: t }) => e ? e === c.Completed ? /* @__PURE__ */ q(F, {
639
660
  size: p.MD,
640
661
  className: Q.iconSecondary
641
- }) : /* @__PURE__ */ K(A, {
662
+ }) : /* @__PURE__ */ q(A, {
642
663
  size: p.MD,
643
664
  className: Q.iconSecondary
644
- }) : t ? /* @__PURE__ */ K(w, { size: 20 }) : /* @__PURE__ */ K(A, {
665
+ }) : t ? /* @__PURE__ */ q(w, { size: 20 }) : /* @__PURE__ */ q(A, {
645
666
  size: p.MD,
646
667
  className: Q.iconSecondary
647
- }), $e = ({ children: e, codeClassName: t, copyAriaLabel: n }) => {
648
- let [r, i] = W(!1), a = Ae(null);
649
- U(() => () => {
668
+ }), et = ({ children: e, codeClassName: t, copyAriaLabel: n }) => {
669
+ let [r, i] = G(!1), a = Ae(null);
670
+ De(() => () => {
650
671
  a.current != null && clearTimeout(a.current);
651
672
  }, []);
652
- let o = Oe(() => {
673
+ let o = Ee(() => {
653
674
  u(typeof e == "string" ? e : String(e ?? "")), a.current && clearTimeout(a.current), i(!0), a.current = setTimeout(() => i(!1), 2e3);
654
675
  }, [e]);
655
- return /* @__PURE__ */ q("pre", {
676
+ return /* @__PURE__ */ J("pre", {
656
677
  className: d("relative max-h-[300px] overflow-auto rounded border p-3 text-sm", Q.codeBlock),
657
- children: [/* @__PURE__ */ K(h, {
678
+ children: [/* @__PURE__ */ q(h, {
658
679
  size: D.Small,
659
- icon: K(r ? j : L, {
680
+ icon: q(r ? j : L, {
660
681
  size: p.SM,
661
682
  className: Q.iconSecondary
662
683
  }),
663
684
  "aria-label": n,
664
685
  onClick: o,
665
686
  className: "absolute end-2 top-2"
666
- }), /* @__PURE__ */ K("code", {
687
+ }), /* @__PURE__ */ q("code", {
667
688
  className: d("font-mono", t),
668
689
  children: e
669
690
  })]
670
691
  });
671
- }, et = De(({ content: e, typography: t, copyAriaLabel: n = "Copy" }) => /* @__PURE__ */ K(a, {
692
+ }, tt = Te(({ content: e, typography: t, copyAriaLabel: n = "Copy" }) => /* @__PURE__ */ q(a, {
672
693
  content: e,
673
694
  classNames: {
674
695
  p: d(t.fontClassName, Q.stageContent),
@@ -680,54 +701,54 @@ var Q = {
680
701
  tableCell: Q.tableCell,
681
702
  tableHeader: Q.tableHeader
682
703
  },
683
- components: { code: ({ children: e, className: r }) => r?.includes("language-") ? /* @__PURE__ */ K($e, {
704
+ components: { code: ({ children: e, className: r }) => r?.includes("language-") ? /* @__PURE__ */ q(et, {
684
705
  codeClassName: r,
685
706
  copyAriaLabel: n,
686
707
  children: e
687
- }) : /* @__PURE__ */ K("code", {
708
+ }) : /* @__PURE__ */ q("code", {
688
709
  className: d("px-1 py-0.5", t.codeClassName ?? "rounded font-mono text-sm", Q.codeInline),
689
710
  children: e
690
711
  }) }
691
- })), tt = ({ stage: e, isLive: t, typography: n, copyAriaLabel: r = "Copy stage content", attachmentsAriaLabel: i = "Stage attachments", onAttachmentClick: a }) => {
692
- let [o, s] = W(!1), c = /* @__PURE__ */ q(G, { children: [/* @__PURE__ */ K(Qe, {
712
+ })), nt = ({ stage: e, isLive: t, typography: n, copyAriaLabel: r = "Copy stage content", attachmentsAriaLabel: i = "Stage attachments", onAttachmentClick: a }) => {
713
+ let [o, s] = G(!1), c = /* @__PURE__ */ J(K, { children: [/* @__PURE__ */ q($e, {
693
714
  status: e.status,
694
715
  isLive: t
695
- }), /* @__PURE__ */ K("span", {
716
+ }), /* @__PURE__ */ q("span", {
696
717
  className: d("min-w-0 flex-1 truncate capitalize", Q.stageName),
697
- children: /* @__PURE__ */ K(m, { text: e.name || e.status })
718
+ children: /* @__PURE__ */ q(m, { text: e.name || e.status })
698
719
  })] }), l = e.attachments?.map((e) => f(e)) ?? [];
699
- return e.content || l.length ? /* @__PURE__ */ q("div", { children: [/* @__PURE__ */ q("button", {
720
+ return e.content || l.length ? /* @__PURE__ */ J("div", { children: [/* @__PURE__ */ J("button", {
700
721
  type: "button",
701
722
  onClick: () => s((e) => !e),
702
723
  className: d("flex w-full cursor-pointer items-center gap-2 p-0", Q.collapseButton),
703
- children: [c, o ? /* @__PURE__ */ K(M, {
724
+ children: [c, o ? /* @__PURE__ */ q(M, {
704
725
  size: p.MD,
705
726
  className: Q.iconSecondary
706
- }) : /* @__PURE__ */ K(N, {
727
+ }) : /* @__PURE__ */ q(N, {
707
728
  size: p.MD,
708
729
  className: d(Q.iconSecondary, "rtl:scale-x-[-1]")
709
730
  })]
710
- }), /* @__PURE__ */ K("div", {
731
+ }), /* @__PURE__ */ q("div", {
711
732
  className: d("grid overflow-hidden transition-[grid-template-rows] duration-[250ms] ease-in-out", o ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
712
- children: /* @__PURE__ */ K("div", {
733
+ children: /* @__PURE__ */ q("div", {
713
734
  className: "overflow-hidden",
714
- children: /* @__PURE__ */ q("div", {
735
+ children: /* @__PURE__ */ J("div", {
715
736
  className: "mt-3 flex flex-col gap-3 ps-7",
716
- children: [e.content && /* @__PURE__ */ K("div", {
737
+ children: [e.content && /* @__PURE__ */ q("div", {
717
738
  className: "max-h-[300px] overflow-y-auto",
718
- children: /* @__PURE__ */ K(et, {
739
+ children: /* @__PURE__ */ q(tt, {
719
740
  content: e.content,
720
741
  typography: n,
721
742
  copyAriaLabel: r
722
743
  })
723
- }), l.length > 0 && /* @__PURE__ */ K(Ke, {
744
+ }), l.length > 0 && /* @__PURE__ */ q(qe, {
724
745
  attachments: l,
725
746
  labels: { ariaLabel: i },
726
747
  onAttachmentClick: a
727
748
  })]
728
749
  })
729
750
  })
730
- })] }) : /* @__PURE__ */ K("div", {
751
+ })] }) : /* @__PURE__ */ q("div", {
731
752
  className: "flex items-center gap-2",
732
753
  children: c
733
754
  });
@@ -742,16 +763,16 @@ var Q = {
742
763
  "--cs-failed": o?.failedColor,
743
764
  "--cs-button-bg": o?.buttonBackground
744
765
  }), u = t ? e.reduce((e, t, n) => t.status ? e : n, -1) : -1;
745
- return /* @__PURE__ */ K("div", {
766
+ return /* @__PURE__ */ q("div", {
746
767
  style: c,
747
768
  className: d("w-full", Q.panel, n),
748
- children: /* @__PURE__ */ K("ul", {
769
+ children: /* @__PURE__ */ q("ul", {
749
770
  role: "list",
750
771
  className: "flex w-full flex-col gap-4",
751
- children: e.map((e, t) => /* @__PURE__ */ K("li", {
772
+ children: e.map((e, t) => /* @__PURE__ */ q("li", {
752
773
  role: "listitem",
753
774
  className: d("w-full", s.fontClassName),
754
- children: /* @__PURE__ */ K(tt, {
775
+ children: /* @__PURE__ */ q(nt, {
755
776
  stage: e,
756
777
  isLive: u === t,
757
778
  typography: s,
@@ -761,13 +782,13 @@ var Q = {
761
782
  }, e.index))
762
783
  })
763
784
  });
764
- }, nt = {
785
+ }, rt = {
765
786
  toggleButton: "_toggleButton_1rkek_1",
766
787
  stepsCount: "_stepsCount_1rkek_8",
767
788
  contentBox: "_contentBox_1rkek_12"
768
- }, rt = ({ stages: e, isStreaming: t, executedLabel: n = "Executed", stepsLabel: r = () => "steps", collapseThreshold: i = 7, className: a, styles: o, onAttachmentClick: s }) => {
769
- let [u, f] = W(!1);
770
- if (t) return /* @__PURE__ */ K($, {
789
+ }, it = ({ stages: e, isStreaming: t, executedLabel: n = "Executed", stepsLabel: r = () => "steps", collapseThreshold: i = 7, className: a, styles: o, onAttachmentClick: s }) => {
790
+ let [u, f] = G(!1);
791
+ if (t) return /* @__PURE__ */ q($, {
771
792
  stages: e,
772
793
  isStreaming: !0,
773
794
  onAttachmentClick: s
@@ -778,52 +799,52 @@ var Q = {
778
799
  "--cs-cg-steps-count": m?.stepsCountColor,
779
800
  "--cs-cg-border": m?.contentBorderColor
780
801
  });
781
- if (e.length < i) return /* @__PURE__ */ K("div", {
802
+ if (e.length < i) return /* @__PURE__ */ q("div", {
782
803
  style: g,
783
804
  className: d("flex w-full flex-col gap-1", a),
784
- children: /* @__PURE__ */ K($, {
805
+ children: /* @__PURE__ */ q($, {
785
806
  stages: e,
786
807
  isStreaming: !1,
787
808
  onAttachmentClick: s
788
809
  })
789
810
  });
790
811
  let v = e.filter((e) => e.status === c.Completed), y = e.filter((e) => e.status !== c.Completed);
791
- return /* @__PURE__ */ q("div", {
812
+ return /* @__PURE__ */ J("div", {
792
813
  style: g,
793
814
  className: d("flex w-full flex-col gap-1", a),
794
- children: [v.length > 0 && /* @__PURE__ */ q("div", { children: [/* @__PURE__ */ K(_, {
795
- className: nt.toggleButton,
815
+ children: [v.length > 0 && /* @__PURE__ */ J("div", { children: [/* @__PURE__ */ q(_, {
816
+ className: rt.toggleButton,
796
817
  onClick: () => f((e) => !e),
797
- iconBefore: /* @__PURE__ */ K(j, { size: p.SM }),
798
- iconAfter: u ? /* @__PURE__ */ K(M, { size: 12 }) : /* @__PURE__ */ K(N, {
818
+ iconBefore: /* @__PURE__ */ q(j, { size: p.SM }),
819
+ iconAfter: u ? /* @__PURE__ */ q(M, { size: 12 }) : /* @__PURE__ */ q(N, {
799
820
  size: 12,
800
821
  className: "rtl:scale-x-[-1]"
801
822
  }),
802
- label: /* @__PURE__ */ q(G, { children: [/* @__PURE__ */ K("span", {
823
+ label: /* @__PURE__ */ J(K, { children: [/* @__PURE__ */ q("span", {
803
824
  className: d(h.fontClassName, "pe-1"),
804
825
  children: n
805
- }), /* @__PURE__ */ q("span", {
806
- className: d(h.fontClassName, nt.stepsCount),
826
+ }), /* @__PURE__ */ J("span", {
827
+ className: d(h.fontClassName, rt.stepsCount),
807
828
  children: [
808
829
  v.length,
809
830
  " ",
810
831
  r(v.length)
811
832
  ]
812
833
  })] })
813
- }), /* @__PURE__ */ K("div", {
834
+ }), /* @__PURE__ */ q("div", {
814
835
  className: d("grid pt-1 transition-[grid-template-rows] duration-300 ease-in-out", u ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
815
- children: /* @__PURE__ */ K("div", {
836
+ children: /* @__PURE__ */ q("div", {
816
837
  className: "overflow-hidden",
817
- children: /* @__PURE__ */ K("div", {
818
- className: d("rounded border px-2 py-3", nt.contentBox),
819
- children: /* @__PURE__ */ K($, {
838
+ children: /* @__PURE__ */ q("div", {
839
+ className: d("rounded border px-2 py-3", rt.contentBox),
840
+ children: /* @__PURE__ */ q($, {
820
841
  stages: v,
821
842
  isStreaming: !1,
822
843
  onAttachmentClick: s
823
844
  })
824
845
  })
825
846
  })
826
- })] }), y.length > 0 && /* @__PURE__ */ K($, {
847
+ })] }), y.length > 0 && /* @__PURE__ */ q($, {
827
848
  stages: y,
828
849
  isStreaming: !1,
829
850
  onAttachmentClick: s
@@ -831,4 +852,4 @@ var Q = {
831
852
  });
832
853
  };
833
854
  //#endregion
834
- export { rt as CollapsedGroup, $ as StagesPanel };
855
+ export { it as CollapsedGroup, $ as StagesPanel };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@epam/ai-dial-conversation-stages",
3
3
  "description": "Panel for displaying agent processing stages during LLM response streaming",
4
- "version": "1.0.0-dev.486",
4
+ "version": "1.0.0-dev.491",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -19,9 +19,9 @@
19
19
  "peerDependencies": {
20
20
  "react": "^19.0.0",
21
21
  "@tabler/icons-react": "^3.0.0",
22
- "@epam/ai-dial-chat-shared": "1.0.0-dev.486",
22
+ "@epam/ai-dial-chat-shared": "1.0.0-dev.491",
23
23
  "@epam/ai-dial-ui-kit": "0.12.0-dev.28",
24
- "@epam/ai-dial-conversation-input": "1.0.0-dev.486"
24
+ "@epam/ai-dial-conversation-input": "1.0.0-dev.491"
25
25
  },
26
26
  "repository": {
27
27
  "type": "git",