pi-open-tui 0.2.3 → 0.2.5

package/extensions/open-tui/editor.ts

@@ -3,7 +3,6 @@ import {
 	type ExtensionAPI,
 	type ExtensionContext,
 	type KeybindingsManager,
-	type Theme,
 } from "@earendil-works/pi-coding-agent";
 import type { EditorTheme, TUI } from "@earendil-works/pi-tui";
 import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
@@ -45,11 +44,13 @@ export class OpenTuiEditor extends CustomEditor {
 		tui: TUI,
 		editorTheme: EditorTheme,
 		keybindings: KeybindingsManager,
-		getUiTheme: () => Theme,
 	) {
 		super(tui, editorTheme, keybindings, { paddingX: 0 });
-		this.getRail = () => getUiTheme().fg("accent", "│");
-		this.getBorder = (s: string) => getUiTheme().fg("borderMuted", s);
+		// ponytail: route the frame through this.borderColor so Pi can recolor it
+		// via updateEditorBorderColor() — bash mode ("! " prefix → green) and
+		// thinking-level borders both flow through this one property.
+		this.getRail = () => this.borderColor("│");
+		this.getBorder = (s: string) => this.borderColor(s);
 	}
 
 	override setPaddingX(_padding: number): void {
@@ -62,9 +63,8 @@ export class OpenTuiEditor extends CustomEditor {
 
 		const rail = this.getRail();
 		const borderPaint = this.getBorder;
-		const railWidth = 2;
-
-		const innerWidth = Math.max(0, width - railWidth);
+		// ponytail: 1-char rail + 1-char gap on each side = 4 chars of chrome.
+		const innerWidth = Math.max(0, width - 4);
 		const baseLines = super.render(innerWidth);
 		const bottomIdx = findBottomBorderIndex(baseLines);
 
@@ -74,9 +74,9 @@ export class OpenTuiEditor extends CustomEditor {
 		for (let i = 1; i < bottomIdx; i++) {
 			const line = baseLines[i] ?? "";
 			if (isEditorBorderLine(line)) {
-				result.push(`${rail} ${fillLine("", innerWidth)}`);
+				result.push(`${rail} ${fillLine("", innerWidth)} ${rail}`);
 			} else {
-				result.push(`${rail} ${fillLine(line, innerWidth)}`);
+				result.push(`${rail} ${fillLine(line, innerWidth)} ${rail}`);
 			}
 		}
 
@@ -91,9 +91,8 @@ export class OpenTuiEditor extends CustomEditor {
 }
 
 export function installEditor(_pi: ExtensionAPI, ctx: ExtensionContext): () => void {
-	const getUiTheme = () => ctx.ui.theme;
 	ctx.ui.setEditorComponent((tui, editorTheme, keybindings) =>
-		new OpenTuiEditor(tui, editorTheme, keybindings, getUiTheme),
+		new OpenTuiEditor(tui, editorTheme, keybindings),
 	);
 	return () => {
 		ctx.ui.setEditorComponent(undefined);

package/extensions/open-tui/footer.ts

@@ -9,6 +9,7 @@ import {
 	alignRight,
 	cacheHitColor,
 	effortColor,
+	fitSegmentsByPriority,
 	fmtTokens,
 	formatCwd,
 	formatDuration,
@@ -16,6 +17,7 @@ import {
 	providerColor,
 	sanitizeStatus,
 	stressColor,
+	truncatePath,
 } from "./utils.ts";
 import type { FooterState, ModelMeta, UsageTotals } from "./state.ts";
 import { getUsageTotals } from "./state.ts";
@@ -39,35 +41,37 @@ function renderGitSegment(
 	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("success", git.branch));
+			parts.push(theme.fg("mdLink", truncatePath(git.branch, maxBranchLen)));
 		} else if (git.commit?.detached) {
-			parts.push(theme.fg("mdLink", glyphs.git));
-			parts.push(theme.fg("success", "HEAD"));
-			if (segments.gitCommit && git.commit.oid) {
+			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("success", `(${shortHash}${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 > 1 ? count : ""}`));
+			if (count > 0) statusIcons.push(theme.fg(color, `${glyph}${count}`));
 		};
 		addStatus(git.conflicted, glyphs.conflicted, "error");
-		addStatus(git.stashed, glyphs.stashed, "muted");
 		addStatus(git.deleted, glyphs.deleted, "error");
-		addStatus(git.renamed, glyphs.renamed, "warning");
 		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}`));
@@ -128,7 +132,7 @@ function renderContextBar(
 	const ctxText = `${theme.fg("text", fmtTokens(contextTokens))}${theme.fg("dim", "/")}${theme.fg("text", fmtTokens(contextWindow))}`;
 	const contextIcon = theme.fg(stressColor(contextPct), glyphs.context);
 	const reserved = visibleWidth(contextIcon) + visibleWidth(pctText) + visibleWidth(ctxText) + 5 + 2;
-	const barWidth = Math.max(6, Math.min(16, width - reserved));
+	const barWidth = Math.max(4, Math.min(12, width - reserved));
 	return `${contextIcon} ${renderBar(theme, contextPct, barWidth, resolveIconMode(iconMode) === "ascii")} ${pctText} ${theme.fg("dim", "·")} ${ctxText}`;
 }
 
@@ -209,25 +213,32 @@ export function installFooter(
 
 				const totals = getUsageTotals(ctx);
 
-				const leftParts: string[] = [];
+				const leftParts: { text: string; priority: number }[] = [];
 				if (segments.cwd) {
-					leftParts.push(`${theme.fg("mdLink", glyphs.cwd)} ${theme.fg("accent", formatCwd(ctx.sessionManager.getCwd()))}`);
+					const maxCwd = Math.min(30, Math.max(10, Math.floor(width * 0.4)));
+					leftParts.push({
+						text: `${theme.fg("mdLink", glyphs.cwd)} ${theme.fg("accent", truncatePath(formatCwd(ctx.sessionManager.getCwd()), maxCwd))}`,
+						priority: 0,
+					});
 				}
 				const gitSeg = renderGitSegment(theme, state.git, glyphs, segments);
-				if (gitSeg) leftParts.push(gitSeg);
+				if (gitSeg) leftParts.push({ text: gitSeg, priority: 3 });
 				if (segments.runtime) {
 					const runtimeSeg = renderRuntimeSegment(theme, state.runtime, config.icons.mode);
-					if (runtimeSeg) leftParts.push(runtimeSeg);
+					if (runtimeSeg) leftParts.push({ text: runtimeSeg, priority: 1 });
 				}
 				const timerSeg = renderTimerSegment(theme, state, glyphs);
-				if (timerSeg) leftParts.push(timerSeg);
+				if (timerSeg) leftParts.push({ text: timerSeg, priority: 2 });
 
 				let rightBlock = "";
 				if (segments.context) {
 					rightBlock = renderContextBar(theme, ctx, width, glyphs, config.icons.mode);
 				}
 
-				const line1 = alignRight(leftParts.join(" "), rightBlock, width, theme);
+				const rightW = visibleWidth(rightBlock);
+				const availLeft = Math.max(0, width - rightW - (rightBlock ? 1 : 0));
+				const fittedLeft = fitSegmentsByPriority(leftParts, availLeft, theme.fg("dim", "..."));
+				const line1 = alignRight(fittedLeft.join(" "), rightBlock, width, theme);
 
 				const modelParts: string[] = [];
 				modelParts.push(theme.fg("mdLink", glyphs.model));

package/extensions/open-tui/git.ts

@@ -83,7 +83,7 @@ export async function readGitStatus(
 				status.branch = undefined;
 				status.commit = { oid: null, detached: true, tag: null };
 			} else {
-				const branchMatch = branchPart.match(/^(\S+?)(?:\.\.\.(\S+))?(?:\s+\[(ahead|behind) (\d+)\])?/);
+				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);

package/extensions/open-tui/index.ts

@@ -101,7 +101,7 @@ export default function (pi: ExtensionAPI) {
 		const generation = sessionLifecycle.currentGeneration();
 		const cwd = ctx.cwd;
 		const git = await readGitStatus(cwd, {
-			readCommit: config.footerSegments.gitCommit,
+			readCommit: true,
 			readTag: config.footerSegments.gitCommit,
 		});
 		if (!sessionLifecycle.isCurrent(generation)) return;

package/extensions/open-tui/utils.ts

@@ -24,6 +24,26 @@ export function formatCwd(cwd: string): string {
 	return rel === "" ? "~" : `~${sep}${rel}`;
 }
 
+export function truncatePath(path: string, maxLen: number): string {
+	if (path.length <= maxLen) return path;
+	if (maxLen <= 3) return "...".slice(0, maxLen);
+	const sepChar = path.includes("/") ? "/" : "\\";
+	const parts = path.split(/[\\/]/);
+	if (parts.length <= 2) return path.slice(0, maxLen - 3) + "...";
+	// Keep first segment (e.g. ~) and as many trailing segments as fit.
+	const tail: string[] = [];
+	let tailLen = 0;
+	for (let i = parts.length - 1; i >= 1; i--) {
+		const seg = parts[i]!;
+		if (tailLen + seg.length + 4 > maxLen) break;
+		tail.unshift(seg);
+		tailLen += seg.length + 1;
+	}
+	const head = parts[0]!;
+	const result = `${head}${sepChar}...${sepChar}${tail.join(sepChar)}`;
+	return result.length > maxLen ? result.slice(0, maxLen - 3) + "..." : result;
+}
+
 export function fmtTokens(n: number): string {
 	if (n < 1000) return n.toString();
 	if (n < 10_000) return `${(n / 1000).toFixed(1)}k`;
@@ -70,6 +90,51 @@ export function alignRight(left: string, right: string, width: number, theme: Th
 	return truncatedLeft ? truncatedLeft + " " + right : right;
 }
 
+export type PrioritizedSegment = {
+	text: string;
+	priority: number;
+};
+
+/**
+ * Pack segments into maxWidth, shrinking/dropping lowest-priority segments first.
+ * Higher priority = survives longer. Returns the surviving segment texts in
+ * original order, space-joined. Each segment is either kept whole, truncated
+ * with ellipsis, or dropped entirely.
+ */
+export function fitSegmentsByPriority(
+	segs: readonly PrioritizedSegment[],
+	maxW: number,
+	ellipsis = "...",
+): string[] {
+	const items = segs.map((s) => ({ text: s.text, priority: s.priority, w: visibleWidth(s.text) }));
+	const totalW = () => {
+		const active = items.filter((it) => it.text !== "");
+		return active.reduce((a, it) => a + it.w, 0) + Math.max(0, active.length - 1);
+	};
+	while (totalW() > maxW) {
+		let target = -1;
+		for (let i = 0; i < items.length; i++) {
+			if (items[i].text !== "" && (target === -1 || items[i].priority < items[target].priority)) {
+				target = i;
+			}
+		}
+		if (target === -1) break;
+		const others = items.filter((_, i) => i !== target && items[i].text !== "");
+		const otherW = others.reduce((a, it) => a + it.w, 0) + Math.max(0, others.length - 1);
+		const avail = maxW - otherW - (others.length > 0 ? 1 : 0);
+		if (avail <= visibleWidth(ellipsis)) {
+			items[target].text = "";
+			items[target].w = 0;
+		} else if (avail < items[target].w) {
+			items[target].text = truncateToWidth(items[target].text, avail, ellipsis);
+			items[target].w = visibleWidth(items[target].text);
+		} else {
+			break;
+		}
+	}
+	return items.filter((it) => it.text !== "").map((it) => it.text);
+}
+
 export function stressColor(value: number, warn = 70, danger = 90): ThemeColor {
 	if (value >= danger) return "error";
 	if (value >= warn) return "warning";

package/package.json

@@ -1,8 +1,12 @@
 {
   "name": "pi-open-tui",
-  "version": "0.2.3",
+  "version": "0.2.5",
   "description": "A polished TUI for Pi coding agent: animated logo header, Starship-style footer, rounded editor with model metadata, and prompt-box user messages. Combines the best of pi-haiku, pi-claude-code-tui, and pi-zentui.",
   "type": "module",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/OldSuns/pi-open-tui.git"
+  },
   "keywords": [
     "pi-package",
     "pi",