pi-tui-footer 1.2.0

package/extensions/footer.ts

@@ -0,0 +1,344 @@
+import type { ExtensionContext, Theme, ThemeColor } from "@earendil-works/pi-coding-agent";
+import { hostname as osHostname } from "node:os";
+import { truncateToWidth, visibleWidth, wrapTextWithAnsi } from "@earendil-works/pi-tui";
+import type { OpenTuiConfig } from "./config.ts";
+import type { IconGlyphs } from "./icons.ts";
+import { resolveGlyphs, resolveIconMode, runtimeSymbol } from "./icons.ts";
+import type { GitStatus } from "./git.ts";
+import type { RuntimeInfo } from "./runtime.ts";
+import {
+	alignRight,
+	basenamePath,
+	cacheHitColor,
+	effortColor,
+	fitSegmentsByPriority,
+	fmtTokens,
+	formatCwd,
+	formatDuration,
+	formatInputBreakdown,
+	providerColor,
+	sanitizeStatus,
+	stressColor,
+	truncateBranch,
+	truncatePath,
+	type PrioritizedSegment,
+} from "./utils.ts";
+import type { FooterState, ModelMeta, UsageTotals } from "./state.ts";
+import { getUsageTotals } from "./state.ts";
+
+export function shortHostname(hostname: string): string {
+	return hostname.split(".")[0] ?? "";
+}
+
+function renderBar(theme: Theme, pct: number, barWidth: number, ascii: boolean): string {
+	const filled = Math.max(0, Math.min(barWidth, Math.round((pct / 100) * barWidth)));
+	const empty = barWidth - filled;
+	const color = stressColor(pct);
+	// Use half-height parallelogram blocks (▰/▱) instead of full-height
+	// █/░ so the bar's visual height matches the surrounding [ ] brackets.
+	const filledCell = ascii ? "#" : "▰";
+	const emptyCell = ascii ? "-" : "▱";
+	return (
+		theme.fg("dim", "[") +
+		theme.fg(color, filledCell.repeat(filled)) +
+		theme.fg("dim", emptyCell.repeat(empty)) +
+		theme.fg("dim", "]")
+	);
+}
+
+/** Compact context form: icon + percentage, no bar or token counts. */
+function renderContextCompact(theme: Theme, ctx: ExtensionContext, glyphs: IconGlyphs): string {
+	const contextUsage = ctx.getContextUsage();
+	const contextWindow = contextUsage?.contextWindow ?? ctx.model?.contextWindow ?? 0;
+	if (contextWindow <= 0) return "";
+	const contextPct = contextUsage?.percent ?? 0;
+	return `${theme.fg(stressColor(contextPct), glyphs.context)} ${theme.fg(stressColor(contextPct), `${contextPct.toFixed(1)}%`)}`;
+}
+
+function renderGitSegment(
+	theme: Theme,
+	git: GitStatus,
+	glyphs: IconGlyphs,
+	segments: OpenTuiConfig["footerSegments"],
+	maxBranchLen = 20,
+): string {
+	const parts: string[] = [];
+	if (segments.gitBranch) {
+		if (git.branch) {
+			parts.push(theme.fg("mdLink", glyphs.git));
+			parts.push(theme.fg("mdLink", truncateBranch(git.branch, maxBranchLen)));
+		} else if (git.commit?.detached) {
+			parts.push(theme.fg("warning", glyphs.git));
+			parts.push(theme.fg("warning", "HEAD"));
+			if (git.commit.oid) {
+				const shortHash = git.commit.oid.slice(0, 7);
+				const tag = git.commit.tag ? ` ${git.commit.tag}` : "";
+				parts.push(theme.fg("dim", `${shortHash}${tag}`));
+			}
+		}
+	}
+
+	if (segments.gitStatus) {
+		const statusIcons: string[] = [];
+		// ponytail: always show count — `!1` not `!`, so 1 vs 100 is distinguishable.
+		const addStatus = (count: number, glyph: string, color: ThemeColor) => {
+			if (count > 0) statusIcons.push(theme.fg(color, `${glyph}${count}`));
+		};
+		addStatus(git.conflicted, glyphs.conflicted, "error");
+		addStatus(git.deleted, glyphs.deleted, "error");
+		addStatus(git.modified, glyphs.modified, "warning");
+		addStatus(git.renamed, glyphs.renamed, "warning");
+		addStatus(git.staged, glyphs.staged, "success");
+		addStatus(git.untracked, glyphs.untracked, "muted");
+		addStatus(git.stashed, glyphs.stashed, "muted");
+
+		if (git.ahead > 0 && git.behind > 0) {
+			statusIcons.push(theme.fg("warning", `${glyphs.diverged}${git.ahead}/${git.behind}`));
+		} else if (git.ahead > 0) {
+			statusIcons.push(theme.fg("success", `${glyphs.ahead}${git.ahead}`));
+		} else if (git.behind > 0) {
+			statusIcons.push(theme.fg("warning", `${glyphs.behind}${git.behind}`));
+		}
+
+		const statusBlock = statusIcons.join(" ");
+		if (statusBlock) {
+			parts.push(`${theme.fg("dim", "[")}${statusBlock}${theme.fg("dim", "]")}`);
+		}
+	}
+
+	return parts.join(" ");
+}
+
+function renderRuntimeSegment(
+	theme: Theme,
+	runtime: RuntimeInfo | null,
+	iconMode: OpenTuiConfig["icons"]["mode"],
+): string {
+	if (!runtime) return "";
+	const symbol = theme.fg("success", runtimeSymbol(runtime.name, iconMode));
+	const version = runtime.version ? theme.fg("muted", runtime.version) : "";
+	const label = [symbol, version].filter(Boolean).join(" ");
+	return label;
+}
+
+function renderTimerSegment(theme: Theme, state: FooterState, glyphs: IconGlyphs): string {
+	if (state.workingSince !== undefined) {
+		return `${theme.fg("accent", glyphs.working)} ${theme.fg("dim", "working")} ${theme.fg("accent", formatDuration(Date.now() - state.workingSince))}`;
+	}
+	if (state.lastDoneIn !== undefined) {
+		return `${theme.fg("success", glyphs.done)} ${theme.fg("success", "done")} ${theme.fg("text", formatDuration(state.lastDoneIn))}`;
+	}
+	return "";
+}
+
+function renderContextBar(
+	theme: Theme,
+	ctx: ExtensionContext,
+	width: number,
+	glyphs: IconGlyphs,
+	iconMode: OpenTuiConfig["icons"]["mode"],
+): string {
+	const contextUsage = ctx.getContextUsage();
+	const contextWindow = contextUsage?.contextWindow ?? ctx.model?.contextWindow ?? 0;
+	const contextTokens = contextUsage?.tokens ?? 0;
+	const contextPct = contextUsage?.percent ?? 0;
+
+	// ponytail: render 0% bar once we know the window — keeps the right side
+	// populated instead of collapsing everything left in an empty session.
+	if (contextWindow <= 0) return "";
+
+	const pctText = theme.fg(stressColor(contextPct), `${contextPct.toFixed(1)}%`);
+	const ctxText = `${theme.fg("text", fmtTokens(contextTokens))}${theme.fg("dim", "/")}${theme.fg("text", fmtTokens(contextWindow))}`;
+	const contextIcon = theme.fg(stressColor(contextPct), glyphs.context);
+	// Cap the bar at `width - reserved` (with a floor of 4) so the full form
+	// never forces the left segments out before compact/drop logic kicks in.
+	const reserved = visibleWidth(contextIcon) + visibleWidth(pctText) + visibleWidth(ctxText) + 5 + 2;
+	const barWidth = Math.max(4, Math.min(12, width - reserved));
+	return `${contextIcon} ${renderBar(theme, contextPct, barWidth, resolveIconMode(iconMode) === "ascii")} ${pctText} ${theme.fg("dim", "·")} ${ctxText}`;
+}
+
+function renderStatsBlock(
+	theme: Theme,
+	totals: UsageTotals,
+	glyphs: IconGlyphs,
+	segments: OpenTuiConfig["footerSegments"],
+): string {
+	const stats: string[] = [];
+	if (segments.tokens) {
+		stats.push(theme.fg("accent", `${glyphs.input} ${formatInputBreakdown(totals.input, totals.cacheRead)}`));
+		stats.push(theme.fg("success", `${glyphs.output} ${fmtTokens(totals.output)}`));
+		// ponytail: hide cache-hit rate when the provider never reported cache
+		// tokens — avoids a misleading "0%" on providers without prompt caching.
+		const hasCacheTokens = totals.cacheRead > 0 || totals.cacheWrite > 0;
+		if (hasCacheTokens && totals.latestCacheHitRate !== undefined) {
+			stats.push(theme.fg(cacheHitColor(totals.latestCacheHitRate), `${glyphs.cacheHit} ${totals.latestCacheHitRate.toFixed(1)}%`));
+		}
+	}
+	if (segments.cost) {
+		stats.push(theme.fg("warning", `${glyphs.cost} $${totals.cost.toFixed(3)}`));
+	}
+
+	return stats.join(` ${theme.fg("dim", "|")} `);
+}
+
+function renderExtensionStatusLines(
+	theme: Theme,
+	extensionStatuses: ReadonlyMap<string, string>,
+	glyphs: IconGlyphs,
+	width: number,
+): string[] {
+	const statuses = Array.from(extensionStatuses.entries())
+		.sort(([a], [b]) => a.localeCompare(b))
+		.map(([, text]) => sanitizeStatus(text))
+		.filter((text) => text.length > 0);
+	if (statuses.length === 0) return [];
+
+	const separator = ` ${theme.fg("dim", "|")} `;
+	const statusText = statuses.map((status) => theme.fg("muted", status)).join(separator);
+	const line = `${theme.fg("mdLink", glyphs.extensions)} ${statusText}`;
+	return wrapTextWithAnsi(line, width);
+}
+
+export interface FooterHooks {
+	setRequestRender: (fn: (() => void) | undefined) => void;
+	scheduleGitRefresh: () => void;
+}
+
+export function installFooter(
+	ctx: ExtensionContext,
+	getState: () => FooterState,
+	getConfig: () => OpenTuiConfig,
+	getModelMeta: () => ModelMeta,
+	hooks: FooterHooks,
+): () => void {
+	ctx.ui.setFooter((tui, theme, footerData) => {
+		hooks.setRequestRender(() => tui.requestRender());
+		const unsubBranch = footerData.onBranchChange(() => {
+			hooks.scheduleGitRefresh();
+			tui.requestRender();
+		});
+
+		return {
+			dispose() {
+				unsubBranch();
+				hooks.setRequestRender(undefined);
+			},
+			invalidate() {},
+			render(width: number): string[] {
+				if (width <= 0) return [""];
+				const state = getState();
+				const config = getConfig();
+				const glyphs = resolveGlyphs(config.icons.mode);
+				const segments = config.footerSegments;
+				const meta = getModelMeta();
+
+				const totals = getUsageTotals(ctx);
+
+				const leftParts: PrioritizedSegment[] = [];
+				if (segments.cwd) {
+					const maxCwd = Math.min(30, Math.max(10, Math.floor(width * 0.4)));
+					const cwd = formatCwd(ctx.sessionManager.getCwd());
+					const cwdPrefix = `${theme.fg("mdLink", glyphs.cwd)} `;
+					const accent = (text: string) => theme.fg("accent", text);
+					leftParts.push({
+						text: `${cwdPrefix}${accent(truncatePath(cwd, maxCwd))}`,
+						compactText: `${cwdPrefix}${accent(truncatePath(basenamePath(cwd), maxCwd))}`,
+						priority: 0,
+						truncate: (_text, maxWidth, ellipsis) => {
+							const pathWidth = maxWidth - visibleWidth(cwdPrefix);
+							if (pathWidth <= visibleWidth(ellipsis)) {
+								return truncateToWidth(`${cwdPrefix}${accent(basenamePath(cwd))}`, maxWidth, ellipsis);
+							}
+							return `${cwdPrefix}${accent(truncatePath(basenamePath(cwd), pathWidth))}`;
+						},
+					});
+				}
+				if (segments.hostname) {
+					const shortHost = shortHostname(osHostname());
+					if (shortHost) {
+						leftParts.push({
+							text: `${theme.fg("dim", glyphs.host)} ${theme.fg("accent", shortHost)}`,
+							priority: 1,
+						});
+					}
+				}
+				if (segments.sessionName) {
+					const sessionName = ctx.sessionManager.getSessionName();
+					if (sessionName) {
+						leftParts.push({
+							text: `${theme.fg("dim", glyphs.session)} ${theme.fg("text", truncateToWidth(sessionName, 24, theme.fg("dim", "...")))}`,
+							priority: 2,
+						});
+					}
+				}
+				const gitSeg = renderGitSegment(theme, state.git, glyphs, segments);
+				if (gitSeg) leftParts.push({ text: gitSeg, priority: 3 });
+				if (segments.runtime) {
+					const runtimeSeg = renderRuntimeSegment(theme, state.runtime, config.icons.mode);
+					if (runtimeSeg) leftParts.push({ text: runtimeSeg, priority: 4 });
+				}
+				const timerSeg = renderTimerSegment(theme, state, glyphs);
+				if (timerSeg) leftParts.push({ text: timerSeg, priority: 1 });
+
+				// The context bar competes with the left segments for the same row:
+				// full bar first, then the compact icon+pct form, then dropped.
+				let contextText = "";
+				let contextCompact: string | undefined;
+				if (segments.context) {
+					contextText = renderContextBar(theme, ctx, width, glyphs, config.icons.mode);
+					const compact = renderContextCompact(theme, ctx, glyphs);
+					if (compact && visibleWidth(compact) < visibleWidth(contextText)) {
+						contextCompact = compact;
+					}
+				}
+				const allParts: PrioritizedSegment[] = [...leftParts];
+				if (contextText) {
+					// ponytail: priority 4 = sheds with runtime, before git/timer/cwd.
+					allParts.push({ text: contextText, compactText: contextCompact, priority: 4 });
+				}
+
+				const fitted = fitSegmentsByPriority(allParts, width, theme.fg("dim", "..."));
+				const fittedContext = contextText ? fitted.pop() ?? "" : "";
+				const line1 = alignRight(fitted.join(" "), fittedContext, width, theme);
+
+				const modelParts: string[] = [];
+				modelParts.push(theme.fg("mdLink", glyphs.model));
+				if (meta.provider && meta.provider !== "Unknown") {
+					modelParts.push(theme.fg(providerColor(ctx.model?.provider ?? "none"), meta.provider));
+				}
+				modelParts.push(theme.fg("text", meta.model));
+				if (meta.effort && meta.effort !== "off") {
+					modelParts.push(theme.fg(effortColor(meta.effort), `${glyphs.thinking} ${meta.effort}`));
+				}
+				const modelBlock = modelParts.join(theme.fg("dim", " · "));
+
+				const statsBlock = renderStatsBlock(
+					theme,
+					totals,
+					glyphs,
+					segments,
+				);
+
+				const line2 = alignRight(modelBlock, statsBlock, width, theme);
+
+				const mainLines = [line1, line2]
+					.map((line) => truncateToWidth(line, width, theme.fg("dim", "...")));
+				return segments.extensionStatuses
+					? [
+						...mainLines,
+						...renderExtensionStatusLines(
+							theme,
+							footerData.getExtensionStatuses(),
+							glyphs,
+							width,
+						),
+					]
+					: mainLines;
+			},
+		};
+	});
+
+	return () => {
+		ctx.ui.setFooter(undefined);
+	};
+}

package/extensions/fullscreen-scroll.ts

@@ -0,0 +1,34 @@
+import type { TUI } from "@earendil-works/pi-tui";
+
+export const MIN_FULLSCREEN_WHEEL_SCROLL_LINES = 1;
+export const MAX_FULLSCREEN_WHEEL_SCROLL_LINES = 10;
+export const DEFAULT_FULLSCREEN_WHEEL_SCROLL_LINES = 4;
+
+export function normalizeFullscreenWheelScrollLines(
+	value: unknown,
+	fallback = DEFAULT_FULLSCREEN_WHEEL_SCROLL_LINES,
+): number {
+	if (typeof value !== "number" || !Number.isFinite(value)) return fallback;
+	return Math.min(
+		MAX_FULLSCREEN_WHEEL_SCROLL_LINES,
+		Math.max(MIN_FULLSCREEN_WHEEL_SCROLL_LINES, Math.floor(value)),
+	);
+}
+
+type FullscreenWheelTui = TUI & { wheelScrollLines?: unknown };
+
+/**
+ * Pi 0.84.2 keeps this constructor option in a private runtime field. Remove
+ * this shim once Pi exposes a public setter; incompatible versions are no-ops.
+ */
+export function applyFullscreenWheelScrollLines(tui: TUI, value: number): boolean {
+	try {
+		const fullscreenTui = tui as FullscreenWheelTui;
+		if (fullscreenTui.mode !== "fullscreen" || typeof fullscreenTui.wheelScrollLines !== "number") {
+			return false;
+		}
+		return Reflect.set(fullscreenTui, "wheelScrollLines", normalizeFullscreenWheelScrollLines(value));
+	} catch {
+		return false;
+	}
+}

package/extensions/git.ts

@@ -0,0 +1,151 @@
+import { execFile } from "node:child_process";
+import { promisify } from "node:util";
+
+const execFileAsync = promisify(execFile);
+const GIT_TIMEOUT_MS = 2000;
+
+export interface GitCommitInfo {
+	oid: string | null;
+	detached: boolean;
+	tag: string | null;
+}
+
+export interface GitStatus {
+	branch: string | undefined;
+	ahead: number;
+	behind: number;
+	modified: number;
+	untracked: number;
+	staged: number;
+	stashed: number;
+	conflicted: number;
+	renamed: number;
+	deleted: number;
+	commit: GitCommitInfo | null;
+}
+
+export function emptyGitStatus(): GitStatus {
+	return {
+		branch: undefined,
+		ahead: 0,
+		behind: 0,
+		modified: 0,
+		untracked: 0,
+		staged: 0,
+		stashed: 0,
+		conflicted: 0,
+		renamed: 0,
+		deleted: 0,
+		commit: null,
+	};
+}
+
+async function gitExec(args: string[], cwd: string): Promise<string | null> {
+	try {
+		const { stdout } = await execFileAsync("git", args, {
+			cwd,
+			timeout: GIT_TIMEOUT_MS,
+			maxBuffer: 1024 * 1024,
+		});
+		return stdout;
+	} catch {
+		return null;
+	}
+}
+
+export async function readGitStatus(
+	cwd: string,
+	options: { readCommit?: boolean; readTag?: boolean; readCounts?: boolean } = {},
+): Promise<GitStatus> {
+	const stdout = await gitExec(
+		["status", "--porcelain=v1", "--branch", "--show-stash"],
+		cwd,
+	);
+	if (stdout === null) {
+		return emptyGitStatus();
+	}
+
+	const status = emptyGitStatus();
+	const lines = stdout.split("\n");
+	let stashSupported = true;
+
+	for (const line of lines) {
+		if (line.startsWith("## ")) {
+			const branchPart = line.slice(3);
+			const detached = branchPart.startsWith("HEAD (no branch)");
+			if (detached) {
+				status.branch = undefined;
+				status.commit = { oid: null, detached: true, tag: null };
+			} else {
+				const branchMatch = branchPart.match(/^(\S+?)(?:\.\.\.(\S+))?(?:\s+\[(ahead|behind) (\d+)\])?$/);
+				if (branchMatch) {
+					status.branch = branchMatch[1];
+					if (branchMatch[3] === "ahead") status.ahead = parseInt(branchMatch[4]!, 10);
+					if (branchMatch[3] === "behind") status.behind = parseInt(branchMatch[4]!, 10);
+				}
+			}
+			continue;
+		}
+
+		if (line.startsWith("# stash ")) {
+			const stashCount = parseInt(line.slice(8).trim(), 10);
+			if (!Number.isNaN(stashCount)) {
+				status.stashed = stashCount;
+				stashSupported = true;
+			}
+			continue;
+		}
+
+		// ponytail: skip file-entry counting when only branch/commit display is on;
+		// the first `git status` call itself can't be split, but the stash fallback below can.
+		if (options.readCounts === false) continue;
+		if (line.length < 3) continue;
+		const x = line[0]!;
+		const y = line[1]!;
+
+		if (x === "U" || y === "U" || (x === "C" && y === "C")) status.conflicted++;
+		else if (x === "?" && y === "?") status.untracked++;
+		else if (x === "R") status.renamed++;
+		else if (x === "D" || y === "D") status.deleted++;
+		else {
+			if (x !== " " && x !== "?") status.staged++;
+			if (y === "M" || y === "D") status.modified++;
+		}
+	}
+
+	if (options.readCounts !== false && stashSupported && status.stashed === 0 && !stdout.includes("# stash")) {
+		const stashOut = await gitExec(["stash", "list", "--count"], cwd);
+		if (stashOut !== null) {
+			const count = parseInt(stashOut.trim(), 10);
+			if (!Number.isNaN(count)) status.stashed = count;
+		}
+	}
+
+	if (options.readCommit && status.commit?.detached) {
+		const oid = await gitExec(["rev-parse", "HEAD"], cwd);
+		if (oid) {
+			status.commit.oid = oid.trim();
+		}
+		if (options.readTag) {
+			const tag = await gitExec(["describe", "--tags", "--exact-match", "HEAD"], cwd);
+			if (tag) {
+				status.commit.tag = tag.trim();
+			}
+		}
+	}
+
+	return status;
+}
+
+export function hasGitChanges(s: GitStatus): boolean {
+	return (
+		s.modified > 0 ||
+		s.untracked > 0 ||
+		s.staged > 0 ||
+		s.conflicted > 0 ||
+		s.renamed > 0 ||
+		s.deleted > 0 ||
+		s.ahead > 0 ||
+		s.behind > 0
+	);
+}