pi-tui-footer 1.2.0 → 1.2.2

package/README.md

@@ -4,6 +4,12 @@ pi 插件：TUI 美化套件 — 动画 Pi logo 头部、Starship 风格底部
 
 ## 安装
 
+```bash
+pi install npm:pi-tui-footer
+```
+
+或通过 Git：
+
 ```bash
 pi install git:github.com/onenora/pi-tui-footer
 ```
@@ -11,7 +17,7 @@ pi install git:github.com/onenora/pi-tui-footer
 固定版本：
 
 ```bash
-pi install git:github.com/onenora/pi-tui-footer@v1.2.0
+pi install git:github.com/onenora/pi-tui-footer@v1.2.2
 ```
 
 更新：

package/extensions/config.ts

@@ -49,6 +49,7 @@ export interface FullscreenConfig {
 export interface OpenTuiConfig {
 	enabled: boolean;
 	roundedTools: boolean;
+	inlineFooter: boolean;
 	settingsLanguage: SettingsLanguage;
 	cursorStyle: CursorStyle;
 	fullscreen: FullscreenConfig;
@@ -65,6 +66,7 @@ export type PiTuiConfig = OpenTuiConfig;
 export const DEFAULT_CONFIG: OpenTuiConfig = {
 	enabled: true,
 	roundedTools: true,
+	inlineFooter: false,
 	settingsLanguage: "en",
 	cursorStyle: "block",
 	fullscreen: {
@@ -174,6 +176,9 @@ export function loadConfig(notify?: (msg: string, level: "warning" | "info") =>
 		} else {
 			config.thinkingPeek.lines = normalizeThinkingPeekLines(config.thinkingPeek.lines);
 		}
+		if (typeof config.inlineFooter !== "boolean") {
+			config.inlineFooter = DEFAULT_CONFIG.inlineFooter;
+		}
 		if (typeof config.roundedTools !== "boolean") {
 			config.roundedTools = DEFAULT_CONFIG.roundedTools;
 		}

package/extensions/editor.ts

@@ -4,7 +4,7 @@ import {
 	type ExtensionContext,
 	type KeybindingsManager,
 } from "@earendil-works/pi-coding-agent";
-import type { EditorTheme, TUI } from "@earendil-works/pi-tui";
+import type { EditorTheme, TuiMouseEvent, TuiMouseEventResult, TUI } from "@earendil-works/pi-tui";
 import { CURSOR_MARKER, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
 import type { CursorStyle } from "./config.ts";
 import {
@@ -24,12 +24,24 @@ const CURSOR_STYLE_SEQUENCES: Partial<Record<CursorStyle, string>> = {
 	underline: "\x1b[4 q",
 };
 const DEFAULT_CURSOR_STYLE_SEQUENCE = "\x1b[0 q";
+const EDITOR_FRAME_LEFT_INSET = 2;
+const EDITOR_FRAME_HORIZONTAL_CHROME = EDITOR_FRAME_LEFT_INSET * 2;
 
 interface WorkingStatusIndicator {
 	renderInBorder(width: number): string;
 	renderSpinnerInBorder(width: number): string;
 }
 
+export interface InlineFooterLine {
+	left: string;
+	right: string;
+}
+
+export interface InlineFooterRenderer {
+	enabled(): boolean;
+	render(width: number): { top: InlineFooterLine; bottom: InlineFooterLine } | undefined;
+}
+
 interface HiddenThinkingLabelComponent {
 	children: unknown[];
 	setHiddenThinkingLabel(label: string): void;
@@ -132,11 +144,59 @@ function roundedBorder(
 	return paint(`${corners[0]}${"─".repeat(Math.max(0, width - 2))}${corners[1]}`);
 }
 
+function trimTrailingSpaces(text: string): string {
+	const ansiSuffix = text.match(/(?:\x1b\[[0-?]*[ -/]*[@-~])+$/)?.[0] ?? "";
+	const content = ansiSuffix ? text.slice(0, -ansiSuffix.length) : text;
+	return `${content.replace(/ +$/, "")}${ansiSuffix}`;
+}
+
+function inlineBorder(
+	width: number,
+	kind: "top" | "bottom",
+	paint: (s: string) => string,
+	renderLine: (width: number) => InlineFooterLine | undefined,
+	sourceLine?: string,
+	indicator?: WorkingStatusIndicator,
+): string {
+	if (width < 2) return paint(truncateToWidth(kind === "top" ? "╭╮" : "╰╯", width, ""));
+
+	const corners = kind === "top" ? (["╭", "╮"] as const) : (["╰", "╯"] as const);
+	const contentWidth = width - 2;
+	const plain = sourceLine ? stripAnsi(sourceLine) : "";
+	const scrollMatch = plain.match(/([↑↓]\s+\d+\s+more)/);
+	const right = scrollMatch ? paint(` ${scrollMatch[1]} `) : "";
+	let left = paint("─");
+
+	if (kind === "top" && indicator) {
+		const statusBudget = Math.max(1, contentWidth - visibleWidth(right) - 7);
+		let status = indicator.renderInBorder(statusBudget);
+		if (visibleWidth(status) > statusBudget) status = indicator.renderSpinnerInBorder(statusBudget);
+		const leftBudget = Math.max(0, contentWidth - visibleWidth(right) - 1);
+		status = truncateToWidth(status, Math.max(0, leftBudget - 4), "");
+		if (visibleWidth(status) > 0) left = `${paint("── ")}${status}${paint(" ")}`;
+	}
+
+	const lineBudget = Math.max(0, contentWidth - visibleWidth(left) - visibleWidth(right) - 6);
+	const line = renderLine(lineBudget);
+	if (!line) return roundedBorder(width, kind, paint, sourceLine, indicator);
+	const leftContent = trimTrailingSpaces(line.left);
+	const rightContent = trimTrailingSpaces(line.right);
+	if (visibleWidth(leftContent) === 0 && visibleWidth(rightContent) === 0) {
+		return roundedBorder(width, kind, paint, sourceLine, indicator);
+	}
+
+	const leftCell = leftContent ? ` ${leftContent} ` : "";
+	const rightCell = rightContent ? ` ${rightContent} ` : "";
+	const fill = Math.max(1, contentWidth - visibleWidth(left) - visibleWidth(leftCell) - visibleWidth(rightCell) - visibleWidth(right) - 1);
+	return `${paint(corners[0])}${left}${leftCell}${paint("─".repeat(fill))}${rightCell}${right}${paint("─")}${paint(corners[1])}`;
+}
+
 export class OpenTuiEditor extends CustomEditor {
 	readonly embedWorkingStatus = true;
 	private readonly getRail: () => string;
 	private readonly getBorder: (s: string) => string;
 	private embeddedWorkingStatusIndicator: WorkingStatusIndicator | undefined;
+	private readonly inlineFooter: InlineFooterRenderer | undefined;
 	private cursorStyle: CursorStyle;
 	private previewHardwareCursor = false;
 
@@ -145,9 +205,11 @@ export class OpenTuiEditor extends CustomEditor {
 		editorTheme: EditorTheme,
 		keybindings: KeybindingsManager,
 		cursorStyle: CursorStyle = "block",
+		inlineFooter?: InlineFooterRenderer,
 	) {
 		super(tui, editorTheme, keybindings, { paddingX: 0 });
 		this.cursorStyle = cursorStyle;
+		this.inlineFooter = inlineFooter;
 		configureCursor(tui, cursorStyle);
 		// ponytail: route the frame through this.borderColor so Pi can recolor it
 		// via updateEditorBorderColor() — bash mode ("! " prefix → green) and
@@ -161,6 +223,16 @@ export class OpenTuiEditor extends CustomEditor {
 		super.setPaddingX(0);
 	}
 
+	override handleMouse(event: TuiMouseEvent): TuiMouseEventResult | undefined {
+		if (event.width < EDITOR_FRAME_HORIZONTAL_CHROME) return super.handleMouse(event);
+
+		return super.handleMouse({
+			...event,
+			x: event.x - EDITOR_FRAME_LEFT_INSET,
+			width: event.width - EDITOR_FRAME_HORIZONTAL_CHROME,
+		});
+	}
+
 	setWorkingStatusIndicator(indicator: WorkingStatusIndicator | undefined): void {
 		this.embeddedWorkingStatusIndicator = indicator;
 		this.tui.requestRender();
@@ -202,17 +274,22 @@ export class OpenTuiEditor extends CustomEditor {
 	}
 
 	render(width: number): string[] {
-		if (width < 4) return this.renderBase(width);
+		if (width < EDITOR_FRAME_HORIZONTAL_CHROME) return this.renderBase(width);
 
 		const rail = this.getRail();
 		const borderPaint = this.getBorder;
 		// ponytail: 1-char rail + 1-char gap on each side = 4 chars of chrome.
-		const innerWidth = Math.max(0, width - 4);
+		const innerWidth = Math.max(0, width - EDITOR_FRAME_HORIZONTAL_CHROME);
 		const baseLines = this.renderBase(innerWidth);
 		const bottomIdx = findBottomBorderIndex(baseLines);
 
 		const result: string[] = [];
-		result.push(roundedBorder(width, "top", borderPaint, baseLines[0], this.embeddedWorkingStatusIndicator));
+		const inlineFooter = this.inlineFooter?.enabled() === true;
+		const renderInlineLine = (kind: "top" | "bottom", budget: number): InlineFooterLine | undefined =>
+			this.inlineFooter?.render(budget)?.[kind];
+		result.push(inlineFooter
+			? inlineBorder(width, "top", borderPaint, (budget) => renderInlineLine("top", budget), baseLines[0], this.embeddedWorkingStatusIndicator)
+			: roundedBorder(width, "top", borderPaint, baseLines[0], this.embeddedWorkingStatusIndicator));
 
 		for (let i = 1; i < bottomIdx; i++) {
 			const line = baseLines[i] ?? "";
@@ -223,7 +300,9 @@ export class OpenTuiEditor extends CustomEditor {
 			}
 		}
 
-		result.push(roundedBorder(width, "bottom", borderPaint, baseLines[bottomIdx]));
+		result.push(inlineFooter
+			? inlineBorder(width, "bottom", borderPaint, (budget) => renderInlineLine("bottom", budget), baseLines[bottomIdx])
+			: roundedBorder(width, "bottom", borderPaint, baseLines[bottomIdx]));
 
 		for (let i = bottomIdx + 1; i < baseLines.length; i++) {
 			result.push(baseLines[i]!);
@@ -238,6 +317,7 @@ export function installEditor(
 	ctx: ExtensionContext,
 	cursorStyle: CursorStyle = "block",
 	wheelScrollLines = DEFAULT_FULLSCREEN_WHEEL_SCROLL_LINES,
+	inlineFooter?: InlineFooterRenderer,
 ) {
 	let activeTui: TUI | undefined;
 	let activeEditor: OpenTuiEditor | undefined;
@@ -255,7 +335,7 @@ export function installEditor(
 		hiddenThinkingTarget = undefined;
 		applyFullscreenWheelScrollLines(tui, currentWheelScrollLines);
 		previousHardwareCursor = tui.getShowHardwareCursor();
-		activeEditor = new OpenTuiEditor(tui, editorTheme, keybindings, currentCursorStyle);
+		activeEditor = new OpenTuiEditor(tui, editorTheme, keybindings, currentCursorStyle, inlineFooter);
 		return activeEditor;
 	});
 	return {

package/extensions/footer.ts

@@ -204,141 +204,241 @@ export interface FooterHooks {
 	scheduleGitRefresh: () => void;
 }
 
+interface FooterDataLike {
+	getExtensionStatuses(): ReadonlyMap<string, string>;
+}
+
+export interface InlineFooterLine {
+	left: string;
+	right: string;
+}
+
+export interface InlineFooterLines {
+	top: InlineFooterLine;
+	bottom: InlineFooterLine;
+}
+
+/**
+ * Split the bottom border content the way `alignRight` splits the plain row:
+ * the right block (statistics) survives, the left one (model) shrinks to an
+ * ellipsis and only then disappears. Keeps the assembled border inside its
+ * budget so editor-side truncation never eats the right corner.
+ */
+function fitInlineLine(left: string, right: string, width: number, theme: Theme): InlineFooterLine {
+	const rightWidth = visibleWidth(right);
+	if (rightWidth > width) {
+		return { left: "", right: truncateToWidth(right, width, theme.fg("dim", "...")) };
+	}
+	const availableForLeft = width - rightWidth - 1;
+	if (availableForLeft <= 0) return { left: "", right };
+	return { left: truncateToWidth(left, availableForLeft, theme.fg("dim", "...")), right };
+}
+
+export interface FooterHandle {
+	renderInline(width: number): InlineFooterLines | undefined;
+	cleanup(): void;
+}
+
+function fitInlineSegments(
+	parts: readonly PrioritizedSegment[],
+	width: number,
+	theme: Theme,
+): string {
+	const separator = theme.fg("dim", " · ");
+	const separatorReserve = Math.max(0, parts.length - 1) * Math.max(0, visibleWidth(separator) - 1);
+	return fitSegmentsByPriority(
+		parts,
+		Math.max(0, width - separatorReserve),
+		theme.fg("dim", "..."),
+	).join(separator);
+}
+
+function renderFooterContent(
+	ctx: ExtensionContext,
+	getState: () => FooterState,
+	getConfig: () => OpenTuiConfig,
+	getModelMeta: () => ModelMeta,
+	theme: Theme,
+	footerData: FooterDataLike,
+	width: number,
+): { mainLines: [string, string]; inlineLines: InlineFooterLines; extensionLines: string[] } {
+	if (width <= 0) {
+		return {
+			mainLines: ["", ""],
+			inlineLines: {
+				top: { left: "", right: "" },
+				bottom: { left: "", right: "" },
+			},
+			extensionLines: [],
+		};
+	}
+
+	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[] = [];
+	const inlineTopLeftParts: PrioritizedSegment[] = [];
+	const inlineTopRightParts: 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))}`;
+			},
+		});
+		inlineTopRightParts.push(leftParts.at(-1)!);
+	}
+	if (segments.hostname) {
+		const shortHost = shortHostname(osHostname());
+		if (shortHost) {
+			leftParts.push({
+				text: `${theme.fg("dim", glyphs.host)} ${theme.fg("accent", shortHost)}`,
+				priority: 1,
+			});
+			inlineTopRightParts.push(leftParts.at(-1)!);
+		}
+	}
+	const sessionName = ctx.sessionManager.getSessionName();
+	if (sessionName) {
+		const sessionPart: PrioritizedSegment = {
+			text: `${theme.fg("dim", glyphs.session)} ${theme.fg("text", truncateToWidth(sessionName, 24, theme.fg("dim", "...")))}`,
+			priority: 2,
+		};
+		if (segments.sessionName) {
+			leftParts.push(sessionPart);
+			inlineTopLeftParts.push(sessionPart);
+		}
+	}
+	const gitSeg = renderGitSegment(theme, state.git, glyphs, segments);
+	if (gitSeg) {
+		leftParts.push({ text: gitSeg, priority: 3 });
+		inlineTopLeftParts.push(leftParts.at(-1)!);
+	}
+	if (segments.runtime) {
+		const runtimeSeg = renderRuntimeSegment(theme, state.runtime, config.icons.mode);
+		if (runtimeSeg) {
+			leftParts.push({ text: runtimeSeg, priority: 4 });
+			inlineTopRightParts.push(leftParts.at(-1)!);
+		}
+	}
+	const timerSeg = renderTimerSegment(theme, state, glyphs);
+	if (timerSeg) {
+		leftParts.push({ text: timerSeg, priority: 1 });
+		inlineTopRightParts.push(leftParts.at(-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 });
+		// Context stays at the far right; cwd is the first item in this group.
+		inlineTopRightParts.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 inlineLeftBudget = Math.floor(width * 0.45);
+	const inlineTopLeft = fitInlineSegments(inlineTopLeftParts, inlineLeftBudget, theme);
+	const inlineRightBudget = Math.max(0, width - visibleWidth(inlineTopLeft) - (inlineTopLeft ? 1 : 0));
+	const inlineTop: InlineFooterLine = {
+		left: inlineTopLeft,
+		right: fitInlineSegments(inlineTopRightParts, inlineRightBudget, 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 inlineBottom = fitInlineLine(modelBlock, statsBlock, width, theme);
+	const line2 = alignRight(inlineBottom.left, inlineBottom.right, width, theme);
+	const mainLines: [string, string] = [line1, line2]
+		.map((line) => truncateToWidth(line, width, theme.fg("dim", "..."))) as [string, string];
+	const extensionLines = segments.extensionStatuses
+		? renderExtensionStatusLines(theme, footerData.getExtensionStatuses(), glyphs, width)
+		: [];
+	return { mainLines, inlineLines: { top: inlineTop, bottom: inlineBottom }, extensionLines };
+}
+
 export function installFooter(
 	ctx: ExtensionContext,
 	getState: () => FooterState,
 	getConfig: () => OpenTuiConfig,
 	getModelMeta: () => ModelMeta,
 	hooks: FooterHooks,
-): () => void {
+): FooterHandle {
+	let renderInline: (width: number) => InlineFooterLines | undefined = () => undefined;
+
 	ctx.ui.setFooter((tui, theme, footerData) => {
 		hooks.setRequestRender(() => tui.requestRender());
 		const unsubBranch = footerData.onBranchChange(() => {
 			hooks.scheduleGitRefresh();
 			tui.requestRender();
 		});
+		const getContent = (width: number) => renderFooterContent(
+			ctx,
+			getState,
+			getConfig,
+			getModelMeta,
+			theme,
+			footerData,
+			width,
+		);
+
+		renderInline = (width) => getContent(width).inlineLines;
 
 		return {
 			dispose() {
 				unsubBranch();
 				hooks.setRequestRender(undefined);
+				renderInline = () => 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;
+				const { mainLines, extensionLines } = getContent(width);
+				return getConfig().inlineFooter ? extensionLines : [...mainLines, ...extensionLines];
 			},
 		};
 	});
 
-	return () => {
-		ctx.ui.setFooter(undefined);
+	return {
+		renderInline: (width) => renderInline(width),
+		cleanup() {
+			ctx.ui.setFooter(undefined);
+		},
 	};
 }

package/extensions/header.ts

@@ -171,7 +171,7 @@ export class OpenTuiHeader implements Component {
 		this.ctx = ctx;
 		const pool = collectPiCommandNames(pi.getCommands());
 		this.tipCommands = pickSlashCommandTips(pool, {
-			fixed: ["pi-tui"],
+			fixed: ["open-tui"],
 			count: 3,
 		});
 	}

package/extensions/index.ts

@@ -4,7 +4,7 @@
  * thinking peek preview, rounded tool frames, and turn telemetry.
  *
  * Integrated from:
- *   - pi-open-tui (v0.3.7, MIT, by OldSun, https://github.com/OldSuns/pi-open-tui)
+ *   - pi-open-tui (v0.3.9, MIT, by OldSun, https://github.com/OldSuns/pi-open-tui)
  *   - pi-rounded-tools (v0.1.3, MIT, by OrionPax, https://github.com/orionpax1997/pi-rounded-tools)
  *
  * Security audit notes:
@@ -17,7 +17,7 @@
 import type { ExtensionAPI, ExtensionContext } from "@earendil-works/pi-coding-agent";
 import { type OpenTuiConfig, DEFAULT_CONFIG, ensureConfigExists, loadConfig, saveConfig } from "./config.ts";
 import { installEditor } from "./editor.ts";
-import { installFooter } from "./footer.ts";
+import { installFooter, type FooterHandle } from "./footer.ts";
 import { installHeader } from "./header.ts";
 import { emptyGitStatus, readGitStatus } from "./git.ts";
 import { readRuntimeInfo } from "./runtime.ts";
@@ -71,7 +71,7 @@ export default function (pi: ExtensionAPI) {
 	let requestFooterRender: (() => void) | undefined;
 	let workingTimer: ReturnType<typeof setInterval> | undefined;
 	let cleanupHeader: (() => void) | undefined;
-	let cleanupFooter: (() => void) | undefined;
+	let cleanupFooter: FooterHandle | undefined;
 	let editor: ReturnType<typeof installEditor> | undefined;
 	let pendingUiChange: PendingUiChange | undefined;
 
@@ -150,7 +150,7 @@ export default function (pi: ExtensionAPI) {
 		}
 		if (!active) {
 			cleanupHeader = installHeader(pi, ctx);
-			cleanupFooter = installFooter(
+			const footer = installFooter(
 				ctx,
 				() => state,
 				() => config,
@@ -164,7 +164,17 @@ export default function (pi: ExtensionAPI) {
 					},
 				},
 			);
-			editor = installEditor(pi, ctx, config.cursorStyle, config.fullscreen.wheelScrollLines);
+			cleanupFooter = footer;
+			editor = installEditor(
+				pi,
+				ctx,
+				config.cursorStyle,
+				config.fullscreen.wheelScrollLines,
+				{
+					enabled: () => config.inlineFooter,
+					render: footer.renderInline,
+				},
+			);
 			active = true;
 		}
 	};
@@ -173,7 +183,7 @@ export default function (pi: ExtensionAPI) {
 		if (!isTuiContext(ctx)) return;
 		if (active) {
 			cleanupHeader?.();
-			cleanupFooter?.();
+			cleanupFooter?.cleanup();
 			editor?.cleanup();
 			cleanupHeader = undefined;
 			cleanupFooter = undefined;

package/extensions/rounded-tools.ts

@@ -4,7 +4,7 @@
  * Merged 2026-08 from the standalone local extension rounded-tools.ts (a
  * localized copy of npm:pi-rounded-tools@0.1.3, MIT, by OrionPax,
  * https://github.com/orionpax1997/pi-rounded-tools), integrated into pi-tui
- * (based on https://github.com/OldSuns/pi-open-tui v0.3.7, MIT, by
+ * (based on https://github.com/OldSuns/pi-open-tui v0.3.9, MIT, by
  * OldSun) and gated behind `roundedTools` in pi-tui config
  * (~/.pi/agent/pi-tui.json, default on).
  *

package/extensions/settings-command.ts

@@ -34,6 +34,7 @@ const COPY = {
 		labels: {
 			enabled: "Enabled",
 			roundedTools: "Rounded tool frames",
+			inlineFooter: "Inline footer",
 			thinkingPeek: "Thinking peek",
 			language: "Language",
 			wheelScrollLines: "Mouse wheel speed",
@@ -74,6 +75,7 @@ const COPY = {
 		labels: {
 			enabled: "启用",
 			roundedTools: "圆角工具边框",
+			inlineFooter: "内联底栏",
 			thinkingPeek: "思考预览",
 			language: "语言",
 			wheelScrollLines: "鼠标滚轮速度",
@@ -181,6 +183,7 @@ function buildFeaturesItems(config: OpenTuiConfig, copy: SettingsCopy): SettingI
 	return [
 		{ id: "enabled", label: copy.labels.enabled, currentValue: flag(config.enabled) },
 		{ id: "roundedTools", label: copy.labels.roundedTools, currentValue: flag(config.roundedTools) },
+		{ id: "inlineFooter", label: copy.labels.inlineFooter, currentValue: flag(config.inlineFooter) },
 		{ id: "settingsLanguage", label: copy.labels.language, currentValue: copy.values.languages[config.settingsLanguage] },
 		{
 			id: "wheelScrollLines",
@@ -249,6 +252,7 @@ function handleSettingChange(
 	if (tab === "features") {
 		if (itemId === "enabled") return toggleEnabled(config);
 		if (itemId === "roundedTools") return { ...config, roundedTools: !config.roundedTools };
+		if (itemId === "inlineFooter") return { ...config, inlineFooter: !config.inlineFooter };
 		if (itemId === "settingsLanguage") return toggleLanguage(config);
 		if (itemId === "thinkingPeek") return cycleThinkingPeek(config);
 	}

package/extensions/utils.ts

@@ -43,23 +43,28 @@ export function truncateBranch(branch: string, maxLen: number): string {
 }
 
 export function truncatePath(path: string, maxLen: number): string {
-	if (path.length <= maxLen) return path;
+	// `maxLen` is a terminal-column budget, so every comparison here must use
+	// display width. Comparing String.length let wide (CJK) paths stay wider than
+	// the budget: for a basename of 4 characters but 8 columns, `truncatePath`
+	// returned it unchanged, so fitSegmentsByPriority's `while (totalW() > maxW)`
+	// loop never made progress and livelocked the renderer at 100% CPU.
+	if (visibleWidth(path) <= 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) + "...";
+	if (parts.length <= 2) return truncateToWidth(path, maxLen, "...");
 	// 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;
+		if (tailLen + visibleWidth(seg) + 4 > maxLen) break;
 		tail.unshift(seg);
-		tailLen += seg.length + 1;
+		tailLen += visibleWidth(seg) + 1;
 	}
 	const head = parts[0]!;
 	const result = `${head}${sepChar}...${sepChar}${tail.join(sepChar)}`;
-	return result.length > maxLen ? result.slice(0, maxLen - 3) + "..." : result;
+	return visibleWidth(result) > maxLen ? truncateToWidth(result, maxLen, "...") : result;
 }
 
 export function finiteOrZero(value: unknown): number {
@@ -158,7 +163,25 @@ export function fitSegmentsByPriority(
 			if (totalW() <= maxW) break;
 		}
 	}
+	// A segment whose `truncate` cannot actually shrink would otherwise spin here
+	// forever and block the render timer. Require each pass to make progress, and
+	// drop the worst segment when it does not, so layout always terminates.
+	let lastTotal = Infinity;
 	while (totalW() > maxW) {
+		const nowTotal = totalW();
+		if (nowTotal >= lastTotal) {
+			let worst = -1;
+			for (let i = 0; i < items.length; i++) {
+				if (items[i].text !== "" && (worst === -1 || items[i].priority < items[worst].priority)) {
+					worst = i;
+				}
+			}
+			if (worst === -1) break;
+			items[worst].text = "";
+			items[worst].w = 0;
+			continue;
+		}
+		lastTotal = nowTotal;
 		let target = -1;
 		for (let i = 0; i < items.length; i++) {
 			if (items[i].text !== "" && (target === -1 || items[i].priority < items[target].priority)) {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "pi-tui-footer",
-	"version": "1.2.0",
+	"version": "1.2.2",
 	"description": "pi extension: TUI footer/header with git status, telemetry, rounded tools, editor and settings enhancements",
 	"type": "module",
 	"keywords": [