@epam/ai-dial-conversation-messages 1.1.0-dev.294 → 1.1.0-dev.297

package/index.js

@@ -1,816 +1,283 @@
-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, 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";
-import { Fragment as J, jsx as Y, jsxs as X } from "react/jsx-runtime";
-//#region ../attachment-input/dist/index.js
-var Ie = (e) => {
-	if (e == null) return "";
-	let t = e.lastIndexOf(".");
-	return t > 0 ? e.slice(0, t) : e;
-}, Le = (e) => {
-	if (!e) return R;
-	if (e.startsWith("image/")) switch (e) {
-		case "image/jpeg":
-		case "image/jpg": return ne;
-		case "image/png": return ae;
-		case "image/svg+xml": return le;
-		case "image/bmp": return z;
-		default: return G;
-	}
-	if (e.startsWith("video/")) return ke;
-	if (e.startsWith("audio/")) return ve;
-	switch (e) {
-		case "application/pdf": return re;
-		case "application/msword":
-		case "application/vnd.ms-word": return H;
-		case "application/vnd.openxmlformats-officedocument.wordprocessingml.document": return ee;
-		case "application/vnd.ms-powerpoint": return oe;
-		case "application/vnd.openxmlformats-officedocument.presentationml.presentation": return oe;
-		case "application/vnd.ms-excel": return me;
-		case "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet": return me;
-		case "application/zip":
-		case "application/x-zip-compressed":
-		case "application/x-rar-compressed":
-		case "application/x-7z-compressed":
-		case "application/gzip":
-		case "application/x-tar": return ge;
-		case "text/csv": return V;
-		case "text/plain": return fe;
-		case "text/html":
-		case "application/xhtml+xml": return te;
-		case "text/xml":
-		case "application/xml": return he;
-		case "application/sql":
-		case "text/x-sql": return ce;
-		case "text/javascript":
-		case "application/javascript": return U;
-		case "text/jsx": return W;
-		case "application/typescript":
-		case "text/typescript": return ue;
-		case "text/tsx": return de;
-		case "text/css": return B;
-		case "text/x-php":
-		case "application/x-php": return ie;
-		case "text/x-rustsrc":
-		case "application/x-rust": return se;
-		case "text/x-vue": return pe;
-		default: return R;
-	}
-}, Re = (e) => {
-	let { type: n, contentType: r } = e;
-	return n === t.Prompt ? Ce : n === t.Pasted ? F : n === t.Image ? G : Le(r ?? "");
-}, ze = (e) => {
-	let t = e.toLowerCase().split(";")[0].trim(), n = a[t];
-	if (n) return n;
-	let r = t.split("/")[1];
-	if (r && !r.startsWith("vnd.") && !r.includes("+")) return r;
-}, Be = (e, n) => {
-	let { type: r, name: i, contentType: a } = e;
-	if (r === t.Prompt) return n.promptLabel ?? "Prompt";
-	if (r === t.Pasted) return n.pastedLabel ?? "Pasted";
-	if (r === t.Image) return n.imageLabel ?? "Image";
-	if (a) {
-		let e = ze(a);
-		if (e) return `.${e}`;
-	}
-	if (i == null) return "";
-	let o = i.lastIndexOf(".");
-	return o > 0 && o < i.length - 1 ? `.${i.slice(o + 1).toLowerCase()}` : i;
-}, Ve = (e, n = {}) => {
-	let { type: r, status: i, previewUrl: a, url: o } = e, s = i === c.Loading, l = i === c.Error, u = r === t.Image && !!(a ?? o) && !l, d = r === t.Link && !l;
-	return {
-		isLoading: s,
-		isError: l,
-		isImage: u,
-		isLink: d,
-		BottomIcon: d ? null : Re(e),
-		typeLabel: d ? null : Be(e, n)
-	};
-}, He = "flex size-[84px] items-center justify-center rounded-xl border", Z = {
-	tile: "_tile_1whwz_1",
-	hovered: "_hovered_1whwz_5",
-	selected: "_selected_1whwz_15",
-	tileError: "_tileError_1whwz_20",
-	nameText: "_nameText_1whwz_25",
-	typeText: "_typeText_1whwz_29",
-	retryIcon: "_retryIcon_1whwz_33",
-	track: "_track_1whwz_37",
-	actionButton: "_actionButton_1whwz_43",
-	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: 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,
-	onClick: (e) => {
-		e.stopPropagation(), r(i);
-	}
-}), Ue = ({ ...e }) => /* @__PURE__ */ Y(Q, {
-	icon: /* @__PURE__ */ Y(Se, {
-		size: p.SM,
-		"aria-hidden": !0
-	}),
-	className: Z.retryIcon,
-	...e
-}), We = ({ ...e }) => /* @__PURE__ */ Y(Q, {
-	icon: /* @__PURE__ */ Y(I, {
-		size: p.SM,
-		"aria-hidden": !0
-	}),
-	...e
-}), Ge = ({ ...e }) => /* @__PURE__ */ Y(Q, {
-	icon: /* @__PURE__ */ Y(L, {
-		size: p.SM,
-		"aria-hidden": !0
-	}),
-	...e
-}), Ke = ({ ...e }) => /* @__PURE__ */ Y(Q, {
-	icon: /* @__PURE__ */ Y(Ae, {
-		size: p.SM,
-		"aria-hidden": !0
-	}),
-	...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: _ }) => {
-	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, _ && 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(g, {
-			text: V,
-			query: n,
-			maxLines: 2
-		}) : V
-	}), ne = F && /* @__PURE__ */ X("div", {
-		className: d("flex w-full items-center gap-1", M && z),
-		children: [/* @__PURE__ */ Y(F, {
-			size: 16,
-			className: Z.typeText,
-			"aria-hidden": !0
-		}), /* @__PURE__ */ Y("span", {
-			className: d(w?.metaClassName ?? "dial-caption-text", "min-w-0 flex-1 truncate", Z.typeText),
-			children: b ? `${I} · ${b}` : I
-		})]
-	}), U = () => {
-		m && p ? p(E) : r && r(E);
-	}, W = /* @__PURE__ */ X(J, { children: [
-		te,
-		ne,
-		j && /* @__PURE__ */ Y("div", {
-			"aria-label": x,
-			className: d("absolute left-[-1px] top-[-1px] flex size-full items-center justify-center rounded", Z.track),
-			children: /* @__PURE__ */ Y(O, { size: 32 })
-		}),
-		/* @__PURE__ */ X("div", {
-			className: d("absolute right-0 top-0 flex gap-1"),
-			children: [
-				L && /* @__PURE__ */ Y(We, {
-					ariaLabel: v,
-					errorTitle: P,
-					errorDescId: N,
-					onClick: s,
-					id: E
-				}),
-				R && /* @__PURE__ */ Y(Ue, {
-					ariaLabel: y,
-					errorTitle: P,
-					errorDescId: N,
-					onClick: i,
-					id: E
-				}),
-				u && /* @__PURE__ */ Y(Ge, {
-					ariaLabel: y,
-					errorTitle: P,
-					errorDescId: N,
-					onClick: H
-				}),
-				h && /* @__PURE__ */ Y(Ke, {
-					ariaLabel: y,
-					errorTitle: P,
-					errorDescId: N,
-					onClick: h,
-					id: E
-				})
-			]
-		}),
-		M && /* @__PURE__ */ Y("span", {
-			id: N,
-			role: "status",
-			"aria-live": "polite",
-			className: "sr-only",
-			children: P
-		})
-	] });
-	return /* @__PURE__ */ Y("div", {
-		style: f,
-		className: d("inline-flex", T),
-		children: /* @__PURE__ */ Y("div", {
-			role: "button",
-			tabIndex: 0,
-			"aria-label": v,
-			onClick: U,
-			onKeyDown: B,
-			style: f,
-			className: d(ee, "cursor-pointer focus-within:outline focus-within:outline-1 focus-within:outline-offset-1"),
-			children: W
-		})
-	});
-}, Ye = /* @__PURE__ */ function(e) {
-	return e.Idle = "idle", e.Loading = "loading", e.Loaded = "loaded", e.Error = "error", e;
-}({}), Xe = ({ enabled: e, src: t }) => {
-	let n = Fe(null), [r, i] = q("idle");
-	return Me(() => {
-		i(e && t ? "loading" : "idle");
-	}, [e, t]), Me(() => {
-		let r = n.current;
-		if (!r || !e || !t) return;
-		let a = () => i("loaded"), o = () => i("error");
-		return r.addEventListener("load", a), r.addEventListener("error", o), r.complete && i(r.naturalWidth > 0 ? "loaded" : "error"), () => {
-			r.removeEventListener("load", a), r.removeEventListener("error", o);
-		};
-	}, [e, t]), {
-		imageRef: n,
-		imageLoadStatus: r
-	};
-}, Ze = ({ attachment: e, onExpand: n, onClick: r, labels: i, onRemove: a, cssVars: o, onDownload: s, styles: c, isSelected: l }) => {
-	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: _
-	}), 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: D,
-		onKeyDown: (e) => {
-			(e.key === "Enter" || e.key === " ") && (e.preventDefault(), D());
-		},
-		tabIndex: 0,
-		role: "button",
-		style: o,
-		"aria-label": S ? u : v ? f : void 0,
-		children: /* @__PURE__ */ X("div", {
-			className: "relative h-full w-full overflow-hidden",
-			children: [
-				a && /* @__PURE__ */ Y(Ke, {
-					onClick: a,
-					id: h,
-					className: Z.imageActionButton
-				}),
-				s && /* @__PURE__ */ Y(We, {
-					onClick: s,
-					id: h,
-					className: Z.imageActionButton
-				}),
-				w !== Ye.Loaded && /* @__PURE__ */ Y(T, {
-					variant: E.Rectangular,
-					width: "100%",
-					height: "100%",
-					active: w === Ye.Loading,
-					overlay: /* @__PURE__ */ Y(G, {
-						size: p.LG,
-						className: Z.typeText,
-						"aria-hidden": !0
-					}),
-					className: "absolute inset-0 rounded-xl"
-				}),
-				/* @__PURE__ */ Y("img", {
-					ref: C,
-					src: _,
-					alt: g,
-					loading: "lazy",
-					decoding: "async",
-					className: d("h-full w-full rounded-xl object-cover transition-opacity duration-200", w === Ye.Loaded ? "opacity-100" : "opacity-0")
-				})
-			]
-		})
-	});
-}, Qe = ({ attachment: e, searchQuery: n = "", onRemove: r, onRetry: i, onExpand: a, onClick: o, onDownload: s, labels: c, styles: l, isSelected: d }) => {
-	let { colors: f } = l ?? {}, p = e.type === t.Pasted, m = p && a !== void 0, h = u({
-		"--ai-tile-bg": f?.background,
-		"--ai-tile-border": f?.border,
-		"--ai-tile-bg-hover": f?.backgroundHover,
-		"--ai-tile-border-hover": f?.borderHover,
-		"--ai-tile-bg-selected": f?.backgroundSelected,
-		"--ai-tile-border-selected": f?.borderSelected,
-		"--ai-tile-focus-outline": f?.focusOutline,
-		"--ai-tile-bg-error": f?.backgroundError,
-		"--ai-tile-border-error": f?.borderError,
-		"--ai-tile-error-text": f?.errorText,
-		"--ai-tile-name-text": f?.nameText,
-		"--ai-tile-type-text": f?.typeText,
-		"--ai-tile-hover-icon-bg": f?.hoverIconBackground,
-		"--ai-tile-hover-icon-color": f?.hoverIconColor,
-		"--ai-tile-progress-track": f?.trackBackground
-	}), { isImage: g, isLink: _ } = Pe(() => Ve(e), [e]);
-	return g ? /* @__PURE__ */ Y(Ze, {
-		attachment: e,
-		labels: c,
-		onClick: o,
-		onExpand: a,
-		styles: l,
-		onRemove: r,
-		cssVars: h,
-		onDownload: s,
-		isSelected: d
-	}) : /* @__PURE__ */ Y(Je, {
-		attachment: e,
-		searchQuery: n,
-		onClick: o,
-		onRetry: i,
-		onRemove: r,
-		onDownload: s,
-		isLink: _,
-		isPasted: p,
-		styles: l,
-		labels: c,
-		onExpand: a,
-		cssVars: h,
-		isExpandable: m,
-		isSelected: d
-	});
-}, $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: 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);
-		r ? r(t) : t.forEach((e) => n?.(e.id));
-	}, P = (t) => {
-		let n = e.find((e) => e.id === t);
-		n && r?.([n]);
-	};
-	return /* @__PURE__ */ X("div", {
-		role: "group",
-		"aria-label": l,
-		style: E,
-		className: d("flex flex-col gap-1", A ? "w-full min-w-0 max-w-[492px]" : "max-w-[420px]", $e.container, T),
-		children: [/* @__PURE__ */ X("div", {
-			className: "flex items-center justify-between",
-			children: [/* @__PURE__ */ X("div", {
-				className: "flex items-center gap-1",
-				children: [/* @__PURE__ */ Y(j, {
-					size: p.SM,
-					className: d("shrink-0", $e.headerIcon),
-					"aria-hidden": !0
-				}), /* @__PURE__ */ Y("span", {
-					className: d(C?.headerLabelClassName ?? "dial-tiny-semi-text", $e.headerLabel),
-					children: M
-				})]
-			}), e.length >= 2 && (r || n) && /* @__PURE__ */ Y(h, {
-				icon: /* @__PURE__ */ Y(I, {
-					size: p.SM,
-					"aria-hidden": !0
-				}),
-				size: m.Small,
-				"aria-label": _,
-				onClick: N
-			})]
-		}), /* @__PURE__ */ Y("div", {
-			role: "list",
-			"aria-label": M,
-			className: d("gap-3", A ? "grid grid-cols-[repeat(5,83px)]" : "flex flex-wrap"),
-			children: e.map((e, t) => /* @__PURE__ */ Y("div", {
-				role: "listitem",
-				children: /* @__PURE__ */ Y(Qe, {
-					attachment: e,
-					onClick: n,
-					onDownload: P,
-					onRetry: i,
-					labels: {
-						clickLabel: f,
-						retryLabel: g,
-						promptLabel: b,
-						pastedLabel: x,
-						imageLabel: S,
-						openInNewTabLabel: v
-					},
-					isSelected: e.id === s
-				})
-			}, `${e.id}-${t}`))
-		})]
-	});
-}, nt = ({ features: e, initialResponseFormat: t, initialSystemPrompt: n, initialTemperature: r, onSave: i, onClose: a, isOpen: o }) => {
-	let [s, c] = q(t), [l, u] = q(n), [d, f] = q(r), p = Fe(o);
-	Me(() => {
-		o && !p.current && (c(t), u(n), f(r)), p.current = o;
-	}, [
-		o,
-		t,
-		n,
-		r
-	]);
-	let m = !e.responseFormat || s != null;
-	return {
-		responseFormat: s,
-		systemPrompt: l,
-		temperature: d,
-		canSubmit: m,
-		setResponseFormat: c,
-		setSystemPrompt: u,
-		setTemperature: f,
-		handleSubmit: K(() => {
-			if (!m) return;
-			let t = {};
-			e.responseFormat && s != null && (t.responseFormat = s), e.systemPrompt && (t.systemPrompt = l), e.temperature && (t.temperature = d), i(t), a();
-		}, [
-			m,
-			e,
-			s,
-			l,
-			d,
-			i,
-			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: m = "System prompt", systemPromptTooltip: h = "Enter a prompt", temperatureLabel: g = "Temperature", temperatureLabels: _ = [
-	"Precise",
-	"Neutral",
-	"Creative"
-], 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: x,
-		children: [
-			e.responseFormat && /* @__PURE__ */ Y(C, {
-				id: "response-format",
-				labelProps: {
-					label: s,
-					className: S,
-					caption: c
-				},
-				optionsClassName: "mb-2",
-				orientation: w.Column,
-				value: t ?? l.Markdown,
-				items: [{
-					value: l.Markdown,
-					label: f
-				}, {
-					value: l.PlainText,
-					label: p
-				}],
-				onChange: (e) => i(e)
-			}),
-			e.systemPrompt && /* @__PURE__ */ Y(A, {
-				value: n,
-				placeholder: h,
-				resize: !0,
-				labelProps: {
-					className: S,
-					label: m
-				},
-				onChange: (e) => a(e ?? "")
-			}),
-			e.temperature && /* @__PURE__ */ Y(D, {
-				labelProps: {
-					label: g,
-					className: S,
-					caption: v
-				},
-				value: r,
-				min: 0,
-				max: 1,
-				step: .1,
-				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: C, systemPrompt: w, temperature: T, canSubmit: E, setResponseFormat: D, setSystemPrompt: O, setTemperature: k, handleSubmit: A } = nt({
-		features: e,
-		initialResponseFormat: t,
-		initialSystemPrompt: n,
-		initialTemperature: r,
-		onSave: i,
-		onClose: a
-	});
-	return /* @__PURE__ */ Y(b, {
-		open: !0,
-		header: o,
-		titleClassName: s,
-		size: x.Sm,
-		onClose: a,
-		className: y,
-		footer: /* @__PURE__ */ Y("div", {
-			className: "flex justify-end px-6 py-4",
-			children: /* @__PURE__ */ Y(M, {
-				tooltip: v,
-				hideTooltip: E || !v,
-				children: /* @__PURE__ */ Y(S, {
-					label: _,
-					onClick: A,
-					disabled: !E
-				})
-			})
-		}),
-		children: /* @__PURE__ */ Y(it, {
-			features: e,
-			responseFormat: C,
-			systemPrompt: w,
-			temperature: T,
-			onResponseFormatChange: D,
-			onSystemPromptChange: O,
-			onTemperatureChange: k,
-			responseFormatLabel: c,
-			responseFormatHint: l,
-			responseFormatMarkdownLabel: u,
-			responseFormatPlainTextLabel: d,
-			systemPromptLabel: f,
-			systemPromptTooltip: p,
-			temperatureLabel: m,
-			temperatureLabels: h,
-			temperatureHint: g
-		})
-	});
-});
-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(() => {
-		l?.(), w("markdown"), E(S?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => w(null), st);
-	}, [l, S?.copiedMarkdownStatus]);
-	return /* @__PURE__ */ X("div", {
+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";
+import { AttachmentGroup as l } from "@epam/ai-dial-attachment-input";
+import { DIAL_ICON_SIZE as u, ElementSize as d, InfoMessageNotification as f, LinkButton as p, NeutralButton as m, ToggleIconButton as h } from "@epam/ai-dial-ui-kit";
+import { IconChevronDown as g, IconChevronUp as _, IconMarkdown as v, IconPencilMinus as y, IconRefresh as b, IconThumbDown as x, IconThumbDownFilled as S, IconThumbUp as C, IconThumbUpFilled as w, IconTrashX as T } from "@tabler/icons-react";
+import { useCallback as E, useId as D, useState as O } from "react";
+import { Fragment as k, jsx as A, jsxs as j } from "react/jsx-runtime";
+var M = { activeRating: "_activeRating_ygoee_1" }, N = 2e3, P = ({ role: e = a.User, onEdit: n, onEditHover: r, onDelete: c, onRegenerate: l, onCopy: f, onCopyMarkdown: p, onLike: m, onDislike: g, activeRating: _, isAlwaysVisible: D, className: P, labels: F, colors: I }) => {
+	let { tooltips: L, ariaLabels: R } = F ?? {}, [z, B] = O(null), [V, H] = O(""), U = o({ "--ma-active-rating-text": I?.activeRatingText }), W = E(() => {
+		f?.(), B("copy"), H(R?.copiedStatus ?? "Copied to clipboard"), setTimeout(() => B(null), N);
+	}, [f, R?.copiedStatus]), G = E(() => {
+		p?.(), B("markdown"), H(R?.copiedMarkdownStatus ?? "Copied as Markdown to clipboard"), setTimeout(() => B(null), N);
+	}, [p, R?.copiedMarkdownStatus]);
+	return /* @__PURE__ */ j("div", {
 		role: "toolbar",
-		"aria-label": S?.actionsGroup ?? "Message actions",
-		style: D,
-		className: d("flex gap-1", !_ && "opacity-0 group-hover:opacity-100", v),
-		children: [/* @__PURE__ */ Y("span", {
+		"aria-label": R?.actionsGroup ?? "Message actions",
+		style: U,
+		className: s("flex gap-1", !D && "opacity-0 group-hover:opacity-100", P),
+		children: [/* @__PURE__ */ A("span", {
 			role: "status",
 			"aria-live": "polite",
 			className: "sr-only",
-			children: T
-		}), e === s.User ? /* @__PURE__ */ X(J, { children: [t && /* @__PURE__ */ Y(j, {
-			icon: /* @__PURE__ */ Y(be, {
-				size: p.SM,
+			children: V
+		}), e === a.User ? /* @__PURE__ */ j(k, { children: [n && /* @__PURE__ */ A(h, {
+			icon: /* @__PURE__ */ A(y, {
+				size: u.SM,
 				"aria-hidden": !0,
 				stroke: 1.5
 			}),
-			size: m.Small,
-			"aria-label": S?.editMessage ?? "Edit message",
-			tooltipProps: { tooltip: x?.edit ?? "Edit" },
-			onClick: t,
+			size: d.Small,
+			"aria-label": R?.editMessage ?? "Edit message",
+			tooltipProps: { tooltip: L?.edit ?? "Edit" },
+			onClick: n,
 			onMouseEnter: r,
 			onFocus: r
-		}), i && /* @__PURE__ */ Y(j, {
-			icon: /* @__PURE__ */ Y(Oe, {
-				size: p.SM,
+		}), c && /* @__PURE__ */ A(h, {
+			icon: /* @__PURE__ */ A(T, {
+				size: u.SM,
 				"aria-hidden": !0,
 				stroke: 1.5
 			}),
-			size: m.Small,
-			"aria-label": S?.deleteMessage ?? "Delete message",
-			tooltipProps: { tooltip: x?.delete ?? "Delete" },
-			onClick: i
-		})] }) : /* @__PURE__ */ X(J, { children: [
-			a && /* @__PURE__ */ Y(j, {
-				icon: /* @__PURE__ */ Y(xe, {
-					size: p.SM,
+			size: d.Small,
+			"aria-label": R?.deleteMessage ?? "Delete message",
+			tooltipProps: { tooltip: L?.delete ?? "Delete" },
+			onClick: c
+		})] }) : /* @__PURE__ */ j(k, { children: [
+			l && /* @__PURE__ */ A(h, {
+				icon: /* @__PURE__ */ A(b, {
+					size: u.SM,
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				size: m.Small,
-				"aria-label": S?.regenerateResponse ?? "Regenerate response",
-				tooltipProps: { tooltip: x?.regenerate ?? "Regenerate" },
-				onClick: a
+				size: d.Small,
+				"aria-label": R?.regenerateResponse ?? "Regenerate response",
+				tooltipProps: { tooltip: L?.regenerate ?? "Regenerate" },
+				onClick: l
 			}),
-			c && /* @__PURE__ */ Y(n, {
-				iconSize: p.SM,
-				onClick: O,
-				size: m.Small,
-				isCopied: C === "copy",
-				copyLabel: x?.copy ?? "Copy",
-				copiedLabel: x?.copied ?? "Copied!",
-				ariaLabel: S?.copyResponse ?? "Copy response"
+			f && /* @__PURE__ */ A(t, {
+				iconSize: u.SM,
+				onClick: W,
+				size: d.Small,
+				isCopied: z === "copy",
+				copyLabel: L?.copy ?? "Copy",
+				copiedLabel: L?.copied ?? "Copied!",
+				ariaLabel: R?.copyResponse ?? "Copy response"
 			}),
-			l && /* @__PURE__ */ Y(n, {
-				iconSize: p.SM,
-				onClick: k,
-				size: m.Small,
-				isCopied: C === "markdown",
-				iconCopy: /* @__PURE__ */ Y(_e, {
-					size: p.SM,
+			p && /* @__PURE__ */ A(t, {
+				iconSize: u.SM,
+				onClick: G,
+				size: d.Small,
+				isCopied: z === "markdown",
+				iconCopy: /* @__PURE__ */ A(v, {
+					size: u.SM,
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				copyLabel: x?.copyMarkdown ?? "Copy as Markdown",
-				copiedLabel: x?.copiedMarkdown ?? "Copied!",
-				ariaLabel: S?.copyAsMarkdown ?? "Copy as markdown"
+				copyLabel: L?.copyMarkdown ?? "Copy as Markdown",
+				copiedLabel: L?.copiedMarkdown ?? "Copied!",
+				ariaLabel: R?.copyAsMarkdown ?? "Copy as markdown"
 			}),
-			f && /* @__PURE__ */ Y(j, {
-				icon: g === o.Like ? /* @__PURE__ */ Y(De, {
-					className: ot.activeRating,
-					size: p.SM,
+			m && /* @__PURE__ */ A(h, {
+				icon: _ === i.Like ? /* @__PURE__ */ A(w, {
+					className: M.activeRating,
+					size: u.SM,
 					stroke: 1.5,
 					"aria-hidden": !0
-				}) : /* @__PURE__ */ Y(Ee, {
-					size: p.SM,
+				}) : /* @__PURE__ */ A(C, {
+					size: u.SM,
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				size: m.Small,
-				"aria-label": S?.likeResponse ?? "Like response",
-				"aria-pressed": g === o.Like,
-				tooltipProps: { tooltip: x?.like ?? "Like" },
-				onClick: f
+				size: d.Small,
+				"aria-label": R?.likeResponse ?? "Like response",
+				"aria-pressed": _ === i.Like,
+				tooltipProps: { tooltip: L?.like ?? "Like" },
+				onClick: m
 			}),
-			h && /* @__PURE__ */ Y(j, {
-				icon: g === o.Dislike ? /* @__PURE__ */ Y(Te, {
-					className: ot.activeRating,
-					size: p.SM,
+			g && /* @__PURE__ */ A(h, {
+				icon: _ === i.Dislike ? /* @__PURE__ */ A(S, {
+					className: M.activeRating,
+					size: u.SM,
 					"aria-hidden": !0,
 					stroke: 1.5
-				}) : /* @__PURE__ */ Y(we, {
-					size: p.SM,
+				}) : /* @__PURE__ */ A(x, {
+					size: u.SM,
 					"aria-hidden": !0,
 					stroke: 1.5
 				}),
-				size: m.Small,
-				"aria-label": S?.dislikeResponse ?? "Dislike response",
-				"aria-pressed": g === o.Dislike,
-				tooltipProps: { tooltip: x?.dislike ?? "Dislike" },
-				onClick: h
+				size: d.Small,
+				"aria-label": R?.dislikeResponse ?? "Dislike response",
+				"aria-pressed": _ === i.Dislike,
+				tooltipProps: { tooltip: L?.dislike ?? "Dislike" },
+				onClick: g
 			})
 		] })]
 	});
-}, $ = {
+}, F = {
 	userBubble: "_userBubble_qoxdz_1",
 	collapsibleText: "_collapsibleText_qoxdz_6",
 	expandedText: "_expandedText_qoxdz_11",
 	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: 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
-	}), V = d($.text, D?.fontClassName), H = !!(h || g);
-	return /* @__PURE__ */ X("div", {
+}, I = ({ text: t, styles: i, actions: c, hasAlwaysVisibleActions: u, isStreaming: d, attachments: f, afterContent: p, starters: h, onSelectStarter: g, deploymentIconUrl: _, deploymentDisplayName: v, markdownComponents: y, markdownClassNames: b, onAttachmentClick: x, onDownloadAll: S, onAttachmentRetry: C, codeBlockTheme: w, labels: T, selectedAttachmentId: E }) => {
+	let { colors: D, typography: O, className: k, bubbleClassName: M } = i ?? {}, { attachmentClickLabel: N, attachmentRetryLabel: I, attachmentOpenInNewTabLabel: L, startersAriaLabel: R = "Quick reply buttons", thinkingLabel: z, codeBlockCopyLabel: B, codeBlockCopiedLabel: V, assistantMessageAriaLabel: H = "Assistant message", deploymentIconFallbackLabel: U = "AI" } = T ?? {}, W = d ? (f ?? []).filter((t) => t.type !== e.Audio) : f ?? [], G = o({
+		"--cm-bubble-text": D?.text,
+		"--cm-starters-divider": D?.startersDivider
+	}), K = s(F.text, O?.fontClassName), q = !!(_ || v);
+	return /* @__PURE__ */ j("div", {
 		role: "group",
-		"aria-label": L,
-		style: B,
-		className: d("flex w-full items-start gap-3", O),
-		children: [H && /* @__PURE__ */ Y(r, {
-			src: h,
+		"aria-label": H,
+		style: G,
+		className: s("flex w-full items-start gap-3", k),
+		children: [q && /* @__PURE__ */ A(n, {
+			src: _,
 			size: 28,
-			initialsName: g || R,
-			labels: { tooltip: g ?? R }
-		}), /* @__PURE__ */ X("div", {
+			initialsName: v || U,
+			labels: { tooltip: v ?? U }
+		}), /* @__PURE__ */ j("div", {
 			className: "flex w-full min-w-0 max-w-full flex-col items-start gap-5",
-			children: [/* @__PURE__ */ X("div", {
-				className: d("flex w-full min-w-0 max-w-full flex-col items-start gap-4", k),
+			children: [/* @__PURE__ */ j("div", {
+				className: s("flex w-full min-w-0 max-w-full flex-col items-start gap-4", M),
 				children: [
-					(e || c) && /* @__PURE__ */ Y("div", {
+					(t || d) && /* @__PURE__ */ A("div", {
 						"aria-live": "polite",
 						"aria-atomic": "false",
-						className: d(V, "min-w-0 max-w-full text-start"),
-						children: /* @__PURE__ */ Y(i, {
-							content: e,
-							isStreaming: c,
-							thinkingLabel: P,
-							components: _,
-							classNames: v,
-							codeBlockCopyLabel: F,
-							codeBlockCopiedLabel: I,
-							codeBlockTheme: C
+						className: s(K, "min-w-0 max-w-full text-start"),
+						children: /* @__PURE__ */ A(r, {
+							content: t,
+							isStreaming: d,
+							thinkingLabel: z,
+							components: y,
+							classNames: b,
+							codeBlockCopyLabel: B,
+							codeBlockCopiedLabel: V,
+							codeBlockTheme: w
 						})
 					}),
-					/* @__PURE__ */ Y(tt, {
-						attachments: z,
-						onAttachmentClick: (e) => b?.(l?.find((t) => t.id === e)),
-						onDownloadAll: x,
-						onRetry: S,
+					/* @__PURE__ */ A(l, {
+						attachments: W,
+						onAttachmentClick: (e) => x?.(f?.find((t) => t.id === e)),
+						onDownloadAll: S,
+						onRetry: C,
 						labels: {
-							clickLabel: A,
-							retryLabel: j,
-							openInNewTabLabel: M
+							clickLabel: N,
+							retryLabel: I,
+							openInNewTabLabel: L
 						},
-						selectedAttachmentId: T
+						selectedAttachmentId: E
 					}),
-					f,
-					/* @__PURE__ */ Y(ct, {
-						...a,
-						isAlwaysVisible: o,
-						role: s.Assistant
+					p,
+					/* @__PURE__ */ A(P, {
+						...c,
+						isAlwaysVisible: u,
+						role: a.Assistant
 					})
 				]
-			}), p && p.length > 0 && m && /* @__PURE__ */ Y("div", {
+			}), h && h.length > 0 && g && /* @__PURE__ */ A("div", {
 				role: "list",
-				"aria-label": N,
-				className: d("flex w-full flex-wrap gap-2 border-t pt-5", $.startersDivider),
-				children: p.map((e, t) => /* @__PURE__ */ Y("div", {
+				"aria-label": R,
+				className: s("flex w-full flex-wrap gap-2 border-t pt-5", F.startersDivider),
+				children: h.map((e, t) => /* @__PURE__ */ A("div", {
 					role: "listitem",
 					className: "min-w-[40px]",
-					children: /* @__PURE__ */ Y(y, {
+					children: /* @__PURE__ */ A(m, {
 						label: e.title,
 						className: "min-w-[40px]",
-						onClick: () => m(e)
+						onClick: () => g(e)
 					})
 				}, t))
 			})]
 		})]
 	});
-}, ut = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ Y("div", {
+}, L = ({ labels: { titleText: e = "Model switched.", bodyText: t } }) => /* @__PURE__ */ A("div", {
 	role: "status",
 	"aria-live": "polite",
-	children: /* @__PURE__ */ Y(_, {
+	children: /* @__PURE__ */ A(f, {
 		title: e,
 		message: t,
 		textClassName: "flex-row flex-wrap gap-1"
 	})
-}), dt = /* @__PURE__ */ function(e) {
+}), R = /* @__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: 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({
+}({}), z = 10, B = ({ text: e, position: t = R.Bottom, styles: n, actions: r, hasAlwaysVisibleActions: i, attachments: f, collapsedLineCount: m = z, labels: h, onAttachmentClick: v, onDownloadAll: y, onAttachmentRetry: b, selectedAttachmentId: x }) => {
+	let { colors: S, typography: C, className: w, bubbleClassName: T } = n ?? {}, { showMoreLabel: E = "Show more", showLessLabel: O = "Show less", showMoreAriaLabel: M, showLessAriaLabel: N, attachmentClickLabel: I, attachmentRetryLabel: L, attachmentOpenInNewTabLabel: B, userMessageAriaLabel: V = "User message" } = h ?? {}, { textRef: H, isTextCollapsed: U, isOverflowing: W, collapsedMaxHeight: G, expandedMaxHeight: K, isCollapsed: q, toggleCollapsed: J } = c({
 		text: e,
-		collapsedLineCount: o
-	}), B = u({
-		"--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();
-	return /* @__PURE__ */ Y("div", {
+		collapsedLineCount: m
+	}), Y = o({
+		"--cm-bubble-user-bg": S?.userBackground,
+		"--cm-bubble-user-border": S?.userBorder,
+		"--cm-bubble-fade-start": S?.fadeStart,
+		"--cm-bubble-text": S?.text,
+		"--cm-bubble-collapsed-height": W ? `${G}px` : void 0,
+		"--cm-bubble-expanded-height": W ? `${K}px` : void 0
+	}), X = t === R.Top ? "rounded-ee-md rounded-se-2xl" : "rounded-se-md rounded-ee-2xl", Z = s(F.text, C?.fontClassName), Q = M ?? E, ee = N ?? O, te = q ? E : O, ne = q ? Q : ee, re = q ? g : _, $ = D();
+	return /* @__PURE__ */ A("div", {
 		role: "group",
-		"aria-label": A,
-		style: B,
-		className: d("flex w-full", x),
-		children: /* @__PURE__ */ X("div", {
+		"aria-label": V,
+		style: Y,
+		className: s("flex w-full", w),
+		children: /* @__PURE__ */ j("div", {
 			className: "ms-auto flex w-fit min-w-0 max-w-full flex-col items-end gap-4",
 			children: [
-				/* @__PURE__ */ Y(tt, {
-					attachments: a ?? [],
-					onAttachmentClick: (e) => l?.(a?.find((t) => t.id === e)),
-					onDownloadAll: h,
-					onRetry: g,
+				/* @__PURE__ */ A(l, {
+					attachments: f ?? [],
+					onAttachmentClick: (e) => v?.(f?.find((t) => t.id === e)),
+					onDownloadAll: y,
+					onRetry: b,
 					labels: {
-						clickLabel: D,
-						retryLabel: O,
-						openInNewTabLabel: k
+						clickLabel: I,
+						retryLabel: L,
+						openInNewTabLabel: B
 					},
 					styles: { className: "max-w-[640px]" },
-					selectedAttachmentId: _
+					selectedAttachmentId: x
 				}),
-				e && /* @__PURE__ */ Y("div", {
-					className: d($.userBubble, "flex w-fit items-center justify-end rounded-es-2xl rounded-ss-2xl border px-6 py-4", V, S),
-					children: /* @__PURE__ */ X("div", {
+				e && /* @__PURE__ */ A("div", {
+					className: s(F.userBubble, "flex w-fit items-center justify-end rounded-es-2xl rounded-ss-2xl border px-6 py-4", X, T),
+					children: /* @__PURE__ */ j("div", {
 						className: "flex min-w-0 flex-col items-start",
-						children: [/* @__PURE__ */ Y("div", {
-							id: re,
-							className: d("relative overflow-hidden", F && $.collapsibleText, F && !R && $.expandedText, M && $.collapsedText),
-							children: /* @__PURE__ */ Y("p", {
-								ref: j,
-								className: d(H, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
+						children: [/* @__PURE__ */ A("div", {
+							id: $,
+							className: s("relative overflow-hidden", W && F.collapsibleText, W && !q && F.expandedText, U && F.collapsedText),
+							children: /* @__PURE__ */ A("p", {
+								ref: H,
+								className: s(Z, "whitespace-pre-wrap text-start [overflow-wrap:anywhere]"),
 								children: e
 							})
-						}), F && /* @__PURE__ */ Y(v, {
-							label: /* @__PURE__ */ Y(J, { children: ne }),
-							iconBefore: /* @__PURE__ */ Y(W, {
-								size: p.SM,
+						}), W && /* @__PURE__ */ A(p, {
+							label: /* @__PURE__ */ A(k, { children: te }),
+							iconBefore: /* @__PURE__ */ A(re, {
+								size: u.SM,
 								"aria-hidden": "true"
 							}),
-							"aria-label": U,
-							"aria-expanded": !R,
-							"aria-controls": re,
+							"aria-label": ne,
+							"aria-expanded": !q,
+							"aria-controls": $,
 							className: "mt-3",
-							onClick: z,
-							size: m.Small
+							onClick: J,
+							size: d.Small
 						})]
 					})
 				}),
-				/* @__PURE__ */ Y(ct, {
+				/* @__PURE__ */ A(P, {
 					...r,
 					isAlwaysVisible: i,
-					role: s.User
+					role: a.User
 				})
 			]
 		})
 	});
-}, mt = ({ role: e, onAttachmentClick: t, markdownComponents: n, ...r }) => e === s.Status ? /* @__PURE__ */ Y(ut, { labels: {
+}, V = ({ role: e, onAttachmentClick: t, markdownComponents: n, ...r }) => e === a.Status ? /* @__PURE__ */ A(L, { labels: {
 	titleText: r.labels?.statusTitleText,
 	bodyText: r.labels?.statusBodyText ?? ""
-} }) : e === s.User ? /* @__PURE__ */ Y(pt, {
+} }) : e === a.User ? /* @__PURE__ */ A(B, {
 	...r,
 	onAttachmentClick: t
-}) : /* @__PURE__ */ Y(lt, {
+}) : /* @__PURE__ */ A(I, {
 	...r,
 	markdownComponents: n,
 	onAttachmentClick: t
 });
 //#endregion
-export { lt as AssistantMessageBubble, dt as BubblePosition, ct as MessageActions, mt as MessageBubble, ut as StatusMessageBubble, pt as UserMessageBubble };
+export { I as AssistantMessageBubble, R as BubblePosition, P as MessageActions, V as MessageBubble, L as StatusMessageBubble, B 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.1.0-dev.294",
+  "version": "1.1.0-dev.297",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -19,9 +19,9 @@
   "peerDependencies": {
     "react": "^19.0.0",
     "@tabler/icons-react": "^3.0.0",
-    "@epam/ai-dial-chat-shared": "1.1.0-dev.294",
-    "@epam/ai-dial-conversation-input": "1.1.0-dev.294",
     "react-markdown": "^10.1.0",
+    "@epam/ai-dial-attachment-input": "1.1.0-dev.297",
+    "@epam/ai-dial-chat-shared": "1.1.0-dev.297",
     "@epam/ai-dial-ui-kit": "^0.14.0-dev.13"
   },
   "repository": {