@epam/ai-dial-conversation-messages 1.3.0-dev.124 → 1.3.0-dev.126

package/index.js

@@ -6,10 +6,10 @@ import { IconArrowBackUp as A, IconChevronDown as te, IconChevronUp as ne, IconM
 import { Fragment as P, jsx as F, jsxs as I } from "react/jsx-runtime";
 import { createPortal as L } from "react-dom";
 //#region src/constants/public-class-names.ts
-var ce = {
+var R = {
 	userBubble: "dial-cm-user-bubble",
 	assistantContent: "dial-cm-assistant-content"
-}, R = 4, le = (e) => {
+}, z = 4, ce = (e) => {
 	let t = O(null), [n, r] = k(0);
 	return T(() => {
 		if (!e) return;
@@ -22,78 +22,78 @@ var ce = {
 		return i.observe(n), () => i.disconnect();
 	}, [e]), {
 		slotRef: t,
-		firstLineIndent: e ? `calc(${n}px + ${R}px)` : void 0
+		firstLineIndent: e ? `calc(${n}px + ${z}px)` : void 0
 	};
-}, ue = [
+}, le = [
 	"href",
 	"src",
 	"alt",
 	"colspan",
 	"rowspan",
 	"start"
-], de = new Set([
+], ue = /* @__PURE__ */ new Set([
 	"pre",
 	"pre-wrap",
 	"pre-line",
 	"break-spaces"
-]), z = (e) => {
+]), B = (e) => {
 	let t = document.createElement(e.tagName.toLowerCase());
-	ue.forEach((n) => {
+	le.forEach((n) => {
 		let r = e.getAttribute(n);
 		r !== null && t.setAttribute(n, r);
 	});
 	let { whiteSpace: n } = window.getComputedStyle(e);
-	return de.has(n) && (t.style.whiteSpace = "pre-wrap"), t;
-}, fe = (e) => e instanceof SVGElement || window.getComputedStyle(e).display === "none", B = (e, t) => {
+	return ue.has(n) && (t.style.whiteSpace = "pre-wrap"), t;
+}, de = (e) => e instanceof SVGElement || window.getComputedStyle(e).display === "none", V = (e, t) => {
 	if (!t.intersectsNode(e)) return null;
 	if (e.nodeType === Node.TEXT_NODE) {
 		let n = e.data, r = e === t.startContainer ? t.startOffset : 0, i = e === t.endContainer ? t.endOffset : n.length;
 		return document.createTextNode(n.slice(r, i));
 	}
-	if (!(e instanceof Element) || fe(e)) return null;
-	let n = z(e);
+	if (!(e instanceof Element) || de(e)) return null;
+	let n = B(e);
 	return e.childNodes.forEach((e) => {
-		let r = B(e, t);
+		let r = V(e, t);
 		r && n.appendChild(r);
 	}), n;
-}, pe = (e, t, n) => {
+}, fe = (e, t, n) => {
 	let r = e, i = t;
 	for (; i && i !== n && n.contains(i);) {
-		let e = z(i);
+		let e = B(i);
 		e.appendChild(r), r = e, i = i.parentElement;
 	}
 	return r;
-}, me = (e, t) => {
+}, pe = (e, t) => {
 	let n = e.commonAncestorContainer, r = n instanceof Element ? n : n.parentElement;
 	if (!r) return null;
-	let i = B(r, e);
-	return i ? pe(i, r.parentElement, t) : null;
-}, he = (e) => {
+	let i = V(r, e);
+	return i ? fe(i, r.parentElement, t) : null;
+}, me = (e) => {
 	let t = window.getSelection();
 	if (!t || t.isCollapsed || t.rangeCount === 0 || !e.clipboardData) return;
 	let n = t.toString();
 	if (!n) return;
 	let r = document.createElement("div");
 	for (let n = 0; n < t.rangeCount; n++) {
-		let i = me(t.getRangeAt(n), e.currentTarget);
+		let i = pe(t.getRangeAt(n), e.currentTarget);
 		i && r.appendChild(i);
 	}
 	e.clipboardData.setData("text/html", r.innerHTML), e.clipboardData.setData("text/plain", n), e.preventDefault();
-}, V = { activeRating: "_activeRating_ygoee_1" }, H = 2e3, ge = ({ role: e = a.User, onEdit: n, onEditHover: r, onDelete: o, onRegenerate: c, onCopy: l, onCopyMarkdown: u, onLike: f, onDislike: p, activeRating: m, isAlwaysVisible: h, leadingContent: b, trailingContent: x, isDisabled: S = !1, className: C, labels: T, colors: ee }) => {
-	let { tooltips: E, ariaLabels: D } = T ?? {}, [O, A] = k(null), [te, ne] = k(""), L = n != null || o != null || c != null || l != null || u != null || f != null || p != null || b != null || x != null, ce = s({ "--ma-active-rating-text": ee?.activeRatingText }), R = w(() => {
-		l?.(), A("copy"), ne(e === a.User ? D?.copiedMessageStatus ?? "Message copied to clipboard" : D?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => A(null), H);
+}, H = { activeRating: "_activeRating_ygoee_1" }, U = 2e3, he = ({ role: e = a.User, onEdit: n, onEditHover: r, onDelete: o, onRegenerate: c, onCopy: l, onCopyMarkdown: u, onLike: f, onDislike: p, activeRating: m, isAlwaysVisible: h, leadingContent: b, trailingContent: x, isDisabled: S = !1, className: C, labels: T, colors: ee }) => {
+	let { tooltips: E, ariaLabels: D } = T ?? {}, [O, A] = k(null), [te, ne] = k(""), L = n != null || o != null || c != null || l != null || u != null || f != null || p != null || b != null || x != null, R = s({ "--ma-active-rating-text": ee?.activeRatingText }), z = w(() => {
+		l?.(), A("copy"), ne(e === a.User ? D?.copiedMessageStatus ?? "Message copied to clipboard" : D?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => A(null), U);
 	}, [
 		l,
 		e,
 		D?.copiedStatus,
 		D?.copiedMessageStatus
-	]), le = w(() => {
-		u?.(), A("markdown"), ne(D?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => A(null), H);
+	]), ce = w(() => {
+		u?.(), A("markdown"), ne(D?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => A(null), U);
 	}, [u, D?.copiedMarkdownStatus]);
 	return L ? /* @__PURE__ */ I("div", {
 		role: "toolbar",
 		"aria-label": D?.actionsGroup ?? "Message actions",
-		style: ce,
+		style: R,
 		className: d("flex items-center gap-1", !h && "opacity-0 group-hover:opacity-100", C),
 		children: [
 			b,
@@ -106,7 +106,7 @@ var ce = {
 			e === a.User ? /* @__PURE__ */ I(P, { children: [
 				l && /* @__PURE__ */ F(t, {
 					iconSize: g.SM,
-					onClick: R,
+					onClick: z,
 					size: v.Small,
 					isCopied: O === "copy",
 					copyLabel: E?.copyMessage ?? "Copy message",
@@ -155,7 +155,7 @@ var ce = {
 				}),
 				l && /* @__PURE__ */ F(t, {
 					iconSize: g.SM,
-					onClick: R,
+					onClick: z,
 					size: v.Small,
 					isCopied: O === "copy",
 					copyLabel: E?.copy ?? "Copy",
@@ -165,7 +165,7 @@ var ce = {
 				}),
 				u && /* @__PURE__ */ F(t, {
 					iconSize: g.SM,
-					onClick: le,
+					onClick: ce,
 					size: v.Small,
 					isCopied: O === "markdown",
 					iconCopy: /* @__PURE__ */ F(re, {
@@ -180,7 +180,7 @@ var ce = {
 				}),
 				f && /* @__PURE__ */ F(y, {
 					icon: m === i.Like ? /* @__PURE__ */ F(se, {
-						className: V.activeRating,
+						className: H.activeRating,
 						size: g.SM,
 						"aria-hidden": !0
 					}) : /* @__PURE__ */ F(oe, {
@@ -197,7 +197,7 @@ var ce = {
 				}),
 				p && /* @__PURE__ */ F(y, {
 					icon: m === i.Dislike ? /* @__PURE__ */ F(ae, {
-						className: V.activeRating,
+						className: H.activeRating,
 						size: g.SM,
 						"aria-hidden": !0
 					}) : /* @__PURE__ */ F(M, {
@@ -216,43 +216,43 @@ var ce = {
 			x
 		]
 	}) : null;
-}, U = (e) => {
+}, W = (e) => {
 	let [t, n] = k(() => /* @__PURE__ */ new Date());
 	return T(() => {
 		let t = setInterval(() => n(/* @__PURE__ */ new Date()), e);
 		return () => clearInterval(t);
 	}, [e]), t;
-}, W = /* @__PURE__ */ function(e) {
+}, G = /* @__PURE__ */ function(e) {
 	return e.Today = "today", e.Yesterday = "yesterday", e.Absolute = "absolute", e;
-}({}), G = {
+}({}), K = {
 	hour: "numeric",
 	minute: "2-digit"
-}, K = {
+}, q = {
 	year: "numeric",
 	month: "short",
 	day: "numeric",
-	...G
-}, q = 60, J = 60 * q, Y = 24 * J, _e = [
+	...K
+}, ge = 60, J = 3600, Y = 24 * J, _e = [
 	["year", 365 * Y],
 	["month", 30 * Y],
 	["week", 7 * Y],
 	["day", Y],
 	["hour", J],
-	["minute", q]
+	["minute", ge]
 ], ve = (e, t) => e.getFullYear() === t.getFullYear() && e.getMonth() === t.getMonth() && e.getDate() === t.getDate(), ye = (e) => {
 	if (!e) return null;
 	let t = new Date(e);
 	return Number.isNaN(t.getTime()) ? null : t;
-}, X = (e, t) => new Intl.DateTimeFormat(t, K).format(e), be = (e, t, n) => {
+}, X = (e, t) => new Intl.DateTimeFormat(t, q).format(e), be = (e, t, n) => {
 	let r = new Date(t.getFullYear(), t.getMonth(), t.getDate() - 1);
 	return ve(e, t) ? {
-		kind: W.Today,
-		text: new Intl.DateTimeFormat(n, G).format(e)
+		kind: G.Today,
+		text: new Intl.DateTimeFormat(n, K).format(e)
 	} : ve(e, r) ? {
-		kind: W.Yesterday,
-		text: new Intl.DateTimeFormat(n, G).format(e)
+		kind: G.Yesterday,
+		text: new Intl.DateTimeFormat(n, K).format(e)
 	} : {
-		kind: W.Absolute,
+		kind: G.Absolute,
 		text: X(e, n)
 	};
 }, xe = (e, t, n) => {
@@ -263,7 +263,7 @@ var ce = {
 	}
 	return r.format(0, "second");
 }, Z = 6e4, Se = "opacity-0 transition-opacity group-hover/message:opacity-100 group-focus-within/message:opacity-100 [@media(hover:none)]:opacity-100", Ce = ({ timestamp: e, locale: t, className: n = "dial-small-text text-secondary" }) => {
-	let r = U(Z), i = ye(e);
+	let r = W(Z), i = ye(e);
 	return i == null ? null : /* @__PURE__ */ F(C, {
 		tooltip: X(i, t),
 		asChild: !0,
@@ -286,17 +286,17 @@ var ce = {
 		timestamp: f,
 		locale: m,
 		className: N
-	}), { attachmentClickLabel: R, attachmentDownloadLabel: ue, attachmentRetryLabel: de, attachmentOpenInNewTabLabel: z, startersAriaLabel: fe = "Quick reply buttons", thinkingLabel: B, codeBlockCopyLabel: pe, codeBlockCopiedLabel: me, codeBlockDownloadLabel: V, tableCopyLabel: H, tableCopiedLabel: U, tableDownloadCsvLabel: W, tableOpenInCanvasLabel: G, tableDownloadFilename: K, tableScrollRegionAriaLabel: q, mathScrollRegionAriaLabel: J, assistantMessageAriaLabel: Y = "Assistant message", deploymentIconFallbackLabel: _e = "AI" } = ie ?? {}, ve = D(() => ({
-		copyLabel: H,
-		copiedLabel: U,
-		downloadCsvLabel: W,
-		openInCanvasLabel: G
+	}), { attachmentClickLabel: z, attachmentDownloadLabel: le, attachmentRetryLabel: ue, attachmentOpenInNewTabLabel: B, startersAriaLabel: de = "Quick reply buttons", thinkingLabel: V, codeBlockCopyLabel: fe, codeBlockCopiedLabel: pe, codeBlockDownloadLabel: H, tableCopyLabel: U, tableCopiedLabel: W, tableDownloadCsvLabel: G, tableOpenInCanvasLabel: K, tableDownloadFilename: q, tableScrollRegionAriaLabel: ge, mathScrollRegionAriaLabel: J, assistantMessageAriaLabel: Y = "Assistant message", deploymentIconFallbackLabel: _e = "AI" } = ie ?? {}, ve = D(() => ({
+		copyLabel: U,
+		copiedLabel: W,
+		downloadCsvLabel: G,
+		openInCanvasLabel: K
 	}), [
-		H,
 		U,
 		W,
-		G
-	]), ye = h ? (g ?? []).filter((t) => t.type !== e.Audio) : g ?? [], X = !!t?.trim(), { slotRef: be, firstLineIndent: xe } = le(_ != null && X), Z = s({
+		G,
+		K
+	]), ye = h ? (g ?? []).filter((t) => t.type !== e.Audio) : g ?? [], X = !!t?.trim(), { slotRef: be, firstLineIndent: xe } = ce(_ != null && X), Z = s({
 		"--cm-bubble-text": M?.text,
 		"--cm-starters-divider": M?.startersDivider,
 		"--cm-bubble-first-line-indent": xe
@@ -305,7 +305,7 @@ var ce = {
 		role: "group",
 		"aria-label": Y,
 		style: Z,
-		onCopy: he,
+		onCopy: me,
 		className: d("group/message flex w-full items-start gap-3", oe),
 		children: [$ && /* @__PURE__ */ F(n, {
 			src: w,
@@ -324,7 +324,7 @@ var ce = {
 					(X || h && b) && /* @__PURE__ */ I("div", {
 						"aria-live": "polite",
 						"aria-atomic": "false",
-						className: d(Se, "relative max-w-full min-w-0 text-start", _ != null && X && we, ce.assistantContent),
+						className: d(Se, "relative max-w-full min-w-0 text-start", _ != null && X && we, R.assistantContent),
 						children: [_ != null && X && /* @__PURE__ */ F("div", {
 							ref: be,
 							className: "absolute inset-s-0 top-0",
@@ -336,18 +336,18 @@ var ce = {
 								content: t ?? "",
 								isPlainText: v === o.PlainText,
 								isStreaming: h,
-								thinkingLabel: B,
+								thinkingLabel: V,
 								components: ee,
 								classNames: E,
 								urlTransform: O,
-								codeBlockCopyLabel: pe,
-								codeBlockCopiedLabel: me,
-								codeBlockDownloadLabel: V,
+								codeBlockCopyLabel: fe,
+								codeBlockCopiedLabel: pe,
+								codeBlockDownloadLabel: H,
 								codeBlockTheme: ne,
 								tableActionLabels: ve,
-								tableDownloadFilename: K,
+								tableDownloadFilename: q,
 								tableOnOpenInCanvas: re,
-								tableScrollRegionAriaLabel: q,
+								tableScrollRegionAriaLabel: ge,
 								mathScrollRegionAriaLabel: J
 							})
 						})]
@@ -361,15 +361,15 @@ var ce = {
 						onDownloadAll: A,
 						onRetry: te,
 						labels: {
-							clickLabel: R,
-							downloadLabel: ue,
-							retryLabel: de,
-							openInNewTabLabel: z
+							clickLabel: z,
+							downloadLabel: le,
+							retryLabel: ue,
+							openInNewTabLabel: B
 						},
 						selectedAttachmentId: j
 					}),
 					y,
-					/* @__PURE__ */ F(ge, {
+					/* @__PURE__ */ F(he, {
 						...l,
 						isAlwaysVisible: u,
 						trailingContent: L == null ? l?.trailingContent : /* @__PURE__ */ I(P, { children: [l?.trailingContent, L] }),
@@ -378,7 +378,7 @@ var ce = {
 				]
 			}), x && x.length > 0 && C && /* @__PURE__ */ F("div", {
 				role: "list",
-				"aria-label": fe,
+				"aria-label": de,
 				className: d("flex w-full flex-wrap gap-2 border-t pt-5", Q.startersDivider),
 				children: x.map((e, t) => /* @__PURE__ */ F("div", {
 					role: "listitem",
@@ -407,16 +407,16 @@ var ce = {
 		timestamp: h,
 		locale: _,
 		className: se
-	}), { showMoreLabel: L = "Show more", showLessLabel: R = "Show less", showMoreAriaLabel: le, showLessAriaLabel: ue, attachmentClickLabel: de, attachmentDownloadLabel: z, attachmentRetryLabel: fe, attachmentOpenInNewTabLabel: B, userMessageAriaLabel: pe = "User message", codeBlockCopyLabel: me, codeBlockCopiedLabel: V, codeBlockDownloadLabel: H, tableCopyLabel: U, tableCopiedLabel: W, tableDownloadCsvLabel: G, tableOpenInCanvasLabel: K, tableDownloadFilename: q, tableScrollRegionAriaLabel: J, mathScrollRegionAriaLabel: Y } = S ?? {}, _e = D(() => ({
-		copyLabel: U,
-		copiedLabel: W,
-		downloadCsvLabel: G,
-		openInCanvasLabel: K
+	}), { showMoreLabel: L = "Show more", showLessLabel: z = "Show less", showMoreAriaLabel: ce, showLessAriaLabel: le, attachmentClickLabel: ue, attachmentDownloadLabel: B, attachmentRetryLabel: de, attachmentOpenInNewTabLabel: V, userMessageAriaLabel: fe = "User message", codeBlockCopyLabel: pe, codeBlockCopiedLabel: H, codeBlockDownloadLabel: U, tableCopyLabel: W, tableCopiedLabel: G, tableDownloadCsvLabel: K, tableOpenInCanvasLabel: q, tableDownloadFilename: ge, tableScrollRegionAriaLabel: J, mathScrollRegionAriaLabel: Y } = S ?? {}, _e = D(() => ({
+		copyLabel: W,
+		copiedLabel: G,
+		downloadCsvLabel: K,
+		openInCanvasLabel: q
 	}), [
-		U,
 		W,
 		G,
-		K
+		K,
+		q
 	]), { textRef: ve, isTextCollapsed: ye, isOverflowing: X, collapsedMaxHeight: be, expandedMaxHeight: xe, isCollapsed: Z, toggleCollapsed: Se } = f({
 		text: e ?? "",
 		collapsedLineCount: b
@@ -439,12 +439,12 @@ var ce = {
 			segmentRehypePlugins: [u(n)],
 			segmentComponents: l(n)
 		};
-	}, [e, C]), Ne = le ?? L, Pe = ue ?? R, Fe = Z ? L : R, Ie = Z ? Ne : Pe, Le = Z ? te : ne, Re = ee();
+	}, [e, C]), Ne = ce ?? L, Pe = le ?? z, Fe = Z ? L : z, Ie = Z ? Ne : Pe, Le = Z ? te : ne, Re = ee();
 	return /* @__PURE__ */ F("div", {
 		role: "group",
-		"aria-label": pe,
+		"aria-label": fe,
 		style: we,
-		onCopy: he,
+		onCopy: me,
 		className: d("group/message flex w-full", ae),
 		children: /* @__PURE__ */ I("div", {
 			className: "ms-auto flex w-fit max-w-full min-w-0 flex-col items-end gap-4",
@@ -458,16 +458,16 @@ var ce = {
 					onDownloadAll: T,
 					onRetry: E,
 					labels: {
-						clickLabel: de,
-						downloadLabel: z,
-						retryLabel: fe,
-						openInNewTabLabel: B
+						clickLabel: ue,
+						downloadLabel: B,
+						retryLabel: de,
+						openInNewTabLabel: V
 					},
 					styles: { className: "max-w-[640px]" },
 					selectedAttachmentId: O
 				}),
 				e && /* @__PURE__ */ F("div", {
-					className: d(Q.userBubble, "flex w-fit items-center justify-end rounded-ss-2xl rounded-es-2xl border px-6 py-4", $, oe, ce.userBubble),
+					className: d(Q.userBubble, "flex w-fit items-center justify-end rounded-ss-2xl rounded-es-2xl border px-6 py-4", $, oe, R.userBubble),
 					children: /* @__PURE__ */ I("div", {
 						className: "flex min-w-0 flex-col items-start",
 						children: [/* @__PURE__ */ F("div", {
@@ -484,12 +484,12 @@ var ce = {
 									components: Me,
 									classNames: k,
 									urlTransform: A,
-									codeBlockCopyLabel: me,
-									codeBlockCopiedLabel: V,
-									codeBlockDownloadLabel: H,
+									codeBlockCopyLabel: pe,
+									codeBlockCopiedLabel: H,
+									codeBlockDownloadLabel: U,
 									codeBlockTheme: re,
 									tableActionLabels: _e,
-									tableDownloadFilename: q,
+									tableDownloadFilename: ge,
 									tableOnOpenInCanvas: ie,
 									tableScrollRegionAriaLabel: J,
 									mathScrollRegionAriaLabel: Y
@@ -510,7 +510,7 @@ var ce = {
 						})]
 					})
 				}),
-				/* @__PURE__ */ F(ge, {
+				/* @__PURE__ */ F(he, {
 					...o,
 					isAlwaysVisible: m,
 					leadingContent: N == null ? o?.leadingContent : /* @__PURE__ */ I(P, { children: [N, o?.leadingContent] }),
@@ -589,11 +589,11 @@ var ce = {
 	let i = ye(e);
 	if (i == null) return null;
 	let { kind: a, text: o } = be(i, /* @__PURE__ */ new Date(), t), s = o;
-	return a === W.Today ? s = (n?.today ?? Pe)(o) : a === W.Yesterday && (s = (n?.yesterday ?? Fe)(o)), /* @__PURE__ */ F("time", {
+	return a === G.Today ? s = (n?.today ?? Pe)(o) : a === G.Yesterday && (s = (n?.yesterday ?? Fe)(o)), /* @__PURE__ */ F("time", {
 		dateTime: e,
 		className: d("self-center text-center", r),
 		children: s
 	});
 };
 //#endregion
-export { $ as AssistantMessageBubble, Ee as BubblePosition, ce as CONVERSATION_MESSAGES_CLASS, Ie as ConversationStartTimestamp, ge as MessageActions, je as MessageBubble, Ne as MessageSelectionReply, Te as StatusMessageBubble, Ae as UserMessageBubble };
+export { $ as AssistantMessageBubble, Ee as BubblePosition, R as CONVERSATION_MESSAGES_CLASS, Ie as ConversationStartTimestamp, he as MessageActions, je as MessageBubble, Ne as MessageSelectionReply, Te as StatusMessageBubble, Ae as UserMessageBubble };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@epam/ai-dial-conversation-messages",
   "description": "Message bubble components for rendering conversation history with actions and source citations",
-  "version": "1.3.0-dev.124",
+  "version": "1.3.0-dev.126",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -19,12 +19,12 @@
   "dependencies": {
     "@tabler/icons-react": "^3.44.0",
     "react-markdown": "^10.1.0",
-    "@epam/ai-dial-attachment-input": "1.3.0-dev.124"
+    "@epam/ai-dial-attachment-input": "1.3.0-dev.126"
   },
   "peerDependencies": {
     "react": "^19.2.8",
     "react-dom": "^19.2.8",
-    "@epam/ai-dial-chat-shared": "1.3.0-dev.124",
+    "@epam/ai-dial-chat-shared": "1.3.0-dev.126",
     "@epam/ai-dial-ui-kit": "^0.16.0-dev.20"
   },
   "repository": {