@visual-z/xeno 0.1.4 → 0.2.0

package/src/apps/commands.ts

@@ -15,11 +15,13 @@ import { expandTemplate, type PromptTemplate } from "../core/prompts.ts";
 import { skillInvocationMessage, type Skill } from "../core/skills.ts";
 
 export type Command =
+  | { kind: "extension"; name: string; args: string }
   | { kind: "prompt"; text: string }
   | { kind: "quit" }
   | { kind: "usage" }
   | { kind: "state" }
   | { kind: "model"; pattern?: string }
+  | { kind: "scoped-models" }
   | { kind: "login"; provider?: string }
   | { kind: "logout"; provider?: string }
   | { kind: "back"; arg?: string; mode: RewindMode; confirm: boolean }
@@ -29,13 +31,19 @@ export type Command =
   | { kind: "name"; name: string }
   | { kind: "session" }
   | { kind: "help" }
-  | { kind: "trust"; target: "here" | "parent" | "never" }
+  | { kind: "trust"; target?: "here" | "parent" | "never" | "once" }
+  | { kind: "reload" }
+  | { kind: "config" }
   | { kind: "models-refresh" }
   | { kind: "settings"; field?: string; value?: string }
   | { kind: "hotkeys" }
   | { kind: "thinking"; level?: string }
   | { kind: "export"; file?: string }
+  | { kind: "import"; file?: string }
+  | { kind: "debug"; file?: string }
+  | { kind: "changelog" }
   | { kind: "copy" }
+  | { kind: "attachments" }
   | { kind: "fork"; arg?: string }
   | { kind: "clone" }
   | { kind: "unknown"; input: string };
@@ -43,8 +51,9 @@ export type Command =
 /** One catalog owns discoverability, parsing and busy-turn policy. */
 export const COMMANDS = [
   { name: "model", description: "Choose a model", argumentHint: "[id]", busy: "idle" },
+  { name: "scoped-models", description: "Enable and order models for cycling", busy: "idle" },
   { name: "thinking", description: "Set reasoning effort", argumentHint: "[level]", busy: "idle" },
-  { name: "settings", description: "Change theme, thinking and status bar", argumentHint: "[key value]", busy: "idle" },
+  { name: "settings", description: "Configure appearance, input and model behavior", argumentHint: "[key value]", busy: "idle" },
   { name: "login", description: "Sign in or store an API key", argumentHint: "[provider]", busy: "idle" },
   { name: "logout", description: "Remove a stored credential", argumentHint: "[provider]", busy: "idle" },
   { name: "new", description: "Start a new session", busy: "idle" },
@@ -58,9 +67,15 @@ export const COMMANDS = [
   { name: "usage", description: "Show token usage and costs", busy: "run" },
   { name: "state", description: "Show log and handoff state", busy: "run" },
   { name: "export", description: "Export HTML or JSONL", argumentHint: "[file]", busy: "idle" },
+  { name: "import", description: "Import a portable JSONL session", argumentHint: "<file>", busy: "idle" },
+  { name: "debug", description: "Write local terminal diagnostics", argumentHint: "[file]", busy: "run" },
+  { name: "changelog", description: "Show local release notes", busy: "run" },
   { name: "copy", description: "Copy the last assistant reply", busy: "run" },
+  { name: "attachments", description: "Remove images from the current draft", busy: "run" },
   { name: "models", description: "Refresh the model catalog", argumentHint: "refresh", busy: "idle" },
   { name: "trust", description: "Set workspace configuration trust", argumentHint: "[here|parent|never]", busy: "idle" },
+  { name: "reload", description: "Reload settings, skills, prompts, themes and models", busy: "idle" },
+  { name: "config", description: "Configure resource sources and enablement", busy: "idle" },
   { name: "hotkeys", description: "Show active keybindings", busy: "run" },
   { name: "help", description: "Show commands and input help", busy: "run" },
   { name: "quit", description: "Exit xeno", busy: "run" },
@@ -79,6 +94,7 @@ const BUILTIN_SET = new Set<string>(BUILTIN_COMMAND_NAMES);
 export interface SlashCatalog {
   readonly prompts: ReadonlyMap<string, PromptTemplate>;
   readonly skills: ReadonlyMap<string, Skill>;
+  readonly skillCommands?: boolean;
 }
 
 export function resolveSlashCatalog(
@@ -130,6 +146,10 @@ export function parseCommand(input: string, catalog?: SlashCatalog): Command {
   if (!commandDefinition(text)) return resolveRegistered(token, arg, text, rest.length, catalog);
 
   switch (token) {
+    case "/reload": return { kind: "reload" };
+    case "/config": return { kind: "config" };
+    case "/attachments": return { kind: "attachments" };
+    case "/scoped-models": return { kind: "scoped-models" };
     case "/quit":
     case "/exit":
       return { kind: "quit" };
@@ -178,8 +198,14 @@ export function parseCommand(input: string, catalog?: SlashCatalog): Command {
       return { kind: "hotkeys" };
     case "/thinking":
       return arg.length > 0 ? { kind: "thinking", level: arg } : { kind: "thinking" };
+    case "/changelog": return { kind: "changelog" };
     case "/export":
-      return arg.length > 0 ? { kind: "export", file: arg } : { kind: "export" };
+    case "/import":
+    case "/debug": {
+      const kind = token.slice(1) as "export" | "import" | "debug";
+      const path = text.slice(head!.length).trim().replace(/^(?:"(.*)"|'(.*)')$/, (_m, double: string | undefined, single: string | undefined) => double ?? single ?? "");
+      return path ? { kind, file: path } : { kind };
+    }
     case "/copy":
       return { kind: "copy" };
     case "/fork":
@@ -187,7 +213,9 @@ export function parseCommand(input: string, catalog?: SlashCatalog): Command {
     case "/clone":
       return { kind: "clone" };
     case "/trust": {
+      if (!rest.length) return { kind: "trust" };
       const word = (rest[0] ?? "here").toLowerCase();
+      if (word === "once") return { kind: "trust", target: "once" };
       if (rest.length === 0 || word === "here" || word === "yes") {
         return { kind: "trust", target: "here" };
       }
@@ -208,7 +236,7 @@ function resolveRegistered(
   catalog: SlashCatalog | undefined,
 ): Command {
   if (catalog !== undefined) {
-    if (token.startsWith("/skill:")) {
+    if (token.startsWith("/skill:") && catalog.skillCommands !== false) {
       const name = token.slice("/skill:".length);
       const skill = catalog.skills.get(name);
       if (skill !== undefined) {

package/src/apps/completions.ts

@@ -2,16 +2,18 @@ import { COMMANDS } from "./commands.ts";
 import type { App } from "./startup.ts";
 import { WorkspaceAutocomplete } from "../tui/autocomplete.ts";
 import { SUBSCRIPTION_OPTIONS } from "../runtime/oauth.ts";
+import { modelKey } from "../core/session-position.ts";
+import { supportedThinkingLevels } from "../core/thinking.ts";
+import { SETTINGS_KEYS, DISPLAY_SETTINGS } from "../core/settings.ts";
 
 export function interactiveAutocomplete(app: App, paths: (refresh?: boolean) => Promise<readonly string[]>): WorkspaceAutocomplete {
   const providers = [...new Set([...app.catalog.map((m) => m.provider), ...SUBSCRIPTION_OPTIONS.map((p) => p.id)])];
   const values: Record<string, () => string[]> = {
-    model: () => app.catalog.map((m) => m.id),
-    thinking: () => ["low", "medium", "high", "xhigh", "max"].filter((level) =>
-      app.providerConfig.spec.thinkingLevelMap?.[level as "low"] !== null),
+    model: () => app.catalog.map(modelKey),
+    thinking: () => [...supportedThinkingLevels(app.providerConfig.spec)],
     login: () => providers, logout: () => providers,
-    settings: () => ["theme", "thinking", "statusBar"],
-    models: () => ["refresh"], trust: () => ["here", "parent", "never"],
+    settings: () => [...new Set([...SETTINGS_KEYS, ...DISPLAY_SETTINGS.map(item => item.id)])],
+    models: () => ["refresh"], trust: () => ["once", "here", "parent", "never"],
   };
   const commands = COMMANDS.map((definition) => ({
     ...definition,
@@ -21,8 +23,9 @@ export function interactiveAutocomplete(app: App, paths: (refresh?: boolean) =>
     },
   }));
   const registered = [
+    ...[...app.extensions?.commands ?? []].map(([name, command]) => ({ name, ...command })),
     ...[...(app.slash?.prompts.values() ?? [])].map((p) => ({ name: p.name, description: p.description })),
-    ...[...(app.slash?.skills.values() ?? [])].map((s) => ({ name: `skill:${s.name}`, description: s.description })),
+    ...(app.slash?.skillCommands === false ? [] : [...(app.slash?.skills.values() ?? [])].map((s) => ({ name: `skill:${s.name}`, description: s.description }))),
   ];
   return new WorkspaceAutocomplete([...commands, ...registered], app.workspace, paths);
 }

package/src/apps/export-cli.ts

@@ -0,0 +1,24 @@
+/** Offline export is a local storage operation and never constructs an agent or loads extensions. */
+import { mkdtemp, rm, stat, writeFile } from "node:fs/promises";
+import { basename, join, resolve } from "node:path";
+import { tmpdir } from "node:os";
+import { toHtml } from "../core/export.ts";
+import { readCursor } from "../store/log.ts";
+import { readNodeHistory } from "../store/restore.ts";
+import { importSessionArchive } from "../store/session-archive.ts";
+import { findSessionByPrefix } from "../store/sessions.ts";
+
+export async function exportHtmlFile(input: string, output: string | undefined, workspace: string): Promise<string> {
+  const source = resolve(workspace, input), temporary = await mkdtemp(join(tmpdir(), "xeno-export-"));
+  try {
+    let dir: string;
+    if (await stat(source).then(info => info.isFile(), () => false)) dir = await importSessionArchive(source, temporary, workspace);
+    else { const found = await findSessionByPrefix(workspace, input); if (!found.ok) throw new Error(found.reason); dir = found.session.path; }
+    const cursor = await readCursor(dir); if (!cursor) throw new Error("Session has no cursor");
+    const history = await readNodeHistory(dir, cursor.node); if (!history.ok) throw new Error(history.error);
+    const destination = resolve(workspace, output || basename(input).replace(/\.jsonl$/i, "") + ".html");
+    if (source === destination) throw new Error("Export destination must differ from its source");
+    await writeFile(destination, toHtml(history.nodes.flatMap(node => node.events), { title: cursor.name ?? basename(input), exportedAt: new Date().toISOString() }), { mode: 0o600 });
+    return destination;
+  } finally { await rm(temporary, { recursive: true, force: true }); }
+}

package/src/apps/extension-ui.ts

@@ -0,0 +1,330 @@
+/** Pi extension UI ownership, bound to a single resource generation (D19). */
+import type { ExtensionRegistry, ExtensionToolResult, ExtensionToolRenderContext } from "../runtime/extensions.ts";
+import type { ExtensionUI, ExtensionComponent, ExtensionTheme, WidgetFactory, FooterFactory, EditorFactory, AutocompleteFactory, InputHandler, CustomOptions, DialogOptions } from "../runtime/extension-ui.ts";
+import type { Theme } from "../core/theme.ts";
+import { builtinTheme } from "../core/theme.ts";
+import type { ResourceIndex } from "../store/resource-index.ts";
+import { themeResourcePath } from "../store/resource-index.ts";
+import { discoverThemes, resolveTheme } from "../store/resources.ts";
+import { Container, Lines, PiText, identityEditorTheme, type InteractiveScreen } from "../tui/host.ts";
+import type { Editor } from "../tui/editor.ts";
+import { SelectList } from "../tui/select.ts";
+import { keyMatches } from "../tui/input.ts";
+import { Editor as PiEditor } from "../vendor/pi-tui/components/editor.ts";
+import { Input } from "../vendor/pi-tui/components/input.ts";
+import type { Component, OverlayHandle } from "../vendor/pi-tui/tui.ts";
+import type { KeybindingsManager } from "../vendor/pi-tui/keybindings.ts";
+import type { AutocompleteProvider } from "../vendor/pi-tui/autocomplete.ts";
+
+interface Host {
+  screen(): InteractiveScreen; editor: Editor; theme(): Theme; colored(): boolean;
+  bindings(): KeybindingsManager; branch(): string | null;
+  redraw(): void; refreshTranscript(): void; input(data: string): void; notify: ExtensionUI["notify"];
+  setTheme(theme: Theme): void; expanded(): boolean; expand(value: boolean): void;
+  cwd(): string; showImages(): boolean; outputPad(): number; saveTheme(name: string): void;
+}
+type Slot = { factory: WidgetFactory; component: OwnedComponent; below: boolean };
+type OwnedComponent = Component & { dispose(): void; focused?: boolean };
+type Dialog = { component?: OwnedComponent; raw?: ExtensionComponent; handle?: OverlayHandle; close(value?: unknown): void };
+
+export class ExtensionUiController {
+  readonly header = new Container();
+  readonly above = new Container();
+  readonly below = new Container();
+  readonly partials = new Container();
+  private partialComponents = new Map<string, OwnedComponent>();
+  private toolStates = new Map<string, Record<string, unknown>>();
+  private footer: OwnedComponent | undefined;
+  private headerSlot: Slot | undefined;
+  private footerFactory: FooterFactory | undefined;
+  private widgets = new Map<string, Slot>();
+  private statuses = new Map<string, string>();
+  private listeners = new Set<InputHandler>();
+  private branchListeners = new Set<() => void>();
+  private unlisten: (() => void) | undefined;
+  private unbind: (() => void) | undefined;
+  private unwatchTools: (() => void) | undefined;
+  private footerSubscriptions: (() => void)[] = [];
+  private editorFactory: EditorFactory | undefined;
+  private autocomplete: AutocompleteFactory[] = [];
+  private baseCompletion: AutocompleteProvider | undefined;
+  private themeCache = new Map<string, { theme: ExtensionTheme; path: string | undefined }>();
+  private registry: ExtensionRegistry | undefined;
+  private reported = new Set<string>();
+  private hasTitle = false;
+  private generation = 0;
+  private api: ExtensionUI;
+  private dialog: Dialog | undefined;
+  private pendingDialogs = new Set<() => void>();
+  private tail: Promise<unknown> = Promise.resolve();
+  private workingMessage: string | undefined;
+  private workingVisible = true;
+  private frames: string[] | undefined;
+  private frame = 0;
+  private interval = 80;
+  private timer: ReturnType<typeof setInterval> | undefined;
+  hiddenThinkingLabel: string | undefined;
+  private readonly host: Host;
+  constructor(host: Host) { this.host = host; this.host.editor.onComponentError = error => { this.editorFactory = undefined; this.report(error); }; this.api = this.createApi(); this.rebind(); }
+  get context(): ExtensionUI { return this.api; }
+  get modal(): Component | undefined { return this.dialog?.handle ? undefined : this.dialog?.component; }
+  get overlayFocused(): boolean { return this.dialog?.handle?.isFocused() ?? false; }
+  get customFooter(): Component | undefined { return this.footer; }
+  get status(): string { return [...this.statuses.values()].join(" · "); }
+  private report(error: unknown): void { const message = String(error); if (this.reported.has(message)) return; this.reported.add(message); this.host.notify(`Extension UI: ${message}`, "error"); }
+  private attempt<T>(fn: () => T): T | undefined { try { return fn(); } catch (error) { this.report(error); return undefined; } }
+
+  /** Errors are isolated at the component boundary, including errors thrown only during render. */
+  own(component: ExtensionComponent, fallback?: Component): OwnedComponent {
+    let failed = false, disposed = false;
+    const fail = (error: unknown) => { const report = !failed; failed = true; if (report) this.report(error); };
+    return {
+      render: width => { if (!failed) try { return component.render(width); } catch (error) { fail(error); } return fallback?.render(width) ?? []; },
+      invalidate: () => { if (!failed) try { component.invalidate?.(); } catch (error) { fail(error); } },
+      handleInput: data => { if (!failed) try { component.handleInput?.(data); } catch (error) { fail(error); } },
+      get focused() { return component.focused ?? false; }, set focused(value: boolean) { component.focused = value; },
+      dispose: () => { if (disposed) return; disposed = true; this.attempt(() => component.dispose?.()); },
+    };
+  }
+
+  async bind(registry: ExtensionRegistry | undefined, resources: ResourceIndex | undefined): Promise<void> {
+    if (registry === this.registry) return;
+    this.clear(); this.registry = registry; this.api = this.createApi();
+    this.unbind = registry?.onDispose(() => { this.clear(); this.registry = undefined; this.host.refreshTranscript(); });
+    this.unwatchTools = registry?.onToolUpdate((name, id, input, result) => {
+      const tool = registry.tools.get(name); if (!tool?.renderResult) return;
+      this.partialComponents.get(id)?.dispose();
+      this.partialComponents.set(id, this.renderTool(name, input, { text: result.content.filter(c => c.type === "text").map(c => c.text).join("\n"), ok: result.isError !== true, data: result.details }, this.host.expanded(), new Lines(() => []), new PiText(result.content.filter(c => c.type === "text").map(c => c.text).join("\n"), 0, 0), id, result));
+      this.partials.clear(); for (const component of this.partialComponents.values()) this.partials.addChild(component);
+      this.host.redraw();
+    });
+    const generation = this.generation, cache = new Map<string, { theme: ExtensionTheme; path: string | undefined }>();
+    for (const name of await discoverThemes(resources)) {
+      const path = resources ? themeResourcePath(resources, name) : undefined, errors: string[] = [];
+      const theme = await resolveTheme(path ?? name, errors);
+      if (!errors.length) cache.set(name, { theme: this.theme(theme), path });
+    }
+    if (generation === this.generation) this.themeCache = cache;
+    this.host.refreshTranscript();
+  }
+  private theme(theme = this.host.theme()): ExtensionTheme {
+    const ansi = (color: string) => this.host.colored() && theme.colors[color] ? `\x1b[${theme.colors[color]}m` : "";
+    const wrap = (open: string, text: string, close = "\x1b[0m") => open ? open + text + close : text;
+    const attr = (code: number, end: number) => (text: string) => wrap(this.host.colored() ? `\x1b[${code}m` : "", text, `\x1b[${end}m`);
+    return { ...theme, fg: (color, text) => wrap(ansi(color), text, "\x1b[39m"), bg: (color, text) => wrap(ansi(color), text, "\x1b[49m"),
+      bold: attr(1, 22), dim: attr(2, 22), italic: attr(3, 23), underline: attr(4, 24), inverse: attr(7, 27), strikethrough: attr(9, 29), getFgAnsi: ansi, getBgAnsi: ansi,
+      getColorMode: () => "truecolor", getThinkingBorderColor: level => text => wrap(ansi("thinking" + (level[0]?.toUpperCase() ?? "O") + level.slice(1)), text, "\x1b[39m"),
+      getBashModeBorderColor: () => text => wrap(ansi("bashMode"), text, "\x1b[39m") };
+  }
+
+  private createApi(): ExtensionUI {
+    const owner = this, generation = this.generation;
+    const api: ExtensionUI = {
+      notify: this.host.notify,
+      select: (title, choices, opts) => this.choose(title, choices, opts),
+      confirm: async (title, message, opts) => (await this.choose(`${title}\n${message}`, ["Yes", "No"], opts)) === "Yes",
+      input: (title, placeholder, opts) => this.textDialog(title, placeholder ?? "", false, opts),
+      editor: (title, prefill) => this.textDialog(title, prefill ?? "", true),
+      custom: (factory, opts) => this.custom(factory, opts),
+      onTerminalInput: handler => { this.listeners.add(handler); return () => this.listeners.delete(handler); },
+      setStatus: (key, text) => { if (text === undefined) this.statuses.delete(key); else this.statuses.set(key, text); this.host.redraw(); },
+      setWidget: (key, content, opts) => {
+        this.widgets.get(key)?.component.dispose(); this.widgets.delete(key);
+        if (content !== undefined) {
+          const factory: WidgetFactory = typeof content === "function" ? content : () => new PiText(content.join("\n"), 0, 0);
+          const component = this.attempt(() => factory(this.host.screen(), this.theme()));
+          if (component) this.widgets.set(key, { factory, component: this.own(component), below: opts?.placement === "belowEditor" });
+        }
+        this.mountWidgets(); this.host.redraw();
+      },
+      setHeader: factory => {
+        this.headerSlot?.component.dispose(); this.headerSlot = undefined; this.header.clear();
+        const component = factory && this.attempt(() => factory(this.host.screen(), this.theme()));
+        if (component) { this.headerSlot = { factory: factory!, component: this.own(component), below: false }; this.header.addChild(this.headerSlot.component); }
+        this.host.redraw();
+      },
+      setFooter: factory => {
+        this.footer?.dispose(); this.footer = undefined; this.footerFactory = factory;
+        for (const unsubscribe of this.footerSubscriptions.splice(0)) unsubscribe();
+        const component = factory && this.attempt(() => factory(this.host.screen(), this.theme(), {
+          getGitBranch: () => this.host.branch() ?? undefined, getExtensionStatuses: () => new Map(this.statuses),
+          onBranchChange: fn => { this.branchListeners.add(fn); const off = () => { this.branchListeners.delete(fn); }; this.footerSubscriptions.push(off); return off; },
+        }));
+        if (component) this.footer = this.own(component);
+        this.host.redraw();
+      },
+      setTitle: title => { this.hasTitle = true; this.host.screen().terminal.setTitle(title); },
+      setWorkingMessage: message => { this.workingMessage = message; this.host.redraw(); },
+      setWorkingVisible: visible => { this.workingVisible = visible; this.host.redraw(); },
+      setWorkingIndicator: options => { this.frames = options?.frames; this.interval = Math.max(16, options?.intervalMs ?? 80); this.frame = 0; clearInterval(this.timer); this.timer = undefined; this.host.redraw(); },
+      setHiddenThinkingLabel: label => { this.hiddenThinkingLabel = label; this.host.refreshTranscript(); this.host.redraw(); },
+      getEditorText: () => this.host.editor.state.text,
+      setEditorText: text => { this.host.editor.applyExternal(text); this.host.redraw(); },
+      pasteToEditor: text => { this.host.editor.acceptInput(`\x1b[200~${text}\x1b[201~`); this.host.redraw(); },
+      addAutocompleteProvider: factory => { this.autocomplete.push(factory); this.refreshCompletion(); },
+      setEditorComponent: factory => {
+        const component = factory && this.attempt(() => factory(this.host.screen(), identityEditorTheme(), this.host.bindings()));
+        if (factory && !component) return;
+        this.editorFactory = factory; this.host.editor.setComponent(component); this.host.redraw();
+      },
+      getEditorComponent: () => this.editorFactory,
+      get theme() { return owner.theme(); },
+      getAllThemes: () => [...this.themeCache].map(([name, value]) => ({ name, path: value.path })),
+      getTheme: name => this.themeCache.get(name)?.theme,
+      setTheme: name => {
+        const theme = typeof name === "string" ? this.themeCache.get(name)?.theme : name;
+        if (!theme || typeof theme.colors !== "object") return { success: false, error: `Unknown theme: ${String(name)}` };
+        this.host.setTheme(theme); if (typeof name === "string") this.host.saveTheme(name); return { success: true };
+      },
+      getToolsExpanded: () => this.host.expanded(), setToolsExpanded: value => { this.host.expand(value); this.host.redraw(); },
+    };
+    // An asynchronous extension from a disposed session must not mutate its successor's UI.
+    return new Proxy(api, { get(target, key, receiver) {
+      const value: unknown = Reflect.get(target, key, receiver);
+      return typeof value === "function" ? (...args: unknown[]) => generation === owner.generation ? Reflect.apply(value, target, args) : undefined : value;
+    } });
+  }
+
+  private mountWidgets(): void {
+    this.above.clear(); this.below.clear();
+    for (const slot of this.widgets.values()) (slot.below ? this.below : this.above).addChild(slot.component);
+  }
+  setCompletion(provider: AutocompleteProvider): void { this.baseCompletion = provider; this.refreshCompletion(); }
+  private refreshCompletion(): void {
+    if (!this.baseCompletion) return;
+    let provider: AutocompleteProvider = this.baseCompletion;
+    for (const factory of this.autocomplete) { const base: AutocompleteProvider = provider; provider = this.attempt(() => factory(base)) ?? base; }
+    this.host.editor.setAutocompleteProvider(provider);
+  }
+  filterInput(data: string): string | undefined {
+    for (const listener of this.listeners) { const value = data, result = this.attempt(() => listener(value)); if (result?.consume) return undefined; data = result?.data ?? data; }
+    return data;
+  }
+  acceptInput(data: string): boolean {
+    const dialog = this.dialog; if (!dialog || dialog.handle && !dialog.handle.isFocused()) return false;
+    if (keyMatches(data, "escape") || keyMatches(data, "ctrl+c")) dialog.close();
+    else this.attempt(() => dialog.raw?.handleInput?.(data));
+    this.host.redraw(); return true;
+  }
+  private choose(title: string, choices: string[], options?: DialogOptions): Promise<string | undefined> {
+    return this.custom<string | undefined>((_tui, _theme, _bindings, done) => {
+      const list = new SelectList(choices.map(value => ({ label: value, value })), { title, search: true });
+      return { render: width => list.render(width), invalidate: () => list.invalidate(), handleInput: data => { const state = list.acceptInput(data); if (state.confirmed) done(state.confirmed.value); else if (state.cancelled) done(undefined); } };
+    }, options);
+  }
+  private textDialog(title: string, value: string, multiline: boolean, options?: DialogOptions): Promise<string | undefined> {
+    return this.custom<string | undefined>((tui, _theme, _bindings, done) => {
+      const editor = multiline ? new PiEditor(tui, identityEditorTheme()) : new Input();
+      if (editor instanceof PiEditor) editor.setText(value);
+      editor.onSubmit = text => done(text); editor.focused = true;
+      return { render: width => [title,
+        ...(editor instanceof Input && !editor.getValue() && value ? [value] : []), ...editor.render(width)], invalidate: () => editor.invalidate(), handleInput: data => editor.handleInput(data) };
+    }, options);
+  }
+  private custom<T>(factory: Parameters<ExtensionUI["custom"]>[0], options?: CustomOptions): Promise<T> {
+    const generation = this.generation;
+    let resolve!: (result: T) => void;
+    const result = new Promise<T>(done => { resolve = done; });
+    let closed = false, timeout: ReturnType<typeof setTimeout> | undefined, tick: ReturnType<typeof setInterval> | undefined;
+    const cancel = () => dialog.close();
+    const dialog: Dialog = { close: value => {
+      if (closed) return; closed = true;
+      clearTimeout(timeout); clearInterval(tick); options?.signal?.removeEventListener("abort", cancel); this.pendingDialogs.delete(cancel);
+      dialog.handle?.hide(); dialog.component?.dispose();
+      if (this.dialog === dialog) this.dialog = undefined;
+      resolve(value as T); this.host.redraw();
+    } };
+    this.pendingDialogs.add(cancel);
+    options?.signal?.addEventListener("abort", cancel, { once: true });
+    if (options?.signal?.aborted) cancel();
+    const before = this.tail; this.tail = before.then(() => result);
+    void before.then(async () => {
+      if (closed || generation !== this.generation) return cancel();
+      this.dialog = dialog;
+      dialog.component = this.own(new PiText("Loading…", 0, 0)); this.host.redraw();
+      if (options?.timeout !== undefined) { timeout = setTimeout(cancel, Math.max(0, options.timeout)); tick = setInterval(() => this.host.redraw(), 200); }
+      try {
+        const component = await factory(this.host.screen(), this.theme(), this.host.bindings(), value => dialog.close(value));
+        if (closed || generation !== this.generation) { this.attempt(() => component.dispose?.()); return; }
+        dialog.component?.dispose(); dialog.raw = component;
+        const owner = this.own(component);
+        // Pi receives raw terminal input through this wrapper; the app loop remains its only dispatcher.
+        const deadline = options?.timeout === undefined ? undefined : Date.now() + options.timeout;
+        dialog.component = { ...owner, render: width => [...(deadline === undefined ? [] : [`${Math.max(0, Math.ceil((deadline - Date.now()) / 1000))}s remaining`]), ...owner.render(width)],
+          get focused() { return component.focused ?? false; }, set focused(value: boolean) { component.focused = value; }, handleInput: data => this.host.input(data) };
+        if (options?.overlay) {
+          dialog.handle = this.host.screen().showOverlay(dialog.component!, typeof options.overlayOptions === "function" ? options.overlayOptions() : options.overlayOptions);
+          options.onHandle?.({ ...dialog.handle, hide: cancel });
+        }
+        this.host.redraw();
+      } catch (error) { this.report(error); cancel(); }
+    });
+    return result;
+  }
+  working(active: boolean, fallback: string): string | undefined {
+    if (!active || !this.workingVisible) { clearInterval(this.timer); this.timer = undefined; return undefined; }
+    const frames = this.frames ?? ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+    if (frames.length > 1 && !this.timer) { this.timer = setInterval(() => { this.frame++; this.host.redraw(); }, this.interval); this.timer.unref(); }
+    return `${frames.length ? frames[this.frame % frames.length] + " " : ""}${this.workingMessage ?? fallback} · Esc to interrupt`;
+  }
+  /** Screen replacement cannot leave components pointing at a stopped Pi host. */
+  rebind(screenChanged = true): void {
+    if (screenChanged) this.cancelDialogs(); this.unlisten?.();
+    this.unlisten = this.host.screen().addInputListener(data => { const filtered = this.filterInput(data); return filtered === undefined ? { consume: true } : { data: filtered }; });
+    for (const [key, slot] of [...this.widgets]) this.api.setWidget(key, slot.factory, { placement: slot.below ? "belowEditor" : "aboveEditor" });
+    if (this.headerSlot) this.api.setHeader(this.headerSlot.factory);
+    if (this.footerFactory) this.api.setFooter(this.footerFactory);
+    if (this.editorFactory) this.api.setEditorComponent(this.editorFactory);
+    this.branchChanged();
+  }
+  branchChanged(): void { for (const listener of this.branchListeners) this.attempt(listener); }
+  clearPartials(): void { for (const component of this.partialComponents.values()) component.dispose(); this.partialComponents.clear(); this.partials.clear(); }
+  cancelDialogs(): void { for (const cancel of [...this.pendingDialogs]) cancel(); }
+  private clear(): void {
+    this.generation++; this.cancelDialogs(); clearInterval(this.timer); this.timer = undefined;
+    if (this.hasTitle) { this.host.screen().terminal.setTitle("xeno"); this.hasTitle = false; }
+    this.unbind?.(); this.unbind = undefined; this.unwatchTools?.(); this.unwatchTools = undefined; this.clearPartials();
+    this.toolStates.clear();
+    this.reported.clear();
+    for (const slot of this.widgets.values()) slot.component.dispose(); this.widgets.clear(); this.mountWidgets();
+    this.headerSlot?.component.dispose(); this.headerSlot = undefined; this.header.clear();
+    this.footer?.dispose(); this.footer = undefined; this.footerFactory = undefined;
+    for (const unsubscribe of this.footerSubscriptions.splice(0)) unsubscribe();
+    this.editorFactory = undefined; this.attempt(() => this.host.editor.setComponent(undefined));
+    this.autocomplete = []; this.refreshCompletion(); this.statuses.clear(); this.listeners.clear(); this.branchListeners.clear();
+    this.workingMessage = undefined; this.workingVisible = true; this.frames = undefined; this.hiddenThinkingLabel = undefined;
+    this.themeCache = new Map(["dark", "light"].map(name => [name, { theme: this.theme(builtinTheme(name === "dark" ? "dark" : "light")), path: undefined }]));
+  }
+  dispose(): void { this.clear(); this.unlisten?.(); this.unlisten = undefined; }
+  transformMarkdown(text: string, width: number, streaming: boolean, messageType = "assistant"): string {
+    for (const transform of this.registry?.markdown ?? []) { const input = text; text = this.attempt(() => transform(input, { availableWidth: width, isStreaming: streaming, messageType })) ?? input; }
+    return text;
+  }
+  renderMessage(type: string, text: string, data: unknown, expanded: boolean, fallback: Component, metadata: { id: string; entry: boolean; timestamp: string }): Component {
+    const render = (metadata.entry ? this.registry?.entryRenderers : this.registry?.renderers)?.get(type);
+    const message = metadata.entry ? { type: "custom", id: metadata.id, timestamp: metadata.timestamp, customType: type, data }
+      : { role: "custom", customType: type, content: text, details: data, display: true, timestamp: Date.parse(metadata.timestamp) };
+    const component = render && this.attempt(() => render(message, { expanded, outputPad: this.host.outputPad() }, this.theme()));
+    return component ? this.own(component, fallback) : fallback;
+  }
+  renderTool(name: string, input: unknown, result: { text: string; ok: boolean; data?: unknown } | null, expanded: boolean, callFallback: Component, resultFallback: Component, id: string, partial?: ExtensionToolResult): OwnedComponent {
+    const tool = this.registry?.tools.get(name);
+    const context: ExtensionToolRenderContext = { args: input, toolCallId: id, invalidate: () => this.host.screen().requestRender(), lastComponent: undefined,
+      state: this.toolStates.get(id) ?? {}, cwd: this.host.cwd(), executionStarted: true, argsComplete: true, isPartial: !!partial, expanded, showImages: this.host.showImages(), isError: result?.ok === false };
+    const slots: { raw?: ExtensionComponent; owned?: OwnedComponent; failed?: boolean }[] = [{}, {}];
+    const slot = (index: number, factory: (() => ExtensionComponent) | undefined, fallback: Component): Component => {
+      const current = slots[index]!;
+      if (!factory || current.failed) return fallback;
+      context.lastComponent = current.raw;
+      try {
+        const raw = factory();
+        if (raw !== current.raw) { current.owned?.dispose(); current.raw = raw; current.owned = this.own(raw, fallback); }
+        return current.owned ?? fallback;
+      } catch (error) { current.failed = true; this.report(error); return fallback; }
+      finally { this.toolStates.set(id, context.state); }
+    };
+    const components = () => [slot(0, tool?.renderCall ? () => tool.renderCall!(input, this.theme(), context) : undefined, callFallback),
+      slot(1, result && tool?.renderResult ? () => tool.renderResult!(partial ?? {content:[{type:"text",text:result.text}], ...(result.data === undefined ? {} : { details: result.data as import("../core/tool-contract.ts").JsonValue }),isError:!result.ok}, {expanded,isPartial:!!partial},this.theme(),context) : undefined, resultFallback)];
+    return { render: width => components().flatMap(c => c.render(width)), invalidate: () => slots.forEach(slot => slot.owned?.invalidate()), dispose: () => slots.forEach(slot => slot.owned?.dispose()) };
+  }
+}

package/src/apps/input.ts

@@ -14,6 +14,7 @@ import { isAbsolute, relative, resolve, sep } from "node:path";
 import { fuzzyFilter } from "../tui/fuzzy.ts";
 import type { FileIndex } from "../store/file-index.ts";
 import { fileReferences } from "../core/file-references.ts";
+import type { ImageRef } from "../core/images.ts";
 
 /**
  * Per-file cap for @ expansion. Assumed, not measured: 256KB of one file
@@ -38,6 +39,7 @@ export const MAX_COMMAND_OUTPUT_BYTES = 64 * 1024;
 export const COMMAND_TIMEOUT_MS = 120_000;
 
 export interface ExpandContext {
+  readonly attachImage?: (path: string) => Promise<ImageRef | null>;
   readonly workspace: string;
   readonly index: FileIndex;
   /** Terminal writer for !!cmd (and user-visible notices). */
@@ -48,6 +50,7 @@ export interface ExpandContext {
 }
 
 export interface ExpandResult {
+  readonly images?: readonly ImageRef[];
   /** Text to send to the model. Empty when nothing should be sent. */
   readonly message: string;
   /** False when the input produced no model-facing text (a lone !!cmd). */
@@ -60,6 +63,9 @@ export function matchFiles(index: FileIndex, query: string): string[] {
 
 export async function expandInput(text: string, ctx: ExpandContext): Promise<ExpandResult> {
   const out: string[] = [];
+  const images: ImageRef[] = [];
+  const attachment = ctx.attachImage;
+  if (attachment) ctx = { ...ctx, attachImage: async path => { const image = await attachment(path); if (image) images.push(image); return image; } };
   const refs = fileReferences(text);
   let offset = 0;
   for (const line of text.split(/\r?\n/)) {
@@ -91,13 +97,18 @@ export async function expandInput(text: string, ctx: ExpandContext): Promise<Exp
     if (line.slice(end).trim()) out.push(line.slice(end).trimStart());
   }
   const message = out.join("\n");
-  return { message, send: message.trim().length > 0 };
+  return { message, send: message.trim().length > 0 || images.length > 0, ...(images.length ? { images } : {}) };
 }
 
 async function expandReference(ref: string, ctx: ExpandContext): Promise<string> {
   const abs = confine(ctx.workspace, ref);
   if (abs === null) return skip(ctx, ref, "outside the workspace");
 
+  if (ctx.attachImage && /\.(png|jpe?g|gif|webp|bmp)$/i.test(abs)) {
+    const image = await ctx.attachImage(abs).catch(error => { if ((error as { code?: string }).code === "ENOENT") return null; throw error; });
+    if (image) return `[Image: ${image.name}, ${image.width}x${image.height}]`;
+  }
+
   const got = await tryRead(abs);
   if (got.status === "ok") return renderFile(posix(ref), got, ctx);
   if (got.reason !== "not found") return skip(ctx, posix(ref), got.reason);
@@ -108,6 +119,10 @@ async function expandReference(ref: string, ctx: ExpandContext): Promise<string>
     const path = hits[0]!;
     const hitAbs = confine(ctx.workspace, path);
     if (hitAbs === null) return skip(ctx, path, "outside the workspace");
+    if (ctx.attachImage && /\.(png|jpe?g|gif|webp|bmp)$/i.test(hitAbs)) {
+      const image = await ctx.attachImage(hitAbs);
+      if (image) return `[Image: ${image.name}, ${image.width}x${image.height}]`;
+    }
     const hit = await tryRead(hitAbs);
     if (hit.status === "ok") return renderFile(path, hit, ctx);
     return skip(ctx, path, hit.reason);

package/src/apps/model-catalog.ts

@@ -0,0 +1,42 @@
+import { modelKey } from "../core/session-position.ts";
+import { clampThinkingLevel } from "../core/thinking.ts";
+import { createProvider } from "../runtime/catalog.ts";
+import { storedIsOAuth } from "../runtime/auth.ts";
+import { outputTokenBudget, type ModelSpec } from "../runtime/model.ts";
+import { providerAccess, setProviderAccess } from "../runtime/provider-access.ts";
+import { providerReplayKey } from "../runtime/model-replay.ts";
+import { retryHandler, type App } from "./startup.ts";
+
+/** Publish the active profile with the directory. A changed wire identity checkpoints signed history (D8). */
+export async function publishModelCatalog(app: App, models: readonly ModelSpec[], checkpointed = false): Promise<boolean> {
+  if (app.session.running) throw new Error("cannot reload model configuration during a turn");
+  const previous = app.providerConfig.spec;
+  let spec = models.find(candidate => modelKey(candidate) === modelKey(previous));
+  if (!spec) {
+    spec = { ...previous };
+    const reason = `${modelKey(previous)} is disabled or absent from the catalog; choose /model before sending`;
+    setProviderAccess(spec, { invalid: reason });
+    app.providerConfig = { ...app.providerConfig, spec };
+    app.credential = { ok: false, reason };
+    app.catalog = models;
+    app.io.say(app.io.palette.yellow(`  ${reason}`));
+    return false;
+  }
+  if (JSON.stringify([previous, providerAccess(previous)]) === JSON.stringify([spec, providerAccess(spec)])) {
+    app.catalog = models;
+    return false;
+  }
+  const config = { ...app.providerConfig, spec, maxTokens: outputTokenBudget(spec), effort: clampThinkingLevel(spec, app.providerConfig.effort) };
+  const credential = app.credentialOf(spec);
+  const next = createProvider(config, credential.ok ? credential.key : "", retryHandler(app.io), {
+    effects: app.effects, oauth: !app.args.apiKey && storedIsOAuth(app.auth, spec.provider),
+  });
+  const needsCut = providerReplayKey(previous) !== providerReplayKey(spec);
+  if (needsCut && !checkpointed) await app.session.switchModel(next);
+  else app.session.provider = next;
+  app.providerConfig = config;
+  app.credential = credential;
+  app.catalog = models;
+  if (app.ui) app.ui.settings = { ...app.ui.settings, thinking: config.effort };
+  return needsCut && !checkpointed;
+}