@vitest-agent/ui 1.0.0

package/render-ink/CoverageBlock.js

@@ -0,0 +1,80 @@
+import { Box, Text } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/render-ink/CoverageBlock.tsx
+const METRIC_ORDER = [
+	"lines",
+	"branches",
+	"functions",
+	"statements"
+];
+const formatPercent = (n) => {
+	return `${Math.round(n * 10) / 10}%`;
+};
+/**
+* Renders the coverage section: per-metric percentages, threshold
+* violations, and top-N gap entries sorted by missing line count.
+*
+* @public
+*/
+const CoverageBlock = ({ coverage, maxGaps = 3 }) => {
+	const sortedGaps = [...coverage.gaps].sort((a, b) => b.missing.lines - a.missing.lines);
+	const topGaps = maxGaps > 0 ? sortedGaps.slice(0, maxGaps) : [];
+	const elidedGaps = maxGaps > 0 ? coverage.gaps.length - topGaps.length : 0;
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [
+			/* @__PURE__ */ jsx(Text, {
+				bold: true,
+				children: "Coverage"
+			}),
+			METRIC_ORDER.map((metric) => {
+				const actual = coverage.metrics[metric];
+				const threshold = coverage.thresholds[metric];
+				const failing = threshold !== void 0 && actual < threshold;
+				return /* @__PURE__ */ jsxs(Box, { children: [
+					/* @__PURE__ */ jsx(Text, { children: `  ${metric}: ` }),
+					failing ? /* @__PURE__ */ jsx(Text, {
+						color: "red",
+						children: formatPercent(actual)
+					}) : /* @__PURE__ */ jsx(Text, { children: formatPercent(actual) }),
+					threshold !== void 0 ? /* @__PURE__ */ jsxs(Text, {
+						dimColor: true,
+						children: [
+							" (threshold ",
+							formatPercent(threshold),
+							")"
+						]
+					}) : null
+				] }, metric);
+			}),
+			coverage.violations.length > 0 ? /* @__PURE__ */ jsxs(Box, {
+				flexDirection: "column",
+				children: [/* @__PURE__ */ jsx(Text, {
+					color: "red",
+					children: "Violations"
+				}), coverage.violations.map((v) => /* @__PURE__ */ jsx(Text, {
+					color: "red",
+					children: `  ${v.metric}: ${formatPercent(v.actual)} < ${formatPercent(v.expected)}`
+				}, v.metric))]
+			}) : null,
+			topGaps.length > 0 ? /* @__PURE__ */ jsxs(Box, {
+				flexDirection: "column",
+				children: [
+					/* @__PURE__ */ jsx(Text, {
+						bold: true,
+						children: "Gaps"
+					}),
+					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"})`
+					}) : null
+				]
+			}) : null
+		]
+	});
+};
+
+//#endregion
+export { CoverageBlock };

package/render-ink/FailureSection.js

@@ -0,0 +1,69 @@
+import { Box, Text } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/render-ink/FailureSection.tsx
+const FailureRow = ({ failure, includeStack }) => {
+	const suite = failure.suitePath.length > 0 ? `${failure.suitePath.join(" > ")} > ` : "";
+	const classification = failure.classification !== null ? ` [${failure.classification}]` : "";
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [
+			/* @__PURE__ */ jsx(Box, { children: /* @__PURE__ */ jsxs(Text, { children: [
+				/* @__PURE__ */ jsx(Text, {
+					color: "red",
+					children: "✗"
+				}),
+				` ${failure.modulePath} > ${suite}${failure.testName}`,
+				failure.classification !== null ? /* @__PURE__ */ jsx(Text, {
+					color: "yellow",
+					children: classification
+				}) : null
+			] }) }),
+			failure.error?.message !== void 0 ? /* @__PURE__ */ jsx(Text, {
+				color: "red",
+				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",
+					children: `  ${line}`
+				}, key);
+				if (line.startsWith("+")) return /* @__PURE__ */ jsx(Text, {
+					color: "green",
+					children: `  ${line}`
+				}, key);
+				return /* @__PURE__ */ jsx(Text, { children: `  ${line}` }, key);
+			}) : null,
+			includeStack && failure.error?.stack !== void 0 ? failure.error.stack.split("\n").map((line, idx) => {
+				const key = `stack-${idx}`;
+				return /* @__PURE__ */ jsx(Text, {
+					dimColor: true,
+					children: `  ${line}`
+				}, key);
+			}) : null
+		]
+	});
+};
+/**
+* Renders one block per failed test: glyph, path, classification tag,
+* error message, diff lines, and optionally the stack trace.
+*
+* @public
+*/
+const FailureSection = ({ failures, includeStack = false }) => {
+	if (failures.length === 0) return null;
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [/* @__PURE__ */ jsx(Text, {
+			bold: true,
+			children: "Failures"
+		}), failures.map((failure) => /* @__PURE__ */ jsx(FailureRow, {
+			failure,
+			includeStack
+		}, `${failure.modulePath}::${failure.suitePath.join("/")}::${failure.testName}`))]
+	});
+};
+
+//#endregion
+export { FailureSection };

package/render-ink/FailuresSection.js

@@ -0,0 +1,85 @@
+import { Box, Text } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/render-ink/FailuresSection.tsx
+const pathOf = (f) => {
+	return [
+		f.modulePath,
+		...f.suitePath,
+		f.testName
+	].join(" › ");
+};
+const firstLine = (message) => message.split("\n", 1)[0] ?? "";
+const FAILURE_VALUE_LIMIT = 200;
+/**
+* Renders the capped failures block for aggregate-row shapes.
+* Entries beyond `limit` collapse into an overflow line.
+*
+* @public
+*/
+const FailuresSection = ({ failures, limit }) => {
+	const shown = failures.slice(0, limit);
+	const overflow = failures.length - shown.length;
+	return /* @__PURE__ */ jsxs(Box, {
+		flexDirection: "column",
+		children: [
+			/* @__PURE__ */ jsxs(Text, {
+				bold: true,
+				children: [
+					"Failures (",
+					failures.length,
+					"):"
+				]
+			}),
+			shown.map((f, i) => /* @__PURE__ */ jsxs(Box, {
+				flexDirection: "column",
+				children: [
+					/* @__PURE__ */ jsxs(Text, { children: [
+						"  ",
+						/* @__PURE__ */ jsx(Text, {
+							color: f.timedOut === true ? "#e09a4e" : "red",
+							children: f.timedOut === true ? "⧖" : "✗"
+						}),
+						" ",
+						pathOf(f),
+						f.classification !== null ? /* @__PURE__ */ jsxs(Text, {
+							color: "#c98ae0",
+							children: [
+								" [",
+								f.classification,
+								"]"
+							]
+						}) : null
+					] }),
+					f.error?.message !== void 0 ? /* @__PURE__ */ jsxs(Text, {
+						dimColor: true,
+						children: ["      ", firstLine(f.error.message)]
+					}) : null,
+					f.error?.expected !== void 0 ? /* @__PURE__ */ jsxs(Text, {
+						dimColor: true,
+						children: [
+							"      ",
+							"expected: ",
+							f.error.expected.slice(0, FAILURE_VALUE_LIMIT)
+						]
+					}) : null,
+					f.error?.received !== void 0 ? /* @__PURE__ */ jsxs(Text, {
+						dimColor: true,
+						children: [
+							"      ",
+							"received: ",
+							f.error.received.slice(0, FAILURE_VALUE_LIMIT)
+						]
+					}) : null
+				]
+			}, `${f.modulePath}:${f.testName}:${i}`)),
+			overflow > 0 ? /* @__PURE__ */ jsx(Text, {
+				dimColor: true,
+				children: `  … ${overflow} more`
+			}) : null
+		]
+	});
+};
+
+//#endregion
+export { FailuresSection };

package/render-ink/ModuleHeader.js

@@ -0,0 +1,43 @@
+import { formatDisplayDuration } from "../format-duration.js";
+import { StatusIcon } from "./StatusIcon.js";
+import { Box, Text } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/render-ink/ModuleHeader.tsx
+const moduleGlyph = (m) => {
+	if (m.status === "queued") return "queued";
+	if (m.status === "running") return "running";
+	if (m.failCount > 0) return "failed";
+	return "passed";
+};
+/**
+* Renders the per-module title line: a status glyph, the module path,
+* and a dimmed inline summary of pass/fail/skip counts and duration.
+*
+* @public
+*/
+const ModuleHeader = ({ module }) => {
+	const parts = [];
+	if (module.passCount > 0) parts.push(`${module.passCount} passed`);
+	if (module.failCount > 0) parts.push(`${module.failCount} failed`);
+	if (module.skipCount > 0) parts.push(`${module.skipCount} skipped`);
+	const summary = parts.length > 0 ? parts.join(", ") : module.status;
+	return /* @__PURE__ */ jsxs(Box, { children: [
+		/* @__PURE__ */ jsx(StatusIcon, { status: moduleGlyph(module) }),
+		/* @__PURE__ */ jsxs(Text, { children: [" ", module.modulePath] }),
+		/* @__PURE__ */ jsxs(Text, {
+			dimColor: true,
+			children: [
+				" ",
+				"(",
+				summary,
+				", ",
+				formatDisplayDuration(module.durationMs),
+				")"
+			]
+		})
+	] });
+};
+
+//#endregion
+export { ModuleHeader };

package/render-ink/ProjectRow.js

@@ -0,0 +1,56 @@
+import { formatDisplayDuration } from "../format-duration.js";
+import { CountColumns } from "./CountColumns.js";
+import { StatusIcon } from "./StatusIcon.js";
+import { formatTagSuffix } from "./tag-suffix.js";
+import { Box, Text } from "ink";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/render-ink/ProjectRow.tsx
+/**
+* Pick the glyph element for the project row using the spec's severity
+* precedence (`✗ > ⧖ > ⚠ > ↷ > ✓`). Skip-only projects (no passes, no
+* failures, no timeouts) resolve to `↷`, not a false-positive `✓`.
+*/
+const projectGlyph = (counts, running, timedOut, frame) => {
+	if (running && !timedOut) return /* @__PURE__ */ jsx(Text, {
+		color: "yellow",
+		children: frame
+	});
+	if (counts.failCount > 0) return /* @__PURE__ */ jsx(StatusIcon, { status: "failed" });
+	if (counts.timeoutCount > 0 || running && timedOut) return /* @__PURE__ */ jsx(StatusIcon, { status: "timed-out" });
+	if (counts.skipCount > 0 && counts.passCount === 0) return /* @__PURE__ */ jsx(StatusIcon, { status: "skipped" });
+	return /* @__PURE__ */ jsx(StatusIcon, { status: "passed" });
+};
+/**
+* Renders one per-project row in the `workspace`-shape live view: status
+* glyph (animated spinner while running), project name, count columns,
+* elapsed duration, and optional tag counts.
+*
+* @public
+*/
+const ProjectRow = ({ project, counts, running, timedOut = false, elapsedMs, frame, nameWidth, tagCounts }) => /* @__PURE__ */ jsxs(Box, { children: [
+	/* @__PURE__ */ jsx(Text, { children: "  " }),
+	projectGlyph(counts, running, timedOut, frame),
+	/* @__PURE__ */ jsxs(Text, { children: [
+		" ",
+		project.name.padEnd(nameWidth),
+		" "
+	] }),
+	/* @__PURE__ */ jsx(CountColumns, {
+		passCount: counts.passCount,
+		failCount: counts.failCount,
+		skipCount: counts.skipCount,
+		timeoutCount: counts.timeoutCount
+	}),
+	/* @__PURE__ */ jsxs(Text, {
+		dimColor: true,
+		children: [" ", formatDisplayDuration(elapsedMs)]
+	}),
+	formatTagSuffix(tagCounts).length > 0 ? /* @__PURE__ */ jsxs(Text, {
+		color: "cyan",
+		children: [" ", formatTagSuffix(tagCounts)]
+	}) : null
+] });
+
+//#endregion
+export { ProjectRow };

package/render-ink/StatusIcon.js

@@ -0,0 +1,44 @@
+import { Text } from "ink";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/render-ink/StatusIcon.tsx
+/**
+* Single-character status glyph for tests, modules, and the run itself.
+*
+* 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"
+};
+/**
+* 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]
+});
+
+//#endregion
+export { StatusIcon };