@epam/ai-dial-conversation-stages 1.1.0-dev.8 → 1.1.0-dev.87

package/components/CollapsedGroup/CollapsedGroup.d.ts

@@ -1,11 +1,5 @@
 import { FC } from 'react';
 import { CollapsedGroupProps } from '../../models/collapsed-group';
-/**
- * Wraps `StagesPanel` with a single summary line whose text and default
- * open/closed state track the run: expanded with a live progress line while
- * streaming, then collapsed to one line — finished or failed — the moment
- * it ends. A lone stage skips the summary line entirely and renders
- * directly; an empty list renders nothing.
- */
+/** Wraps `StagesPanel` with a collapsible summary line that tracks run state: live progress while streaming, one-line summary once finished. */
 export declare const CollapsedGroup: FC<CollapsedGroupProps>;
 //# sourceMappingURL=CollapsedGroup.d.ts.map

package/components/CollapsedGroup/CollapsedGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CollapsedGroup.d.ts","sourceRoot":"","sources":["../../../src/components/CollapsedGroup/CollapsedGroup.tsx"],"names":[],"mappings":"AAeA,OAAO,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAUxE;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAkNlD,CAAC"}
+{"version":3,"file":"CollapsedGroup.d.ts","sourceRoot":"","sources":["../../../src/components/CollapsedGroup/CollapsedGroup.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,EAAE,EAA+B,MAAM,OAAO,CAAC;AACxD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAUxE,gJAAgJ;AAChJ,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,mBAAmB,CAoOlD,CAAC"}

package/components/StageIcon/StageIcon.d.ts

@@ -11,20 +11,6 @@ export interface StageIconProps {
     /** Accessible label announced (visually hidden) alongside a failed stage's icon. Defaults to `'Failed'`. */
     failedLabel?: string;
 }
-/**
- * The row's single icon slot, filled by priority: exception (failed, or
- * running via a spinner) always wins; everything else — completed, or a
- * settled-but-unresolved stage from an aborted stream — falls back to one
- * uniform check glyph, the same `IconCheck` glyph and size as the
- * `CollapsedGroup` summary's own "Executed N steps" check, but in a quiet
- * grey ink rather than the summary's success color — the summary is the one
- * place that should read as a vivid confirmation, not every row. There is
- * no separate "pending" glyph: the quiet tier is intentionally a single
- * glyph, not a per-state icon set.
- *
- * The icon itself is `aria-hidden` (decorative) — status is also carried by
- * text: failed stages get a visually-hidden label here, and their row name
- * gets the warning ink color at the call site.
- */
+/** Renders the icon for a stage, based on its status and whether it's currently executing. */
 export declare const StageIcon: FC<StageIconProps>;
 //# sourceMappingURL=StageIcon.d.ts.map

package/components/StageIcon/StageIcon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StageIcon.d.ts","sourceRoot":"","sources":["../../../src/components/StageIcon/StageIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAGxD,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAG3B,mCAAmC;AACnC,MAAM,WAAW,cAAc;IAC7B,4EAA4E;IAC5E,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,kEAAkE;IAClE,MAAM,EAAE,OAAO,CAAC;IAChB,mFAAmF;IACnF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4GAA4G;IAC5G,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA8BxC,CAAC"}
+{"version":3,"file":"StageIcon.d.ts","sourceRoot":"","sources":["../../../src/components/StageIcon/StageIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAGxD,OAAO,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAG3B,mCAAmC;AACnC,MAAM,WAAW,cAAc;IAC7B,4EAA4E;IAC5E,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC;IAC3B,kEAAkE;IAClE,MAAM,EAAE,OAAO,CAAC;IAChB,mFAAmF;IACnF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4GAA4G;IAC5G,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,8FAA8F;AAC9F,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CA8BxC,CAAC"}

package/components/StageItem/StageItem.d.ts

@@ -11,19 +11,9 @@ export interface StageItemProps {
     typography?: StageTypography;
     /** User-visible strings. */
     labels?: StagesPanelLabels;
-    /**
-     * Overrides the displayed name without affecting duration extraction —
-     * used to relabel an individual attempt (e.g. `'Attempt 2'`) inside a
-     * collapsed `×N` group while still reading that attempt's own duration
-     * from its real `stage.name`.
-     */
+    /** Overrides the displayed name; used to relabel individual attempts (e.g. `'Attempt 2'`) inside a `×N` group. */
     nameOverride?: string;
 }
-/**
- * A single flat stage row: icon · name · tag? · duration? · chevron? — every
- * element but the icon and name is optional and renders only when the data
- * exists. Plain when the stage has no expandable content or attachments;
- * becomes a disclosure button when it does.
- */
+/** Renders a single stage row, optionally expandable to show its content. */
 export declare const StageItem: FC<StageItemProps>;
 //# sourceMappingURL=StageItem.d.ts.map

package/components/StageItem/StageItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StageItem.d.ts","sourceRoot":"","sources":["../../../src/components/StageItem/StageItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAIvD,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EACV,iBAAiB,EACjB,eAAe,EAChB,MAAM,2BAA2B,CAAC;AAMnC,mCAAmC;AACnC,MAAM,WAAW,cAAc;IAC7B,gCAAgC;IAChC,KAAK,EAAE,KAAK,CAAC;IACb,kEAAkE;IAClE,MAAM,EAAE,OAAO,CAAC;IAChB,+DAA+D;IAC/D,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,4BAA4B;IAC5B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED;;;;;GAKG;AACH,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAwHxC,CAAC"}
+{"version":3,"file":"StageItem.d.ts","sourceRoot":"","sources":["../../../src/components/StageItem/StageItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAIvD,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AACrC,OAAO,KAAK,EACV,iBAAiB,EACjB,eAAe,EAChB,MAAM,2BAA2B,CAAC;AAMnC,mCAAmC;AACnC,MAAM,WAAW,cAAc;IAC7B,gCAAgC;IAChC,KAAK,EAAE,KAAK,CAAC;IACb,kEAAkE;IAClE,MAAM,EAAE,OAAO,CAAC;IAChB,+DAA+D;IAC/D,UAAU,CAAC,EAAE,eAAe,CAAC;IAC7B,4BAA4B;IAC5B,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,kHAAkH;IAClH,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,6EAA6E;AAC7E,eAAO,MAAM,SAAS,EAAE,EAAE,CAAC,cAAc,CAwHxC,CAAC"}

package/components/StagesPanel/StagesPanel.d.ts

@@ -1,9 +1,5 @@
 import { FC } from 'react';
 import { StagesPanelProps } from '../../models/stages-props';
-/**
- * Displays an agent's accumulated stages as a flat, inline list of rows — no
- * card, border, or panel around it. Repeated identical stage names collapse
- * into one `×N` row that expands to the individual attempts.
- */
+/** Flat inline list of agent stages; repeated identical names collapse into a ×N group row. */
 export declare const StagesPanel: FC<StagesPanelProps>;
 //# sourceMappingURL=StagesPanel.d.ts.map

package/components/StagesPanel/StagesPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StagesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/StagesPanel/StagesPanel.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,2BAA2B,CAAC;AA4InC;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAoD5C,CAAC"}
+{"version":3,"file":"StagesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/StagesPanel/StagesPanel.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,2BAA2B,CAAC;AAwInC,+FAA+F;AAC/F,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA+D5C,CAAC"}

package/index.css

@@ -1,2 +1,2 @@
-._panel_mqtpu_2{color:var(--cs-text,var(--text-primary,#161b2d))}._row_mqtpu_6{border-radius:8px}._row_mqtpu_6:hover{background:var(--cs-row-hover,var(--bg-layer-2,#eef1f7))}._collapseButton_mqtpu_13{background:var(--cs-button-bg,transparent)}._stageName_mqtpu_17{color:var(--cs-stage-text,var(--text-secondary,#575f73))}._stageNameFailed_mqtpu_21{color:var(--cs-failed-text,var(--text-warning,#7f6300))}._monoName_mqtpu_25{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}._tag_mqtpu_29{color:var(--cs-tag-text,var(--text-tertiary,#808898));text-transform:uppercase;letter-spacing:.04em}._count_mqtpu_35{color:var(--cs-count-text,var(--text-tertiary,#808898));font-variant-numeric:tabular-nums}._duration_mqtpu_40{color:var(--cs-duration-text,var(--text-tertiary,#808898));font-variant-numeric:tabular-nums}._iconSecondary_mqtpu_45{color:var(--cs-icon-secondary,var(--text-secondary,#575f73));opacity:.7}._iconCompleted_mqtpu_51{color:var(--cs-icon-completed,var(--text-tertiary,#808898))}._iconError_mqtpu_56{color:var(--cs-icon-error,var(--text-warning,#7f6300))}._stageContent_mqtpu_60{color:var(--cs-stage-text,var(--text-secondary,#575f73));line-height:150%!important}._codeBlock_mqtpu_65{background:var(--cs-code-bg,var(--bg-layer-0,#fcfcfc));border-color:var(--cs-code-border,var(--stroke-secondary,#d1dbea));color:var(--cs-code-text,var(--text-primary,#161b2d))}._codeInline_mqtpu_71{background:var(--cs-code-bg,var(--bg-layer-0,#fcfcfc));border:1px solid var(--cs-code-border,var(--stroke-secondary,#d1dbea));color:var(--cs-code-text,var(--text-primary,#161b2d))}._blockquote_mqtpu_77{border-color:var(--cs-stage-text,var(--text-secondary,#575f73));color:var(--cs-stage-text,var(--text-secondary,#575f73))}._tableCell_mqtpu_82{border-color:var(--cs-border,var(--stroke-secondary,#d1dbea));color:var(--cs-stage-text,var(--text-secondary,#575f73))}._toggleButton_1exhc_2{color:var(--cs-cg-label,var(--text-secondary,#575f73));width:100%;justify-content:flex-start!important}._toggleButton_1exhc_2:hover{color:var(--cs-cg-label-hover,var(--text-primary,#161b2d))}._executedLabel_1exhc_11{color:var(--cs-cg-label,var(--text-secondary,#575f73))}._stepsCount_1exhc_16{color:var(--cs-cg-steps-count,var(--text-tertiary,#808898));font-variant-numeric:tabular-nums}._doneIcon_1exhc_22{color:var(--cs-cg-done,var(--text-success,#007274))}._failedText_1exhc_27{color:var(--cs-cg-failed,var(--text-warning,#7f6300))}._liveName_1exhc_32{color:var(--cs-cg-label,var(--text-primary,#161b2d))}
+._panel_1068d_2{color:var(--cs-text,var(--text-primary,#161b2d))}._row_1068d_6{border-radius:8px}._row_1068d_6:hover{background:var(--cs-row-hover,var(--bg-layer-sunken,#eef1f7))}._collapseButton_1068d_13{background:var(--cs-button-bg,transparent)}._stageName_1068d_17{color:var(--cs-stage-text,var(--text-secondary,#6b7280))}._stageNameFailed_1068d_21{color:var(--cs-failed-text,var(--text-warning,#7f6300))}._monoName_1068d_25{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}._tag_1068d_29{color:var(--cs-tag-text,var(--text-tertiary,#c7cbd4));text-transform:uppercase;letter-spacing:.04em}._count_1068d_35{color:var(--cs-count-text,var(--text-tertiary,#c7cbd4));font-variant-numeric:tabular-nums}._duration_1068d_40{color:var(--cs-duration-text,var(--text-tertiary,#c7cbd4));font-variant-numeric:tabular-nums}._iconSecondary_1068d_45{color:var(--cs-icon-secondary,var(--text-secondary,#6b7280));opacity:.7}._iconCompleted_1068d_51{color:var(--cs-icon-completed,var(--text-tertiary,#c7cbd4))}._iconError_1068d_56{color:var(--cs-icon-error,var(--text-warning,#7f6300))}._stageContent_1068d_60{color:var(--cs-stage-text,var(--text-secondary,#6b7280));line-height:150%!important}._codeBlock_1068d_65{background:var(--cs-code-bg,var(--bg-layer-raised,#fcfcfc));border-color:var(--cs-code-border,var(--stroke-secondary,#d1dbea));color:var(--cs-code-text,var(--text-primary,#161b2d))}._codeInline_1068d_71{background:var(--cs-code-bg,var(--bg-layer-raised,#fcfcfc));border:1px solid var(--cs-code-border,var(--stroke-secondary,#d1dbea));color:var(--cs-code-text,var(--text-primary,#161b2d))}._blockquote_1068d_77{border-color:var(--cs-stage-text,var(--text-secondary,#6b7280));color:var(--cs-stage-text,var(--text-secondary,#6b7280))}._tableCell_1068d_82{border-color:var(--cs-border,var(--stroke-secondary,#d1dbea));color:var(--cs-stage-text,var(--text-secondary,#6b7280))}._toggleButton_1dk5h_2{color:var(--cs-cg-label,var(--text-secondary,#6b7280));width:100%;justify-content:flex-start!important}._toggleButton_1dk5h_2:hover{color:var(--cs-cg-label-hover,var(--text-primary,#161b2d))}._executedLabel_1dk5h_11{color:var(--cs-cg-label,var(--text-secondary,#6b7280))}._stepsCount_1dk5h_16{color:var(--cs-cg-steps-count,var(--text-tertiary,#c7cbd4));font-variant-numeric:tabular-nums}._doneIcon_1dk5h_22{color:var(--cs-cg-done,var(--text-success,#007274))}._failedText_1dk5h_27{color:var(--cs-cg-failed,var(--text-warning,#7f6300))}._liveName_1dk5h_32{color:var(--cs-cg-label,var(--text-primary,#161b2d))}
 /*$vite$:1*/

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, DialGhostIconButton as s, DialLinkButton as c, DialSpinner as l, ElementSize as u } from "@epam/ai-dial-ui-kit";
+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 { 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";
@@ -30,36 +30,34 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 		for (; a < e.length && D(e[a].name).name === i;) a += 1;
 		let o = e.slice(n, a);
 		o.length > 1 ? t.push({
-			kind: "group",
 			key: r.index,
 			name: i,
 			attempts: o
 		}) : t.push({
-			kind: "single",
 			key: r.index,
 			stage: r
 		}), n = a;
 	}
 	return t;
 }, P = {
-	panel: "_panel_mqtpu_2",
-	row: "_row_mqtpu_6",
-	collapseButton: "_collapseButton_mqtpu_13",
-	stageName: "_stageName_mqtpu_17",
-	stageNameFailed: "_stageNameFailed_mqtpu_21",
-	monoName: "_monoName_mqtpu_25",
-	tag: "_tag_mqtpu_29",
-	count: "_count_mqtpu_35",
-	duration: "_duration_mqtpu_40",
-	iconSecondary: "_iconSecondary_mqtpu_45",
-	iconCompleted: "_iconCompleted_mqtpu_51",
-	iconError: "_iconError_mqtpu_56",
-	stageContent: "_stageContent_mqtpu_60",
-	codeBlock: "_codeBlock_mqtpu_65",
-	codeInline: "_codeInline_mqtpu_71",
-	blockquote: "_blockquote_mqtpu_77",
-	tableCell: "_tableCell_mqtpu_82"
-}, F = ({ status: e, isLive: n, runningLabel: r = "Running", failedLabel: i = "Failed" }) => n ? /* @__PURE__ */ S(l, {
+	panel: "_panel_1068d_2",
+	row: "_row_1068d_6",
+	collapseButton: "_collapseButton_1068d_13",
+	stageName: "_stageName_1068d_17",
+	stageNameFailed: "_stageNameFailed_1068d_21",
+	monoName: "_monoName_1068d_25",
+	tag: "_tag_1068d_29",
+	count: "_count_1068d_35",
+	duration: "_duration_1068d_40",
+	iconSecondary: "_iconSecondary_1068d_45",
+	iconCompleted: "_iconCompleted_1068d_51",
+	iconError: "_iconError_1068d_56",
+	stageContent: "_stageContent_1068d_60",
+	codeBlock: "_codeBlock_1068d_65",
+	codeInline: "_codeInline_1068d_71",
+	blockquote: "_blockquote_1068d_77",
+	tableCell: "_tableCell_1068d_82"
+}, F = ({ status: e, isLive: n, runningLabel: r = "Running", failedLabel: i = "Failed" }) => n ? /* @__PURE__ */ S(s, {
 	size: 16,
 	ariaLabel: r
 }) : e === t.Failed ? /* @__PURE__ */ C(x, { children: [/* @__PURE__ */ S(d, {
@@ -74,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, c] = b(!1), l = y(null);
+	let [o, s] = b(!1), u = y(null);
 	v(() => () => {
-		l.current != null && clearTimeout(l.current);
+		u.current != null && clearTimeout(u.current);
 	}, []);
 	let d = _(() => {
-		r(typeof e == "string" ? e : String(e ?? "")), l.current && clearTimeout(l.current), c(!0), l.current = setTimeout(() => c(!1), 2e3);
+		r(typeof e == "string" ? e : String(e ?? "")), u.current && clearTimeout(u.current), s(!0), u.current = setTimeout(() => s(!1), 2e3);
 	}, [e]);
 	return /* @__PURE__ */ C("pre", {
 		className: i("relative max-h-[300px] overflow-auto rounded border p-3 text-sm", P.codeBlock),
-		children: [/* @__PURE__ */ S(s, {
-			size: u.Small,
+		children: [/* @__PURE__ */ S(l, {
+			size: c.Small,
 			icon: S(o ? f : h, {
 				size: a.SM,
 				className: P.iconSecondary
@@ -188,7 +186,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 		children: E
 	});
 }, z = ({ row: e, isLive: n, typography: r, labels: s }) => {
-	let { runningAriaLabel: c, failedAriaLabel: l, attemptLabel: u = (e) => `Attempt ${e}` } = s ?? {}, [d, f] = b(!1), h = e.attempts.some((e) => e.status === t.Failed), g = e.attempts.reduce((e, t) => {
+	let { runningAriaLabel: c, failedAriaLabel: l, attemptLabel: u = (e) => `Attempt ${e}` } = s ?? {}, [d, f] = b(!1), h = e.attempts?.some((e) => e.status === t.Failed), g = (e.attempts || []).reduce((e, t) => {
 		let { durationLabel: n } = D(t.name);
 		return e + (A(n) ?? 0);
 	}, 0), _ = g > 0 ? k(g) : void 0;
@@ -213,7 +211,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 			}),
 			/* @__PURE__ */ C("span", {
 				className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text", P.count),
-				children: ["×", e.attempts.length]
+				children: ["×", e.attempts?.length ?? 0]
 			}),
 			_ && /* @__PURE__ */ S("span", {
 				className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text", P.duration),
@@ -238,12 +236,12 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 			children: /* @__PURE__ */ S("ul", {
 				role: "list",
 				className: "mt-1 flex flex-col gap-0.5 ps-6",
-				children: e.attempts.map((t, i) => /* @__PURE__ */ S("li", {
+				children: e.attempts?.map((t, i) => /* @__PURE__ */ S("li", {
 					role: "listitem",
 					children: /* @__PURE__ */ S(R, {
 						stage: t,
 						nameOverride: u(i + 1),
-						isLive: n && t.index === e.attempts[e.attempts.length - 1].index,
+						isLive: n && t.index === e.attempts?.[e.attempts.length - 1]?.index,
 						typography: r,
 						labels: s
 					})
@@ -255,8 +253,19 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 	let { colors: s, typography: c } = a ?? {}, l = n({
 		"--cs-text": s?.text,
 		"--cs-row-hover": s?.rowHoverColor,
+		"--cs-button-bg": s?.collapsedButtonBg,
 		"--cs-stage-text": s?.stageTextColor,
-		"--cs-failed-text": s?.failedColor
+		"--cs-failed-text": s?.failedColor,
+		"--cs-tag-text": s?.tagTextColor,
+		"--cs-count-text": s?.countTextColor,
+		"--cs-duration-text": s?.durationTextColor,
+		"--cs-icon-secondary": s?.iconSecondaryColor,
+		"--cs-icon-completed": s?.iconCompletedColor,
+		"--cs-icon-error": s?.iconErrorColor,
+		"--cs-code-bg": s?.codeBg,
+		"--cs-code-border": s?.codeBorderColor,
+		"--cs-code-text": s?.codeTextColor,
+		"--cs-border": s?.borderColor
 	}), u = t ? j(e) : void 0, d = N(e);
 	return /* @__PURE__ */ S("div", {
 		style: l,
@@ -264,7 +273,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 		children: /* @__PURE__ */ S("ul", {
 			role: "list",
 			className: "flex w-full flex-col gap-0.5 ps-5",
-			children: d.map((e) => e.kind === "single" ? /* @__PURE__ */ S("li", {
+			children: d.map((e) => e.stage ? /* @__PURE__ */ S("li", {
 				role: "listitem",
 				children: /* @__PURE__ */ S(R, {
 					stage: e.stage,
@@ -276,7 +285,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 				role: "listitem",
 				children: /* @__PURE__ */ S(z, {
 					row: e,
-					isLive: u?.index === e.attempts[e.attempts.length - 1].index,
+					isLive: u?.index === e.attempts?.[e.attempts.length - 1].index,
 					typography: c,
 					labels: o
 				})
@@ -284,26 +293,41 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 		})
 	});
 }, V = {
-	toggleButton: "_toggleButton_1exhc_2",
-	executedLabel: "_executedLabel_1exhc_11",
-	stepsCount: "_stepsCount_1exhc_16",
-	doneIcon: "_doneIcon_1exhc_22",
-	failedText: "_failedText_1exhc_27",
-	liveName: "_liveName_1exhc_32"
-}, H = ({ stages: e, isStreaming: r, labels: o, className: s, styles: u }) => {
+	toggleButton: "_toggleButton_1dk5h_2",
+	executedLabel: "_executedLabel_1dk5h_11",
+	stepsCount: "_stepsCount_1dk5h_16",
+	doneIcon: "_doneIcon_1dk5h_22",
+	failedText: "_failedText_1dk5h_27",
+	liveName: "_liveName_1dk5h_32"
+}, H = ({ stages: e, isStreaming: r, labels: o, className: c, styles: l }) => {
 	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 } = u ?? {}, I = u?.typography ?? { fontClassName: "dial-small-text" }, L = n({
+	let { colors: F, panel: I } = l ?? {}, L = l?.typography ?? { fontClassName: "dial-small-text" }, R = n({
 		"--cs-cg-label": F?.labelColor,
 		"--cs-cg-label-hover": F?.labelHoverColor,
 		"--cs-cg-steps-count": F?.stepsCountColor,
 		"--cs-cg-done": F?.doneColor,
-		"--cs-cg-failed": F?.failedColor
+		"--cs-cg-failed": F?.failedColor,
+		"--cs-text": I?.text,
+		"--cs-row-hover": I?.rowHoverColor,
+		"--cs-button-bg": I?.collapsedButtonBg,
+		"--cs-stage-text": I?.stageTextColor,
+		"--cs-failed-text": I?.failedColor,
+		"--cs-tag-text": I?.tagTextColor,
+		"--cs-count-text": I?.countTextColor,
+		"--cs-duration-text": I?.durationTextColor,
+		"--cs-icon-secondary": I?.iconSecondaryColor,
+		"--cs-icon-completed": I?.iconCompletedColor,
+		"--cs-icon-error": I?.iconErrorColor,
+		"--cs-code-bg": I?.codeBg,
+		"--cs-code-border": I?.codeBorderColor,
+		"--cs-code-text": I?.codeTextColor,
+		"--cs-border": I?.borderColor
 	});
 	if (e.length === 0) return null;
-	let R = {
+	let z = {
 		copyAriaLabel: w,
 		runningAriaLabel: x,
 		failedAriaLabel: T,
@@ -312,42 +336,45 @@ 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: s,
-		styles: { typography: u?.typography },
-		labels: R
+		className: c,
+		styles: {
+			colors: I,
+			typography: l?.typography
+		},
+		labels: z
 	});
-	let z = e.some((e) => e.status === t.Failed), H = e.reduce((e, t) => {
+	let H = e.some((e) => e.status === t.Failed), U = e.reduce((e, t) => {
 		let { durationLabel: n } = D(t.name);
 		return e + (A(n) ?? 0);
-	}, 0), U = H > 0 ? k(H) : void 0, W = r ? j(e) : void 0, G;
+	}, 0), W = U > 0 ? k(U) : void 0, G = r ? j(e) : void 0, K;
 	if (r) {
-		let t = W ? M(e, W) : e.length, n = W ? D(W.name).name : "";
-		G = /* @__PURE__ */ C("span", {
+		let t = G ? M(e, G) : e.length, n = G ? D(G.name).name : "";
+		K = /* @__PURE__ */ C("span", {
 			role: "status",
 			"aria-live": "polite",
 			className: "inline-flex items-center gap-2",
 			children: [
-				/* @__PURE__ */ S(l, {
+				/* @__PURE__ */ S(s, {
 					size: 14,
 					ariaLabel: x
 				}),
 				/* @__PURE__ */ S("span", {
-					className: i(I.fontClassName, V.liveName),
+					className: i(L.fontClassName, V.liveName),
 					children: _(t, e.length)
 				}),
 				n && /* @__PURE__ */ S("span", {
-					className: i(I.fontClassName, V.executedLabel),
+					className: i(L.fontClassName, V.executedLabel),
 					children: n
 				})
 			]
 		});
-	} else if (z) {
+	} else if (H) {
 		let n = e.filter((e) => e.status === t.Failed).length;
-		G = /* @__PURE__ */ C("span", {
+		K = /* @__PURE__ */ C("span", {
 			className: "inline-flex items-center gap-1",
 			children: [
 				/* @__PURE__ */ C("span", {
-					className: i(I.fontClassName, V.executedLabel),
+					className: i(L.fontClassName, V.executedLabel),
 					children: [
 						d,
 						" ",
@@ -357,16 +384,16 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 					]
 				}),
 				/* @__PURE__ */ S("span", {
-					className: i(I.fontClassName, V.failedText),
+					className: i(L.fontClassName, V.failedText),
 					children: g(n)
 				}),
-				U && /* @__PURE__ */ S("span", {
-					className: i(I.fontClassName, V.stepsCount),
-					children: U
+				W && /* @__PURE__ */ S("span", {
+					className: i(L.fontClassName, V.stepsCount),
+					children: W
 				})
 			]
 		});
-	} else G = /* @__PURE__ */ C("span", {
+	} else K = /* @__PURE__ */ C("span", {
 		className: "inline-flex items-center gap-1",
 		children: [
 			/* @__PURE__ */ S(f, {
@@ -375,7 +402,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 				"aria-hidden": !0
 			}),
 			/* @__PURE__ */ C("span", {
-				className: i(I.fontClassName, V.executedLabel),
+				className: i(L.fontClassName, V.executedLabel),
 				children: [
 					d,
 					" ",
@@ -384,16 +411,16 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 					h(e.length)
 				]
 			}),
-			U && /* @__PURE__ */ S("span", {
-				className: i(I.fontClassName, V.stepsCount),
-				children: U
+			W && /* @__PURE__ */ S("span", {
+				className: i(L.fontClassName, V.stepsCount),
+				children: W
 			})
 		]
 	});
 	return /* @__PURE__ */ C("div", {
-		style: L,
-		className: i("flex w-full flex-col gap-1", s),
-		children: [/* @__PURE__ */ S(c, {
+		style: R,
+		className: i("flex w-full flex-col gap-1", c),
+		children: [/* @__PURE__ */ S(u, {
 			className: V.toggleButton,
 			onClick: () => N((e) => !e),
 			"aria-expanded": O,
@@ -405,7 +432,7 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 				className: "rtl:scale-x-[-1]",
 				"aria-hidden": !0
 			}),
-			label: G
+			label: K
 		}), /* @__PURE__ */ S("div", {
 			className: i("grid transition-[grid-template-rows] duration-300 ease-in-out", O ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
 			children: /* @__PURE__ */ S("div", {
@@ -413,8 +440,11 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
 				children: /* @__PURE__ */ S(B, {
 					stages: e,
 					isStreaming: r,
-					styles: { typography: u?.typography },
-					labels: R,
+					styles: {
+						colors: I,
+						typography: l?.typography
+					},
+					labels: z,
 					className: "pt-1"
 				})
 			})

package/models/collapsed-group.d.ts

@@ -1,40 +1,41 @@
 import { Stage } from '@epam/ai-dial-chat-shared';
+import { StagesPanelColors } from './stages-props';
 /** Color overrides for the `CollapsedGroup` component applied as CSS custom properties. */
 export interface CollapsedGroupColors {
-    /** Color of the toggle button label and icon. Defaults to `var(--text-secondary, #575F73)`. */
+    /** Color of the toggle button label and icon. */
     labelColor?: string;
-    /** Color of the toggle button label and icon on hover. Defaults to `var(--text-primary, #161B2D)`. */
+    /** Color of the toggle button label and icon on hover. */
     labelHoverColor?: string;
-    /** Color of the execution time. Defaults to `var(--text-tertiary, #808898)` — muted, matching the row-level duration's tone. */
+    /** Color of the execution time. */
     stepsCountColor?: string;
-    /** Color of the leading check icon in the finished-and-successful summary. Defaults to `var(--text-success, #007274)`. */
+    /** Color of the leading check icon in the finished-and-successful summary. */
     doneColor?: string;
-    /** Color of the "N failed" text in the failed summary. Defaults to `var(--text-warning, #7f6300)`. */
+    /** Color of the "N failed" text in the failed summary. */
     failedColor?: string;
 }
 /** Typography configuration for the toggle button label text. */
 export interface CollapsedGroupTypography {
-    /** CSS utility class applied to the toggle button label. Defaults to `'dial-small-text'` — matches the size of the step rows it summarizes, since a group header should never render smaller than its contents. */
+    /** CSS utility class applied to the toggle button label. */
     fontClassName?: string;
-    /** Font family applied to the panel root via CSS custom property. */
-    fontFamily?: string;
 }
 /** Combined style overrides (colors and typography) for the `CollapsedGroup` component. */
 export interface CollapsedGroupStyles {
     /** Color overrides applied as CSS custom properties. */
     colors?: CollapsedGroupColors;
-    /** Typography for the toggle button label. Defaults to `{ fontClassName: 'dial-small-text' }`. */
+    /** Typography for the toggle button label. */
     typography?: CollapsedGroupTypography;
+    /** Color overrides forwarded to the inner `StagesPanel`. */
+    panel?: StagesPanelColors;
 }
 /** User-visible strings for the `CollapsedGroup` component. */
 export interface CollapsedGroupLabels {
     /** Label shown before the steps count on the toggle button. Defaults to `'Executed'`. */
     executedLabel?: string;
-    /** Returns the pluralized label for the steps count. Receives the count so callers can handle any plural rule. Defaults to `() => 'steps'`. */
+    /** Returns the pluralized steps label. Defaults to `() => 'steps'`. */
     stepsLabel?: (count: number) => string;
-    /** Returns the "N failed" fragment shown in the failed summary. Defaults to `(n) => \`${n} failed\``. */
+    /** Returns the "N failed" text in the failed summary. Defaults to `(n) => \`${n} failed\``. */
     failedCountLabel?: (failedCount: number) => string;
-    /** Returns the "Step X of Y" fragment shown in the running summary. Defaults to `(current, total) => \`Step ${current} of ${total}\``. */
+    /** Returns the "Step X of Y" text in the running summary. Defaults to `(current, total) => \`Step ${current} of ${total}\``. */
     runningStepLabel?: (current: number, total: number) => string;
     /** Accessible label announced for the running summary's spinner. Defaults to `'Running'`. */
     runningAriaLabel?: string;
@@ -49,11 +50,7 @@ export interface CollapsedGroupLabels {
 export interface CollapsedGroupProps {
     /** Ordered list of stages to display. */
     stages: Stage[];
-    /**
-     * Whether the run is still streaming. Drives the summary line's state
-     * (running vs. finished vs. failed) and its default open/closed state —
-     * expanded while running, collapsed once finished.
-     */
+    /** When true, expands to a live progress line; collapses to a summary once streaming ends. */
     isStreaming: boolean;
     /** User-visible strings for the toggle button. */
     labels?: CollapsedGroupLabels;

package/models/collapsed-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"collapsed-group.d.ts","sourceRoot":"","sources":["../../src/models/collapsed-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD,2FAA2F;AAC3F,MAAM,WAAW,oBAAoB;IACnC,+FAA+F;IAC/F,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sGAAsG;IACtG,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gIAAgI;IAChI,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,0HAA0H;IAC1H,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,sGAAsG;IACtG,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,iEAAiE;AACjE,MAAM,WAAW,wBAAwB;IACvC,mNAAmN;IACnN,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qEAAqE;IACrE,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,2FAA2F;AAC3F,MAAM,WAAW,oBAAoB;IACnC,wDAAwD;IACxD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,kGAAkG;IAClG,UAAU,CAAC,EAAE,wBAAwB,CAAC;CACvC;AAED,+DAA+D;AAC/D,MAAM,WAAW,oBAAoB;IACnC,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+IAA+I;IAC/I,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,yGAAyG;IACzG,gBAAgB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC;IACnD,0IAA0I;IAC1I,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC9D,6FAA6F;IAC7F,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,0FAA0F;IAC1F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+FAA+F;IAC/F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mHAAmH;IACnH,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,CAAC;CAClD;AAED,wDAAwD;AACxD,MAAM,WAAW,mBAAmB;IAClC,yCAAyC;IACzC,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB;;;;OAIG;IACH,WAAW,EAAE,OAAO,CAAC;IACrB,kDAAkD;IAClD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,MAAM,CAAC,EAAE,oBAAoB,CAAC;CAC/B"}
+{"version":3,"file":"collapsed-group.d.ts","sourceRoot":"","sources":["../../src/models/collapsed-group.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAExD,2FAA2F;AAC3F,MAAM,WAAW,oBAAoB;IACnC,iDAAiD;IACjD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0DAA0D;IAC1D,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mCAAmC;IACnC,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,8EAA8E;IAC9E,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,0DAA0D;IAC1D,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,iEAAiE;AACjE,MAAM,WAAW,wBAAwB;IACvC,4DAA4D;IAC5D,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,2FAA2F;AAC3F,MAAM,WAAW,oBAAoB;IACnC,wDAAwD;IACxD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,8CAA8C;IAC9C,UAAU,CAAC,EAAE,wBAAwB,CAAC;IACtC,4DAA4D;IAC5D,KAAK,CAAC,EAAE,iBAAiB,CAAC;CAC3B;AAED,+DAA+D;AAC/D,MAAM,WAAW,oBAAoB;IACnC,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,uEAAuE;IACvE,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,+FAA+F;IAC/F,gBAAgB,CAAC,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,MAAM,CAAC;IACnD,gIAAgI;IAChI,gBAAgB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC9D,6FAA6F;IAC7F,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,0FAA0F;IAC1F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,+FAA+F;IAC/F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mHAAmH;IACnH,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,CAAC;CAClD;AAED,wDAAwD;AACxD,MAAM,WAAW,mBAAmB;IAClC,yCAAyC;IACzC,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,8FAA8F;IAC9F,WAAW,EAAE,OAAO,CAAC;IACrB,kDAAkD;IAClD,MAAM,CAAC,EAAE,oBAAoB,CAAC;IAC9B,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,MAAM,CAAC,EAAE,oBAAoB,CAAC;CAC/B"}

package/models/stage-grouping.d.ts

@@ -1,21 +1,13 @@
 import { Stage } from '@epam/ai-dial-chat-shared';
-/** A single ungrouped stage row. */
-export interface SingleStageRow {
-    kind: 'single';
-    /** Stable key for list rendering — the stage's own index. */
-    key: number;
-    stage: Stage;
-}
-/** A row formed by collapsing consecutive stages that share the same cleaned name into one `×N` row. */
-export interface GroupedStageRow {
-    kind: 'group';
+/** A row rendered inside a `StagesPanel` — either one stage or a collapsed `×N` group of identical attempts. */
+export interface StageRow {
     /** Stable key for list rendering — the first attempt's index. */
     key: number;
     /** Shared cleaned display name for the group. */
-    name: string;
+    name?: string;
+    /** The single stage for this row (present only when there is one attempt). */
+    stage?: Stage;
     /** Individual attempts in original order. */
-    attempts: Stage[];
+    attempts?: Stage[];
 }
-/** A row rendered inside a `StagesPanel` — either one stage or a collapsed `×N` group of identical attempts. */
-export type StageRow = SingleStageRow | GroupedStageRow;
 //# sourceMappingURL=stage-grouping.d.ts.map

package/models/stage-grouping.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stage-grouping.d.ts","sourceRoot":"","sources":["../../src/models/stage-grouping.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD,oCAAoC;AACpC,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,QAAQ,CAAC;IACf,6DAA6D;IAC7D,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,KAAK,CAAC;CACd;AAED,wGAAwG;AACxG,MAAM,WAAW,eAAe;IAC9B,IAAI,EAAE,OAAO,CAAC;IACd,iEAAiE;IACjE,GAAG,EAAE,MAAM,CAAC;IACZ,iDAAiD;IACjD,IAAI,EAAE,MAAM,CAAC;IACb,6CAA6C;IAC7C,QAAQ,EAAE,KAAK,EAAE,CAAC;CACnB;AAED,gHAAgH;AAChH,MAAM,MAAM,QAAQ,GAAG,cAAc,GAAG,eAAe,CAAC"}
+{"version":3,"file":"stage-grouping.d.ts","sourceRoot":"","sources":["../../src/models/stage-grouping.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD,gHAAgH;AAChH,MAAM,WAAW,QAAQ;IACvB,iEAAiE;IACjE,GAAG,EAAE,MAAM,CAAC;IACZ,iDAAiD;IACjD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;CACpB"}

package/models/stages-props.d.ts

@@ -1,49 +1,57 @@
 import { Stage } from '@epam/ai-dial-chat-shared';
-/**
- * Typography configuration for a stage row. The name is always the
- * dominant text in the row — bigger than the expanded content — so
- * `fontClassName` (name) and `contentClassName` (expanded markdown content)
- * are deliberately separate fields, not one shared class.
- */
+/** Typography class overrides for stage name and expanded content elements in `StagesPanel`. */
 export interface StageTypography {
-    /** CSS utility class applied to the stage/step name. Defaults to `'dial-small-text'` (14px, normal weight). */
+    /** CSS utility class applied to the stage/step name. */
     fontClassName?: string;
-    /** CSS utility class applied to expanded stage content text elements (`p`, `ul`, `ol`, `blockquote`, `a`, table cells) — always smaller than the name. Defaults to `'dial-tiny-text'`, the DS's second-smallest text style (12px), with its line-height forced to 150% for readability. */
+    /** CSS utility class applied to expanded content text elements (paragraphs, lists, blockquotes, links, table cells). */
     contentClassName?: string;
-    /** CSS utility class applied to `<strong>` (bold markdown) inside expanded content. Defaults to `contentClassName` — i.e. no extra weight — so bold markdown in tool/stage output doesn't out-emphasize the quiet, secondary tone of the rest of the content. Pass e.g. `'font-semibold'` to restore emphasis. */
+    /** CSS utility class applied to `<strong>` (bold markdown) inside expanded content. */
     strongClassName?: string;
-    /** CSS utility class applied to every heading level (`h1`–`h6`) inside expanded content. Defaults to `'dial-small-semi-text'` (14px, semibold) — headings inside a stage's content stay uniformly small rather than scaling up to the DS's larger heading sizes. */
+    /** CSS utility class applied to every heading level (`h1`–`h6`) inside expanded content. */
     headingClassName?: string;
-    /** CSS utility class applied to inline code elements. Defaults to `'rounded-md font-mono text-sm'`. */
+    /** CSS utility class applied to inline code elements. */
     codeClassName?: string;
-    /** Font family applied to the panel root via CSS custom property. */
-    fontFamily?: string;
-    /** CSS utility class applied to count badges (e.g. `×N` collapsed group). Defaults to `'dial-tiny-text'`. */
+    /** CSS utility class applied to count badges (e.g. `×N` collapsed group). */
     countFontClassName?: string;
 }
-/**
- * Color overrides for the `StagesPanel` component applied as CSS custom
- * properties. The panel is an inline list (no card/border), so these only
- * cover the row-level surface: per-row hover tint and text tones.
- */
+/** CSS custom property color overrides for the `StagesPanel` component. */
 export interface StagesPanelColors {
-    /** General text color. */
+    /** General text color. Defaults to `--text-primary`. */
     text?: string;
     /** Background tint on row hover. Defaults to `--bg-layer-2`. */
     rowHoverColor?: string;
-    /**
-     * Text color applied to each stage name row.
-     * Defaults to the app's `--text-secondary` theme variable (`#9fa6bd`).
-     */
+    /** Text color of each stage name. Defaults to `--text-secondary`. */
     stageTextColor?: string;
-    /** Icon / text color for a failed or errored stage — the one exception that keeps a saturated color. */
+    /** Text and icon color for a failed stage. Defaults to `--text-warning`. */
     failedColor?: string;
+    /** Background color of the collapse button. Defaults to transparent. */
+    collapsedButtonBg?: string;
+    /** Text color of stage tag labels. Defaults to `--text-tertiary`. */
+    tagTextColor?: string;
+    /** Text color of the attempt count badge (e.g. `×N`). Defaults to `--text-tertiary`. */
+    countTextColor?: string;
+    /** Text color of the total-duration label. Defaults to `--text-tertiary`. */
+    durationTextColor?: string;
+    /** Color of secondary (non-status) icons. Defaults to `--text-secondary` at 70% opacity. */
+    iconSecondaryColor?: string;
+    /** Color of the completed-check icon. Defaults to `--text-tertiary`. */
+    iconCompletedColor?: string;
+    /** Color of the error/exception icon. Defaults to `--text-warning`. */
+    iconErrorColor?: string;
+    /** Background color of fenced code blocks and inline code. Defaults to `--bg-layer-0`. */
+    codeBg?: string;
+    /** Border color of fenced code blocks and inline code. Defaults to `--stroke-secondary`. */
+    codeBorderColor?: string;
+    /** Text color inside code blocks. Defaults to `--text-primary`. */
+    codeTextColor?: string;
+    /** Border color used for table cells and blockquotes. Defaults to `--stroke-secondary`. */
+    borderColor?: string;
 }
 /** Combined style overrides (colors and typography) for the `StagesPanel` component. */
 export interface StagesPanelStyles {
     /** Color overrides applied as CSS custom properties. */
     colors?: StagesPanelColors;
-    /** Typography applied to the stage name and expanded content. Defaults to `{ fontClassName: 'dial-small-text', contentClassName: 'dial-tiny-text' }`. */
+    /** Typography applied to the stage name and expanded content. */
     typography?: StageTypography;
 }
 /** User-visible strings for the `StagesPanel` component. */
@@ -54,7 +62,7 @@ export interface StagesPanelLabels {
     runningAriaLabel?: string;
     /** Visually-hidden label announced alongside a failed stage's icon. Defaults to `'Failed'`. */
     failedAriaLabel?: string;
-    /** Returns the label for a single attempt inside a collapsed `×N` group, given its 1-based attempt number. Defaults to `(n) => \`Attempt ${n}\``. */
+    /** Label for a single attempt given its 1-based number. Defaults to `(n) => \`Attempt ${n}\``. */
     attemptLabel?: (attemptNumber: number) => string;
 }
 /** Props accepted by the `StagesPanel` component. */

package/models/stages-props.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stages-props.d.ts","sourceRoot":"","sources":["../../src/models/stages-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD;;;;;GAKG;AACH,MAAM,WAAW,eAAe;IAC9B,+GAA+G;IAC/G,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2RAA2R;IAC3R,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kTAAkT;IAClT,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oQAAoQ;IACpQ,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uGAAuG;IACvG,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qEAAqE;IACrE,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,6GAA6G;IAC7G,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED;;;;GAIG;AACH,MAAM,WAAW,iBAAiB;IAChC,0BAA0B;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,wGAAwG;IACxG,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wFAAwF;AACxF,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,yJAAyJ;IACzJ,UAAU,CAAC,EAAE,eAAe,CAAC;CAC9B;AAED,4DAA4D;AAC5D,MAAM,WAAW,iBAAiB;IAChC,0FAA0F;IAC1F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yFAAyF;IACzF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,+FAA+F;IAC/F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,qJAAqJ;IACrJ,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,CAAC;CAClD;AAED,qDAAqD;AACrD,MAAM,WAAW,gBAAgB;IAC/B,yCAAyC;IACzC,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,2EAA2E;IAC3E,WAAW,EAAE,OAAO,CAAC;IACrB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,4BAA4B;IAC5B,MAAM,CAAC,EAAE,iBAAiB,CAAC;CAC5B"}
+{"version":3,"file":"stages-props.d.ts","sourceRoot":"","sources":["../../src/models/stages-props.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD,gGAAgG;AAChG,MAAM,WAAW,eAAe;IAC9B,wDAAwD;IACxD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wHAAwH;IACxH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,uFAAuF;IACvF,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,4FAA4F;IAC5F,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,yDAAyD;IACzD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,6EAA6E;IAC7E,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,2EAA2E;AAC3E,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,gEAAgE;IAChE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qEAAqE;IACrE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,4EAA4E;IAC5E,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,wEAAwE;IACxE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,qEAAqE;IACrE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,wFAAwF;IACxF,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,4FAA4F;IAC5F,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,wEAAwE;IACxE,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,uEAAuE;IACvE,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,0FAA0F;IAC1F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,4FAA4F;IAC5F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,mEAAmE;IACnE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,2FAA2F;IAC3F,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,wFAAwF;AACxF,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,iEAAiE;IACjE,UAAU,CAAC,EAAE,eAAe,CAAC;CAC9B;AAED,4DAA4D;AAC5D,MAAM,WAAW,iBAAiB;IAChC,0FAA0F;IAC1F,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yFAAyF;IACzF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,+FAA+F;IAC/F,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kGAAkG;IAClG,YAAY,CAAC,EAAE,CAAC,aAAa,EAAE,MAAM,KAAK,MAAM,CAAC;CAClD;AAED,qDAAqD;AACrD,MAAM,WAAW,gBAAgB;IAC/B,yCAAyC;IACzC,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,2EAA2E;IAC3E,WAAW,EAAE,OAAO,CAAC;IACrB,yDAAyD;IACzD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,MAAM,CAAC,EAAE,iBAAiB,CAAC;IAC3B,4BAA4B;IAC5B,MAAM,CAAC,EAAE,iBAAiB,CAAC;CAC5B"}

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.8",
+  "version": "1.1.0-dev.87",
   "license": "Apache-2.0",
   "type": "module",
   "main": "./index.js",
@@ -19,8 +19,8 @@
   "peerDependencies": {
     "react": "^19.0.0",
     "@tabler/icons-react": "^3.0.0",
-    "@epam/ai-dial-chat-shared": "1.1.0-dev.8",
-    "@epam/ai-dial-ui-kit": "0.12.0-dev.36"
+    "@epam/ai-dial-chat-shared": "1.1.0-dev.87",
+    "@epam/ai-dial-ui-kit": "^0.13.0-dev.26"
   },
   "repository": {
     "type": "git",

package/utils/stage-grouping.d.ts

@@ -1,11 +1,5 @@
 import { Stage } from '@epam/ai-dial-chat-shared';
 import { StageRow } from '../models/stage-grouping';
-/**
- * Collapses consecutive stages that share the same cleaned name into a
- * single `×N` group row (expanding to the individual attempts); every other
- * stage renders as its own row. Grouping is by cleaned name, not the raw
- * backend string, so a name differing only by its embedded duration still
- * groups correctly.
- */
+/** Groups consecutive stages with the same cleaned name into a `×N` group row; all others render as single rows. */
 export declare const groupStagesByName: (stages: Stage[]) => StageRow[];
 //# sourceMappingURL=stage-grouping.d.ts.map

package/utils/stage-grouping.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stage-grouping.d.ts","sourceRoot":"","sources":["../../src/utils/stage-grouping.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAGpD;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,GAAI,QAAQ,KAAK,EAAE,KAAG,QAAQ,EAgC3D,CAAC"}
+{"version":3,"file":"stage-grouping.d.ts","sourceRoot":"","sources":["../../src/utils/stage-grouping.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAGpD,oHAAoH;AACpH,eAAO,MAAM,iBAAiB,GAAI,QAAQ,KAAK,EAAE,KAAG,QAAQ,EA+B3D,CAAC"}

package/utils/stage-name.d.ts

@@ -1,26 +1,17 @@
 /** Result of cleaning a raw backend stage name for display. */
-export interface CleanedStageName {
-    /** Display name with any duration/timestamp group and trailing colon removed. Casing is preserved as given — never title-cased. */
+interface CleanedStageName {
+    /** Display name with any duration/timestamp bracket group and trailing colon removed. */
     name: string;
     /** Extracted duration label (e.g. `'3.99s'`), or `undefined` if the raw name carried none. */
     durationLabel?: string;
 }
-/**
- * Cleans a raw backend stage name for display: extracts an embedded
- * duration (discarding any accompanying timestamps, which have no
- * structured home in the UI today) and strips a single trailing colon.
- * Never re-cases or rewrites the remaining text.
- */
+/** Strips an embedded duration bracket group (e.g. `(7.18s, ...)`) and a trailing colon from a raw backend stage name. */
 export declare const cleanStageName: (rawName: string) => CleanedStageName;
-/**
- * Heuristic for "this cleaned name is a raw identifier, not prose":
- * no whitespace and at least one underscore (e.g. `My_OMDB_Agent__0_0_1_tool`).
- * Prose with an embedded identifier substring (e.g. `Call My_OMDB_Agent_tool`)
- * still contains a space and is left as normal text.
- */
+/** Returns true if the name looks like a raw identifier: no whitespace and contains an underscore. */
 export declare const isIdentifierLike: (name: string) => boolean;
 /** Formats a total duration in seconds as `'Xm Ys'` when >= 60s, otherwise `'X.Xs'`. */
 export declare const formatTotalDuration: (totalSeconds: number) => string;
 /** Parses a duration label produced by {@link cleanStageName} (e.g. `'3.99s'`) back into seconds. */
 export declare const parseDurationSeconds: (durationLabel: string | undefined) => number | undefined;
+export {};
 //# sourceMappingURL=stage-name.d.ts.map

package/utils/stage-name.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stage-name.d.ts","sourceRoot":"","sources":["../../src/utils/stage-name.ts"],"names":[],"mappings":"AAeA,+DAA+D;AAC/D,MAAM,WAAW,gBAAgB;IAC/B,mIAAmI;IACnI,IAAI,EAAE,MAAM,CAAC;IACb,8FAA8F;IAC9F,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;;;GAKG;AACH,eAAO,MAAM,cAAc,GAAI,SAAS,MAAM,KAAG,gBAyChD,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM,KAAG,OACW,CAAC;AAE5D,wFAAwF;AACxF,eAAO,MAAM,mBAAmB,GAAI,cAAc,MAAM,KAAG,MAO1D,CAAC;AAEF,qGAAqG;AACrG,eAAO,MAAM,oBAAoB,GAC/B,eAAe,MAAM,GAAG,SAAS,KAChC,MAAM,GAAG,SAIX,CAAC"}
+{"version":3,"file":"stage-name.d.ts","sourceRoot":"","sources":["../../src/utils/stage-name.ts"],"names":[],"mappings":"AAeA,+DAA+D;AAC/D,UAAU,gBAAgB;IACxB,yFAAyF;IACzF,IAAI,EAAE,MAAM,CAAC;IACb,8FAA8F;IAC9F,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED,0HAA0H;AAC1H,eAAO,MAAM,cAAc,GAAI,SAAS,MAAM,KAAG,gBAkChD,CAAC;AAEF,sGAAsG;AACtG,eAAO,MAAM,gBAAgB,GAAI,MAAM,MAAM,KAAG,OACW,CAAC;AAE5D,wFAAwF;AACxF,eAAO,MAAM,mBAAmB,GAAI,cAAc,MAAM,KAAG,MAO1D,CAAC;AAEF,qGAAqG;AACrG,eAAO,MAAM,oBAAoB,GAC/B,eAAe,MAAM,GAAG,SAAS,KAChC,MAAM,GAAG,SAIX,CAAC"}

package/utils/stage-progress.d.ts

@@ -1,11 +1,5 @@
 import { Stage } from '@epam/ai-dial-chat-shared';
-/**
- * Finds the currently-executing stage while a run is streaming: the last
- * entry with `status: null`. Returns `undefined` once every stage has
- * settled (or the list is empty), even if the caller still reports
- * `isStreaming: true` — a transitional state between the last stage settling
- * and the stream closing.
- */
+/** Returns the last stage with `status: null` (the currently executing stage), or `undefined` if none exists. */
 export declare const findLiveStage: (stages: Stage[]) => Stage | undefined;
 /** 1-based position of `stage` within `stages`, by its stable `index` field. */
 export declare const stagePosition: (stages: Stage[], stage: Stage) => number;

package/utils/stage-progress.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"stage-progress.d.ts","sourceRoot":"","sources":["../../src/utils/stage-progress.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,GAAI,QAAQ,KAAK,EAAE,KAAG,KAAK,GAAG,SACK,CAAC;AAE9D,gFAAgF;AAChF,eAAO,MAAM,aAAa,GAAI,QAAQ,KAAK,EAAE,EAAE,OAAO,KAAK,KAAG,MACR,CAAC"}
+{"version":3,"file":"stage-progress.d.ts","sourceRoot":"","sources":["../../src/utils/stage-progress.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,2BAA2B,CAAC;AAEvD,iHAAiH;AACjH,eAAO,MAAM,aAAa,GAAI,QAAQ,KAAK,EAAE,KAAG,KAAK,GAAG,SACK,CAAC;AAE9D,gFAAgF;AAChF,eAAO,MAAM,aAAa,GAAI,QAAQ,KAAK,EAAE,EAAE,OAAO,KAAK,KAAG,MACR,CAAC"}