@epam/ai-dial-conversation-stages 1.1.0-dev.124 → 1.1.0-dev.126

package/index.js

@@ -1,5 +1,5 @@
 import { MarkdownRenderer as e, StageStatus as t, buildCssVars as n, copyToClipboard as r, mergeClasses as i } from "@epam/ai-dial-chat-shared";
-import { DIAL_ICON_SIZE as a, DialEllipsisTooltip as o, DialSpinner as s, ElementSize as c, GhostIconButton as l, LinkButton as u } from "@epam/ai-dial-ui-kit";
+import { DIAL_ICON_SIZE as a, DialEllipsisTooltip as o, ElementSize as s, GhostIconButton as c, LinkButton as l, Spinner as u } from "@epam/ai-dial-ui-kit";
 import { IconAlertCircle as d, IconCheck as f, IconChevronDown as p, IconChevronRight as m, IconCopy as h } from "@tabler/icons-react";
 import { memo as g, useCallback as _, useEffect as v, useRef as y, useState as b } from "react";
 import { Fragment as x, jsx as S, jsxs as C } from "react/jsx-runtime";
@@ -57,7 +57,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 	codeInline: "_codeInline_1ucl5_63",
 	blockquote: "_blockquote_1ucl5_69",
 	tableCell: "_tableCell_1ucl5_74"
-}, F = ({ status: e, isLive: n, runningLabel: r = "Running", failedLabel: i = "Failed" }) => n ? /* @__PURE__ */ S(s, {
+}, F = ({ status: e, isLive: n, runningLabel: r = "Running", failedLabel: i = "Failed" }) => n ? /* @__PURE__ */ S(u, {
 	size: 16,
 	ariaLabel: r
 }) : e === t.Failed ? /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(d, {
@@ -72,17 +72,17 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 	className: P.iconCompleted,
 	"aria-hidden": !0
 }), I = ({ children: e, codeClassName: t, copyAriaLabel: n }) => {
-	let [o, s] = b(!1), u = y(null);
+	let [o, l] = b(!1), u = y(null);
 	v(() => () => {
 		u.current != null && clearTimeout(u.current);
 	}, []);
 	let d = _(() => {
-		r(typeof e == "string" ? e : String(e ?? "")), u.current && clearTimeout(u.current), s(!0), u.current = setTimeout(() => s(!1), 2e3);
+		r(typeof e == "string" ? e : String(e ?? "")), u.current && clearTimeout(u.current), l(!0), u.current = setTimeout(() => l(!1), 2e3);
 	}, [e]);
 	return /* @__PURE__ */ C("pre", {
 		className: i("dial-small-text relative max-h-[300px] overflow-auto rounded border p-3", P.codeBlock),
-		children: [/* @__PURE__ */ S(l, {
-			size: c.Small,
+		children: [/* @__PURE__ */ S(c, {
+			size: s.Small,
 			icon: S(o ? f : h, {
 				size: a.SM,
 				className: P.iconSecondary
@@ -299,12 +299,12 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 	doneIcon: "_doneIcon_rt6w3_19",
 	failedText: "_failedText_rt6w3_23",
 	liveName: "_liveName_rt6w3_27"
-}, H = ({ stages: e, isStreaming: r, labels: o, className: c, styles: l }) => {
+}, H = ({ stages: e, isStreaming: r, labels: o, className: s, styles: c }) => {
 	let { executedLabel: d = "Executed", stepsLabel: h = () => "steps", failedCountLabel: g = (e) => `${e} failed`, runningStepLabel: _ = (e, t) => `Step ${e} of ${t}`, runningAriaLabel: x = "Running", copyAriaLabel: w, failedAriaLabel: T, attemptLabel: E } = o ?? {}, [O, N] = b(r), P = y(r);
 	v(() => {
 		P.current && !r && N(!1), P.current = r;
 	}, [r]);
-	let { colors: F, panel: I } = l ?? {}, L = l?.typography ?? { fontClassName: "dial-small-text" }, R = n({
+	let { colors: F, panel: I } = c ?? {}, L = c?.typography ?? { fontClassName: "dial-small-text" }, R = n({
 		"--cs-cg-label": F?.labelColor,
 		"--cs-cg-label-hover": F?.labelHoverColor,
 		"--cs-cg-steps-count": F?.stepsCountColor,
@@ -336,10 +336,10 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 	if (e.length === 1) return /* @__PURE__ */ S(B, {
 		stages: e,
 		isStreaming: r,
-		className: c,
+		className: s,
 		styles: {
 			colors: I,
-			typography: l?.typography
+			typography: c?.typography
 		},
 		labels: z
 	});
@@ -354,7 +354,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 			"aria-live": "polite",
 			className: "inline-flex items-center gap-2",
 			children: [
-				/* @__PURE__ */ S(s, {
+				/* @__PURE__ */ S(u, {
 					size: 14,
 					ariaLabel: x
 				}),
@@ -419,8 +419,8 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 	});
 	return /* @__PURE__ */ C("div", {
 		style: R,
-		className: i("flex w-full flex-col gap-1", c),
-		children: [/* @__PURE__ */ S(u, {
+		className: i("flex w-full flex-col gap-1", s),
+		children: [/* @__PURE__ */ S(l, {
 			className: V.toggleButton,
 			onClick: () => N((e) => !e),
 			"aria-expanded": O,
@@ -442,7 +442,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 					isStreaming: r,
 					styles: {
 						colors: I,
-						typography: l?.typography
+						typography: c?.typography
 					},
 					labels: z,
 					className: "pt-1"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@epam/ai-dial-conversation-stages",
   "description": "Panel for displaying agent processing stages during LLM response streaming",
-  "version": "1.1.0-dev.124",
+  "version": "1.1.0-dev.126",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -19,7 +19,7 @@
   "peerDependencies": {
     "react": "^19.0.0",
     "@tabler/icons-react": "^3.0.0",
-    "@epam/ai-dial-chat-shared": "1.1.0-dev.124",
+    "@epam/ai-dial-chat-shared": "1.1.0-dev.126",
     "@epam/ai-dial-ui-kit": "^0.13.0-dev.26"
   },
   "repository": {