@gavin-hu/my-pi-agent 0.16.0 → 0.17.0

package/extensions/context/tui.ts

@@ -16,7 +16,7 @@ import type { CompactionResult, Theme } from "@earendil-works/pi-coding-agent";
 import { truncateToWidth, visibleWidth, type Component } from "@earendil-works/pi-tui";
 import { messageOf } from "../../lib/errors.ts";
 import { formatTokens } from "../../lib/format.ts";
-import { screenHint, type ViewportRowsSource } from "../../lib/tui/chrome.ts";
+import { screenFooter, screenHint, type ViewportRowsSource } from "../../lib/tui/chrome.ts";
 import { ConfirmState } from "../../lib/tui/confirm.ts";
 import { clampScroll, fitRows, formatRange, isCloseKey, navigateScroll } from "../../lib/tui/cursor.ts";
 import { gaugeBar, gaugeRole } from "../../lib/tui/gauge.ts";
@@ -26,7 +26,7 @@ import { paint, type TuiRole } from "../../lib/tui/tokens.ts";
 import { formatBudget, formatCompaction, formatDrift } from "./format.ts";
 import type { ContextBucket, ContextReport } from "./types.ts";
 
-/** Fixed rows around the scrollable body: title, gauge, budget, blank, blank, footer, blank. */
+/** Fixed rows around the scrollable body: title, gauge, budget, blank, blank, footer, closing rule. */
 const CHROME_ROWS = 7;
 
 /** Cells in the composition bar. */
@@ -137,16 +137,28 @@ export class ContextComponent implements Component {
 		const { percent, tokens, window } = this.report;
 		if (window <= 0) return truncateToWidth(`  ${paint(this.theme, "meta", "no model context window")}`, width);
 		const role = gaugeRole(percent);
+		// The bar and the printed percentage come from one rounded value, so a
+		// label reading `0%` can never sit beside a filled cell. The tone stays on
+		// the exact percent, so the warn and danger thresholds do not move.
+		const shown = percent === null ? null : Math.round(percent);
 		const value = tokens === null ? `? / ${formatTokens(window)}` : `${formatTokens(tokens)} / ${formatTokens(window)}`;
-		const bar = gaugeBar(this.theme, { percent, blocks: 10 });
-		const label = percent === null ? "unknown" : `${Math.round(percent)}%`;
+		const bar = gaugeBar(this.theme, { percent: shown, blocks: 10 });
+		const label = shown === null ? "unknown" : `${shown}%`;
 		return truncateToWidth(`  ${paint(this.theme, role, value)}  ${bar}  ${paint(this.theme, role, label)}`, width);
 	}
 
+	/** The composition header: the denominator the percent column is a share of. */
+	private compositionLine(width: number): string {
+		const label = paint(this.theme, "label", "Composition");
+		const total = paint(this.theme, "meta", `${formatTokens(this.report.estimate)} estimate`);
+		const full = `  ${label} · ${total}`;
+		return visibleWidth(full) <= width ? full : truncateToWidth(`  ${label}`, width);
+	}
+
 	/** One composition row; optional columns drop as the terminal narrows. */
 	private bucketLine(bucket: ContextBucket, width: number): string {
 		const indent = " ".repeat(bucket.depth > 0 ? 4 : 2);
-		const labelWidth = bucket.depth > 0 ? 16 : 18;
+		const labelWidth = bucket.depth > 0 ? 20 : 22;
 		const label = padCell(bucket.label, labelWidth);
 		const tokens = formatTokens(bucket.tokens).padStart(6);
 		const share = shareCell(bucket.share);
@@ -167,13 +179,17 @@ export class ContextComponent implements Component {
 		return truncateToWidth(head, width);
 	}
 
-	/** The scrollable body: composition, drift, compaction, and the largest blocks. */
+	/** The scrollable body: composition, drift, compaction, and the largest messages. */
 	private buildBody(width: number): string[] {
 		const report = this.report;
-		const lines: string[] = report.buckets.map((bucket) => this.bucketLine(bucket, width));
+		const lines: string[] = [];
+		if (report.buckets.length > 0) {
+			lines.push(this.compositionLine(width));
+			for (const bucket of report.buckets) lines.push(this.bucketLine(bucket, width));
+		}
 
 		const drift = formatDrift(report);
-		if (drift) lines.push("", truncateToWidth(`  ${paint(this.theme, "warn", drift)}`, width));
+		if (drift) lines.push("", truncateToWidth(`  ${paint(this.theme, "meta", drift)}`, width));
 
 		lines.push(
 			"",
@@ -184,7 +200,7 @@ export class ContextComponent implements Component {
 		);
 
 		if (report.largest.length > 0) {
-			lines.push("", `  ${paint(this.theme, "label", "Largest blocks")}`);
+			lines.push("", `  ${paint(this.theme, "label", "Largest messages")}`);
 			for (const block of report.largest) {
 				const tokens = formatTokens(block.tokens).padStart(6);
 				const role = padCell(block.role, 11);
@@ -230,7 +246,7 @@ export class ContextComponent implements Component {
 		if (this.body.length > this.visible) {
 			lines.push(formatRange(this.theme, w, { start: this.scroll, end, total: this.body.length }));
 		}
-		lines.push("", this.footerLine(w), "");
+		lines.push(...screenFooter(this.theme, w, this.footerLine(w)));
 		return lines.map((line) => truncateToWidth(line, w));
 	}
 

package/extensions/context/types.ts

@@ -79,7 +79,7 @@ export interface CompactionHistory {
 	last: CompactionSummary | null;
 }
 
-/** One of the largest single blocks in the projected context. */
+/** One of the largest single messages in the projected context. */
 export interface LargestBlock {
 	/** Estimated tokens. */
 	tokens: number;
@@ -99,7 +99,7 @@ export interface ContextReport {
 	percent: number | null;
 	/** `window - tokens`, `null` when `tokens` is unknown. */
 	free: number | null;
-	/** `window - reserve - tokens`, `null` when `tokens` is unknown. */
+	/** `window - reserve - tokens`, `null` when `tokens` is unknown or automatic compaction is off. */
 	headroom: number | null;
 	/** The resolved `reserveTokens` for the active model. */
 	reserve: number;
@@ -115,8 +115,10 @@ export interface ContextReport {
 	estimate: number;
 	/** `tokens - estimate` when the host's estimate is known, else `null`. */
 	drift: number | null;
+	/** True when the projection holds no assistant message: Pi's total is its message-only fallback. */
+	beforeFirstReply: boolean;
 	/** The branch's compaction history. */
 	compaction: CompactionHistory;
-	/** The largest projected blocks, biggest first. */
+	/** The largest projected messages, biggest first. */
 	largest: LargestBlock[];
 }

package/extensions/file-browse/README.md

@@ -147,6 +147,32 @@ nothing is left to serve. That is why a page with JavaScript off — or with liv
 status off — never counts as a reader, and the server then waits for
 `/browse stop` or the end of the session.
 
+### The page
+
+The page is keyboard-first, and the tree is one tab stop rather than two per
+folder:
+
+| Key | What it does in the tree |
+|---|---|
+| `↑` / `↓` | Move between the rows on screen |
+| `→` | Open a folder (reading its children first if needed), or enter it |
+| `←` | Close the folder, or step out to its parent |
+| `Space` | Open or close the focused folder |
+| `Enter` | Follow the focused row's link |
+| `Home` / `End` | First or last row on screen |
+
+The folder's own link carries `aria-expanded`, so a screen reader hears its
+state once; the twisty beside it is a pointer control kept out of the tab order.
+A mouse click moves the tab stop to that row, so `Tab` comes back to where you
+were. Elsewhere the page keeps its own keys: `/` or `Ctrl`/`Cmd`+`K` for quick
+open, `-` to fold, `u` to wrap, `r` for raw Markdown, `n`/`p` between diff hunks,
+and `?` for the sheet, whose dialog now traps `Tab` and returns focus to its
+button.
+
+Printing is supported: the paper gets the light palette whatever the screen is
+showing, the chrome and the tree are dropped, and a file or diff prints whole
+instead of inside its scroll box.
+
 ## Routes
 
 | Route | Result |
@@ -399,7 +425,9 @@ document and the project document (project wins):
 | `urls.ts` | Shared link/image URL policy: scheme allowlist and `/view`/`/raw` rewriting |
 | `git.ts` | Read-only branch/dirty provider for the header chip |
 | `icons.ts` | Inline SVG sprite and the per-language mapping |
-| `client.ts` | The `/app.js` source (tree toggle, filter, sort, wrap, copy, quick open) |
+| `client.ts` | The `/app.js` source: sort, wrap, copy, hunk navigation, reading progress, and the page keymap |
+| `tree.ts` | The sidebar block: path filter, fold-all, lazy tree loading, and the tree's keyboard model (interpolated into `client.ts`) |
+| `palette.ts` | The quick-open palette: fuzzy search, the combobox wiring, and the `window.bfPalette` contract (interpolated into `client.ts`) |
 | `live-client.ts` | The client's live status block: the event stream, the chips, the markers, and the footer line (interpolated into `client.ts`) |
 | `live.ts` | The live status snapshot, its frame, and the fan-out channel that ticks it |
 | `styles.ts` | The page-only `browse-*` stylesheet (the `bf-*` kit comes from `lib/web`) |