@bismawy/pi-arnative 0.2.2 → 0.2.4

package/CHANGELOG.md

@@ -0,0 +1,81 @@
+# Changelog
+
+## [0.2.4] - 2026-09-28
+
+### Added
+- `lib/check.ts` and `lib/format.ts`: shared self-check helpers (`assert`, `isMain`) and shared display formatting (model names, capitalize, expand-hint key) — footer, header tabs and tool boxes now agree by construction.
+
+### Fixed
+- A crashing third-party tool renderer (e.g. pi-web-access `get_content` with missing args) no longer exits pi: every external renderer call is wrapped in a safe fallback, matching pi's own `updateDisplay` semantics.
+- Restored / `--continue` sessions now show the real send time on user messages (timestamps prefilled from session history). A message with no recorded time shows no clock instead of a fake "now".
+- The spinner animates at the documented 500 ms cadence (was 150 ms); footer status stripping no longer carries a broken ANSI-regex leftover.
+- The usage log prefilter no longer silently undercounts if the JSONL key order/shape changes.
+
+### Changed
+- Self-check boilerplate, ANSI stripping and model-name formatting were deduplicated into `lib/`; dead compatibility exports removed. Behavior unchanged, `npm test` green.
+
+---
+
+## [0.2.3] - 2026-09-27
+
+### Added
+- `Shortcut` header tab (rightmost, after `Themes`) holding the key cheatsheet: `Esc`, `Ctrl+c/d`, `/`, `!`, `Ctrl+o`, `Ctrl+alt+t`, `Ctrl+alt+n`, `Ctrl+alt+r`. Tab order is now `Directory → Model → Context → Skills → Extensions → Themes → Shortcut`.
+
+### Changed
+- The header no longer spends a line on the shortcut legend. Line 1 greets the device username (`Welcome back, <user>`), line 2 shows `pi vX.Y.Z · Arnative vX.Y.Z` (names in the theme accent, versions dim). The tab box labels itself on its top border (`╭─ Menu ───╮`) instead of spending a text line. The Arnative version is read from the package.json of the running build, so an outdated npm install can no longer claim to be the executing code.
+- The `Shortcut` tab is dropped first on narrow terminals (~<146 columns), like every rightmost tab.
+
+---
+
+## [0.2.2] - 2026-09-27
+
+### Added
+- `ctrl+alt+r` reload legend in the header shortcut line (`[Ctrl+alt+r] Reload`), shown from 142 columns on.
+
+### Changed
+- `Directory` is now the first header tab (and the default tab on open), so the working directory shows immediately. Tab order: `Directory → Model → Context → Skills → Extensions → Themes`.
+- The `Directory` tab label is just `Directory`; the full path moved to the tab content line, shown on click.
+- Model tab label uses brackets: `Model [Deepseek V4.1 Flash]` instead of `Model: Deepseek V4.1 Flash`.
+
+### Fixed
+- Click hit-areas for header tabs were off by 2 columns (tab box border + leading space were not counted), so the leftmost tab looked dead on its last 2 columns.
+
+---
+
+## [0.2.1] - 2026-09-27
+
+### Fixed
+- Fixed `ctrl+alt+r` reload shortcut by publishing missing extension logic to NPM registry.
+- Hoisted reload shortcut key id to typed `Key.ctrlAlt("r")` with encoding assertions for both legacy ESC (`\x1b\x12`) and Kitty CSI-u (`\x1b[114;7u`).
+
+### Added
+- Added `npm run dev` script for conflict-free local live TUI testing.
+
+---
+
+## [0.2.0] - 2026-09-27
+
+### Added
+- Interactive header box with clickable resource tabs (`Model`, `Directory`, `Context`, `Skills`, `Extensions`, `Themes`).
+- Full working directory view under the `Directory` tab (wrapped at path segments, never truncated).
+- Keyboard shortcut `ctrl+alt+t` to cycle through header tabs.
+- Keyboard shortcut `ctrl+alt+r` for instant runtime reload (`/reload`).
+- Full `/usage` interactive dashboard modal with session/all-time token metrics and estimated costs.
+- 10 expressive palette variants generated from base Arnative (`sun`, `zinc`, `violet`, `emerald`, `matrix`, `cyberpunk`, `synthwave`, `gruvbox`, `nord`, `dracula`).
+- Visual rounded boxes with animated status spinners for built-in and MCP tool executions.
+- Transcript timestamp clock and message bubble background repair.
+
+### Changed
+- Shortened footer working directory display to tail segments.
+- Compacted compaction and status notices into single-line dimmed highlights.
+- Unified theme token contrast check across all variants via automated test suite.
+
+---
+
+## [0.1.0] - 2026-09-24
+
+### Added
+- Initial release of `@bismawy/pi-arnative`.
+- Warm-neutral base Arnative theme with cyan accents.
+- Fixed 2-line status footer with real-time streaming speed (tok/s), Git branch/tag status, and token metrics.
+- Boxed editor input with dim ` > ` prompt.

package/README.md

@@ -11,7 +11,7 @@ A visual layer and tool styling tailored to your vibe coding.
 pi-arnative replaces pi’s default terminal chrome with a unified, cohesive visual aesthetic.
 
 - Warm Themes: Cohesive, contrast-checked color palettes generated without drift.
-- Tabbed Header: Compact box menu with quick access to Directory, Model, Skills, Extensions, and Themes.
+- Tabbed Header: Greeting, version line, and a compact box menu over Directory, Model, Context, Skills, Extensions, Themes, and Shortcut.
 - Rounded Tool Boxes: Clear status, spinner, and duration for every tool call.
 - Enhanced Footer: 2-line layout showing directory path, git branch, model, and token metrics.
 - Transcript Clock: Timestamps for messages with clean bubble backgrounds.
@@ -36,11 +36,27 @@ pi --extension ./extensions/footer.ts
 | Key / Action | Result |
 | --- | --- |
 | `/usage` | Show session usage & token metrics |
-| `ctrl+alt+t` | Cycle header tabs (Directory → Model → Context → Skills → Extensions → Themes) |
+| `ctrl+alt+t` | Cycle header tabs (Directory → Model → Context → Skills → Extensions → Themes → Shortcut) |
+| `ctrl+alt+n` | Start a new session (`/new`) — see [Keybindings](#keybindings) |
 | `ctrl+alt+r` | Quick reload runtime (`/reload`) |
 | Click tab | Open selected header tab |
 | Click tool / `ctrl+e` | Toggle tool output box |
 
+Same cheatsheet in the header's **Shortcut** tab; on narrow terminals the rightmost tabs drop off first.
+
+## Keybindings
+
+`ctrl+alt+n` is a plain user keybinding, not a package shortcut — pi-arnative never registers it.
+Add it once to `~/.pi/agent/keybindings.json`:
+
+```json
+{
+  "app.session.new": "ctrl+alt+n"
+}
+```
+
+Restart pi to pick it up.
+
 ## Architecture
 
 <details>

package/extensions/footer.ts

@@ -11,6 +11,9 @@ import type { AssistantMessage } from "@earendil-works/pi-ai";
 import { CustomEditor, FooterComponent, type ExtensionAPI } from "@earendil-works/pi-coding-agent";
 import { Key, matchesKey, truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
 import { execFile } from "node:child_process";
+import { stripAnsi } from "../lib/ansi.ts";
+import { assert, isMain } from "../lib/check.ts";
+import { capitalize, modelDisplayParts } from "../lib/format.ts";
 import { formatTokens } from "../lib/usage-store.ts";
 
 // The TUI drops key-release events before handleInput, so press+release cannot
@@ -99,19 +102,9 @@ function formatModelName(
 	dim: (t: string) => string,
 ): string {
 	if (!model) return dim("No Model");
-	let name = model.name || model.id;
-	const provider = model.provider ? model.provider.charAt(0).toUpperCase() + model.provider.slice(1) : "";
-	if (name === model.id) {
-		name = name
-			.split(/[-_]/)
-			.map((w) => (w.length > 0 ? w.charAt(0).toUpperCase() + w.slice(1) : ""))
-			.join(" ");
-	}
-	if (provider && name.toLowerCase().endsWith(`(${provider.toLowerCase()})`)) {
-		name = name.slice(0, name.lastIndexOf("(")).trim();
-	}
+	const { name, provider } = modelDisplayParts({ id: model.id, name: model.name, provider: model.provider });
 	const provStr = provider ? ` ${dim(`(${provider})`)}` : "";
-	const capThinking = thinkingLevel && thinkingLevel !== "off" ? thinkingLevel.charAt(0).toUpperCase() + thinkingLevel.slice(1) : "";
+	const capThinking = thinkingLevel && thinkingLevel !== "off" ? capitalize(thinkingLevel) : "";
 	const thinkStr = capThinking ? `${acc("\udb80\udf35")} ${tint(capThinking)} ${dim("·")} ` : "";
 	return `${thinkStr}${acc(name)}${provStr}`;
 }
@@ -140,15 +133,12 @@ export function formatDuration(ms: number): string {
 	return `${s}s`;
 }
 
-// Full box editor + `> ` prompt. pi only draws lines above and below
-// (pi-tui editor.js: "no side borders, just horizontal lines above and below")
-// and no prompt char, so the `│` sides, the round ╭╮╰╯ corners and the prompt
-// are added here.
-// `lines` are already rendered by pi at the NARROWER width - 5: 2 columns for the
-// sides, 3 for the " > " prompt; the border is then patched with dashes to match.
-// `visible` = editor content line count (private `renderedVisibleLineCount`);
-// autocomplete lines come AFTER the bottom border and are deliberately outside the box.
-// JetBrainsMono Nerd Font has the round corner glyphs (verified via fontconfig).
+// Full box editor: pi draws only the top/bottom lines (pi-tui editor.js: "no side
+// borders, just horizontal lines above and below") and no prompt char, so the `│`
+// sides, the round ╭╮╰╯ corners and the `> ` prompt are added here. `lines` are
+// already rendered at width - 5 (2 sides + 3 prompt) and the border is patched with
+// dashes to match. `visible` = content line count (private `renderedVisibleLineCount`);
+// autocomplete lines stay outside the box. JetBrainsMono NF has the round glyphs.
 export function boxEditorLines(
 	lines: readonly string[],
 	visible: number,
@@ -234,6 +224,14 @@ function poke(): void {
  * Tool name → active progress text (gerund).
  * Fallback when unregistered: "Working".
  */
+// Verb for an MCP sub-action (shared by the `mcp` and `mcp__*` tool names).
+function mcpStatusOf(sub: string): string {
+	if (sub.includes("search") || sub.includes("find")) return "Searching";
+	if (sub.includes("fetch") || sub.includes("get") || sub.includes("read")) return "Fetching";
+	if (sub.includes("edit") || sub.includes("write") || sub.includes("patch")) return "Editing";
+	return "Executing";
+}
+
 export function getToolWorkingMessage(toolName: string, args?: any): string {
 	const n = (toolName ?? "").trim();
 	if (!n) return "Working";
@@ -257,21 +255,11 @@ export function getToolWorkingMessage(toolName: string, args?: any): string {
 	if (n === "mcpScript") return "Running script";
 	if (n === "mcp") {
 		const sub = typeof args === "object" && args ? (args.tool || args.search || args.describe || args.action) : "";
-		if (sub) {
-			const s = String(sub).toLowerCase();
-			if (s.includes("search") || s.includes("find")) return "Searching";
-			if (s.includes("fetch") || s.includes("get") || s.includes("read")) return "Fetching";
-			if (s.includes("edit") || s.includes("write") || s.includes("patch")) return "Editing";
-			return "Executing";
-		}
-		return "Executing";
+		return sub ? mcpStatusOf(String(sub).toLowerCase()) : "Executing";
 	}
 	if (n.startsWith("mcp__")) {
 		const sub = typeof args === "object" && args?.tool ? String(args.tool).toLowerCase() : "";
-		if (sub.includes("search") || sub.includes("find")) return "Searching";
-		if (sub.includes("fetch") || sub.includes("get") || sub.includes("read")) return "Fetching";
-		if (sub.includes("edit") || sub.includes("write") || sub.includes("patch")) return "Editing";
-		return "Executing";
+		return mcpStatusOf(sub);
 	}
 
 	return "Working";
@@ -367,7 +355,7 @@ export default function (pi: ExtensionAPI) {
 						const segs: string[] = [];
 						const cleanStatus = (s: string) => {
 							if (s.includes("MCP:")) {
-								let clean = s.replace(/\x1b\[[0-9;]*m/g, "").replace(/^[0-9;]+m/, "");
+								let clean = stripAnsi(s);
 								const idx = clean.indexOf("MCP:");
 								let rest = (idx >= 0 ? clean.slice(idx) : clean).replace(/\uFFFD/g, "").trim();
 								rest = rest.replace(/[\p{Extended_Pictographic}\uFE0F\u200D\u2800-\u28FF]/gu, "").replace(/\s{2,}/g, " ").trim();
@@ -397,7 +385,7 @@ export default function (pi: ExtensionAPI) {
 								const label = isOff ? "OFF" : isReview ? "REVIEW" : "ON";
 								return `${acc("\uedcf")}  ${tint("Jev:")} ${bullet} ${tint(label)}`;
 							}
-							let clean = s.replace(/\x1b\[[0-9;]*m/g, "").replace(/^[0-9;]+m/, "");
+							let clean = stripAnsi(s);
 							clean = clean.replace(/\uFFFD/g, "").replace(/\?{1,2}\s*/g, "");
 							return tint(clean.trim());
 						};
@@ -612,37 +600,30 @@ export default function (pi: ExtensionAPI) {
 }
 
 // Self-check: `node extensions/footer.ts`
-const isMain = process.argv[1] && import.meta.url.endsWith(process.argv[1].split("\\").join("/"));
-if (isMain) {
-	const assert = (cond: boolean, msg: string) => {
-		if (!cond) {
-			console.error(`FAIL: ${msg}`);
-			process.exit(1);
-		}
-	};
-	assert(shortenCwd("/run/media/bisma/DATA/Pi/pi-arnative") === "\u2026/Pi/pi-arnative", "cwd dalam -> 2 segmen terakhir");
-	assert(shortenCwd("/home/bisma") === "/home/bisma", "cwd dangkal tak diubah");
-	assert(shortenCwd("D:\\Pi\\a\\pi-arnative") === "D:/\u2026/a/pi-arnative", "path Windows jauh: drive dipertahankan");
-	assert(shortenCwd("D:\\Pi\\pi-arnative") === "D:\\Pi\\pi-arnative", "path Windows dangkal tak diubah");
-	assert(shortenCwd("/a/x/y/z") === "\u2026/y/z", "path jauh -> tail");
-	assert(shortenCwd("") === "", "cwd kosong");
-	assert(formatDuration(0) === "-", "durasi kosong = -");
-	assert(formatDuration(5_000) === "5s", "detik saja");
-	assert(formatDuration(65_000) === "1m 5s", "menit + detik");
-	assert(formatDuration(3_700_000) === "1h 1m", "jam + menit");
+if (isMain(import.meta.url)) {
+	assert(shortenCwd("/run/media/bisma/DATA/Pi/pi-arnative") === "\u2026/Pi/pi-arnative", "cwd inside -> last 2 segments");
+	assert(shortenCwd("/home/bisma") === "/home/bisma", "shallow cwd left unchanged");
+	assert(shortenCwd("D:\\Pi\\a\\pi-arnative") === "D:/\u2026/a/pi-arnative", "long Windows path: drive kept");
+	assert(shortenCwd("D:\\Pi\\pi-arnative") === "D:\\Pi\\pi-arnative", "shallow Windows path left unchanged");
+	assert(shortenCwd("/a/x/y/z") === "\u2026/y/z", "long path -> tail");
+	assert(shortenCwd("") === "", "empty cwd");
+	assert(formatDuration(0) === "-", "empty duration = -");
+	assert(formatDuration(5_000) === "5s", "seconds only");
+	assert(formatDuration(65_000) === "1m 5s", "minutes + seconds");
+	assert(formatDuration(3_700_000) === "1h 1m", "hours + minutes");
 
 	const plain = (s: string) => s;
-	const D = "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500"; // 8 kolom = lebar isi pada uji ini
+	const D = "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500"; // 8 columns = content width in this test
 	const boxed = boxEditorLines([D, "  hi    ", "  lo    ", D, "  /mo "], 2, plain);
-	assert(boxed[0] === `\u256d${D}\u2500\u2500\u2500\u256e`, "kotak editor: korner atas selebar isi");
-	assert(boxed[1] === "\u2502 >   hi    \u2502", "kotak editor: prompt ' > ' di baris pertama");
-	assert(boxed[2] === "\u2502     lo    \u2502", "kotak editor: baris lanjutan indent, tanpa > kedua");
-	assert(boxed[3] === `\u2570${D}\u2500\u2500\u2500\u256f`, "kotak editor: korner bawah");
-	assert(boxed[4] === "  /mo ", "baris autocomplete tetap di luar kotak");
+	assert(boxed[0] === `\u256d${D}\u2500\u2500\u2500\u256e`, "editor box: top corner spans the content");
+	assert(boxed[1] === "\u2502 >   hi    \u2502", "editor box: ' > ' prompt on the first line");
+	assert(boxed[2] === "\u2502     lo    \u2502", "editor box: continuation indented, no second >");
+	assert(boxed[3] === `\u2570${D}\u2500\u2500\u2500\u256f`, "editor box: bottom corner");
+	assert(boxed[4] === "  /mo ", "autocomplete lines stay outside the box");
 	const dimP = (s: string) => `\x1b[2m${s}\x1b[0m`;
 	const boxedDim = boxEditorLines([D, "  hi    ", D], 1, plain, dimP(" > "));
-	assert(visibleWidth(boxedDim[1]!) === visibleWidth(D) + 5, "prompt ber-ANSI (dim) tak menggeser lebar");
-	assert(boxedDim[1]!.startsWith(`\u2502${dimP(" > ")}`), "prompt dim dipertahankan apa adanya");
+	assert(visibleWidth(boxedDim[1]!) === visibleWidth(D) + 5, "ANSI (dim) prompt does not shift the width");
+	assert(boxedDim[1]!.startsWith(`\u2502${dimP(" > ")}`), "dim prompt kept as-is");
 
 	// Self-check: getToolWorkingMessage
 	assert(getToolWorkingMessage("edit") === "Editing", "edit -> Editing");
@@ -656,14 +637,14 @@ if (isMain) {
 	assert(getToolWorkingMessage("todo") === "Updating tasks", "todo -> Updating tasks");
 	assert(getToolWorkingMessage("unknown_tool") === "Working", "unknown -> Working");
 	assert(getToolWorkingMessage("mcp", { tool: "fetch_repo" }) === "Fetching", "mcp fetch -> Fetching");
-	assert(boxed.slice(0, 4).every((l) => visibleWidth(l) === visibleWidth(D) + 5), "lebar kotak seragam (sisi+prompt)");
-	assert(boxEditorLines(["\u2500\u2500\u2500\u2500"], 1, plain).length === 1, "terlalu sempit: tak diubah");
+	assert(boxed.slice(0, 4).every((l) => visibleWidth(l) === visibleWidth(D) + 5), "uniform box width (sides + prompt)");
+	assert(boxEditorLines(["\u2500\u2500\u2500\u2500"], 1, plain).length === 1, "too narrow: left unchanged");
 
 	// Guard: the reload shortcut must match every encoding a terminal can deliver,
 	// so a typo in the key id fails here instead of silently doing nothing.
-	assert(matchesKey("\x1b\x12", RELOAD_SHORTCUT), "shortcut cocok dgn ctrl+alt+r legacy (ESC + 0x12)");
-	assert(matchesKey("\x1b[114;7u", RELOAD_SHORTCUT), "shortcut cocok dgn ctrl+alt+r Kitty CSI-u");
-	assert(!matchesKey("\x12", RELOAD_SHORTCUT), "ctrl+r polos tidak memicu reload");
-	assert(!matchesKey("r", RELOAD_SHORTCUT), "huruf r tidak memicu reload");
+	assert(matchesKey("\x1b\x12", RELOAD_SHORTCUT), "shortcut matches legacy ctrl+alt+r (ESC + 0x12)");
+	assert(matchesKey("\x1b[114;7u", RELOAD_SHORTCUT), "shortcut matches Kitty CSI-u ctrl+alt+r");
+	assert(!matchesKey("\x12", RELOAD_SHORTCUT), "plain ctrl+r does not trigger reload");
+	assert(!matchesKey("r", RELOAD_SHORTCUT), "bare letter r does not trigger reload");
 	console.log("footer.ts self-check OK");
 }