@north-light/api 0.3.580 → 0.3.587

package/dist/clients/attach/input/controller.js

@@ -0,0 +1,383 @@
+// InputController owns editor intent and submission. Transient picker and dialog
+// lifetime belongs to InputOverlayOwner; viewer permission belongs to the single
+// ViewerCapabilities value supplied by session/input-wiring.
+import { spawn } from 'node:child_process';
+import { readFileSync, unlinkSync, writeFileSync } from 'node:fs';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { BROKER_READ_CAPS, encodeFrame, } from '../../../core/runtime/broker-protocol.js';
+import { classifySubmit } from '../../conversation/submit.js';
+import { findRefTokens } from '../../../shared/inline-ref-grammar.js';
+import { dispatchSlashCommand, isSlashCommand } from '../slash/dispatch.js';
+import { viewerOperationForFrame } from './capabilities.js';
+import { readClipboardImage, writeClipboardImageToFile } from './clipboard-image.js';
+import { InputOverlayOwner } from './overlay-owner.js';
+import { announceFallbackEditor, NO_EDITOR_MESSAGE, resolveEditor } from '../../../core/editor-resolver.js';
+const DOUBLE_ESCAPE_MS = 500;
+const MAX_FRAME_BYTES = BROKER_READ_CAPS.maxLineBytes - 4 * 1024 * 1024;
+export class InputController {
+    tui;
+    editor;
+    keybindings;
+    hooks;
+    capabilities;
+    overlays;
+    state;
+    lastEscapeAt = 0;
+    pastedImages = new Map();
+    pasteSeq = 0;
+    constructor(tui, editor, keybindings, hooks, capabilities) {
+        this.tui = tui;
+        this.editor = editor;
+        this.keybindings = keybindings;
+        this.hooks = hooks;
+        this.capabilities = capabilities;
+        this.overlays = new InputOverlayOwner(tui, editor, keybindings, {
+            send: (frame) => this.emitCommand(frame),
+            notify: (message) => this.notify(message),
+            onDialogResponse: hooks.onDialogResponse,
+            onRequest: hooks.onRequest,
+            onMountPicker: hooks.onMountPicker,
+            onUnmountPicker: hooks.onUnmountPicker,
+            state: () => this.state,
+        });
+        this.wire();
+    }
+    cycleLadder(direction) {
+        this.emitCommand({ type: 'cycle_ladder', direction });
+    }
+    sendInterrupting(text) {
+        return this.emitDrive({ type: 'prompt', text, interrupt: true });
+    }
+    /** Cancel the running turn without sending a message — the ctrl+c "stop the
+     *  agent" chord. Mirrors Esc's abort semantics. Returns false when nothing is
+     *  streaming to cancel, so the caller can hint at detach instead. */
+    abortTurn() {
+        if (this.state?.isStreaming !== true)
+            return false;
+        return this.emitCommand({ type: 'abort' });
+    }
+    attachDialog(request) {
+        this.overlays.attachDialog(request);
+    }
+    dismissDialog(id) {
+        this.overlays.dismissDialog(id);
+    }
+    setState(state) {
+        this.state = state;
+    }
+    openFileReviewPicker(candidates, cwd, onChoose) {
+        this.overlays.openFileReviewPicker(candidates, cwd, onChoose);
+    }
+    /** Retained as a narrow delegate for auth affordances wired by the session. */
+    openAuthPicker(prepare) {
+        return this.overlays.openAuthPicker(prepare);
+    }
+    send = (frame) => {
+        this.emitCommand(frame);
+    };
+    emitCommand(frame) {
+        const operation = viewerOperationForFrame(frame);
+        const refusal = operation === undefined ? undefined : this.capabilities.refusal(operation);
+        if (refusal === undefined) {
+            this.hooks.onCommand(frame);
+            return true;
+        }
+        this.notify(refusal);
+        return false;
+    }
+    openBrokerPicker(open) {
+        const refusal = this.capabilities.refusal('engine-drive');
+        if (refusal !== undefined) {
+            this.notify(refusal);
+            return;
+        }
+        open();
+    }
+    wire() {
+        this.editor.onSubmit = (text) => this.handleSubmit(text);
+        this.editor.onEscape = () => {
+            if (this.state?.isStreaming) {
+                this.emitCommand({ type: 'abort' });
+                return;
+            }
+            if (this.editor.getText().trim())
+                return;
+            const now = Date.now();
+            if (now - this.lastEscapeAt < DOUBLE_ESCAPE_MS) {
+                this.lastEscapeAt = 0;
+                this.openBrokerPicker(() => void this.overlays.openTreePicker());
+            }
+            else {
+                this.lastEscapeAt = now;
+            }
+        };
+        this.editor.onPasteImage = () => { void this.handlePaste(); };
+        const dropEditor = this.editor;
+        dropEditor.onPasteImagePath = (path) => { this.attachImage(path); return true; };
+        this.editor.onAction('app.session.new', () => this.emitCommand({ type: 'new_session' }));
+        this.editor.onAction('app.model.cycleForward', () => this.emitCommand({ type: 'cycle_model', direction: 'forward' }));
+        this.editor.onAction('app.model.cycleBackward', () => this.emitCommand({ type: 'cycle_model', direction: 'backward' }));
+        this.editor.onAction('app.thinking.cycle', () => this.emitCommand({ type: 'cycle_thinking' }));
+        this.editor.onAction('app.message.followUp', () => this.handleFollowUp());
+        this.editor.onAction('app.message.dequeue', () => void this.handleDequeue());
+        this.editor.onAction('app.tools.expand', () => this.hooks.onToggleToolsExpand?.());
+        this.editor.onAction('app.thinking.toggle', () => this.hooks.onToggleThinking?.());
+        this.editor.onAction('app.editor.external', () => void this.openExternalEditor());
+        this.editor.onAction('app.model.select', () => this.openBrokerPicker(() => void this.overlays.openModelPicker()));
+        this.editor.onAction('app.session.tree', () => this.openBrokerPicker(() => void this.overlays.openTreePicker()));
+        this.editor.onAction('app.session.fork', () => this.openBrokerPicker(() => void this.overlays.openForkPicker()));
+        this.editor.onAction('app.session.resume', () => this.openBrokerPicker(() => void this.overlays.openSessionPicker()));
+    }
+    slashContext() {
+        return {
+            send: this.send,
+            notify: (message) => this.notify(message),
+            capabilities: this.capabilities,
+            state: this.state,
+            cwd: process.cwd(),
+            onGraph: this.hooks.onGraph,
+            onInbox: this.hooks.onInbox,
+            onHelp: this.hooks.onHelp,
+            onQuit: this.hooks.onQuit,
+            onCopy: this.hooks.onCopy,
+            onCopyTarget: this.hooks.onCopyTarget,
+            onToggleMouse: this.hooks.onToggleMouse,
+            onColor: this.hooks.onColor,
+            onNodeMetadata: this.hooks.onNodeMetadata,
+            onFoldTools: this.hooks.onFoldTools,
+            onShowWorking: this.hooks.onShowWorking,
+            openModelPicker: () => this.openBrokerPicker(() => void this.overlays.openModelPicker()),
+            openSessionPicker: () => this.openBrokerPicker(() => void this.overlays.openSessionPicker()),
+            openForkPicker: () => this.openBrokerPicker(() => void this.overlays.openForkPicker()),
+            openTreePicker: () => this.openBrokerPicker(() => void this.overlays.openTreePicker()),
+            openSettingsPicker: () => this.openBrokerPicker(() => void this.overlays.openSettingsPicker()),
+            openScopedModelsPicker: () => this.openBrokerPicker(() => void this.overlays.openScopedModelsPicker()),
+            openMcpPicker: (serverName) => this.overlays.openMcpPicker(serverName),
+            openLoginPicker: this.hooks.openLoginPicker,
+            openLogoutPicker: this.hooks.openLogoutPicker,
+        };
+    }
+    /** Record a leading slash command as used. Called only once the command has
+     *  actually run — after a successful local dispatch or a successful send — so
+     *  refused, unsupported, and rejected submissions never bias completion. */
+    recordCommandUse(trimmed) {
+        const store = this.hooks.frecency;
+        if (!store)
+            return;
+        const name = trimmed.slice(1).split(/\s/, 1)[0];
+        if (name)
+            store.record(`command:${name}`);
+    }
+    /** Record usage so `/` completion can bias toward frequently/recently used
+     *  items next time. A leading slash token is a command; every resolvable
+     *  memory ref found in submitted prose is a ref use. Called only on the
+     *  success paths of `handleSubmit` — never for bash, a refused drive, or a
+     *  submission that classified out. */
+    recordCompletionUse(text) {
+        const store = this.hooks.frecency;
+        if (!store)
+            return;
+        const trimmed = text.trim();
+        if (isSlashCommand(trimmed)) {
+            this.recordCommandUse(trimmed);
+            return;
+        }
+        const known = this.hooks.knownRefNames?.();
+        if (!known || known.size === 0)
+            return;
+        const recorded = new Set();
+        for (const token of findRefTokens(text)) {
+            if (known.has(token.candidate) && !recorded.has(token.candidate)) {
+                recorded.add(token.candidate);
+                store.record(`ref:${token.candidate}`);
+            }
+        }
+    }
+    handleSubmit(text) {
+        const trimmed = text.trim();
+        if (!trimmed)
+            return;
+        if (isSlashCommand(trimmed) && dispatchSlashCommand(trimmed, this.slashContext())) {
+            this.recordCommandUse(trimmed);
+            this.editor.setText('');
+            return;
+        }
+        const isDormant = this.hooks.isDormant?.() === true;
+        // Unknown slash commands and `!` bash are broker operations, not human
+        // conversation input. Keep their text and refuse visibly while offline;
+        // only an ordinary submitted message crosses the durable wake boundary.
+        if (isDormant && (trimmed.startsWith('/') || trimmed.startsWith('!'))) {
+            this.notify('This node is parked — submit a message to wake it; broker commands need a live engine');
+            return;
+        }
+        const classification = classifySubmit(text, {
+            isDormant,
+            canWakeDormant: isDormant && this.capabilities.permits('wake-dormant') && this.hooks.onDormantSubmit !== undefined,
+            isStreaming: this.state?.isStreaming === true,
+        });
+        if (classification.kind === 'empty')
+            return;
+        if (classification.kind === 'dormant') {
+            const submit = this.hooks.onDormantSubmit;
+            if (submit === undefined)
+                return;
+            submit(this.expandImagePlaceholders(classification.text));
+            this.recordCompletionUse(text);
+            this.editor.addToHistory(classification.trimmed);
+            this.editor.setText('');
+            this.clearPastedImages();
+            this.hooks.onPromptSent?.();
+            return;
+        }
+        if (classification.kind === 'bash') {
+            if (!this.emitDrive({ type: 'bash', command: classification.command, excludeFromContext: classification.excludeFromContext }))
+                return;
+            this.editor.addToHistory(classification.trimmed);
+            this.editor.setText('');
+            return;
+        }
+        const delivery = classification.kind === 'slash'
+            ? (this.state?.isStreaming === true ? 'steer' : 'prompt')
+            : classification.kind;
+        if (delivery !== 'steer' && delivery !== 'prompt')
+            return;
+        const expanded = this.expandImagePlaceholders(classification.kind === 'slash' ? text : classification.text);
+        if (!this.emitDrive(delivery === 'steer' ? { type: 'steer', text: expanded } : { type: 'prompt', text: expanded }))
+            return;
+        this.recordCompletionUse(text);
+        this.editor.addToHistory(classification.trimmed);
+        this.editor.setText('');
+        this.clearPastedImages();
+        this.hooks.onPromptSent?.();
+    }
+    handleFollowUp() {
+        const text = this.editor.getText();
+        const trimmed = text.trim();
+        if (!trimmed)
+            return;
+        if (!this.emitDrive({ type: 'follow_up', text: this.expandImagePlaceholders(text) }))
+            return;
+        this.editor.addToHistory(trimmed);
+        this.editor.setText('');
+        this.clearPastedImages();
+    }
+    async handleDequeue() {
+        const refusal = this.capabilities.refusal('dequeue');
+        if (refusal !== undefined) {
+            this.notify(refusal);
+            return;
+        }
+        const request = this.hooks.onRequest;
+        if (request === undefined) {
+            this.notify("Restoring queued messages isn't available in this viewer");
+            return;
+        }
+        let reply;
+        try {
+            reply = await request({ type: 'dequeue' });
+        }
+        catch (error) {
+            this.notify(`Could not restore queued messages: ${error instanceof Error ? error.message : String(error)}`);
+            return;
+        }
+        if (reply.kind !== 'dequeue') {
+            this.notify('Unexpected reply restoring queued messages');
+            return;
+        }
+        const queued = [...reply.steering, ...reply.followUp];
+        if (queued.length === 0) {
+            this.notify('No queued messages to restore');
+            return;
+        }
+        this.editor.setText([queued.join('\n\n'), this.editor.getText()].filter((value) => value.trim()).join('\n\n'));
+        this.tui.requestRender();
+        this.notify(`Restored ${queued.length} queued message${queued.length > 1 ? 's' : ''} to editor`);
+    }
+    emitDrive(frame) {
+        try {
+            const bytes = Buffer.byteLength(encodeFrame(frame));
+            if (bytes > MAX_FRAME_BYTES) {
+                this.notify(`Message too large to send (${Math.round(bytes / (1024 * 1024))} MiB) — shorten the text or remove an attached image`);
+                return false;
+            }
+        }
+        catch {
+            this.notify('Message could not be encoded');
+            return false;
+        }
+        return this.emitCommand(frame);
+    }
+    async handlePaste() {
+        try {
+            const result = await readClipboardImage();
+            if (!result) {
+                this.notify('No image in the clipboard');
+                return;
+            }
+            if (!result.image) {
+                this.notify(result.note ?? 'Image not pasted');
+                return;
+            }
+            this.attachImage(writeClipboardImageToFile(result.image), result.note);
+        }
+        catch {
+            this.notify('Could not read the clipboard image');
+        }
+    }
+    attachImage(path, note) {
+        const n = ++this.pasteSeq;
+        this.pastedImages.set(n, path);
+        const current = this.editor.getText();
+        this.editor.insertTextAtCursor(`${current && !/\s$/.test(current) ? ' ' : ''}[Image #${n}] `);
+        this.notify(note ? `Image #${n} attached (${note})` : `Image #${n} attached`);
+        this.tui.requestRender();
+    }
+    expandImagePlaceholders(text) {
+        return text.replace(/\[Image #(\d+)\]/g, (match, digits) => this.pastedImages.get(Number(digits)) ?? match);
+    }
+    clearPastedImages() {
+        this.pastedImages.clear();
+        this.pasteSeq = 0;
+    }
+    async openExternalEditor() {
+        const resolved = resolveEditor();
+        if (resolved === null) {
+            this.notify(NO_EDITOR_MESSAGE);
+            return;
+        }
+        const editorCommand = resolved.command;
+        const expandedEditor = this.editor;
+        const temporaryFile = join(tmpdir(), `crtr-attach-editor-${Date.now()}.pi.md`);
+        try {
+            writeFileSync(temporaryFile, expandedEditor.getExpandedText?.() ?? this.editor.getText(), 'utf-8');
+            this.tui.stop();
+            const [command, ...args] = editorCommand.split(' ');
+            process.stdout.write(`Launching external editor: ${editorCommand}\nThe viewer resumes when it exits.\n`);
+            announceFallbackEditor(resolved);
+            const status = await new Promise((resolve) => {
+                const child = spawn(command, [...args, temporaryFile], { stdio: 'inherit', shell: process.platform === 'win32' });
+                child.on('error', () => resolve(null));
+                child.on('close', (code) => resolve(code));
+            });
+            if (status === null && resolved.source === 'fallback')
+                this.notify(`Could not launch ${editorCommand} — set $EDITOR to an editor you have installed`);
+            if (status === 0)
+                this.editor.setText(readFileSync(temporaryFile, 'utf-8').replace(/\n$/, ''));
+        }
+        catch (error) {
+            this.notify(`External editor failed: ${error instanceof Error ? error.message : String(error)}`);
+        }
+        finally {
+            try {
+                unlinkSync(temporaryFile);
+            }
+            catch { /* ignore temp cleanup */ }
+            this.tui.start();
+            this.tui.requestRender(true);
+        }
+    }
+    notify(message) {
+        this.hooks.onNotice?.(message);
+    }
+}

package/dist/clients/attach/input/overlay-owner.d.ts

@@ -0,0 +1,41 @@
+import type { CustomEditor } from '@earendil-works/pi-coding-agent';
+import type { Component, KeybindingsManager, TUI } from '@earendil-works/pi-tui';
+import type { BrokerDataFrame, BrokerSnapshot, ClientToBroker, RpcExtensionUIRequest, RpcExtensionUIResponse } from '../../../core/runtime/broker-protocol.js';
+import type { ReadOpRequest } from '../../../core/broker-client/index.js';
+import { type Picker, type PickerControls } from '../overlays/pickers.js';
+export interface InputOverlayHooks {
+    send: (frame: ClientToBroker) => void;
+    notify: (message: string) => void;
+    onDialogResponse: (response: RpcExtensionUIResponse) => void;
+    onRequest?: (frame: ReadOpRequest) => Promise<BrokerDataFrame>;
+    onMountPicker?: (component: Component) => void;
+    onUnmountPicker?: () => void;
+    state: () => BrokerSnapshot['state'] | undefined;
+}
+/** Owns transient dialog and picker lifetime. Editor submission remains with
+ * InputController; this collaborator owns mount, replacement, dismissal, and
+ * focus restoration for every transient input surface. */
+export declare class InputOverlayOwner {
+    private readonly tui;
+    private readonly editor;
+    private readonly keybindings;
+    private readonly hooks;
+    private dialog;
+    private dialogId;
+    private picker;
+    private openSeq;
+    constructor(tui: TUI, editor: CustomEditor, keybindings: KeybindingsManager, hooks: InputOverlayHooks);
+    attachDialog(request: RpcExtensionUIRequest): void;
+    dismissDialog(id: string): void;
+    openModelPicker(): Promise<void>;
+    openSessionPicker(): Promise<void>;
+    openTreePicker(): Promise<void>;
+    openForkPicker(): Promise<void>;
+    openSettingsPicker(): Promise<void>;
+    openScopedModelsPicker(): Promise<void>;
+    openMcpPicker(serverName?: string): void;
+    openFileReviewPicker(candidates: string[], cwd: string, onChoose: (file: string) => void): void;
+    openAuthPicker(prepare: () => Promise<(controls: PickerControls) => Picker>): Promise<void>;
+    private openPicker;
+    private showPicker;
+}

package/dist/clients/attach/input/overlay-owner.js

@@ -0,0 +1,199 @@
+import { isBlockingDialog, renderDialog } from '../overlays/dialogs.js';
+import { buildForkPicker, buildModelPicker, buildScopedModelsPicker, buildSessionPicker, buildSettingsPicker, buildTreePicker, } from '../overlays/pickers.js';
+import { buildMcpPicker, readMcpServers, startMcpServerAction, MCP_EMPTY_STATE_HINT } from '../overlays/mcp.js';
+import { buildFileReviewPicker } from '../overlays/file-review.js';
+const PICKER_OVERLAY_OPTIONS = { anchor: 'center', width: '80%', maxHeight: '85%' };
+/** Owns transient dialog and picker lifetime. Editor submission remains with
+ * InputController; this collaborator owns mount, replacement, dismissal, and
+ * focus restoration for every transient input surface. */
+export class InputOverlayOwner {
+    tui;
+    editor;
+    keybindings;
+    hooks;
+    dialog;
+    dialogId;
+    picker;
+    openSeq = 0;
+    constructor(tui, editor, keybindings, hooks) {
+        this.tui = tui;
+        this.editor = editor;
+        this.keybindings = keybindings;
+        this.hooks = hooks;
+    }
+    attachDialog(request) {
+        if (request.method === 'notify') {
+            const prefix = request.notifyType === 'error' ? 'Error: ' : request.notifyType === 'warning' ? 'Warning: ' : '';
+            this.hooks.notify(`${prefix}${request.message}`);
+            this.tui.requestRender();
+            return;
+        }
+        if (!isBlockingDialog(request))
+            return;
+        this.dialog?.dismiss();
+        this.dialogId = request.id;
+        this.dialog = renderDialog(this.tui, request, (response) => {
+            this.dialog = undefined;
+            this.dialogId = undefined;
+            this.hooks.onDialogResponse(response);
+        }, this.keybindings);
+        this.tui.requestRender();
+    }
+    dismissDialog(id) {
+        if (this.dialogId !== id)
+            return;
+        this.dialog?.dismiss();
+        this.dialog = undefined;
+        this.dialogId = undefined;
+        this.tui.requestRender();
+    }
+    openModelPicker() {
+        return this.openPicker({ type: 'list_models' }, 'list_models', 'model', (data, close) => buildModelPicker(this.tui, data, this.hooks.send, close));
+    }
+    openSessionPicker() {
+        const request = this.hooks.onRequest;
+        if (request === undefined) {
+            this.hooks.notify("The session picker isn't available in this viewer");
+            return Promise.resolve();
+        }
+        this.openSeq++;
+        this.showPicker((controls) => buildSessionPicker(this.tui, this.hooks.state()?.sessionFile, request, this.keybindings, this.hooks.send, controls.close));
+        return Promise.resolve();
+    }
+    openTreePicker() {
+        return this.openPicker({ type: 'get_tree' }, 'get_tree', 'tree', (data, close) => buildTreePicker(this.tui, data, this.hooks.send, close));
+    }
+    openForkPicker() {
+        return this.openPicker({ type: 'get_tree' }, 'get_tree', 'fork', (data, close) => buildForkPicker(data, this.hooks.send, close));
+    }
+    openSettingsPicker() {
+        return this.openPicker({ type: 'get_settings' }, 'get_settings', 'settings', (data, close) => buildSettingsPicker(data, this.hooks.send, close));
+    }
+    openScopedModelsPicker() {
+        return this.openPicker({ type: 'list_scoped_models' }, 'list_scoped_models', 'scoped-models', (data, close) => buildScopedModelsPicker(data, close, this.hooks.notify));
+    }
+    openMcpPicker(serverName) {
+        const rows = readMcpServers();
+        if (rows.length === 0) {
+            this.hooks.notify(MCP_EMPTY_STATE_HINT);
+            return;
+        }
+        if (serverName !== undefined) {
+            const row = rows.find((candidate) => candidate.name === serverName);
+            if (row === undefined) {
+                this.hooks.notify(`No MCP server named ${JSON.stringify(serverName)} — usage: /mcp [server]`);
+                return;
+            }
+            startMcpServerAction(row, this.hooks.send, this.hooks.notify);
+            return;
+        }
+        this.showPicker((controls) => buildMcpPicker(rows, this.hooks.send, controls.close, this.hooks.notify));
+    }
+    openFileReviewPicker(candidates, cwd, onChoose) {
+        this.showPicker((controls) => buildFileReviewPicker(candidates, cwd, (file) => {
+            controls.close();
+            onChoose(file);
+        }, controls.close, this.hooks.notify));
+    }
+    async openAuthPicker(prepare) {
+        const seq = ++this.openSeq;
+        let build;
+        try {
+            build = await prepare();
+        }
+        catch (error) {
+            this.hooks.notify(`Could not open the auth picker: ${error instanceof Error ? error.message : String(error)}`);
+            return;
+        }
+        if (seq !== this.openSeq)
+            return;
+        this.showPicker(build);
+    }
+    async openPicker(frame, kind, label, build) {
+        const request = this.hooks.onRequest;
+        if (request === undefined) {
+            this.hooks.notify(`The ${label} picker isn't available in this viewer`);
+            return;
+        }
+        const seq = ++this.openSeq;
+        let reply;
+        try {
+            reply = await request(frame);
+        }
+        catch (error) {
+            this.hooks.notify(`Could not open the ${label} picker: ${error instanceof Error ? error.message : String(error)}`);
+            return;
+        }
+        if (seq !== this.openSeq)
+            return;
+        if (reply.kind !== kind) {
+            this.hooks.notify(`Unexpected reply building the ${label} picker`);
+            return;
+        }
+        this.showPicker((controls) => build(reply, controls.close));
+    }
+    showPicker(build) {
+        this.picker?.dismiss();
+        const inline = this.hooks.onMountPicker !== undefined && this.hooks.onUnmountPicker !== undefined;
+        let handle;
+        let current;
+        let done = false;
+        const disposeCurrent = () => {
+            const disposable = current?.component;
+            try {
+                disposable?.dispose?.();
+            }
+            catch { /* ignore teardown errors */ }
+        };
+        const mount = (picker) => {
+            if (inline)
+                this.hooks.onMountPicker(picker.component);
+            else
+                handle = this.tui.showOverlay(picker.component, PICKER_OVERLAY_OPTIONS);
+            this.tui.setFocus(picker.focus);
+        };
+        const unmount = () => {
+            if (inline)
+                this.hooks.onUnmountPicker?.();
+            else
+                handle?.hide();
+        };
+        const replace = (component, focus) => {
+            if (done)
+                return;
+            disposeCurrent();
+            unmount();
+            current = { component, focus };
+            mount(current);
+            this.tui.requestRender();
+        };
+        const close = () => {
+            if (done)
+                return;
+            done = true;
+            disposeCurrent();
+            unmount();
+            this.picker = undefined;
+            this.tui.setFocus(this.editor);
+            this.tui.requestRender();
+        };
+        try {
+            current = build({ close, replace });
+        }
+        catch (error) {
+            this.hooks.notify(`Could not open picker: ${error instanceof Error ? error.message : String(error)}`);
+            return;
+        }
+        mount(current);
+        this.picker = {
+            dismiss: () => {
+                if (done)
+                    return;
+                done = true;
+                disposeCurrent();
+                unmount();
+            },
+        };
+        this.tui.requestRender();
+    }
+}