@xingular/harness 1.0.0 → 1.2.0

package/dist/sdk/terminal/tui/pages/accountsPage.js

@@ -1,4 +1,4 @@
-import { matchesKey, truncateToWidth } from '@earendil-works/pi-tui';
+import { matchesKey, truncateToWidth, visibleWidth, wrapTextWithAnsi } from '@earendil-works/pi-tui';
 import { HEALTH, accountActions, accountDetails, addAccount, editPool, runAccountAction } from "../../accountsMenu.js";
 import { safeText } from "../chrome.js";
 import { FilterList } from "../list.js";
@@ -10,27 +10,59 @@ const BACK = 'Back';
 const HEALTH_TONE = { ok: 'success', limited: 'warning', auth_expired: 'error', signed_out: 'error', error: 'error', unknown: 'dim' };
 export class AccountsPage {
     options;
+    presentation = 'fullscreen';
+    ownsNavigation = true;
     overview;
     error;
     section = 'accounts';
+    focus = 'list';
+    detailOpen = false;
+    detailAccountId;
     busy = false;
     disposed = false;
+    compact = false;
+    wideListWidth = 0;
+    actionRowsStart = 0;
     list;
+    actionList;
     constructor(options) {
         this.options = options;
         this.list = new FilterList({
             theme: options.theme, search: 'always', noun: ['row', 'rows'], empty: 'Nothing here yet',
             searchContext: () => 'accounts and pools',
-            onActivate: row => { void this.activateRow(row); }
+            onActivate: row => this.activateRow(row)
+        });
+        this.actionList = new FilterList({
+            theme: options.theme, search: 'never', noun: ['action', 'actions'],
+            onActivate: row => { if (row.data)
+                void this.activateAction(row.data); }
         });
     }
-    get focused() { return this.list.focused; }
-    set focused(value) { this.list.focused = value; }
+    get focused() { return this.list.focused || this.actionList.focused; }
+    set focused(value) { this.list.focused = value && this.focus === 'list'; this.actionList.focused = value && this.focus === 'actions'; }
     activate() { void this.reload(); }
     dispose() { this.disposed = true; }
     tabs() { return SECTIONS; }
     activeTab() { return this.section; }
-    hint() { return this.list.query ? 'Enter open · Esc clear' : 'Enter actions · type to search'; }
+    selectTab(id) {
+        if (!SECTIONS.some(tab => tab.id === id))
+            return;
+        this.section = id;
+        this.detailOpen = false;
+        this.detailAccountId = undefined;
+        this.focus = 'list';
+        this.list.focused = true;
+        this.actionList.focused = false;
+        this.fill();
+        this.options.changed();
+    }
+    hint() {
+        if (this.compact && this.detailOpen)
+            return '↑/↓ actions · Enter activate';
+        if (this.focus === 'actions')
+            return '↑/↓ actions · Enter activate · Tab focus';
+        return this.list.query ? 'Tab focus · Enter open · Esc clear' : 'Tab focus · ←/→ sections · Enter open';
+    }
     async reload() {
         try {
             this.overview = await this.options.call('accounts.list');
@@ -45,8 +77,12 @@ export class AccountsPage {
         this.options.changed();
     }
     /** Searching looks through accounts and pools together; otherwise the page shows the current section. */
-    fill() {
+    fill(compact = this.compact) {
+        this.compact = compact;
         this.list.setRows(this.list.query ? [...this.accountRows(), ...this.poolRows()] : this.section === 'accounts' ? this.accountRows() : this.poolRows());
+        const account = this.detailOpen ? this.detailAccount() : undefined;
+        if (account)
+            this.fillActions(account);
     }
     accountRows() {
         const overview = this.overview;
@@ -56,7 +92,7 @@ export class AccountsPage {
         const accounts = overview.accounts.map(account => ({
             id: `account:${account.id}`, group: 'Accounts',
             label: `${account.isDefault ? '●' : '○'} ${safeText(account.label)}`,
-            detail: `${HEALTH[account.state.health] ?? HEALTH.unknown}${session?.accountId === account.id ? ' · this session' : ''}`,
+            detail: `${HEALTH[account.state.health] ?? HEALTH.unknown}${session?.accountId === account.id ? ` · ${this.compact ? 'current' : 'this session'}` : ''}`,
             tone: HEALTH_TONE[account.state.health] ?? 'dim',
             searchText: `${account.label} ${account.state.identity ?? ''} ${HEALTH[account.state.health] ?? ''}`
         }));
@@ -80,6 +116,71 @@ export class AccountsPage {
         ];
     }
     account(id) { return this.overview?.accounts.find(account => `account:${account.id}` === id); }
+    detailAccount() { return this.detailAccountId ? this.overview?.accounts.find(account => account.id === this.detailAccountId) : undefined; }
+    selectGrouped(title, options) {
+        return this.options.ui.selectGrouped
+            ? this.options.ui.selectGrouped(title, options)
+            : this.options.ui.select(title, options.map(option => option.label));
+    }
+    accountActionGroup(label) {
+        if (label.startsWith('Use for this session') || label === 'Make default for new sessions')
+            return 'Session';
+        if (['Rename', 'Check', 'Activity'].includes(label))
+            return 'Account';
+        if (['Sign in', 'Remove a provider', 'Sign out'].includes(label))
+            return 'Sign-in';
+        if (label === 'Remove account')
+            return 'Remove';
+        return undefined;
+    }
+    fillActions(account) {
+        const isSession = this.options.session()?.accountId === account.id;
+        this.actionList.setRows(accountActions(account, isSession, false).map(label => ({
+            id: label, label, group: this.accountActionGroup(label), data: label
+        })));
+        this.actionList.focused = this.focus === 'actions';
+    }
+    detailLines(width, summary = false) {
+        const theme = this.options.theme();
+        const account = this.detailOpen ? this.detailAccount() : this.section === 'accounts' ? this.account(this.list.selected?.id ?? '') : undefined;
+        let title;
+        let lines;
+        if (account) {
+            title = account.label;
+            if (summary) {
+                const state = account.state;
+                const signedIn = state.signedIn === null ? 'not checked' : state.signedIn ? 'yes' : 'no';
+                lines = [
+                    `Health: ${HEALTH[state.health] ?? HEALTH.unknown} · Default: ${account.isDefault ? 'yes' : 'no'} · Signed in: ${signedIn}`,
+                    `Providers: ${state.piProviders.length ? state.piProviders.join(', ') : 'none'}`,
+                    ...(state.identity ? [`Identity: ${state.identity}`] : []),
+                    ...(state.plan ? [`Plan: ${state.plan}`] : []),
+                    `Last checked: ${state.lastCheckedAt ? new Date(state.lastCheckedAt).toLocaleString() : 'never'}`,
+                    ...state.limits.map(limit => `${limit.label}: ${limit.usedPercent ?? '?'}% used${limit.resetsAt ? `, resets ${new Date(limit.resetsAt).toLocaleString()}` : ''}`),
+                    ...(state.limits.length ? [] : ['Usage limits: not reported']),
+                    ...(state.capabilities.length ? [`Detected: ${state.capabilities.join(', ')}`] : []),
+                    ...(state.lastError ? [`Last error: ${state.lastError.message}`] : [])
+                ];
+            }
+            else {
+                lines = accountDetails(account).split('\n').slice(1);
+            }
+        }
+        else if (this.section === 'pools') {
+            const pool = this.overview?.pools.find(item => `pool:${item.id}` === this.list.selected?.id);
+            const names = new Map(this.overview?.accounts.map(item => [item.id, item.label]) ?? []);
+            title = pool ? `Pool · ${pool.label}` : 'Pools';
+            lines = pool
+                ? ['New sessions use the first ready account in this order:', ...pool.accountIds.map((id, index) => `${index + 1}. ${names.get(id) ?? 'removed account'}`)]
+                : ['Select a pool to see its account order.'];
+        }
+        else {
+            title = 'Account details';
+            lines = ['Select an account to see health and usage details.'];
+        }
+        const wrap = (text) => wrapTextWithAnsi(safeText(text), Math.max(1, width));
+        return [theme.bold(theme.fg('accent', safeText(title))), ...lines.flatMap(wrap).map(line => theme.fg('muted', line))];
+    }
     /** Runs one thing at a time and always reads the accounts again afterwards. */
     async guarded(work) {
         if (this.busy)
@@ -96,8 +197,31 @@ export class AccountsPage {
         }
         await this.reload();
     }
+    closeDetails() {
+        this.detailOpen = false;
+        this.detailAccountId = undefined;
+        this.focus = 'list';
+        this.list.focused = true;
+        this.actionList.focused = false;
+        this.options.changed();
+    }
+    openDetails() {
+        const account = this.account(this.list.selected?.id ?? '');
+        if (!account)
+            return;
+        this.detailOpen = true;
+        this.detailAccountId = account.id;
+        this.focus = 'actions';
+        this.list.focused = false;
+        this.fillActions(account);
+        this.options.changed();
+    }
     activateRow(row) {
-        return this.guarded(async () => {
+        if (this.account(row.id)) {
+            this.openDetails();
+            return;
+        }
+        void this.guarded(async () => {
             const { ui, call } = this.options;
             const overview = this.overview;
             if (!overview)
@@ -120,43 +244,119 @@ export class AccountsPage {
                 return;
             }
             const pool = overview.pools.find(candidate => `pool:${candidate.id}` === row.id);
-            if (pool) {
-                const action = await ui.select(pool.label, ['Edit', 'Delete', BACK]);
-                if (action === 'Edit')
-                    await editPool(ui, call, overview, pool);
-                else if (action === 'Delete' && await ui.confirm(`Delete ${pool.label}?`, 'The accounts stay. Only the pool is removed.')) {
-                    try {
-                        await call('accounts.removePool', { poolId: pool.id });
-                    }
-                    catch (error) {
-                        ui.notify(error instanceof Error ? error.message : String(error), 'error');
-                    }
-                }
+            if (!pool)
                 return;
+            const action = await this.selectGrouped(pool.label, [
+                { label: 'Edit', group: 'Manage' }, { label: 'Delete', group: 'Remove' }, { label: BACK }
+            ]);
+            if (action === 'Edit')
+                await editPool(ui, call, overview, pool);
+            else if (action === 'Delete' && await ui.confirm(`Delete ${pool.label}?`, 'The accounts stay. Only the pool is removed.')) {
+                try {
+                    await call('accounts.removePool', { poolId: pool.id });
+                }
+                catch (error) {
+                    ui.notify(error instanceof Error ? error.message : String(error), 'error');
+                }
             }
-            const account = this.account(row.id);
-            if (!account)
-                return;
-            const isSession = this.options.session()?.accountId === account.id;
-            const action = await ui.select(`${account.label} · ${HEALTH[account.state.health] ?? HEALTH.unknown}`, [...accountActions(account, isSession, false), BACK]);
-            if (!action || action === BACK)
-                return;
-            const outcome = await runAccountAction(ui, call, overview, account, action);
+        });
+    }
+    async activateAction(action) {
+        if (this.busy)
+            return;
+        const account = this.detailAccount();
+        const overview = this.overview;
+        if (!account || !overview)
+            return;
+        await this.guarded(async () => {
+            const outcome = await runAccountAction(this.options.ui, this.options.call, overview, account, action);
             if (outcome === 'relaunch')
                 this.options.relaunch();
+            if (outcome === 'gone') {
+                this.detailOpen = false;
+                this.detailAccountId = undefined;
+                this.focus = 'list';
+                this.list.focused = true;
+                this.actionList.focused = false;
+            }
         });
     }
+    moveSection(delta) {
+        const index = SECTIONS.findIndex(tab => tab.id === this.section);
+        this.section = SECTIONS[(index + delta + SECTIONS.length) % SECTIONS.length].id;
+        this.detailOpen = false;
+        this.detailAccountId = undefined;
+        this.focus = 'list';
+        this.list.focused = true;
+        this.actionList.focused = false;
+        this.fill();
+        this.options.changed();
+    }
     handleMouse(event) {
+        if (this.compact && this.detailOpen) {
+            this.focus = 'actions';
+            this.actionList.focused = true;
+            return this.actionList.handleMouse({ ...event, y: event.y - this.actionRowsStart });
+        }
+        if (this.wideListWidth && event.x >= this.wideListWidth + 3) {
+            if (!this.detailOpen)
+                return undefined;
+            this.focus = 'actions';
+            this.actionList.focused = true;
+            return this.actionList.handleMouse({ ...event, x: event.x - this.wideListWidth - 3, y: event.y - this.actionRowsStart });
+        }
+        this.focus = 'list';
+        this.actionList.focused = false;
+        this.list.focused = true;
         return this.list.handleMouse(event);
     }
     handleInput(data) {
-        if (matchesKey(data, 'tab') || matchesKey(data, 'shift+tab')) {
-            if (!this.list.query) {
-                this.section = this.section === 'accounts' ? 'pools' : 'accounts';
-                this.fill();
+        if (matchesKey(data, 'escape')) {
+            if (this.detailOpen) {
+                this.closeDetails();
+                return true;
+            }
+            if (this.focus !== 'list') {
+                this.focus = 'list';
+                this.list.focused = true;
+                this.actionList.focused = false;
+                this.options.changed();
+                return true;
             }
+            return this.list.handleInput(data);
+        }
+        if (matchesKey(data, 'tab') || matchesKey(data, 'shift+tab')) {
+            const order = this.compact && this.detailOpen
+                ? ['tabs', 'actions']
+                : this.detailOpen ? ['tabs', 'list', 'actions'] : ['tabs', 'list'];
+            const index = order.indexOf(this.focus);
+            const step = matchesKey(data, 'shift+tab') ? -1 : 1;
+            this.focus = order[(index + step + order.length) % order.length];
+            this.list.focused = this.focus === 'list';
+            this.actionList.focused = this.focus === 'actions';
+            this.options.changed();
             return true;
         }
+        if (this.focus === 'tabs') {
+            if (matchesKey(data, 'left')) {
+                this.moveSection(-1);
+                return true;
+            }
+            if (matchesKey(data, 'right')) {
+                this.moveSection(1);
+                return true;
+            }
+            if (matchesKey(data, 'enter')) {
+                this.focus = this.compact && this.detailOpen ? 'actions' : 'list';
+                this.list.focused = this.focus === 'list';
+                this.actionList.focused = this.focus === 'actions';
+                this.options.changed();
+                return true;
+            }
+            return false;
+        }
+        if (this.focus === 'actions')
+            return this.actionList.handleInput(data);
         const before = this.list.query;
         const used = this.list.handleInput(data);
         if (this.list.query !== before)
@@ -169,13 +369,41 @@ export class AccountsPage {
             return [];
         if (!this.overview)
             return [theme.fg(this.error ? 'error' : 'dim', this.error ? `Could not read accounts: ${this.error}` : 'Reading accounts…')];
-        const selected = this.section === 'accounts' ? this.account(this.list.selected?.id ?? '') : undefined;
-        const details = selected ? accountDetails(selected).split('\n').slice(1) : [];
-        // The list gets the rows it needs first; the details take what is left.
+        const compact = width < 88;
+        if (compact !== this.compact)
+            this.fill(compact);
+        if (compact && this.detailOpen && this.detailAccount()) {
+            const details = this.detailLines(width, true);
+            this.actionRowsStart = details.length + 1;
+            const actions = this.actionList.render(width, Math.max(1, rows - this.actionRowsStart));
+            return [...details, '', ...actions].slice(0, rows).map(line => truncateToWidth(line, width, ''));
+        }
+        if (!compact) {
+            this.wideListWidth = Math.min(width - 36, Math.max(32, Math.floor((width - 3) * 0.42)));
+            const detailWidth = Math.max(1, width - this.wideListWidth - 3);
+            const list = this.list.render(this.wideListWidth, rows);
+            const details = this.detailLines(detailWidth);
+            let inspector = details;
+            const account = this.detailOpen ? this.detailAccount() : undefined;
+            if (this.detailOpen && account) {
+                this.fillActions(account);
+                this.actionRowsStart = inspector.length + 1;
+                inspector = [...inspector, '', ...this.actionList.render(detailWidth, Math.max(1, rows - this.actionRowsStart))];
+            }
+            inspector = inspector.slice(0, rows);
+            return Array.from({ length: Math.min(rows, Math.max(list.length, inspector.length)) }, (_, index) => {
+                const left = truncateToWidth(list[index] ?? '', this.wideListWidth, '');
+                const right = truncateToWidth(inspector[index] ?? '', detailWidth, '');
+                const gap = ' '.repeat(Math.max(0, this.wideListWidth - visibleWidth(left)));
+                return truncateToWidth(`${left}${gap}${theme.fg('dim', ' │ ')}${right}`, width, '');
+            });
+        }
+        this.wideListWidth = 0;
+        const details = this.detailLines(width).slice(1);
         const detailRows = Math.min(details.length, 9, Math.max(0, rows - 2 - this.list.height));
         const lines = this.list.render(width, Math.max(2, rows - 1 - (detailRows ? detailRows + 1 : 0)));
         if (detailRows)
-            lines.push('', ...details.slice(0, detailRows).map(line => theme.fg('muted', line)));
+            lines.push('', ...details.slice(0, detailRows));
         return lines.slice(0, rows).map(line => truncateToWidth(line, width, ''));
     }
 }

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

@@ -0,0 +1,74 @@
+/**
+ * The Agents page (`/agents`): the agent profiles a subagent can start from (PROP-0029). Built-in
+ * and variant profiles are read-only and can be copied; a person's own global or project profiles
+ * open in their editor and can be deleted. The harness writes every file.
+ */
+import type { Theme } from '@earendil-works/pi-coding-agent';
+import type { AgentProfile, ProfileListing, ProfileProblem } from "../../../agents/profiles.js";
+import type { MenuCall, MenuUi } from "../../pluginMenu.js";
+import { type TabInfo } from "../chrome.js";
+import { type ListRow } from "../list.js";
+import type { TerminalMouseInput } from "../mouse.js";
+import type { TerminalPage } from "../page.js";
+export interface AgentsOverview extends ProfileListing {
+    dirs: {
+        global: string;
+        project: string | null;
+    };
+}
+export interface AgentsPageOptions {
+    theme(): Theme;
+    call: MenuCall;
+    ui: MenuUi & {
+        input(title: string, placeholder?: string): Promise<string | undefined>;
+    };
+    /** Opens a file in the person's editor; absent when the host has none. */
+    edit?(path: string): Promise<void>;
+    changed(): void;
+}
+type Row = {
+    kind: 'new';
+} | {
+    kind: 'profile';
+    profile: AgentProfile;
+} | {
+    kind: 'problem';
+    problem: ProfileProblem;
+};
+export declare const AGENT_ACTIONS: {
+    readonly edit: "Edit in your editor";
+    readonly copy: "Copy to a new profile";
+    readonly remove: "Delete";
+};
+export declare const AGENT_SCOPES: {
+    readonly project: "Project: this repository only";
+    readonly global: "Global: every folder";
+};
+export declare class AgentsPage implements TerminalPage {
+    private readonly options;
+    presentation: "fullscreen";
+    private overview;
+    private error;
+    private busy;
+    private disposed;
+    private readonly list;
+    constructor(options: AgentsPageOptions);
+    get focused(): boolean;
+    set focused(value: boolean);
+    activate(): void;
+    dispose(): void;
+    tabs(): readonly TabInfo[];
+    activeTab(): string;
+    hint(): string;
+    reload(): Promise<void>;
+    rows(): ListRow<Row>[];
+    private attempt;
+    private open;
+    private create;
+    activateRow(row: Row): Promise<void>;
+    private remove;
+    handleMouse(event: TerminalMouseInput): import("@earendil-works/pi-tui").TuiMouseEventResult | undefined;
+    handleInput(data: string): boolean;
+    render(width: number, rows: number): string[];
+}
+export {};

package/dist/sdk/terminal/tui/pages/agentsPage.js

@@ -0,0 +1,190 @@
+import { stripTerminalSequences, truncateToWidth, wrapTextWithAnsi } from '@earendil-works/pi-tui';
+import { formatVariant } from "../../../agents/profiles.js";
+import { headerRow, neutralRule, padded } from "../chrome.js";
+import { FilterList } from "../list.js";
+export const AGENT_ACTIONS = {
+    edit: 'Edit in your editor',
+    copy: 'Copy to a new profile',
+    remove: 'Delete'
+};
+export const AGENT_SCOPES = {
+    project: 'Project: this repository only',
+    global: 'Global: every folder'
+};
+const TABS = [{ id: 'agents', title: 'Agents' }];
+const GROUP = { builtin: 'Built-in', global: 'Global', project: 'Project', variant: 'From the variant' };
+function clean(value) {
+    return stripTerminalSequences(value).replace(/[\x00-\x08\x0b-\x1f\x7f]/g, ' ').replace(/[ \t]+/g, ' ').trim();
+}
+export class AgentsPage {
+    options;
+    presentation = 'fullscreen';
+    overview;
+    error;
+    busy = false;
+    disposed = false;
+    list;
+    constructor(options) {
+        this.options = options;
+        this.list = new FilterList({
+            theme: options.theme, search: 'always', noun: ['profile', 'profiles'], empty: 'No profiles',
+            onActivate: row => { if (row.data)
+                void this.activateRow(row.data); }
+        });
+    }
+    get focused() { return this.list.focused; }
+    set focused(value) { this.list.focused = value; }
+    activate() { void this.reload(); }
+    dispose() { this.disposed = true; }
+    tabs() { return TABS; }
+    activeTab() { return 'agents'; }
+    hint() { return 'Enter choose · type to search'; }
+    async reload() {
+        try {
+            this.overview = await this.options.call('terminal.agents.list');
+            this.error = undefined;
+        }
+        catch (error) {
+            this.error = error instanceof Error ? error.message : String(error);
+        }
+        if (this.disposed)
+            return;
+        this.list.setRows(this.rows());
+        this.options.changed();
+    }
+    rows() {
+        const overview = this.overview;
+        if (!overview)
+            return [];
+        const rows = [{ id: 'new', label: 'New profile', group: 'Actions', detail: 'from a template, then opens in your editor', tone: 'accent', data: { kind: 'new' } }];
+        for (const source of ['builtin', 'global', 'project', 'variant']) {
+            for (const profile of overview.profiles.filter(entry => entry.source === source)) {
+                rows.push({
+                    id: `profile:${profile.name}`, label: profile.name, group: GROUP[source], detail: clean(profile.description), tone: 'muted',
+                    searchText: `${profile.name} ${profile.description} ${source}`, data: { kind: 'profile', profile }
+                });
+            }
+        }
+        for (const problem of overview.problems) {
+            rows.push({
+                id: `problem:${problem.source}:${problem.name}`, label: problem.name, group: 'Cannot be read', detail: clean(problem.error), tone: 'error',
+                searchText: `${problem.name} ${problem.error}`, data: { kind: 'problem', problem }
+            });
+        }
+        return rows;
+    }
+    async attempt(work) {
+        if (this.busy)
+            return;
+        this.busy = true;
+        try {
+            const message = await work();
+            if (message)
+                this.options.ui.notify(message, 'info');
+        }
+        catch (error) {
+            this.options.ui.notify(error instanceof Error ? error.message : String(error), 'error');
+        }
+        finally {
+            this.busy = false;
+        }
+        await this.reload();
+    }
+    async open(path) {
+        if (!this.options.edit)
+            return `Edit the profile at ${path}.`;
+        await this.options.edit(path);
+    }
+    async create(from) {
+        const ui = this.options.ui;
+        const name = (await ui.input(from ? `Name for the copy of ${from}` : 'Profile name', 'lowercase-with-dashes'))?.trim();
+        if (!name)
+            return;
+        const scopes = this.overview?.dirs.project ? [AGENT_SCOPES.project, AGENT_SCOPES.global] : [AGENT_SCOPES.global];
+        const choice = await ui.select(`Where should ${name} live?`, scopes);
+        if (!choice)
+            return;
+        const scope = choice === AGENT_SCOPES.project ? 'project' : 'global';
+        const made = await this.options.call('terminal.agents.create', { name, scope, ...(from ? { from } : {}) });
+        return (await this.open(made.path)) ?? `Saved ${made.name}.`;
+    }
+    async activateRow(row) {
+        if (row.kind === 'new')
+            return this.attempt(() => this.create(null));
+        if (row.kind === 'problem') {
+            const { problem } = row;
+            const scope = problem.source === 'global' || problem.source === 'project' ? problem.source : null;
+            const choice = await this.options.ui.select(`${problem.name} · ${problem.error}`, [AGENT_ACTIONS.edit, ...(scope ? [AGENT_ACTIONS.remove] : [])]);
+            if (choice === AGENT_ACTIONS.edit)
+                return this.attempt(() => this.open(problem.path));
+            if (choice === AGENT_ACTIONS.remove && scope)
+                return this.remove(problem.name, scope);
+            return;
+        }
+        const { profile } = row;
+        const own = profile.source === 'global' || profile.source === 'project' ? profile.source : null;
+        const choice = await this.options.ui.select(`${profile.name} · ${GROUP[profile.source]}`, [...(own ? [AGENT_ACTIONS.edit] : []), AGENT_ACTIONS.copy, ...(own ? [AGENT_ACTIONS.remove] : [])]);
+        if (choice === AGENT_ACTIONS.edit && profile.path)
+            return this.attempt(() => this.open(profile.path));
+        if (choice === AGENT_ACTIONS.copy)
+            return this.attempt(() => this.create(profile.name));
+        if (choice === AGENT_ACTIONS.remove && own)
+            return this.remove(profile.name, own);
+    }
+    async remove(name, scope) {
+        if (!await this.options.ui.confirm(`Delete ${name}?`, `This removes your ${scope} profile file. A built-in profile of the same name comes back.`))
+            return;
+        return this.attempt(async () => {
+            await this.options.call('terminal.agents.remove', { name, scope });
+            return `Deleted ${name}.`;
+        });
+    }
+    handleMouse(event) {
+        return this.list.handleMouse(event);
+    }
+    handleInput(data) {
+        if (this.list.handleInput(data)) {
+            this.options.changed();
+            return true;
+        }
+        return false;
+    }
+    render(width, rows) {
+        const theme = this.options.theme();
+        if (width < 1 || rows < 1)
+            return [];
+        if (this.error)
+            return [theme.fg('error', `Could not read agent profiles: ${this.error}`)];
+        if (!this.overview)
+            return [theme.fg('dim', 'Reading agent profiles…')];
+        const header = headerRow('Agents', `${this.overview.profiles.length} profiles`, width, theme);
+        const bodyRows = Math.max(0, rows - 7);
+        const listRows = Math.max(1, Math.min(this.list.height, Math.floor(bodyRows * 0.55)));
+        const output = [header, '', ...this.list.render(width, listRows), ''];
+        const selected = this.list.selected?.data;
+        const textWidth = Math.max(1, width - 4);
+        output.push(neutralRule(width, theme));
+        if (selected?.kind === 'profile') {
+            const profile = selected.profile;
+            const field = (label, value) => padded(`${theme.fg('muted', `${label}: `)}${theme.fg('text', clean(value))}`, width);
+            output.push(padded(theme.fg('accent', `${profile.name} · ${profile.color}`), width));
+            output.push(...wrapTextWithAnsi(theme.fg('text', clean(profile.description)), textWidth));
+            output.push(field('Tools', profile.tools?.join(', ') ?? 'all of the parent\'s'));
+            output.push(field('Plugins', profile.plugins?.join(', ') ?? 'all of the parent\'s'));
+            output.push(field('Variant', formatVariant(profile.variant) ?? 'the parent\'s'));
+            output.push(field('Model', [profile.model ?? 'the parent\'s', profile.effort ? `effort ${profile.effort}` : null].filter(Boolean).join(' · ')));
+            output.push(field('File', profile.path ?? 'built in'));
+            output.push(padded(theme.fg('accent', 'Instructions'), width));
+            output.push(...profile.instructions.split('\n').flatMap(line => wrapTextWithAnsi(theme.fg('muted', clean(line)), textWidth)));
+        }
+        else if (selected?.kind === 'problem') {
+            output.push(padded(theme.fg('error', selected.problem.error), width));
+            output.push(padded(theme.fg('muted', selected.problem.path), width));
+        }
+        else {
+            const dirs = this.overview.dirs;
+            output.push(padded(theme.fg('muted', `Your profiles live in ${dirs.global}${dirs.project ? ` and ${dirs.project}` : ''}. A project profile wins over a global one, and both over a built-in one.`), width));
+        }
+        return output.slice(0, rows).map(line => truncateToWidth(line, width, ''));
+    }
+}