@visual-z/xeno 0.2.1 → 0.4.0

package/src/tui/select.ts

@@ -1,258 +0,0 @@
-/**
- * A pickable list: applySelectKey(state, key) is pure, renderSelect paints.
- *
- * The visible window follows the selection so a /model list of dozens
- * does not dump every row into the live region. An empty list must say
- * why it is empty -- a blank box looks like a render bug.
- */
-
-import { assertNever } from "./exhaustive.ts";
-import type { Key } from "./keys.ts";
-import type { Component } from "./text.ts";
-import { displayWidth } from "./width.ts";
-import { PLAIN_ATTRS, paint, type Style } from "./style.ts";
-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 { getKeybindings } from "../vendor/pi-tui/keybindings.ts";
-import { encodeKey } from "./input.ts";
-
-/**
- * Default visible rows. Assumed, not measured: enough to scan a /model
- * list without eating the whole scrollback. Callers pass maxVisible.
- */
-export const DEFAULT_MAX_VISIBLE = 10;
-
-export interface SelectItem {
-  readonly value: string;
-  readonly label: string;
-  readonly description?: string;
-}
-
-export interface CreateSelectOptions {
-  readonly maxVisible?: number;
-  readonly emptyMessage?: string;
-  readonly style?: Style;
-  readonly title?: string;
-  readonly selectedValue?: string;
-  readonly search?: boolean;
-  readonly hint?: string;
-  readonly filter?: (items: readonly SelectItem[], query: string) => readonly SelectItem[];
-}
-
-export interface SelectState {
-  readonly items: readonly SelectItem[];
-  readonly selected: number;
-  readonly maxVisible: number;
-  readonly confirmed: SelectItem | null;
-  readonly cancelled: boolean;
-  readonly emptyMessage: string;
-}
-
-export function createSelect(
-  items: readonly SelectItem[],
-  opts: CreateSelectOptions = {},
-): SelectState {
-  return {
-    items,
-    selected: 0,
-    maxVisible: opts.maxVisible ?? DEFAULT_MAX_VISIBLE,
-    confirmed: null,
-    cancelled: false,
-    emptyMessage: opts.emptyMessage ?? "No matching items",
-  };
-}
-
-export function applySelectKey(state: SelectState, key: Key): SelectState {
-  switch (key.type) {
-    case "up":
-      return move(state, -1);
-    case "down":
-      return move(state, 1);
-    case "enter":
-      return confirm(state);
-    case "escape":
-      return { ...state, cancelled: true, confirmed: null };
-    case "char":
-    case "backspace":
-    case "delete":
-    case "tab":
-    case "left":
-    case "right":
-    case "home":
-    case "end":
-    case "pageup":
-    case "pagedown":
-    case "ctrl":
-    case "alt":
-      return state;
-    default:
-      return assertNever(key, "applySelectKey");
-  }
-}
-
-function move(state: SelectState, dir: -1 | 1): SelectState {
-  const n = state.items.length;
-  if (n === 0) return state;
-  const selected = (state.selected + dir + n) % n;
-  return { ...state, selected, confirmed: null, cancelled: false };
-}
-
-function confirm(state: SelectState): SelectState {
-  const item = state.items[state.selected];
-  if (item === undefined) return state;
-  return { ...state, confirmed: item, cancelled: false };
-}
-
-interface Window {
-  readonly start: number;
-  readonly end: number;
-}
-
-function visibleWindow(state: SelectState): Window {
-  const n = state.items.length;
-  const cap = state.maxVisible;
-  if (n <= cap) return { start: 0, end: n };
-  const start = Math.max(
-    0,
-    Math.min(state.selected - Math.floor(cap / 2), n - cap),
-  );
-  return { start, end: Math.min(start + cap, n) };
-}
-
-/**
- * Truncate on display columns. Slicing with s.length would cut a CJK
- * label in half and the next cell would paint garbage.
- */
-function truncate(s: string, width: number): string {
-  if (width <= 0) return "";
-  if (displayWidth(s) <= width) return s;
-  let out = "";
-  let w = 0;
-  for (const ch of s) {
-    const cw = displayWidth(ch);
-    if (w + cw > width) break;
-    out += ch;
-    w += cw;
-  }
-  return out;
-}
-
-export function renderSelect(state: SelectState, width: number, style?: Style): string[] {
-  if (state.items.length === 0) return [state.emptyMessage];
-
-  const { start, end } = visibleWindow(state);
-  const lines: string[] = [];
-  for (let i = start; i < end; i++) {
-    const item = state.items[i];
-    if (item === undefined) continue;
-    const selected = i === state.selected;
-    const prefix = selected ? "→ " : "  ";
-    const budget = width - displayWidth(prefix);
-    let body = item.label;
-    const desc = item.description;
-    if (desc !== undefined && desc.length > 0) body = `${item.label}  ${desc}`;
-    const line = prefix + truncate(body, budget);
-    lines.push(
-      selected && style !== undefined ? paint(line, { ...PLAIN_ATTRS, selected: true }, style) : line,
-    );
-  }
-
-  const hidden = state.items.length - (end - start);
-  // Card copy is Chinese on purpose: this is the one user-visible string
-  // the completion definition named. English would silently relax it.
-  if (hidden > 0) lines.push(`还有 ${hidden} 条`);
-  return lines;
-}
-
-export class SelectList implements Component {
-  private current: SelectState;
-  private style: Style | undefined;
-  private items: readonly SelectItem[];
-  private readonly options: CreateSelectOptions;
-  private readonly search = new Input({ prompt: "Search: " });
-  private list: PiSelectList;
-  onInput: ((data: string) => void) | undefined;
-
-  constructor(items: readonly SelectItem[], opts: CreateSelectOptions = {}) {
-    this.current = createSelect(items, opts);
-    this.items = items;
-    this.options = opts;
-    this.style = opts.style;
-    this.list = this.makeList();
-    this.list.setSelectedIndex(Math.max(0, items.findIndex((item) => item.value === opts.selectedValue)));
-  }
-
-  get state(): SelectState {
-    const selected = this.list.getSelectedItem();
-    return { ...this.current, selected: Math.max(0, this.current.items.findIndex((item) => item.value === selected?.value)) };
-  }
-
-  applyKey(key: Key): SelectState {
-    return this.acceptInput(encodeKey(key));
-  }
-
-  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); }
-
-  setStyle(style: Style): void {
-    if (this.style === style) return;
-    const selected = this.state.selected;
-    this.style = style;
-    this.list = this.makeList();
-    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 };
-    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);
-      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();
-    }
-    return this.state;
-  }
-
-  private makeList(): PiSelectList {
-    const selected = (text: string) => this.style ? paint(text, { ...PLAIN_ATTRS, selected: true }, this.style) : text;
-    const dim = (text: string) => this.style ? paint(text, { ...PLAIN_ATTRS, dim: true }, this.style) : text;
-    const list = new PiSelectList([...this.current.items], this.current.maxVisible, {
-      selectedPrefix: selected, selectedText: selected, description: dim, scrollInfo: dim, noMatch: dim,
-    });
-    list.onSelect = (item) => { this.current = { ...this.current, confirmed: item }; };
-    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 [""];
-    const lines = [this.options.title ?? "Select"];
-    if (this.options.search !== false) lines.push(...this.search.render(width));
-    lines.push(...(this.current.items.length ? this.list.render(Math.max(4, width)) : [this.current.emptyMessage]));
-    lines.push(this.options.hint ?? "↑↓ select · Enter confirm · Esc cancel");
-    return lines.map((line) => truncateToWidth(line, width, ""));
-  }
-}

package/src/tui/settings.ts

@@ -1,44 +0,0 @@
-import { SettingsList, type SettingItem } from "../vendor/pi-tui/components/settings-list.ts";
-import { truncateToWidth } from "../vendor/pi-tui/utils.ts";
-import { PLAIN_ATTRS, paint, type Style } from "./style.ts";
-
-/** Pi owns settings navigation and cycling; apps persists the returned changes. */
-export class Settings {
-  private readonly items: SettingItem[];
-  private list: SettingsList;
-  private style: Style;
-  private changes: { id: string; value: string }[] = [];
-  cancelled = false;
-  onInput: ((data: string) => void) | undefined;
-  constructor(items: SettingItem[], style: Style) {
-    this.items = items;
-    this.style = style;
-    this.list = this.createList();
-  }
-  private createList(): SettingsList {
-    return new SettingsList(this.items, 8, {
-      label: (text, selected) => paint(text, { ...PLAIN_ATTRS, selected }, this.style),
-      value: (text) => paint(text, { ...PLAIN_ATTRS, status: true }, this.style),
-      description: (text) => paint(text, { ...PLAIN_ATTRS, dim: true }, this.style),
-      cursor: "→ ", hint: (text) => paint(text, { ...PLAIN_ATTRS, dim: true }, this.style),
-    }, (id, value) => { this.changes.push({ id, value }); }, () => { this.cancelled = true; }, { enableSearch: true });
-  }
-  setStyle(style: Style): void { this.style = style; }
-  handleInput(data: string): void { if (this.onInput) this.onInput(data); else this.acceptInput(data); }
-  acceptInput(data: string): { id: string; value: string }[] {
-    this.changes = [];
-    this.list.handleInput(data);
-    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 [""];
-    return ["Settings · changes apply immediately", ...this.list.render(Math.max(8, width))]
-      .map((line) => truncateToWidth(line, width, ""));
-  }
-}

package/src/tui/statusline.ts

@@ -1,162 +0,0 @@
-/**
- * Footer: pi's two-line shape, xeno's cut budget.
- *
- * Line 1 is cwd (with git branch) and session name. Line 2 is usage
- * (↑ ↓ R W CH), cost, the context gauge, and the model. The gauge's
- * denominator is shouldCut's triggerTokens, not a model context window —
- * that number is the reason this project has a TUI at all.
- *
- * State in, string[] out. No terminal, no clock, no git.
- */
-import { isAbsolute, relative, resolve, sep } from "node:path";
-import type { Component } from "./text.ts";
-import { displayWidth } from "./width.ts";
-import { PLAIN_ATTRS, paint, type Style } from "./style.ts";
-
-export interface StatusState {
-  cwd: string;
-  branch: string | null;
-  tokens: number;
-  triggerTokens: number;
-  model: string;
-  thinking: string;
-  /**
-   * From shouldCut in apps, not inferred from the percentage. TUI must not
-   * recompute minNodeWorkTokens -- that floor lives in core.
-   */
-  cut: boolean;
-  reason: string;
-  sessionName?: string;
-  home?: string;
-  inputTokens?: number;
-  outputTokens?: number;
-  cacheRead?: number;
-  cacheWrite?: number;
-  cacheHitRate?: number;
-  cost?: number;
-  /** Follow-ups waiting; painted in the stats line so it is not truncated off a padded row. */
-  queued?: number;
-}
-
-/** Kept so /hotkeys and the queue count can still name the bindings. */
-export const STATUS_HINT = "escape interrupt · / commands · /quit · ctrl+o tools · ctrl+t think";
-
-const ELLIPSIS = "...";
-
-/**
- * Compact token counts the way pi's footer does. 30_000 → "30k" so the
- * spelling matches the number shouldCut compares.
- */
-export function formatTokens(count: number): string {
-  if (count < 1000) return count.toString();
-  if (count < 10000) return `${(count / 1000).toFixed(1)}k`;
-  if (count < 1000000) return `${Math.round(count / 1000)}k`;
-  if (count < 10000000) return `${(count / 1000000).toFixed(1)}M`;
-  return `${Math.round(count / 1000000)}M`;
-}
-
-export function formatCwdForFooter(cwd: string, home: string | undefined): string {
-  if (!home) return cwd;
-  const resolvedCwd = resolve(cwd);
-  const resolvedHome = resolve(home);
-  const relativeToHome = relative(resolvedHome, resolvedCwd);
-  const isInsideHome =
-    relativeToHome === "" ||
-    (relativeToHome !== ".." && !relativeToHome.startsWith(`..${sep}`) && !isAbsolute(relativeToHome));
-  if (!isInsideHome) return cwd;
-  return relativeToHome === "" ? "~" : `~${sep}${relativeToHome}`;
-}
-
-export function renderStatus(state: StatusState, width: number, style?: Style): string[] {
-  const w = Math.max(0, width);
-  const pwd = pwdLine(state, w);
-  const stats = statsLine(state, w);
-  const lines = [pwd, stats];
-  if (style === undefined) return lines;
-  const attrs = { ...PLAIN_ATTRS, status: true, dim: true };
-  return lines.map((line) => paint(line, attrs, style));
-}
-
-export function withStatus(body: Component, state: StatusState): Component {
-  return {
-    render(width: number): string[] {
-      return [...body.render(width), ...renderStatus(state, width)];
-    },
-  };
-}
-
-function pwdLine(state: StatusState, width: number): string {
-  let pwd = formatCwdForFooter(state.cwd, state.home);
-  if (state.branch) pwd = `${pwd} (${state.branch})`;
-  if (state.sessionName) pwd = `${pwd} • ${state.sessionName}`;
-  return truncateToWidth(pwd, width);
-}
-
-function statsLine(state: StatusState, width: number): string {
-  const parts: string[] = [];
-  if (state.inputTokens) parts.push(`↑${formatTokens(state.inputTokens)}`);
-  if (state.outputTokens) parts.push(`↓${formatTokens(state.outputTokens)}`);
-  if (state.cacheRead) parts.push(`R${formatTokens(state.cacheRead)}`);
-  if (state.cacheWrite) parts.push(`W${formatTokens(state.cacheWrite)}`);
-  if (
-    ((state.cacheRead ?? 0) > 0 || (state.cacheWrite ?? 0) > 0) &&
-    state.cacheHitRate !== undefined
-  ) {
-    parts.push(`CH${state.cacheHitRate.toFixed(1)}%`);
-  }
-  if (state.cost !== undefined && state.cost > 0) {
-    parts.push(`$${state.cost.toFixed(3)}`);
-  }
-  if (state.queued !== undefined && state.queued > 0) {
-    parts.push(`${state.queued} queued`);
-  }
-
-  // Floor, not round: 29999/30000 must not read as 100% while shouldCut
-  // is still below_trigger. Pi's shape is N%/Mk — the Mk is our trigger.
-  const trigger = state.triggerTokens;
-  const pct = trigger <= 0 ? 0 : Math.floor((100 * state.tokens) / trigger);
-  parts.push(`${pct}%/${formatTokens(trigger)}`);
-
-  let statsLeft = parts.join(" ");
-  if (displayWidth(statsLeft) > width) {
-    statsLeft = truncateToWidth(statsLeft, width);
-  }
-
-  let right = state.model;
-  if (state.thinking.length > 0) {
-    right = `${state.model} • ${state.thinking}`;
-  }
-  const leftW = displayWidth(statsLeft);
-  const rightW = displayWidth(right);
-  const minPadding = 2;
-  if (leftW + minPadding + rightW <= width) {
-    return statsLeft + " ".repeat(width - leftW - rightW) + right;
-  }
-  const availableForRight = width - leftW - minPadding;
-  if (availableForRight > 0) {
-    const truncatedRight = truncateToWidth(right, availableForRight);
-    const pad = Math.max(0, width - leftW - displayWidth(truncatedRight));
-    return statsLeft + " ".repeat(pad) + truncatedRight;
-  }
-  return statsLeft;
-}
-
-function truncateToWidth(s: string, width: number): string {
-  if (width <= 0) return "";
-  if (displayWidth(s) <= width) return s;
-  const ew = displayWidth(ELLIPSIS);
-  if (width <= ew) return takePrefix(s, width);
-  return takePrefix(s, width - ew) + ELLIPSIS;
-}
-
-function takePrefix(s: string, width: number): string {
-  let out = "";
-  let w = 0;
-  for (const ch of s) {
-    const cw = displayWidth(ch);
-    if (w + cw > width) break;
-    out += ch;
-    w += cw;
-  }
-  return out;
-}