@pellux/goodvibes-tui 0.20.2 → 0.21.0

package/src/renderer/diff.ts

@@ -1,8 +1,18 @@
 import { TerminalBuffer } from './buffer.ts';
 import { type Cell } from '../types/grid.ts';
+import {
+  type TermColorCaps,
+  downsampleColor,
+  wrapSynced,
+} from './term-caps.ts';
 
 /**
  * DiffEngine - Generates minimal ANSI updates between two buffers.
+ *
+ * Accepts a TermColorCaps probe result so that color sequences are
+ * downsampled to the terminal's actual capability level (truecolor /
+ * ansi256 / basic16 / none), and frames are wrapped in DEC 2026
+ * synchronized-output markers when supported.
  */
 export class DiffEngine {
   private lastFg = '';
@@ -13,6 +23,19 @@ export class DiffEngine {
   private lastItalic = false;
   private lastStrikethrough = false;
   private lastLink = '';
+  private caps: TermColorCaps;
+  /**
+   * Run-coalescing state: tracks the last cell position emitted.
+   * When the next cell is at (lastEmitX+1, lastEmitY) and SGR is unchanged,
+   * we skip cursor re-addressing and append the char directly.
+   * Reset per diff() call to avoid stale state across frames.
+   */
+  private lastEmitX = -1;
+  private lastEmitY = -1;
+
+  constructor(caps: TermColorCaps = { capability: 'truecolor', syncedOutput: true }) {
+    this.caps = caps;
+  }
 
   public reset(): void {
     this.lastFg = '';
@@ -27,7 +50,10 @@ export class DiffEngine {
 
   public diff(oldBuffer: TerminalBuffer | null, newBuffer: TerminalBuffer): string {
     let output = '';
-    
+    // Reset run-coalescing state per frame: last emitted cursor position.
+    this.lastEmitX = -1;
+    this.lastEmitY = -1;
+
     for (let y = 0; y < newBuffer.height; y++) {
       // Skip rows that were not written in either the old or new buffer.
       // If neither side touched the row, both must match the prior frame:
@@ -43,9 +69,20 @@ export class DiffEngine {
         if (!newCell || newCell.char === '') continue;
 
         if (this.isCellDifferent(oldCell, newCell)) {
-          output += `\x1b[${y + 1};${x + 1}H`;
-          output += this.applyStyles(newCell);
-          output += newCell.char;
+          const sgrOutput = this.applyStyles(newCell);
+          // Run-coalescing: when the previous emitted cell was (x-1, y) and
+          // the SGR state did not change, skip cursor re-addressing.
+          // Emit a cursor move only on run breaks (new row, gap, or style change).
+          if (sgrOutput === '' && this.lastEmitY === y && this.lastEmitX === x - 1) {
+            // Contiguous run on same row, same SGR — just append the char.
+            output += newCell.char;
+          } else {
+            output += `\x1b[${y + 1};${x + 1}H`;
+            output += sgrOutput;
+            output += newCell.char;
+          }
+          this.lastEmitX = x;
+          this.lastEmitY = y;
         }
       }
     }
@@ -56,7 +93,7 @@ export class DiffEngine {
       this.lastLink = '';
     }
 
-    return output;
+    return wrapSynced(output, this.caps);
   }
 
   private isCellDifferent(a: Cell | undefined, b: Cell): boolean {
@@ -66,6 +103,13 @@ export class DiffEngine {
       (a.link ?? '') !== (b.link ?? '');
   }
 
+  /**
+   * Convert a raw color string (hex or r;g;b) to the "r;g;b" form expected
+   * by applyStyles.  For non-RGB palette indices the value is returned as-is.
+   * This mirrors the original sanitizeColor contract but is now capability-aware
+   * only in the sense of normalizing hex → "r;g;b" — downsampling happens in
+   * applyStyles via downsampleColor.
+   */
   private sanitizeColor(color: string): string {
     if (color.startsWith('#')) {
       const r = parseInt(color.slice(1, 3), 16);
@@ -77,7 +121,7 @@ export class DiffEngine {
   }
 
   private applyStyles(cell: Cell): string {
-    let style = '';
+    // Normalize hex → r;g;b (for change-detection against lastFg/lastBg)
     const fg = this.sanitizeColor(cell.fg);
     const bg = this.sanitizeColor(cell.bg);
     const link = cell.link ?? '';
@@ -87,21 +131,45 @@ export class DiffEngine {
       cell.underline !== this.lastUnderline || cell.italic !== this.lastItalic ||
       cell.strikethrough !== this.lastStrikethrough;
 
+    let style = '';
+
     if (changed) {
-      style += '\x1b[0m'; // Reset all attributes
-      if (cell.bold) style += '\x1b[1m';
-      if (cell.dim) style += '\x1b[2m';
-      if (cell.italic) style += '\x1b[3m';
-      if (cell.underline) style += '\x1b[4m';
-      if (cell.strikethrough) style += '\x1b[9m';
-
-      if (fg) {
-        const isRgb = fg.includes(';');
-        style += isRgb ? `\x1b[38;2;${fg}m` : `\x1b[38;5;${fg}m`;
+      // Reset all attributes first
+      if (this.caps.capability !== 'none') {
+        style += '\x1b[0m';
       }
-      if (bg) {
-        const isRgb = bg.includes(';');
-        style += isRgb ? `\x1b[48;2;${bg}m` : `\x1b[48;5;${bg}m`;
+
+      // Text attributes are always emitted when capability > none
+      if (this.caps.capability !== 'none') {
+        if (cell.bold) style += '\x1b[1m';
+        if (cell.dim) style += '\x1b[2m';
+        if (cell.italic) style += '\x1b[3m';
+        if (cell.underline) style += '\x1b[4m';
+        if (cell.strikethrough) style += '\x1b[9m';
+      }
+
+      // Foreground color — capability-downsampled
+      const fgOut = downsampleColor(fg, this.caps, 'fg');
+      if (fgOut !== null) {
+        if (this.caps.capability === 'basic16') {
+          // fgOut is already the numeric SGR code (e.g. "31", "92")
+          style += `\x1b[${fgOut}m`;
+        } else {
+          const isRgb = fgOut.includes(';');
+          style += isRgb ? `\x1b[38;2;${fgOut}m` : `\x1b[38;5;${fgOut}m`;
+        }
+      }
+
+      // Background color — capability-downsampled
+      const bgOut = downsampleColor(bg, this.caps, 'bg');
+      if (bgOut !== null) {
+        if (this.caps.capability === 'basic16') {
+          // bgOut is already the numeric SGR code (e.g. "41", "102")
+          style += `\x1b[${bgOut}m`;
+        } else {
+          const isRgb = bgOut.includes(';');
+          style += isRgb ? `\x1b[48;2;${bgOut}m` : `\x1b[48;5;${bgOut}m`;
+        }
       }
 
       this.lastFg = fg;
@@ -114,15 +182,20 @@ export class DiffEngine {
     }
 
     // OSC 8 hyperlink: emit open/close/change sequences only when link changes
-    if (link !== this.lastLink) {
+    // Hyperlinks are suppressed in no-color mode (dumb/no-color terminals
+    // cannot render them and the OSC sequence is just noise).
+    if (link !== this.lastLink && this.caps.capability !== 'none') {
       if (link) {
         // Open new hyperlink (close previous if any was open)
         style += `\x1b]8;;${link}\x1b\\`;
       } else {
         // Close hyperlink
-        style += `\x1b]8;;\x1b\\`;
+        style += '\x1b]8;;\x1b\\';
       }
       this.lastLink = link;
+    } else if (link !== this.lastLink) {
+      // capability === 'none': track state but emit nothing
+      this.lastLink = link;
     }
 
     return style;

package/src/renderer/markdown.ts

@@ -3,9 +3,15 @@ import { UIFactory } from './ui-factory.ts';
 import { renderCodeBlock } from './code-block.ts';
 import { getDisplayWidth } from '../utils/terminal-width.ts';
 import { LAYOUT } from './layout.ts';
+import { DARK_THEME } from './theme.ts';
+
+/** Module-level resolved token set (dark default; replace with resolveTheme(mode) when mode detection lands). */
+const T = DARK_THEME;
 
 export interface MarkdownRenderOptions {
   codeBlockLineNumbers?: boolean;
+  /** When true, suppresses tree-sitter parse scheduling for streaming code blocks. */
+  isStreaming?: boolean;
 }
 
 /** Module-level set of inline markdown special characters (hoisted out of hot loop). */
@@ -63,24 +69,31 @@ export function renderMarkdownTracked(
   let inCodeBlock = false;
   let codeBlockLang = '';
   let codeBlockLines: string[] = [];
+  let fenceChar = '`';
+  let fenceIndent = 0;
   const indent = LAYOUT.LEFT_MARGIN;
   const contentWidth = LAYOUT.contentWidth(width);
 
   for (let i = 0; i < rawLines.length; i++) {
     const raw = rawLines[i];
 
-    const fenceMatch = raw.match(/^```(\w*)/);
+    const fenceMatch = raw.match(/^(\s*)(```|~~~)\s*([\w-]*)/);
     if (fenceMatch && !inCodeBlock) {
       inCodeBlock = true;
-      codeBlockLang = fenceMatch[1] || '';
+      fenceIndent = fenceMatch[1].length;
+      fenceChar = fenceMatch[2][0]; // '`' or '~'
+      codeBlockLang = fenceMatch[3] || '';
       codeBlockLines = [];
       continue;
     }
     if (inCodeBlock) {
-      if (raw.trimStart().startsWith('```')) {
+      // Close fence: same char, same or less indentation, at least 3 of that char
+      const closeFenceRe = new RegExp(`^\\s{0,${fenceIndent}}${fenceChar === '`' ? '```' : '~~~'}`);
+      if (closeFenceRe.test(raw)) {
         const blockStart = lines.length;
         const rendered = renderCodeBlock(codeBlockLines, codeBlockLang, width, {
           showLineNumbers: options.codeBlockLineNumbers ?? true,
+          isStreaming: options.isStreaming ?? false,
         });
         codeBlocks.push({
           startOffset: blockStart,
@@ -91,6 +104,8 @@ export function renderMarkdownTracked(
         inCodeBlock = false;
         codeBlockLang = '';
         codeBlockLines = [];
+        fenceChar = '`';
+        fenceIndent = 0;
       } else {
         codeBlockLines.push(raw);
       }
@@ -106,17 +121,17 @@ export function renderMarkdownTracked(
     const h2 = raw.match(/^## (.+)/);
     const h1 = raw.match(/^# (.+)/);
     if (h1) {
-      lines.push(UIFactory.stringToLine(' '.repeat(indent) + h1[1].toUpperCase(), width, { fg: '#00ffff', bold: true }));
+      lines.push(UIFactory.stringToLine(' '.repeat(indent) + h1[1].toUpperCase(), width, { fg: T.heading1, bold: true }));
       lines.push(UIFactory.stringToLine(' '.repeat(indent) + '━'.repeat(Math.min(getDisplayWidth(h1[1]), contentWidth)), width, { fg: '244' }));
       continue;
     }
     if (h2) {
-      lines.push(UIFactory.stringToLine(' '.repeat(indent) + h2[1], width, { fg: '#00ffff', bold: true }));
+      lines.push(UIFactory.stringToLine(' '.repeat(indent) + h2[1], width, { fg: T.heading2, bold: true }));
       lines.push(UIFactory.stringToLine(' '.repeat(indent) + '─'.repeat(Math.min(getDisplayWidth(h2[1]), contentWidth)), width, { fg: '240' }));
       continue;
     }
     if (h3) {
-      lines.push(UIFactory.stringToLine(' '.repeat(indent) + h3[1], width, { fg: '111', bold: true }));
+      lines.push(UIFactory.stringToLine(' '.repeat(indent) + h3[1], width, { fg: T.heading3, bold: true }));
       continue;
     }
 
@@ -130,7 +145,7 @@ export function renderMarkdownTracked(
       const rendered = renderInlineMarkdown(taskMatch[3]);
       const prefix = ' '.repeat(bulletX) + checkbox;
       const style = checked ? { fg: '244', strikethrough: true } : {};
-      lines.push(...compositeInlineLine(prefix, rendered, width, { fg: checked ? '#22c55e' : '252', ...style }, textStartX));
+      lines.push(...compositeInlineLine(prefix, rendered, width, { fg: checked ? T.checkboxChecked : '252', ...style }, textStartX));
       continue;
     }
 
@@ -190,6 +205,7 @@ export function renderMarkdownTracked(
     const blockStart = lines.length;
     const rendered = renderCodeBlock(codeBlockLines, codeBlockLang, width, {
       showLineNumbers: options.codeBlockLineNumbers ?? true,
+      isStreaming: options.isStreaming ?? false,
     });
     codeBlocks.push({
       startOffset: blockStart,
@@ -300,14 +316,14 @@ function renderTable(rows: string[], width: number, indent: number): Line[] {
         }
         let style: Partial<Cell> = {};
         if (token.type === 'code') {
-          style = { fg: '#ffcc00', bg: '#1a1a1a' };
+          style = { fg: T.inlineCodeFg, bold: true };
         } else if (token.type === 'link') {
-          style = { fg: '#00aaff', underline: true };
+          style = { fg: T.link, underline: true };
         } else {
           style = { ...token.style };
         }
         if (isHdr) {
-          style.fg = style.fg || '#00ffff';
+          style.fg = style.fg || T.heading1;
           style.bold = true;
         } else {
           style.fg = style.fg || '252';
@@ -320,7 +336,7 @@ function renderTable(rows: string[], width: number, indent: number): Line[] {
 
     // Pad remaining space
     while (w < maxW) {
-      cells.push(createStyledCell(' ', isHdr ? { fg: '#00ffff' } : { fg: '252' }));
+      cells.push(createStyledCell(' ', isHdr ? { fg: T.heading1 } : { fg: '252' }));
       w++;
     }
     return cells;
@@ -528,14 +544,14 @@ function compositeInlineLine(
     if (token.type === 'text') {
       for (const ch of token.text) chars.push({ char: ch, style: token.style });
     } else if (token.type === 'code') {
-      for (const ch of token.text) chars.push({ char: ch, style: { fg: '#ffcc00', bg: '#1a1a1a' } });
+      for (const ch of token.text) chars.push({ char: ch, style: { fg: T.inlineCodeFg, bold: true } });
     } else if (token.type === 'link') {
       // Resolve URL: if url is empty or relative, treat as text; if it's a file path, use file:// protocol
       let resolvedUrl = token.url;
       if (resolvedUrl && !resolvedUrl.startsWith('http') && !resolvedUrl.startsWith('file://') && resolvedUrl.startsWith('/')) {
         resolvedUrl = `file://${resolvedUrl}`;
       }
-      for (const ch of token.text) chars.push({ char: ch, style: { fg: '#00aaff', underline: true, link: resolvedUrl || undefined } });
+      for (const ch of token.text) chars.push({ char: ch, style: { fg: T.link, underline: true, link: resolvedUrl || undefined } });
     }
   }
 

package/src/renderer/settings-modal-helpers.ts

@@ -111,7 +111,7 @@ export const SETTING_LABELS: Partial<Record<string, string>> = {
   'ui.systemMessages': 'System Message Target',
   'ui.operationalMessages': 'Operational Message Target',
   'ui.wrfcMessages': 'WRFC Message Target',
-  'ui.voiceEnabled': 'Voice Surface',
+  'ui.voiceEnabled': 'Always Speak',
   'behavior.autoCompactThreshold': 'Auto-Compact %',
   'behavior.staleContextWarnings': 'Context Warnings',
   'behavior.returnContextMode': 'Return Context',

package/src/renderer/settings-modal.ts

@@ -248,8 +248,8 @@ function buildSubscriptionContext(modal: SettingsModal, entry: SubscriptionEntry
   const routeReason = inferSubscriptionRouteReason(entry);
   const logout = entry.state === 'active' || entry.state === 'pending'
     ? modal.subscriptionLogoutConfirmationTarget === entry.provider
-      ? `Press Enter again to sign out ${entry.provider}. Move selection or close config to cancel.`
-      : 'Press Enter to review sign-out for this provider session.'
+      ? `Sign out ${entry.provider}? Enter/y to confirm, n/Esc to cancel.`
+      : 'Press Enter to begin sign-out for this provider session.'
     : `Use /subscription login ${entry.provider} start to begin OAuth sign-in for this provider.`;
   return [
     entry.provider,
@@ -268,6 +268,28 @@ function buildSubscriptionContext(modal: SettingsModal, entry: SubscriptionEntry
 
 function buildContextLines(modal: SettingsModal, width: number): string[] {
   const category = modal.currentCategory;
+
+  // Search mode: show context for the selected search result, or a help blurb
+  if (modal.searchFocused) {
+    const selected = modal.getSelected();
+    const lines: string[] = ['Search Results'];
+    if (selected) {
+      lines.push(...buildSettingContext(modal, selected));
+    } else {
+      lines.push(
+        modal.searchQuery.trim().length === 0
+          ? 'Type a query to search across all settings categories.'
+          : 'No settings matched the search query.',
+      );
+    }
+    const wrapped: string[] = [];
+    for (const line of lines) {
+      if (line === '') { wrapped.push(''); continue; }
+      wrapped.push(...paddedWrapped(line, width));
+    }
+    return wrapped;
+  }
+
   const lines: string[] = [
     `${CATEGORY_LABELS[category]} configuration`,
   ];
@@ -458,7 +480,51 @@ function renderSubscriptionRows(modal: SettingsModal, width: number, height: num
   return rows.slice(0, height);
 }
 
+function renderSearchRows(modal: SettingsModal, width: number, height: number): string[] {
+  const rows: string[] = [];
+  const query = modal.searchQuery;
+  // Search-prompt row shows the current query
+  const promptRow = `/ ${query}${GLYPHS.surface.cursor}`;
+  rows.push(promptRow);
+
+  const results = modal.searchResults;
+  if (query.trim().length === 0 || results.length === 0) {
+    rows.push(query.trim().length === 0 ? 'Type to search across all categories.' : 'No results.');
+    return rows.slice(0, height);
+  }
+
+  const selectedIndex = clamp(modal.selectedIndex, 0, results.length - 1);
+  const typeWidth = 9;
+  const sourceWidth = 12;
+  const categoryWidth = 14;
+  const available = Math.max(24, width - typeWidth - sourceWidth - categoryWidth - 16);
+  const keyWidth = clamp(Math.floor(available * 0.56), 18, 52);
+  const valueWidth = Math.max(10, available - keyWidth);
+  rows.push(`  ${padDisplay('Setting', keyWidth)}  ${padDisplay('Value', valueWidth)}  ${padDisplay('Type', typeWidth)}  ${padDisplay('Category', categoryWidth)}  ${padDisplay('Source', sourceWidth)}`);
+
+  const visibleCount = Math.max(1, height - 3);
+  const window = stableWindow(results.length, selectedIndex, visibleCount);
+  if (window.start > 0) rows.push(`${GLYPHS.navigation.moreAbove} ${window.start} more result(s) above`);
+
+  for (let index = window.start; index < window.end; index += 1) {
+    const entry = results[index]!;
+    const selected = index === selectedIndex;
+    const marker = selected ? GLYPHS.navigation.selected : entry.isDefault ? ' ' : '◇';
+    const value = currentSettingValue(modal, entry, selected);
+    const source = `${entry.effectiveSource ?? 'default'}${entry.locked ? ' locked' : ''}${entry.conflict ? ' conflict' : ''}`;
+    const label = getSettingLabel(entry);
+    // Derive category label from setting key prefix
+    const keyPrefix = entry.setting.key.split('.')[0] ?? '';
+    const categoryLabel = CATEGORY_LABELS[keyPrefix as SettingsCategory] ?? keyPrefix;
+    rows.push(`${marker} ${padDisplay(label, keyWidth)}  ${padDisplay(value, valueWidth)}  ${padDisplay(entry.setting.type, typeWidth)}  ${padDisplay(categoryLabel, categoryWidth)}  ${padDisplay(source, sourceWidth)}`);
+  }
+
+  if (window.end < results.length) rows.push(`${GLYPHS.navigation.moreBelow} ${results.length - window.end} more result(s) below`);
+  return rows.slice(0, height);
+}
+
 function renderControlRows(modal: SettingsModal, width: number, height: number): string[] {
+  if (modal.searchFocused) return renderSearchRows(modal, width, height);
   if (modal.currentCategory === 'flags') return renderFlagRows(modal, width, height);
   if (modal.currentCategory === 'mcp') return renderMcpRows(modal, width, height);
   if (modal.currentCategory === 'subscriptions') return renderSubscriptionRows(modal, width, height);
@@ -474,12 +540,13 @@ function rowColorForSetting(modal: SettingsModal, rowText: string): string {
 }
 
 function footerText(modal: SettingsModal): string {
+  if (modal.searchFocused) return 'Search · type to filter · Up/Down navigate results · Enter select · Esc exit search';
   if (modal.editingMode) return 'Enter Confirm edit · Esc Cancel edit · text keys edit the selected field';
-  if (modal.focusPane === 'categories') return 'Focus categories · Up/Down choose · Right/Enter settings · Tab pane · Esc close';
-  if (modal.currentCategory === 'subscriptions') return 'Focus settings · Up/Down provider · Left categories · Tab pane · Enter review/sign out · Esc close';
-  if (modal.currentCategory === 'mcp') return 'Focus settings · Up/Down server · Left categories · Tab pane · Enter edit trust · Esc close';
-  if (modal.currentCategory === 'flags') return 'Focus feature flags · Up/Down flag · Left categories · Tab pane · Enter/Space toggle · Esc close';
-  return 'Focus settings · Up/Down setting · Left categories · Tab pane · Enter/Space edit/toggle · R reset · Esc close';
+  if (modal.focusPane === 'categories') return 'Focus categories · Up/Down choose · Right/Enter settings · Tab pane · / search · Esc close';
+  if (modal.currentCategory === 'subscriptions') return 'Focus settings · Up/Down provider · Left categories · Tab pane · / search · Enter review/sign out · Esc close';
+  if (modal.currentCategory === 'mcp') return 'Focus settings · Up/Down server · Left categories · Tab pane · / search · Enter edit trust · Esc close';
+  if (modal.currentCategory === 'flags') return 'Focus feature flags · Up/Down flag · Left categories · Tab pane · / search · Enter/Space toggle · Esc close';
+  return 'Focus settings · Up/Down setting · Left categories · Tab pane · / search · Enter/Space edit/toggle · R reset · Esc close';
 }
 
 export function renderSettingsModal(
@@ -523,7 +590,9 @@ export function renderSettingsModal(
     height: viewportHeight,
     title: 'Configuration Workspace / Settings',
     leftHeader: 'Categories',
-    mainHeader: `${CATEGORY_LABELS[modal.currentCategory]} (${categoryItemCount(modal, modal.currentCategory)})${notices.length > 0 ? ` · ${notices.join(' · ')}` : ''}`,
+    mainHeader: modal.searchFocused
+       ? `Search: ${modal.searchQuery || '…'} (${modal.searchResults.length} result${modal.searchResults.length === 1 ? '' : 's'})${notices.length > 0 ? ` · ${notices.join(' · ')}` : ''}`
+       : `${CATEGORY_LABELS[modal.currentCategory]} (${categoryItemCount(modal, modal.currentCategory)})${notices.length > 0 ? ` · ${notices.join(' · ')}` : ''}`,
     leftRows: categoryRows.map((row): WorkspaceRow => ({
       text: row.text,
       selected: row.selected,

package/src/renderer/syntax-highlighter.ts

@@ -466,8 +466,13 @@ export class SyntaxHighlighter {
    * If the highlight cache has a result for this code+language, returns it.
    * Otherwise, schedules an async parse in background and returns null.
    * Callers should fall back to regex-based tokenization when null is returned.
+   *
+   * @param isStreaming - When true, suppresses background parse scheduling.
+   *   The regex tokenizer serves during streaming; tree-sitter is scheduled only
+   *   when the block is finalized (isStreaming=false or omitted) to avoid ~50
+   *   wasted async parses per streamed block that thrash the FIFO cache.
    */
-  highlight(code: string, fenceTag: string): HighlightedLine[] | null {
+  highlight(code: string, fenceTag: string, isStreaming = false): HighlightedLine[] | null {
     const langId = this.fenceToLangId(fenceTag);
     if (!langId) return null; // unsupported language
 
@@ -475,8 +480,10 @@ export class SyntaxHighlighter {
     const cached = this.cache.get(key);
     if (cached) return cached;
 
-    // Schedule background parse if not already pending
-    if (!this.pending.has(key)) {
+    // Do not schedule background parse while the block is still being streamed.
+    // The regex tokenizer serves during streaming (as designed). Schedule parse
+    // only when isStreaming=false, i.e., the block has been finalized.
+    if (!isStreaming && !this.pending.has(key)) {
       this.scheduleParse(code, langId, key);
     }