@lardexx/arenacode 0.0.0-stage → 2.5.2

package/src/tui/theme.js

@@ -0,0 +1,246 @@
+'use strict';
+
+/**
+ * Palettes copied from opencode's bundled theme assets (packages/tui/src/theme/assets/*.json,
+ * v1.19.5) — same role names, same hex values, truecolor output.
+ *
+ * Roles: primary, secondary, accent, error, warning, success, info,
+ *        text, textMuted, background, backgroundPanel, backgroundElement,
+ *        border, borderActive, borderSubtle, diffAdded, diffRemoved
+ */
+
+const ANSI_16 = {
+  0: [0, 0, 0],
+  1: [128, 0, 0],
+  2: [0, 128, 0],
+  3: [128, 128, 0],
+  4: [0, 0, 128],
+  5: [128, 0, 128],
+  6: [0, 128, 128],
+  7: [192, 192, 192],
+  8: [128, 128, 128],
+  9: [255, 0, 0],
+  10: [0, 255, 0],
+  11: [255, 255, 0],
+  12: [0, 0, 255],
+  13: [255, 0, 255],
+  14: [0, 255, 255],
+  15: [255, 255, 255],
+};
+
+function rgb(hex) {
+  const h = String(hex).replace('#', '');
+  return [parseInt(h.slice(0, 2), 16), parseInt(h.slice(2, 4), 16), parseInt(h.slice(4, 6), 16)];
+}
+
+function toRgb(color) {
+  if (Array.isArray(color)) return color;
+  if (typeof color === 'number') return ANSI_16[color] || [255, 255, 255];
+  if (color && color.hex) return rgb(color.hex);
+  if (typeof color === 'string' && color.startsWith('#')) return rgb(color);
+  return [255, 255, 255];
+}
+
+const truecolor = process.env.COLORTERM === 'truecolor' || process.env.TERM_PROGRAM === 'iTerm.app' || true;
+
+function fgSeq(color) {
+  const [r, g, b] = toRgb(color);
+  return truecolor ? `\x1b[38;2;${r};${g};${b}m` : color256(r, g, b, false);
+}
+
+function bgSeq(color) {
+  const [r, g, b] = toRgb(color);
+  return truecolor ? `\x1b[48;2;${r};${g};${b}m` : color256(r, g, b, true);
+}
+
+function color256(r, g, b, isBg) {
+  const q = (v) => Math.round((v / 255) * 5);
+  const n = 16 + 36 * q(r) + 6 * q(g) + q(b);
+  return `\x1b[${isBg ? 48 : 38};5;${n}m`;
+}
+
+const RESET = '\x1b[0m';
+
+function mix(a, b, amount) {
+  const [r1, g1, b1] = toRgb(a);
+  const [r2, g2, b2] = toRgb(b);
+  const m = (x, y) => Math.round(x + (y - x) * amount);
+  return `#${[m(r1, r2), m(g1, g2), m(b1, b2)].map((v) => v.toString(16).padStart(2, '0')).join('')}`;
+}
+
+function makeTheme(name, c) {
+  const paintFg = (color) => (s) => `${fgSeq(color)}${s}${RESET}`;
+  const paintBg = (color) => (s) => `${bgSeq(color)}${s}${RESET}`;
+
+  const t = {
+    name,
+    c,
+
+    // text roles -------------------------------------------------------------
+    text: (s) => `${fgSeq(c.text)}${s}${RESET}`,
+    fg: (s) => `${fgSeq(c.text)}${s}${RESET}`,
+    muted: (s) => `${fgSeq(c.textMuted)}${s}${RESET}`,
+    dim: (s) => `\x1b[2m${s}\x1b[22m`,
+    primary: (s) => `${fgSeq(c.primary)}${s}${RESET}`,
+    secondary: (s) => `${fgSeq(c.secondary)}${s}${RESET}`,
+    accent: (s) => `${fgSeq(c.accent)}${s}${RESET}`,
+    accent2: (s) => `${fgSeq(c.secondary)}${s}${RESET}`,
+    ok: (s) => `${fgSeq(c.success)}${s}${RESET}`,
+    success: (s) => `${fgSeq(c.success)}${s}${RESET}`,
+    warn: (s) => `${fgSeq(c.warning)}${s}${RESET}`,
+    warning: (s) => `${fgSeq(c.warning)}${s}${RESET}`,
+    err: (s) => `${fgSeq(c.error)}${s}${RESET}`,
+    error: (s) => `${fgSeq(c.error)}${s}${RESET}`,
+    info: (s) => `${fgSeq(c.info)}${s}${RESET}`,
+    border: (s) => `${fgSeq(c.border)}${s}${RESET}`,
+    borderActive: (s) => `${fgSeq(c.borderActive)}${s}${RESET}`,
+    user: (s) => `\x1b[1m${fgSeq(c.primary)}${s}${RESET}`,
+    title: (s) => `\x1b[1m${fgSeq(c.primary)}${s}${RESET}`,
+    bold: (s) => `\x1b[1m${s}\x1b[22m`,
+    italic: (s) => `\x1b[3m${s}\x1b[23m`,
+    strike: (s) => `\x1b[9m${s}\x1b[29m`,
+    inverse: (s) => `\x1b[7m${s}\x1b[27m`,
+    diffAdded: (s) => `${fgSeq(c.diffAdded)}${s}${RESET}`,
+    diffRemoved: (s) => `${fgSeq(c.diffRemoved)}${s}${RESET}`,
+
+    // backgrounds ------------------------------------------------------------
+    bgPanel: paintBg(c.backgroundPanel),
+    bgElement: paintBg(c.backgroundElement),
+    bgPrimary: paintBg(c.primary),
+    bgBg: paintBg(c.background),
+
+    // any role by name -------------------------------------------------------
+    fgRole(role) {
+      return paintFg(c[role] ?? c.text);
+    },
+    bgRole(role) {
+      return paintBg(c[role] ?? c.background);
+    },
+    hex: c,
+  };
+
+  /** foreground + background at once, used by the prompt box and dialogs */
+  t.both = (color, on) => (s) => `${fgSeq(color)}${bgSeq(on)}${s}${RESET}`;
+  /** selection row: primary background, background foreground (opencode's active item) */
+  t.selected = (s) => `${fgSeq(c.background)}${bgSeq(c.primary)}${s}${RESET}`;
+  /** muted selection used for group headers */
+  t.mixBorder = (amount) => mix(c.border, c.primary, amount);
+
+  return t;
+}
+
+const PALETTES = {
+  arenacode: {
+    primary: '#fab283',
+    secondary: '#5c9cf5',
+    accent: '#9d7cd8',
+    error: '#e06c75',
+    warning: '#f5a742',
+    success: '#7fd88f',
+    info: '#56b6c2',
+    text: '#eeeeee',
+    textMuted: '#808080',
+    background: '#0a0a0a',
+    backgroundPanel: '#141414',
+    backgroundElement: '#1e1e1e',
+    border: '#484848',
+    borderActive: '#606060',
+    borderSubtle: '#3c3c3c',
+    diffAdded: '#4fd6be',
+    diffRemoved: '#c53b53',
+  },
+  tokyonight: {
+    primary: '#82aaff',
+    secondary: '#c099ff',
+    accent: '#ff966c',
+    error: '#ff757f',
+    warning: '#ff966c',
+    success: '#c3e88d',
+    info: '#82aaff',
+    text: '#c8d3f5',
+    textMuted: '#828bb8',
+    background: '#1a1b26',
+    backgroundPanel: '#1e2030',
+    backgroundElement: '#222436',
+    border: '#737aa2',
+    borderActive: '#9099b2',
+    borderSubtle: '#545c7e',
+    diffAdded: '#4fd6be',
+    diffRemoved: '#c53b53',
+  },
+  catppuccin: {
+    primary: '#89b4fa',
+    secondary: '#cba6f7',
+    accent: '#f5c2e7',
+    error: '#f38ba8',
+    warning: '#f9e2af',
+    success: '#a6e3a1',
+    info: '#94e2d5',
+    text: '#cdd6f4',
+    textMuted: '#9399b2',
+    background: '#1e1e2e',
+    backgroundPanel: '#181825',
+    backgroundElement: '#11111b',
+    border: '#313244',
+    borderActive: '#45475a',
+    borderSubtle: '#585b70',
+    diffAdded: '#a6e3a1',
+    diffRemoved: '#f38ba8',
+  },
+  gruvbox: {
+    primary: '#83a598',
+    secondary: '#d3869b',
+    accent: '#8ec07c',
+    error: '#fb4934',
+    warning: '#fe8019',
+    success: '#b8bb26',
+    info: '#fabd2f',
+    text: '#ebdbb2',
+    textMuted: '#928374',
+    background: '#282828',
+    backgroundPanel: '#3c3836',
+    backgroundElement: '#504945',
+    border: '#665c54',
+    borderActive: '#ebdbb2',
+    borderSubtle: '#504945',
+    diffAdded: '#98971a',
+    diffRemoved: '#cc241d',
+  },
+  nord: {
+    primary: '#88c0d0',
+    secondary: '#81a1c1',
+    accent: '#8fbcbb',
+    error: '#bf616a',
+    warning: '#d08770',
+    success: '#a3be8c',
+    info: '#88c0d0',
+    text: '#eceff4',
+    textMuted: '#8b95a7',
+    background: '#2e3440',
+    backgroundPanel: '#3b4252',
+    backgroundElement: '#434c5e',
+    border: '#434c5e',
+    borderActive: '#4c566a',
+    borderSubtle: '#434c5e',
+    diffAdded: '#a3be8c',
+    diffRemoved: '#bf616a',
+  },
+};
+
+const THEMES = {};
+for (const [name, colors] of Object.entries(PALETTES)) THEMES[name] = makeTheme(name, colors);
+
+function themeNames() {
+  return Object.keys(THEMES);
+}
+
+function getTheme(name) {
+  return THEMES[name] || THEMES.arenacode;
+}
+
+/** opencode's `tint()`: blend `fg` towards `bg` by `amount` (used for the prompt border) */
+function tint(bgColor, fgColor, amount) {
+  return mix(bgColor, fgColor, amount);
+}
+
+module.exports = { THEMES, themeNames, getTheme, tint, mix, toRgb, fgSeq, bgSeq, RESET };

package/src/tui/widgets.js

@@ -0,0 +1,374 @@
+'use strict';
+
+/**
+ * Widgets copied from opencode's TUI (v1.19.5, packages/tui/src):
+ *
+ *   prompt box   → component/prompt/index.tsx   (left border ┃, backgroundElement fill,
+ *                                                 meta row, ╹▀▀▀ underline)
+ *   user message → routes/session/index.tsx     (left border in the agent colour, panel fill)
+ *   tool rows    → routes/session/index.tsx     (inline: 2-cell icon + text, block: panel with ┃)
+ *   footer       → feature-plugins/home/footer.tsx
+ *   tips         → feature-plugins/home/tips-view.tsx
+ */
+
+const R = require('./render');
+const { bgSeq, fgSeq, RESET, tint } = require('./theme');
+const { logoLines, LOGO_WIDTH } = require('./logo');
+
+// ------------------------------------------------------------------ helpers
+
+/** paint `text` padded to `width` cells on top of a background colour */
+function bgWrap(bg, text, width) {
+  const pad = Math.max(0, width - R.vlen(text));
+  const inner = String(text).replace(/\x1b\[0m/g, '\x1b[0m' + bg);
+  return bg + inner + ' '.repeat(pad) + RESET;
+}
+
+function spaces(n) {
+  return ' '.repeat(Math.max(0, n));
+}
+
+function padEnd(text, width) {
+  return text + spaces(width - R.vlen(text));
+}
+
+/** blocks spinner, the one opencode uses next to a running tool / prompt */
+const SPINNER_BLOCKS = ['■■■■⬝⬝⬝⬝', '■■■■■⬝⬝⬝', '⬝■■■■■⬝⬝', '⬝⬝■■■■■⬝', '⬝⬝⬝■■■■■', '⬝⬝⬝⬝■■■■', '⬝⬝⬝⬝⬝■■■', '⬝⬝⬝⬝⬝⬝■■'];
+const SPINNER_BRAILLE = ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'];
+
+function spinnerText(frame) {
+  return SPINNER_BRAILLE[frame % SPINNER_BRAILLE.length];
+}
+
+// ------------------------------------------------------------------ prompt
+
+/**
+ * The prompt box: `┃` on the left, backgroundElement fill, meta row, `╹▀▀…` underline.
+ * Returns { lines, cursor } where cursor is { row, col } relative to `lines`.
+ */
+function promptBlock(t, opts) {
+  const {
+    width,
+    input = '',
+    placeholder = '',
+    agent = 'Build',
+    agentColor = t.c.secondary,
+    model = '',
+    provider = '',
+    hints = [],
+    busy = false,
+    statusText = '',
+    frame = 0,
+    multi = '',
+  } = opts;
+
+  const innerW = Math.max(8, width - 1);
+  const bodyW = Math.max(4, innerW - 4); // 2 cells padding on each side
+  const bg = bgSeq(t.c.backgroundElement);
+  const borderPaint = (s) => `${fgSeq(agentColor)}${s}${RESET}`;
+  const hintText = hints.map(([k, label]) => `${fgSeq(t.c.text)}${k}${RESET} ${fgSeq(t.c.textMuted)}${label}${RESET}`).join('  ');
+  const lines = [];
+  let cursor = null;
+
+  const rows = textRows(input, bodyW);
+  const before = textRows(String(input).slice(0, opts.cursor ?? String(input).length), bodyW);
+  const cursorRow = { row: before.length - 1, col: R.vlen(before[before.length - 1] || '') };
+
+  // top padding row
+  lines.push(borderPaint('┃') + bgWrap(bg, '', innerW));
+
+  const showPlaceholder = !input && placeholder;
+  const displayRows = showPlaceholder ? [placeholder] : rows;
+  for (let i = 0; i < displayRows.length; i++) {
+    const content = showPlaceholder ? `${fgSeq(t.c.textMuted)}${displayRows[i]}${RESET}` : `${fgSeq(t.c.text)}${displayRows[i]}${RESET}`;
+    lines.push(borderPaint('┃') + bgWrap(bg, spaces(2) + content, innerW));
+  }
+  lines.push(borderPaint('┃') + bgWrap(bg, '', innerW));
+
+  // meta row: agent · model provider        [multi]      hints
+  const metaLeft =
+    spaces(2) +
+    `${fgSeq(agentColor)}${agent}${RESET}` +
+    (model ? ` ${fgSeq(t.c.textMuted)}·${RESET} ${fgSeq(t.c.text)}${model}${RESET}` : '') +
+    (provider ? ` ${fgSeq(t.c.textMuted)}${provider}${RESET}` : '') +
+    (multi ? ` ${fgSeq(t.c.textMuted)}${multi}${RESET}` : '');
+
+  const meta = metaLeft + spaces(Math.max(1, innerW - R.vlen(metaLeft)));
+  lines.push(borderPaint('┃') + bgWrap(bg, meta, innerW));
+
+  // underline: ╹ then half blocks in the element colour
+  lines.push(borderPaint('╹') + `${fgSeq(t.c.backgroundElement)}${'▀'.repeat(innerW)}${RESET}`);
+
+  // status row(s) under the box
+  if (busy) {
+    const spin = `${fgSeq(agentColor)}${spinnerText(frame)}${RESET}`;
+    const text = statusText ? `${spaces(1)}${fgSeq(t.c.textMuted)}${statusText}${RESET}` : '';
+    const right = `${fgSeq(t.c.text)}esc${RESET} ${fgSeq(t.c.textMuted)}interrupt${RESET}`;
+    const left = spaces(1) + spin + text;
+    lines.push(left + spaces(Math.max(1, width - R.vlen(left) - R.vlen(right) - 2)) + right);
+  } else if (hints.length) {
+    lines.push(spaces(Math.max(0, width - R.vlen(hintText) - 2)) + hintText + spaces(2));
+  }
+
+  if (showPlaceholder) cursor = null;
+  else cursor = { row: 1 + cursorRow.row, col: 3 + cursorRow.col };
+
+  return { lines, cursor };
+}
+
+/** soft-wrap the input on newlines and on the body width */
+function textRows(text, width) {
+  const out = [];
+  for (const raw of String(text).split('\n')) {
+    if (!raw.length) {
+      out.push('');
+      continue;
+    }
+    let line = '';
+    for (const word of raw.split(/(\s+)/)) {
+      if (R.vlen(line) + R.vlen(word) <= width) {
+        line += word;
+        continue;
+      }
+      if (line) out.push(line);
+      if (R.vlen(word) > width) {
+        let rest = word;
+        while (R.vlen(rest) > width) {
+          out.push(rest.slice(0, width));
+          rest = rest.slice(width);
+        }
+        line = rest;
+      } else {
+        line = word.trimStart();
+      }
+    }
+    out.push(line);
+  }
+  return out.length ? out : [''];
+}
+
+// ------------------------------------------------------------------ chat
+
+const TOOL_ICONS = {
+  terminal: '$',
+  globe: '%',
+  search: '✱',
+  eye: '→',
+  pencil: '←',
+  folder: '✱',
+  check: '✓',
+  x: '✗',
+  bolt: '⚙',
+  plan: '◈',
+};
+
+function toolIcon(name) {
+  return TOOL_ICONS[name] || '⚙';
+}
+
+/**
+ * Render the session timeline: user blocks with a left border, assistant parts
+ * indented by three cells, tool rows, thinking rows and the closing `▣` line.
+ */
+function chatLines(t, items, opts = {}) {
+  const { width, frame = 0, agent = 'Build', model = '', details = true } = opts;
+  const out = [];
+  let prevKind = null;
+
+  for (const item of items) {
+    switch (item.kind) {
+      case 'user': {
+        if (out.length) out.push('');
+        const bg = bgSeq(t.c.backgroundPanel);
+        const color = item.color || t.c.secondary;
+        const bar = `${fgSeq(color)}┃${RESET}`;
+        out.push(bar + bgWrap(bg, '', width - 1));
+        for (const line of R.wrap(item.text || '', width - 5)) {
+          out.push(bar + bgWrap(bg, spaces(2) + `${fgSeq(t.c.text)}${line}${RESET}`, width - 1));
+        }
+        if (item.files && item.files.length) {
+          const tags = item.files.map((f) => `${t.selected(` File `)}${bgSeq(t.c.backgroundElement)}${fgSeq(t.c.textMuted)} ${f} ${RESET}`).join(' ');
+          out.push(bar + bgWrap(bg, spaces(2) + tags, width - 1));
+        }
+        out.push(bar + bgWrap(bg, '', width - 1));
+        prevKind = 'user';
+        break;
+      }
+      case 'text': {
+        if (prevKind === 'user') out.push('');
+        for (const line of R.wrap(item.text || '', Math.max(10, width - 3))) {
+          out.push(spaces(3) + `${fgSeq(t.c.text)}${line}${RESET}`);
+        }
+        out.push('');
+        prevKind = 'text';
+        break;
+      }
+      case 'thought': {
+        const done = item.state === 'done';
+        const label = item.label || 'Thinking';
+        if (done) {
+          out.push(spaces(3) + `${fgSeq(t.c.warning)}- Thought${label ? `: ${label}` : ''}${item.duration ? ` · ${item.duration}` : ''}${RESET}`);
+        } else {
+          out.push(
+            spaces(3) +
+              `${fgSeq(t.c.warning)}${spinnerText(frame)} Thinking${label && label !== '…' ? `: ${label}` : ''}${RESET}`,
+          );
+        }
+        prevKind = 'thought';
+        break;
+      }
+      case 'tool': {
+        const icon = toolIcon(item.icon);
+        const running = item.state !== 'done' && item.state !== 'failed';
+        const color = item.state === 'failed' ? t.c.error : running ? t.c.text : t.c.textMuted;
+        const label = item.label || 'step';
+        const meta = item.meta ? ` (${item.meta})` : '';
+        if (item.detail && details) {
+          // block tool: left border, panel background, command then output
+          out.push('');
+          const bg = bgSeq(t.c.backgroundPanel);
+          const bar = `${fgSeq(t.c.background)}┃${RESET}`;
+          out.push(bar + bgWrap(bg, '', width - 1));
+          const head = item.command
+            ? `${fgSeq(color)}$${RESET} ${fgSeq(t.c.text)}${R.vclip(item.command, Math.max(8, width - 8))}${RESET}`
+            : `${fgSeq(color)}${icon}${RESET} ${fgSeq(t.c.text)}${label}${RESET}`;
+          out.push(bar + bgWrap(bg, spaces(2) + head + `${fgSeq(t.c.textMuted)}${meta}${RESET}`, width - 1));
+          const raw = R.strip(item.detail)
+            .split('\n')
+            .filter((line) => !/^\s*```/.test(line))
+            .filter((line, i, all) => !(i === 0 && /^(shell|bash|sh|text|json)$/i.test(line.trim())));
+          for (const line of raw.slice(0, details === 'full' ? 40 : 8)) {
+            out.push(bar + bgWrap(bg, spaces(2) + `${fgSeq(t.c.textMuted)}${R.vclip(line, width - 3)}${RESET}`, width - 1));
+          }
+        } else {
+          const head = running
+            ? `${fgSeq(t.c.text)}${label}${RESET}`
+            : `${fgSeq(t.c.textMuted)}${label}${RESET}`;
+          const iconPaint = running
+            ? `${fgSeq(t.c.text)}${spinnerText(frame)}${RESET} `
+            : `${fgSeq(item.state === 'failed' ? t.c.error : t.c.textMuted)}${icon}${RESET} `;
+          out.push(spaces(3) + iconPaint + head + `${fgSeq(t.c.textMuted)}${meta}${RESET}`);
+        }
+        prevKind = 'tool';
+        break;
+      }
+      case 'status':
+        // the bridge's own task id is chrome, not conversation: it lives in the footer
+        if (item.label && !/^task\b/i.test(item.label)) {
+          out.push(spaces(3) + `${fgSeq(t.c.textMuted)}~ ${item.label}${RESET}`);
+        }
+        break;
+      case 'system':
+        out.push(spaces(3) + `${fgSeq(t.c.textMuted)}${R.vclip(item.text || '', width - 4)}${RESET}`);
+        break;
+      case 'error':
+        out.push(spaces(3) + `${fgSeq(t.c.error)}${R.vclip(item.text || 'error', width - 4)}${RESET}`);
+        break;
+      case 'done': {
+        const tone = item.state === 'error' ? t.c.error : item.state === 'cancelled' ? t.c.textMuted : t.c.primary;
+        const secs = item.secs ? ` · ${Number(item.secs).toFixed(1)}s` : '';
+        out.push(
+          spaces(3) +
+            `${fgSeq(tone)}▣${RESET} ${fgSeq(t.c.text)}${agent}${RESET}${fgSeq(t.c.textMuted)} · ${model}${secs}${RESET}`,
+        );
+        out.push('');
+        prevKind = 'done';
+        break;
+      }
+      default:
+        if (item.text) out.push(spaces(3) + `${fgSeq(t.c.textMuted)}${item.text}${RESET}`);
+    }
+  }
+  return out;
+}
+
+// ------------------------------------------------------------------ chrome
+
+function footerLine(t, { width, left = '', right = '' }) {
+  const l = spaces(2) + `${fgSeq(t.c.textMuted)}${left}${RESET}`;
+  const r = `${fgSeq(t.c.textMuted)}${right}${RESET}` + spaces(2);
+  return l + spaces(Math.max(1, width - R.vlen(l) - R.vlen(r))) + r;
+}
+
+function tipLine(t, { width, text, command }) {
+  const body =
+    `${fgSeq(t.c.warning)}● Tip ${RESET}` +
+    `${fgSeq(t.c.textMuted)}${text}${RESET}` +
+    (command ? `${fgSeq(t.c.text)}${command}${RESET}` : '');
+  const w = R.vlen(body);
+  const left = Math.max(0, Math.floor((width - w) / 2));
+  return spaces(left) + body;
+}
+
+function notifyLine(t, { width, command, text }) {
+  const body = `${fgSeq(t.c.primary)}${command}${RESET}${fgSeq(t.c.textMuted)}${text}${RESET}`;
+  const left = Math.max(0, Math.floor((width - R.vlen(body)) / 2));
+  return spaces(left) + body;
+}
+
+function centerLines(lines, width) {
+  return lines.map((line) => {
+    const left = Math.max(0, Math.floor((width - R.vlen(line)) / 2));
+    return spaces(left) + line;
+  });
+}
+
+function homeScreen(t, opts) {
+  const { width, height, promptLines, tip, notify, footer, brand } = opts;
+  const out = [];
+  const logo = centerLines(logoLines(t), width);
+  const promptH = promptLines.length;
+  const chromeH = 1 + 1 + 1 + 1; // notify + tip + blank + footer
+  const blockH = logo.length + 1 + promptH + chromeH;
+  const top = Math.max(1, Math.floor((height - blockH) / 2));
+
+  for (let i = 0; i < top; i++) out.push('');
+  out.push(...logo);
+  out.push('');
+  if (notify) out.push(centerLines([notify], width)[0]);
+  out.push(...centerLines(promptLines, width).map((line, i) => (i === 0 ? line : line)));
+  out.push('');
+  if (tip) out.push(tip);
+  while (out.length < height - 2) out.push('');
+  out.push('');
+  out.push(footer);
+  while (out.length < height) out.push('');
+  return out.slice(0, height);
+}
+
+function sessionScreen(t, opts) {
+  const { width, height, chat, promptLines, footer, statusLine } = opts;
+  const out = [];
+  const footerH = 2;
+  const statusH = statusLine ? 1 : 0;
+  const bodyH = Math.max(1, height - promptLines.length - footerH - statusH);
+  const maxScroll = Math.max(0, chat.length - bodyH);
+  const scroll = Math.min(Math.max(0, opts.scroll || 0), maxScroll);
+  const start = Math.max(0, chat.length - bodyH - scroll);
+  const visible = chat.slice(start, start + bodyH);
+  while (visible.length < bodyH) visible.unshift('');
+  for (const line of visible) out.push(line);
+  out.push(...promptLines);
+  if (statusLine) out.push(statusLine);
+  out.push('');
+  out.push(footer);
+  return out.slice(0, height);
+}
+
+module.exports = {
+  promptBlock,
+  chatLines,
+  footerLine,
+  tipLine,
+  notifyLine,
+  homeScreen,
+  sessionScreen,
+  centerLines,
+  bgWrap,
+  spaces,
+  spinnerText,
+  SPINNER_BLOCKS,
+  toolIcon,
+  textRows,
+  LOGO_WIDTH,
+};