pi-libtui 0.3.2

package/test/request-animation.test.ts

@@ -0,0 +1,193 @@
+import { afterEach, beforeEach, describe, expect, test } from "bun:test";
+import type { ExtensionAPI, Theme } from "@earendil-works/pi-coding-agent";
+import { configureTuiAppearance, DEFAULT_TUI_APPEARANCE } from "../src/appearance.ts";
+import type { MotionClock, MotionTimerHandle } from "../src/motion.ts";
+import { MotionScheduler } from "../src/motion.ts";
+import { registerRequestAnimation, RequestAnimationController } from "../src/request-animation.ts";
+
+const theme = {
+	name: "request-animation-test",
+	getColorMode: () => "truecolor",
+	getFgAnsi: (token: string) => (token === "accent" ? "\x1b[38;2;80;160;240m" : "\x1b[38;2;180;180;180m"),
+	getBgAnsi: () => "\x1b[48;2;20;20;20m",
+} as never as Theme;
+
+interface FakeTimer extends MotionTimerHandle {
+	callback: () => void;
+	cadenceMs: number;
+	stopped: boolean;
+}
+
+class FakeClock implements MotionClock {
+	currentMs = 0;
+	readonly timers: FakeTimer[] = [];
+
+	now(): number {
+		return this.currentMs;
+	}
+
+	start(callback: () => void, cadenceMs: number): FakeTimer {
+		const timer = { callback, cadenceMs, stopped: false };
+		this.timers.push(timer);
+		return timer;
+	}
+
+	stop(handle: MotionTimerHandle): void {
+		(handle as FakeTimer).stopped = true;
+	}
+}
+
+class FakeUi {
+	readonly theme = theme;
+	readonly indicators: Array<{ frames?: string[] } | undefined> = [];
+	readonly messages: Array<string | undefined> = [];
+
+	setWorkingIndicator(indicator?: { frames?: string[] }): void {
+		this.indicators.push(indicator);
+	}
+
+	setWorkingMessage(message?: string): void {
+		this.messages.push(message);
+	}
+
+	get text(): string {
+		return Bun.stripANSI(this.messages.at(-1) ?? "");
+	}
+}
+
+beforeEach(() => configureTuiAppearance(DEFAULT_TUI_APPEARANCE));
+afterEach(() => configureTuiAppearance(DEFAULT_TUI_APPEARANCE));
+
+describe("request animation", () => {
+	test("retains live appearance updates across session switches", async () => {
+		type LifecycleHandler = (event: { reason?: string }, context: { ui: FakeUi }) => void | Promise<void>;
+		// type-boundary: The registration harness implements only ExtensionAPI.on for lifecycle behavior.
+		type ExtensionApiBoundary = unknown;
+		const handlers = new Map<string, LifecycleHandler>();
+		const boundary: ExtensionApiBoundary = {
+			on(name: string, handler: LifecycleHandler) {
+				handlers.set(name, handler);
+			},
+		};
+		registerRequestAnimation(boundary as ExtensionAPI);
+		const first = new FakeUi();
+		await handlers.get("agent_start")?.({}, { ui: first });
+		await handlers.get("session_shutdown")?.({ reason: "switch" }, { ui: first });
+
+		const second = new FakeUi();
+		await handlers.get("agent_start")?.({}, { ui: second });
+		configureTuiAppearance({ activityIndicator: "static", textEffect: "off" });
+
+		expect(second.text).toBe("● Working...");
+		await handlers.get("session_shutdown")?.({ reason: "reload" }, { ui: second });
+	});
+
+	test("tracks thinking, parallel tools, and working with the documented priority", () => {
+		const clock = new FakeClock();
+		const ui = new FakeUi();
+		const controller = new RequestAnimationController({
+			now: () => clock.now(),
+			scheduler: new MotionScheduler(clock),
+		});
+
+		controller.start({ ui });
+		expect(ui.indicators.at(-1)).toEqual({ frames: [] });
+		expect(ui.text).toContain("Working...");
+
+		controller.startTool("first");
+		controller.startTool("second");
+		expect(ui.text).toContain("Running...");
+
+		controller.setThinking(true);
+		expect(ui.text).toContain("Thinking...");
+		controller.finishTool("first");
+		expect(ui.text).toContain("Thinking...");
+
+		controller.setThinking(false);
+		expect(ui.text).toContain("Running...");
+		controller.finishTool("second");
+		expect(ui.text).toContain("Working...");
+
+		controller.finish({ ui });
+		expect(ui.messages.at(-1)).toBeUndefined();
+		expect(ui.indicators.at(-1)).toBeUndefined();
+		controller.dispose();
+	});
+
+	test("applies phase indicator and text-effect overrides without changing the defaults", () => {
+		configureTuiAppearance({
+			activityIndicator: "spinner",
+			textEffect: "off",
+			thinkingIndicator: "off",
+			thinkingTextEffect: "off",
+			toolIndicator: "static",
+		});
+		const clock = new FakeClock();
+		const ui = new FakeUi();
+		const controller = new RequestAnimationController({
+			now: () => clock.now(),
+			scheduler: new MotionScheduler(clock),
+		});
+
+		controller.start({ ui });
+		expect(ui.text).toBe("⠋ Working...");
+		controller.setThinking(true);
+		expect(ui.text).toBe("Thinking...");
+		controller.setThinking(false);
+		controller.startTool("tool");
+		expect(ui.text).toBe("● Running...");
+
+		controller.dispose({ ui });
+	});
+
+	test("uses exclusive status scenes intentionally and resolves phase overrides", () => {
+		configureTuiAppearance({
+			statusPresentation: "block-wave",
+			thinkingPresentation: "pacman",
+			toolPresentation: "standard",
+		});
+		const clock = new FakeClock();
+		const ui = new FakeUi();
+		const controller = new RequestAnimationController({
+			now: () => clock.now(),
+			scheduler: new MotionScheduler(clock),
+			width: () => 24,
+		});
+
+		controller.start({ ui });
+		expect(ui.text).toMatch(/[█▓▒]/u);
+		expect(ui.text).not.toContain("Working...");
+
+		controller.setThinking(true);
+		expect(ui.text).toMatch(/[ᗧC]/u);
+		expect(ui.text).not.toContain("Thinking...");
+
+		controller.setThinking(false);
+		controller.startTool("tool");
+		expect(ui.text).toContain("Running...");
+
+		controller.dispose({ ui });
+	});
+
+	test("composes text effects and message sources with the configured indicator", () => {
+		configureTuiAppearance({ activityIndicator: "static", textEffect: "aurora" });
+		const clock = new FakeClock();
+		const ui = new FakeUi();
+		const controller = new RequestAnimationController({
+			now: () => clock.now(),
+			scheduler: new MotionScheduler(clock),
+		});
+
+		controller.start({ ui });
+		expect(ui.text).toBe("● Working...");
+		clock.currentMs = 350;
+		clock.timers.at(-1)?.callback();
+		expect(new Set((ui.messages.at(-1) ?? "").match(/\x1b\[38;[^m]+m/gu) ?? []).size).toBeGreaterThan(1);
+
+		configureTuiAppearance({ textEffect: "off", activityMessage: "typewriter" });
+		expect(ui.text).toStartWith("● ");
+		expect(ui.text).not.toContain("Working...");
+
+		controller.dispose({ ui });
+	});
+});

package/test/screen-icon-actions.test.ts

@@ -0,0 +1,69 @@
+import { expect, test } from "bun:test";
+import type { Theme } from "@earendil-works/pi-coding-agent";
+import { mountScreenIconActions } from "../src/controls/screen-icon-actions.ts";
+import { getMouseRegistryState } from "../src/mouse/registry.ts";
+import { ensureMouseRegistry } from "../src/mouse.ts";
+
+const theme = {
+	name: "screen-actions-test",
+	bold: (text: string) => text,
+	getFgAnsi: () => "\x1b[38;2;120;160;220m",
+	getBgAnsi: () => "\x1b[48;2;20;24;30m",
+} as never as Theme;
+
+test("mounts icon-only top-right actions with pointer tooltips", () => {
+	const registry = ensureMouseRegistry(Object.create(null) as typeof globalThis);
+	const activated: string[] = [];
+	let visible = true;
+	const mount = mountScreenIconActions({
+		id: "test.actions",
+		theme,
+		registry,
+		actions: [
+			{ value: "expand", glyph: "󰘖", tooltip: "Expand side panel", shortcuts: ["alt+shift+z"], visible: () => visible },
+			{ value: "toggle", glyph: "", tooltip: "Hide side panel" },
+		],
+		onActivate: (value) => activated.push(value),
+	});
+	const blank = Array.from({ length: 6 }, () => " ".repeat(40));
+	const context = { width: 40, height: 6, hasOverlay: false } as const;
+	const rendered = Bun.stripANSI(registry.dispatchScreenDecorators(blank, context).join("\n"));
+	expect(rendered.split("\n")[0]).toContain("󰘖");
+	expect(rendered.split("\n")[0]).toContain("");
+	expect(rendered).not.toContain("Expand side panel");
+	expect(mount.reservedWidth).toBe(7);
+
+	const expand = getMouseRegistryState(registry).regions.find((region) => region.id === "test.actions.expand");
+	expect(expand?.getRect()?.y).toBe(0);
+	expand?.onMouse(mouse("move"));
+	const hovered = Bun.stripANSI(registry.dispatchScreenDecorators(blank, context).join("\n"));
+	expect(hovered).toContain("Expand side panel");
+	expect(hovered).toContain("⌥");
+	expect(hovered).toContain("⇧");
+	expect(hovered).not.toContain("╭");
+	expand?.onMouse(mouse("release", undefined));
+	expect(activated).toEqual(["expand"]);
+	expand?.onMouse(mouse("press"));
+	expand?.onMouse(mouse("release", undefined));
+	expect(activated).toEqual(["expand", "expand"]);
+
+	visible = false;
+	registry.dispatchScreenDecorators(blank, context);
+	expect(expand?.getRect()).toBeUndefined();
+	mount.dispose();
+});
+
+function mouse(type: "move" | "press" | "release", button: 0 | undefined = type === "move" ? undefined : 0) {
+	return {
+		type,
+		row: 0,
+		col: 0,
+		screenRow: 0,
+		screenCol: 0,
+		button,
+		wheel: undefined,
+		shift: false,
+		alt: false,
+		ctrl: false,
+	} as const;
+}

package/test/select-box.test.ts

@@ -0,0 +1,86 @@
+import { describe, expect, test } from "bun:test";
+import { initTheme, type Theme } from "@earendil-works/pi-coding-agent";
+import {
+	CURSOR_MARKER,
+	KeybindingsManager,
+	setKeybindings,
+	stripTerminalSequences,
+	TUI_KEYBINDINGS,
+} from "@earendil-works/pi-tui";
+import { tuiTheme } from "../src/color/theme.ts";
+import { SelectBox } from "../src/controls/select-box.ts";
+
+describe("SelectBox", () => {
+	const theme = {
+		bold: (text: string) => text,
+		fg: (_color: string, text: string) => text,
+		bg: (_color: string, text: string) => text,
+		underline: (text: string) => text,
+	} as Theme;
+
+	test("selects immediately without modal action buttons", () => {
+		initTheme("dark", false);
+		setKeybindings(new KeybindingsManager(TUI_KEYBINDINGS));
+		const selected: string[] = [];
+		const previewed: string[] = [];
+		const box = new SelectBox({
+			theme,
+			bordered: false,
+			options: [
+				{ value: "one", label: "One" },
+				{ value: "two", label: "Two" },
+			],
+			selected: "one",
+			onSelect: (value) => selected.push(value),
+			onPreview: (value) => previewed.push(value),
+			onCancel() {},
+		});
+		box.focused = true;
+
+		const rendered = box.render(20).map(stripTerminalSequences).join("\n");
+		const initial = box.render(20).join("\n");
+		expect(initial).toContain(CURSOR_MARKER);
+		const colors = tuiTheme(theme);
+		const darkerSelected = colors.adjustForegroundBrightness(colors.color("surface.selected"), -0.08);
+		expect(initial).toContain(colors.bgAnsi(darkerSelected));
+		expect(initial).not.toContain(colors.bgAnsi("surface.selected"));
+		box.onMouse({ type: "move", row: 2, col: 3 } as never);
+		const darkerHover = colors.adjustForegroundBrightness(colors.color("surface.hover"), -0.08);
+		expect(box.render(20).join("\n")).toContain(colors.bgAnsi(darkerHover));
+		expect(rendered.split("\n")[0]).not.toContain("> ");
+		expect(rendered).not.toContain("╭");
+		expect(rendered).toContain("Two");
+		expect(rendered).not.toContain("Save");
+		expect(rendered).not.toContain("Cancel");
+		box.handleInput("T");
+		box.handleInput("w");
+		expect(previewed).toEqual(["two"]);
+		const filtered = box.render(20).join("\n");
+		expect(stripTerminalSequences(filtered)).not.toContain("One");
+		expect(filtered).toContain(colors.fgAnsi("highlight"));
+		box.handleInput("\r");
+		expect(selected).toEqual(["two"]);
+	});
+
+	test("supports a full-pane preview surface", () => {
+		initTheme("dark", false);
+		setKeybindings(new KeybindingsManager(TUI_KEYBINDINGS));
+		const box = new SelectBox({
+			theme,
+			title: "Composition",
+			bordered: false,
+			showHint: true,
+			options: [{ value: "compact", label: "Compact" }],
+			onSelect() {},
+			onCancel() {},
+			renderPreview: () => ["large preview"],
+		});
+
+		const rendered = box.render(40).map(stripTerminalSequences).join("\n");
+		expect(rendered).toStartWith("Composition\n");
+		expect(rendered).toContain("large preview");
+		expect(rendered).toContain("select");
+		expect(rendered).toContain("back");
+		expect(rendered).not.toContain("╭");
+	});
+});