@epam/ai-dial-conversation-messages 1.2.0-dev.3 → 1.2.0-dev.6

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 (3) hide show
  1. package/components/MessageBubble/AssistantMessageBubble.d.ts.map +1 -1
  2. package/index.js +146 -139
  3. package/package.json +3 -3
package/components/MessageBubble/AssistantMessageBubble.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"AssistantMessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/MessageBubble/AssistantMessageBubble.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAE3B,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAY/E,gHAAgH;AAChH,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CA0MlE,CAAC"}
1
+ {"version":3,"file":"AssistantMessageBubble.d.ts","sourceRoot":"","sources":["../../../src/components/MessageBubble/AssistantMessageBubble.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,EAAE,EAAW,MAAM,OAAO,CAAC;AAEpC,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,6BAA6B,CAAC;AAY/E,gHAAgH;AAChH,eAAO,MAAM,sBAAsB,EAAE,EAAE,CAAC,2BAA2B,CAqNlE,CAAC"}
package/index.js CHANGED
@@ -1,12 +1,12 @@
1
1
  import { AttachmentType as e, CopyIconButton as t, DeploymentIcon as n, MDMessageViewer as r, MessageRating as i, MessageRole as a, buildCssVars as o, mergeClasses as s, useCollapsedText as c } from "@epam/ai-dial-chat-shared";
2
2
  import { AttachmentGroup as l } from "@epam/ai-dial-attachment-input";
3
3
  import { DIAL_ICON_SIZE as u, DIAL_KIT_ICON_STROKE as d, ElementSize as f, InfoMessageNotification as p, LinkButton as m, NeutralButton as h, ToggleIconButton as g } from "@epam/ai-dial-ui-kit";
4
- import { useCallback as _, useEffect as v, useId as y, useRef as b, useState as x } from "react";
5
- import { IconChevronDown as S, IconChevronUp as C, IconMarkdown as w, IconPencilMinus as T, IconRefresh as E, IconThumbDown as D, IconThumbDownFilled as O, IconThumbUp as k, IconThumbUpFilled as A, IconTrashX as j } from "@tabler/icons-react";
6
- import { Fragment as M, jsx as N, jsxs as P } from "react/jsx-runtime";
4
+ import { useCallback as _, useEffect as v, useId as y, useMemo as b, useRef as x, useState as S } from "react";
5
+ import { IconChevronDown as C, IconChevronUp as w, IconMarkdown as T, IconPencilMinus as E, IconRefresh as D, IconThumbDown as O, IconThumbDownFilled as k, IconThumbUp as A, IconThumbUpFilled as j, IconTrashX as M } from "@tabler/icons-react";
6
+ import { Fragment as N, jsx as P, jsxs as F } from "react/jsx-runtime";
7
7
  //#region src/hooks/useInlineStartIndent/useInlineStartIndent.ts
8
- var F = 4, I = (e) => {
9
- let t = b(null), [n, r] = x(0);
8
+ var I = 4, L = (e) => {
9
+ let t = x(null), [n, r] = S(0);
10
10
  return v(() => {
11
11
  if (!e) return;
12
12
  let n = t.current;
@@ -18,92 +18,92 @@ var F = 4, I = (e) => {
18
18
  return i.observe(n), () => i.disconnect();
19
19
  }, [e]), {
20
20
  slotRef: t,
21
- firstLineIndent: e ? `calc(${n}px + ${F}px)` : void 0
21
+ firstLineIndent: e ? `calc(${n}px + ${I}px)` : void 0
22
22
  };
23
- }, L = { activeRating: "_activeRating_ygoee_1" }, R = 2e3, z = ({ role: e = a.User, onEdit: n, onEditHover: r, onDelete: c, onRegenerate: l, onCopy: p, onCopyMarkdown: m, onLike: h, onDislike: v, activeRating: y, isAlwaysVisible: b, isDisabled: S = !1, className: C, labels: F, colors: I }) => {
24
- let { tooltips: z, ariaLabels: B } = F ?? {}, [V, H] = x(null), [U, W] = x(""), G = n != null || c != null || l != null || p != null || m != null || h != null || v != null, K = o({ "--ma-active-rating-text": I?.activeRatingText }), q = _(() => {
25
- p?.(), H("copy"), W(B?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => H(null), R);
23
+ }, R = { activeRating: "_activeRating_ygoee_1" }, z = 2e3, B = ({ role: e = a.User, onEdit: n, onEditHover: r, onDelete: c, onRegenerate: l, onCopy: p, onCopyMarkdown: m, onLike: h, onDislike: v, activeRating: y, isAlwaysVisible: b, isDisabled: x = !1, className: C, labels: w, colors: I }) => {
24
+ let { tooltips: L, ariaLabels: B } = w ?? {}, [V, H] = S(null), [U, W] = S(""), G = n != null || c != null || l != null || p != null || m != null || h != null || v != null, K = o({ "--ma-active-rating-text": I?.activeRatingText }), q = _(() => {
25
+ p?.(), H("copy"), W(B?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => H(null), z);
26
26
  }, [p, B?.copiedStatus]), J = _(() => {
27
- m?.(), H("markdown"), W(B?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => H(null), R);
27
+ m?.(), H("markdown"), W(B?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => H(null), z);
28
28
  }, [m, B?.copiedMarkdownStatus]);
29
- return G ? /* @__PURE__ */ P("div", {
29
+ return G ? /* @__PURE__ */ F("div", {
30
30
  role: "toolbar",
31
31
  "aria-label": B?.actionsGroup ?? "Message actions",
32
32
  style: K,
33
33
  className: s("flex gap-1", !b && "opacity-0 group-hover:opacity-100", C),
34
- children: [/* @__PURE__ */ N("span", {
34
+ children: [/* @__PURE__ */ P("span", {
35
35
  role: "status",
36
36
  "aria-live": "polite",
37
37
  className: "sr-only",
38
38
  children: U
39
- }), e === a.User ? /* @__PURE__ */ P(M, { children: [n && /* @__PURE__ */ N(g, {
40
- icon: /* @__PURE__ */ N(T, {
39
+ }), e === a.User ? /* @__PURE__ */ F(N, { children: [n && /* @__PURE__ */ P(g, {
40
+ icon: /* @__PURE__ */ P(E, {
41
41
  size: u.SM,
42
42
  "aria-hidden": !0,
43
43
  stroke: d
44
44
  }),
45
45
  size: f.Small,
46
46
  "aria-label": B?.editMessage ?? "Edit message",
47
- tooltipProps: { tooltip: z?.edit ?? "Edit" },
47
+ tooltipProps: { tooltip: L?.edit ?? "Edit" },
48
48
  onClick: n,
49
49
  onMouseEnter: r,
50
50
  onFocus: r,
51
- disabled: S
52
- }), c && /* @__PURE__ */ N(g, {
53
- icon: /* @__PURE__ */ N(j, {
51
+ disabled: x
52
+ }), c && /* @__PURE__ */ P(g, {
53
+ icon: /* @__PURE__ */ P(M, {
54
54
  size: u.SM,
55
55
  "aria-hidden": !0,
56
56
  stroke: d
57
57
  }),
58
58
  size: f.Small,
59
59
  "aria-label": B?.deleteMessage ?? "Delete message",
60
- tooltipProps: { tooltip: z?.delete ?? "Delete" },
60
+ tooltipProps: { tooltip: L?.delete ?? "Delete" },
61
61
  onClick: c,
62
- disabled: S
63
- })] }) : /* @__PURE__ */ P(M, { children: [
64
- l && /* @__PURE__ */ N(g, {
65
- icon: /* @__PURE__ */ N(E, {
62
+ disabled: x
63
+ })] }) : /* @__PURE__ */ F(N, { children: [
64
+ l && /* @__PURE__ */ P(g, {
65
+ icon: /* @__PURE__ */ P(D, {
66
66
  size: u.SM,
67
67
  "aria-hidden": !0,
68
68
  stroke: d
69
69
  }),
70
70
  size: f.Small,
71
71
  "aria-label": B?.regenerateResponse ?? "Regenerate response",
72
- tooltipProps: { tooltip: z?.regenerate ?? "Regenerate" },
72
+ tooltipProps: { tooltip: L?.regenerate ?? "Regenerate" },
73
73
  onClick: l,
74
- disabled: S
74
+ disabled: x
75
75
  }),
76
- p && /* @__PURE__ */ N(t, {
76
+ p && /* @__PURE__ */ P(t, {
77
77
  iconSize: u.SM,
78
78
  onClick: q,
79
79
  size: f.Small,
80
80
  isCopied: V === "copy",
81
- copyLabel: z?.copy ?? "Copy",
82
- copiedLabel: z?.copied ?? "Copied!",
81
+ copyLabel: L?.copy ?? "Copy",
82
+ copiedLabel: L?.copied ?? "Copied!",
83
83
  ariaLabel: B?.copyResponse ?? "Copy response",
84
- isDisabled: S
84
+ isDisabled: x
85
85
  }),
86
- m && /* @__PURE__ */ N(t, {
86
+ m && /* @__PURE__ */ P(t, {
87
87
  iconSize: u.SM,
88
88
  onClick: J,
89
89
  size: f.Small,
90
90
  isCopied: V === "markdown",
91
- iconCopy: /* @__PURE__ */ N(w, {
91
+ iconCopy: /* @__PURE__ */ P(T, {
92
92
  size: u.SM,
93
93
  "aria-hidden": !0,
94
94
  stroke: d
95
95
  }),
96
- copyLabel: z?.copyMarkdown ?? "Copy as Markdown",
97
- copiedLabel: z?.copiedMarkdown ?? "Copied!",
96
+ copyLabel: L?.copyMarkdown ?? "Copy as Markdown",
97
+ copiedLabel: L?.copiedMarkdown ?? "Copied!",
98
98
  ariaLabel: B?.copyAsMarkdown ?? "Copy as markdown",
99
- isDisabled: S
99
+ isDisabled: x
100
100
  }),
101
- h && /* @__PURE__ */ N(g, {
102
- icon: y === i.Like ? /* @__PURE__ */ N(A, {
103
- className: L.activeRating,
101
+ h && /* @__PURE__ */ P(g, {
102
+ icon: y === i.Like ? /* @__PURE__ */ P(j, {
103
+ className: R.activeRating,
104
104
  size: u.SM,
105
105
  "aria-hidden": !0
106
- }) : /* @__PURE__ */ N(k, {
106
+ }) : /* @__PURE__ */ P(A, {
107
107
  size: u.SM,
108
108
  "aria-hidden": !0,
109
109
  stroke: d
@@ -111,16 +111,16 @@ var F = 4, I = (e) => {
111
111
  size: f.Small,
112
112
  "aria-label": B?.likeResponse ?? "Like response",
113
113
  "aria-pressed": y === i.Like,
114
- tooltipProps: { tooltip: z?.like ?? "Like" },
114
+ tooltipProps: { tooltip: L?.like ?? "Like" },
115
115
  onClick: h,
116
- disabled: S
116
+ disabled: x
117
117
  }),
118
- v && /* @__PURE__ */ N(g, {
119
- icon: y === i.Dislike ? /* @__PURE__ */ N(O, {
120
- className: L.activeRating,
118
+ v && /* @__PURE__ */ P(g, {
119
+ icon: y === i.Dislike ? /* @__PURE__ */ P(k, {
120
+ className: R.activeRating,
121
121
  size: u.SM,
122
122
  "aria-hidden": !0
123
- }) : /* @__PURE__ */ N(D, {
123
+ }) : /* @__PURE__ */ P(O, {
124
124
  size: u.SM,
125
125
  "aria-hidden": !0,
126
126
  stroke: d
@@ -128,105 +128,112 @@ var F = 4, I = (e) => {
128
128
  size: f.Small,
129
129
  "aria-label": B?.dislikeResponse ?? "Dislike response",
130
130
  "aria-pressed": y === i.Dislike,
131
- tooltipProps: { tooltip: z?.dislike ?? "Dislike" },
131
+ tooltipProps: { tooltip: L?.dislike ?? "Dislike" },
132
132
  onClick: v,
133
- disabled: S
133
+ disabled: x
134
134
  })
135
135
  ] })]
136
136
  }) : null;
137
- }, B = {
137
+ }, V = {
138
138
  userBubble: "_userBubble_cq829_1",
139
139
  collapsibleText: "_collapsibleText_cq829_6",
140
140
  expandedText: "_expandedText_cq829_11",
141
141
  collapsedText: "_collapsedText_cq829_15",
142
142
  startersDivider: "_startersDivider_cq829_26",
143
143
  text: "_text_cq829_30"
144
- }, V = "[&>.cm-bubble-markdown>div>*:first-child]:indent-[var(--cm-bubble-first-line-indent,0px)]", H = ({ text: t, styles: i, actions: c, hasAlwaysVisibleActions: u, isStreaming: d, attachments: f, beforeContent: p, afterContent: m, starters: g, onSelectStarter: _, deploymentIconUrl: v, deploymentDisplayName: y, markdownComponents: b, markdownClassNames: x, markdownUrlTransform: S, onAttachmentClick: C, onDownloadAll: w, onAttachmentRetry: T, codeBlockTheme: E, tableOnOpenInCanvas: D, labels: O, selectedAttachmentId: k }) => {
145
- let { colors: A, typography: j, className: M, bubbleClassName: F } = i ?? {}, { attachmentClickLabel: L, attachmentRetryLabel: R, attachmentOpenInNewTabLabel: H, startersAriaLabel: U = "Quick reply buttons", thinkingLabel: W, codeBlockCopyLabel: G, codeBlockCopiedLabel: K, tableCopyCsvLabel: q, tableCopyTxtLabel: J, tableCopyMarkdownLabel: Y, tableCopiedLabel: X, tableDownloadCsvLabel: Z, tableOpenInCanvasLabel: ee, tableDownloadFilename: te, tableScrollRegionAriaLabel: ne, assistantMessageAriaLabel: re = "Assistant message", deploymentIconFallbackLabel: Q = "AI" } = O ?? {}, ie = d ? (f ?? []).filter((t) => t.type !== e.Audio) : f ?? [], { slotRef: $, firstLineIndent: ae } = I(p != null && !!t), oe = o({
146
- "--cm-bubble-text": A?.text,
147
- "--cm-starters-divider": A?.startersDivider,
148
- "--cm-bubble-first-line-indent": ae
149
- }), se = s(B.text, j?.fontClassName), ce = !!(v || y);
150
- return /* @__PURE__ */ P("div", {
144
+ }, H = "[&>.cm-bubble-markdown>div>*:first-child]:indent-[var(--cm-bubble-first-line-indent,0px)]", U = ({ text: t, styles: i, actions: c, hasAlwaysVisibleActions: u, isStreaming: d, attachments: f, beforeContent: p, afterContent: m, starters: g, onSelectStarter: _, deploymentIconUrl: v, deploymentDisplayName: y, markdownComponents: x, markdownClassNames: S, markdownUrlTransform: C, onAttachmentClick: w, onDownloadAll: T, onAttachmentRetry: E, codeBlockTheme: D, tableOnOpenInCanvas: O, labels: k, selectedAttachmentId: A }) => {
145
+ let { colors: j, typography: M, className: N, bubbleClassName: I } = i ?? {}, { attachmentClickLabel: R, attachmentRetryLabel: z, attachmentOpenInNewTabLabel: U, startersAriaLabel: W = "Quick reply buttons", thinkingLabel: G, codeBlockCopyLabel: K, codeBlockCopiedLabel: q, tableCopyCsvLabel: J, tableCopyTxtLabel: Y, tableCopyMarkdownLabel: X, tableCopiedLabel: Z, tableDownloadCsvLabel: Q, tableOpenInCanvasLabel: $, tableDownloadFilename: ee, tableScrollRegionAriaLabel: te, assistantMessageAriaLabel: ne = "Assistant message", deploymentIconFallbackLabel: re = "AI" } = k ?? {}, ie = b(() => ({
146
+ copyCsvLabel: J,
147
+ copyTxtLabel: Y,
148
+ copyMarkdownLabel: X,
149
+ copiedLabel: Z,
150
+ downloadCsvLabel: Q,
151
+ openInCanvasLabel: $
152
+ }), [
153
+ J,
154
+ Y,
155
+ X,
156
+ Z,
157
+ Q,
158
+ $
159
+ ]), ae = d ? (f ?? []).filter((t) => t.type !== e.Audio) : f ?? [], { slotRef: oe, firstLineIndent: se } = L(p != null && !!t), ce = o({
160
+ "--cm-bubble-text": j?.text,
161
+ "--cm-starters-divider": j?.startersDivider,
162
+ "--cm-bubble-first-line-indent": se
163
+ }), le = s(V.text, M?.fontClassName), ue = !!(v || y);
164
+ return /* @__PURE__ */ F("div", {
151
165
  role: "group",
152
- "aria-label": re,
153
- style: oe,
154
- className: s("flex w-full items-start gap-3", M),
155
- children: [ce && /* @__PURE__ */ N(n, {
166
+ "aria-label": ne,
167
+ style: ce,
168
+ className: s("flex w-full items-start gap-3", N),
169
+ children: [ue && /* @__PURE__ */ P(n, {
156
170
  src: v,
157
171
  size: 28,
158
- initialsName: y || Q,
159
- labels: { tooltip: y ?? Q }
160
- }), /* @__PURE__ */ P("div", {
172
+ initialsName: y || re,
173
+ labels: { tooltip: y ?? re }
174
+ }), /* @__PURE__ */ F("div", {
161
175
  className: "flex w-full min-w-0 max-w-full flex-col items-start gap-5",
162
- children: [/* @__PURE__ */ P("div", {
163
- className: s("flex w-full min-w-0 max-w-full flex-col items-start gap-4", F),
176
+ children: [/* @__PURE__ */ F("div", {
177
+ className: s("flex w-full min-w-0 max-w-full flex-col items-start gap-4", I),
164
178
  children: [
165
- p != null && !t && /* @__PURE__ */ N("div", {
179
+ p != null && !t && /* @__PURE__ */ P("div", {
166
180
  className: "min-w-0",
167
181
  children: p
168
182
  }),
169
- (t || d) && /* @__PURE__ */ P("div", {
183
+ (t || d) && /* @__PURE__ */ F("div", {
170
184
  "aria-live": "polite",
171
185
  "aria-atomic": "false",
172
- className: s(se, "relative min-w-0 max-w-full text-start", p != null && t && V),
173
- children: [p != null && t && /* @__PURE__ */ N("div", {
174
- ref: $,
186
+ className: s(le, "relative min-w-0 max-w-full text-start", p != null && t && H),
187
+ children: [p != null && t && /* @__PURE__ */ P("div", {
188
+ ref: oe,
175
189
  className: "absolute start-0 top-0",
176
190
  children: p
177
- }), /* @__PURE__ */ N("div", {
191
+ }), /* @__PURE__ */ P("div", {
178
192
  className: "cm-bubble-markdown min-w-0 max-w-full",
179
- children: /* @__PURE__ */ N(r, {
193
+ children: /* @__PURE__ */ P(r, {
180
194
  content: t ?? "",
181
195
  isStreaming: d,
182
- thinkingLabel: W,
183
- components: b,
184
- classNames: x,
185
- urlTransform: S,
186
- codeBlockCopyLabel: G,
187
- codeBlockCopiedLabel: K,
188
- codeBlockTheme: E,
189
- tableActionLabels: {
190
- copyCsvLabel: q,
191
- copyTxtLabel: J,
192
- copyMarkdownLabel: Y,
193
- copiedLabel: X,
194
- downloadCsvLabel: Z,
195
- openInCanvasLabel: ee
196
- },
197
- tableDownloadFilename: te,
198
- tableOnOpenInCanvas: D,
199
- tableScrollRegionAriaLabel: ne
196
+ thinkingLabel: G,
197
+ components: x,
198
+ classNames: S,
199
+ urlTransform: C,
200
+ codeBlockCopyLabel: K,
201
+ codeBlockCopiedLabel: q,
202
+ codeBlockTheme: D,
203
+ tableActionLabels: ie,
204
+ tableDownloadFilename: ee,
205
+ tableOnOpenInCanvas: O,
206
+ tableScrollRegionAriaLabel: te
200
207
  })
201
208
  })]
202
209
  }),
203
- /* @__PURE__ */ N(l, {
204
- attachments: ie,
205
- onAttachmentClick: (e) => C?.(f?.find((t) => t.id === e)),
206
- onDownloadAll: w,
207
- onRetry: T,
210
+ /* @__PURE__ */ P(l, {
211
+ attachments: ae,
212
+ onAttachmentClick: (e) => w?.(f?.find((t) => t.id === e)),
213
+ onDownloadAll: T,
214
+ onRetry: E,
208
215
  labels: {
209
- clickLabel: L,
210
- retryLabel: R,
211
- openInNewTabLabel: H
216
+ clickLabel: R,
217
+ retryLabel: z,
218
+ openInNewTabLabel: U
212
219
  },
213
- selectedAttachmentId: k
220
+ selectedAttachmentId: A
214
221
  }),
215
222
  m,
216
- /* @__PURE__ */ N(z, {
223
+ /* @__PURE__ */ P(B, {
217
224
  ...c,
218
225
  isAlwaysVisible: u,
219
226
  role: a.Assistant
220
227
  })
221
228
  ]
222
- }), g && g.length > 0 && _ && /* @__PURE__ */ N("div", {
229
+ }), g && g.length > 0 && _ && /* @__PURE__ */ P("div", {
223
230
  role: "list",
224
- "aria-label": U,
225
- className: s("flex w-full flex-wrap gap-2 border-t pt-5", B.startersDivider),
226
- children: g.map((e, t) => /* @__PURE__ */ N("div", {
231
+ "aria-label": W,
232
+ className: s("flex w-full flex-wrap gap-2 border-t pt-5", V.startersDivider),
233
+ children: g.map((e, t) => /* @__PURE__ */ P("div", {
227
234
  role: "listitem",
228
235
  className: "min-w-[40px]",
229
- children: /* @__PURE__ */ N(h, {
236
+ children: /* @__PURE__ */ P(h, {
230
237
  label: e.title,
231
238
  className: "min-w-[40px]",
232
239
  onClick: () => _(e)
@@ -235,76 +242,76 @@ var F = 4, I = (e) => {
235
242
  })]
236
243
  })]
237
244
  });
238
- }, U = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ N("div", {
245
+ }, W = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ P("div", {
239
246
  role: "status",
240
247
  "aria-live": "polite",
241
- children: /* @__PURE__ */ N(p, {
248
+ children: /* @__PURE__ */ P(p, {
242
249
  title: e,
243
250
  message: t,
244
251
  textClassName: "flex-row flex-wrap gap-1"
245
252
  })
246
- }), W = /* @__PURE__ */ function(e) {
253
+ }), G = /* @__PURE__ */ function(e) {
247
254
  return e.Bottom = "Bottom", e.Top = "Top", e;
248
- }({}), G = 10, K = ({ text: e, position: t = W.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: d, collapsedLineCount: p = G, labels: h, beforeContent: g, onAttachmentClick: _, onDownloadAll: v, onAttachmentRetry: b, selectedAttachmentId: x }) => {
249
- let { colors: w, typography: T, className: E, bubbleClassName: D } = n ?? {}, { showMoreLabel: O = "Show more", showLessLabel: k = "Show less", showMoreAriaLabel: A, showLessAriaLabel: j, attachmentClickLabel: F, attachmentRetryLabel: I, attachmentOpenInNewTabLabel: L, userMessageAriaLabel: R = "User message" } = h ?? {}, { textRef: V, isTextCollapsed: H, isOverflowing: U, collapsedMaxHeight: K, expandedMaxHeight: q, isCollapsed: J, toggleCollapsed: Y } = c({
255
+ }({}), K = 10, q = ({ text: e, position: t = G.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: d, collapsedLineCount: p = K, labels: h, beforeContent: g, onAttachmentClick: _, onDownloadAll: v, onAttachmentRetry: b, selectedAttachmentId: x }) => {
256
+ let { colors: S, typography: T, className: E, bubbleClassName: D } = n ?? {}, { showMoreLabel: O = "Show more", showLessLabel: k = "Show less", showMoreAriaLabel: A, showLessAriaLabel: j, attachmentClickLabel: M, attachmentRetryLabel: I, attachmentOpenInNewTabLabel: L, userMessageAriaLabel: R = "User message" } = h ?? {}, { textRef: z, isTextCollapsed: H, isOverflowing: U, collapsedMaxHeight: W, expandedMaxHeight: q, isCollapsed: J, toggleCollapsed: Y } = c({
250
257
  text: e ?? "",
251
258
  collapsedLineCount: p
252
259
  }), X = o({
253
- "--cm-bubble-user-bg": w?.userBackground,
254
- "--cm-bubble-user-border": w?.userBorder,
255
- "--cm-bubble-fade-start": w?.fadeStart,
256
- "--cm-bubble-text": w?.text,
257
- "--cm-bubble-collapsed-height": U ? `${K}px` : void 0,
260
+ "--cm-bubble-user-bg": S?.userBackground,
261
+ "--cm-bubble-user-border": S?.userBorder,
262
+ "--cm-bubble-fade-start": S?.fadeStart,
263
+ "--cm-bubble-text": S?.text,
264
+ "--cm-bubble-collapsed-height": U ? `${W}px` : void 0,
258
265
  "--cm-bubble-expanded-height": U ? `${q}px` : void 0
259
- }), Z = t === W.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", ee = s(B.text, T?.fontClassName), te = A ?? O, ne = j ?? k, re = J ? O : k, Q = J ? te : ne, ie = J ? S : C, $ = y();
260
- return /* @__PURE__ */ N("div", {
266
+ }), Z = t === G.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", Q = s(V.text, T?.fontClassName), $ = A ?? O, ee = j ?? k, te = J ? O : k, ne = J ? $ : ee, re = J ? C : w, ie = y();
267
+ return /* @__PURE__ */ P("div", {
261
268
  role: "group",
262
269
  "aria-label": R,
263
270
  style: X,
264
271
  className: s("flex w-full", E),
265
- children: /* @__PURE__ */ P("div", {
272
+ children: /* @__PURE__ */ F("div", {
266
273
  className: "ms-auto flex w-fit min-w-0 max-w-full flex-col items-end gap-4",
267
274
  children: [
268
- /* @__PURE__ */ N(l, {
275
+ /* @__PURE__ */ P(l, {
269
276
  attachments: d ?? [],
270
277
  onAttachmentClick: (e) => _?.(d?.find((t) => t.id === e)),
271
278
  onDownloadAll: v,
272
279
  onRetry: b,
273
280
  labels: {
274
- clickLabel: F,
281
+ clickLabel: M,
275
282
  retryLabel: I,
276
283
  openInNewTabLabel: L
277
284
  },
278
285
  styles: { className: "max-w-[640px]" },
279
286
  selectedAttachmentId: x
280
287
  }),
281
- (e || g != null) && /* @__PURE__ */ N("div", {
282
- className: s(B.userBubble, "flex w-fit items-center justify-end rounded-es-2xl rounded-ss-2xl border px-6 py-4", Z, D),
283
- children: /* @__PURE__ */ P("div", {
288
+ (e || g != null) && /* @__PURE__ */ P("div", {
289
+ className: s(V.userBubble, "flex w-fit items-center justify-end rounded-es-2xl rounded-ss-2xl border px-6 py-4", Z, D),
290
+ children: /* @__PURE__ */ F("div", {
284
291
  className: "flex min-w-0 flex-col items-start",
285
292
  children: [
286
- e && /* @__PURE__ */ N("div", {
287
- id: $,
288
- className: s("relative overflow-hidden", U && B.collapsibleText, U && !J && B.expandedText, H && B.collapsedText),
289
- children: /* @__PURE__ */ P("p", {
290
- ref: V,
291
- className: s(ee, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
292
- children: [g != null && /* @__PURE__ */ N("span", {
293
+ e && /* @__PURE__ */ P("div", {
294
+ id: ie,
295
+ className: s("relative overflow-hidden", U && V.collapsibleText, U && !J && V.expandedText, H && V.collapsedText),
296
+ children: /* @__PURE__ */ F("p", {
297
+ ref: z,
298
+ className: s(Q, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
299
+ children: [g != null && /* @__PURE__ */ P("span", {
293
300
  className: "me-1",
294
301
  children: g
295
302
  }), e]
296
303
  })
297
304
  }),
298
- g != null && !e && /* @__PURE__ */ N("div", { children: g }),
299
- U && /* @__PURE__ */ N(m, {
300
- label: /* @__PURE__ */ N(M, { children: re }),
301
- iconBefore: /* @__PURE__ */ N(ie, {
305
+ g != null && !e && /* @__PURE__ */ P("div", { children: g }),
306
+ U && /* @__PURE__ */ P(m, {
307
+ label: /* @__PURE__ */ P(N, { children: te }),
308
+ iconBefore: /* @__PURE__ */ P(re, {
302
309
  size: u.SM,
303
310
  "aria-hidden": "true"
304
311
  }),
305
- "aria-label": Q,
312
+ "aria-label": ne,
306
313
  "aria-expanded": !J,
307
- "aria-controls": $,
314
+ "aria-controls": ie,
308
315
  className: "mt-3",
309
316
  onClick: Y,
310
317
  size: f.Small
@@ -312,7 +319,7 @@ var F = 4, I = (e) => {
312
319
  ]
313
320
  })
314
321
  }),
315
- /* @__PURE__ */ N(z, {
322
+ /* @__PURE__ */ P(B, {
316
323
  ...r,
317
324
  isAlwaysVisible: i,
318
325
  role: a.User
@@ -320,14 +327,14 @@ var F = 4, I = (e) => {
320
327
  ]
321
328
  })
322
329
  });
323
- }, q = ({ role: e, beforeContent: t, onAttachmentClick: n, markdownComponents: r, markdownUrlTransform: i, ...o }) => e === a.Status ? /* @__PURE__ */ N(U, { labels: {
330
+ }, J = ({ role: e, beforeContent: t, onAttachmentClick: n, markdownComponents: r, markdownUrlTransform: i, ...o }) => e === a.Status ? /* @__PURE__ */ P(W, { labels: {
324
331
  titleText: o.labels?.statusTitleText,
325
332
  bodyText: o.labels?.statusBodyText ?? ""
326
- } }) : e === a.User ? /* @__PURE__ */ N(K, {
333
+ } }) : e === a.User ? /* @__PURE__ */ P(q, {
327
334
  ...o,
328
335
  beforeContent: t,
329
336
  onAttachmentClick: n
330
- }) : /* @__PURE__ */ N(H, {
337
+ }) : /* @__PURE__ */ P(U, {
331
338
  ...o,
332
339
  beforeContent: t,
333
340
  markdownComponents: r,
@@ -335,4 +342,4 @@ var F = 4, I = (e) => {
335
342
  onAttachmentClick: n
336
343
  });
337
344
  //#endregion
338
- export { H as AssistantMessageBubble, W as BubblePosition, z as MessageActions, q as MessageBubble, U as StatusMessageBubble, K as UserMessageBubble };
345
+ export { U as AssistantMessageBubble, G as BubblePosition, B as MessageActions, J as MessageBubble, W as StatusMessageBubble, q 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.2.0-dev.3",
4
+ "version": "1.2.0-dev.6",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
7
7
  "main": "./index.js",
@@ -19,11 +19,11 @@
19
19
  "dependencies": {
20
20
  "@tabler/icons-react": "^3.44.0",
21
21
  "react-markdown": "^10.1.0",
22
- "@epam/ai-dial-attachment-input": "1.2.0-dev.3"
22
+ "@epam/ai-dial-attachment-input": "1.2.0-dev.6"
23
23
  },
24
24
  "peerDependencies": {
25
25
  "react": "^19.2.8",
26
- "@epam/ai-dial-chat-shared": "1.2.0-dev.3",
26
+ "@epam/ai-dial-chat-shared": "1.2.0-dev.6",
27
27
  "@epam/ai-dial-ui-kit": "^0.14.2"
28
28
  },
29
29
  "repository": {