@epam/ai-dial-conversation-messages 1.1.0-dev.270 → 1.1.0-dev.277

package/index.js

@@ -1,5 +1,5 @@
 import { AttachmentErrorReason as e, AttachmentType as t, CopyIconButton as n, DeploymentIcon as r, MDMessageViewer as i, MIME_TYPE_EXT_MAP as a, MessageRating as o, MessageRole as s, RequestStatus as c, ResponseFormat as l, buildCssVars as u, mergeClasses as d, useCollapsedText as f } from "@epam/ai-dial-chat-shared";
-import { DIAL_ICON_SIZE as p, DialSlider as m, ElementSize as h, GhostIconButton as g, Highlight as _, InfoMessageNotification as v, LinkButton as y, NeutralButton as b, Popup as x, PopupSize as S, PrimaryButton as C, RadioGroup as w, RadioGroupOrientation as T, Skeleton as E, SkeletonVariant as D, Spinner as O, StaticIconButton as k, Textarea as A, ToggleIconButton as j, Tooltip as M } from "@epam/ai-dial-ui-kit";
+import { DIAL_ICON_SIZE as p, ElementSize as m, GhostIconButton as h, Highlight as g, InfoMessageNotification as _, LinkButton as v, NeutralButton as y, Popup as b, PopupSize as x, PrimaryButton as S, RadioGroup as C, RadioGroupOrientation as w, Skeleton as T, SkeletonVariant as E, Slider as D, Spinner as O, StaticIconButton as k, Textarea as A, ToggleIconButton as j, Tooltip as M } from "@epam/ai-dial-ui-kit";
 import { IconChevronDown as N, IconChevronUp as P, IconClipboard as F, IconDownload as I, IconExternalLink as L, IconFile as R, IconFileTypeBmp as z, IconFileTypeCss as B, IconFileTypeCsv as V, IconFileTypeDoc as H, IconFileTypeDocx as ee, IconFileTypeHtml as te, IconFileTypeJpg as ne, IconFileTypeJs as U, IconFileTypeJsx as W, IconFileTypePdf as re, IconFileTypePhp as ie, IconFileTypePng as ae, IconFileTypePpt as oe, IconFileTypeRs as se, IconFileTypeSql as ce, IconFileTypeSvg as le, IconFileTypeTs as ue, IconFileTypeTsx as de, IconFileTypeTxt as fe, IconFileTypeVue as pe, IconFileTypeXls as me, IconFileTypeXml as he, IconFileTypeZip as ge, IconMarkdown as _e, IconMusic as ve, IconPaperclip as ye, IconPencilMinus as be, IconPhoto as G, IconRefresh as xe, IconReload as Se, IconTerminal2 as Ce, IconThumbDown as we, IconThumbDownFilled as Te, IconThumbUp as Ee, IconThumbUpFilled as De, IconTrashX as Oe, IconVideo as ke, IconX as Ae } from "@tabler/icons-react";
 import "react-dom";
 import { memo as je, useCallback as K, useEffect as Me, useId as Ne, useMemo as Pe, useRef as Fe, useState as q } from "react";
@@ -101,7 +101,7 @@ var Ie = (e) => {
 	imageActionButton: "_imageActionButton_1whwz_47"
 }, Q = ({ ariaLabel: e, errorTitle: t, errorDescId: n, onClick: r, id: i, icon: a, className: o }) => /* @__PURE__ */ Y(k, {
 	icon: a,
-	size: h.Small,
+	size: m.Small,
 	className: d("absolute end-1 top-1 opacity-0 focus-visible:opacity-100 group-focus-within/attachment-tile:opacity-100 group-hover/attachment-tile:opacity-100", Z.actionButton, o),
 	"aria-label": e,
 	"aria-describedby": t ? n : void 0,
@@ -136,15 +136,15 @@ var Ie = (e) => {
 }), qe = {
 	[e.Network]: "Upload failed · network error",
 	[e.UnsupportedType]: "Upload failed · unsupported file type"
-}, Je = ({ attachment: t, searchQuery: n = "", onClick: r, onRetry: i, labels: a, styles: o, onDownload: s, isPasted: l, isLink: u, cssVars: f, onExpand: p, isExpandable: m, onRemove: h, isSelected: g }) => {
+}, Je = ({ attachment: t, searchQuery: n = "", onClick: r, onRetry: i, labels: a, styles: o, onDownload: s, isPasted: l, isLink: u, cssVars: f, onExpand: p, isExpandable: m, onRemove: h, isSelected: _ }) => {
 	let { clickLabel: v = "Download attachment", retryLabel: y = "Retry upload", sizeLabel: b, uploadingLabel: x = "Uploading", errorReasonLabels: S, genericErrorLabel: C = "Upload failed" } = a ?? {}, { typography: w, className: T } = o ?? {}, { id: E, name: D, status: k, errorReason: A } = t, j = k === c.Loading, M = k === c.Error, N = Ne(), P = M ? A && (S?.[A] ?? qe[A]) || C : "", { BottomIcon: F, typeLabel: I } = Ve(t), L = !M && !j && s && !u, R = M && !!i && A !== e.UnsupportedType, z = L || R ? "pe-5" : void 0, B = (e) => {
 		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), r?.(t.id));
 	}, V = Pe(() => l ? D : Ie(D), [l, D]), H = K(() => {
 		window.open(t.referenceUrl, "_blank", "noopener,noreferrer");
-	}, [t]), ee = d(He, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", Z.tile, !M && Z.hovered, g && Z.selected, M && Z.tileError), te = /* @__PURE__ */ Y("div", {
+	}, [t]), ee = d(He, "group/attachment-tile relative flex-col justify-between items-start gap-1 overflow-hidden p-1.5", Z.tile, !M && Z.hovered, _ && Z.selected, M && Z.tileError), te = /* @__PURE__ */ Y("div", {
 		title: V,
 		className: d(w?.nameClassName ?? "dial-caption-text", "line-clamp-2 min-w-0 break-all", Z.nameText, !M && z),
-		children: n ? /* @__PURE__ */ Y(_, {
+		children: n ? /* @__PURE__ */ Y(g, {
 			text: V,
 			query: n,
 			maxLines: 2
@@ -244,14 +244,14 @@ var Ie = (e) => {
 	let { clickLabel: u = "Open attachment", expandLabel: f = "Expand pasted text" } = i ?? {}, { className: m } = c ?? {}, { id: h, name: g } = e, _ = e.previewUrl ?? e.url, v = e.type === t.Pasted && n !== void 0, { isLoading: y, isError: b, isImage: x } = Pe(() => Ve(e), [e]), S = r !== void 0 && !v && !y && !b, { imageRef: C, imageLoadStatus: w } = Xe({
 		enabled: x,
 		src: _
-	}), T = () => {
+	}), D = () => {
 		v && n ? n(h) : S && r && r(h);
 	};
 	return /* @__PURE__ */ Y("div", {
 		className: d(He, "group/attachment-tile", S && "cursor-pointer", Z.tile, l && Z.selected, m),
-		onClick: T,
+		onClick: D,
 		onKeyDown: (e) => {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), T());
+			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), D());
 		},
 		tabIndex: 0,
 		role: "button",
@@ -270,8 +270,8 @@ var Ie = (e) => {
 					id: h,
 					className: Z.imageActionButton
 				}),
-				w !== Ye.Loaded && /* @__PURE__ */ Y(E, {
-					variant: D.Rectangular,
+				w !== Ye.Loaded && /* @__PURE__ */ Y(T, {
+					variant: E.Rectangular,
 					width: "100%",
 					height: "100%",
 					active: w === Ye.Loading,
@@ -341,7 +341,7 @@ var Ie = (e) => {
 	headerIcon: "_headerIcon_1dmgi_1",
 	headerLabel: "_headerLabel_1dmgi_2"
 }, et = (e, t) => `${e} ${t}${e === 1 ? "" : "s"}`, tt = ({ attachments: e, onAttachmentClick: n, onDownloadAll: r, onRetry: i, labels: a, styles: o, selectedAttachmentId: s }) => {
-	let { ariaLabel: l = "Attachments", clickLabel: f = "Download attachment", retryLabel: m = "Retry upload", downloadAllLabel: _ = "Download all", openInNewTabLabel: v, getHeaderLabel: y = (e) => et(e, "attachment"), promptLabel: b, pastedLabel: x, imageLabel: S } = a ?? {}, { typography: C, colors: w, className: T } = o ?? {}, E = u({ "--ai-group-text": w?.text });
+	let { ariaLabel: l = "Attachments", clickLabel: f = "Download attachment", retryLabel: g = "Retry upload", downloadAllLabel: _ = "Download all", openInNewTabLabel: v, getHeaderLabel: y = (e) => et(e, "attachment"), promptLabel: b, pastedLabel: x, imageLabel: S } = a ?? {}, { typography: C, colors: w, className: T } = o ?? {}, E = u({ "--ai-group-text": w?.text });
 	if (e.length === 0) return null;
 	let D = e.some((e) => e.type === t.Image), O = e.some((e) => e.type !== t.Image), k = D && O, A = e.length >= 5, j = k ? ye : D ? G : R, M = y(e.length), N = () => {
 		let t = e.filter((e) => e.status === c.Idle);
@@ -367,12 +367,12 @@ var Ie = (e) => {
 					className: d(C?.headerLabelClassName ?? "dial-tiny-semi-text", $e.headerLabel),
 					children: M
 				})]
-			}), e.length >= 2 && (r || n) && /* @__PURE__ */ Y(g, {
+			}), e.length >= 2 && (r || n) && /* @__PURE__ */ Y(h, {
 				icon: /* @__PURE__ */ Y(I, {
 					size: p.SM,
 					"aria-hidden": !0
 				}),
-				size: h.Small,
+				size: m.Small,
 				"aria-label": _,
 				onClick: N
 			})]
@@ -389,7 +389,7 @@ var Ie = (e) => {
 					onRetry: i,
 					labels: {
 						clickLabel: f,
-						retryLabel: m,
+						retryLabel: g,
 						promptLabel: b,
 						pastedLabel: x,
 						imageLabel: S,
@@ -433,25 +433,25 @@ var Ie = (e) => {
 			a
 		])
 	};
-}, rt = { label: "_label_14i7c_1" }, it = ({ features: e, responseFormat: t, systemPrompt: n, temperature: r, onResponseFormatChange: i, onSystemPromptChange: a, onTemperatureChange: o, responseFormatLabel: s = "Response format", responseFormatHint: c = "Applies to new and existing messages", responseFormatMarkdownLabel: f = "Markdown", responseFormatPlainTextLabel: p = "Plain text", systemPromptLabel: h = "System prompt", systemPromptTooltip: g = "Enter a prompt", temperatureLabel: _ = "Temperature", temperatureLabels: v = [
+}, rt = { label: "_label_14i7c_1" }, it = ({ features: e, responseFormat: t, systemPrompt: n, temperature: r, onResponseFormatChange: i, onSystemPromptChange: a, onTemperatureChange: o, responseFormatLabel: s = "Response format", responseFormatHint: c = "Applies to new and existing messages", responseFormatMarkdownLabel: f = "Markdown", responseFormatPlainTextLabel: p = "Plain text", systemPromptLabel: m = "System prompt", systemPromptTooltip: h = "Enter a prompt", temperatureLabel: g = "Temperature", temperatureLabels: _ = [
 	"Precise",
 	"Neutral",
 	"Creative"
-], temperatureHint: y, labelClassName: b = "!dial-small-semi-text", colors: x }) => {
-	let S = u({ "--csf-label-text": x?.labelText }), C = d(b, rt.label, "gap-1");
+], temperatureHint: v, labelClassName: y = "!dial-small-semi-text", colors: b }) => {
+	let x = u({ "--csf-label-text": b?.labelText }), S = d(y, rt.label, "gap-1");
 	return /* @__PURE__ */ X("div", {
 		className: "flex flex-col gap-4 px-6 pb-3",
-		style: S,
+		style: x,
 		children: [
-			e.responseFormat && /* @__PURE__ */ Y(w, {
+			e.responseFormat && /* @__PURE__ */ Y(C, {
 				id: "response-format",
 				labelProps: {
 					label: s,
-					className: C,
+					className: S,
 					caption: c
 				},
 				optionsClassName: "mb-2",
-				orientation: T.Column,
+				orientation: w.Column,
 				value: t ?? l.Markdown,
 				items: [{
 					value: l.Markdown,
@@ -464,32 +464,33 @@ var Ie = (e) => {
 			}),
 			e.systemPrompt && /* @__PURE__ */ Y(A, {
 				value: n,
-				placeholder: g,
+				placeholder: h,
 				resize: !0,
 				labelProps: {
-					className: C,
-					label: h
+					className: S,
+					label: m
 				},
 				onChange: (e) => a(e ?? "")
 			}),
-			e.temperature && /* @__PURE__ */ Y(m, {
+			e.temperature && /* @__PURE__ */ Y(D, {
 				labelProps: {
-					label: _,
-					className: C,
-					caption: y
+					label: g,
+					className: S,
+					caption: v
 				},
 				value: r,
 				min: 0,
 				max: 1,
 				step: .1,
-				labels: v,
+				labels: _,
+				showValue: !0,
 				onChange: o
 			})
 		]
 	});
 }, at = { modal: "_modal_kl0h0_1" };
 je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, title: o = "Chat settings", titleClassName: s = "dial-h1-text", responseFormatLabel: c, responseFormatHint: l, responseFormatMarkdownLabel: u, responseFormatPlainTextLabel: d, systemPromptLabel: f, systemPromptTooltip: p, temperatureLabel: m, temperatureLabels: h, temperatureHint: g, saveLabel: _ = "Apply changes", saveDisabledTooltip: v, backgroundClassName: y = at.modal }) => {
-	let { responseFormat: b, systemPrompt: w, temperature: T, canSubmit: E, setResponseFormat: D, setSystemPrompt: O, setTemperature: k, handleSubmit: A } = nt({
+	let { responseFormat: C, systemPrompt: w, temperature: T, canSubmit: E, setResponseFormat: D, setSystemPrompt: O, setTemperature: k, handleSubmit: A } = nt({
 		features: e,
 		initialResponseFormat: t,
 		initialSystemPrompt: n,
@@ -497,11 +498,11 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
 		onSave: i,
 		onClose: a
 	});
-	return /* @__PURE__ */ Y(x, {
+	return /* @__PURE__ */ Y(b, {
 		open: !0,
 		header: o,
 		titleClassName: s,
-		size: S.Sm,
+		size: x.Sm,
 		onClose: a,
 		className: y,
 		footer: /* @__PURE__ */ Y("div", {
@@ -509,7 +510,7 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
 			children: /* @__PURE__ */ Y(M, {
 				tooltip: v,
 				hideTooltip: E || !v,
-				children: /* @__PURE__ */ Y(C, {
+				children: /* @__PURE__ */ Y(S, {
 					label: _,
 					onClick: A,
 					disabled: !E
@@ -518,7 +519,7 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
 		}),
 		children: /* @__PURE__ */ Y(it, {
 			features: e,
-			responseFormat: b,
+			responseFormat: C,
 			systemPrompt: w,
 			temperature: T,
 			onResponseFormatChange: D,
@@ -536,7 +537,7 @@ je(({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemp
 		})
 	});
 });
-var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e = s.User, onEdit: t, onEditHover: r, onDelete: i, onRegenerate: a, onCopy: c, onCopyMarkdown: l, onLike: f, onDislike: m, activeRating: g, isAlwaysVisible: _, className: v, labels: y, colors: b }) => {
+var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e = s.User, onEdit: t, onEditHover: r, onDelete: i, onRegenerate: a, onCopy: c, onCopyMarkdown: l, onLike: f, onDislike: h, activeRating: g, isAlwaysVisible: _, className: v, labels: y, colors: b }) => {
 	let { tooltips: x, ariaLabels: S } = y ?? {}, [C, w] = q(null), [T, E] = q(""), D = u({ "--ma-active-rating-text": b?.activeRatingText }), O = K(() => {
 		c?.(), w("copy"), E(S?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => w(null), st);
 	}, [c, S?.copiedStatus]), k = K(() => {
@@ -558,7 +559,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 				"aria-hidden": !0,
 				stroke: 1.5
 			}),
-			size: h.Small,
+			size: m.Small,
 			"aria-label": S?.editMessage ?? "Edit message",
 			tooltipProps: { tooltip: x?.edit ?? "Edit" },
 			onClick: t,
@@ -570,7 +571,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 				"aria-hidden": !0,
 				stroke: 1.5
 			}),
-			size: h.Small,
+			size: m.Small,
 			"aria-label": S?.deleteMessage ?? "Delete message",
 			tooltipProps: { tooltip: x?.delete ?? "Delete" },
 			onClick: i
@@ -581,7 +582,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				size: h.Small,
+				size: m.Small,
 				"aria-label": S?.regenerateResponse ?? "Regenerate response",
 				tooltipProps: { tooltip: x?.regenerate ?? "Regenerate" },
 				onClick: a
@@ -589,7 +590,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 			c && /* @__PURE__ */ Y(n, {
 				iconSize: p.SM,
 				onClick: O,
-				size: h.Small,
+				size: m.Small,
 				isCopied: C === "copy",
 				copyLabel: x?.copy ?? "Copy",
 				copiedLabel: x?.copied ?? "Copied!",
@@ -598,7 +599,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 			l && /* @__PURE__ */ Y(n, {
 				iconSize: p.SM,
 				onClick: k,
-				size: h.Small,
+				size: m.Small,
 				isCopied: C === "markdown",
 				iconCopy: /* @__PURE__ */ Y(_e, {
 					size: p.SM,
@@ -620,13 +621,13 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				size: h.Small,
+				size: m.Small,
 				"aria-label": S?.likeResponse ?? "Like response",
 				"aria-pressed": g === o.Like,
 				tooltipProps: { tooltip: x?.like ?? "Like" },
 				onClick: f
 			}),
-			m && /* @__PURE__ */ Y(j, {
+			h && /* @__PURE__ */ Y(j, {
 				icon: g === o.Dislike ? /* @__PURE__ */ Y(Te, {
 					className: ot.activeRating,
 					size: p.SM,
@@ -637,11 +638,11 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				size: h.Small,
+				size: m.Small,
 				"aria-label": S?.dislikeResponse ?? "Dislike response",
 				"aria-pressed": g === o.Dislike,
 				tooltipProps: { tooltip: x?.dislike ?? "Dislike" },
-				onClick: m
+				onClick: h
 			})
 		] })]
 	});
@@ -652,7 +653,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 	collapsedText: "_collapsedText_qoxdz_15",
 	startersDivider: "_startersDivider_qoxdz_26",
 	text: "_text_qoxdz_30"
-}, lt = ({ text: e, styles: n, actions: a, hasAlwaysVisibleActions: o, isStreaming: c, attachments: l, afterContent: f, starters: p, onSelectStarter: m, deploymentIconUrl: h, deploymentDisplayName: g, markdownComponents: _, markdownClassNames: v, onAttachmentClick: y, onDownloadAll: x, onAttachmentRetry: S, codeBlockTheme: C, labels: w, selectedAttachmentId: T }) => {
+}, lt = ({ text: e, styles: n, actions: a, hasAlwaysVisibleActions: o, isStreaming: c, attachments: l, afterContent: f, starters: p, onSelectStarter: m, deploymentIconUrl: h, deploymentDisplayName: g, markdownComponents: _, markdownClassNames: v, onAttachmentClick: b, onDownloadAll: x, onAttachmentRetry: S, codeBlockTheme: C, labels: w, selectedAttachmentId: T }) => {
 	let { colors: E, typography: D, className: O, bubbleClassName: k } = n ?? {}, { attachmentClickLabel: A, attachmentRetryLabel: j, attachmentOpenInNewTabLabel: M, startersAriaLabel: N = "Quick reply buttons", thinkingLabel: P, codeBlockCopyLabel: F, codeBlockCopiedLabel: I, assistantMessageAriaLabel: L = "Assistant message", deploymentIconFallbackLabel: R = "AI" } = w ?? {}, z = c ? (l ?? []).filter((e) => e.type !== t.Audio) : l ?? [], B = u({
 		"--cm-bubble-text": E?.text,
 		"--cm-starters-divider": E?.startersDivider
@@ -689,7 +690,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 					}),
 					/* @__PURE__ */ Y(tt, {
 						attachments: z,
-						onAttachmentClick: (e) => y?.(l?.find((t) => t.id === e)),
+						onAttachmentClick: (e) => b?.(l?.find((t) => t.id === e)),
 						onDownloadAll: x,
 						onRetry: S,
 						labels: {
@@ -713,7 +714,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 				children: p.map((e, t) => /* @__PURE__ */ Y("div", {
 					role: "listitem",
 					className: "min-w-[40px]",
-					children: /* @__PURE__ */ Y(b, {
+					children: /* @__PURE__ */ Y(y, {
 						label: e.title,
 						className: "min-w-[40px]",
 						onClick: () => m(e)
@@ -725,22 +726,22 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 }, ut = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ Y("div", {
 	role: "status",
 	"aria-live": "polite",
-	children: /* @__PURE__ */ Y(v, {
+	children: /* @__PURE__ */ Y(_, {
 		title: e,
 		message: t,
 		textClassName: "flex-row flex-wrap gap-1"
 	})
 }), dt = /* @__PURE__ */ function(e) {
 	return e.Bottom = "Bottom", e.Top = "Top", e;
-}({}), ft = 10, pt = ({ text: e, position: t = dt.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: a, collapsedLineCount: o = ft, labels: c, onAttachmentClick: l, onDownloadAll: m, onAttachmentRetry: g, selectedAttachmentId: _ }) => {
-	let { colors: v, typography: b, className: x, bubbleClassName: S } = n ?? {}, { showMoreLabel: C = "Show more", showLessLabel: w = "Show less", showMoreAriaLabel: T, showLessAriaLabel: E, attachmentClickLabel: D, attachmentRetryLabel: O, attachmentOpenInNewTabLabel: k, userMessageAriaLabel: A = "User message" } = c ?? {}, { textRef: j, isTextCollapsed: M, isOverflowing: F, collapsedMaxHeight: I, expandedMaxHeight: L, isCollapsed: R, toggleCollapsed: z } = f({
+}({}), ft = 10, pt = ({ text: e, position: t = dt.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: a, collapsedLineCount: o = ft, labels: c, onAttachmentClick: l, onDownloadAll: h, onAttachmentRetry: g, selectedAttachmentId: _ }) => {
+	let { colors: y, typography: b, className: x, bubbleClassName: S } = n ?? {}, { showMoreLabel: C = "Show more", showLessLabel: w = "Show less", showMoreAriaLabel: T, showLessAriaLabel: E, attachmentClickLabel: D, attachmentRetryLabel: O, attachmentOpenInNewTabLabel: k, userMessageAriaLabel: A = "User message" } = c ?? {}, { textRef: j, isTextCollapsed: M, isOverflowing: F, collapsedMaxHeight: I, expandedMaxHeight: L, isCollapsed: R, toggleCollapsed: z } = f({
 		text: e,
 		collapsedLineCount: o
 	}), B = u({
-		"--cm-bubble-user-bg": v?.userBackground,
-		"--cm-bubble-user-border": v?.userBorder,
-		"--cm-bubble-fade-start": v?.fadeStart,
-		"--cm-bubble-text": v?.text,
+		"--cm-bubble-user-bg": y?.userBackground,
+		"--cm-bubble-user-border": y?.userBorder,
+		"--cm-bubble-fade-start": y?.fadeStart,
+		"--cm-bubble-text": y?.text,
 		"--cm-bubble-collapsed-height": F ? `${I}px` : void 0,
 		"--cm-bubble-expanded-height": F ? `${L}px` : void 0
 	}), V = t === dt.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", H = d($.text, b?.fontClassName), ee = T ?? C, te = E ?? w, ne = R ? C : w, U = R ? ee : te, W = R ? N : P, re = Ne();
@@ -755,7 +756,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 				/* @__PURE__ */ Y(tt, {
 					attachments: a ?? [],
 					onAttachmentClick: (e) => l?.(a?.find((t) => t.id === e)),
-					onDownloadAll: m,
+					onDownloadAll: h,
 					onRetry: g,
 					labels: {
 						clickLabel: D,
@@ -777,7 +778,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 								className: d(H, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
 								children: e
 							})
-						}), F && /* @__PURE__ */ Y(y, {
+						}), F && /* @__PURE__ */ Y(v, {
 							label: /* @__PURE__ */ Y(J, { children: ne }),
 							iconBefore: /* @__PURE__ */ Y(W, {
 								size: p.SM,
@@ -788,7 +789,7 @@ var ot = { activeRating: "_activeRating_ygoee_1" }, st = 2e3, ct = ({ role: e =
 							"aria-controls": re,
 							className: "mt-3",
 							onClick: z,
-							size: h.Small
+							size: m.Small
 						})]
 					})
 				}),

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.1.0-dev.270",
+  "version": "1.1.0-dev.277",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -19,10 +19,10 @@
   "peerDependencies": {
     "react": "^19.0.0",
     "@tabler/icons-react": "^3.0.0",
-    "@epam/ai-dial-chat-shared": "1.1.0-dev.270",
-    "@epam/ai-dial-conversation-input": "1.1.0-dev.270",
+    "@epam/ai-dial-chat-shared": "1.1.0-dev.277",
+    "@epam/ai-dial-conversation-input": "1.1.0-dev.277",
     "react-markdown": "^10.1.0",
-    "@epam/ai-dial-ui-kit": "^0.14.0-dev.6"
+    "@epam/ai-dial-ui-kit": "^0.14.0-dev.9"
   },
   "repository": {
     "type": "git",