@linxiraos/pi-tui 1.2.0 → 1.3.0

package/src/overlays/session-selector.ts

@@ -1338,6 +1338,8 @@ export interface SessionSelectorOptions<T extends SessionSelectorEntry = Session
 	allSessions?: T[];
 	/** Picker heading; defaults to "Resume Session". */
 	title?: string;
+	/** Primary action label; defaults to "Resume" (ANSI footer defaults to "select"). */
+	actionLabel?: string;
 	/** Fixed scope label, or false to omit the scope suffix. */
 	scopeLabel?: string | false;
 	/**
@@ -1363,7 +1365,7 @@ export interface SessionSelectorOptions<T extends SessionSelectorEntry = Session
 	/** Path of the live session, or a getter so detach/newSession stays accurate. */
 	currentSessionPath?: string | (() => string | undefined);
 	/**
-	 * The picker is the whole program (`zeta-c --resume`): the native picker
+	 * The picker is the whole program (`zetacode --resume`): the native picker
 	 * fills the screen surface (`size:"screen"`) instead of floating as a
 	 * sheet over the transcript.
 	 */
@@ -1405,6 +1407,7 @@ export class SessionSelectorComponent<T extends SessionSelectorEntry = SessionSe
 	readonly #getTerminalRows: () => number;
 	readonly #fillHeight: boolean;
 	readonly #title: string;
+	readonly #actionLabel: string;
 	readonly #scopeLabel: string | false | undefined;
 	/** What `#messageContainer` shows, for the native description. */
 	#message: SessionPickerMessage | undefined;
@@ -1462,6 +1465,7 @@ export class SessionSelectorComponent<T extends SessionSelectorEntry = SessionSe
 		this.#getTerminalRows = options.getTerminalRows ?? (() => 24);
 		this.#fillHeight = options.fillHeight ?? false;
 		this.#title = options.title ?? "Resume Session";
+		this.#actionLabel = options.actionLabel ?? "Resume";
 		this.#pickerTitle = options.title;
 		this.#standalone = options.standalone ?? false;
 		this.#scopeLabel = options.scopeLabel;
@@ -1496,9 +1500,11 @@ export class SessionSelectorComponent<T extends SessionSelectorEntry = SessionSe
 			onExit();
 		};
 		this.#sessionList.onRequestRender = () => this.#onRequestRender?.();
-		this.#sessionList.onDeleteRequest = (session: T) => {
-			this.#showDeleteConfirmation(session);
-		};
+		if (this.#onDelete) {
+			this.#sessionList.onDeleteRequest = (session: T) => {
+				this.#showDeleteConfirmation(session);
+			};
+		}
 		if (this.#loadAllSessions || this.#globalSessions) {
 			this.#sessionList.onToggleScope = () => {
 				void this.#toggleScope();
@@ -1676,7 +1682,7 @@ export class SessionSelectorComponent<T extends SessionSelectorEntry = SessionSe
 		const cancel = interruptKey();
 		const hint = theme.fg(
 			"muted",
-			`[${formatKeyHints(["delete", "backspace"])} delete · ${formatKeyHint("enter")} select · ${formatKeyHint("tab")} ${scopeHint} · ${cancel} cancel]`,
+			`[${this.#onDelete ? `${formatKeyHints(["delete", "backspace"])} delete · ` : ""}${formatKeyHint("enter")} select · ${formatKeyHint("tab")} ${scopeHint} · ${cancel} cancel]`,
 		);
 		return [row("", width), row(hint, width), row("", width), bottomBorder(width)];
 	}
@@ -1724,10 +1730,9 @@ export class SessionSelectorComponent<T extends SessionSelectorEntry = SessionSe
 		} else {
 			children.push(this.#sessionList.searchInput, list);
 		}
-		const hints: (NativeHint | undefined)[] = [
-			{ keys: ["delete", "backspace"], label: "delete" },
-			{ keys: ["enter"], label: "select" },
-		];
+		const hints: (NativeHint | undefined)[] = [];
+		if (this.#onDelete) hints.push({ keys: ["delete", "backspace"], label: "delete" });
+		hints.push({ keys: ["enter"], label: "select" });
 		if (this.#sessionList.onToggleScope) {
 			hints.push({ keys: ["tab"], label: this.#scope === "all" ? "current folder" : "all projects" });
 		}
@@ -1774,7 +1779,7 @@ export class SessionSelectorComponent<T extends SessionSelectorEntry = SessionSe
 		}
 		const loading = message?.kind === "loading";
 		const toggle = list.onToggleScope !== undefined;
-		const actions = [pickerAction("resume", "Resume", "enter", { primary: true })];
+		const actions = [pickerAction("resume", this.#actionLabel, "enter", { primary: true })];
 		if (this.#onDelete) actions.push(pickerAction("delete", "Delete", "backspace"));
 		if (toggle) {
 			actions.push(pickerAction("scope", this.#scope === "all" ? "This folder" : "All projects", "tab"));

package/src/overlays/settings-selector.ts

@@ -1102,6 +1102,9 @@ export class SettingsSelectorComponent implements Component {
 				const open = list.openSubmenu;
 				if (open?.id === id && open.component instanceof MultiSelectSubmenu) {
 					open.component.setValues(value);
+					// The native page applies a chip toggle without closing its
+					// editor, so the row and its tab badge only update here.
+					this.#refreshItems();
 					return;
 				}
 				const next = [...value];

package/src/overlays/show-images-selector.ts

@@ -46,6 +46,7 @@ export class ShowImagesSelectorComponent extends OverlayPanel {
 		this.addChild(this.#selectList);
 		this.#sheet = new SelectListSheet(this.#selectList, {
 			title: "Show images",
+			icon: "image",
 			noun: "options",
 			current: [currentValue ? "yes" : "no"],
 		});

package/src/overlays/snapcompact-shape-preview.ts

@@ -24,6 +24,7 @@ import {
 	SHAPE_VARIANT_NAMES,
 	SHAPE_VARIANTS,
 	type Shape,
+	type ShapeGeometry,
 	type ShapeTarget,
 	type ShapeVariantName,
 } from "@linxiraos/pi-snapcompact";
@@ -90,7 +91,7 @@ export class SnapcompactShapePreview implements Component {
 
 	describe(cx: DescribeContext): NativeNode {
 		const shape = resolveShape(this.#model, this.#variant);
-		const name = resolvedVariantName(shape);
+		const name = this.#variant === "auto" ? resolvedVariantName(shape) : this.#variant;
 		const entry = cx.supports("image") ? this.#ensureEntry(name, shape) : undefined;
 		const memo = this.#native;
 		if (memo !== undefined && memo.variant === this.#variant && memo.entry === entry) return memo.node;
@@ -128,7 +129,7 @@ export class SnapcompactShapePreview implements Component {
 
 	render(width: number): readonly string[] {
 		const shape = resolveShape(this.#model, this.#variant);
-		const name = resolvedVariantName(shape);
+		const name = this.#variant === "auto" ? resolvedVariantName(shape) : this.#variant;
 		const { label, stats } = this.#caption(shape, name);
 		const lines: string[] = [theme.fg("muted", `  Sample (zoomed) · ${label} · ${stats}`), ""];
 
@@ -215,17 +216,23 @@ export class SnapcompactShapePreview implements Component {
 	}
 }
 
-/** Research name of the concrete geometry `resolveShape` picked (for `auto`). */
+/**
+ * Research name of the geometry `resolveShape` picked for `auto`. The frame
+ * edge is not compared: `auto` widens it per model line and hosts cap it
+ * (catalog `image-max-edge`), and the sample renders a fixed mini-page anyway.
+ */
 function resolvedVariantName(shape: Shape): ShapeVariantName {
 	for (const name of SHAPE_VARIANT_NAMES) {
-		const candidate = SHAPE_VARIANTS[name];
+		const candidate: ShapeGeometry = SHAPE_VARIANTS[name];
 		if (
 			candidate.font === shape.font &&
 			candidate.cellWidth === shape.cellWidth &&
 			candidate.cellHeight === shape.cellHeight &&
+			candidate.stretch === shape.stretch &&
 			candidate.variant === shape.variant &&
-			candidate.lineRepeat === shape.lineRepeat &&
-			candidate.frameSize === shape.frameSize
+			candidate.stopwordDim === shape.stopwordDim &&
+			candidate.columns === shape.columns &&
+			candidate.lineRepeat === shape.lineRepeat
 		) {
 			return name;
 		}

package/src/overlays/theme-selector.ts

@@ -71,7 +71,12 @@ export class ThemeSelectorComponent extends OverlayPanel {
 		};
 
 		this.addChild(this.#selectList);
-		this.#sheet = new SelectListSheet(this.#selectList, themePickerOptions("Theme", currentTheme));
+		// The picker checks the current theme, so its "(current)" text stays in the terminal list.
+		const options = themePickerOptions("Theme", currentTheme);
+		this.#sheet = new SelectListSheet(this.#selectList, {
+			...options,
+			decorate: item => ({ ...options.decorate?.(item), detail: "" }),
+		});
 	}
 
 	override describe(cx: DescribeContext): NativeNode | null {

package/src/overlays/thinking-selector.ts

@@ -1,3 +1,4 @@
+import { THINKING_EFFORTS } from "@linxiraos/pi-catalog/effort";
 import { AUTO_THINKING, type ConfiguredThinkingLevel, getConfiguredThinkingLevelMetadata } from "../thinking";
 import type { Effort } from "@linxiraos/pi-ai";
 import { tuiText } from "../i18n";
@@ -48,10 +49,13 @@ export class ThinkingSelectorComponent extends OverlayPanel {
 			icon: "brain",
 			noun: "levels",
 			current: currentLevel ? [currentLevel] : [],
-			decorate: item =>
-				item.value === AUTO_THINKING
-					? {}
-					: { chips: [{ text: "", dot: `thinking${item.value.charAt(0).toUpperCase()}${item.value.slice(1)}` }] },
+			// How hard each level thinks, as a meter from off (empty) to the deepest effort (full); auto has none.
+			columns: [{ id: "depth", format: "bar" }],
+			decorate: item => {
+				if (item.value === AUTO_THINKING) return undefined;
+				const effort = THINKING_EFFORTS.indexOf(item.value as (typeof THINKING_EFFORTS)[number]);
+				return { facts: { depth: (effort + 1) / THINKING_EFFORTS.length } };
+			},
 		});
 	}
 

package/src/overlays/tree-selector.ts

@@ -56,7 +56,8 @@ import { resolveAssistantErrorPresentation } from "../chat/transcript-render-hel
 import { OverlayPanel, PanelDivider } from "../chrome/overlay-box";
 import { TreeView, type TreeAncestor, type TreeRow } from "../components/tree-view";
 import { formatKeyHint, formatKeyHints } from "../app-keybindings";
-import { boundKeys, editorKeys, interruptKey } from "../chrome/keybinding-hints";
+import { boundKeys, editorKey, editorKeys, interruptKey } from "../chrome/keybinding-hints";
+import { getKeybindings } from "../keybindings";
 import type { TspPickerItem, TspPickerProps, TspSpan, TspText } from "@linxiraos/pi-wire";
 import type { ThemeColor } from "../theme/schema";
 import { col, keyed, node, span, text } from "../native/describe";
@@ -204,6 +205,7 @@ class TreeList implements Component {
 	#roots: TreeSelectorNode[] = [];
 	#rootIds: Set<string> = new Set();
 	#nodeById: Map<string, TreeSelectorNode> = new Map();
+	#parentById: Map<string, string | null> = new Map();
 	#filterMode: FilterMode;
 	/** The search field; its value is the fuzzy query. */
 	readonly searchInput = new Input();
@@ -236,6 +238,14 @@ class TreeList implements Component {
 		| { rows: readonly TreeRow<TreeSelectorNode, string>[]; labels: number; items: TspPickerItem[] }
 		| undefined;
 	#pickerOrder: { rows: readonly TreeRow<TreeSelectorNode, string>[]; order: string[] } | undefined;
+	/** Branch-navigation targets for one filtered rows snapshot; filtering replaces the rows array. */
+	#branchTargets:
+		| {
+				rows: readonly TreeRow<TreeSelectorNode, string>[];
+				targets: readonly TreeSelectorNode[];
+				targetIndexByRootId: ReadonlyMap<string, number>;
+		  }
+		| undefined;
 	#previewMemo: { node: TreeSelectorNode | undefined; labels: number; preview: NativeChild[] } | undefined;
 
 	constructor(
@@ -293,8 +303,9 @@ class TreeList implements Component {
 		this.#containsActive.clear();
 		this.#nodeById.clear();
 		this.#activePathIds.clear();
+		this.#parentById.clear();
 
-		const parentIds = new Map<string, string | null>();
+		const parentIds = this.#parentById;
 		const allNodes: TreeSelectorNode[] = [];
 		const visitStack: TreeSelectorNode[] = [...roots];
 		while (visitStack.length > 0) {
@@ -367,6 +378,100 @@ class TreeList implements Component {
 		return [...children].sort((a, b) => Number(this.#containsActive.get(b)) - Number(this.#containsActive.get(a)));
 	}
 
+	/** Visible branch targets in rendered order, keyed by every raw branch head. */
+	#visibleBranchProjection(rows: readonly TreeRow<TreeSelectorNode, string>[]): {
+		targets: readonly TreeSelectorNode[];
+		targetIndexByRootId: ReadonlyMap<string, number>;
+	} {
+		const visibleIndex = new Map<string, number>();
+		for (let index = 0; index < rows.length; index++) visibleIndex.set(rows[index]!.key, index);
+		const nodes: TreeSelectorNode[] = [];
+		const stack = [...this.#roots].reverse();
+		while (stack.length > 0) {
+			const node = stack.pop()!;
+			nodes.push(node);
+			const children = this.#orderedChildren(node);
+			for (let index = children.length - 1; index >= 0; index--) stack.push(children[index]!);
+		}
+
+		// One bottom-up pass makes filtered-head promotion O(nodes), rather than
+		// rescanning a branch subtree for every fork.
+		const firstVisibleById = new Map<string, TreeSelectorNode>();
+		for (let index = nodes.length - 1; index >= 0; index--) {
+			const node = nodes[index]!;
+			let target = visibleIndex.has(node.entry.id) ? node : undefined;
+			if (!target) {
+				for (const child of this.#orderedChildren(node)) {
+					target = firstVisibleById.get(child.entry.id);
+					if (target) break;
+				}
+			}
+			if (target) firstVisibleById.set(node.entry.id, target);
+		}
+
+		const byTargetId = new Map<string, { rootIds: string[]; target: TreeSelectorNode }>();
+		const addFork = (branches: readonly TreeSelectorNode[]) => {
+			if (branches.length < 2) return;
+			for (const branch of branches) {
+				const target = firstVisibleById.get(branch.entry.id);
+				if (!target) continue;
+				const existing = byTargetId.get(target.entry.id);
+				if (existing) existing.rootIds.push(branch.entry.id);
+				else byTargetId.set(target.entry.id, { rootIds: [branch.entry.id], target });
+			}
+		};
+		addFork(this.#roots);
+		for (const node of nodes) addFork(this.#orderedChildren(node));
+
+		const ordered = [...byTargetId.values()].sort(
+			(a, b) => visibleIndex.get(a.target.entry.id)! - visibleIndex.get(b.target.entry.id)!,
+		);
+		const targetIndexByRootId = new Map<string, number>();
+		for (let index = 0; index < ordered.length; index++) {
+			for (const rootId of ordered[index]!.rootIds) targetIndexByRootId.set(rootId, index);
+		}
+		return { targets: ordered.map(entry => entry.target), targetIndexByRootId };
+	}
+
+	/** Raw branch root containing `entryId` at its nearest ancestor fork. */
+	#nearestBranchRootId(entryId: string): string | undefined {
+		let branchId = entryId;
+		let parentId = this.#parentById.get(branchId);
+		while (parentId !== undefined) {
+			const siblings = parentId === null ? this.#roots : this.#orderedChildren(this.#nodeById.get(parentId)!);
+			if (siblings.length > 1) return branchId;
+			if (parentId === null) break;
+			branchId = parentId;
+			parentId = this.#parentById.get(parentId);
+		}
+		return undefined;
+	}
+
+	/**
+	 * Move through every visible branch in rendered order, crossing nested fork
+	 * depths. Raw ancestry identifies branch membership; visibility only chooses
+	 * the first selectable descendant when a branch head is filtered.
+	 */
+	#moveBranch(direction: -1 | 1): void {
+		const selected = this.#tree.selectedItem;
+		if (!selected) return;
+		// Projection is O(nodes); reuse it across presses until filtering replaces the rows.
+		const rows = this.#tree.rows;
+		if (this.#branchTargets?.rows !== rows) this.#branchTargets = { rows, ...this.#visibleBranchProjection(rows) };
+		const { targets, targetIndexByRootId } = this.#branchTargets;
+
+		if (targets.length === 0) return;
+		const currentRootId = this.#nearestBranchRootId(selected.entry.id);
+		const currentIndex = currentRootId === undefined ? -1 : (targetIndexByRootId.get(currentRootId) ?? -1);
+		const nextIndex =
+			currentIndex < 0
+				? direction > 0
+					? 0
+					: targets.length - 1
+				: (currentIndex + direction + targets.length) % targets.length;
+		this.#tree.setSelectedKey(targets[nextIndex]!.entry.id);
+	}
+
 	#applyFilter(): void {
 		// TreeView retains the nearest visible selection (including an anchor
 		// through empty filter results) when the predicate is replaced.
@@ -1210,6 +1315,10 @@ class TreeList implements Component {
 					(node.entry.message.role === "user" || node.entry.message.role === "assistant"),
 				1,
 			);
+		} else if (getKeybindings().matches(keyData, "app.tree.previousBranch")) {
+			this.#moveBranch(-1);
+		} else if (getKeybindings().matches(keyData, "app.tree.nextBranch")) {
+			this.#moveBranch(1);
 		} else if (matchesKey(keyData, "home")) {
 			this.#tree.setSelectionIndex(0);
 		} else if (matchesKey(keyData, "end")) {
@@ -1398,6 +1507,10 @@ export class TreeSelectorComponent extends OverlayPanel {
 		this.#treeContainer.addChild(this.#treeList);
 
 		this.#labelInputContainer = new Container();
+		// Either action may be unbound; hint only the keys that still do something.
+		const branchKeys = [editorKey("app.tree.previousBranch"), editorKey("app.tree.nextBranch")]
+			.filter(Boolean)
+			.join("/");
 
 		this.addChild(new Spacer(1));
 		this.addChild(
@@ -1407,6 +1520,7 @@ export class TreeSelectorComponent extends OverlayPanel {
 					[
 						`${formatKeyHint("enter")}: switch.`,
 						`${formatKeyHints(["alt+up", "alt+down"])}: previous/next turn.`,
+						...(branchKeys ? [`${branchKeys}: previous/next branch.`] : []),
 						`${editorKeys("tui.select.pageUp", "tui.select.pageDown")} (${formatKeyHints(["left", "right"])}): page.`,
 						`${formatKeyHints(["home", "end"])}: first/last item.`,
 						`${formatKeyHint("shift+enter")}: summarize & switch.`,
@@ -1563,6 +1677,7 @@ export class TreeSelectorComponent extends OverlayPanel {
 			hintsRow([
 				{ keys: ["enter"], label: "switch" },
 				{ keys: ["alt+up", "alt+down"], label: "previous/next turn" },
+				actionHint(["app.tree.previousBranch", "app.tree.nextBranch"], "previous/next branch"),
 				actionHint(["tui.select.pageUp", "tui.select.pageDown"], "page"),
 				{ keys: ["home", "end"], label: "first/last" },
 				{ keys: ["shift+enter"], label: "summarize & switch" },