@hheei/pi-ext-ui 0.5.0 → 0.5.2

package/README.md

@@ -8,8 +8,8 @@ The shared view API owns fold levels, compact sections, status glyphs, copy feed
 
 Background Bash and subagent tools own their display formats through ext-core `ToolPresentation` providers. This resolver consumes those providers automatically, including nested codemode calls, and adds shared folding and copy controls. Without `pi-ext-ui`, the same tools retain native Pi renderers. No direct dependency on `pi-ext-ui` is required by the tool extensions.
 
-Opt into activity groups with `pi --ui-tool-groups` after installing this extension (Pi **>=1.0.1**). A heading such as `▸ codemode ×2 · grep ×3` keeps one live summary row per tool beneath a single outer rail. Each thinking round and notification also keeps a summary row; notifications are not counted. Groups form while tools run and can span consecutive tool/thinking rounds. Prose, user messages, unknown components, images, and unknown tool renderers break groups. Streaming arguments, partial results, completion, and errors update the existing row.
+Activity groups are on by default for Pi **>=1.0.1** TUI sessions. Turn them off with the Tool UI setting `toolGroups.enabled` in `ext_settings.json` (the ext-core settings page). The change applies to the current session. A heading such as `▸ codemode ×2 · grep ×3` keeps one live summary row per tool beneath a single outer rail. Each thinking round and notification also keeps a summary row; notifications are not counted. Groups form while tools run and can span consecutive tool/thinking rounds. Prose, user messages, unknown components, images, and unknown tool renderers break groups. Any MessageView transcript notice stays inside the group, so bg-bash, subagent, memory, optimizer, and codemode-guard notices do not need their own allowlist. Notification rows show their text directly. Streaming arguments, partial results, completion, and errors update the existing row.
 
 Fullscreen: click the group heading to restore the original component layouts and interactions beneath the outer rail. Both terminal modes: Ctrl+O forces groups open; closing global expansion restores each group’s local choice. Appending members preserves that choice. Original per-tool fold choices remain intact. Groups are presentation only and are rebuilt on history navigation; session data, model context, and HTML export remain unchanged. Thinking summaries keep a label; expanding respects native thinking visibility. Each `ctx.ui.notify` call retains its full text for expansion. Notifications remain session-local, as in Pi.
 
-This optional feature uses two centralized, version-checked host prototype hooks: tool lookup and extension notifications. Thinking uses the existing assistant message, with no extra hook. Unsupported hosts or incompatible layouts report a warning and retain normal rendering. Cleanup restores the original methods; if another extension replaces the same methods, restart Pi to unload the conflicting patch. For workspace development use `pnpm run pi-dev --ui-tool-groups`: running the bundled CLI beside physical host devDependencies can resolve a second host class, unlike the published installation.
+Grouping uses two centralized, version-checked host prototype hooks: tool lookup and extension notifications. Thinking uses the existing assistant message, with no extra hook. Unsupported hosts or incompatible layouts report a warning and retain normal rendering. Cleanup restores the original methods; if another extension replaces the same methods, restart Pi to unload the conflicting patch. For workspace development use `pnpm run pi-dev`: running the bundled CLI beside physical host devDependencies can resolve a second host class, unlike the published installation.

package/dist/extension.js

@@ -1,33 +1,43 @@
-import { messageViewPoint, registerExtensionHook, registerExtensionLifecycle, toolRendererPoint, } from "@hheei/pi-ext-core";
+import { getRuntimeSettingsRegistry, messageViewPoint, registerExtensionHook, registerExtensionLifecycle, registerSettings, toolRendererPoint, } from "@hheei/pi-ext-core";
 import { installHostToolGroups } from "./host-transcript-patch.js";
 import { createMessageView } from "./message-view.js";
 import { createOptionalToolRendererFactory, registerCollapsibleToolRenderer } from "./renderer.js";
+import { activityGroupsEnabled, createToolGroupSettings } from "./settings.js";
 import { clearCapturedNestedCalls } from "./tracker.js";
 export default function (pi) {
-    pi.registerFlag("ui-tool-groups", {
-        type: "boolean",
-        default: false,
-        description: "Group tool summaries, thinking and notifications (Pi >=1.0.1 runtime patch)",
-    });
     let redrawGroups;
     pi.on("agent_settled", () => redrawGroups?.());
     registerCollapsibleToolRenderer(pi);
     registerExtensionLifecycle(pi, {
         key: "@hheei/pi-ext-ui",
-        start(context) {
-            if (context.extension.mode === "tui" && pi.getFlag("ui-tool-groups") === true) {
+        async start(context) {
+            let patch;
+            const apply = (enabled) => {
+                if (context.extension.mode !== "tui")
+                    return;
+                if (!enabled) {
+                    redrawGroups = undefined;
+                    patch?.dispose();
+                    patch = undefined;
+                    return;
+                }
+                if (patch !== undefined)
+                    return;
                 try {
-                    const patch = installHostToolGroups(context.extension);
+                    patch = installHostToolGroups(context.extension);
                     redrawGroups = patch.requestRender;
-                    context.resources.add("tool-groups", () => {
-                        redrawGroups = undefined;
-                        patch.dispose();
-                    });
                 }
                 catch (error) {
                     context.extension.ui.notify(error instanceof Error ? error.message : String(error), "warning");
                 }
-            }
+            };
+            const provider = createToolGroupSettings({ onEnabled: apply });
+            context.resources.add("tool-group-settings", registerSettings(provider, getRuntimeSettingsRegistry(pi)));
+            context.resources.add("tool-groups", () => {
+                redrawGroups = undefined;
+                patch?.dispose();
+                patch = undefined;
+            });
             context.resources.add("tracker-cleanup", () => {
                 clearCapturedNestedCalls();
             });
@@ -35,6 +45,21 @@ export default function (pi) {
             context.resources.add("tool-renderer", () => toolRenderers.dispose());
             const handle = registerExtensionHook(context.pi, messageViewPoint, createMessageView);
             context.resources.add("message-view", () => handle.dispose());
+            try {
+                const state = await provider.storage.load({
+                    sessionId: context.extension.sessionManager.getSessionId(),
+                    signal: context.signal,
+                });
+                if (!context.signal.aborted)
+                    apply(activityGroupsEnabled(state));
+            }
+            catch (error) {
+                if (!context.signal.aborted) {
+                    const detail = error instanceof Error ? error.message : String(error);
+                    context.extension.ui.notify(`Tool activity groups settings unreadable: ${detail}`, "warning");
+                    apply(true);
+                }
+            }
         },
     });
 }

package/dist/host-transcript-patch.js

@@ -1,5 +1,7 @@
 import { AssistantMessageComponent, InteractiveMode, ToolExecutionComponent, VERSION, } from "@earendil-works/pi-coding-agent";
-import { Container, MouseRegion, Spacer, stripTerminalSequences, Text, truncateToWidth, } from "@earendil-works/pi-tui";
+import { Container, MouseRegion, Spacer, stripTerminalSequences, Text, } from "@earendil-works/pi-tui";
+import { fitRow } from "@hheei/pi-ext-core";
+import { MessageView } from "./message-view.js";
 import { renderWithoutToolRails, ToolView, toSingleRow } from "./tool-view.js";
 const SEAMS = ["getRegisteredToolDefinition", "showExtensionNotify"];
 function record(value) {
@@ -71,6 +73,21 @@ function toolMember(component, calls) {
         return undefined;
     return { component, name: toSingleRow(stripTerminalSequences(name)), summary };
 }
+function messageView(component) {
+    if (component instanceof MessageView)
+        return component;
+    if (!(component instanceof Container))
+        return undefined;
+    for (const child of component.children)
+        if (child instanceof MessageView)
+            return child;
+    return undefined;
+}
+/** Shared transcript notices stay in the group. The frame is the contract, not each custom type. */
+function noticeContinuation(component) {
+    const view = messageView(component);
+    return view === undefined ? undefined : { component, summary: view.activitySummary };
+}
 class NotifyView extends Container {
     #text = new Text("", 1, 0);
     #context;
@@ -85,7 +102,7 @@ class NotifyView extends Container {
         this.addChild(this.#text);
     }
     get summary() {
-        return this.#context.ui.theme.fg(this.#type === "info" ? "dim" : this.#type, toSingleRow(`notify · ${this.#content}`));
+        return this.#context.ui.theme.fg(this.#type === "info" ? "dim" : this.#type, toSingleRow(this.#content));
     }
     get #content() {
         const prefix = this.#type === "error" ? "Error: " : this.#type === "warning" ? "Warning: " : "";
@@ -100,45 +117,93 @@ class ToolGroup extends Container {
     #header = new Text("", 0, 0);
     #originals = new Container();
     #context;
+    #redraw;
     #members = [];
     #expanded = false;
     #renderedExpanded = false;
+    #open = new Set();
+    #hits = [];
     constructor(context, redraw) {
         super();
         this.#context = context;
+        this.#redraw = redraw;
         const heading = new MouseRegion(this.#header, (event) => {
             if (event.type !== "click" || event.button !== "left")
                 return undefined;
             this.#expanded = this.#context.ui.getToolsExpanded() ? false : !this.#expanded;
+            if (!this.#expanded)
+                this.#open.clear();
             redraw();
             return { handled: true, render: true };
         });
         const body = {
-            render: (width) => {
-                const rows = this.#renderedExpanded
-                    ? renderWithoutToolRails(this.#originals, Math.max(1, width - 2))
-                    : this.#members.flatMap((member) => member.summary === undefined ? [] : [member.summary]);
-                const rail = this.#context.ui.theme.fg("dim", "▎");
-                return rows.map((row) => truncateToWidth(`${rail} ${row}`, Math.max(0, width), "…"));
-            },
-            handleMouse: (event) => {
-                if (!this.#renderedExpanded || event.x < 2)
-                    return undefined;
-                return this.#originals.handleMouse({
-                    ...event,
-                    x: event.x - 2,
-                    width: Math.max(1, event.width - 2),
-                });
-            },
+            render: (width) => this.#renderBody(width),
+            handleMouse: (event) => this.#hit(event),
             invalidate() { },
         };
         this.children = [new Spacer(1), heading, body];
     }
+    #renderBody(width) {
+        const inner = Math.max(1, width - 2);
+        const rail = this.#context.ui.theme.fg("dim", "▎");
+        const lines = [];
+        const hits = [];
+        this.#members.forEach((member, index) => {
+            const wrapper = this.#originals.children[index];
+            if (wrapper === undefined)
+                return;
+            const native = this.#renderedExpanded || this.#open.has(member.component);
+            const rows = native
+                ? renderWithoutToolRails(wrapper, inner)
+                : member.summary === undefined
+                    ? []
+                    : [member.summary];
+            if (rows.length === 0)
+                return;
+            hits.push({ component: member.component, wrapper, native, height: rows.length });
+            for (const row of rows) {
+                lines.push(fitRow(`${rail} ${row}`, Math.max(0, width), "…"));
+            }
+        });
+        this.#hits = hits;
+        return lines;
+    }
+    #hit(event) {
+        let y = event.y;
+        for (const hit of this.#hits) {
+            if (y >= hit.height) {
+                y -= hit.height;
+                continue;
+            }
+            if (!hit.native) {
+                if (event.type !== "click" || event.button !== "left")
+                    return undefined;
+                this.#open.add(hit.component);
+                this.#redraw();
+                return { handled: true, render: true };
+            }
+            // The rail belongs to the group. Content, including header fold and copy, stays with the member.
+            if (event.x < 2) {
+                if (!this.#renderedExpanded && event.type === "click" && event.button === "left") {
+                    this.#open.delete(hit.component);
+                    this.#redraw();
+                    return { handled: true, render: true };
+                }
+                return undefined;
+            }
+            return hit.wrapper.handleMouse?.({
+                ...event,
+                y,
+                height: hit.height,
+                x: event.x - 2,
+                width: Math.max(1, event.width - 2),
+            });
+        }
+        return undefined;
+    }
     update(members) {
         this.#members = members;
-        this.#originals.children = members.map(({ component, name }) => {
-            if (name === undefined)
-                return component;
+        this.#originals.children = members.map(({ component }) => {
             let offset = 0;
             return {
                 render(width) {
@@ -173,7 +238,7 @@ class ToolGroup extends Container {
         const heading = [...counts]
             .map(([name, count]) => `${theme.fg("toolTitle", theme.bold(name))} ${theme.fg("dim", `×${count}`)}`)
             .join(theme.fg("dim", " · "));
-        this.#header.setText(truncateToWidth(`${theme.fg("dim", this.#renderedExpanded ? "▾" : "▸")} ${heading}`, Math.max(0, width), "…"));
+        this.#header.setText(fitRow(`${theme.fg("dim", this.#renderedExpanded ? "▾" : "▸")} ${heading}`, Math.max(0, width), "…"));
         return super.render(width);
     }
 }
@@ -236,6 +301,13 @@ function attach(host, context) {
                 members.push({ component: child, summary: child.summary });
                 continue;
             }
+            else {
+                const continuation = noticeContinuation(child);
+                if (continuation !== undefined) {
+                    members.push(continuation);
+                    continue;
+                }
+            }
             flush();
             children.push(child);
         }

package/dist/message-view.d.ts

@@ -12,4 +12,6 @@ export declare class MessageView implements Component {
     render(width: number): string[];
     invalidate(): void;
     handleMouse(event: TuiMouseEvent): TuiMouseEventResult | undefined;
+    /** Single-row label used when this notice sits inside an activity group. */
+    get activitySummary(): string;
 }

package/dist/message-view.js

@@ -125,13 +125,16 @@ export class MessageView {
         this.toggle();
         return { handled: true, render: true };
     }
-    #header(width, expanded) {
+    /** Single-row label used when this notice sits inside an activity group. */
+    get activitySummary() {
         const { theme, header } = this.#spec;
         const kind = theme.fg("dim", toSingleRow(header.kind));
         const summaryRaw = header.summary === undefined ? "" : toSingleRow(header.summary);
         const summary = summaryRaw === "" ? "" : theme.fg(header.tone ?? "dim", summaryRaw);
-        const label = summary === "" ? kind : `${kind}${theme.fg("dim", " · ")}${summary}`;
-        const pin = this.expandable ? `${theme.fg("dim", expanded ? "▾" : "▸")} ` : "";
-        return truncate(`${pin}${label}`, width);
+        return summary === "" ? kind : `${kind}${theme.fg("dim", " · ")}${summary}`;
+    }
+    #header(width, expanded) {
+        const pin = this.expandable ? `${this.#spec.theme.fg("dim", expanded ? "▾" : "▸")} ` : "";
+        return truncate(`${pin}${this.activitySummary}`, width);
     }
 }

package/dist/settings.d.ts

@@ -0,0 +1,6 @@
+import { type SettingsProvider, type SettingsState } from "@hheei/pi-ext-core";
+/** Missing or non-boolean values stay on; only an explicit false disables groups. */
+export declare function activityGroupsEnabled(state: SettingsState | undefined): boolean;
+export declare function createToolGroupSettings(options: {
+    readonly onEnabled: (enabled: boolean) => void;
+}): SettingsProvider;

package/dist/settings.js

@@ -0,0 +1,36 @@
+import { createJsonSettingsStorage, } from "@hheei/pi-ext-core";
+const GROUP = "toolGroups";
+const FIELD = "enabled";
+/** Missing or non-boolean values stay on; only an explicit false disables groups. */
+export function activityGroupsEnabled(state) {
+    const value = state?.[GROUP]?.[FIELD];
+    return value !== false;
+}
+export function createToolGroupSettings(options) {
+    return {
+        id: "pi-ext-ui",
+        title: "Tool UI",
+        origin: "@hheei/pi-ext-ui",
+        groups: [
+            {
+                id: GROUP,
+                title: "Tool activity",
+                fields: [
+                    {
+                        id: FIELD,
+                        label: "Activity groups",
+                        type: "boolean",
+                        defaultValue: true,
+                        description: "Group consecutive tool, thinking, and notification rows in the TUI transcript.",
+                        parse: (draft) => draft === "true",
+                    },
+                ],
+            },
+        ],
+        storage: createJsonSettingsStorage({ group: GROUP }),
+        onChange(change) {
+            if (change.groupId === GROUP && change.fieldId === FIELD)
+                options.onEnabled(change.value === true);
+        },
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hheei/pi-ext-ui",
-  "version": "0.5.0",
+  "version": "0.5.2",
   "description": "Collapsible tool rendering frame and tool renderer pilot for Pi.",
   "type": "module",
   "main": "dist/index.js",