jeo-code 0.1.0

package/src/tui/components/footer.ts

@@ -0,0 +1,95 @@
+import {
+  stageIndexForStep,
+
+  overallProgress,
+  nextStageName,
+  stepsToNextStage,
+  evolutionTrack,
+  EVOLUTION_STAGE_COUNT,
+} from "./evolution";
+
+export interface FooterData {
+  model: string;
+  provider?: string;
+  step?: number;
+  maxSteps?: number;
+  elapsedMs?: number;
+  sessionId?: string;
+  /** Append a compact evolution-stage tag (default true when step+maxSteps known). */
+  showStage?: boolean;
+  /** Use ASCII track markers in the stage tag (default unicode). */
+  unicode?: boolean;
+  /** Show an estimated time-to-completion (`eta Ns`); opt-in. */
+  showEta?: boolean;
+  /** Show whole-turn evolution progress (`evo NN%`) + steps to next stage; opt-in. */
+  showProgress?: boolean;
+}
+
+export function renderFooter(d: FooterData): string {
+  const parts: string[] = [];
+  const unicode = d.unicode !== false;
+
+  // Model & Provider
+  if (d.model) {
+    if (d.provider) {
+      parts.push(`${d.model} (${d.provider})`);
+    } else {
+      parts.push(d.model);
+    }
+  }
+
+  // Step
+  if (d.step !== undefined) {
+    if (d.maxSteps !== undefined) {
+      parts.push(`step ${d.step}/${d.maxSteps}`);
+    } else {
+      parts.push(`step ${d.step}`);
+    }
+  }
+
+  // Elapsed
+  if (d.elapsedMs !== undefined) {
+    const secs = Math.round(d.elapsedMs / 1000);
+    parts.push(`${secs}s`);
+  }
+
+  // Estimated remaining time (opt-in): linear extrapolation from elapsed/step.
+  if (
+    d.showEta &&
+    d.step !== undefined &&
+    d.step > 0 &&
+    d.maxSteps !== undefined &&
+    d.step < d.maxSteps &&
+    d.elapsedMs !== undefined &&
+    d.elapsedMs > 0
+  ) {
+    const etaMs = (d.elapsedMs / d.step) * (d.maxSteps - d.step);
+    parts.push(`eta ${Math.round(etaMs / 1000)}s`);
+  }
+
+  // Whole-turn progress + countdown to the next stage (opt-in).
+  if (d.showProgress && d.step !== undefined && d.maxSteps !== undefined) {
+    const pct = Math.round(overallProgress(d.step, d.maxSteps) * 100);
+    const idx = stageIndexForStep(d.step, d.maxSteps);
+    if (idx < EVOLUTION_STAGE_COUNT - 1) {
+      const remaining = stepsToNextStage(d.step, d.maxSteps);
+      const arrow = unicode ? "\u2192" : "->";
+      parts.push(`evo ${pct}% ${arrow} ${nextStageName(d.step, d.maxSteps)} in ${remaining}`);
+    } else {
+      parts.push(`evo ${pct}%`);
+    }
+  }
+
+  // Session ID
+  if (d.sessionId) {
+    parts.push(d.sessionId.slice(0, 8));
+  }
+
+  // Compact evolution-stage tag, e.g. "●●●○○ Tool User (Homo Habilis) [3/5]".
+  if (d.showStage !== false && d.step !== undefined && d.maxSteps !== undefined) {
+    const idx = stageIndexForStep(d.step, d.maxSteps);
+    parts.push(evolutionTrack(idx, { color: true, unicode }));
+  }
+
+  return parts.join(" · ");
+}

package/src/tui/components/forge.ts

@@ -0,0 +1,167 @@
+import chalk from "chalk";
+import { BOX_ASCII, BOX_UNICODE, padLineTo, type BoxGlyphs } from "./layout";
+import { stripAnsi, visibleWidth } from "./color";
+
+export interface ForgeSummary {
+  title: string;
+  language?: string;
+  lines: string[];
+}
+
+export interface ForgeBoxOptions {
+  width?: number;
+  maxLines?: number;
+  unicode?: boolean;
+  paint?: (s: string) => string;
+}
+
+const SECRET_VALUE_RE = /(api[_-]?key|authorization|bearer|password|secret|token)(\s*[:=]\s*)(["']?)[^"'\s,}]+/gi;
+const SECRET_JSON_RE = /("(?:api[_-]?key|authorization|password|secret|token)"\s*:\s*")[^"]+(")/gi;
+
+export function redactSecrets(input: string): string {
+  return input
+    .replace(SECRET_VALUE_RE, (_m, key: string, sep: string, quote: string) => `${key}${sep}${quote}<redacted>`)
+    .replace(SECRET_JSON_RE, "$1<redacted>$2");
+}
+
+function asRecord(value: unknown): Record<string, unknown> {
+  return value && typeof value === "object" && !Array.isArray(value) ? (value as Record<string, unknown>) : {};
+}
+
+function stringArg(args: Record<string, unknown>, ...keys: string[]): string | undefined {
+  for (const key of keys) {
+    const value = args[key];
+    if (typeof value === "string" && value.length > 0) return value;
+    if (typeof value === "number" || typeof value === "boolean") return String(value);
+  }
+  return undefined;
+}
+
+function previewLines(text: string, maxLines: number, maxChars: number): string[] {
+  const clean = redactSecrets(text.replace(/\r\n/g, "\n"));
+  const raw = clean.split("\n");
+  const out: string[] = [];
+  let used = 0;
+  for (const line of raw) {
+    if (out.length >= maxLines || used >= maxChars) break;
+    const remaining = Math.max(0, maxChars - used);
+    const next = line.length > remaining ? `${line.slice(0, Math.max(0, remaining - 1))}…` : line;
+    out.push(next);
+    used += next.length + 1;
+  }
+  if (raw.length > out.length || clean.length > used) out.push(`… ${Math.max(0, raw.length - out.length)} more line(s)`);
+  return out.length > 0 ? out : [""];
+}
+
+function jsonPreview(args: Record<string, unknown>): string[] {
+  try {
+    return previewLines(JSON.stringify(args, null, 2), 6, 500);
+  } catch {
+    return ["<unrenderable arguments>"];
+  }
+}
+
+export function summarizeForgeInvocation(tool: string, rawArgs: unknown): ForgeSummary {
+  const args = asRecord(rawArgs);
+  const normalized = tool.toLowerCase();
+  if (normalized === "bash") {
+    const command = stringArg(args, "command", "cmd") ?? "";
+    const timeout = stringArg(args, "timeoutMs", "timeout");
+    const lines = [...previewLines(command, 8, 800)];
+    if (timeout) lines.unshift(`# timeoutMs: ${timeout}`);
+    return { title: "bash command", language: "bash", lines };
+  }
+
+  if (normalized === "read") {
+    const filePath = stringArg(args, "filePath", "path") ?? "<missing path>";
+    const range = stringArg(args, "lineRange", "range");
+    return {
+      title: `read ${filePath}`,
+      language: "path",
+      lines: [`path: ${filePath}`, range ? `range: ${range}` : "range: full/default preview"],
+    };
+  }
+
+  if (normalized === "write") {
+    const filePath = stringArg(args, "filePath", "path") ?? "<missing path>";
+    const content = typeof args.content === "string" ? args.content : "";
+    const lineCount = content.length === 0 ? 0 : content.split("\n").length;
+    return {
+      title: `write ${filePath}`,
+      language: "text",
+      lines: [`# ${content.length} bytes · ${lineCount} line(s) -> ${filePath}`, ...previewLines(content, 8, 800)],
+    };
+  }
+
+  if (normalized === "edit") {
+    const filePath = stringArg(args, "filePath", "path") ?? "<missing path>";
+    const editBlock = stringArg(args, "editBlock", "edit") ?? "";
+    return {
+      title: `edit ${filePath}`,
+      language: "patch",
+      lines: [`# patch -> ${filePath}`, ...previewLines(editBlock, 8, 800)],
+    };
+  }
+
+  if (normalized === "find") {
+    const pattern = stringArg(args, "globPattern", "pattern") ?? "<missing glob>";
+    return { title: "find files", language: "glob", lines: [`glob: ${pattern}`] };
+  }
+
+  if (normalized === "search") {
+    const pattern = stringArg(args, "pattern") ?? "<missing pattern>";
+    const glob = stringArg(args, "globPattern", "path") ?? "*";
+    return { title: "search content", language: "regex", lines: [`pattern: ${pattern}`, `glob: ${glob}`] };
+  }
+
+  return { title: `${tool} arguments`, language: "json", lines: jsonPreview(args) };
+}
+
+export function summarizeForgeResult(tool: string, success: boolean, output: string): ForgeSummary {
+  const status = success ? "ok" : "failed";
+  return {
+    title: `${tool} result ${status}`,
+    language: "output",
+    lines: previewLines(output || "<no output>", success ? 5 : 10, success ? 600 : 1200),
+  };
+}
+
+function wrapPlainLine(line: string, width: number): string[] {
+  const plain = stripAnsi(line);
+  if (width <= 0) return [""];
+  if (visibleWidth(line) <= width) return [line];
+  const out: string[] = [];
+  for (let i = 0; i < plain.length; i += width) out.push(plain.slice(i, i + width));
+  return out;
+}
+
+function borderGlyphs(unicode: boolean | undefined): BoxGlyphs {
+  return unicode === false ? BOX_ASCII : BOX_UNICODE;
+}
+
+export function formatForgeBox(summary: ForgeSummary, opts: ForgeBoxOptions = {}): string[] {
+  const width = Math.max(24, Math.min(120, Math.trunc(opts.width ?? 80)));
+  const maxLines = Math.max(1, Math.trunc(opts.maxLines ?? 10));
+  const glyphs = borderGlyphs(opts.unicode);
+  const paint = opts.paint ?? chalk.gray;
+  const inner = Math.max(1, width - 2);
+  const top = paint(glyphs.tl + glyphs.h.repeat(inner) + glyphs.tr);
+  const bottom = paint(glyphs.bl + glyphs.h.repeat(inner) + glyphs.br);
+  const label = summary.language ? `${summary.title} · ${summary.language}` : summary.title;
+  const title = `${chalk.bold(label)}`;
+  const rendered: string[] = [top, paint(glyphs.v) + padLineTo(title, inner, "left") + paint(glyphs.v)];
+  const separator = paint(glyphs.v) + paint(glyphs.h.repeat(inner)) + paint(glyphs.v);
+  rendered.push(separator);
+
+  const content: string[] = [];
+  for (const line of summary.lines) {
+    for (const wrapped of wrapPlainLine(line, inner)) content.push(wrapped);
+  }
+  const clipped = content.slice(0, maxLines);
+  for (const line of clipped) rendered.push(paint(glyphs.v) + padLineTo(line, inner, "left") + paint(glyphs.v));
+  if (content.length > clipped.length) {
+    rendered.push(paint(glyphs.v) + padLineTo(`… ${content.length - clipped.length} hidden line(s)`, inner, "left") + paint(glyphs.v));
+  }
+  rendered.push(bottom);
+  return rendered;
+}

package/src/tui/components/index.ts

@@ -0,0 +1,7 @@
+export * from "./spinner";
+export * from "./tool-list";
+export * from "./stream";
+export * from "./footer";
+export * from "./ascii-art";
+export * from "./forge";
+export * from "./status";

package/src/tui/components/layout.ts

@@ -0,0 +1,105 @@
+/**
+ * Responsive layout helpers — fit content to the terminal's width and height.
+ *
+ * Every alignment/padding decision is based on the *visible* width (ANSI escapes
+ * ignored) so colored / gradient art is centered and boxed correctly. These are
+ * pure functions over `string[]` blocks, injectable `cols`/`rows` for tests.
+ */
+import { visibleWidth } from "./color";
+
+export type HAlign = "left" | "center" | "right";
+export type VAlign = "top" | "center" | "bottom";
+
+/** Pad a single line to `width` visible columns with the given horizontal alignment. */
+export function padLineTo(line: string, width: number, align: HAlign = "left"): string {
+  const vis = visibleWidth(line);
+  if (width <= 0 || vis >= width) return line;
+  const total = width - vis;
+  if (align === "right") return " ".repeat(total) + line;
+  if (align === "center") {
+    const left = Math.floor(total / 2);
+    return " ".repeat(left) + line + " ".repeat(total - left);
+  }
+  return line + " ".repeat(total);
+}
+
+/** Align every line of a block to `width` columns (default centered). */
+export function alignBlock(lines: string[], width: number, align: HAlign = "center"): string[] {
+  return lines.map(l => padLineTo(l, width, align));
+}
+
+/** Center a block horizontally within `cols` by left-padding to its center (no right pad). */
+export function centerBlock(lines: string[], cols: number): string[] {
+  const blockWidth = Math.max(0, ...lines.map(visibleWidth));
+  if (cols <= blockWidth) return lines;
+  const left = Math.floor((cols - blockWidth) / 2);
+  const pad = " ".repeat(left);
+  return lines.map(l => pad + l);
+}
+
+/**
+ * Grow a block to exactly `rows` lines by inserting blank lines, vertically
+ * aligned. Never truncates: a block already at/over `rows` is returned as-is.
+ * `fillWidth` (visible cols) makes inserted blanks span the width for a stable
+ * background; default empty strings.
+ */
+export function padBlockToHeight(lines: string[], rows: number, align: VAlign = "top", fillWidth = 0): string[] {
+  if (rows <= 0 || lines.length >= rows) return lines;
+  const blank = fillWidth > 0 ? " ".repeat(fillWidth) : "";
+  const missing = rows - lines.length;
+  if (align === "top") return [...lines, ...Array(missing).fill(blank)];
+  if (align === "bottom") return [...Array(missing).fill(blank), ...lines];
+  const top = Math.floor(missing / 2);
+  return [...Array(top).fill(blank), ...lines, ...Array(missing - top).fill(blank)];
+}
+
+/**
+ * Compose a full-screen frame that fills `rows`: `header` sits at the top,
+ * `body` follows, and `footer` is pinned to the bottom, with blank filler
+ * between body and footer. If content already exceeds `rows`, nothing is
+ * clipped (the terminal scrolls) — the footer simply follows the body.
+ */
+export function fillScreen(header: string[], body: string[], footer: string[], rows: number): string[] {
+  const content = [...header, ...body];
+  const used = content.length + footer.length;
+  const filler = Math.max(0, rows - used);
+  return [...content, ...Array(filler).fill(""), ...footer];
+}
+
+/**
+ * Draw a single-line border box around `lines`, sized to `width` visible columns
+ * (inner content centered). `glyphs` selects unicode vs ASCII corners/edges.
+ */
+export interface BoxGlyphs {
+  tl: string;
+  tr: string;
+  bl: string;
+  br: string;
+  h: string;
+  v: string;
+}
+
+export const BOX_UNICODE: BoxGlyphs = { tl: "\u256d", tr: "\u256e", bl: "\u2570", br: "\u256f", h: "\u2500", v: "\u2502" };
+export const BOX_ASCII: BoxGlyphs = { tl: "+", tr: "+", bl: "+", br: "+", h: "-", v: "|" };
+
+export function boxBlock(
+  lines: string[],
+  width: number,
+  opts: { glyphs?: BoxGlyphs; paint?: (s: string) => string; align?: HAlign } = {},
+): string[] {
+  const g = opts.glyphs ?? BOX_UNICODE;
+  const paint = opts.paint ?? ((s: string) => s);
+  const inner = Math.max(0, width - 2);
+  const top = paint(g.tl + g.h.repeat(inner) + g.tr);
+  const bottom = paint(g.bl + g.h.repeat(inner) + g.br);
+  const mid = lines.map(l => {
+    if (l === "DIVIDER") {
+      const leftChar = g.tl === "+" ? "+" : "├";
+      const rightChar = g.tr === "+" ? "+" : "┤";
+      return paint(leftChar + g.h.repeat(inner) + rightChar);
+    }
+    const align = opts.align ?? "left";
+    return paint(g.v) + padLineTo(l, inner, align) + paint(g.v);
+  });
+  return [top, ...mid, bottom];
+}

package/src/tui/components/meter.ts

@@ -0,0 +1,61 @@
+import { meterGlyphsFor, stageIndexForRatio } from "./evolution";
+import { size } from "../terminal";
+
+export interface MeterOptions {
+  /** Use ASCII-only glyphs for terminals without unicode (default true = unicode). */
+  unicode?: boolean;
+}
+
+/** Horizontal evolutionary percent/progress meter for pipeline + doctor TUI views. */
+
+/**
+ * Render an evolutionary `[#####-----] 50%` meter. The fill/empty glyphs and
+ * color evolve through the five canonical stages as the ratio rises, so the
+ * meter shares the same visual vocabulary as the spinner and ASCII art.
+ * `value`/`max` clamp to a [0,1] ratio; `width` is the bar cell count.
+ */
+export function meter(value: number, max = 1, width?: number, opts: MeterOptions = {}): string {
+  const ratio = max <= 0 ? 0 : Math.max(0, Math.min(1, value / max));
+  const cells = width !== undefined ? Math.max(0, Math.trunc(width)) : Math.max(10, Math.min(40, size().cols - 30));
+  const filledCount = Math.round(ratio * cells);
+  const { fill, empty, color } = meterGlyphsFor(stageIndexForRatio(ratio), opts.unicode !== false);
+  const bar = color(fill.repeat(filledCount)) + empty.repeat(cells - filledCount);
+  return `[${bar}] ${Math.round(ratio * 100)}%`;
+}
+
+/** Render a `3/10` step counter with a trailing meter. Guards a non-positive total. */
+export function stepMeter(step: number, total: number, width?: number): string {
+  const safeTotal = total > 0 ? total : 0;
+  return `${step}/${safeTotal} ${meter(step, safeTotal, width)}`;
+}
+
+/** Render a labeled meter, e.g. `tokens [#####-----] 50%`. Empty label → bare meter. */
+export function meterLabeled(label: string, value: number, max = 1, width?: number): string {
+  const bar = meter(value, max, width);
+  return label ? `${label} ${bar}` : bar;
+}
+
+const SPARK_UNICODE = ["\u2581", "\u2582", "\u2583", "\u2584", "\u2585", "\u2586", "\u2587", "\u2588"];
+const SPARK_ASCII = ["_", ".", ",", "-", "=", "+", "*", "#"];
+
+/**
+ * Render a compact sparkline from a series of values, e.g. `▁▂▃▅▇`. Values are
+ * normalized against the series max (or `opts.max`). Empty / all-equal series
+ * are handled (flat low bar). `opts.unicode:false` uses an ASCII ramp.
+ */
+export function sparkline(values: number[], opts: { unicode?: boolean; max?: number } = {}): string {
+  const ramp = opts.unicode === false ? SPARK_ASCII : SPARK_UNICODE;
+  const finite = values.filter(v => Number.isFinite(v));
+  if (finite.length === 0) return "";
+  const hi = opts.max ?? Math.max(...finite);
+  const lo = Math.min(...finite);
+  const span = hi - lo;
+  const last = ramp.length - 1;
+  return finite
+    .map(v => {
+      if (span <= 0) return ramp[0]!;
+      const t = (v - lo) / span;
+      return ramp[Math.max(0, Math.min(last, Math.round(t * last)))]!;
+    })
+    .join("");
+}

package/src/tui/components/model-picker.ts

@@ -0,0 +1,82 @@
+/**
+ * Model picker — turns the curated catalog + live provider readiness into a
+ * grouped, badged `SelectList` for the TUI `/model` flow. Pure builders +
+ * formatters (no I/O) so the picker is unit-testable; the interactive loop just
+ * feeds keystrokes to the `SelectList` and renders it.
+ */
+import { SelectList, renderSelectList, type SelectItem, type RenderSelectOptions } from "./select-list";
+import { catalogForProvider, type ModelCatalogEntry } from "../../ai/model-catalog-compat";
+import { PROVIDER_NAMES, type ProviderStatus } from "../../ai/provider-status";
+import type { ProviderName } from "../../ai/types";
+
+/** Human context-window size: 200000 → "200k", 1000000 → "1M", 0 → "". */
+export function formatContextWindow(tokens: number): string {
+  if (!tokens || tokens <= 0) return "";
+  if (tokens >= 1_000_000) return `${tokens / 1_000_000}M ctx`.replace(".0M", "M");
+  if (tokens >= 1_000) return `${Math.round(tokens / 1_000)}k ctx`;
+  return `${tokens} ctx`;
+}
+
+export interface ModelPickerOptions {
+  /** Use unicode badges (✓/⚡); ASCII fallback otherwise. */
+  unicode?: boolean;
+  /** Include providers with no credential (shown with a "no credential" hint). Default true. */
+  includeUnready?: boolean;
+}
+
+/** Build the right-aligned hint/badges for a catalog entry given its provider readiness. */
+export function modelHint(entry: ModelCatalogEntry, ready: boolean, unicode = true): string {
+  const parts: string[] = [];
+  const ctx = formatContextWindow(entry.contextWindow);
+  if (ctx) parts.push(ctx);
+  if (entry.reasoning) parts.push(unicode ? "\u26a1 reasoning" : "reasoning");
+  if (entry.recommended) parts.push(unicode ? "\u2605 recommended" : "recommended");
+  parts.push(ready ? (unicode ? "\u2713 ready" : "ready") : "no credential");
+  return parts.join(" \u00b7 ");
+}
+
+/**
+ * Build the model choices: every catalogued model, grouped by provider, ready
+ * providers first, recommended models first within a provider. Models whose
+ * provider has no credential are still selectable but hinted (you can pick now
+ * and add the key after).
+ */
+export function buildModelChoices(statuses: ProviderStatus[], opts: ModelPickerOptions = {}): SelectItem<string>[] {
+  const unicode = opts.unicode !== false;
+  const includeUnready = opts.includeUnready !== false;
+  const readyOf = new Map<ProviderName, boolean>(statuses.map(s => [s.name, s.ready]));
+
+  // Provider order: ready first, then the canonical order.
+  const providers = [...PROVIDER_NAMES].sort((a, b) => {
+    const ra = readyOf.get(a) ? 0 : 1;
+    const rb = readyOf.get(b) ? 0 : 1;
+    if (ra !== rb) return ra - rb;
+    return PROVIDER_NAMES.indexOf(a) - PROVIDER_NAMES.indexOf(b);
+  });
+
+  const items: SelectItem<string>[] = [];
+  for (const provider of providers) {
+    const ready = !!readyOf.get(provider);
+    if (!ready && !includeUnready) continue;
+    const group = `${provider}${ready ? "" : " (no credential)"}`;
+    for (const entry of catalogForProvider(provider)) {
+      items.push({
+        value: entry.id,
+        label: entry.id,
+        group,
+        hint: modelHint(entry, ready, unicode),
+      });
+    }
+  }
+  return items;
+}
+
+/** Construct a ready-to-drive `SelectList` of models. */
+export function modelPicker(statuses: ProviderStatus[], opts: ModelPickerOptions = {}): SelectList<string> {
+  return new SelectList(buildModelChoices(statuses, opts));
+}
+
+/** Render a model picker `SelectList` with a sensible default title. */
+export function renderModelPicker(list: SelectList<string>, opts: RenderSelectOptions = {}): string[] {
+  return renderSelectList(list, { title: "Select a model", rows: 12, ...opts });
+}

package/src/tui/components/provider-picker.ts

@@ -0,0 +1,42 @@
+/**
+ * Provider picker — turns live provider readiness into a `SelectList` for the
+ * TUI `/provider` and `joc setup` flows. Ready providers are listed first and
+ * the recommended choice is the first ready provider. Pure builders.
+ */
+import { SelectList, renderSelectList, type SelectItem, type RenderSelectOptions } from "./select-list";
+import type { ProviderStatus } from "../../ai/provider-status";
+import type { ProviderName } from "../../ai/types";
+
+/** Right-aligned hint for a provider row: credential kind + base URL + readiness. */
+export function providerHint(s: ProviderStatus, unicode = true): string {
+  const parts: string[] = [s.label];
+  if (s.baseUrl) parts.push(s.baseUrl);
+  parts.push(s.ready ? (unicode ? "\u2713 ready" : "ready") : (unicode ? "\u00b7 setup" : "setup"));
+  return parts.join(" \u00b7 ");
+}
+
+/** Build provider choices, ready providers first (stable within each group). */
+export function buildProviderChoices(statuses: ProviderStatus[], unicode = true): SelectItem<ProviderName>[] {
+  const sorted = [...statuses].sort((a, b) => (a.ready === b.ready ? 0 : a.ready ? -1 : 1));
+  return sorted.map(s => ({
+    value: s.name,
+    label: s.name,
+    group: s.ready ? "ready" : "needs setup",
+    hint: providerHint(s, unicode),
+  }));
+}
+
+/** The recommended provider: the first ready provider, or the first overall. */
+export function recommendedProvider(statuses: ProviderStatus[]): ProviderName | undefined {
+  return (statuses.find(s => s.ready) ?? statuses[0])?.name;
+}
+
+/** Construct a ready-to-drive `SelectList` of providers. */
+export function providerPicker(statuses: ProviderStatus[], unicode = true): SelectList<ProviderName> {
+  return new SelectList(buildProviderChoices(statuses, unicode));
+}
+
+/** Render a provider picker `SelectList` with a sensible default title. */
+export function renderProviderPicker(list: SelectList<ProviderName>, opts: RenderSelectOptions = {}): string[] {
+  return renderSelectList(list, { title: "Select a provider", rows: 8, ...opts });
+}