@epam/ai-dial-conversation-stages 1.1.0-dev.30 → 1.1.0-dev.307
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/CollapsedGroup/CollapsedGroup.d.ts +1 -7
- package/components/CollapsedGroup/CollapsedGroup.d.ts.map +1 -1
- package/components/StageIcon/StageIcon.d.ts +1 -15
- package/components/StageIcon/StageIcon.d.ts.map +1 -1
- package/components/StageItem/StageItem.d.ts +2 -12
- package/components/StageItem/StageItem.d.ts.map +1 -1
- package/components/StageMarkdownContent/StageCodeBlock.d.ts +2 -0
- package/components/StageMarkdownContent/StageCodeBlock.d.ts.map +1 -1
- package/components/StagesPanel/StagesPanel.d.ts +1 -5
- package/components/StagesPanel/StagesPanel.d.ts.map +1 -1
- package/index.css +1 -1
- package/index.js +288 -240
- package/models/collapsed-group.d.ts +14 -17
- package/models/collapsed-group.d.ts.map +1 -1
- package/models/stage-grouping.d.ts +6 -14
- package/models/stage-grouping.d.ts.map +1 -1
- package/models/stages-props.d.ts +39 -27
- package/models/stages-props.d.ts.map +1 -1
- package/package.json +3 -3
- package/utils/stage-grouping.d.ts +1 -7
- package/utils/stage-grouping.d.ts.map +1 -1
- package/utils/stage-name.d.ts +5 -14
- package/utils/stage-name.d.ts.map +1 -1
- package/utils/stage-progress.d.ts +1 -7
- package/utils/stage-progress.d.ts.map +1 -1
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
import { CollapsedGroupProps } from '../../models/collapsed-group';
|
|
3
|
-
/**
|
|
4
|
-
* Wraps `StagesPanel` with a single summary line whose text and default
|
|
5
|
-
* open/closed state track the run: expanded with a live progress line while
|
|
6
|
-
* streaming, then collapsed to one line — finished or failed — the moment
|
|
7
|
-
* it ends. A lone stage skips the summary line entirely and renders
|
|
8
|
-
* directly; an empty list renders nothing.
|
|
9
|
-
*/
|
|
3
|
+
/** Wraps `StagesPanel` with a collapsible summary line that tracks run state: live progress while streaming, one-line summary once finished. */
|
|
10
4
|
export declare const CollapsedGroup: FC<CollapsedGroupProps>;
|
|
11
5
|
//# sourceMappingURL=CollapsedGroup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CollapsedGroup.d.ts","sourceRoot":"","sources":["../../../src/components/CollapsedGroup/CollapsedGroup.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CollapsedGroup.d.ts","sourceRoot":"","sources":["../../../src/components/CollapsedGroup/CollapsedGroup.tsx"],"names":[],"mappings":"AAiBA,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,CA+OlD,CAAC"}
|
|
@@ -11,20 +11,6 @@ export interface StageIconProps {
|
|
|
11
11
|
/** Accessible label announced (visually hidden) alongside a failed stage's icon. Defaults to `'Failed'`. */
|
|
12
12
|
failedLabel?: string;
|
|
13
13
|
}
|
|
14
|
-
/**
|
|
15
|
-
* The row's single icon slot, filled by priority: exception (failed, or
|
|
16
|
-
* running via a spinner) always wins; everything else — completed, or a
|
|
17
|
-
* settled-but-unresolved stage from an aborted stream — falls back to one
|
|
18
|
-
* uniform check glyph, the same `IconCheck` glyph and size as the
|
|
19
|
-
* `CollapsedGroup` summary's own "Executed N steps" check, but in a quiet
|
|
20
|
-
* grey ink rather than the summary's success color — the summary is the one
|
|
21
|
-
* place that should read as a vivid confirmation, not every row. There is
|
|
22
|
-
* no separate "pending" glyph: the quiet tier is intentionally a single
|
|
23
|
-
* glyph, not a per-state icon set.
|
|
24
|
-
*
|
|
25
|
-
* The icon itself is `aria-hidden` (decorative) — status is also carried by
|
|
26
|
-
* text: failed stages get a visually-hidden label here, and their row name
|
|
27
|
-
* gets the warning ink color at the call site.
|
|
28
|
-
*/
|
|
14
|
+
/** Renders the icon for a stage, based on its status and whether it's currently executing. */
|
|
29
15
|
export declare const StageIcon: FC<StageIconProps>;
|
|
30
16
|
//# sourceMappingURL=StageIcon.d.ts.map
|
|
@@ -1 +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;
|
|
1
|
+
{"version":3,"file":"StageIcon.d.ts","sourceRoot":"","sources":["../../../src/components/StageIcon/StageIcon.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAOxD,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,CAgCxC,CAAC"}
|
|
@@ -11,19 +11,9 @@ export interface StageItemProps {
|
|
|
11
11
|
typography?: StageTypography;
|
|
12
12
|
/** User-visible strings. */
|
|
13
13
|
labels?: StagesPanelLabels;
|
|
14
|
-
/**
|
|
15
|
-
* Overrides the displayed name without affecting duration extraction —
|
|
16
|
-
* used to relabel an individual attempt (e.g. `'Attempt 2'`) inside a
|
|
17
|
-
* collapsed `×N` group while still reading that attempt's own duration
|
|
18
|
-
* from its real `stage.name`.
|
|
19
|
-
*/
|
|
14
|
+
/** Overrides the displayed name; used to relabel individual attempts (e.g. `'Attempt 2'`) inside a `×N` group. */
|
|
20
15
|
nameOverride?: string;
|
|
21
16
|
}
|
|
22
|
-
/**
|
|
23
|
-
* A single flat stage row: icon · name · tag? · duration? · chevron? — every
|
|
24
|
-
* element but the icon and name is optional and renders only when the data
|
|
25
|
-
* exists. Plain when the stage has no expandable content or attachments;
|
|
26
|
-
* becomes a disclosure button when it does.
|
|
27
|
-
*/
|
|
17
|
+
/** Renders a single stage row, optionally expandable to show its content. */
|
|
28
18
|
export declare const StageItem: FC<StageItemProps>;
|
|
29
19
|
//# sourceMappingURL=StageItem.d.ts.map
|
|
@@ -1 +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;
|
|
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;AAQvD,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,CA+HxC,CAAC"}
|
|
@@ -4,6 +4,8 @@ interface Props {
|
|
|
4
4
|
children: ReactNode;
|
|
5
5
|
/** Language class from react-markdown (e.g. `language-json`). */
|
|
6
6
|
codeClassName?: string;
|
|
7
|
+
/** Typography class applied to the `<pre>` block. Defaults to `'dial-code-text'`. */
|
|
8
|
+
blockClassName?: string;
|
|
7
9
|
/** Accessible label for the copy button. */
|
|
8
10
|
copyAriaLabel: string;
|
|
9
11
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StageCodeBlock.d.ts","sourceRoot":"","sources":["../../../src/components/StageMarkdownContent/StageCodeBlock.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"StageCodeBlock.d.ts","sourceRoot":"","sources":["../../../src/components/StageMarkdownContent/StageCodeBlock.tsx"],"names":[],"mappings":"AAQA,OAAO,EACL,KAAK,EAAE,EACP,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAGf,UAAU,KAAK;IACb,6BAA6B;IAC7B,QAAQ,EAAE,SAAS,CAAC;IACpB,iEAAiE;IACjE,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,qFAAqF;IACrF,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,4CAA4C;IAC5C,aAAa,EAAE,MAAM,CAAC;CACvB;AAED,mEAAmE;AACnE,eAAO,MAAM,cAAc,EAAE,EAAE,CAAC,KAAK,CA4DpC,CAAC"}
|
|
@@ -1,9 +1,5 @@
|
|
|
1
1
|
import { FC } from 'react';
|
|
2
2
|
import { StagesPanelProps } from '../../models/stages-props';
|
|
3
|
-
/**
|
|
4
|
-
* Displays an agent's accumulated stages as a flat, inline list of rows — no
|
|
5
|
-
* card, border, or panel around it. Repeated identical stage names collapse
|
|
6
|
-
* into one `×N` row that expands to the individual attempts.
|
|
7
|
-
*/
|
|
3
|
+
/** Flat inline list of agent stages; repeated identical names collapse into a ×N group row. */
|
|
8
4
|
export declare const StagesPanel: FC<StagesPanelProps>;
|
|
9
5
|
//# sourceMappingURL=StagesPanel.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StagesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/StagesPanel/StagesPanel.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"StagesPanel.d.ts","sourceRoot":"","sources":["../../../src/components/StagesPanel/StagesPanel.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,EAAE,EAAY,MAAM,OAAO,CAAC;AAErC,OAAO,KAAK,EAEV,gBAAgB,EAEjB,MAAM,2BAA2B,CAAC;AA8InC,+FAA+F;AAC/F,eAAO,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CA+D5C,CAAC"}
|
package/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.
|
|
1
|
+
._panel_vd48n_1{color:var(--cs-text,var(--text-primary,#161b2d))}._row_vd48n_5:hover{background:var(--cs-row-hover,var(--bg-layer-sunken,#eef1f7))}._collapseButton_vd48n_9{background:var(--cs-button-bg,transparent)}._stageName_vd48n_13{color:var(--cs-stage-text,var(--text-secondary,#57647a))}._stageNameFailed_vd48n_17{color:var(--cs-failed-text,var(--text-warning,#7f6300))}._monoName_vd48n_21{font-family:ui-monospace,SF Mono,Menlo,Consolas,monospace}._tag_vd48n_25{color:var(--cs-tag-text,var(--text-tertiary,#848e9c))}._count_vd48n_29{color:var(--cs-count-text,var(--text-tertiary,#848e9c));font-variant-numeric:tabular-nums}._duration_vd48n_34{color:var(--cs-duration-text,var(--text-tertiary,#848e9c));font-variant-numeric:tabular-nums}._iconSecondary_vd48n_39{color:var(--cs-icon-secondary,var(--text-secondary,#57647a));opacity:.7}._iconCompleted_vd48n_44{color:var(--cs-icon-completed,var(--text-tertiary,#848e9c))}._iconError_vd48n_48{color:var(--cs-icon-error,var(--text-warning,#7f6300))}._stageContent_vd48n_52{color:var(--cs-stage-text,var(--text-secondary,#57647a))}._codeBlock_vd48n_56{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_vd48n_62{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_vd48n_68{border-color:var(--cs-stage-text,var(--text-secondary,#57647a));color:var(--cs-stage-text,var(--text-secondary,#57647a))}._tableCell_vd48n_73{border-color:var(--cs-border,var(--stroke-secondary,#d1dbea));color:var(--cs-stage-text,var(--text-secondary,#57647a))}._toggleButton_1sa5v_1{color:var(--cs-cg-label,var(--text-secondary,#57647a));text-align:start;width:100%;min-width:0;justify-content:flex-start!important}._toggleButton_1sa5v_1:hover{color:var(--cs-cg-label-hover,var(--text-primary,#161b2d))}._executedLabel_1sa5v_13{color:var(--cs-cg-label,var(--text-secondary,#57647a))}._stepsCount_1sa5v_17{color:var(--cs-cg-steps-count,var(--text-tertiary,#848e9c));font-variant-numeric:tabular-nums}._doneIcon_1sa5v_22{color:var(--cs-cg-done,var(--text-success,#007274))}._failedText_1sa5v_26{color:var(--cs-cg-failed,var(--text-warning,#7f6300))}._liveName_1sa5v_30{color:var(--cs-cg-label,var(--text-primary,#161b2d))}
|
|
2
2
|
/*$vite$:1*/
|
package/index.js
CHANGED
|
@@ -1,105 +1,106 @@
|
|
|
1
1
|
import { MarkdownRenderer as e, StageStatus as t, buildCssVars as n, copyToClipboard as r, mergeClasses as i } from "@epam/ai-dial-chat-shared";
|
|
2
|
-
import { DIAL_ICON_SIZE as a,
|
|
3
|
-
import { IconAlertCircle as
|
|
4
|
-
import { memo as
|
|
5
|
-
import { Fragment as
|
|
2
|
+
import { DIAL_ICON_SIZE as a, DIAL_KIT_ICON_STROKE as o, ElementSize as s, EllipsisTooltip as c, GhostIconButton as l, LinkButton as u, Spinner as d } from "@epam/ai-dial-ui-kit";
|
|
3
|
+
import { IconAlertCircle as f, IconCheck as p, IconChevronDown as m, IconChevronRight as h, IconCopy as g } from "@tabler/icons-react";
|
|
4
|
+
import { memo as _, useCallback as v, useEffect as y, useRef as b, useState as x } from "react";
|
|
5
|
+
import { Fragment as S, jsx as C, jsxs as w } from "react/jsx-runtime";
|
|
6
6
|
//#region src/utils/stage-name.ts
|
|
7
|
-
var
|
|
7
|
+
var T = /[([][^()[\]]*[)\]]/g, E = /(\d+(?:\.\d+)?)\s*s\b/, D = /:\s*$/, O = (e) => {
|
|
8
8
|
let t = e ?? "";
|
|
9
|
-
|
|
9
|
+
T.lastIndex = 0;
|
|
10
10
|
let n, r = null, i = -1, a = 0;
|
|
11
|
-
for (; n =
|
|
12
|
-
let e = n[0].slice(1, -1), t =
|
|
11
|
+
for (; n = T.exec(t);) {
|
|
12
|
+
let e = n[0].slice(1, -1), t = E.exec(e);
|
|
13
13
|
if (t) {
|
|
14
14
|
r = t, i = n.index, a = n[0].length;
|
|
15
15
|
break;
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
18
|
return {
|
|
19
|
-
name: (r && i >= 0 ? t.slice(0, i) + t.slice(i + a) : t).replace(
|
|
19
|
+
name: (r && i >= 0 ? t.slice(0, i) + t.slice(i + a) : t).replace(D, "").trim().replace(/ {2,}/g, " "),
|
|
20
20
|
durationLabel: r ? `${r[1]}s` : void 0
|
|
21
21
|
};
|
|
22
|
-
},
|
|
22
|
+
}, k = (e) => e.length > 0 && !/\s/.test(e) && e.includes("_"), A = (e) => e >= 60 ? `${Math.floor(e / 60)}m ${Math.round(e % 60)}s` : `${e.toFixed(1)}s`, j = (e) => {
|
|
23
23
|
if (!e) return;
|
|
24
24
|
let t = /^(\d+(?:\.\d+)?)s$/.exec(e);
|
|
25
25
|
return t ? parseFloat(t[1]) : void 0;
|
|
26
|
-
},
|
|
26
|
+
}, M = (e) => [...e].reverse().find((e) => e.status == null), N = (e, t) => e.findIndex((e) => e.index === t.index) + 1, P = (e) => {
|
|
27
27
|
let t = [], n = 0;
|
|
28
28
|
for (; n < e.length;) {
|
|
29
|
-
let r = e[n], i =
|
|
30
|
-
for (; a < e.length &&
|
|
29
|
+
let r = e[n], i = O(r.name).name, a = n + 1;
|
|
30
|
+
for (; a < e.length && O(e[a].name).name === i;) a += 1;
|
|
31
31
|
let o = e.slice(n, a);
|
|
32
32
|
o.length > 1 ? t.push({
|
|
33
|
-
kind: "group",
|
|
34
33
|
key: r.index,
|
|
35
34
|
name: i,
|
|
36
35
|
attempts: o
|
|
37
36
|
}) : t.push({
|
|
38
|
-
kind: "single",
|
|
39
37
|
key: r.index,
|
|
40
38
|
stage: r
|
|
41
39
|
}), n = a;
|
|
42
40
|
}
|
|
43
41
|
return t;
|
|
44
|
-
},
|
|
45
|
-
panel: "
|
|
46
|
-
row: "
|
|
47
|
-
collapseButton: "
|
|
48
|
-
stageName: "
|
|
49
|
-
stageNameFailed: "
|
|
50
|
-
monoName: "
|
|
51
|
-
tag: "
|
|
52
|
-
count: "
|
|
53
|
-
duration: "
|
|
54
|
-
iconSecondary: "
|
|
55
|
-
iconCompleted: "
|
|
56
|
-
iconError: "
|
|
57
|
-
stageContent: "
|
|
58
|
-
codeBlock: "
|
|
59
|
-
codeInline: "
|
|
60
|
-
blockquote: "
|
|
61
|
-
tableCell: "
|
|
62
|
-
},
|
|
42
|
+
}, F = {
|
|
43
|
+
panel: "_panel_vd48n_1",
|
|
44
|
+
row: "_row_vd48n_5",
|
|
45
|
+
collapseButton: "_collapseButton_vd48n_9",
|
|
46
|
+
stageName: "_stageName_vd48n_13",
|
|
47
|
+
stageNameFailed: "_stageNameFailed_vd48n_17",
|
|
48
|
+
monoName: "_monoName_vd48n_21",
|
|
49
|
+
tag: "_tag_vd48n_25",
|
|
50
|
+
count: "_count_vd48n_29",
|
|
51
|
+
duration: "_duration_vd48n_34",
|
|
52
|
+
iconSecondary: "_iconSecondary_vd48n_39",
|
|
53
|
+
iconCompleted: "_iconCompleted_vd48n_44",
|
|
54
|
+
iconError: "_iconError_vd48n_48",
|
|
55
|
+
stageContent: "_stageContent_vd48n_52",
|
|
56
|
+
codeBlock: "_codeBlock_vd48n_56",
|
|
57
|
+
codeInline: "_codeInline_vd48n_62",
|
|
58
|
+
blockquote: "_blockquote_vd48n_68",
|
|
59
|
+
tableCell: "_tableCell_vd48n_73"
|
|
60
|
+
}, I = ({ status: e, isLive: n, runningLabel: r = "Running", failedLabel: i = "Failed" }) => n ? /* @__PURE__ */ C(d, {
|
|
63
61
|
size: 16,
|
|
64
62
|
ariaLabel: r
|
|
65
|
-
}) : e === t.Failed ? /* @__PURE__ */
|
|
63
|
+
}) : e === t.Failed ? /* @__PURE__ */ w(S, { children: [/* @__PURE__ */ C(f, {
|
|
66
64
|
size: a.MD,
|
|
67
|
-
className:
|
|
68
|
-
"aria-hidden": !0
|
|
69
|
-
|
|
65
|
+
className: F.iconError,
|
|
66
|
+
"aria-hidden": !0,
|
|
67
|
+
stroke: o
|
|
68
|
+
}), /* @__PURE__ */ C("span", {
|
|
70
69
|
className: "sr-only",
|
|
71
70
|
children: i
|
|
72
|
-
})] }) : /* @__PURE__ */
|
|
71
|
+
})] }) : /* @__PURE__ */ C(p, {
|
|
73
72
|
size: a.SM,
|
|
74
|
-
className:
|
|
75
|
-
"aria-hidden": !0
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
73
|
+
className: F.iconCompleted,
|
|
74
|
+
"aria-hidden": !0,
|
|
75
|
+
stroke: o
|
|
76
|
+
}), L = ({ children: e, codeClassName: t, blockClassName: n = "dial-code-text", copyAriaLabel: c }) => {
|
|
77
|
+
let [u, d] = x(!1), f = b(null);
|
|
78
|
+
y(() => () => {
|
|
79
|
+
f.current != null && clearTimeout(f.current);
|
|
80
80
|
}, []);
|
|
81
|
-
let
|
|
82
|
-
r(typeof e == "string" ? e : String(e ?? "")),
|
|
81
|
+
let m = v(() => {
|
|
82
|
+
r(typeof e == "string" ? e : String(e ?? "")), f.current && clearTimeout(f.current), d(!0), f.current = setTimeout(() => d(!1), 2e3);
|
|
83
83
|
}, [e]);
|
|
84
|
-
return /* @__PURE__ */
|
|
85
|
-
className: i("relative max-h-[300px] overflow-auto rounded border p-3
|
|
86
|
-
children: [/* @__PURE__ */
|
|
87
|
-
size:
|
|
88
|
-
icon:
|
|
84
|
+
return /* @__PURE__ */ w("pre", {
|
|
85
|
+
className: i("relative max-h-[300px] overflow-auto rounded border p-3", n, F.codeBlock),
|
|
86
|
+
children: [/* @__PURE__ */ C(l, {
|
|
87
|
+
size: s.Small,
|
|
88
|
+
icon: C(u ? p : g, {
|
|
89
89
|
size: a.SM,
|
|
90
|
-
className:
|
|
90
|
+
className: F.iconSecondary,
|
|
91
|
+
stroke: o
|
|
91
92
|
}),
|
|
92
|
-
"aria-label":
|
|
93
|
-
onClick:
|
|
93
|
+
"aria-label": c,
|
|
94
|
+
onClick: m,
|
|
94
95
|
className: "absolute end-2 top-2"
|
|
95
|
-
}), /* @__PURE__ */
|
|
96
|
-
className:
|
|
96
|
+
}), /* @__PURE__ */ C("code", {
|
|
97
|
+
className: t,
|
|
97
98
|
children: e
|
|
98
99
|
})]
|
|
99
100
|
});
|
|
100
|
-
},
|
|
101
|
-
let a = "mb-1.5 last:mb-0", o = i(n?.headingClassName ?? "dial-small-semi-text",
|
|
102
|
-
return /* @__PURE__ */
|
|
101
|
+
}, R = _(({ content: t, typography: n, copyAriaLabel: r = "Copy" }) => {
|
|
102
|
+
let a = "mb-1.5 last:mb-0", o = i(n?.headingClassName ?? "dial-small-semi-text", F.stageContent, a);
|
|
103
|
+
return /* @__PURE__ */ C(e, {
|
|
103
104
|
content: t,
|
|
104
105
|
classNames: {
|
|
105
106
|
h1: o,
|
|
@@ -108,142 +109,150 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
|
|
|
108
109
|
h4: o,
|
|
109
110
|
h5: o,
|
|
110
111
|
h6: o,
|
|
111
|
-
p: i(n?.contentClassName ?? "dial-tiny-text",
|
|
112
|
-
ul: i(n?.contentClassName ?? "dial-tiny-text",
|
|
113
|
-
ol: i(n?.contentClassName ?? "dial-tiny-text",
|
|
114
|
-
strong: i(n?.strongClassName ?? n?.contentClassName ?? "dial-tiny-text",
|
|
115
|
-
codeInline:
|
|
116
|
-
blockquote: i(n?.contentClassName ?? "dial-tiny-text",
|
|
117
|
-
link: i(n?.contentClassName ?? "dial-tiny-text",
|
|
118
|
-
tableCell: i(n?.contentClassName ?? "dial-tiny-text",
|
|
112
|
+
p: i(n?.contentClassName ?? "dial-tiny-text", F.stageContent, "mb-1.5"),
|
|
113
|
+
ul: i(n?.contentClassName ?? "dial-tiny-text", F.stageContent, a),
|
|
114
|
+
ol: i(n?.contentClassName ?? "dial-tiny-text", F.stageContent, a),
|
|
115
|
+
strong: i(n?.strongClassName ?? n?.contentClassName ?? "dial-tiny-text", F.stageContent),
|
|
116
|
+
codeInline: F.codeInline,
|
|
117
|
+
blockquote: i(n?.contentClassName ?? "dial-tiny-text", F.blockquote, a),
|
|
118
|
+
link: i(n?.contentClassName ?? "dial-tiny-text", F.stageContent),
|
|
119
|
+
tableCell: i(n?.contentClassName ?? "dial-tiny-text", F.tableCell)
|
|
119
120
|
},
|
|
120
|
-
components: { code: ({ children: e, className: t }) => t?.includes("language-") ? /* @__PURE__ */
|
|
121
|
+
components: { code: ({ children: e, className: t }) => t?.includes("language-") ? /* @__PURE__ */ C(L, {
|
|
121
122
|
codeClassName: t,
|
|
123
|
+
blockClassName: n?.codeBlockClassName,
|
|
122
124
|
copyAriaLabel: r,
|
|
123
125
|
children: e
|
|
124
|
-
}) : /* @__PURE__ */
|
|
125
|
-
className: i("inline-block px-1.5 py-1", n?.codeClassName ?? "dial-
|
|
126
|
+
}) : /* @__PURE__ */ C("code", {
|
|
127
|
+
className: i("inline-block px-1.5 py-1", n?.codeClassName ?? "dial-code-text rounded-md", F.codeInline),
|
|
126
128
|
children: e
|
|
127
129
|
}) }
|
|
128
130
|
});
|
|
129
|
-
}),
|
|
130
|
-
let [
|
|
131
|
-
/* @__PURE__ */
|
|
131
|
+
}), z = ({ stage: e, isLive: n, typography: r, labels: s, nameOverride: l }) => {
|
|
132
|
+
let [u, d] = x(!1), { copyAriaLabel: f = "Copy stage content", runningAriaLabel: p, failedAriaLabel: g } = s ?? {}, { name: _, durationLabel: v } = O(e.name), y = l ?? _, b = !l && k(_), T = e.status === t.Failed, E = !!e.content, D = /* @__PURE__ */ w(S, { children: [
|
|
133
|
+
/* @__PURE__ */ C("span", {
|
|
132
134
|
className: "flex flex-none items-center",
|
|
133
|
-
children: /* @__PURE__ */
|
|
135
|
+
children: /* @__PURE__ */ C(I, {
|
|
134
136
|
status: e.status,
|
|
135
137
|
isLive: n,
|
|
136
|
-
runningLabel:
|
|
137
|
-
failedLabel:
|
|
138
|
+
runningLabel: p,
|
|
139
|
+
failedLabel: g
|
|
138
140
|
})
|
|
139
141
|
}),
|
|
140
|
-
/* @__PURE__ */
|
|
141
|
-
className: i("min-w-0 max-w-[22rem] truncate", r?.fontClassName ?? "dial-small-text",
|
|
142
|
-
children: /* @__PURE__ */
|
|
142
|
+
/* @__PURE__ */ C("span", {
|
|
143
|
+
className: i("min-w-0 max-w-[22rem] truncate", r?.fontClassName ?? "dial-small-text", F.stageName, T && F.stageNameFailed, b && F.monoName),
|
|
144
|
+
children: /* @__PURE__ */ C(c, { text: y || e.status || "" })
|
|
143
145
|
}),
|
|
144
|
-
e.tag && /* @__PURE__ */
|
|
145
|
-
className: i("flex-none", r?.
|
|
146
|
+
e.tag && /* @__PURE__ */ C("span", {
|
|
147
|
+
className: i("flex-none", r?.tagClassName ?? "dial-tiny-lead-text", F.tag),
|
|
146
148
|
children: e.tag
|
|
147
149
|
}),
|
|
148
|
-
|
|
149
|
-
className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text",
|
|
150
|
-
children:
|
|
150
|
+
v && /* @__PURE__ */ C("span", {
|
|
151
|
+
className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text", F.duration),
|
|
152
|
+
children: v
|
|
151
153
|
}),
|
|
152
|
-
|
|
153
|
-
className: i("flex-none",
|
|
154
|
-
children:
|
|
154
|
+
E && /* @__PURE__ */ C("span", {
|
|
155
|
+
className: i("flex-none", F.iconSecondary),
|
|
156
|
+
children: u ? /* @__PURE__ */ C(m, {
|
|
155
157
|
size: a.SM,
|
|
156
|
-
"aria-hidden": !0
|
|
157
|
-
|
|
158
|
+
"aria-hidden": !0,
|
|
159
|
+
stroke: o
|
|
160
|
+
}) : /* @__PURE__ */ C(h, {
|
|
158
161
|
size: a.SM,
|
|
159
162
|
className: "rtl:scale-x-[-1]",
|
|
160
|
-
"aria-hidden": !0
|
|
163
|
+
"aria-hidden": !0,
|
|
164
|
+
stroke: o
|
|
161
165
|
})
|
|
162
166
|
})
|
|
163
|
-
] }),
|
|
164
|
-
return
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
167
|
+
] }), A = i("flex w-full items-center gap-2 px-2 py-1.5", F.row);
|
|
168
|
+
return E ? /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("div", {
|
|
169
|
+
className: A,
|
|
170
|
+
children: /* @__PURE__ */ C("button", {
|
|
171
|
+
type: "button",
|
|
172
|
+
onClick: () => d((e) => !e),
|
|
173
|
+
"aria-expanded": u,
|
|
174
|
+
className: "flex min-w-0 flex-1 cursor-pointer items-center gap-2 text-start",
|
|
175
|
+
children: D
|
|
176
|
+
})
|
|
177
|
+
}), /* @__PURE__ */ C("div", {
|
|
178
|
+
className: i("grid overflow-hidden transition-[grid-template-rows] duration-[250ms] ease-in-out", u ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
|
|
179
|
+
children: /* @__PURE__ */ C("div", {
|
|
173
180
|
className: "overflow-hidden",
|
|
174
|
-
children: /* @__PURE__ */
|
|
181
|
+
children: /* @__PURE__ */ C("div", {
|
|
175
182
|
className: "mt-2 flex flex-col gap-3 py-1 ps-8",
|
|
176
|
-
children: e.content && /* @__PURE__ */
|
|
183
|
+
children: e.content && /* @__PURE__ */ C("div", {
|
|
177
184
|
className: "max-h-[300px] overflow-y-auto",
|
|
178
|
-
children: /* @__PURE__ */
|
|
185
|
+
children: /* @__PURE__ */ C(R, {
|
|
179
186
|
content: e.content,
|
|
180
187
|
typography: r,
|
|
181
|
-
copyAriaLabel:
|
|
188
|
+
copyAriaLabel: f
|
|
182
189
|
})
|
|
183
190
|
})
|
|
184
191
|
})
|
|
185
192
|
})
|
|
186
|
-
})] }) : /* @__PURE__ */
|
|
187
|
-
className:
|
|
188
|
-
children:
|
|
193
|
+
})] }) : /* @__PURE__ */ C("div", {
|
|
194
|
+
className: A,
|
|
195
|
+
children: D
|
|
189
196
|
});
|
|
190
|
-
},
|
|
191
|
-
let { runningAriaLabel:
|
|
192
|
-
let { durationLabel: n } =
|
|
193
|
-
return e + (
|
|
194
|
-
}, 0),
|
|
195
|
-
return /* @__PURE__ */
|
|
197
|
+
}, B = ({ row: e, isLive: n, typography: r, labels: s }) => {
|
|
198
|
+
let { runningAriaLabel: l, failedAriaLabel: u, attemptLabel: d = (e) => `Attempt ${e}` } = s ?? {}, [f, p] = x(!1), g = e.attempts?.some((e) => e.status === t.Failed), _ = (e.attempts || []).reduce((e, t) => {
|
|
199
|
+
let { durationLabel: n } = O(t.name);
|
|
200
|
+
return e + (j(n) ?? 0);
|
|
201
|
+
}, 0), v = _ > 0 ? A(_) : void 0;
|
|
202
|
+
return /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ w("button", {
|
|
196
203
|
type: "button",
|
|
197
|
-
onClick: () =>
|
|
198
|
-
"aria-expanded":
|
|
199
|
-
className: i("flex w-full items-center gap-2 px-2 py-1.5 text-start",
|
|
204
|
+
onClick: () => p((e) => !e),
|
|
205
|
+
"aria-expanded": f,
|
|
206
|
+
className: i("flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-start", F.collapseButton, F.row),
|
|
200
207
|
children: [
|
|
201
|
-
/* @__PURE__ */
|
|
208
|
+
/* @__PURE__ */ C("span", {
|
|
202
209
|
className: "flex flex-none items-center",
|
|
203
|
-
children: /* @__PURE__ */
|
|
204
|
-
status:
|
|
210
|
+
children: /* @__PURE__ */ C(I, {
|
|
211
|
+
status: g ? t.Failed : t.Completed,
|
|
205
212
|
isLive: n,
|
|
206
|
-
runningLabel:
|
|
207
|
-
failedLabel:
|
|
213
|
+
runningLabel: l,
|
|
214
|
+
failedLabel: u
|
|
208
215
|
})
|
|
209
216
|
}),
|
|
210
|
-
/* @__PURE__ */ S("span", {
|
|
211
|
-
className: i("min-w-0 max-w-[22rem] truncate", r?.fontClassName ?? "dial-small-text", P.stageName, h && P.stageNameFailed),
|
|
212
|
-
children: /* @__PURE__ */ S(o, { text: e.name })
|
|
213
|
-
}),
|
|
214
217
|
/* @__PURE__ */ C("span", {
|
|
215
|
-
className: i("
|
|
216
|
-
children:
|
|
218
|
+
className: i("min-w-0 max-w-[22rem] truncate", r?.fontClassName ?? "dial-small-text", F.stageName, g && F.stageNameFailed),
|
|
219
|
+
children: /* @__PURE__ */ C(c, { text: e.name })
|
|
217
220
|
}),
|
|
218
|
-
|
|
219
|
-
className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text",
|
|
220
|
-
children:
|
|
221
|
+
/* @__PURE__ */ w("span", {
|
|
222
|
+
className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text", F.count),
|
|
223
|
+
children: ["×", e.attempts?.length ?? 0]
|
|
221
224
|
}),
|
|
222
|
-
/* @__PURE__ */
|
|
223
|
-
className: i("flex-none",
|
|
224
|
-
children:
|
|
225
|
+
v && /* @__PURE__ */ C("span", {
|
|
226
|
+
className: i("flex-none", r?.countFontClassName ?? "dial-tiny-text", F.duration),
|
|
227
|
+
children: v
|
|
228
|
+
}),
|
|
229
|
+
/* @__PURE__ */ C("span", {
|
|
230
|
+
className: i("flex-none", F.iconSecondary),
|
|
231
|
+
children: f ? /* @__PURE__ */ C(m, {
|
|
225
232
|
size: a.SM,
|
|
226
|
-
"aria-hidden": !0
|
|
227
|
-
|
|
233
|
+
"aria-hidden": !0,
|
|
234
|
+
stroke: o
|
|
235
|
+
}) : /* @__PURE__ */ C(h, {
|
|
228
236
|
size: a.SM,
|
|
229
237
|
className: "rtl:scale-x-[-1]",
|
|
230
|
-
"aria-hidden": !0
|
|
238
|
+
"aria-hidden": !0,
|
|
239
|
+
stroke: o
|
|
231
240
|
})
|
|
232
241
|
})
|
|
233
242
|
]
|
|
234
|
-
}), /* @__PURE__ */
|
|
235
|
-
className: i("grid overflow-hidden transition-[grid-template-rows] duration-[250ms] ease-in-out",
|
|
236
|
-
children: /* @__PURE__ */
|
|
243
|
+
}), /* @__PURE__ */ C("div", {
|
|
244
|
+
className: i("grid overflow-hidden transition-[grid-template-rows] duration-[250ms] ease-in-out", f ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
|
|
245
|
+
children: /* @__PURE__ */ C("div", {
|
|
237
246
|
className: "overflow-hidden",
|
|
238
|
-
children: /* @__PURE__ */
|
|
247
|
+
children: /* @__PURE__ */ C("ul", {
|
|
239
248
|
role: "list",
|
|
240
249
|
className: "mt-1 flex flex-col gap-0.5 ps-6",
|
|
241
|
-
children: e.attempts
|
|
250
|
+
children: e.attempts?.map((t, i) => /* @__PURE__ */ C("li", {
|
|
242
251
|
role: "listitem",
|
|
243
|
-
children: /* @__PURE__ */
|
|
252
|
+
children: /* @__PURE__ */ C(z, {
|
|
244
253
|
stage: t,
|
|
245
|
-
nameOverride:
|
|
246
|
-
isLive: n && t.index === e.attempts[e.attempts.length - 1]
|
|
254
|
+
nameOverride: d(i + 1),
|
|
255
|
+
isLive: n && t.index === e.attempts?.[e.attempts.length - 1]?.index,
|
|
247
256
|
typography: r,
|
|
248
257
|
labels: s
|
|
249
258
|
})
|
|
@@ -251,170 +260,209 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
|
|
|
251
260
|
})
|
|
252
261
|
})
|
|
253
262
|
})] });
|
|
254
|
-
},
|
|
263
|
+
}, V = ({ stages: e, isStreaming: t, className: r, styles: a, labels: o }) => {
|
|
255
264
|
let { colors: s, typography: c } = a ?? {}, l = n({
|
|
256
265
|
"--cs-text": s?.text,
|
|
257
266
|
"--cs-row-hover": s?.rowHoverColor,
|
|
267
|
+
"--cs-button-bg": s?.collapsedButtonBg,
|
|
258
268
|
"--cs-stage-text": s?.stageTextColor,
|
|
259
|
-
"--cs-failed-text": s?.failedColor
|
|
260
|
-
|
|
261
|
-
|
|
269
|
+
"--cs-failed-text": s?.failedColor,
|
|
270
|
+
"--cs-tag-text": s?.tagTextColor,
|
|
271
|
+
"--cs-count-text": s?.countTextColor,
|
|
272
|
+
"--cs-duration-text": s?.durationTextColor,
|
|
273
|
+
"--cs-icon-secondary": s?.iconSecondaryColor,
|
|
274
|
+
"--cs-icon-completed": s?.iconCompletedColor,
|
|
275
|
+
"--cs-icon-error": s?.iconErrorColor,
|
|
276
|
+
"--cs-code-bg": s?.codeBg,
|
|
277
|
+
"--cs-code-border": s?.codeBorderColor,
|
|
278
|
+
"--cs-code-text": s?.codeTextColor,
|
|
279
|
+
"--cs-border": s?.borderColor
|
|
280
|
+
}), u = t ? M(e) : void 0, d = P(e);
|
|
281
|
+
return /* @__PURE__ */ C("div", {
|
|
262
282
|
style: l,
|
|
263
|
-
className: i("w-full",
|
|
264
|
-
children: /* @__PURE__ */
|
|
283
|
+
className: i("w-full", F.panel, r),
|
|
284
|
+
children: /* @__PURE__ */ C("ul", {
|
|
265
285
|
role: "list",
|
|
266
286
|
className: "flex w-full flex-col gap-0.5 ps-5",
|
|
267
|
-
children: d.map((e) => e.
|
|
287
|
+
children: d.map((e) => e.stage ? /* @__PURE__ */ C("li", {
|
|
268
288
|
role: "listitem",
|
|
269
|
-
children: /* @__PURE__ */
|
|
289
|
+
children: /* @__PURE__ */ C(z, {
|
|
270
290
|
stage: e.stage,
|
|
271
291
|
isLive: u?.index === e.stage.index,
|
|
272
292
|
typography: c,
|
|
273
293
|
labels: o
|
|
274
294
|
})
|
|
275
|
-
}, e.key) : /* @__PURE__ */
|
|
295
|
+
}, e.key) : /* @__PURE__ */ C("li", {
|
|
276
296
|
role: "listitem",
|
|
277
|
-
children: /* @__PURE__ */
|
|
297
|
+
children: /* @__PURE__ */ C(B, {
|
|
278
298
|
row: e,
|
|
279
|
-
isLive: u?.index === e.attempts[e.attempts.length - 1].index,
|
|
299
|
+
isLive: u?.index === e.attempts?.[e.attempts.length - 1].index,
|
|
280
300
|
typography: c,
|
|
281
301
|
labels: o
|
|
282
302
|
})
|
|
283
303
|
}, e.key))
|
|
284
304
|
})
|
|
285
305
|
});
|
|
286
|
-
},
|
|
287
|
-
toggleButton: "
|
|
288
|
-
executedLabel: "
|
|
289
|
-
stepsCount: "
|
|
290
|
-
doneIcon: "
|
|
291
|
-
failedText: "
|
|
292
|
-
liveName: "
|
|
293
|
-
},
|
|
294
|
-
let { executedLabel:
|
|
295
|
-
|
|
296
|
-
|
|
306
|
+
}, H = {
|
|
307
|
+
toggleButton: "_toggleButton_1sa5v_1",
|
|
308
|
+
executedLabel: "_executedLabel_1sa5v_13",
|
|
309
|
+
stepsCount: "_stepsCount_1sa5v_17",
|
|
310
|
+
doneIcon: "_doneIcon_1sa5v_22",
|
|
311
|
+
failedText: "_failedText_1sa5v_26",
|
|
312
|
+
liveName: "_liveName_1sa5v_30"
|
|
313
|
+
}, U = ({ stages: e, isStreaming: r, labels: s, className: l, styles: f }) => {
|
|
314
|
+
let { executedLabel: g = "Executed", stepsLabel: _ = () => "steps", failedCountLabel: v = (e) => `${e} failed`, runningStepLabel: S = (e, t) => `Step ${e} of ${t}`, runningAriaLabel: T = "Running", copyAriaLabel: E, failedAriaLabel: D, attemptLabel: k } = s ?? {}, [P, F] = x(r), I = b(r);
|
|
315
|
+
y(() => {
|
|
316
|
+
I.current && !r && F(!1), I.current = r;
|
|
297
317
|
}, [r]);
|
|
298
|
-
let { colors:
|
|
299
|
-
"--cs-cg-label":
|
|
300
|
-
"--cs-cg-label-hover":
|
|
301
|
-
"--cs-cg-steps-count":
|
|
302
|
-
"--cs-cg-done":
|
|
303
|
-
"--cs-cg-failed":
|
|
318
|
+
let { colors: L, panel: R } = f ?? {}, z = f?.typography ?? { fontClassName: "dial-small-text" }, B = n({
|
|
319
|
+
"--cs-cg-label": L?.labelColor,
|
|
320
|
+
"--cs-cg-label-hover": L?.labelHoverColor,
|
|
321
|
+
"--cs-cg-steps-count": L?.stepsCountColor,
|
|
322
|
+
"--cs-cg-done": L?.doneColor,
|
|
323
|
+
"--cs-cg-failed": L?.failedColor,
|
|
324
|
+
"--cs-text": R?.text,
|
|
325
|
+
"--cs-row-hover": R?.rowHoverColor,
|
|
326
|
+
"--cs-button-bg": R?.collapsedButtonBg,
|
|
327
|
+
"--cs-stage-text": R?.stageTextColor,
|
|
328
|
+
"--cs-failed-text": R?.failedColor,
|
|
329
|
+
"--cs-tag-text": R?.tagTextColor,
|
|
330
|
+
"--cs-count-text": R?.countTextColor,
|
|
331
|
+
"--cs-duration-text": R?.durationTextColor,
|
|
332
|
+
"--cs-icon-secondary": R?.iconSecondaryColor,
|
|
333
|
+
"--cs-icon-completed": R?.iconCompletedColor,
|
|
334
|
+
"--cs-icon-error": R?.iconErrorColor,
|
|
335
|
+
"--cs-code-bg": R?.codeBg,
|
|
336
|
+
"--cs-code-border": R?.codeBorderColor,
|
|
337
|
+
"--cs-code-text": R?.codeTextColor,
|
|
338
|
+
"--cs-border": R?.borderColor
|
|
304
339
|
});
|
|
305
340
|
if (e.length === 0) return null;
|
|
306
|
-
let
|
|
307
|
-
copyAriaLabel:
|
|
308
|
-
runningAriaLabel:
|
|
309
|
-
failedAriaLabel:
|
|
310
|
-
attemptLabel:
|
|
341
|
+
let U = {
|
|
342
|
+
copyAriaLabel: E,
|
|
343
|
+
runningAriaLabel: T,
|
|
344
|
+
failedAriaLabel: D,
|
|
345
|
+
attemptLabel: k
|
|
311
346
|
};
|
|
312
|
-
if (e.length === 1) return /* @__PURE__ */
|
|
347
|
+
if (e.length === 1) return /* @__PURE__ */ C(V, {
|
|
313
348
|
stages: e,
|
|
314
349
|
isStreaming: r,
|
|
315
|
-
className:
|
|
316
|
-
styles: {
|
|
317
|
-
|
|
350
|
+
className: l,
|
|
351
|
+
styles: {
|
|
352
|
+
colors: R,
|
|
353
|
+
typography: f?.typography
|
|
354
|
+
},
|
|
355
|
+
labels: U
|
|
318
356
|
});
|
|
319
|
-
let
|
|
320
|
-
let { durationLabel: n } =
|
|
321
|
-
return e + (
|
|
322
|
-
}, 0),
|
|
357
|
+
let W = e.some((e) => e.status === t.Failed), G = e.reduce((e, t) => {
|
|
358
|
+
let { durationLabel: n } = O(t.name);
|
|
359
|
+
return e + (j(n) ?? 0);
|
|
360
|
+
}, 0), K = G > 0 ? A(G) : void 0, q = r ? M(e) : void 0, J;
|
|
323
361
|
if (r) {
|
|
324
|
-
let t =
|
|
325
|
-
|
|
362
|
+
let t = q ? N(e, q) : e.length, n = q ? O(q.name).name : "";
|
|
363
|
+
J = /* @__PURE__ */ w("span", {
|
|
326
364
|
role: "status",
|
|
327
365
|
"aria-live": "polite",
|
|
328
|
-
className: "
|
|
366
|
+
className: "flex min-w-0 items-center gap-2",
|
|
329
367
|
children: [
|
|
330
|
-
/* @__PURE__ */
|
|
331
|
-
|
|
332
|
-
|
|
368
|
+
/* @__PURE__ */ C("span", {
|
|
369
|
+
className: "flex flex-none items-center",
|
|
370
|
+
children: /* @__PURE__ */ C(d, {
|
|
371
|
+
size: 14,
|
|
372
|
+
ariaLabel: T
|
|
373
|
+
})
|
|
333
374
|
}),
|
|
334
|
-
/* @__PURE__ */
|
|
335
|
-
className: i(
|
|
336
|
-
children:
|
|
375
|
+
/* @__PURE__ */ C("span", {
|
|
376
|
+
className: i("flex-none whitespace-nowrap", z.fontClassName, H.liveName),
|
|
377
|
+
children: S(t, e.length)
|
|
337
378
|
}),
|
|
338
|
-
n && /* @__PURE__ */
|
|
339
|
-
className: i(
|
|
340
|
-
children: n
|
|
379
|
+
n && /* @__PURE__ */ C("span", {
|
|
380
|
+
className: i("min-w-0 max-w-[22rem] truncate", z.fontClassName, H.executedLabel),
|
|
381
|
+
children: /* @__PURE__ */ C(c, { text: n })
|
|
341
382
|
})
|
|
342
383
|
]
|
|
343
384
|
});
|
|
344
|
-
} else if (
|
|
385
|
+
} else if (W) {
|
|
345
386
|
let n = e.filter((e) => e.status === t.Failed).length;
|
|
346
|
-
|
|
387
|
+
J = /* @__PURE__ */ w("span", {
|
|
347
388
|
className: "inline-flex items-center gap-1",
|
|
348
389
|
children: [
|
|
349
|
-
/* @__PURE__ */
|
|
350
|
-
className: i(
|
|
390
|
+
/* @__PURE__ */ w("span", {
|
|
391
|
+
className: i(z.fontClassName, H.executedLabel),
|
|
351
392
|
children: [
|
|
352
|
-
|
|
393
|
+
g,
|
|
353
394
|
" ",
|
|
354
395
|
e.length,
|
|
355
396
|
" ",
|
|
356
|
-
|
|
397
|
+
_(e.length)
|
|
357
398
|
]
|
|
358
399
|
}),
|
|
359
|
-
/* @__PURE__ */
|
|
360
|
-
className: i(
|
|
361
|
-
children:
|
|
400
|
+
/* @__PURE__ */ C("span", {
|
|
401
|
+
className: i(z.fontClassName, H.failedText),
|
|
402
|
+
children: v(n)
|
|
362
403
|
}),
|
|
363
|
-
|
|
364
|
-
className: i(
|
|
365
|
-
children:
|
|
404
|
+
K && /* @__PURE__ */ C("span", {
|
|
405
|
+
className: i(z.fontClassName, H.stepsCount),
|
|
406
|
+
children: K
|
|
366
407
|
})
|
|
367
408
|
]
|
|
368
409
|
});
|
|
369
|
-
} else
|
|
410
|
+
} else J = /* @__PURE__ */ w("span", {
|
|
370
411
|
className: "inline-flex items-center gap-1",
|
|
371
412
|
children: [
|
|
372
|
-
/* @__PURE__ */
|
|
413
|
+
/* @__PURE__ */ C(p, {
|
|
373
414
|
size: a.SM,
|
|
374
|
-
className:
|
|
375
|
-
"aria-hidden": !0
|
|
415
|
+
className: H.doneIcon,
|
|
416
|
+
"aria-hidden": !0,
|
|
417
|
+
stroke: o
|
|
376
418
|
}),
|
|
377
|
-
/* @__PURE__ */
|
|
378
|
-
className: i(
|
|
419
|
+
/* @__PURE__ */ w("span", {
|
|
420
|
+
className: i(z.fontClassName, H.executedLabel),
|
|
379
421
|
children: [
|
|
380
|
-
|
|
422
|
+
g,
|
|
381
423
|
" ",
|
|
382
424
|
e.length,
|
|
383
425
|
" ",
|
|
384
|
-
|
|
426
|
+
_(e.length)
|
|
385
427
|
]
|
|
386
428
|
}),
|
|
387
|
-
|
|
388
|
-
className: i(
|
|
389
|
-
children:
|
|
429
|
+
K && /* @__PURE__ */ C("span", {
|
|
430
|
+
className: i(z.fontClassName, H.stepsCount),
|
|
431
|
+
children: K
|
|
390
432
|
})
|
|
391
433
|
]
|
|
392
434
|
});
|
|
393
|
-
return /* @__PURE__ */
|
|
394
|
-
style:
|
|
395
|
-
className: i("flex w-full flex-col gap-1",
|
|
396
|
-
children: [/* @__PURE__ */
|
|
397
|
-
className:
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
435
|
+
return /* @__PURE__ */ w("div", {
|
|
436
|
+
style: B,
|
|
437
|
+
className: i("flex w-full flex-col gap-1", l),
|
|
438
|
+
children: [/* @__PURE__ */ C(u, {
|
|
439
|
+
className: H.toggleButton,
|
|
440
|
+
textClassName: "min-w-0",
|
|
441
|
+
onClick: () => F((e) => !e),
|
|
442
|
+
"aria-expanded": P,
|
|
443
|
+
iconAfter: P ? /* @__PURE__ */ C(m, {
|
|
401
444
|
size: 12,
|
|
402
|
-
"aria-hidden": !0
|
|
403
|
-
|
|
445
|
+
"aria-hidden": !0,
|
|
446
|
+
stroke: o
|
|
447
|
+
}) : /* @__PURE__ */ C(h, {
|
|
404
448
|
size: 12,
|
|
405
449
|
className: "rtl:scale-x-[-1]",
|
|
406
|
-
"aria-hidden": !0
|
|
450
|
+
"aria-hidden": !0,
|
|
451
|
+
stroke: o
|
|
407
452
|
}),
|
|
408
|
-
label:
|
|
409
|
-
}), /* @__PURE__ */
|
|
410
|
-
className: i("grid transition-[grid-template-rows] duration-300 ease-in-out",
|
|
411
|
-
children: /* @__PURE__ */
|
|
453
|
+
label: J
|
|
454
|
+
}), /* @__PURE__ */ C("div", {
|
|
455
|
+
className: i("grid transition-[grid-template-rows] duration-300 ease-in-out", P ? "grid-rows-[1fr]" : "grid-rows-[0fr]"),
|
|
456
|
+
children: /* @__PURE__ */ C("div", {
|
|
412
457
|
className: "overflow-hidden",
|
|
413
|
-
children: /* @__PURE__ */
|
|
458
|
+
children: /* @__PURE__ */ C(V, {
|
|
414
459
|
stages: e,
|
|
415
460
|
isStreaming: r,
|
|
416
|
-
styles: {
|
|
417
|
-
|
|
461
|
+
styles: {
|
|
462
|
+
colors: R,
|
|
463
|
+
typography: f?.typography
|
|
464
|
+
},
|
|
465
|
+
labels: U,
|
|
418
466
|
className: "pt-1"
|
|
419
467
|
})
|
|
420
468
|
})
|
|
@@ -422,4 +470,4 @@ var w = /[([][^()[\]]*[)\]]/g, T = /(\d+(?:\.\d+)?)\s*s\b/, E = /:\s*$/, D = (e)
|
|
|
422
470
|
});
|
|
423
471
|
};
|
|
424
472
|
//#endregion
|
|
425
|
-
export {
|
|
473
|
+
export { U as CollapsedGroup, V as StagesPanel };
|
|
@@ -1,40 +1,41 @@
|
|
|
1
1
|
import { Stage } from '@epam/ai-dial-chat-shared';
|
|
2
|
+
import { StagesPanelColors } from './stages-props';
|
|
2
3
|
/** Color overrides for the `CollapsedGroup` component applied as CSS custom properties. */
|
|
3
4
|
export interface CollapsedGroupColors {
|
|
4
|
-
/** Color of the toggle button label and icon.
|
|
5
|
+
/** Color of the toggle button label and icon. */
|
|
5
6
|
labelColor?: string;
|
|
6
|
-
/** Color of the toggle button label and icon on hover.
|
|
7
|
+
/** Color of the toggle button label and icon on hover. */
|
|
7
8
|
labelHoverColor?: string;
|
|
8
|
-
/** Color of the execution time.
|
|
9
|
+
/** Color of the execution time. */
|
|
9
10
|
stepsCountColor?: string;
|
|
10
|
-
/** Color of the leading check icon in the finished-and-successful summary.
|
|
11
|
+
/** Color of the leading check icon in the finished-and-successful summary. */
|
|
11
12
|
doneColor?: string;
|
|
12
|
-
/** Color of the "N failed" text in the failed summary.
|
|
13
|
+
/** Color of the "N failed" text in the failed summary. */
|
|
13
14
|
failedColor?: string;
|
|
14
15
|
}
|
|
15
16
|
/** Typography configuration for the toggle button label text. */
|
|
16
17
|
export interface CollapsedGroupTypography {
|
|
17
|
-
/** CSS utility class applied to the toggle button label. Defaults to `'dial-small-text'
|
|
18
|
+
/** CSS utility class applied to the toggle button label. Defaults to `'dial-small-text'`. */
|
|
18
19
|
fontClassName?: string;
|
|
19
|
-
/** Font family applied to the panel root via CSS custom property. */
|
|
20
|
-
fontFamily?: string;
|
|
21
20
|
}
|
|
22
21
|
/** Combined style overrides (colors and typography) for the `CollapsedGroup` component. */
|
|
23
22
|
export interface CollapsedGroupStyles {
|
|
24
23
|
/** Color overrides applied as CSS custom properties. */
|
|
25
24
|
colors?: CollapsedGroupColors;
|
|
26
|
-
/** Typography for the toggle button label.
|
|
25
|
+
/** Typography for the toggle button label. */
|
|
27
26
|
typography?: CollapsedGroupTypography;
|
|
27
|
+
/** Color overrides forwarded to the inner `StagesPanel`. */
|
|
28
|
+
panel?: StagesPanelColors;
|
|
28
29
|
}
|
|
29
30
|
/** User-visible strings for the `CollapsedGroup` component. */
|
|
30
31
|
export interface CollapsedGroupLabels {
|
|
31
32
|
/** Label shown before the steps count on the toggle button. Defaults to `'Executed'`. */
|
|
32
33
|
executedLabel?: string;
|
|
33
|
-
/** Returns the pluralized
|
|
34
|
+
/** Returns the pluralized steps label. Defaults to `() => 'steps'`. */
|
|
34
35
|
stepsLabel?: (count: number) => string;
|
|
35
|
-
/** Returns the "N failed"
|
|
36
|
+
/** Returns the "N failed" text in the failed summary. Defaults to `(n) => \`${n} failed\``. */
|
|
36
37
|
failedCountLabel?: (failedCount: number) => string;
|
|
37
|
-
/** Returns the "Step X of Y"
|
|
38
|
+
/** Returns the "Step X of Y" text in the running summary. Defaults to `(current, total) => \`Step ${current} of ${total}\``. */
|
|
38
39
|
runningStepLabel?: (current: number, total: number) => string;
|
|
39
40
|
/** Accessible label announced for the running summary's spinner. Defaults to `'Running'`. */
|
|
40
41
|
runningAriaLabel?: string;
|
|
@@ -49,11 +50,7 @@ export interface CollapsedGroupLabels {
|
|
|
49
50
|
export interface CollapsedGroupProps {
|
|
50
51
|
/** Ordered list of stages to display. */
|
|
51
52
|
stages: Stage[];
|
|
52
|
-
/**
|
|
53
|
-
* Whether the run is still streaming. Drives the summary line's state
|
|
54
|
-
* (running vs. finished vs. failed) and its default open/closed state —
|
|
55
|
-
* expanded while running, collapsed once finished.
|
|
56
|
-
*/
|
|
53
|
+
/** When true, expands to a live progress line; collapses to a summary once streaming ends. */
|
|
57
54
|
isStreaming: boolean;
|
|
58
55
|
/** User-visible strings for the toggle button. */
|
|
59
56
|
labels?: CollapsedGroupLabels;
|
|
@@ -1 +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;
|
|
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;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,6FAA6F;IAC7F,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"}
|
|
@@ -1,21 +1,13 @@
|
|
|
1
1
|
import { Stage } from '@epam/ai-dial-chat-shared';
|
|
2
|
-
/** A
|
|
3
|
-
export interface
|
|
4
|
-
kind: 'single';
|
|
5
|
-
/** Stable key for list rendering — the stage's own index. */
|
|
6
|
-
key: number;
|
|
7
|
-
stage: Stage;
|
|
8
|
-
}
|
|
9
|
-
/** A row formed by collapsing consecutive stages that share the same cleaned name into one `×N` row. */
|
|
10
|
-
export interface GroupedStageRow {
|
|
11
|
-
kind: 'group';
|
|
2
|
+
/** A row rendered inside a `StagesPanel` — either one stage or a collapsed `×N` group of identical attempts. */
|
|
3
|
+
export interface StageRow {
|
|
12
4
|
/** Stable key for list rendering — the first attempt's index. */
|
|
13
5
|
key: number;
|
|
14
6
|
/** Shared cleaned display name for the group. */
|
|
15
|
-
name
|
|
7
|
+
name?: string;
|
|
8
|
+
/** The single stage for this row (present only when there is one attempt). */
|
|
9
|
+
stage?: Stage;
|
|
16
10
|
/** Individual attempts in original order. */
|
|
17
|
-
attempts
|
|
11
|
+
attempts?: Stage[];
|
|
18
12
|
}
|
|
19
|
-
/** A row rendered inside a `StagesPanel` — either one stage or a collapsed `×N` group of identical attempts. */
|
|
20
|
-
export type StageRow = SingleStageRow | GroupedStageRow;
|
|
21
13
|
//# sourceMappingURL=stage-grouping.d.ts.map
|
|
@@ -1 +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,
|
|
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,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
CHANGED
|
@@ -1,49 +1,61 @@
|
|
|
1
1
|
import { Stage } from '@epam/ai-dial-chat-shared';
|
|
2
|
-
/**
|
|
3
|
-
* Typography configuration for a stage row. The name is always the
|
|
4
|
-
* dominant text in the row — bigger than the expanded content — so
|
|
5
|
-
* `fontClassName` (name) and `contentClassName` (expanded markdown content)
|
|
6
|
-
* are deliberately separate fields, not one shared class.
|
|
7
|
-
*/
|
|
2
|
+
/** Typography class overrides for stage name and expanded content elements in `StagesPanel`. */
|
|
8
3
|
export interface StageTypography {
|
|
9
|
-
/** CSS utility class applied to the stage/step name. Defaults to `'dial-small-text'
|
|
4
|
+
/** CSS utility class applied to the stage/step name. Defaults to `'dial-small-text'`. */
|
|
10
5
|
fontClassName?: string;
|
|
11
|
-
/** CSS utility class applied to expanded
|
|
6
|
+
/** CSS utility class applied to expanded content text elements (paragraphs, lists, blockquotes, links, table cells). Defaults to `'dial-tiny-text'`. */
|
|
12
7
|
contentClassName?: string;
|
|
13
|
-
/** CSS utility class applied to `<strong>` (bold markdown) inside expanded content.
|
|
8
|
+
/** CSS utility class applied to `<strong>` (bold markdown) inside expanded content. Falls back to `contentClassName`, then `'dial-tiny-text'`. */
|
|
14
9
|
strongClassName?: string;
|
|
15
|
-
/** CSS utility class applied to every heading level (`h1`–`h6`) inside expanded content. Defaults to `'dial-small-semi-text'
|
|
10
|
+
/** CSS utility class applied to every heading level (`h1`–`h6`) inside expanded content. Defaults to `'dial-small-semi-text'`. */
|
|
16
11
|
headingClassName?: string;
|
|
17
|
-
/** CSS utility class applied to inline code elements. Defaults to `'
|
|
12
|
+
/** CSS utility class applied to inline code elements. Defaults to `'dial-code-text rounded-md'`. */
|
|
18
13
|
codeClassName?: string;
|
|
19
|
-
/**
|
|
20
|
-
|
|
14
|
+
/** CSS utility class applied to fenced code blocks (`<pre>`). Defaults to `'dial-code-text'`. */
|
|
15
|
+
codeBlockClassName?: string;
|
|
21
16
|
/** CSS utility class applied to count badges (e.g. `×N` collapsed group). Defaults to `'dial-tiny-text'`. */
|
|
22
17
|
countFontClassName?: string;
|
|
18
|
+
/** CSS utility class applied to a stage's tag label. Defaults to `'dial-tiny-lead-text'`, which uppercases the label itself. */
|
|
19
|
+
tagClassName?: string;
|
|
23
20
|
}
|
|
24
|
-
/**
|
|
25
|
-
* Color overrides for the `StagesPanel` component applied as CSS custom
|
|
26
|
-
* properties. The panel is an inline list (no card/border), so these only
|
|
27
|
-
* cover the row-level surface: per-row hover tint and text tones.
|
|
28
|
-
*/
|
|
21
|
+
/** CSS custom property color overrides for the `StagesPanel` component. */
|
|
29
22
|
export interface StagesPanelColors {
|
|
30
|
-
/** General text color. */
|
|
23
|
+
/** General text color. Defaults to `--text-primary`. */
|
|
31
24
|
text?: string;
|
|
32
|
-
/** Background tint on row hover. Defaults to `--bg-layer-
|
|
25
|
+
/** Background tint on row hover. Defaults to `--bg-layer-sunken`. */
|
|
33
26
|
rowHoverColor?: string;
|
|
34
|
-
/**
|
|
35
|
-
* Text color applied to each stage name row.
|
|
36
|
-
* Defaults to the app's `--text-secondary` theme variable (`#9fa6bd`).
|
|
37
|
-
*/
|
|
27
|
+
/** Text color of each stage name. Defaults to `--text-secondary`. */
|
|
38
28
|
stageTextColor?: string;
|
|
39
|
-
/**
|
|
29
|
+
/** Text and icon color for a failed stage. Defaults to `--text-warning`. */
|
|
40
30
|
failedColor?: string;
|
|
31
|
+
/** Background color of the collapse button. Defaults to transparent. */
|
|
32
|
+
collapsedButtonBg?: string;
|
|
33
|
+
/** Text color of stage tag labels. Defaults to `--text-tertiary`. */
|
|
34
|
+
tagTextColor?: string;
|
|
35
|
+
/** Text color of the attempt count badge (e.g. `×N`). Defaults to `--text-tertiary`. */
|
|
36
|
+
countTextColor?: string;
|
|
37
|
+
/** Text color of the total-duration label. Defaults to `--text-tertiary`. */
|
|
38
|
+
durationTextColor?: string;
|
|
39
|
+
/** Color of secondary (non-status) icons. Defaults to `--text-secondary` at 70% opacity. */
|
|
40
|
+
iconSecondaryColor?: string;
|
|
41
|
+
/** Color of the completed-check icon. Defaults to `--text-tertiary`. */
|
|
42
|
+
iconCompletedColor?: string;
|
|
43
|
+
/** Color of the error/exception icon. Defaults to `--text-warning`. */
|
|
44
|
+
iconErrorColor?: string;
|
|
45
|
+
/** Background color of fenced code blocks and inline code. Defaults to `--bg-layer-raised`. */
|
|
46
|
+
codeBg?: string;
|
|
47
|
+
/** Border color of fenced code blocks and inline code. Defaults to `--stroke-secondary`. */
|
|
48
|
+
codeBorderColor?: string;
|
|
49
|
+
/** Text color inside code blocks. Defaults to `--text-primary`. */
|
|
50
|
+
codeTextColor?: string;
|
|
51
|
+
/** Border color used for table cells and blockquotes. Defaults to `--stroke-secondary`. */
|
|
52
|
+
borderColor?: string;
|
|
41
53
|
}
|
|
42
54
|
/** Combined style overrides (colors and typography) for the `StagesPanel` component. */
|
|
43
55
|
export interface StagesPanelStyles {
|
|
44
56
|
/** Color overrides applied as CSS custom properties. */
|
|
45
57
|
colors?: StagesPanelColors;
|
|
46
|
-
/** Typography applied to the stage name and expanded content.
|
|
58
|
+
/** Typography applied to the stage name and expanded content. */
|
|
47
59
|
typography?: StageTypography;
|
|
48
60
|
}
|
|
49
61
|
/** User-visible strings for the `StagesPanel` component. */
|
|
@@ -54,7 +66,7 @@ export interface StagesPanelLabels {
|
|
|
54
66
|
runningAriaLabel?: string;
|
|
55
67
|
/** Visually-hidden label announced alongside a failed stage's icon. Defaults to `'Failed'`. */
|
|
56
68
|
failedAriaLabel?: string;
|
|
57
|
-
/**
|
|
69
|
+
/** Label for a single attempt given its 1-based number. Defaults to `(n) => \`Attempt ${n}\``. */
|
|
58
70
|
attemptLabel?: (attemptNumber: number) => string;
|
|
59
71
|
}
|
|
60
72
|
/** Props accepted by the `StagesPanel` component. */
|
|
@@ -1 +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
|
|
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,gGAAgG;AAChG,MAAM,WAAW,eAAe;IAC9B,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,wJAAwJ;IACxJ,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,kJAAkJ;IAClJ,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kIAAkI;IAClI,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,oGAAoG;IACpG,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iGAAiG;IACjG,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,6GAA6G;IAC7G,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gIAAgI;IAChI,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,2EAA2E;AAC3E,MAAM,WAAW,iBAAiB;IAChC,wDAAwD;IACxD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,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,+FAA+F;IAC/F,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
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epam/ai-dial-conversation-stages",
|
|
3
3
|
"description": "Panel for displaying agent processing stages during LLM response streaming",
|
|
4
|
-
"version": "1.1.0-dev.
|
|
4
|
+
"version": "1.1.0-dev.307",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "./index.js",
|
|
@@ -19,8 +19,8 @@
|
|
|
19
19
|
"peerDependencies": {
|
|
20
20
|
"react": "^19.0.0",
|
|
21
21
|
"@tabler/icons-react": "^3.0.0",
|
|
22
|
-
"@epam/ai-dial-chat-shared": "1.1.0-dev.
|
|
23
|
-
"@epam/ai-dial-ui-kit": "0.
|
|
22
|
+
"@epam/ai-dial-chat-shared": "1.1.0-dev.307",
|
|
23
|
+
"@epam/ai-dial-ui-kit": "^0.14.0-dev.15"
|
|
24
24
|
},
|
|
25
25
|
"repository": {
|
|
26
26
|
"type": "git",
|
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import { Stage } from '@epam/ai-dial-chat-shared';
|
|
2
2
|
import { StageRow } from '../models/stage-grouping';
|
|
3
|
-
/**
|
|
4
|
-
* Collapses consecutive stages that share the same cleaned name into a
|
|
5
|
-
* single `×N` group row (expanding to the individual attempts); every other
|
|
6
|
-
* stage renders as its own row. Grouping is by cleaned name, not the raw
|
|
7
|
-
* backend string, so a name differing only by its embedded duration still
|
|
8
|
-
* groups correctly.
|
|
9
|
-
*/
|
|
3
|
+
/** Groups consecutive stages with the same cleaned name into a `×N` group row; all others render as single rows. */
|
|
10
4
|
export declare const groupStagesByName: (stages: Stage[]) => StageRow[];
|
|
11
5
|
//# sourceMappingURL=stage-grouping.d.ts.map
|
|
@@ -1 +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
|
|
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,oHAAoH;AACpH,eAAO,MAAM,iBAAiB,GAAI,QAAQ,KAAK,EAAE,KAAG,QAAQ,EA+B3D,CAAC"}
|
package/utils/stage-name.d.ts
CHANGED
|
@@ -1,26 +1,17 @@
|
|
|
1
1
|
/** Result of cleaning a raw backend stage name for display. */
|
|
2
|
-
|
|
3
|
-
/** Display name with any duration/timestamp group and trailing colon removed.
|
|
2
|
+
interface CleanedStageName {
|
|
3
|
+
/** Display name with any duration/timestamp bracket group and trailing colon removed. */
|
|
4
4
|
name: string;
|
|
5
5
|
/** Extracted duration label (e.g. `'3.99s'`), or `undefined` if the raw name carried none. */
|
|
6
6
|
durationLabel?: string;
|
|
7
7
|
}
|
|
8
|
-
/**
|
|
9
|
-
* Cleans a raw backend stage name for display: extracts an embedded
|
|
10
|
-
* duration (discarding any accompanying timestamps, which have no
|
|
11
|
-
* structured home in the UI today) and strips a single trailing colon.
|
|
12
|
-
* Never re-cases or rewrites the remaining text.
|
|
13
|
-
*/
|
|
8
|
+
/** Strips an embedded duration bracket group (e.g. `(7.18s, ...)`) and a trailing colon from a raw backend stage name. */
|
|
14
9
|
export declare const cleanStageName: (rawName: string) => CleanedStageName;
|
|
15
|
-
/**
|
|
16
|
-
* Heuristic for "this cleaned name is a raw identifier, not prose":
|
|
17
|
-
* no whitespace and at least one underscore (e.g. `My_OMDB_Agent__0_0_1_tool`).
|
|
18
|
-
* Prose with an embedded identifier substring (e.g. `Call My_OMDB_Agent_tool`)
|
|
19
|
-
* still contains a space and is left as normal text.
|
|
20
|
-
*/
|
|
10
|
+
/** Returns true if the name looks like a raw identifier: no whitespace and contains an underscore. */
|
|
21
11
|
export declare const isIdentifierLike: (name: string) => boolean;
|
|
22
12
|
/** Formats a total duration in seconds as `'Xm Ys'` when >= 60s, otherwise `'X.Xs'`. */
|
|
23
13
|
export declare const formatTotalDuration: (totalSeconds: number) => string;
|
|
24
14
|
/** Parses a duration label produced by {@link cleanStageName} (e.g. `'3.99s'`) back into seconds. */
|
|
25
15
|
export declare const parseDurationSeconds: (durationLabel: string | undefined) => number | undefined;
|
|
16
|
+
export {};
|
|
26
17
|
//# sourceMappingURL=stage-name.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stage-name.d.ts","sourceRoot":"","sources":["../../src/utils/stage-name.ts"],"names":[],"mappings":"AAeA,+DAA+D;AAC/D,
|
|
1
|
+
{"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"}
|
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
import { Stage } from '@epam/ai-dial-chat-shared';
|
|
2
|
-
/**
|
|
3
|
-
* Finds the currently-executing stage while a run is streaming: the last
|
|
4
|
-
* entry with `status: null`. Returns `undefined` once every stage has
|
|
5
|
-
* settled (or the list is empty), even if the caller still reports
|
|
6
|
-
* `isStreaming: true` — a transitional state between the last stage settling
|
|
7
|
-
* and the stream closing.
|
|
8
|
-
*/
|
|
2
|
+
/** Returns the last stage with `status: null` (the currently executing stage), or `undefined` if none exists. */
|
|
9
3
|
export declare const findLiveStage: (stages: Stage[]) => Stage | undefined;
|
|
10
4
|
/** 1-based position of `stage` within `stages`, by its stable `index` field. */
|
|
11
5
|
export declare const stagePosition: (stages: Stage[], stage: Stage) => number;
|
|
@@ -1 +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
|
|
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,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"}
|