@vitest-agent/ui 2.5.3 → 4.0.0

package/render-agent.js

@@ -1,6 +1,18 @@
-import { formatDisplayDuration } from "./format-duration.js";
+import { formatTotalsLine } from "./counts.js";
+import { formatFailure as formatFailure$1 } from "./dispatcher/helpers.js";
+import { Fmt } from "@effected/cli";
 
 //#region src/render-agent.ts
+/**
+* Agent-mode renderer: produces a token-efficient final-frame string
+* from a fully-reduced `RenderState`.
+*
+* Output is intentionally separate from the Ink renderer — agents
+* benefit from a different layout than humans (no ANSI, no live
+* progress, no decoration overhead). The output is stable for stable
+* inputs: no timestamps, no derived "time ago" phrasing, no randomized
+* ordering.
+*/
 const DEFAULT_WIDTH = 80;
 const DEFAULT_MAX_GAPS = 3;
 const severityLabel = {
@@ -8,18 +20,11 @@ const severityLabel = {
 	warn: "warn",
 	blocker: "blocker"
 };
-const formatHeader = (state) => {
-	const { passCount, failCount, skipCount, timeoutCount, durationMs } = state.totals;
-	const parts = [`${passCount}/${passCount + failCount + skipCount + timeoutCount} passed`];
-	if (failCount > 0) parts.push(`${failCount} failed`);
-	if (timeoutCount > 0) parts.push(`${timeoutCount} timed out`);
-	if (skipCount > 0) parts.push(`${skipCount} skipped`);
-	if (state.unhandledErrors.length > 0) {
-		const noun = state.unhandledErrors.length === 1 ? "unhandled error" : "unhandled errors";
-		parts.push(`${state.unhandledErrors.length} ${noun}`);
-	}
-	return `Tests: ${parts.join(", ")} (${formatDisplayDuration(durationMs)})`;
-};
+const formatHeader = (state) => formatTotalsLine({
+	label: "Tests",
+	...state.totals,
+	unhandledErrors: state.unhandledErrors.length
+});
 const formatModulesSection = (state) => {
 	const modules = state.moduleOrder.map((path) => state.modules[path]).filter((m) => m !== void 0);
 	const { passCount, failCount, skipCount, timeoutCount } = state.totals;
@@ -27,9 +32,9 @@ const formatModulesSection = (state) => {
 	const collected = state.collectedModules ?? modules.length;
 	if (modules.length === 0) {
 		if (collected === 0) return null;
-		return `${collected} ${collected === 1 ? "module" : "modules"} all-passed.`;
+		return `${Fmt.plural(collected, "module")} all-passed.`;
 	}
-	if (modules.filter((m) => m.failCount > 0 || m.skipCount > 0).length === 0) return `${collected} ${collected === 1 ? "module" : "modules"} all-passed.`;
+	if (modules.filter((m) => m.failCount > 0 || m.skipCount > 0).length === 0) return `${Fmt.plural(collected, "module")} all-passed.`;
 	const lines = ["Modules:"];
 	for (const m of modules) {
 		const parts = [];
@@ -41,21 +46,9 @@ const formatModulesSection = (state) => {
 	}
 	return lines.join("\n");
 };
-const truncate = (line, max) => {
-	if (line.length <= max) return line;
-	const slice = max - 1;
-	if (slice <= 0) return "…";
-	return `${line.slice(0, slice)}…`;
-};
+const truncate = (line, max) => Fmt.truncate(line, max);
 const formatFailure = (f, width, includeStack) => {
-	const suite = f.suitePath.length > 0 ? `${f.suitePath.join(" > ")} > ` : "";
-	const classification = f.classification !== null ? ` [${f.classification}]` : "";
-	const lines = [`- ${f.modulePath} > ${suite}${f.testName}${classification}`];
-	if (f.error?.message !== void 0) {
-		const firstLine = f.error.message.split("\n", 1)[0] ?? "";
-		lines.push(`  ${truncate(firstLine, Math.max(20, width - 2))}`);
-	}
-	if (f.error?.diff !== void 0) for (const diffLine of f.error.diff.split("\n")) lines.push(`  ${truncate(diffLine, Math.max(20, width - 2))}`);
+	const lines = [...formatFailure$1(f, width)];
 	if (includeStack && f.error?.stack !== void 0) for (const stackLine of f.error.stack.split("\n")) lines.push(`  ${truncate(stackLine, Math.max(20, width - 2))}`);
 	return lines.join("\n");
 };
@@ -77,10 +70,8 @@ const formatUnhandledErrorsSection = (state, width, includeStack) => {
 	for (const err of state.unhandledErrors) lines.push(formatUnhandledError(err, width, includeStack));
 	return lines.join("\n");
 };
-const formatPercent = (n) => {
-	const rounded = Math.round(n * 10) / 10;
-	return Number.isInteger(rounded) ? `${rounded}%` : `${rounded}%`;
-};
+/** Coverage metrics arrive on istanbul's 0–100 scale. */
+const formatPercent = (n) => Fmt.percent(n, { scale: 100 });
 const formatCoverageSection = (state, maxGaps) => {
 	const cov = state.coverage;
 	if (cov === null) return null;
@@ -108,10 +99,7 @@ const formatCoverageSection = (state, maxGaps) => {
 			lines.push(`- ${g.file}${detail}`);
 		}
 		const omitted = cov.gaps.length - topN.length;
-		if (omitted > 0) {
-			const noun = omitted === 1 ? "gap" : "gaps";
-			lines.push(`- (+${omitted} more ${noun})`);
-		}
+		if (omitted > 0) lines.push(`- (+${Fmt.plural(omitted, "more gap", "more gaps")})`);
 	}
 	return lines.join("\n");
 };

package/render-ink/CountColumns.js

@@ -1,41 +1,42 @@
+import { VitestAgentTokens, inkStyle, statusGlyph, statusInkStyle } from "../theme.js";
 import { Text } from "ink";
+import { useGlyphs } from "@effected/cli/ui";
 import { jsxs } from "react/jsx-runtime";
 
 //#region src/render-ink/CountColumns.tsx
 /**
-* The four-outcome count columns for an aggregate row (a project or a
-* module): pass, fail, skip, timeout. All four always render — a zero
-* is dimmed, never omitted — so the columns line up across rows.
-*/
-/**
 * Fixed width of the duration cell that follows the count columns on an
 * aggregate row — sized for the formatter's widest common output
-* (`999.9ms`). Longer values overflow their row rather than truncate.
+* (`59m 59s`). Longer values overflow their row rather than truncate.
 *
 * @public
 */
 const DURATION_CELL_WIDTH = 7;
-const cell = (count, glyph, color) => /* @__PURE__ */ jsxs(Text, {
-	color: count > 0 ? color : "gray",
-	children: [String(count).padStart(4), glyph]
+const cell = (count, status, glyphs) => /* @__PURE__ */ jsxs(Text, {
+	...count > 0 ? statusInkStyle(status) : inkStyle(VitestAgentTokens.zero),
+	children: [String(count).padStart(4), statusGlyph(status, glyphs)]
 });
 /**
 * Renders four colored count columns (pass ✓, fail ✗, skip ↷, timeout ⧖)
 * for an aggregate row. Counts render right-aligned in fixed 4-digit cells so
 * columns align across rows; counts of 10,000+ overflow their row without
-* truncation. Zeros are dimmed; all four columns always appear.
+* truncation. Zeros are greyed; all four columns always appear. Glyphs and
+* colours come from `VitestAgentStatus` (skip is `muted`).
 *
 * @public
 */
-const CountColumns = ({ passCount, failCount, skipCount, timeoutCount }) => /* @__PURE__ */ jsxs(Text, { children: [
-	cell(passCount, "✓", "green"),
-	"  ",
-	cell(failCount, "✗", "red"),
-	"  ",
-	cell(skipCount, "↷", "yellow"),
-	"  ",
-	cell(timeoutCount, "⧖", "#e09a4e")
-] });
+const CountColumns = ({ passCount, failCount, skipCount, timeoutCount }) => {
+	const glyphs = useGlyphs();
+	return /* @__PURE__ */ jsxs(Text, { children: [
+		cell(passCount, "success", glyphs),
+		"  ",
+		cell(failCount, "failure", glyphs),
+		"  ",
+		cell(skipCount, "skip", glyphs),
+		"  ",
+		cell(timeoutCount, "timeout", glyphs)
+	] });
+};
 
 //#endregion
 export { CountColumns, DURATION_CELL_WIDTH };

package/render-ink/CoverageBlock.js

@@ -1,16 +1,22 @@
+import { inkStyle } from "../theme.js";
 import { Box, Text } from "ink";
+import { Fmt } from "@effected/cli";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/render-ink/CoverageBlock.tsx
+/**
+* Coverage section: per-metric percentage, threshold violations, top-N gaps.
+*/
 const METRIC_ORDER = [
 	"lines",
 	"branches",
 	"functions",
 	"statements"
 ];
-const formatPercent = (n) => {
-	return `${Math.round(n * 10) / 10}%`;
-};
+/** Coverage metrics arrive on istanbul's 0–100 scale. */
+const formatPercent = (n) => Fmt.percent(n, { scale: 100 });
+/** A metric below its threshold is a coverage threshold failure: the kit's `failure` token. */
+const FAILURE = inkStyle("failure");
 /**
 * Renders the coverage section: per-metric percentages, threshold
 * violations, and top-N gap entries sorted by missing line count.
@@ -35,7 +41,7 @@ const CoverageBlock = ({ coverage, maxGaps = 3 }) => {
 				return /* @__PURE__ */ jsxs(Box, { children: [
 					/* @__PURE__ */ jsx(Text, { children: `  ${metric}: ` }),
 					failing ? /* @__PURE__ */ jsx(Text, {
-						color: "red",
+						...FAILURE,
 						children: formatPercent(actual)
 					}) : /* @__PURE__ */ jsx(Text, { children: formatPercent(actual) }),
 					threshold !== void 0 ? /* @__PURE__ */ jsxs(Text, {
@@ -51,10 +57,10 @@ const CoverageBlock = ({ coverage, maxGaps = 3 }) => {
 			coverage.violations.length > 0 ? /* @__PURE__ */ jsxs(Box, {
 				flexDirection: "column",
 				children: [/* @__PURE__ */ jsx(Text, {
-					color: "red",
+					...FAILURE,
 					children: "Violations"
 				}), coverage.violations.map((v) => /* @__PURE__ */ jsx(Text, {
-					color: "red",
+					...FAILURE,
 					children: `  ${v.metric}: ${formatPercent(v.actual)} < ${formatPercent(v.expected)}`
 				}, v.metric))]
 			}) : null,
@@ -68,7 +74,7 @@ const CoverageBlock = ({ coverage, maxGaps = 3 }) => {
 					topGaps.map((g) => /* @__PURE__ */ jsxs(Text, { children: [`  ${g.file}`, g.uncoveredLines !== void 0 ? `: ${g.uncoveredLines}` : ""] }, g.file)),
 					elidedGaps > 0 ? /* @__PURE__ */ jsx(Text, {
 						dimColor: true,
-						children: `  (+${elidedGaps} more ${elidedGaps === 1 ? "gap" : "gaps"})`
+						children: `  (+${Fmt.plural(elidedGaps, "more gap", "more gaps")})`
 					}) : null
 				]
 			}) : null

package/render-ink/FailureSection.js

@@ -1,17 +1,24 @@
+import { inkStyle, statusGlyph, statusInkStyle } from "../theme.js";
 import { Box, Text } from "ink";
+import { useGlyphs } from "@effected/cli/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/render-ink/FailureSection.tsx
+/**
+* Failure list: one block per failed test with classification, message,
+* diff, and optionally stack trace.
+*/
 const FailureRow = ({ failure, includeStack }) => {
 	const suite = failure.suitePath.length > 0 ? `${failure.suitePath.join(" > ")} > ` : "";
 	const classification = failure.classification !== null ? ` [${failure.classification}]` : "";
+	const glyphs = useGlyphs();
 	return /* @__PURE__ */ jsxs(Box, {
 		flexDirection: "column",
 		children: [
 			/* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Text, { children: [
 				/* @__PURE__ */ jsx(Text, {
-					color: "red",
-					children: "✗"
+					...statusInkStyle("failure"),
+					children: statusGlyph("failure", glyphs)
 				}),
 				` ${failure.modulePath} > ${suite}${failure.testName}`,
 				failure.classification !== null ? /* @__PURE__ */ jsx(Text, {
@@ -20,17 +27,17 @@ const FailureRow = ({ failure, includeStack }) => {
 				}) : null
 			] }) }),
 			failure.error?.message !== void 0 ? /* @__PURE__ */ jsx(Text, {
-				color: "red",
+				...inkStyle("failure"),
 				children: `  ${failure.error.message.split("\n", 1)[0] ?? ""}`
 			}) : null,
 			failure.error?.diff !== void 0 ? failure.error.diff.split("\n").map((line, idx) => {
 				const key = `diff-${idx}`;
 				if (line.startsWith("-")) return /* @__PURE__ */ jsx(Text, {
-					color: "red",
+					...inkStyle("failure"),
 					children: `  ${line}`
 				}, key);
 				if (line.startsWith("+")) return /* @__PURE__ */ jsx(Text, {
-					color: "green",
+					...inkStyle("success"),
 					children: `  ${line}`
 				}, key);
 				return /* @__PURE__ */ jsx(Text, { children: `  ${line}` }, key);

package/render-ink/FailuresSection.js

@@ -1,7 +1,18 @@
+import { VitestAgentTokens, inkStyle, statusGlyph, statusInkStyle } from "../theme.js";
 import { Box, Text } from "ink";
+import { useGlyphs } from "@effected/cli/ui";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/render-ink/FailuresSection.tsx
+/**
+* The capped failures block for aggregate-row shapes (workspace,
+* single-project) — the rows there are projects or modules and cannot
+* expand a per-test error inline, so the failures collect here.
+*
+* Each entry: a glyph (⧖ for a timed-out failure, ✗ otherwise), the
+* `module › suite › test` path, the classification tag when known, and
+* one indented line — the first line of the error message.
+*/
 const pathOf = (f) => {
 	return [
 		f.modulePath,
@@ -9,6 +20,7 @@ const pathOf = (f) => {
 		f.testName
 	].join(" › ");
 };
+const failureStatus = (f) => f.timedOut === true ? "timeout" : "failure";
 const firstLine = (message) => message.split("\n", 1)[0] ?? "";
 const FAILURE_VALUE_LIMIT = 200;
 /**
@@ -20,6 +32,7 @@ const FAILURE_VALUE_LIMIT = 200;
 const FailuresSection = ({ failures, limit }) => {
 	const shown = failures.slice(0, limit);
 	const overflow = failures.length - shown.length;
+	const glyphs = useGlyphs();
 	return /* @__PURE__ */ jsxs(Box, {
 		flexDirection: "column",
 		children: [
@@ -37,13 +50,13 @@ const FailuresSection = ({ failures, limit }) => {
 					/* @__PURE__ */ jsxs(Text, { children: [
 						"  ",
 						/* @__PURE__ */ jsx(Text, {
-							color: f.timedOut === true ? "#e09a4e" : "red",
-							children: f.timedOut === true ? "⧖" : "✗"
+							...statusInkStyle(failureStatus(f)),
+							children: statusGlyph(failureStatus(f), glyphs)
 						}),
 						" ",
 						pathOf(f),
 						f.classification !== null ? /* @__PURE__ */ jsxs(Text, {
-							color: "#c98ae0",
+							...inkStyle(VitestAgentTokens.classification),
 							children: [
 								" [",
 								f.classification,

package/render-ink/ProjectRow.js

@@ -1,3 +1,4 @@
+import { statusInkStyle } from "../theme.js";
 import { formatDisplayDuration } from "../format-duration.js";
 import { CountColumns, DURATION_CELL_WIDTH } from "./CountColumns.js";
 import { StatusIcon } from "./StatusIcon.js";
@@ -13,7 +14,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 */
 const projectGlyph = (counts, running, timedOut, frame) => {
 	if (running && !timedOut) return /* @__PURE__ */ jsx(Text, {
-		color: "yellow",
+		...statusInkStyle("running"),
 		children: frame
 	});
 	if (counts.failCount > 0) return /* @__PURE__ */ jsx(StatusIcon, { status: "failed" });

package/render-ink/StatusIcon.js

@@ -1,4 +1,6 @@
+import { statusGlyph, statusInkStyle } from "../theme.js";
 import { Text } from "ink";
+import { useGlyphs } from "@effected/cli/ui";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/render-ink/StatusIcon.tsx
@@ -8,37 +10,34 @@ import { jsx } from "react/jsx-runtime";
 * Ink-only primitive — no DOM-isms. Renders one colored character so
 * the surrounding row can keep its width budget predictable.
 */
-const GLYPH = {
-	passed: "✓",
-	failed: "✗",
-	skipped: "↷",
-	pending: "◯",
-	running: "…",
-	queued: "·",
-	finished: "✓",
-	threshold: "⚠",
-	"timed-out": "⧖"
-};
-const COLOR = {
-	passed: "green",
-	failed: "red",
-	skipped: "gray",
-	pending: "cyan",
-	running: "yellow",
-	queued: "gray",
-	finished: "green",
-	threshold: "yellow",
-	"timed-out": "#e09a4e"
+/**
+* Each icon kind's status in the shared vocabulary. `finished` is a pass;
+* `threshold` is a coverage threshold failure, which the kit ranks as a
+* `failure`, not a warning.
+*/
+const STATUS = {
+	passed: "success",
+	failed: "failure",
+	skipped: "skip",
+	pending: "pending",
+	running: "running",
+	queued: "queued",
+	finished: "success",
+	threshold: "failure",
+	"timed-out": "timeout"
 };
 /**
 * Renders a single colored status glyph for a test, module, or run.
 *
 * @public
 */
-const StatusIcon = ({ status }) => /* @__PURE__ */ jsx(Text, {
-	color: COLOR[status],
-	children: GLYPH[status]
-});
+const StatusIcon = ({ status }) => {
+	const glyphs = useGlyphs();
+	return /* @__PURE__ */ jsx(Text, {
+		...statusInkStyle(STATUS[status]),
+		children: statusGlyph(STATUS[status], glyphs)
+	});
+};
 
 //#endregion
 export { StatusIcon };

package/render-ink/StreamApp.js

@@ -1,4 +1,5 @@
 import { classifyRunShape } from "../dispatcher/classify.js";
+import { VitestAgentTokens, inkStyle, statusGlyph, statusInkStyle } from "../theme.js";
 import { formatDisplayDuration } from "../format-duration.js";
 import { CountColumns, DURATION_CELL_WIDTH } from "./CountColumns.js";
 import { StatusIcon } from "./StatusIcon.js";
@@ -8,6 +9,8 @@ import { spinnerFrame } from "./spinner.js";
 import { TestRow } from "./TestRow.js";
 import { TrendLine } from "./TrendLine.js";
 import { Box, Text } from "ink";
+import { Fmt } from "@effected/cli";
+import { useGlyphs } from "@effected/cli/ui";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/render-ink/StreamApp.tsx
@@ -118,7 +121,7 @@ const ModuleStreamRow = ({ module, nowMs, frame, nameWidth, timedOut, tagUnion:
 			});
 		} else glyph = /* @__PURE__ */ jsx(StatusIcon, { status: "timed-out" });
 	} else if (running) glyph = /* @__PURE__ */ jsx(Text, {
-		color: "yellow",
+		...statusInkStyle("running"),
 		children: frame
 	});
 	else glyph = /* @__PURE__ */ jsx(StatusIcon, { status: moduleIcon(module) });
@@ -182,47 +185,54 @@ const InlineError = ({ failure }) => {
 };
 const failureKey = (f) => `failure:${f.modulePath}::${f.suitePath.join("/")}::${f.testName}`;
 /** A process-level unhandled error, rendered in the aggregate Unhandled errors block. */
-const UnhandledErrorItem = ({ error }) => /* @__PURE__ */ jsxs(Box, {
-	flexDirection: "column",
-	children: [/* @__PURE__ */ jsxs(Text, { children: [
-		"  ",
-		/* @__PURE__ */ jsx(Text, {
-			color: "red",
-			children: "✗"
-		}),
-		" unhandled error"
-	] }), /* @__PURE__ */ jsxs(Text, {
-		dimColor: true,
-		children: ["      ", error.message.split("\n", 1)[0] ?? ""]
-	})]
-});
+const UnhandledErrorItem = ({ error }) => {
+	const glyphs = useGlyphs();
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [/* @__PURE__ */ jsxs(Text, { children: [
+			"  ",
+			/* @__PURE__ */ jsx(Text, {
+				...statusInkStyle("failure"),
+				children: statusGlyph("failure", glyphs)
+			}),
+			" unhandled error"
+		] }), /* @__PURE__ */ jsxs(Text, {
+			dimColor: true,
+			children: ["      ", error.message.split("\n", 1)[0] ?? ""]
+		})]
+	});
+};
 const testKey = (modulePath, t) => `test:${modulePath}::${t.suitePath.join("/")}::${t.testName}`;
 const failurePath = (f) => [
 	f.modulePath,
 	...f.suitePath,
 	f.testName
 ].join(" › ");
+const failureStatus = (f) => f.timedOut === true ? "timeout" : "failure";
 /** A failure entry rendered in the Live region. */
-const FailureItem = ({ failure }) => /* @__PURE__ */ jsxs(Box, {
-	flexDirection: "column",
-	children: [/* @__PURE__ */ jsxs(Text, { children: [
-		"  ",
-		/* @__PURE__ */ jsx(Text, {
-			color: failure.timedOut === true ? "#e09a4e" : "red",
-			children: failure.timedOut === true ? "⧖" : "✗"
-		}),
-		" ",
-		failurePath(failure),
-		failure.classification !== null ? /* @__PURE__ */ jsxs(Text, {
-			color: "#c98ae0",
-			children: [
-				" [",
-				failure.classification,
-				"]"
-			]
-		}) : null
-	] }), /* @__PURE__ */ jsx(InlineError, { failure })]
-});
+const FailureItem = ({ failure }) => {
+	const glyphs = useGlyphs();
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [/* @__PURE__ */ jsxs(Text, { children: [
+			"  ",
+			/* @__PURE__ */ jsx(Text, {
+				...statusInkStyle(failureStatus(failure)),
+				children: statusGlyph(failureStatus(failure), glyphs)
+			}),
+			" ",
+			failurePath(failure),
+			failure.classification !== null ? /* @__PURE__ */ jsxs(Text, {
+				...inkStyle(VitestAgentTokens.classification),
+				children: [
+					" [",
+					failure.classification,
+					"]"
+				]
+			}) : null
+		] }), /* @__PURE__ */ jsx(InlineError, { failure })]
+	});
+};
 /**
 * The bottom `Total:` rollup line. In the workspace view `labelWidth`
 * pads the label to the project-row prefix width so the count columns
@@ -245,9 +255,15 @@ const TotalsLine = ({ totals, labelWidth }) => /* @__PURE__ */ jsxs(Text, { chil
 		children: [" ", formatDisplayDuration(totals.durationMs).padStart(7)]
 	})
 ] });
+/**
+* The coverage judgment. A threshold violation is a `failure` (the kit's
+* decision: threshold failure is ✗, only a target shortfall is ⚠).
+*/
 const CoverageItem = ({ state }) => {
 	if (state.coverage === null) return null;
-	const clean = state.coverage.violations.length === 0;
+	const violations = state.coverage.violations.length;
+	const status = violations === 0 ? "success" : "failure";
+	const glyphs = useGlyphs();
 	return /* @__PURE__ */ jsxs(Text, { children: [
 		/* @__PURE__ */ jsx(Text, {
 			bold: true,
@@ -255,11 +271,11 @@ const CoverageItem = ({ state }) => {
 		}),
 		" ",
 		/* @__PURE__ */ jsx(Text, {
-			color: clean ? "green" : "yellow",
-			children: clean ? "✓" : "⚠"
+			...statusInkStyle(status),
+			children: statusGlyph(status, glyphs)
 		}),
 		" ",
-		clean ? "all metrics meet thresholds" : `${state.coverage.violations.length} threshold violation(s)`
+		violations === 0 ? "all metrics meet thresholds" : Fmt.plural(violations, "threshold violation")
 	] });
 };
 const samePath = (a, b) => {
@@ -273,7 +289,7 @@ const samePath = (a, b) => {
 * run picture — all rows in discovery order, with running rows capped
 * at MAX_LIVE_RUNNING_ROWS and finished rows always shown.
 */
-const liveRegion = (state, shape, nowMs, frame) => {
+const liveRegion = (state, shape, nowMs, frame, glyphs) => {
 	const groups = groupByProject(state);
 	const timedOut = state.phase === "timed-out";
 	const finished = state.phase === "finished" || state.phase === "timed-out";
@@ -287,14 +303,14 @@ const liveRegion = (state, shape, nowMs, frame) => {
 	}) : null;
 	if (shape === "single-test") {
 		const sole = ordered[0];
-		if (sole === void 0 || sole.tests.length === 0) return /* @__PURE__ */ jsx(Text, {
+		if (sole === void 0 || sole.tests.length === 0) return /* @__PURE__ */ jsxs(Text, {
 			dimColor: true,
-			children: "discovering tests…"
+			children: ["discovering tests", glyphs.ellipsis]
 		});
 		const only = sole.tests[0];
-		if (only === void 0) return /* @__PURE__ */ jsx(Text, {
+		if (only === void 0) return /* @__PURE__ */ jsxs(Text, {
 			dimColor: true,
-			children: "discovering tests…"
+			children: ["discovering tests", glyphs.ellipsis]
 		});
 		const failure = only.status === "failed" || only.status === "timed-out" ? state.failures.find((f) => f.testName === only.testName && f.modulePath === sole.modulePath && samePath(f.suitePath, only.suitePath)) : void 0;
 		return /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -306,9 +322,9 @@ const liveRegion = (state, shape, nowMs, frame) => {
 			unhandledErrorsSection
 		] });
 	}
-	if (groups.length === 0) return /* @__PURE__ */ jsx(Text, {
+	if (groups.length === 0) return /* @__PURE__ */ jsxs(Text, {
 		dimColor: true,
-		children: "discovering tests…"
+		children: ["discovering tests", glyphs.ellipsis]
 	});
 	const failuresSection = state.failures.length > 0 ? /* @__PURE__ */ jsx(Box, {
 		flexDirection: "column",
@@ -318,10 +334,10 @@ const liveRegion = (state, shape, nowMs, frame) => {
 	const trendItem = state.trend !== null ? /* @__PURE__ */ jsx(TrendLine, { trend: state.trend }) : null;
 	const totalsItem = (labelWidth) => /* @__PURE__ */ jsxs(Box, {
 		flexDirection: "column",
-		children: [finished && timedOut ? /* @__PURE__ */ jsx(Text, {
-			color: "#e09a4e",
+		children: [finished && timedOut ? /* @__PURE__ */ jsxs(Text, {
+			...statusInkStyle("timeout"),
 			bold: true,
-			children: "⧖ Run timed out"
+			children: [statusGlyph("timeout", glyphs), " Run timed out"]
 		}) : null, /* @__PURE__ */ jsx(TotalsLine, {
 			totals: state.totals,
 			labelWidth
@@ -379,7 +395,9 @@ const liveRegion = (state, shape, nowMs, frame) => {
 			runningOverflow > 0 ? /* @__PURE__ */ jsxs(Text, {
 				dimColor: true,
 				children: [
-					" … and ",
+					" ",
+					glyphs.ellipsis,
+					" and ",
 					runningOverflow,
 					" more running"
 				]
@@ -430,7 +448,9 @@ const liveRegion = (state, shape, nowMs, frame) => {
 			runningOverflow > 0 ? /* @__PURE__ */ jsxs(Text, {
 				dimColor: true,
 				children: [
-					" … and ",
+					" ",
+					glyphs.ellipsis,
+					" and ",
 					runningOverflow,
 					" more running"
 				]
@@ -443,9 +463,9 @@ const liveRegion = (state, shape, nowMs, frame) => {
 		] });
 	}
 	const sole = ordered[0];
-	if (sole === void 0) return /* @__PURE__ */ jsx(Text, {
+	if (sole === void 0) return /* @__PURE__ */ jsxs(Text, {
 		dimColor: true,
-		children: "discovering tests…"
+		children: ["discovering tests", glyphs.ellipsis]
 	});
 	return /* @__PURE__ */ jsxs(Fragment, { children: [
 		/* @__PURE__ */ jsxs(Text, { children: [/* @__PURE__ */ jsx(Text, {
@@ -483,10 +503,11 @@ const liveRegion = (state, shape, nowMs, frame) => {
 */
 const StreamApp = ({ state, frameIndex, nowMs }) => {
 	const now = nowMs ?? Date.now();
-	const frame = spinnerFrame(frameIndex);
+	const glyphs = useGlyphs();
+	const frame = spinnerFrame(frameIndex, glyphs);
 	const projects = groupByProject(state).map((g) => buildProjectSummary(g.name, sumCounts(g.modules)));
 	const shape = classifyRunShape(state, projects);
-	const liveContent = liveRegion(state, shape, now, frame);
+	const liveContent = liveRegion(state, shape, now, frame, glyphs);
 	return /* @__PURE__ */ jsx(Box, {
 		flexDirection: "column",
 		children: liveContent