@xingular/harness 1.0.0 → 1.2.0

package/dist/sdk/terminal/tui/dialogGeometry.js

@@ -44,7 +44,9 @@ export function centeredRect(columns, rows, width, height) {
         height: boxHeight
     };
 }
-/** The overlay options every full-screen page command passes; OpenTUI reads the marker. */
-export function pageOverlayOptions() {
+/** Page commands declare their presentation; OpenTUI centers only marked dialogs. */
+export function pageOverlayOptions(presentation = 'centered') {
+    if (presentation === 'fullscreen')
+        return { anchor: 'top-left', width: '100%', maxHeight: '100%' };
     return { anchor: 'top-left', width: '100%', maxHeight: '100%', dialog: 'page' };
 }

package/dist/sdk/terminal/tui/dialogs.d.ts

@@ -1,6 +1,10 @@
 import type { ExtensionUIContext, ExtensionUIDialogOptions, KeybindingsManager, Theme } from '@earendil-works/pi-coding-agent';
 import { Input, type Component, type Focusable, type SelectListTheme, type TUI, type TuiMouseEventResult } from '@earendil-works/pi-tui';
 import type { TerminalMouseInput } from "./mouse.js";
+export interface GroupedSelectOption {
+    label: string;
+    group?: string;
+}
 /** `page` asks for a full-screen dialog; Pi's own dialogs ignore the field. */
 export type TerminalDialogOptions = ExtensionUIDialogOptions & {
     page?: boolean;
@@ -19,7 +23,7 @@ export declare class SearchableSelect implements Component, Focusable {
     private readonly list;
     private readonly labels;
     private focusedValue;
-    constructor(options: string[], tui: TUI, theme: () => Theme, select: (index: number) => void, cancel: () => void, search?: 'always' | 'never');
+    constructor(options: string[], tui: TUI, theme: () => Theme, select: (index: number) => void, cancel: () => void, search?: 'always' | 'never', groups?: readonly (string | undefined)[]);
     get focused(): boolean;
     set focused(value: boolean);
     get pinnedRows(): number;
@@ -66,6 +70,7 @@ export declare class TerminalDialogs {
     constructor(tui: TUI, theme: () => Theme, keybindings: KeybindingsManager, changed: () => void);
     private show;
     select(title: string, options: string[], opts?: TerminalDialogOptions): Promise<string | undefined>;
+    selectGrouped(title: string, options: readonly GroupedSelectOption[], opts?: ExtensionUIDialogOptions): Promise<string | undefined>;
     confirm(title: string, message: string, opts?: ExtensionUIDialogOptions): Promise<boolean>;
     input(title: string, placeholder?: string, opts?: ExtensionUIDialogOptions, secret?: boolean): Promise<string | undefined>;
     editor(title: string, prefill?: string): Promise<string | undefined>;

package/dist/sdk/terminal/tui/dialogs.js

@@ -31,14 +31,14 @@ export class SearchableSelect {
     list;
     labels;
     focusedValue = false;
-    constructor(options, tui, theme, select, cancel, search = 'always') {
+    constructor(options, tui, theme, select, cancel, search = 'always', groups) {
         this.tui = tui;
         this.select = select;
         this.cancel = cancel;
         this.labels = options.map(safe);
         this.list = new FilterList({
             theme, search,
-            rows: this.labels.map((label, index) => ({ id: String(index), label, data: index })),
+            rows: this.labels.map((label, index) => ({ id: String(index), label, ...(groups?.[index] ? { group: groups[index] } : {}), data: index })),
             limit: () => this.windowRows(),
             noun: ['option', 'options'],
             onActivate: row => this.select(row.data ?? 0),
@@ -265,6 +265,13 @@ export class TerminalDialogs {
             return new DialogPanel(title, list, this.theme, '↑/↓ select · Enter confirm · Esc cancel', undefined, opts?.page ? 'page' : 'block');
         }, opts);
     }
+    selectGrouped(title, options, opts) {
+        const labels = options.map(option => option.label);
+        return this.show(done => {
+            const list = new SearchableSelect(labels, this.tui, this.theme, index => done(labels[index]), () => done(undefined), 'always', options.map(option => option.group));
+            return new DialogPanel(title, list, this.theme, '↑/↓ select · Enter confirm · Esc cancel');
+        }, opts);
+    }
     async confirm(title, message, opts) {
         return (await this.show(done => {
             const list = new SearchableSelect(['Yes', 'No'], this.tui, this.theme, index => done(index === 0), () => done(undefined), 'never');

package/dist/sdk/terminal/tui/list.d.ts

@@ -2,11 +2,20 @@ import type { Theme } from '@earendil-works/pi-coding-agent';
 import { type Component, type Focusable, type TuiMouseEventResult } from '@earendil-works/pi-tui';
 import { type TerminalMouseInput } from "./mouse.js";
 export type RowTone = 'success' | 'warning' | 'error' | 'muted' | 'dim' | 'accent';
+export interface ListLabelPart {
+    text: string;
+    color?: string;
+    tone?: RowTone;
+}
 export interface ListRow<T = unknown> {
     id: string;
     label: string;
+    /** Optional colored spans for the label; selected rows keep the shared high-contrast text. */
+    labelParts?: readonly ListLabelPart[];
     /** Shown at the right edge, in `tone`. */
     detail?: string;
+    /** An optional muted second line beneath the label. */
+    subtitle?: string;
     tone?: RowTone;
     /** Rows with the same consecutive group share a heading (not shown while searching). */
     group?: string;
@@ -22,6 +31,8 @@ export interface FilterListOptions<T> {
     search?: 'always' | 'never';
     /** Rows the list may use; the search field is part of it. Defaults to what `render` is given. */
     limit?: () => number;
+    /** Blank lines between visible rows. */
+    rowGap?: number;
     empty?: string;
     noun?: readonly [string, string];
     /** Short context included in the search row while a query is active. */
@@ -59,6 +70,7 @@ export declare class FilterList<T = unknown> implements Component, Focusable {
     handleMouse(event: TerminalMouseInput): TuiMouseEventResult | undefined;
     invalidate(): void;
     private limit;
+    private rowGap;
     private mode;
     private canSearch;
     private searchVisible;
@@ -67,7 +79,8 @@ export declare class FilterList<T = unknown> implements Component, Focusable {
     private move;
     handleInput(data: string): boolean;
     private entries;
-    private line;
+    private lines;
+    private labelParts;
     /** `rows` is the most the list may use, the search row included. */
     render(width: number, rows?: number): string[];
 }

package/dist/sdk/terminal/tui/list.js

@@ -1,4 +1,4 @@
-import { fuzzyFilter, matchesKey, truncateToWidth, visibleWidth } from '@earendil-works/pi-tui';
+import { fuzzyFilter, matchesKey, parseColor, truncateToWidth, visibleWidth } from '@earendil-works/pi-tui';
 import { safeText, selectedRow, selectionMuted, selectionText } from "./chrome.js";
 import { SEARCH_FIELD_ROWS, SearchField, searchFieldRowsFor } from "./search.js";
 import { isPrimaryClick } from "./mouse.js";
@@ -25,7 +25,10 @@ export class FilterList {
     get total() { return this.rows.length; }
     get shown() { return this.visible.length; }
     /** Rows the list would use if nothing cut it: the search field, headings and rows. */
-    get height() { return (this.searchVisible() ? this.renderedSearchRows : 0) + this.entries().length; }
+    get height() {
+        return (this.searchVisible() ? this.renderedSearchRows : 0)
+            + this.entries().reduce((height, entry) => height + (entry.row?.subtitle === undefined ? 1 : 2), 0);
+    }
     /** Rows at the top of `render` that a frame must keep when it has to cut the list. */
     get pinnedRows() { return this.searchVisible() ? this.renderedSearchRows : 0; }
     setRows(rows) {
@@ -61,6 +64,10 @@ export class FilterList {
     }
     invalidate() { this.search.invalidate(); }
     limit() { return Math.max(1, Math.floor(this.options.limit?.() ?? Number.POSITIVE_INFINITY)); }
+    rowGap() {
+        const gap = this.options.rowGap ?? 0;
+        return Number.isFinite(gap) ? Math.max(0, Math.floor(gap)) : 0;
+    }
     mode() { return this.options.search ?? 'always'; }
     canSearch() { return this.mode() === 'always'; }
     searchVisible() { return this.canSearch() || this.query.length > 0; }
@@ -68,7 +75,7 @@ export class FilterList {
     refilter() {
         const query = this.query.trim();
         this.visible = query
-            ? fuzzyFilter(this.rows, query, row => row.searchText ?? `${row.label} ${row.detail ?? ''} ${row.group ?? ''}`)
+            ? fuzzyFilter(this.rows, query, row => row.searchText ?? `${row.label} ${row.subtitle ?? ''} ${row.detail ?? ''} ${row.group ?? ''}`)
             : this.rows;
         if (!this.visible.some(row => row.id === this.selectedId && !row.disabled))
             this.selectedId = this.firstSelectable()?.id;
@@ -136,15 +143,20 @@ export class FilterList {
     entries() {
         const entries = [];
         let last;
-        for (const row of this.visible) {
+        const gap = this.rowGap();
+        for (const [index, row] of this.visible.entries()) {
             if (!this.query && row.group && row.group !== last)
                 entries.push({ heading: row.group });
             last = row.group;
             entries.push({ row });
+            if (index < this.visible.length - 1) {
+                for (let line = 0; line < gap; line += 1)
+                    entries.push({ spacer: true });
+            }
         }
         return entries;
     }
-    line(row, width) {
+    lines(row, width) {
         const theme = this.options.theme();
         const selected = row.id === this.selectedId;
         const detail = row.detail ? safeText(row.detail) : '';
@@ -153,10 +165,40 @@ export class FilterList {
         const label = truncateToWidth(safeText(row.label), Math.max(0, room - (showDetail ? visibleWidth(detail) + 2 : 0)), '…');
         const gap = ' '.repeat(Math.max(0, room - visibleWidth(label) - (showDetail ? visibleWidth(detail) : 0)));
         const tone = (text) => theme.fg(row.tone ?? 'muted', text);
-        const main = (selected ? '❯ ' : '  ') + label;
-        if (selected)
-            return selectedRow(selectionText(theme, main) + gap + (showDetail ? selectionMuted(theme, detail) : ''), width, theme);
-        return (row.disabled ? theme.fg('dim', main) : main) + gap + (showDetail ? tone(detail) : '');
+        const prefix = selected ? '❯ ' : '  ';
+        const labelText = selected || row.disabled || !row.labelParts?.length ? label : this.labelParts(row.labelParts, label, theme);
+        const main = prefix + label;
+        const primary = selected
+            ? selectedRow(selectionText(theme, main) + gap + (showDetail ? selectionMuted(theme, detail) : ''), width, theme)
+            : (row.disabled ? theme.fg('dim', main) : prefix + labelText) + gap + (showDetail ? tone(detail) : '');
+        if (row.subtitle === undefined)
+            return [primary];
+        const subtitle = truncateToWidth(`  ${safeText(row.subtitle)}`, width, '…');
+        const secondary = selected
+            ? selectedRow(selectionMuted(theme, subtitle), width, theme)
+            : theme.fg(row.disabled ? 'dim' : 'muted', subtitle);
+        return [primary, secondary];
+    }
+    labelParts(parts, visibleLabel, theme) {
+        const source = parts.map(part => safeText(part.text)).join('');
+        const truncated = visibleWidth(source) > visibleWidth(visibleLabel);
+        let remaining = Math.max(0, visibleWidth(visibleLabel) - (truncated ? 1 : 0));
+        const output = [];
+        for (const part of parts) {
+            if (remaining <= 0)
+                break;
+            const text = safeText(part.text);
+            const fitted = truncateToWidth(text, remaining, '');
+            if (fitted) {
+                output.push(part.color ? theme.style(fitted, { fg: parseColor(part.color) }) : part.tone ? theme.fg(part.tone, fitted) : fitted);
+            }
+            remaining -= visibleWidth(fitted);
+            if (visibleWidth(fitted) < visibleWidth(text))
+                break;
+        }
+        if (truncated)
+            output.push('…');
+        return output.join('');
     }
     /** `rows` is the most the list may use, the search row included. */
     render(width, rows) {
@@ -186,11 +228,51 @@ export class FilterList {
             return lines.map(line => truncateToWidth(line, width, ''));
         }
         const at = Math.max(0, entries.findIndex(entry => entry.row?.id === this.selectedId));
-        const start = Math.max(0, Math.min(Math.max(0, entries.length - budget), at - Math.floor(budget / 2)));
-        for (const entry of entries.slice(start, start + budget)) {
-            lines.push(entry.row ? this.line(entry.row, width) : theme.fg('dim', safeText(entry.heading ?? '')));
-            this.renderedRows.push(entry.row);
+        let start = at;
+        let end = at + 1;
+        let used = entries[at]?.row?.subtitle === undefined ? 1 : 2;
+        let preferBefore = true;
+        while (start > 0 || end < entries.length) {
+            const before = entries[start - 1];
+            const after = entries[end];
+            const beforeHeight = before ? (before.row?.subtitle === undefined ? 1 : 2) : Number.POSITIVE_INFINITY;
+            const afterHeight = after ? (after.row?.subtitle === undefined ? 1 : 2) : Number.POSITIVE_INFINITY;
+            if (preferBefore && before && used + beforeHeight <= budget) {
+                start -= 1;
+                used += beforeHeight;
+            }
+            else if (after && used + afterHeight <= budget) {
+                end += 1;
+                used += afterHeight;
+            }
+            else if (before && used + beforeHeight <= budget) {
+                start -= 1;
+                used += beforeHeight;
+            }
+            else
+                break;
+            preferBefore = !preferBefore;
+        }
+        if (entries[start]?.spacer)
+            start += 1;
+        if (entries[end - 1]?.spacer)
+            end -= 1;
+        for (const entry of entries.slice(start, end)) {
+            if (entry.row) {
+                const rendered = this.lines(entry.row, width);
+                lines.push(...rendered);
+                this.renderedRows.push(...rendered.map(() => entry.row));
+            }
+            else if (entry.spacer) {
+                lines.push('');
+                this.renderedRows.push(undefined);
+            }
+            else {
+                lines.push(theme.fg('dim', safeText(entry.heading ?? '')));
+                this.renderedRows.push(undefined);
+            }
         }
-        return lines.map(line => truncateToWidth(line, width, ''));
+        this.renderedRows = this.renderedRows.slice(0, rowBudget);
+        return lines.slice(0, rowBudget).map(line => truncateToWidth(line, width, ''));
     }
 }

package/dist/sdk/terminal/tui/modelPicker.js

@@ -67,11 +67,8 @@ export class ModelPicker {
                 this.error = 'Model refresh timed out; showing cached models.';
             else if (result.errors.size)
                 this.error = `Could not refresh ${[...result.errors.keys()].join(', ')}; showing cached models.`;
-            else {
+            else
                 this.error = this.options.runtime.getError();
-                if (!this.error)
-                    this.status = 'Model catalogs refreshed.';
-            }
             this.load();
         }
         catch (error) {
@@ -135,10 +132,8 @@ export class ModelPicker {
             return [];
         const centered = centeredDialogHost(this.options.tui) && dialogFits(this.options.tui.terminal.columns, this.options.tui.terminal.rows);
         const inner = centered ? centerDialogContentWidth(width) : contentWidth(width);
-        const selected = this.list.selected?.data;
         const notes = [
             this.status ? theme.fg('muted', this.status) : '',
-            selected ? theme.fg('muted', `Model name: ${safeText(selected.name ?? selected.id)}`) : '',
             this.error ? theme.fg('error', this.error) : ''
         ].filter(Boolean);
         const chromeRows = centered ? centerDialogChromeRows(rows) : 4;

package/dist/sdk/terminal/tui/page.d.ts

@@ -2,6 +2,9 @@ import type { TuiMouseEventResult } from '@earendil-works/pi-tui';
 import type { TabInfo } from "./chrome.js";
 import type { TerminalMouseInput } from "./mouse.js";
 export interface TerminalPage {
+    presentation?: 'centered' | 'fullscreen';
+    ownsNavigation?: boolean;
+    selectTab?(id: string): void;
     tabs(): readonly TabInfo[];
     activeTab(): string;
     render(width: number, rows: number): string[];

package/dist/sdk/terminal/tui/pageOverlay.js

@@ -1,4 +1,4 @@
-import { matchesKey } from '@earendil-works/pi-tui';
+import { matchesKey, visibleWidth } from '@earendil-works/pi-tui';
 import { CENTER_DIALOG_PAD, CHROME_PAD, centerDialogBodyRows, centerDialogContentWidth, centerDialogFrame, centerDialogVerticalPad, contentWidth, pageBodyRows, pageFrame, tabIndexAt, tabStrip } from "./chrome.js";
 import { centeredDialogHost, dialogFits, pageRows } from "./dialogGeometry.js";
 export class PageOverlay {
@@ -23,6 +23,12 @@ export class PageOverlay {
         if (this.disposed)
             return undefined;
         if (event.type === 'wheel') {
+            const layout = this.pointerLayout;
+            if (layout && event.y >= layout.bodyStart) {
+                const handled = this.page.handleMouse?.({ ...event, x: event.x - layout.contentX, y: event.y - layout.bodyStart });
+                if (handled?.handled)
+                    return handled;
+            }
             const key = event.wheelDelta !== undefined && event.wheelDelta < 0 ? '\x1b[5~' : '\x1b[6~';
             this.handleInput(key);
             return { handled: true, render: true };
@@ -49,6 +55,11 @@ export class PageOverlay {
             const target = tabIndex ?? (tabX < layout.contentWidth / 2
                 ? (current - 1 + tabs.length) % tabs.length
                 : (current + 1) % tabs.length);
+            if (this.page.selectTab) {
+                this.page.selectTab(tabs[target].id);
+                this.hoveredTab = undefined;
+                return { handled: true, render: true };
+            }
             const delta = (target - Math.max(0, current) + tabs.length) % tabs.length;
             const reverse = (Math.max(0, current) - target + tabs.length) % tabs.length;
             const direction = delta <= reverse ? '\t' : '\x1b[Z';
@@ -75,9 +86,9 @@ export class PageOverlay {
             this.options.close();
             return;
         }
-        const centered = centeredDialogHost(this.options.tui) && dialogFits(this.options.tui.terminal.columns, this.options.tui.terminal.rows);
+        const centered = this.page.presentation !== 'fullscreen' && centeredDialogHost(this.options.tui) && dialogFits(this.options.tui.terminal.columns, this.options.tui.terminal.rows);
         const tabs = this.options.page.tabs();
-        const input = centered && tabs.length > 1
+        const input = centered && tabs.length > 1 && !this.options.page.ownsNavigation
             ? matchesKey(data, 'right') ? '\t' : matchesKey(data, 'left') ? '\x1b[Z' : data
             : data;
         if (this.options.page.handleInput(input)) {
@@ -90,13 +101,13 @@ export class PageOverlay {
     render(width) {
         if (this.disposed)
             return [];
-        const rows = pageRows(this.options.tui);
+        const rows = this.page.presentation === 'fullscreen' ? this.options.tui.terminal.rows : pageRows(this.options.tui);
         const page = this.options.page;
         const tabs = page.tabs();
         if (width < 1 || rows < 1 || !tabs.length)
             return [];
         const theme = this.options.theme();
-        const centered = centeredDialogHost(this.options.tui) && dialogFits(this.options.tui.terminal.columns, this.options.tui.terminal.rows);
+        const centered = this.page.presentation !== 'fullscreen' && centeredDialogHost(this.options.tui) && dialogFits(this.options.tui.terminal.columns, this.options.tui.terminal.rows);
         const inner = centered ? centerDialogContentWidth(width) : contentWidth(width);
         if (centered) {
             const tabRows = tabs.length > 1 ? 1 : 0;
@@ -121,11 +132,20 @@ export class PageOverlay {
             contentWidth: contentWidth(width),
             centered
         };
-        const footer = [
+        const escapeHint = page.ownsNavigation ? 'Esc back/close' : 'Esc close';
+        const fullFooter = page.ownsNavigation ? `${escapeHint} · ${page.hint()}` : [
             page.hint(),
             tabs.length > 1 ? 'Tab/Shift+Tab sections' : '',
-            'Esc close'
+            escapeHint
+        ].filter(Boolean).join(' · ');
+        const footerWidth = Math.max(0, width - CHROME_PAD * 2);
+        const primaryHint = page.hint().split(' · ')[0] ?? '';
+        const compactFooter = [
+            primaryHint,
+            !page.ownsNavigation && tabs.length > 1 ? 'Tab/⇧Tab' : '',
+            escapeHint
         ].filter(Boolean).join(' · ');
+        const footer = visibleWidth(fullFooter) <= footerWidth ? fullFooter : compactFooter;
         return pageFrame({
             title: '',
             headerLine: tabStrip(tabs, page.activeTab(), inner, theme, 'top', this.hoveredTab),

package/dist/sdk/terminal/tui/pages/accountsPage.d.ts

@@ -1,10 +1,11 @@
 /**
- * The Accounts page: one row per account with its health, the selected account's details beneath,
- * and Pools as a second section. Enter on an account opens its actions; the actions themselves are
- * the ones the `/accounts` menu of a native `pi` session uses.
+ * The Accounts page: one row per account with its health and Pools as a second section. Opening
+ * an account shows its details and grouped actions in a wide inspector or a compact detail page;
+ * the actions themselves are the ones the `/accounts` menu of a native `pi` session uses.
  */
 import type { Theme } from '@earendil-works/pi-coding-agent';
 import { type AccountsCall, type AccountsUi, type SessionAccount } from "../../accountsMenu.js";
+import type { GroupedSelectOption } from "../dialogs.js";
 import type { TerminalPage } from "../page.js";
 import type { TerminalMouseInput } from "../mouse.js";
 export interface AccountsPageOptions {
@@ -12,19 +13,30 @@ export interface AccountsPageOptions {
     call: AccountsCall;
     /** The account this session runs on. */
     session: () => SessionAccount | null;
-    ui: AccountsUi;
+    ui: AccountsUi & {
+        selectGrouped?(title: string, options: readonly GroupedSelectOption[]): Promise<string | undefined>;
+    };
     /** The session is switching accounts: the host ends it so the launcher can start it again. */
     relaunch(): void;
     changed(): void;
 }
 export declare class AccountsPage implements TerminalPage {
     private readonly options;
+    readonly presentation = "fullscreen";
+    readonly ownsNavigation = true;
     private overview;
     private error;
     private section;
+    private focus;
+    private detailOpen;
+    private detailAccountId;
     private busy;
     private disposed;
+    private compact;
+    private wideListWidth;
+    private actionRowsStart;
     private readonly list;
+    private readonly actionList;
     constructor(options: AccountsPageOptions);
     get focused(): boolean;
     set focused(value: boolean);
@@ -38,6 +50,7 @@ export declare class AccountsPage implements TerminalPage {
         readonly title: "Pools";
     }];
     activeTab(): string;
+    selectTab(id: string): void;
     hint(): string;
     private reload;
     /** Searching looks through accounts and pools together; otherwise the page shows the current section. */
@@ -45,9 +58,18 @@ export declare class AccountsPage implements TerminalPage {
     private accountRows;
     private poolRows;
     private account;
+    private detailAccount;
+    private selectGrouped;
+    private accountActionGroup;
+    private fillActions;
+    private detailLines;
     /** Runs one thing at a time and always reads the accounts again afterwards. */
     private guarded;
+    private closeDetails;
+    private openDetails;
     private activateRow;
+    private activateAction;
+    private moveSection;
     handleMouse(event: TerminalMouseInput): import("@earendil-works/pi-tui").TuiMouseEventResult | undefined;
     handleInput(data: string): boolean;
     render(width: number, rows: number): string[];