@underactive/pi-topping-statusline 0.1.4 → 0.2.1

package/src/rainbow.ts

@@ -24,6 +24,9 @@ export const RAINBOW_DEG_PER_FRAME = (360 * RAINBOW_FRAME_MS) / RAINBOW_CYCLE_MS
 const SATURATION = 1;
 const LIGHTNESS = 0.62;
 
+/** Normalize a degree value into the [0, 360) range. */
+export const wrapDeg = (deg: number): number => ((deg % 360) + 360) % 360;
+
 /**
  * Number of border cells in the box (rows 0..bottomIdx, cols 0..width-1):
  * two horizontal edges of `width` cells plus two vertical edges of
@@ -64,27 +67,38 @@ export function rgbToHex([r, g, b]: [number, number, number]): string {
 	return `#${((r << 16) | (g << 8) | b).toString(16).padStart(6, "0")}`;
 }
 
+export interface BorderColorizer {
+	colorChar(ch: string, perimeterPos: number, perimeter: number): string;
+	/** ANSI foreground-color escape for a perimeter position, with no glyph or reset. */
+	prefix(perimeterPos: number, perimeter: number): string;
+	step(deltaDeg: number): void;
+}
+
 /**
  * Colors box glyphs with a hue that travels around the border perimeter as
  * the phase advances — the spectrum appears to flow around the box.
  */
-export class RainbowBorder {
+export class RainbowBorder implements BorderColorizer {
 	#phaseDeg: number;
 	readonly #mode: ColorMode;
 	readonly #ansiByHue: string[] = [];
 
 	constructor(phaseDeg = 0) {
-		this.#phaseDeg = ((phaseDeg % 360) + 360) % 360;
+		this.#phaseDeg = wrapDeg(phaseDeg);
 		this.#mode = detectColorMode();
 	}
 
 	/** Advance the whole spectrum by `deltaDeg` (mod 360). */
 	step(deltaDeg: number): void {
-		this.#phaseDeg = ((this.#phaseDeg + deltaDeg) % 360 + 360) % 360;
+		this.#phaseDeg = wrapDeg(this.#phaseDeg + deltaDeg);
 	}
 
 	/** Color one border glyph whose walk position is `perimeterPos` of `perimeter`. */
 	colorChar(char: string, perimeterPos: number, perimeter: number): string {
+		return `${this.prefix(perimeterPos, perimeter)}${char}\x1b[39m`;
+	}
+
+	prefix(perimeterPos: number, perimeter: number): string {
 		const hue = (this.#phaseDeg + (360 * perimeterPos) / perimeter) % 360;
 		const bucket = Math.round(hue) % 360;
 		let ansi = this.#ansiByHue[bucket];
@@ -93,6 +107,6 @@ export class RainbowBorder {
 			ansi = hexToFgAnsi(hex, this.#mode);
 			this.#ansiByHue[bucket] = ansi;
 		}
-		return `${ansi}${char}\x1b[39m`;
+		return ansi;
 	}
 }

package/src/segments.ts

@@ -75,6 +75,24 @@ function classifyProjectDir(pwd: string): { scratch: boolean; relative: string |
 	return { scratch: false, relative: null };
 }
 
+interface PathClassification {
+	scratch: boolean;
+	relative: string | null;
+	strippedDisplay: string;
+}
+
+let cachedCwd: string | undefined;
+let cachedClassification: PathClassification | undefined;
+
+/** cwd is effectively constant for a session, so cache the root scans instead of redoing them on every render (including repeated shrink passes). */
+function classifyCwd(cwd: string): PathClassification {
+	if (cachedCwd === cwd && cachedClassification) return cachedClassification;
+	const { scratch, relative } = classifyProjectDir(cwd);
+	cachedClassification = { scratch, relative, strippedDisplay: stripDisplayRoot(cwd) };
+	cachedCwd = cwd;
+	return cachedClassification;
+}
+
 // ═══════════════════════════════════════════════════════════════════════════
 // Segment implementations
 // ═══════════════════════════════════════════════════════════════════════════
@@ -133,14 +151,14 @@ const pathSegment: StatusLineSegment = {
 			return { content: theme.fg("statusLinePath", content), visible: true };
 		}
 
-		const { scratch, relative } = classifyProjectDir(ctx.cwd);
+		const { scratch, relative, strippedDisplay } = classifyCwd(ctx.cwd);
 		let pwd = ctx.cwd;
 
 		if (opts.stripWorkPrefix) {
 			if (scratch) {
 				if (relative) pwd = relative;
 			} else {
-				pwd = stripDisplayRoot(pwd);
+				pwd = strippedDisplay;
 			}
 		}
 		if (opts.abbreviate) {
@@ -295,6 +313,20 @@ const scrollHintSegment: StatusLineSegment = {
 	},
 };
 
+/**
+ * Pi's embedded status spinner (spinner + message), already colored by the
+ * host, so it is passed through verbatim. The layout applies the caller's
+ * truncation style: a bare cut for working, ellipsis for message-style kinds.
+ */
+const workingSegment: StatusLineSegment = {
+	id: "working",
+	render(ctx) {
+		const status = ctx.workingStatus;
+		if (!status) return INVISIBLE;
+		return { content: status, visible: true };
+	},
+};
+
 /** Context bar + stats — related parts joined by a space, not the group separator. */
 const contextGraphSegment: StatusLineSegment = {
 	id: "context_graph",
@@ -351,6 +383,7 @@ export const SEGMENTS: Record<StatusLineSegmentId, StatusLineSegment> = {
 	feeds: feedsSegment,
 	context_graph: contextGraphSegment,
 	scroll_hint: scrollHintSegment,
+	working: workingSegment,
 };
 
 export function renderSegment(id: StatusLineSegmentId, ctx: SegmentContext): RenderedSegment {

package/src/settings-menu.ts

@@ -8,6 +8,7 @@ import { makeBoxPainters, renderBoxRow } from "./box.js";
 import type { SegmentContextBuilder } from "./context.js";
 import { buildStatusLine } from "./layout.js";
 import { showMenu, type MenuSection, type MenuValue, type PreviewResult } from "./menu.js";
+import { NvidiaGreenBorder, isSwitchyardProvider } from "./nvidia-green.js";
 import { RAINBOW_CYCLE_MS, RAINBOW_FRAME_MS, RainbowBorder } from "./rainbow.js";
 import {
 	applySettings,
@@ -19,6 +20,7 @@ import {
 	saveSettings,
 	sanitizeFeeds,
 	SEPARATORS,
+	topLeftSegments,
 	type SettingsState,
 } from "./settings.js";
 import { theme, type BorderStyle, type SymbolPreset } from "./theme.js";
@@ -33,8 +35,10 @@ import type {
 } from "./types.js";
 
 const SYMBOL_LABELS: Record<SymbolPreset, string> = { nerd: "nerdfont", unicode: "unicode", ascii: "ascii" };
-const SYMBOL_FROM_LABEL: Record<string, SymbolPreset> = { nerdfont: "nerd", unicode: "unicode", ascii: "ascii" };
-const SYMBOL_VALUES: readonly string[] = ["nerdfont", "unicode", "ascii"];
+const SYMBOL_VALUES: readonly string[] = Object.values(SYMBOL_LABELS);
+const SYMBOL_FROM_LABEL: Record<string, SymbolPreset> = Object.fromEntries(
+	(Object.entries(SYMBOL_LABELS) as [SymbolPreset, string][]).map(([preset, label]) => [label, preset]),
+);
 
 const SECTION_TITLES = [
 	"Top Left Segment Group",
@@ -140,6 +144,21 @@ function buildSections(settings: StatusLineSettings): MenuSection[] {
 				label: "Animate rainbow border",
 				value: settings.rainbowAnimation ?? true,
 			},
+			{
+				id: "nvidiaGreenBorder",
+				label: "NVIDIA-green when using Switchyard",
+				value: settings.nvidiaGreenBorder ?? true,
+			},
+			{
+				id: "nvidiaGreenAnimation",
+				label: "Animate Switchyard green border",
+				value: settings.nvidiaGreenAnimation ?? true,
+			},
+			{
+				id: "embedWorkingStatus",
+				label: "Embed status spinners",
+				value: settings.embedWorkingStatus ?? false,
+			},
 		],
 	};
 	return [
@@ -170,6 +189,9 @@ function valuesToSettings(values: Record<string, MenuValue>): StatusLineSettings
 		feeds: sanitizeFeeds(feedsFromValues(values)),
 		rainbowBorder: values.rainbowBorder === true,
 		rainbowAnimation: values.rainbowAnimation === true,
+		nvidiaGreenBorder: values.nvidiaGreenBorder === true,
+		nvidiaGreenAnimation: values.nvidiaGreenAnimation === true,
+		embedWorkingStatus: values.embedWorkingStatus === true,
 	};
 }
 
@@ -184,6 +206,10 @@ const CANNED_STATS = "↑ 12.4K ↓ 3.1K R 148K W 12K 92.3% $0.42";
 const CANNED_GIT = { branch: "main", status: { staged: 1, unstaged: 2, untracked: 3 } };
 const CANNED_PERCENT = 42;
 const CANNED_WINDOW = 200_000;
+/** What pi's border indicator looks like mid-stream with pi-topping's loader installed. */
+const CANNED_WORKING = "⠙ Mulling ⢾⣿⣿⣿⣿⣿⢾⢾  28 tps · 11s · ↓ 316 tokens";
+/** pi 0.86's compaction spinner: the longest status the bar has to carry. */
+const CANNED_COMPACTION = "⠙ Context overflow detected, Auto-compacting... (esc to cancel)";
 
 /** Fill any feed the live session has no entry for, so the preview stays legible. */
 function cannedFeedData(
@@ -212,7 +238,7 @@ class StatusLinePreview {
 	render(
 		values: Record<string, MenuValue>,
 		elapsedMs: number,
-		_activeItemId: string | undefined,
+		activeItemId: string | undefined,
 		innerWidth: number,
 	): PreviewResult {
 		const effective = resolveEffectiveSettings(valuesToSettings(values));
@@ -220,8 +246,6 @@ class StatusLinePreview {
 		// 6-cell chrome budget for the bars themselves.
 		const boxWidth = Math.max(24, innerWidth - 1);
 		const barWidth = boxWidth - 6;
-		const rainbowOn = effective.rainbowBorder;
-		const rainbowAnimationOn = rainbowOn && effective.rainbowAnimation;
 
 		// The theme singleton drives glyph lookups everywhere, so swap the
 		// symbol preset for this synchronous render only; the live bar behind
@@ -236,6 +260,10 @@ class StatusLinePreview {
 				feeds: effective.segmentOptions.feeds.map(f => f.customType),
 			};
 			const base = this.#builder.build(barWidth, effective.segmentOptions, include, CANNED_HINT);
+			const greenOn = effective.nvidiaGreenBorder && isSwitchyardProvider(base.model?.provider);
+			const rainbowOn = !greenOn && effective.rainbowBorder;
+			const animationOn = greenOn ? effective.nvidiaGreenAnimation : rainbowOn && effective.rainbowAnimation;
+			const phase = animationOn ? (elapsedMs * 360) / RAINBOW_CYCLE_MS : 0;
 			const contextWindow = base.contextWindow || CANNED_WINDOW;
 			const ctx: SegmentContext = {
 				...base,
@@ -258,24 +286,31 @@ class StatusLinePreview {
 			const box = theme.getBox(effective.borderStyle);
 			// The preview box is three rows tall: top bar, side verticals, bottom bar.
 			const bottomIdx = 2;
+			const colorizer = greenOn ? new NvidiaGreenBorder(phase) : new RainbowBorder(phase);
 			const painters = makeBoxPainters({
-				rainbowOn,
-				rainbow: new RainbowBorder(rainbowAnimationOn ? (elapsedMs * 360) / RAINBOW_CYCLE_MS : 0),
+				colorizerOn: greenOn || rainbowOn,
+				colorizer,
 				box,
 				width: boxWidth,
 				bottomIdx,
 				flat: s => this.#uiTheme.fg("border", s),
 			});
+			const embedOn = effective.embedWorkingStatus;
+			// Focusing the embed row demos the message-style spinners pi 0.86
+			// routes through the same slot, including their ellipsis truncation.
+			const compactionDemo = activeItemId === "embedWorkingStatus";
+			const sample = compactionDemo ? CANNED_COMPACTION : CANNED_WORKING;
 			const top = buildStatusLine(
 				barWidth,
-				ctx,
+				embedOn ? { ...ctx, workingStatus: this.#uiTheme.fg("border", sample) } : ctx,
 				effective,
 				painters.gapColor,
 				{
-					left: effective.leftSegments,
+					left: topLeftSegments(effective, embedOn),
 					right: effective.rightSegments,
 				},
 				{ col: 3, row: 0 },
+				{ workingEllipsis: compactionDemo ? "…" : "" },
 			);
 			const bottom = buildStatusLine(
 				barWidth,
@@ -296,8 +331,8 @@ class StatusLinePreview {
 						painters.paint(1, boxWidth - 1, box.vertical),
 					renderBoxRow(painters, bottom, bottomIdx, boxWidth, box.bottomLeft, box.bottomRight),
 				],
-				// A static rainbow stays at phase zero and needs no repaint timer.
-				nextRefreshInMs: rainbowAnimationOn ? RAINBOW_FRAME_MS : undefined,
+				// A static colorizer stays at phase zero and needs no repaint timer.
+				nextRefreshInMs: animationOn ? RAINBOW_FRAME_MS : undefined,
 			};
 		} finally {
 			theme.setSymbolPreset(applied);
@@ -312,7 +347,7 @@ export function registerSettingsCommand(
 	onChange: () => void,
 ): void {
 	pi.registerCommand("topping-statusline-settings", {
-		description: "Configure transparent segments, statusline segments, separator, symbols, border style, feeds, and rainbow border animation",
+		description: "Configure transparent segments, statusline segments, separator, symbols, border style, feeds, rainbow border animation, the Switchyard NVIDIA-green border, and the embedded status spinners",
 		handler: async (_args, ctx: ExtensionCommandContext) => {
 			if (ctx.mode !== "tui") {
 				ctx.ui.notify("/topping-statusline-settings requires TUI mode", "error");

package/src/settings.ts

@@ -93,6 +93,9 @@ function loadSettings(): StatusLineSettings {
 		if (raw.feeds !== undefined) settings.feeds = sanitizeFeeds(raw.feeds);
 		if (typeof raw.rainbowBorder === "boolean") settings.rainbowBorder = raw.rainbowBorder;
 		if (typeof raw.rainbowAnimation === "boolean") settings.rainbowAnimation = raw.rainbowAnimation;
+		if (typeof raw.nvidiaGreenBorder === "boolean") settings.nvidiaGreenBorder = raw.nvidiaGreenBorder;
+		if (typeof raw.nvidiaGreenAnimation === "boolean") settings.nvidiaGreenAnimation = raw.nvidiaGreenAnimation;
+		if (typeof raw.embedWorkingStatus === "boolean") settings.embedWorkingStatus = raw.embedWorkingStatus;
 		return settings;
 	} catch {
 		// Missing or corrupt settings.json falls back to defaults.
@@ -155,6 +158,9 @@ export function resolveEffectiveSettings(settings: StatusLineSettings): Effectiv
 		bottomRightSegments,
 		rainbowBorder: settings.rainbowBorder ?? true,
 		rainbowAnimation: settings.rainbowAnimation ?? true,
+		nvidiaGreenBorder: settings.nvidiaGreenBorder ?? true,
+		nvidiaGreenAnimation: settings.nvidiaGreenAnimation ?? true,
+		embedWorkingStatus: settings.embedWorkingStatus ?? false,
 		includes,
 		segmentOptions: {
 			model: { showModel: seg.model, showProvider: seg.provider, showThinking: seg.thinking },
@@ -165,6 +171,16 @@ export function resolveEffectiveSettings(settings: StatusLineSettings): Effectiv
 	};
 }
 
+/**
+ * The top-left group for one frame. While a pi status spinner is embedded, it
+ * stands in for every left segment except the leading Pi symbol, so the symbol
+ * and its chevron never move when a status appears or clears.
+ */
+export function topLeftSegments(effective: EffectiveStatusLineSettings, working: boolean): StatusLineSegmentId[] {
+	if (!working) return effective.leftSegments;
+	return effective.leftSegments[0] === "pi" ? ["pi", "working"] : ["working"];
+}
+
 export interface SettingsState {
 	settings: StatusLineSettings;
 	effective: EffectiveStatusLineSettings;

package/src/tests/box.test.ts

@@ -24,8 +24,8 @@ const ROUNDED: BoxGlyphs = {
 
 const identityPainters = (boxWidth: number) =>
 	makeBoxPainters({
-		rainbowOn: false,
-		rainbow: new RainbowBorder(0),
+		colorizerOn: false,
+		colorizer: new RainbowBorder(0),
 		box: ROUNDED,
 		width: boxWidth,
 		bottomIdx: 2,
@@ -71,8 +71,8 @@ test("a bar wider than the budget clamps pad to zero", () => {
 
 test("non-rainbow painters wrap whole runs in one flat call", () => {
 	const painters = makeBoxPainters({
-		rainbowOn: false,
-		rainbow: new RainbowBorder(0),
+		colorizerOn: false,
+		colorizer: new RainbowBorder(0),
 		box: ROUNDED,
 		width: 20,
 		bottomIdx: 2,
@@ -85,8 +85,8 @@ test("non-rainbow painters wrap whole runs in one flat call", () => {
 
 test("rainbow coloring never changes the geometry", () => {
 	const painters = makeBoxPainters({
-		rainbowOn: true,
-		rainbow: new RainbowBorder(0),
+		colorizerOn: true,
+		colorizer: new RainbowBorder(0),
 		box: ROUNDED,
 		width: 20,
 		bottomIdx: 2,

package/src/tests/footer.test.ts

@@ -48,6 +48,7 @@ test("filterVisibleRows drops empty notifications but keeps visible rows", () =>
 test("fullscreen footer slot can collapse and restores its minimum", () => {
 	const footer = { render: () => [] };
 	const footerContainer = { children: [footer] };
+	// minSize: 1 mirrors the footer dock shape used by hosts before pi 0.86.
 	const footerEntry = { component: footerContainer, minSize: 1 };
 	const dock = { entries: [{ component: {} }, footerEntry] };
 	const root = { entries: [{ component: {} }, { component: dock, minSize: 1 }] };

package/src/tests/nvidia-green.test.ts

@@ -0,0 +1,51 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import {
+	NVIDIA_GREEN_DARK_HEX,
+	NVIDIA_GREEN_HEX,
+	NvidiaGreenBorder,
+	isSwitchyardProvider,
+} from "../nvidia-green.ts";
+import { resolveEffectiveSettings } from "../settings.ts";
+import { detectColorMode, hexToFgAnsi } from "../theme.ts";
+
+test("recognizes the Switchyard provider case-insensitively after trimming", () => {
+	assert.equal(isSwitchyardProvider("switchyard"), true);
+	assert.equal(isSwitchyardProvider(" Switchyard "), true);
+	assert.equal(isSwitchyardProvider(undefined), false);
+	assert.equal(isSwitchyardProvider(""), false);
+	assert.equal(isSwitchyardProvider("other"), false);
+});
+
+test("switchyard green settings default to true and resolve explicit false", () => {
+	const defaults = resolveEffectiveSettings({});
+	assert.equal(defaults.nvidiaGreenBorder, true);
+	assert.equal(defaults.nvidiaGreenAnimation, true);
+	const off = resolveEffectiveSettings({ nvidiaGreenBorder: false, nvidiaGreenAnimation: false });
+	assert.equal(off.nvidiaGreenBorder, false);
+	assert.equal(off.nvidiaGreenAnimation, false);
+});
+
+test("colorChar wraps a glyph in a color escape and foreground reset", () => {
+	const border = new NvidiaGreenBorder();
+	assert.match(border.colorChar("─", 0, 28), /^\x1b\[38;(2;\d+;\d+;\d+|5;\d+)m─\x1b\[39m$/);
+});
+
+test("phase zero has bright and dark opposite endpoints", () => {
+	const mode = detectColorMode();
+	const border = new NvidiaGreenBorder(0);
+	assert.equal(border.colorChar("─", 0, 28), `${hexToFgAnsi(NVIDIA_GREEN_HEX, mode)}─\x1b[39m`);
+	assert.equal(border.colorChar("─", 14, 28), `${hexToFgAnsi(NVIDIA_GREEN_DARK_HEX, mode)}─\x1b[39m`);
+});
+
+test("step by one full turn preserves the color", () => {
+	const stepped = new NvidiaGreenBorder(37);
+	const unchanged = new NvidiaGreenBorder(37);
+	stepped.step(360);
+	assert.equal(stepped.colorChar("─", 7, 28), unchanged.colorChar("─", 7, 28));
+});
+
+test("opposite positions receive different shades", () => {
+	const border = new NvidiaGreenBorder();
+	assert.notEqual(border.colorChar("─", 0, 28), border.colorChar("─", 14, 28));
+});

package/src/tests/working-status.test.ts

@@ -0,0 +1,158 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import { STATUS_HOLD_MS, StatusTransition, WORKING_FADE_MS } from "../working-status.ts";
+
+test("a live status is returned verbatim without scheduling repaints", () => {
+	const transition = new StatusTransition();
+
+	assert.deepEqual(transition.resolve("⠙ Working", "working", 1_000), {
+		status: "⠙ Working",
+		kind: "working",
+		pending: false,
+	});
+	assert.equal(transition.pending(1_000), false);
+});
+
+test("clearing a working status holds it, cross-fades both halves, then settles", () => {
+	const transition = new StatusTransition();
+	transition.resolve("⠙ Working", "working", 1_000);
+
+	const clearedAt = 2_000;
+	const holdEndsAt = clearedAt + STATUS_HOLD_MS;
+	assert.deepEqual(transition.resolve(undefined, undefined, clearedAt), {
+		status: "⠙ Working",
+		kind: "working",
+		pending: true,
+	});
+	assert.deepEqual(transition.resolve(undefined, undefined, holdEndsAt - 1), {
+		status: "⠙ Working",
+		kind: "working",
+		pending: true,
+	});
+
+	const outgoingStart = transition.resolve(undefined, undefined, holdEndsAt);
+	const outgoingMiddle = transition.resolve(undefined, undefined, holdEndsAt + 150);
+	const outgoingEnd = transition.resolve(undefined, undefined, holdEndsAt + WORKING_FADE_MS / 2 - 1);
+	assert.equal(outgoingStart.status, "⠙ Working");
+	assert.equal(outgoingMiddle.status, "⠙ Working");
+	assert.equal(outgoingEnd.status, "⠙ Working");
+	assert.ok(
+		(outgoingStart.leftFade ?? -1) > (outgoingMiddle.leftFade ?? -1) &&
+			(outgoingMiddle.leftFade ?? -1) > (outgoingEnd.leftFade ?? -1),
+		"outgoing opacity decreases monotonically",
+	);
+
+	const incomingStart = transition.resolve(undefined, undefined, holdEndsAt + WORKING_FADE_MS / 2);
+	const incomingMiddle = transition.resolve(undefined, undefined, holdEndsAt + 550);
+	const incomingEnd = transition.resolve(undefined, undefined, holdEndsAt + WORKING_FADE_MS - 1);
+	assert.equal(incomingStart.status, undefined);
+	assert.equal(incomingMiddle.status, undefined);
+	assert.equal(incomingEnd.status, undefined);
+	assert.ok(
+		(incomingStart.leftFade ?? 2) < (incomingMiddle.leftFade ?? 2) &&
+			(incomingMiddle.leftFade ?? 2) < (incomingEnd.leftFade ?? 2),
+		"incoming opacity increases monotonically",
+	);
+	assert.equal(transition.pending(holdEndsAt + WORKING_FADE_MS - 1), true);
+
+	assert.deepEqual(transition.resolve(undefined, undefined, holdEndsAt + WORKING_FADE_MS), {
+		status: undefined,
+		kind: undefined,
+		pending: false,
+	});
+	assert.equal(transition.pending(holdEndsAt + WORKING_FADE_MS), false);
+});
+
+test("clearing message-style statuses holds them and then cuts without a fade", () => {
+	for (const kind of ["compaction", "retry"] as const) {
+		const transition = new StatusTransition();
+		transition.resolve(`⠙ ${kind}`, kind, 100);
+		assert.deepEqual(transition.resolve(undefined, undefined, 200), {
+			status: `⠙ ${kind}`,
+			kind,
+			pending: true,
+		});
+		assert.deepEqual(transition.resolve(undefined, undefined, 200 + STATUS_HOLD_MS - 1), {
+			status: `⠙ ${kind}`,
+			kind,
+			pending: true,
+		});
+		assert.deepEqual(transition.resolve(undefined, undefined, 200 + STATUS_HOLD_MS), {
+			status: undefined,
+			kind: undefined,
+			pending: false,
+		});
+	}
+});
+
+test("a new status during the hold cuts in immediately and cancels the exit", () => {
+	const transition = new StatusTransition();
+	transition.resolve("⠙ Working", "working", 1_000);
+	transition.resolve(undefined, undefined, 1_100);
+
+	assert.deepEqual(transition.resolve("⠹ Retrying", "retry", 1_200), {
+		status: "⠹ Retrying",
+		kind: "retry",
+		pending: false,
+	});
+	assert.equal(transition.pending(2_000), false);
+});
+
+test("a new status during the fade cuts in immediately and cancels the exit", () => {
+	const transition = new StatusTransition();
+	transition.resolve("⠙ Working", "working", 0);
+	transition.resolve(undefined, undefined, 100);
+	const fading = transition.resolve(undefined, undefined, 300);
+	assert.equal(fading.status, "⠙ Working");
+	assert.equal(fading.pending, true);
+
+	assert.deepEqual(transition.resolve("⠸ Compacting", "compaction", 301), {
+		status: "⠸ Compacting",
+		kind: "compaction",
+		pending: false,
+	});
+	assert.equal(transition.pending(1_000), false);
+});
+
+test("a working-to-compaction handoff across the hold never yields an empty status", () => {
+	const transition = new StatusTransition();
+	const frames = [
+		transition.resolve("⠙ Working", "working", 0),
+		transition.resolve(undefined, undefined, 100),
+		transition.resolve(undefined, undefined, 100 + STATUS_HOLD_MS - 1),
+		transition.resolve("⠸ Compacting", "compaction", 100 + STATUS_HOLD_MS),
+	];
+
+	assert.ok(frames.every(frame => frame.status !== undefined));
+	assert.equal(frames.at(-1)?.kind, "compaction");
+});
+
+test("an undefined kind preserves the pre-0.86 working fade", () => {
+	const transition = new StatusTransition();
+	transition.resolve("⠙ Working", undefined, 0);
+	transition.resolve(undefined, undefined, 10);
+
+	const fadeStarts = transition.resolve(undefined, undefined, 10 + STATUS_HOLD_MS);
+	assert.equal(fadeStarts.status, "⠙ Working");
+	assert.equal(fadeStarts.leftFade, 1);
+	assert.equal(fadeStarts.pending, true);
+	assert.deepEqual(transition.resolve(undefined, undefined, 10 + STATUS_HOLD_MS + WORKING_FADE_MS), {
+		status: undefined,
+		kind: undefined,
+		pending: false,
+	});
+});
+
+test("reset clears live and exiting state", () => {
+	const transition = new StatusTransition();
+	transition.resolve("⠙ Working", "working", 10);
+	transition.resolve(undefined, undefined, 20);
+	transition.reset();
+
+	assert.deepEqual(transition.resolve(undefined, undefined, 21), {
+		status: undefined,
+		kind: undefined,
+		pending: false,
+	});
+	assert.equal(transition.pending(21), false);
+});