@visual-z/xeno 0.1.3 → 0.2.0

package/src/tui/editor.ts

@@ -19,6 +19,7 @@
 import { Editor as PiEditor, type TUI } from "../vendor/pi-tui/index.ts";
 import { getKeybindings, setKeybindings, type KeybindingsManager } from "../vendor/pi-tui/keybindings.ts";
 import type { AutocompleteProvider } from "../vendor/pi-tui/autocomplete.ts";
+import type { EditorComponent } from "../vendor/pi-tui/editor-component.ts";
 import { encodeKey } from "./input.ts";
 import { IDENTITY, PLAIN_ATTRS, paint, type Style } from "./style.ts";
 import { completePath, pathTokenAtCursor, type PathToken } from "./complete.ts";
@@ -763,6 +764,10 @@ function maskSecret(text: string): string {
   return out;
 }
 
+class OwnedPiEditor extends PiEditor {
+  rebind(tui: TUI): void { this.tui = tui; }
+}
+
 export class Editor implements Component {
   private secret: boolean;
   private submitted: string | null = null;
@@ -778,8 +783,13 @@ export class Editor implements Component {
    * turn will spend (pi's behaviour). Identity until the Tui sets it.
    */
   borderColor: (s: string) => string = (s) => s;
-  readonly host: TUI;
-  private pi: PiEditor;
+  host: TUI;
+  private pi: OwnedPiEditor;
+  private custom: (EditorComponent & { dispose?(): void; focused?: boolean }) | undefined;
+  private lastCustomText = "";
+  onComponentError: ((error: unknown) => void) | undefined;
+  private padding = 0;
+  private autocompleteRows = 5;
 
   constructor(opts: CreateEditorOptions = {}) {
     this.secret = opts.secret ?? false;
@@ -790,9 +800,9 @@ export class Editor implements Component {
     this.pi.setText(opts.text ?? "");
   }
 
-  private createPi(): PiEditor {
+  private createPi(): OwnedPiEditor {
     const theme = identityEditorTheme();
-    const pi = new PiEditor(this.host, {
+    const pi = new OwnedPiEditor(this.host, {
       ...theme,
       borderColor: (s) => this.borderColor(s),
       selectList: {
@@ -803,6 +813,8 @@ export class Editor implements Component {
         noMatch: (s) => paint(s, { ...PLAIN_ATTRS, dim: true }, this.style),
       },
     });
+    pi.setPaddingX(this.padding);
+    pi.setAutocompleteMaxVisible(this.autocompleteRows);
     if (!this.secret) {
       for (const text of [...this.history].reverse()) pi.addToHistory(text);
       if (this.provider) pi.setAutocompleteProvider(this.provider);
@@ -818,8 +830,40 @@ export class Editor implements Component {
     return pi;
   }
 
-  get focused(): boolean { return this.pi.focused; }
-  set focused(value: boolean) { this.pi.focused = value; }
+  /** Application key ownership stays outside the replaceable text component. */
+  setComponent(component: (EditorComponent & { dispose?(): void; focused?: boolean }) | undefined): void {
+    const text = this.state.text, focused = this.focused;
+    try { this.custom?.dispose?.(); } catch (error) { this.onComponentError?.(error); }
+    this.custom = component;
+    if (component) {
+      component.onSubmit = text => {
+        this.submitted = text;
+        if (text.trim()) { component.addToHistory?.(text); if (this.history[0] !== text) this.history.unshift(text); this.history = this.history.slice(0, this.historyLimit); }
+      };
+      component.setPaddingX?.(this.padding); component.setAutocompleteMaxVisible?.(this.autocompleteRows);
+      if (this.provider) component.setAutocompleteProvider?.(this.provider);
+      for (const entry of [...this.history].reverse()) component.addToHistory?.(entry);
+    }
+    this.applyExternal(text); this.focused = focused;
+  }
+  private get active(): EditorComponent & { focused?: boolean } { return !this.secret && this.custom ? this.custom : this.pi; }
+  private using<T>(operation: (editor: EditorComponent & { focused?: boolean }) => T): T {
+    const active = this.active;
+    try { return operation(active); } catch (error) {
+      if (active === this.pi) throw error;
+      const broken = this.custom; this.custom = undefined; this.pi.setText(this.lastCustomText); this.pi.focused = true;
+      try { broken?.dispose?.(); } catch { /* Report the original component failure. */ }
+      this.onComponentError?.(error); return operation(this.pi);
+    }
+  }
+  get focused(): boolean { return this.using(editor => editor.focused ?? false); }
+  rebind(tui: TUI): void { this.host = tui; this.pi.rebind(tui); }
+  configure(padding: number, rows: number): void {
+    this.padding = padding; this.autocompleteRows = rows;
+    this.pi.setPaddingX(padding); this.pi.setAutocompleteMaxVisible(rows);
+    this.custom?.setPaddingX?.(padding); this.custom?.setAutocompleteMaxVisible?.(rows);
+  }
+  set focused(value: boolean) { this.using(editor => { editor.focused = value; }); }
   setStyle(style: Style): void { this.style = style; }
 
   handleInput(data: string): void {
@@ -831,26 +875,27 @@ export class Editor implements Component {
     this.submitted = null;
     const previous = getKeybindings();
     if (this.bindings) setKeybindings(this.bindings);
-    try { this.pi.handleInput(data); }
+    try { this.using(editor => editor.handleInput(data)); }
     finally { setKeybindings(previous); }
     return this.state;
   }
 
-  get autocompleteVisible(): boolean { return this.pi.isShowingAutocomplete(); }
+  get autocompleteVisible(): boolean { return this.active === this.pi && this.pi.isShowingAutocomplete(); }
 
   setAutocompleteProvider(provider: AutocompleteProvider): void {
     this.provider = provider;
-    if (!this.secret) this.pi.setAutocompleteProvider(provider);
+    if (!this.secret) this.using(editor => editor.setAutocompleteProvider?.(provider));
   }
 
   invalidate(): void {
-    this.pi.invalidate();
+    this.using(editor => editor.invalidate());
   }
 
   get state(): EditorState {
-    const text = this.pi.getExpandedText();
+    const text = this.using(editor => editor.getExpandedText?.() ?? editor.getText());
+    if (!this.secret) this.lastCustomText = text;
     const pos = this.pi.getCursor();
-    const cursor = this.pi.getLines().slice(0, pos.line).reduce((n, line) => n + line.length + 1, 0) + pos.col;
+    const cursor = this.active === this.pi ? this.pi.getLines().slice(0, pos.line).reduce((n, line) => n + line.length + 1, 0) + pos.col : text.length;
     return { ...createEditor(), text, cursor, submitted: this.submitted, secret: this.secret,
       history: this.history, historyLimit: this.historyLimit };
   }
@@ -860,7 +905,8 @@ export class Editor implements Component {
   }
 
   applyExternal(text: string): EditorState {
-    this.pi.setText(text);
+    if (!this.secret) this.lastCustomText = text;
+    this.using(editor => editor.setText(text));
     this.submitted = null;
     return this.state;
   }
@@ -868,12 +914,13 @@ export class Editor implements Component {
   setSecret(secret: boolean): EditorState {
     if (this.secret === secret) return this.state;
     const focused = this.focused;
-    const text = this.secret ? "" : this.pi.getExpandedText();
+    const text = this.secret ? "" : this.state.text;
     this.secret = secret;
     // Discard secret undo/history at the authentication boundary.
     this.pi = this.createPi();
     this.pi.focused = focused;
     this.pi.setText(text);
+    if (!secret) this.using(editor => editor.setText(text));
     return this.state;
   }
 
@@ -888,6 +935,6 @@ export class Editor implements Component {
       for (const _ of this.pi.getText().slice(this.state.cursor)) masked.handleInput("\x1b[D");
       return masked.render(width);
     }
-    return this.pi.render(width);
+    return this.using(editor => { editor.borderColor = this.borderColor; return editor.render(width); });
   }
 }

package/src/tui/host.ts

@@ -21,11 +21,28 @@ import {
   type Terminal,
   type TUI,
   TuiMainScreen,
+  TuiAltScreen,
   stripTerminalSequences,
 } from "../vendor/pi-tui/index.ts";
 
 export { Container, Markdown, PiText };
 export type { TuiMainScreen };
+/** A single document inset keeps committed and streaming messages aligned. */
+export class PaddedDocument extends Container {
+  padding = 1;
+  override render(width: number): string[] {
+    const padding = Math.min(this.padding, Math.max(0, Math.floor((width - 1) / 2)));
+    return super.render(Math.max(1, width - padding * 2)).map(line => line.startsWith("\x1b]133;A\x07")
+      ? "\x1b]133;A\x07" + " ".repeat(padding) + line.slice(8) : " ".repeat(padding) + line);
+  }
+}
+export type InteractiveScreen = TuiMainScreen | TuiAltScreen;
+export interface ScreenOptions {
+  tuiMode?: "regular" | "fullscreen";
+  fullscreenCopyOnSelect?: boolean;
+  fullscreenWheelScrollLines?: "auto" | number;
+  copySelection?: (text: string) => Promise<boolean | string>;
+}
 
 /**
  * Wraps the injectible {columns, rows, write} terminal tests already use.
@@ -76,8 +93,19 @@ export class AdapterTerminal implements Terminal {
 }
 
 /** TuiMainScreen without ProcessTerminal — tests inject a FakeTerminal. */
-export function createInteractiveTui(term?: SimpleTerminal, showHardwareCursor = true): TuiMainScreen {
-  return new TuiMainScreen(term ? new AdapterTerminal(term) : new ProcessTerminal(), showHardwareCursor);
+export function createInteractiveTui(term?: SimpleTerminal, showHardwareCursor = true, options: ScreenOptions = {}): InteractiveScreen {
+  return screenFor(term ? new AdapterTerminal(term) : new ProcessTerminal(), showHardwareCursor, options);
+}
+
+export function replaceInteractiveTui(previous: InteractiveScreen, options: ScreenOptions): InteractiveScreen {
+  return screenFor(previous.terminal, previous.getShowHardwareCursor(), options);
+}
+
+function screenFor(terminal: Terminal, cursor: boolean, options: ScreenOptions): InteractiveScreen {
+  return options.tuiMode === "fullscreen" ? new TuiAltScreen(terminal, cursor, undefined, {
+    wheelScrollLines: options.fullscreenWheelScrollLines ?? "auto", copyOnSelect: options.fullscreenCopyOnSelect ?? true,
+    ...(options.copySelection ? { copySelection: options.copySelection } : {}), scrollToEndIndicator: () => "↓ Latest",
+  }) : new TuiMainScreen(terminal, cursor);
 }
 
 /**
@@ -145,8 +173,13 @@ export function renderMarkdownLines(text: string, width: number, style: Style):
 }
 
 /** Activity-area assistant text: pi's Markdown, themed from our Style. */
-export function assistantMarkdown(text: string, style: Style): Component {
-  return new MarkdownBlock(text, style);
+export function assistantMarkdown(text: string, style: Style, features?: MarkdownFeatures): Component {
+  return new MarkdownBlock(text, style, features);
+}
+
+export interface MarkdownFeatures {
+  highlight: (code: string, language: string | undefined, style: Style) => string[];
+  transform: (text: string, width: number, streaming: boolean, style: Style, messageType?: "user" | "assistant" | "assistant-thinking") => string;
 }
 
 /** Keep Pi's parse/layout cache alive across keystrokes and streaming deltas. */
@@ -154,19 +187,27 @@ export class MarkdownBlock implements Component {
   private readonly markdown: Markdown;
   private readonly style: Style;
   private text: string;
-  constructor(text: string, style: Style) {
+  private readonly features: MarkdownFeatures | undefined;
+  private readonly streaming: boolean;
+  private renderedText: string | undefined;
+  constructor(text: string, style: Style, features?: MarkdownFeatures, streaming = false) {
     this.text = text;
     this.style = style;
-    this.markdown = new Markdown(text, 0, 0, markdownThemeFromStyle(style), defaultTextStyleFrom(style));
+    this.features = features; this.streaming = streaming;
+    this.markdown = new Markdown(text, 0, 0, { ...markdownThemeFromStyle(style),
+      ...(features && style !== IDENTITY ? { highlightCode: (code: string, lang?: string) => features.highlight(code, lang, style) } : {}),
+    }, defaultTextStyleFrom(style));
   }
   setText(text: string): void {
     if (text === this.text) return;
     this.text = text;
-    this.markdown.setText(text);
+    this.renderedText = undefined;
   }
   invalidate(): void { this.markdown.invalidate(); }
   render(width: number): string[] {
     if (width <= 0) return [""];
+    const transformed = this.features?.transform(this.text, width, this.streaming, this.style) ?? this.text;
+    if (this.renderedText !== transformed) { this.markdown.setText(transformed); this.renderedText = transformed; }
     const lines = this.markdown.render(Math.max(1, width)).map((line) => line.trimEnd());
     return this.style === IDENTITY ? lines.map(stripTerminalSequences) : lines;
   }
@@ -205,8 +246,8 @@ export function markdownThemeFromStyle(style: Style): MarkdownTheme {
     listBullet: wrapAttr(style, { ...PLAIN_ATTRS, dim: true }),
     bold: wrapAttr(style, { ...PLAIN_ATTRS, bold: true }),
     italic: wrapAttr(style, { ...PLAIN_ATTRS, italic: true }),
-    strikethrough: (t) => t,
-    underline: (t) => t,
+    strikethrough: (t) => `\x1b[9m${t}\x1b[29m`,
+    underline: (t) => `\x1b[4m${t}\x1b[24m`,
   };
 }
 

package/src/tui/input.ts

@@ -1,5 +1,5 @@
 /** Pi owns decoding. Encoding exists only for programmatic actions and legacy tests. */
-import { KeybindingsManager, TUI_KEYBINDINGS, type KeybindingsConfig } from "../vendor/pi-tui/keybindings.ts";
+import { KeybindingsManager, TUI_KEYBINDINGS, setKeybindings, type KeybindingsConfig } from "../vendor/pi-tui/keybindings.ts";
 import { matchesKey, parseKey, type KeyId } from "../vendor/pi-tui/keys.ts";
 import { formatTuiKey, type Key } from "./keys.ts";
 
@@ -62,8 +62,14 @@ const INPUT_ACTIONS: Record<string, string> = {
 export function editorBindings(byAction: Readonly<Record<string, readonly string[]>>): KeybindingsManager {
   const config: KeybindingsConfig = {};
   for (const [action, chords] of Object.entries(byAction)) {
-    const id = INPUT_ACTIONS[action] ?? `tui.${action}`;
+    const id = action.startsWith("tui.") ? action : INPUT_ACTIONS[action] ?? `tui.${action}`;
     if (id in TUI_KEYBINDINGS) config[id] = [...chords] as KeyId[];
   }
   return new KeybindingsManager(TUI_KEYBINDINGS, config);
 }
+
+export function installBindings(byAction: Readonly<Record<string, readonly string[]>>): KeybindingsManager {
+  const manager = editorBindings(byAction);
+  setKeybindings(manager);
+  return manager;
+}

package/src/tui/select.ts

@@ -15,7 +15,8 @@ import { Input } from "../vendor/pi-tui/components/input.ts";
 import { SelectList as PiSelectList } from "../vendor/pi-tui/components/select-list.ts";
 import { fuzzyFilter as piFuzzyFilter } from "../vendor/pi-tui/fuzzy.ts";
 import { truncateToWidth } from "../vendor/pi-tui/utils.ts";
-import { encodeKey, keyMatches } from "./input.ts";
+import { getKeybindings } from "../vendor/pi-tui/keybindings.ts";
+import { encodeKey } from "./input.ts";
 
 /**
  * Default visible rows. Assumed, not measured: enough to scan a /model
@@ -37,6 +38,7 @@ export interface CreateSelectOptions {
   readonly selectedValue?: string;
   readonly search?: boolean;
   readonly hint?: string;
+  readonly filter?: (items: readonly SelectItem[], query: string) => readonly SelectItem[];
 }
 
 export interface SelectState {
@@ -167,7 +169,7 @@ export function renderSelect(state: SelectState, width: number, style?: Style):
 export class SelectList implements Component {
   private current: SelectState;
   private style: Style | undefined;
-  private readonly items: readonly SelectItem[];
+  private items: readonly SelectItem[];
   private readonly options: CreateSelectOptions;
   private readonly search = new Input({ prompt: "Search: " });
   private list: PiSelectList;
@@ -192,6 +194,7 @@ export class SelectList implements Component {
   }
 
   get focused(): boolean { return this.search.focused; }
+  get query(): string { return this.search.getValue(); }
   set focused(value: boolean) { this.search.focused = value; }
   invalidate(): void { this.search.invalidate(); this.list.invalidate(); }
   handleInput(data: string): void { if (this.onInput) this.onInput(data); else this.acceptInput(data); }
@@ -204,14 +207,26 @@ export class SelectList implements Component {
     this.list.setSelectedIndex(selected);
   }
 
+  setItems(items: readonly SelectItem[]): void {
+    const selected = this.state.items[this.state.selected]?.value;
+    this.items = items;
+    const filtered = this.filter(items, this.search.getValue());
+    this.current = { ...this.current, items: filtered, selected: Math.max(0, filtered.findIndex(item => item.value === selected)) };
+    this.list = this.makeList();
+    this.list.setSelectedIndex(this.current.selected);
+  }
+
   acceptInput(data: string): SelectState {
     this.current = { ...this.current, confirmed: null, cancelled: false };
-    if (["up", "down", "enter", "escape", "ctrl+c"].some((key) => keyMatches(data, key))) this.list.handleInput(data);
-    else if (keyMatches(data, "pageUp") || keyMatches(data, "pageDown")) {
-      this.list.setSelectedIndex(this.state.selected + (keyMatches(data, "pageUp") ? -1 : 1) * this.current.maxVisible);
+    const kb = getKeybindings();
+    if ((["tui.select.up", "tui.select.down", "tui.select.confirm", "tui.select.cancel"] as const).some(key => kb.matches(data, key))) this.list.handleInput(data);
+    else if (kb.matches(data, "tui.select.pageUp") || kb.matches(data, "tui.select.pageDown")) {
+      this.list.setSelectedIndex(this.state.selected + (kb.matches(data, "tui.select.pageUp") ? -1 : 1) * this.current.maxVisible);
     } else if (this.options.search !== false) {
+      const before = this.search.getValue();
       this.search.handleInput(data);
-      const filtered = piFuzzyFilter([...this.items], this.search.getValue(), (item) => `${item.label} ${item.description ?? ""}`);
+      if (before === this.search.getValue()) return this.state;
+      const filtered = this.filter(this.items, this.search.getValue());
       this.current = { ...this.current, items: filtered, selected: 0 };
       this.list = this.makeList();
     }
@@ -228,6 +243,9 @@ export class SelectList implements Component {
     list.onCancel = () => { this.current = { ...this.current, cancelled: true }; };
     return list;
   }
+  private filter(items: readonly SelectItem[], query: string): readonly SelectItem[] {
+    return this.options.filter?.(items, query) ?? piFuzzyFilter([...items], query, item => `${item.label} ${item.description ?? ""}`);
+  }
 
   render(width: number): string[] {
     if (width <= 0) return [""];

package/src/tui/settings.ts

@@ -31,6 +31,10 @@ export class Settings {
     return this.changes;
   }
   updateValue(id: string, value: string): void { this.list.updateValue(id, value); }
+  updateValues(id: string, values: string[]): void {
+    const item = this.items.find(item => item.id === id);
+    if (item) item.values = values;
+  }
   invalidate(): void { this.list.invalidate(); }
   render(width: number): string[] {
     if (width <= 0) return [""];