@oisin-ee/oisinpi 0.5.0 → 0.5.1

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @oisin-ee/oisinpi
 
+## 0.5.1
+
+### Patch Changes
+
+- [`0170caa`](https://github.com/oisin-ee/oisinpi/commit/0170caa9c59c4e3d71409627b14925cefcc68679) Thanks [@momo-momokaya[bot]](https://github.com/momo-momokaya%5Bbot%5D)! - Bundle pi-wrangle 0.12.2. Show the current task and named agents and jobs above the editor. Alt+W and `/work` expand the same widget in place, without a popup or editor replacement.
+- Updated dependencies []:
+  - @oisin-ee/pi-guardrails@0.5.1
+  - @oisin-ee/pi-prewalk@0.5.1
+  - @oisin-ee/pi-todo@0.5.1
+
 ## 0.5.0
 
 ### Minor Changes

package/README.md

@@ -6,7 +6,7 @@ Oisin's [pi](https://pi.dev) packages in one install, at versions tested togethe
 | ---------------------------------------------------------------------------------- | -------------------------------------------------------------------------- |
 | [`@oisin-ee/pi-prewalk`](https://www.npmjs.com/package/@oisin-ee/pi-prewalk)       | A frontier model plans and makes the first edit; a cheaper model finishes. |
 | [`@oisin-ee/pi-todo`](https://www.npmjs.com/package/@oisin-ee/pi-todo)             | The `todo` tool, which also opens the prewalk gate.                        |
-| [`@oisin-ee/pi-wrangle`](https://www.npmjs.com/package/@oisin-ee/pi-wrangle)       | The shared `WORK` strip, `/work`, `/wrangle`, and the agent/job inbox.     |
+| [`@oisin-ee/pi-wrangle`](https://www.npmjs.com/package/@oisin-ee/pi-wrangle)       | The inline `WORK` widget, `/work`, `/wrangle`, and the agent/job inbox.    |
 | [`@oisin-ee/pi-guardrails`](https://www.npmjs.com/package/@oisin-ee/pi-guardrails) | Git safety, the wait gate, and the agent-typing gate on every tool call.   |
 
 ```bash
@@ -17,6 +17,8 @@ The collection bundles the four packages in its tarball and adds no code. No mem
 installs by itself. pi-wrangle needs the `wrangle` binary at the same version
 ([oisin-ee/wrangle](https://github.com/oisin-ee/wrangle)).
 
-`/work` shows read-only todos for the active Pi branch and agents/jobs for the Herdr owner pane.
+The compact widget shows the current task and named agents and jobs above the editor.
+Alt+W or `/work` expands that widget in place, without a popup. Typing stays in the editor.
+Todos follow the active Pi branch. Agents and jobs follow the Herdr owner pane.
 Use Wrangle `run`, `read`, and `stop` for background work. The collection does not require `pi-background-tasks`.
 Standalone pi-todo keeps its own widget when Wrangle does not claim the shared display.

package/node_modules/@oisin-ee/pi-guardrails/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oisin-ee/pi-guardrails",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "Agent guardrails for pi, Claude Code, and Codex: Git safety, no waiting, no typing into other agents, GitOps-only clusters.",
   "keywords": [
     "claude-code",

package/node_modules/@oisin-ee/pi-prewalk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oisin-ee/pi-prewalk",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "A one-shot planner-to-executor handoff for pi, with branch-backed Rust rules.",
   "keywords": [
     "pi-extension",

package/node_modules/@oisin-ee/pi-todo/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oisin-ee/pi-todo",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "A todo tool for pi with a Rust core: one active task, state on the session branch.",
   "keywords": [
     "pi-extension",

package/node_modules/@oisin-ee/pi-wrangle/README.md

@@ -466,8 +466,8 @@ The caller is the harness's `HERDR_PANE_ID`. Pi registers the server from its ex
 
 The extension adds host status before each prompt, registers the tools, and draws:
 
-- **The `WORK` strip** above the editor: one row for todo progress, agents, jobs, and attention. Agent/job data refreshes every ten seconds. Compatible pi-todo snapshots update immediately. Empty providers hide the strip; unavailable providers show an error instead of false zero counts.
-- **`/work`**, a bounded overlay with All, Todos, Agents, and Jobs views. Tab changes views; Enter opens details. Todos are read-only. Explicit actions stop jobs, cancel queued tickets, or message agents through the inbox. Stop and cancel require confirmation. Escape returns to the unchanged editor draft. Completed job history stays collapsed until selected.
+- **The `WORK` widget** above the editor shows the current task and named agents and jobs. Agent/job data refreshes every ten seconds. Compatible pi-todo snapshots update immediately. Empty providers hide the widget. Unavailable providers show an error.
+- **Alt+W or `/work`** expands or collapses that widget in place, without a popup or editor replacement. Alt+J/K moves selection, Alt+] changes views, and Alt+I shows inline details. Typing stays in the editor. Alt+S stops jobs, Alt+C cancels queued work, and Alt+M sends agent messages. Stop and cancel require confirmation. Completed job history starts collapsed.
 - **`/wrangle`**, the control panel, with four tabs: Status (hosts with their retry state, then your rows; Enter on a host reads it again now), Hosts (reconnect, rename, enable, disable, add), Profiles (Enter edits `prompt.md`), and Inbox. The widget steps aside while the panel is open.
 - **The inbox reader** and a renderer that shows each record's kind, sender, and text, folded past twelve lines.
 

package/node_modules/@oisin-ee/pi-wrangle/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oisin-ee/pi-wrangle",
-  "version": "0.12.1",
+  "version": "0.12.2",
   "description": "Pi extension for wrangle: the board, the /wrangle panel, the inbox reader, and the wrangle tools. Needs the wrangle binary of the same version.",
   "type": "module",
   "license": "MIT",

package/node_modules/@oisin-ee/pi-wrangle/pi/index.ts

@@ -1,13 +1,13 @@
 import { readFileSync } from "node:fs";
 import type { ExtensionAPI, ExtensionContext } from "@earendil-works/pi-coding-agent";
-import { Box, Text } from "@earendil-works/pi-tui";
+import { Box, Text, Key } from "@earendil-works/pi-tui";
 import { type Board, clean, parseBoard } from "./board.ts";
 import { WorkTodo } from "./work-todo.ts";
 import { workStrip, workText, type WorkState } from "./work.ts";
 import { type Details, InboxReader, MESSAGE_TYPE } from "./inbox.ts";
 import { openPanel } from "./panel.ts";
 import { loadJobHistory, type JobHistory } from "./work-history.ts";
-import { WorkPanel, runWorkAction, showWorkDetail, type WorkAction, type WorkCursor, type WorkData, type WorkTab } from "./work-panel.ts";
+import { WorkPanel, WorkDetail, runWorkAction, type WorkAction, type WorkCursor, type WorkData, type WorkTab } from "./work-panel.ts";
 
 const REFRESH_MS = 10_000;
 
@@ -64,7 +64,9 @@ export default function wrangle(pi: ExtensionAPI) {
 	let workOpen = false;
 	let history: JobHistory = { jobs: [] };
 	let workPanel: WorkPanel | undefined;
-	let closeWork: (() => void) | undefined;
+	let workDetail: WorkDetail | undefined;
+	let detail: { title: string; body: string } | undefined;
+	let cursor: WorkCursor = { tab: "all", selected: undefined, history: false };
 	let workAbort: AbortController | undefined;
 	let context: ExtensionContext | undefined;
 	const todos = new WorkTodo(pi.events, () => { if (context) draw(context); }, () => {
@@ -77,44 +79,52 @@ export default function wrangle(pi: ExtensionAPI) {
 
 	function workData(): WorkData { return { ...state(), history }; }
 
+	function collapseWork(ctx: ExtensionContext): void {
+		workAbort?.abort();
+		workAbort = undefined;
+		workOpen = false;
+		workPanel = undefined;
+		workDetail = undefined;
+		detail = undefined;
+		history = { jobs: [] };
+		draw(ctx);
+	}
+
 	async function openWork(ctx: ExtensionContext, tab: WorkTab): Promise<void> {
 		if (ctx.mode !== "tui") { ctx.ui.notify(workText(state()), "info"); return; }
-		if (workOpen || panelOpen) return;
+		if (panelOpen) return;
 		workOpen = true;
+		detail = undefined;
+		workDetail = undefined;
+		cursor = { tab, selected: undefined, history: false };
+		workPanel = undefined;
+		const current = generation;
+		draw(ctx);
+		// Draw immediately; remote history must not delay expansion or typing.
+		if (refresh) await refresh;
+		if (current === generation && workOpen) await update(ctx);
+	}
+
+	async function act(ctx: ExtensionContext, action: WorkAction | undefined): Promise<void> {
+		if (!action) { collapseWork(ctx); return; }
+		if (workAbort) return;
 		const interaction = new AbortController();
 		workAbort = interaction;
 		const current = generation;
-		let cursor: WorkCursor = { tab, selected: undefined, history: false };
 		try {
-			// An older refresh may predate history demand; finish it before the panel refresh.
-			if (refresh) await refresh;
-			if (interaction.signal.aborted || current !== generation) return;
+			const body = await runWorkAction(action, ctx, exec, interaction.signal);
+			if (current !== generation || interaction.signal.aborted) return;
+			if (body !== undefined) { detail = { title: action.entry.label, body }; workDetail = undefined; }
+			draw(ctx);
 			await update(ctx);
-			while (current === generation && workOpen) {
-				const action = await ctx.ui.custom<WorkAction | undefined>((tui, theme, keys, done) => {
-					closeWork = () => done(undefined);
-					workPanel = new WorkPanel(workData(), cursor, theme, keys, done, () => tui.requestRender(), () => tui.terminal.rows);
-					return workPanel;
-				}, { overlay: true, overlayOptions: { width: "90%", maxHeight: "85%", anchor: "center" } });
-				workPanel = undefined;
-				closeWork = undefined;
-				if (!action || current !== generation) break;
-				cursor = action.cursor;
-				try {
-					const detail = await runWorkAction(action, ctx, exec, interaction.signal);
-					if (detail !== undefined && current === generation) await showWorkDetail(ctx, action.entry.label, detail, interaction.signal);
-				} catch (error) {
-					if (current === generation) await showWorkDetail(ctx, "Work action unavailable", String(error), interaction.signal);
-				}
-				if (current === generation) await update(ctx);
+		} catch (error) {
+			if (current === generation && !interaction.signal.aborted) {
+				detail = { title: "Work action unavailable", body: String(error) };
+				workDetail = undefined;
+				draw(ctx);
 			}
 		} finally {
-			interaction.abort();
 			if (workAbort === interaction) workAbort = undefined;
-			workPanel = undefined;
-			closeWork = undefined;
-			workOpen = false;
-			history = { jobs: [] };
 		}
 	}
 
@@ -122,10 +132,19 @@ export default function wrangle(pi: ExtensionAPI) {
 		if (ctx.mode !== "tui") return;
 		workPanel?.update(workData());
 		const data = state();
-		ctx.ui.setWidget("wrangle", panelOpen || (!data.board.rows.length && !data.todo?.tasks.length && !data.error) ? undefined : (_tui, theme) => ({
-			render: (width: number) => workStrip(data, width, theme),
-			invalidate: () => {},
-		}), { placement: "aboveEditor" });
+		ctx.ui.setWidget("wrangle", panelOpen || (!workOpen && !data.board.rows.length && !data.todo?.tasks.length && !data.error) ? undefined : (tui, theme) => {
+			if (workOpen) {
+				if (detail) {
+					workDetail ??= new WorkDetail(detail.title, detail.body, theme, () => tui.terminal.rows, () => tui.requestRender());
+					workDetail.setTheme(theme);
+					return workDetail;
+				}
+				workDetail = undefined;
+				workPanel = new WorkPanel(workData(), cursor, theme, action => { void act(ctx, action); }, () => tui.requestRender(), () => tui.terminal.rows);
+				return workPanel;
+			}
+			return { render: (width: number) => workStrip(data, width, theme), invalidate() {} };
+		}, { placement: "aboveEditor" });
 	}
 
 	function update(ctx: ExtensionContext): Promise<void> {
@@ -143,7 +162,7 @@ export default function wrangle(pi: ExtensionAPI) {
 				if (workOpen) {
 					const loaded = await loadJobHistory(exec, owner);
 					if (current !== generation) return;
-					history = loaded;
+					if (workOpen) history = loaded;
 				}
 				draw(ctx);
 			} catch (error) {
@@ -162,7 +181,12 @@ export default function wrangle(pi: ExtensionAPI) {
 		if (timer) clearInterval(timer);
 		generation++;
 		workAbort?.abort();
-		closeWork?.();
+		workAbort = undefined;
+		workOpen = false;
+		workPanel = undefined;
+		workDetail = undefined;
+		detail = undefined;
+		history = { jobs: [] };
 		context = ctx;
 		board = { hosts: [], rows: [] };
 		failure = owner ? undefined : "Wrangle needs a Herdr owner pane";
@@ -182,7 +206,11 @@ export default function wrangle(pi: ExtensionAPI) {
 	pi.on("session_shutdown", (_event, ctx) => {
 		generation++;
 		workAbort?.abort();
-		closeWork?.();
+		workAbort = undefined;
+		workOpen = false;
+		workPanel = undefined;
+		workDetail = undefined;
+		detail = undefined;
 		if (timer) clearInterval(timer);
 		timer = undefined;
 		inbox.stop();
@@ -203,12 +231,29 @@ export default function wrangle(pi: ExtensionAPI) {
 			return;
 		}
 	});
+	async function toggleWork(ctx: ExtensionContext): Promise<void> {
+		if (workOpen) collapseWork(ctx);
+		else await openWork(ctx, "all");
+	}
 	pi.registerCommand("work", {
-		description: "Read todos on this branch and this owner's agents and jobs",
-		handler: async (_args, ctx) => {
-			await openWork(ctx, "all");
-		},
+		description: "Expand or collapse work above the editor (Alt+W)",
+		handler: async (_args, ctx) => { await toggleWork(ctx); },
 	});
+	pi.registerShortcut(Key.alt("w"), { description: "Expand or collapse work above the editor", handler: toggleWork });
+	for (const [key, input, description] of [
+		["j", "\u001b[B", "Next work item / scroll down"], ["k", "\u001b[A", "Previous work item / scroll up"],
+		["]", "\t", "Next work view"], ["i", "\r", "Inspect work / return to list"],
+		["s", "s", "Stop selected job"], ["c", "c", "Cancel selected queued work"],
+		["m", "m", "Message selected agent"], ["r", "r", "Refresh work"],
+	] as const) {
+		pi.registerShortcut(Key.alt(key), { description, handler: async (_ctx) => {
+			if (!workOpen || panelOpen || workAbort || !context) return;
+			if (detail) {
+				if (key === "i") { detail = undefined; draw(context); }
+				else if (key === "j" || key === "k") workDetail?.handleInput(input);
+			} else workPanel?.handleInput(input);
+		} });
+	}
 	pi.registerCommand("wrangle", {
 		description: "Hosts, your children and jobs, profiles, and messages",
 		handler: async (_args, ctx) => {
@@ -216,7 +261,7 @@ export default function wrangle(pi: ExtensionAPI) {
 				ctx.ui.notify(await exec(["board"]), "info");
 				return;
 			}
-			if (workOpen || panelOpen) return;
+			if (panelOpen || workAbort) return;
 			panelOpen = true;
 			draw(ctx);
 			try {

package/node_modules/@oisin-ee/pi-wrangle/pi/work-panel.ts

@@ -1,4 +1,4 @@
-import type { ExtensionContext, KeybindingsManager, Theme } from "@earendil-works/pi-coding-agent";
+import type { ExtensionContext, Theme } from "@earendil-works/pi-coding-agent";
 import { Key, matchesKey, SelectList, Text, ScrollView, truncateToWidth } from "@earendil-works/pi-tui";
 import { clean } from "./board.ts";
 import type { WorkState } from "./work.ts";
@@ -19,7 +19,7 @@ export interface WorkAction { action: "inspect" | "stop" | "cancel" | "send" | "
 export function workEntries(data: WorkData, tab: WorkTab, history: boolean): WorkEntry[] {
 	const todos: WorkEntry[] = (data.todo?.tasks ?? []).map(task => ({ value: `todo:${task.content}`, label: `${task.status === "in_progress" ? "→" : task.status === "completed" ? "✓" : task.status === "abandoned" ? "−" : "·"} ${clean(task.content)}`, description: task.status, kind: "todo", detail: task.content }));
 	const canonicalHost = (label: string) => data.history.hosts?.find(host => host.label === label)?.id ?? label;
-	const rows: WorkEntry[] = data.board.rows.map(row => ({ value: `${row.kind}:${canonicalHost(row.host)}:${row.id}`, id: row.id, host: canonicalHost(row.host), ...(row.pane ? { pane: row.pane } : {}), kind: row.group === "waiting" ? "queued" : row.kind === "job" ? "job" : "agent", label: `${row.group === "attention" || row.group === "to_land" ? "!" : "●"} ${clean(row.name)}`, description: `${clean(row.state)} · ${clean(row.host)}`, running: row.group === "running" }));
+	const rows: WorkEntry[] = data.board.rows.map(row => ({ value: `${row.kind}:${canonicalHost(row.host)}:${row.id}`, id: row.id, host: canonicalHost(row.host), ...(row.pane ? { pane: row.pane } : {}), kind: row.group === "waiting" ? "queued" : row.kind === "job" ? "job" : "agent", label: `${row.group === "attention" || row.group === "to_land" ? "!" : "●"} ${clean(row.name)} · ${clean(row.state)}`, description: clean(row.host), running: row.group === "running" }));
 	const visible = tab === "todos" ? todos : tab === "agents" ? rows.filter(row => row.value.startsWith("agent:")) : tab === "jobs" ? rows.filter(row => row.value.startsWith("job:")) : [...rows.filter(row => row.label.startsWith("!")), ...todos.filter(row => row.description === "in_progress"), ...rows.filter(row => !row.label.startsWith("!")), ...todos.filter(row => row.description === "pending")];
 	if (tab === "all" || tab === "jobs") {
 		const known = new Set(rows.map(row => row.value));
@@ -39,21 +39,21 @@ export class WorkPanel {
 	private data: WorkData;
 	readonly cursor: WorkCursor;
 	private readonly theme: Theme;
-	private readonly keys: KeybindingsManager;
 	private readonly done: (action: WorkAction | undefined) => void;
 	private readonly renderRequest: () => void;
 	private readonly rows: () => number;
 	private height = 0;
 
-	constructor(data: WorkData, cursor: WorkCursor, theme: Theme, keys: KeybindingsManager, done: (action: WorkAction | undefined) => void, request: () => void, rows: () => number) {
-		this.data = data; this.cursor = cursor; this.theme = theme; this.keys = keys; this.done = done; this.renderRequest = request; this.rows = rows;
+	constructor(data: WorkData, cursor: WorkCursor, theme: Theme, done: (action: WorkAction | undefined) => void, request: () => void, rows: () => number) {
+		this.data = data; this.cursor = cursor; this.theme = theme; this.done = done; this.renderRequest = request; this.rows = rows;
 		this.rebuild();
 	}
 	update(data: WorkData): void { this.data = data; this.rebuild(); this.renderRequest(); }
+	private listHeight(): number { return Math.max(1, Math.min(12, Math.floor(this.rows() / 2) - 4)); }
 	private rebuild(preserveSelection = true): void {
 		if (preserveSelection) this.cursor.selected = this.list?.getSelectedItem()?.value ?? this.cursor.selected;
 		this.entries = workEntries(this.data, this.cursor.tab, this.cursor.history);
-		this.height = Math.max(1, Math.min(14, Math.floor(this.rows() * 0.8) - 5));
+		this.height = this.listHeight();
 		this.list = new SelectList(this.entries, this.height, {
 			selectedPrefix: text => this.theme.fg("accent", text), selectedText: text => this.theme.fg("accent", text),
 			description: text => this.theme.fg("muted", text), scrollInfo: text => this.theme.fg("dim", text), noMatch: text => this.theme.fg("muted", text),
@@ -82,12 +82,13 @@ export class WorkPanel {
 		else if (input === "c") this.act("cancel");
 		else if (input === "m") this.act("send");
 		else this.list.handleInput(input);
+		this.renderRequest();
 	}
 	invalidate(): void { this.list.invalidate(); }
 	render(width: number): string[] {
-		if (this.height !== Math.max(1, Math.min(14, Math.floor(this.rows() * 0.8) - 5))) this.rebuild();
+		if (this.height !== this.listHeight()) this.rebuild();
 		const tabbar = tabs.map(tab => tab === this.cursor.tab ? `[${tab.toUpperCase()}]` : tab).join(" · ");
-		return [this.theme.fg("accent", `WORK  ${tabbar}`), this.theme.fg("dim", "Todos: Pi branch · Agents/jobs: Herdr owner pane"), ...this.list.render(width), this.theme.fg("dim", "Tab view · Enter inspect · s stop · c cancel · m message"), this.theme.fg("dim", `r refresh · ${this.keys.getKeys("tui.select.cancel").join("/")} close`)].map(line => truncateToWidth(line, width));
+		return [this.theme.fg("accent", `WORK  ${tabbar}`), ...this.list.render(width), this.theme.fg("dim", "Alt+W collapse · Alt+J/K select · Alt+] view · Alt+I inspect"), this.theme.fg("dim", "Alt+S stop · Alt+C cancel · Alt+M message · Alt+R refresh")].map(line => truncateToWidth(line, width));
 	}
 }
 
@@ -105,7 +106,7 @@ export async function inspectEntry(entry: WorkEntry, exec: WorkExec): Promise<st
 	return hint + safeOutput(output);
 }
 
-/** Actions run after closing the list, so confirmation/input dialogs own focus. */
+/** Explicit actions may open confirmation/input dialogs; the work widget stays inline. */
 export async function runWorkAction(action: WorkAction, ctx: ExtensionContext, exec: WorkExec, signal: AbortSignal): Promise<string | undefined> {
 	if (signal.aborted) return undefined;
 	const entry = action.entry;
@@ -119,29 +120,29 @@ export async function runWorkAction(action: WorkAction, ctx: ExtensionContext, e
 	return undefined;
 }
 
-export async function showWorkDetail(ctx: ExtensionContext, title: string, body: string, signal: AbortSignal): Promise<void> {
-	if (signal.aborted) return;
-	await ctx.ui.custom<void>((tui, theme, keys, done) => {
-		const abort = () => done();
-		signal.addEventListener("abort", abort, { once: true });
-		const text = new Text(safeOutput(body) || "No output yet.", 0, 0);
-		const scroll = new ScrollView(text, { overscroll: "contain", scrollbar: "hidden" });
-		return {
-			dispose() { signal.removeEventListener("abort", abort); },
-			render(width: number) {
-				const height = Math.max(1, Math.min(24, Math.floor(tui.terminal.rows * 0.8) - 3));
-				scroll.updateLayout(text.render(width).length, height, () => tui.requestRender());
-				return [theme.fg("accent", truncateToWidth(title, width)), ...scroll.render(width).slice(scroll.scrollTop, scroll.scrollTop + height), theme.fg("dim", truncateToWidth("↑↓ / PageUp / PageDown scroll · Esc back", width))];
-			},
-			invalidate() { text.invalidate(); scroll.invalidate(); },
-			handleInput(input: string) {
-				if (keys.matches(input, "tui.select.cancel")) { done(); return; }
-				if (matchesKey(input, Key.up)) scroll.scrollBy(-1);
-				if (matchesKey(input, Key.down)) scroll.scrollBy(1);
-				if (matchesKey(input, Key.pageUp)) scroll.scrollBy(-scroll.viewportHeight);
-				if (matchesKey(input, Key.pageDown)) scroll.scrollBy(scroll.viewportHeight);
-				tui.requestRender();
-			},
-		};
-	}, { overlay: true, overlayOptions: { width: "90%", maxHeight: "85%", anchor: "center" } });
+/** Details occupy the same above-editor widget, never an overlay. */
+export class WorkDetail {
+	private readonly text: Text;
+	private readonly scroll: ScrollView;
+	private readonly title: string;
+	private theme: Theme;
+	private readonly rows: () => number;
+	private readonly request: () => void;
+	constructor(title: string, body: string, theme: Theme, rows: () => number, request: () => void) {
+		this.title = title; this.theme = theme; this.rows = rows; this.request = request;
+		this.text = new Text(safeOutput(body) || "No output yet.", 0, 0);
+		this.scroll = new ScrollView(this.text, { overscroll: "contain", scrollbar: "hidden" });
+	}
+	render(width: number): string[] {
+		const height = Math.max(1, Math.min(12, Math.floor(this.rows() / 2) - 2));
+		this.scroll.updateLayout(this.text.render(width).length, height, this.request);
+		return [this.theme.fg("accent", truncateToWidth(this.title, width)), ...this.scroll.render(width).slice(this.scroll.scrollTop, this.scroll.scrollTop + height), this.theme.fg("dim", truncateToWidth("Alt+J/K scroll · Alt+I back · Alt+W collapse", width))];
+	}
+	setTheme(theme: Theme): void { this.theme = theme; this.invalidate(); }
+	invalidate(): void { this.text.invalidate(); this.scroll.invalidate(); }
+	handleInput(input: string): void {
+		if (matchesKey(input, Key.up)) this.scroll.scrollBy(-1);
+		if (matchesKey(input, Key.down)) this.scroll.scrollBy(1);
+		this.request();
+	}
 }

package/node_modules/@oisin-ee/pi-wrangle/pi/work.ts

@@ -1,5 +1,5 @@
 import { truncateToWidth, visibleWidth } from "@earendil-works/pi-tui";
-import { clean, type Board, type Paint } from "./board.ts";
+import { age, clean, type Board, type Paint, type Row } from "./board.ts";
 import type { TodoSnapshot } from "./work-todo.ts";
 
 export interface WorkState {
@@ -8,33 +8,45 @@ export interface WorkState {
 	error: string | undefined;
 }
 
-/** One bounded row. Attention survives before progress and descriptive labels. */
+/** A small, persistent readout: names and current work, not just counts. */
 export function workStrip(state: WorkState, width: number, paint: Paint): string[] {
 	const { board, todo, error } = state;
 	if (!board.rows.length && !todo?.tasks.length && !error) return [];
-	const attention = board.rows.filter(row => row.group === "attention" || row.group === "to_land");
-	const urgent = attention.length ? `!${attention.length}` : error ? "!" : "";
-	const prefix = `WORK${urgent ? ` ${urgent}` : ""}`;
-	const counts: string[] = [];
-	if (todo?.tasks.length) counts.push(`${todo.tasks.filter(task => task.status === "completed").length}/${todo.tasks.length} todos`);
-	const jobs = board.rows.filter(row => row.kind === "job").length;
-	const agents = board.rows.filter(row => row.kind !== "job").length;
-	if (agents) counts.push(`${agents} agent${agents === 1 ? "" : "s"}`);
-	if (jobs) counts.push(`${jobs} job${jobs === 1 ? "" : "s"}`);
-	const item = attention[0];
-	const detail = error ? `unavailable · ${clean(error)}` : item ? `${clean(item.name)} · ${clean(item.state)}`
-		: todo?.tasks.find(task => task.status === "in_progress")?.content;
-	let line = prefix;
-	for (const count of counts) {
-		const next = `${line} · ${count}`;
-		if (visibleWidth(next) + 8 <= width) line = next;
+	const lines = [paint.fg("dim", "WORK · Alt+W expand")];
+	if (error) lines.push(paint.fg("warning", `! unavailable · ${clean(error)}`));
+	const tasks = todo?.tasks ?? [];
+	const active = tasks.find(task => task.status === "in_progress");
+	const next = tasks.find(task => task.status === "pending");
+	const current = active ?? next;
+	if (current) lines.push(`${paint.fg("accent", active ? "→ Task" : "· Next")}  ${clean(current.content)}`);
+	else if (tasks.length) lines.push(paint.fg("muted", `Tasks · ${tasks.filter(task => task.status === "completed").length}/${tasks.length} completed`));
+	const priority = (row: Row) => row.group === "attention" || row.group === "to_land" ? 0 : row.group === "running" ? 1 : 2;
+	for (const [label, members] of [
+		["Agents", board.rows.filter(row => row.kind !== "job")],
+		["Jobs", board.rows.filter(row => row.kind === "job")],
+	] as const) {
+		const rows = [...members].sort((a, b) => priority(a) - priority(b));
+		if (!rows.length) continue;
+		let line = `${label}  `;
+		let shown = 0;
+		for (const row of rows) {
+			const warning = priority(row) === 0;
+			const entry = `${warning ? "! " : ""}${clean(row.name)} · ${clean(row.state)} · ${age(row.age_ms)}`;
+			const remaining = rows.length - shown - 1;
+			const suffix = remaining ? `  +${remaining} more` : "";
+			const join = shown ? "  |  " : "";
+			if (shown && visibleWidth(line + join + entry + suffix) > width) break;
+			const room = Math.max(0, width - visibleWidth(line + join + suffix));
+			line += join + paint.fg(warning ? "warning" : "muted", truncateToWidth(entry, room));
+			shown++;
+		}
+		if (shown < rows.length) line += paint.fg("dim", `  +${rows.length - shown} more`);
+		lines.push(line);
 	}
-	if (detail && width - visibleWidth(line) > 12) line += ` · ${truncateToWidth(clean(detail), width - visibleWidth(line) - 11)}`;
-	if (visibleWidth(line) + 8 <= width) line += "  /work";
-	return [truncateToWidth(paint.fg(urgent ? "warning" : "accent", line), width)];
+	return lines.map(line => truncateToWidth(line, width));
 }
 
-/** A plain readout also works in modes where custom terminal UI is unavailable. */
+/** A plain readout also works in modes where terminal UI is unavailable. */
 export function workText(state: WorkState): string {
 	const lines = ["WORK · todos: Pi branch · agents/jobs: Herdr owner pane"];
 	if (state.error) lines.push(state.error);

package/node_modules/@oisin-ee/pi-wrangle/plugins/wrangle/skills/wrangle/SKILL.md

@@ -18,7 +18,7 @@ wrangle read NAME_OR_PANE [--host H]
 ```
 
 The board groups what you started by what you must do: TO LAND (a finished child with commits), ATTENTION (blocked, stalled, failed), RUNNING, and WAITING (queued for a host). Each agent row shows its harness and model; each job row its command.
-Your prompt context carries host status and a `To land:` line. In Pi, the one-row `WORK` strip sits above the editor. `/work` opens read-only todos and agent/job inspection. Todos follow the Pi branch; agents and jobs follow the owner pane. `/wrangle` retains host, profile, and inbox administration.
+Your prompt context carries host status and a `To land:` line. In Pi, the compact `WORK` widget shows the current task and named agents and jobs above the editor. Alt+W or `/work` expands it in place. Work inspection stays inline, not in a popup. Todos follow the Pi branch; agents and jobs follow the owner pane. `/wrangle` retains host, profile, and inbox administration.
 
 ## Delegate
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oisin-ee/oisinpi",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "Oisin's pi packages in one install: prewalk, todo, wrangle, and guardrails.",
   "keywords": [
     "guardrails",
@@ -18,10 +18,10 @@
   },
   "type": "module",
   "dependencies": {
-    "@oisin-ee/pi-guardrails": "0.5.0",
-    "@oisin-ee/pi-prewalk": "0.5.0",
-    "@oisin-ee/pi-todo": "0.5.0",
-    "@oisin-ee/pi-wrangle": "0.12.1"
+    "@oisin-ee/pi-guardrails": "0.5.1",
+    "@oisin-ee/pi-prewalk": "0.5.1",
+    "@oisin-ee/pi-todo": "0.5.1",
+    "@oisin-ee/pi-wrangle": "0.12.2"
   },
   "bundleDependencies": [
     "@oisin-ee/pi-guardrails",