diffstalker 0.1.7 → 0.2.0

package/dist/ui/modals/ThemePicker.js

@@ -0,0 +1,107 @@
+import blessed from 'neo-blessed';
+import { themes, themeOrder, getTheme } from '../../themes.js';
+/**
+ * ThemePicker modal for selecting diff themes.
+ */
+export class ThemePicker {
+    box;
+    screen;
+    selectedIndex;
+    currentTheme;
+    onSelect;
+    onCancel;
+    constructor(screen, currentTheme, onSelect, onCancel) {
+        this.screen = screen;
+        this.currentTheme = currentTheme;
+        this.onSelect = onSelect;
+        this.onCancel = onCancel;
+        // Find current theme index
+        this.selectedIndex = themeOrder.indexOf(currentTheme);
+        if (this.selectedIndex < 0)
+            this.selectedIndex = 0;
+        // Create modal box
+        const width = 50;
+        const height = themeOrder.length + 12; // themes + header + preview + footer + borders + padding
+        this.box = blessed.box({
+            parent: screen,
+            top: 'center',
+            left: 'center',
+            width,
+            height,
+            border: {
+                type: 'line',
+            },
+            style: {
+                border: {
+                    fg: 'cyan',
+                },
+            },
+            tags: true,
+            keys: true,
+        });
+        // Setup key handlers
+        this.setupKeyHandlers();
+        // Initial render
+        this.render();
+    }
+    setupKeyHandlers() {
+        this.box.key(['escape', 'q'], () => {
+            this.close();
+            this.onCancel();
+        });
+        this.box.key(['enter', 'space'], () => {
+            const selected = themeOrder[this.selectedIndex];
+            this.close();
+            this.onSelect(selected);
+        });
+        this.box.key(['up', 'k'], () => {
+            this.selectedIndex = Math.max(0, this.selectedIndex - 1);
+            this.render();
+        });
+        this.box.key(['down', 'j'], () => {
+            this.selectedIndex = Math.min(themeOrder.length - 1, this.selectedIndex + 1);
+            this.render();
+        });
+    }
+    render() {
+        const lines = [];
+        // Header
+        lines.push('{bold}{cyan-fg}       Select Theme{/cyan-fg}{/bold}');
+        lines.push('');
+        // Theme list
+        for (let i = 0; i < themeOrder.length; i++) {
+            const themeName = themeOrder[i];
+            const theme = themes[themeName];
+            const isSelected = i === this.selectedIndex;
+            const isCurrent = themeName === this.currentTheme;
+            let line = isSelected ? '{cyan-fg}{bold}> ' : '  ';
+            line += theme.displayName;
+            if (isSelected)
+                line += '{/bold}{/cyan-fg}';
+            if (isCurrent)
+                line += ' {gray-fg}(current){/gray-fg}';
+            lines.push(line);
+        }
+        // Preview section
+        lines.push('');
+        lines.push('{gray-fg}Preview:{/gray-fg}');
+        const previewTheme = getTheme(themeOrder[this.selectedIndex]);
+        // Simple preview - just show add/del colors
+        lines.push(`  {green-fg}+ added line{/green-fg}`);
+        lines.push(`  {red-fg}- deleted line{/red-fg}`);
+        // Footer
+        lines.push('');
+        lines.push('{gray-fg}j/k: navigate | Enter: select | Esc: cancel{/gray-fg}');
+        this.box.setContent(lines.join('\n'));
+        this.screen.render();
+    }
+    close() {
+        this.box.destroy();
+    }
+    /**
+     * Focus the modal.
+     */
+    focus() {
+        this.box.focus();
+    }
+}

package/dist/ui/widgets/CommitPanel.js

@@ -0,0 +1,58 @@
+/**
+ * Format the commit panel as blessed-compatible tagged string.
+ */
+export function formatCommitPanel(state, stagedCount, width) {
+    const lines = [];
+    // Title
+    let title = '{bold}Commit Message{/bold}';
+    if (state.amend) {
+        title += ' {yellow-fg}(amending){/yellow-fg}';
+    }
+    lines.push(title);
+    lines.push('');
+    // Message input area
+    const borderChar = state.inputFocused ? '\u2502' : '\u2502';
+    const borderColor = state.inputFocused ? 'cyan' : 'gray';
+    // Top border
+    const innerWidth = Math.max(20, width - 6);
+    lines.push(`{${borderColor}-fg}\u250c${'─'.repeat(innerWidth + 2)}\u2510{/${borderColor}-fg}`);
+    // Message content (or placeholder)
+    const displayMessage = state.message || (state.inputFocused ? '' : 'Press i or Enter to edit...');
+    const messageColor = state.message ? '' : '{gray-fg}';
+    const messageEnd = state.message ? '' : '{/gray-fg}';
+    // Truncate message if needed
+    const truncatedMessage = displayMessage.length > innerWidth
+        ? displayMessage.slice(0, innerWidth - 1) + '\u2026'
+        : displayMessage.padEnd(innerWidth);
+    lines.push(`{${borderColor}-fg}${borderChar}{/${borderColor}-fg} ${messageColor}${truncatedMessage}${messageEnd} {${borderColor}-fg}${borderChar}{/${borderColor}-fg}`);
+    // Bottom border
+    lines.push(`{${borderColor}-fg}\u2514${'─'.repeat(innerWidth + 2)}\u2518{/${borderColor}-fg}`);
+    lines.push('');
+    // Amend checkbox
+    const checkbox = state.amend ? '[x]' : '[ ]';
+    const checkboxColor = state.amend ? 'green' : 'gray';
+    lines.push(`{${checkboxColor}-fg}${checkbox}{/${checkboxColor}-fg} Amend {gray-fg}(a){/gray-fg}`);
+    // Error message
+    if (state.error) {
+        lines.push('');
+        lines.push(`{red-fg}${state.error}{/red-fg}`);
+    }
+    // Committing status
+    if (state.isCommitting) {
+        lines.push('');
+        lines.push('{yellow-fg}Committing...{/yellow-fg}');
+    }
+    lines.push('');
+    // Help text
+    const helpText = state.inputFocused
+        ? 'Enter: commit | Esc: unfocus'
+        : 'i/Enter: edit | Esc: cancel | a: toggle amend';
+    lines.push(`{gray-fg}Staged: ${stagedCount} file(s) | ${helpText}{/gray-fg}`);
+    return lines.join('\n');
+}
+/**
+ * Format inactive commit panel.
+ */
+export function formatCommitPanelInactive() {
+    return "{gray-fg}Press '2' or 'c' to open commit panel{/gray-fg}";
+}

package/dist/ui/widgets/CompareListView.js

@@ -0,0 +1,216 @@
+import { formatDate } from '../../utils/formatDate.js';
+import { formatCommitDisplay } from '../../utils/commitFormat.js';
+import { shortenPath } from '../../utils/formatPath.js';
+/**
+ * Build the list of row items for the compare list view.
+ */
+export function buildCompareListRows(commits, files, commitsExpanded = true, filesExpanded = true) {
+    const result = [];
+    // Commits section
+    if (commits.length > 0) {
+        result.push({ type: 'section-header', sectionType: 'commits' });
+        if (commitsExpanded) {
+            commits.forEach((commit, i) => {
+                result.push({ type: 'commit', commitIndex: i, commit });
+            });
+        }
+    }
+    // Files section
+    if (files.length > 0) {
+        if (commits.length > 0) {
+            result.push({ type: 'spacer' });
+        }
+        result.push({ type: 'section-header', sectionType: 'files' });
+        if (filesExpanded) {
+            files.forEach((file, i) => {
+                result.push({ type: 'file', fileIndex: i, file });
+            });
+        }
+    }
+    return result;
+}
+/**
+ * Escape blessed tags in content.
+ */
+function escapeContent(content) {
+    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
+}
+/**
+ * Format a commit row.
+ */
+function formatCommitRow(commit, isSelected, isFocused, width) {
+    const isHighlighted = isSelected && isFocused;
+    const dateStr = formatDate(commit.date);
+    // Fixed parts: indent(2) + hash(7) + spaces(4) + date + parens(2)
+    const baseWidth = 2 + 7 + 4 + dateStr.length + 2;
+    const remainingWidth = Math.max(10, width - baseWidth);
+    const { displayMessage, displayRefs } = formatCommitDisplay(commit.message, commit.refs, remainingWidth);
+    let line = ' ';
+    line += `{yellow-fg}${commit.shortHash}{/yellow-fg} `;
+    if (isHighlighted) {
+        line += `{cyan-fg}{inverse}${escapeContent(displayMessage)}{/inverse}{/cyan-fg}`;
+    }
+    else {
+        line += escapeContent(displayMessage);
+    }
+    line += ` {gray-fg}(${dateStr}){/gray-fg}`;
+    if (displayRefs) {
+        line += ` {green-fg}${escapeContent(displayRefs)}{/green-fg}`;
+    }
+    return line;
+}
+/**
+ * Format a file row.
+ */
+function formatFileRow(file, isSelected, isFocused, maxPathLength) {
+    const isHighlighted = isSelected && isFocused;
+    const isUncommitted = file.isUncommitted ?? false;
+    const statusColors = {
+        added: 'green',
+        modified: 'yellow',
+        deleted: 'red',
+        renamed: 'blue',
+    };
+    const statusChars = {
+        added: 'A',
+        modified: 'M',
+        deleted: 'D',
+        renamed: 'R',
+    };
+    // Account for stats: " (+123 -456)" and possible "*" for uncommitted
+    const statsLength = 5 + String(file.additions).length + String(file.deletions).length;
+    const uncommittedLength = isUncommitted ? 14 : 0;
+    const availableForPath = Math.max(10, maxPathLength - statsLength - uncommittedLength);
+    let line = ' ';
+    if (isUncommitted) {
+        line += '{magenta-fg}{bold}*{/bold}{/magenta-fg}';
+    }
+    const statusColor = isUncommitted ? 'magenta' : statusColors[file.status];
+    line += `{${statusColor}-fg}{bold}${statusChars[file.status]}{/bold}{/${statusColor}-fg} `;
+    const displayPath = shortenPath(file.path, availableForPath);
+    if (isHighlighted) {
+        line += `{cyan-fg}{inverse}${escapeContent(displayPath)}{/inverse}{/cyan-fg}`;
+    }
+    else if (isUncommitted) {
+        line += `{magenta-fg}${escapeContent(displayPath)}{/magenta-fg}`;
+    }
+    else {
+        line += escapeContent(displayPath);
+    }
+    line += ` {gray-fg}({/gray-fg}{green-fg}+${file.additions}{/green-fg} {red-fg}-${file.deletions}{/red-fg}{gray-fg}){/gray-fg}`;
+    if (isUncommitted) {
+        line += ' {magenta-fg}[uncommitted]{/magenta-fg}';
+    }
+    return line;
+}
+/**
+ * Format the compare list view as blessed-compatible tagged string.
+ */
+export function formatCompareListView(commits, files, selectedItem, isFocused, width, scrollOffset = 0, maxHeight) {
+    if (commits.length === 0 && files.length === 0) {
+        return '{gray-fg}No changes compared to base branch{/gray-fg}';
+    }
+    const rows = buildCompareListRows(commits, files);
+    // Apply scroll offset and max height
+    const visibleRows = maxHeight
+        ? rows.slice(scrollOffset, scrollOffset + maxHeight)
+        : rows.slice(scrollOffset);
+    const lines = [];
+    for (const row of visibleRows) {
+        if (row.type === 'section-header') {
+            const isCommits = row.sectionType === 'commits';
+            const count = isCommits ? commits.length : files.length;
+            const label = isCommits ? 'Commits' : 'Files';
+            lines.push(`{cyan-fg}{bold}▼ ${label}{/bold}{/cyan-fg} {gray-fg}(${count}){/gray-fg}`);
+        }
+        else if (row.type === 'spacer') {
+            lines.push('');
+        }
+        else if (row.type === 'commit' && row.commit && row.commitIndex !== undefined) {
+            const isSelected = selectedItem?.type === 'commit' && selectedItem.index === row.commitIndex;
+            lines.push(formatCommitRow(row.commit, isSelected, isFocused, width));
+        }
+        else if (row.type === 'file' && row.file && row.fileIndex !== undefined) {
+            const isSelected = selectedItem?.type === 'file' && selectedItem.index === row.fileIndex;
+            lines.push(formatFileRow(row.file, isSelected, isFocused, width - 5));
+        }
+    }
+    return lines.join('\n');
+}
+/**
+ * Get the total number of rows in the compare list view (for scroll calculation).
+ */
+export function getCompareListTotalRows(commits, files, commitsExpanded = true, filesExpanded = true) {
+    let count = 0;
+    if (commits.length > 0) {
+        count += 1; // header
+        if (commitsExpanded)
+            count += commits.length;
+    }
+    if (files.length > 0) {
+        if (commits.length > 0)
+            count += 1; // spacer
+        count += 1; // header
+        if (filesExpanded)
+            count += files.length;
+    }
+    return count;
+}
+/**
+ * Map a row index to a selection.
+ * Returns null if the row is a header or spacer.
+ */
+export function getCompareSelectionFromRow(rowIndex, commits, files, commitsExpanded = true, filesExpanded = true) {
+    const rows = buildCompareListRows(commits, files, commitsExpanded, filesExpanded);
+    const row = rows[rowIndex];
+    if (!row)
+        return null;
+    if (row.type === 'commit' && row.commitIndex !== undefined) {
+        return { type: 'commit', index: row.commitIndex };
+    }
+    if (row.type === 'file' && row.fileIndex !== undefined) {
+        return { type: 'file', index: row.fileIndex };
+    }
+    return null;
+}
+/**
+ * Find the row index for a given selection.
+ */
+export function getRowFromCompareSelection(selection, commits, files, commitsExpanded = true, filesExpanded = true) {
+    const rows = buildCompareListRows(commits, files, commitsExpanded, filesExpanded);
+    for (let i = 0; i < rows.length; i++) {
+        const row = rows[i];
+        if (selection.type === 'commit' &&
+            row.type === 'commit' &&
+            row.commitIndex === selection.index) {
+            return i;
+        }
+        if (selection.type === 'file' && row.type === 'file' && row.fileIndex === selection.index) {
+            return i;
+        }
+    }
+    return 0;
+}
+/**
+ * Navigate to next selectable item.
+ */
+export function getNextCompareSelection(current, commits, files, direction) {
+    const rows = buildCompareListRows(commits, files);
+    // Find current row index
+    let currentRowIndex = 0;
+    if (current) {
+        currentRowIndex = getRowFromCompareSelection(current, commits, files);
+    }
+    // Find next selectable row
+    const delta = direction === 'down' ? 1 : -1;
+    let nextRowIndex = currentRowIndex + delta;
+    while (nextRowIndex >= 0 && nextRowIndex < rows.length) {
+        const selection = getCompareSelectionFromRow(nextRowIndex, commits, files);
+        if (selection) {
+            return selection;
+        }
+        nextRowIndex += delta;
+    }
+    // Stay at current if no valid next selection
+    return current;
+}

package/dist/ui/widgets/DiffView.js

@@ -0,0 +1,279 @@
+import { getTheme } from '../../themes.js';
+import { buildDiffDisplayRows, buildHistoryDisplayRows, getDisplayRowsLineNumWidth, wrapDisplayRows, } from '../../utils/displayRows.js';
+import { ansiToBlessed } from '../../utils/ansiToBlessed.js';
+import { truncateAnsi } from '../../utils/ansiTruncate.js';
+/**
+ * Truncate string to fit within maxWidth, adding ellipsis if needed.
+ */
+function truncate(str, maxWidth) {
+    if (maxWidth <= 0 || str.length <= maxWidth)
+        return str;
+    if (maxWidth <= 1)
+        return '\u2026';
+    return str.slice(0, maxWidth - 1) + '\u2026';
+}
+/**
+ * Format line number with padding.
+ */
+function formatLineNum(lineNum, width) {
+    if (lineNum === undefined)
+        return ' '.repeat(width);
+    return String(lineNum).padStart(width, ' ');
+}
+/**
+ * Escape blessed tags in content.
+ */
+function escapeContent(content) {
+    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
+}
+/**
+ * Build raw ANSI escape sequence for 24-bit RGB background.
+ */
+function ansiBg(hex) {
+    const r = parseInt(hex.slice(1, 3), 16);
+    const g = parseInt(hex.slice(3, 5), 16);
+    const b = parseInt(hex.slice(5, 7), 16);
+    return `\x1b[48;2;${r};${g};${b}m`;
+}
+/**
+ * Build raw ANSI escape sequence for 24-bit RGB foreground.
+ */
+function ansiFg(hex) {
+    const r = parseInt(hex.slice(1, 3), 16);
+    const g = parseInt(hex.slice(3, 5), 16);
+    const b = parseInt(hex.slice(5, 7), 16);
+    return `\x1b[38;2;${r};${g};${b}m`;
+}
+const ANSI_RESET = '\x1b[0m';
+/**
+ * Format a single display row as blessed-compatible tagged string.
+ */
+function formatDisplayRow(row, lineNumWidth, contentWidth, headerWidth, theme, wrapMode) {
+    const { colors } = theme;
+    switch (row.type) {
+        case 'diff-header': {
+            const content = row.content;
+            if (content.startsWith('diff --git')) {
+                const match = content.match(/diff --git a\/.+ b\/(.+)$/);
+                if (match) {
+                    const maxPathLen = headerWidth - 6;
+                    const path = truncate(match[1], maxPathLen);
+                    return `{bold}{cyan-fg}\u2500\u2500 ${path} \u2500\u2500{/cyan-fg}{/bold}`;
+                }
+            }
+            return `{gray-fg}${escapeContent(truncate(content, headerWidth))}{/gray-fg}`;
+        }
+        case 'diff-hunk': {
+            const match = row.content.match(/^@@ -(\d+)(?:,(\d+))? \+(\d+)(?:,(\d+))? @@(.*)$/);
+            if (match) {
+                const oldStart = parseInt(match[1], 10);
+                const oldCount = match[2] ? parseInt(match[2], 10) : 1;
+                const newStart = parseInt(match[3], 10);
+                const newCount = match[4] ? parseInt(match[4], 10) : 1;
+                const context = match[5].trim();
+                const oldEnd = oldStart + oldCount - 1;
+                const newEnd = newStart + newCount - 1;
+                const oldRange = oldCount === 1 ? `${oldStart}` : `${oldStart}-${oldEnd}`;
+                const newRange = newCount === 1 ? `${newStart}` : `${newStart}-${newEnd}`;
+                const rangeText = `Lines ${oldRange} \u2192 ${newRange}`;
+                const contextMaxLen = headerWidth - rangeText.length - 1;
+                const truncatedContext = context && contextMaxLen > 3 ? ' ' + truncate(context, contextMaxLen) : '';
+                return `{cyan-fg}${rangeText}{/cyan-fg}{gray-fg}${truncatedContext}{/gray-fg}`;
+            }
+            return `{cyan-fg}${escapeContent(truncate(row.content, headerWidth))}{/cyan-fg}`;
+        }
+        case 'diff-add': {
+            const isCont = row.isContinuation;
+            const symbol = isCont ? '\u00bb' : '+';
+            const lineNum = formatLineNum(row.lineNum, lineNumWidth);
+            const prefix = `${lineNum} ${symbol}  `;
+            if (theme.name.includes('ansi')) {
+                // Basic ANSI theme - use blessed tags with 16-color palette
+                const rawContent = wrapMode ? row.content || '' : truncate(row.content || '', contentWidth);
+                const visibleContent = `${prefix}${rawContent}`;
+                const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+                return `{green-bg}{white-fg}${escapeContent(paddedContent)}{/white-fg}{/green-bg}`;
+            }
+            // Use 24-bit RGB via {escape} tag
+            const bg = ansiBg(colors.addBg);
+            const highlightBg = ansiBg(colors.addHighlight);
+            const fg = ansiFg('#ffffff');
+            // Check for word-level diff segments (only in non-wrap mode or first row)
+            if (row.wordDiffSegments && !isCont) {
+                const rawContent = row.content || '';
+                // Check visible content length (not including escape codes)
+                if (!wrapMode && rawContent.length > contentWidth) {
+                    // Content too long - fall back to simple truncation without word highlighting
+                    const truncated = truncate(rawContent, contentWidth);
+                    const visibleContent = `${prefix}${truncated}`;
+                    const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+                    return `{escape}${bg}${fg}${paddedContent}${ANSI_RESET}{/escape}`;
+                }
+                // Build content with word-level highlighting
+                let contentStr = '';
+                for (const seg of row.wordDiffSegments) {
+                    if (seg.type === 'changed') {
+                        contentStr += `${highlightBg}${seg.text}${bg}`;
+                    }
+                    else {
+                        contentStr += seg.text;
+                    }
+                }
+                // Calculate padding based on visible width (prefix + rawContent)
+                const visibleWidth = prefix.length + rawContent.length;
+                const padding = ' '.repeat(Math.max(0, headerWidth - visibleWidth));
+                return `{escape}${bg}${fg}${prefix}${contentStr}${padding}${ANSI_RESET}{/escape}`;
+            }
+            // Check for syntax highlighting (when no word-diff)
+            if (row.highlighted && !isCont) {
+                const rawContent = row.content || '';
+                if (!wrapMode && rawContent.length > contentWidth) {
+                    // Too long - fall back to plain truncation
+                    const truncated = truncate(rawContent, contentWidth);
+                    const visibleContent = `${prefix}${truncated}`;
+                    const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+                    return `{escape}${bg}${fg}${paddedContent}${ANSI_RESET}{/escape}`;
+                }
+                // Use highlighted content (already has foreground colors, bg preserved)
+                const visibleWidth = prefix.length + rawContent.length;
+                const padding = ' '.repeat(Math.max(0, headerWidth - visibleWidth));
+                return `{escape}${bg}${fg}${prefix}${row.highlighted}${padding}${ANSI_RESET}{/escape}`;
+            }
+            const rawContent = wrapMode ? row.content || '' : truncate(row.content || '', contentWidth);
+            const visibleContent = `${prefix}${rawContent}`;
+            const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+            return `{escape}${bg}${fg}${paddedContent}${ANSI_RESET}{/escape}`;
+        }
+        case 'diff-del': {
+            const isCont = row.isContinuation;
+            const symbol = isCont ? '\u00bb' : '-';
+            const lineNum = formatLineNum(row.lineNum, lineNumWidth);
+            const prefix = `${lineNum} ${symbol}  `;
+            if (theme.name.includes('ansi')) {
+                // Basic ANSI theme - use blessed tags with 16-color palette
+                const rawContent = wrapMode ? row.content || '' : truncate(row.content || '', contentWidth);
+                const visibleContent = `${prefix}${rawContent}`;
+                const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+                return `{red-bg}{white-fg}${escapeContent(paddedContent)}{/white-fg}{/red-bg}`;
+            }
+            // Use 24-bit RGB via {escape} tag
+            const bg = ansiBg(colors.delBg);
+            const highlightBg = ansiBg(colors.delHighlight);
+            const fg = ansiFg('#ffffff');
+            // Check for word-level diff segments (only in non-wrap mode or first row)
+            if (row.wordDiffSegments && !isCont) {
+                const rawContent = row.content || '';
+                // Check visible content length (not including escape codes)
+                if (!wrapMode && rawContent.length > contentWidth) {
+                    // Content too long - fall back to simple truncation without word highlighting
+                    const truncated = truncate(rawContent, contentWidth);
+                    const visibleContent = `${prefix}${truncated}`;
+                    const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+                    return `{escape}${bg}${fg}${paddedContent}${ANSI_RESET}{/escape}`;
+                }
+                // Build content with word-level highlighting
+                let contentStr = '';
+                for (const seg of row.wordDiffSegments) {
+                    if (seg.type === 'changed') {
+                        contentStr += `${highlightBg}${seg.text}${bg}`;
+                    }
+                    else {
+                        contentStr += seg.text;
+                    }
+                }
+                // Calculate padding based on visible width (prefix + rawContent)
+                const visibleWidth = prefix.length + rawContent.length;
+                const padding = ' '.repeat(Math.max(0, headerWidth - visibleWidth));
+                return `{escape}${bg}${fg}${prefix}${contentStr}${padding}${ANSI_RESET}{/escape}`;
+            }
+            // Check for syntax highlighting (when no word-diff)
+            if (row.highlighted && !isCont) {
+                const rawContent = row.content || '';
+                if (!wrapMode && rawContent.length > contentWidth) {
+                    // Too long - fall back to plain truncation
+                    const truncated = truncate(rawContent, contentWidth);
+                    const visibleContent = `${prefix}${truncated}`;
+                    const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+                    return `{escape}${bg}${fg}${paddedContent}${ANSI_RESET}{/escape}`;
+                }
+                // Use highlighted content (already has foreground colors, bg preserved)
+                const visibleWidth = prefix.length + rawContent.length;
+                const padding = ' '.repeat(Math.max(0, headerWidth - visibleWidth));
+                return `{escape}${bg}${fg}${prefix}${row.highlighted}${padding}${ANSI_RESET}{/escape}`;
+            }
+            const rawContent = wrapMode ? row.content || '' : truncate(row.content || '', contentWidth);
+            const visibleContent = `${prefix}${rawContent}`;
+            const paddedContent = visibleContent.padEnd(headerWidth, ' ');
+            return `{escape}${bg}${fg}${paddedContent}${ANSI_RESET}{/escape}`;
+        }
+        case 'diff-context': {
+            const isCont = row.isContinuation;
+            const symbol = isCont ? '\u00bb' : ' ';
+            const lineNum = formatLineNum(row.lineNum, lineNumWidth);
+            const prefix = `${lineNum} ${symbol}  `;
+            const rawContent = row.content || '';
+            // Use syntax highlighting if available (not for continuations)
+            if (row.highlighted && !isCont) {
+                const truncatedHighlight = wrapMode
+                    ? row.highlighted
+                    : truncateAnsi(row.highlighted, contentWidth);
+                const highlightedContent = ansiToBlessed(truncatedHighlight);
+                return `{gray-fg}${prefix}{/gray-fg}${highlightedContent}`;
+            }
+            const content = wrapMode
+                ? escapeContent(rawContent)
+                : escapeContent(truncate(rawContent, contentWidth));
+            return `{gray-fg}${prefix}{/gray-fg}${content}`;
+        }
+        case 'commit-header':
+            return `{yellow-fg}${escapeContent(truncate(row.content, headerWidth))}{/yellow-fg}`;
+        case 'commit-message':
+            return escapeContent(truncate(row.content, headerWidth));
+        case 'spacer':
+            return '';
+    }
+}
+/**
+ * Format diff output as blessed-compatible tagged string.
+ * Returns both the content and total row count for scroll calculations.
+ */
+export function formatDiff(diff, width, scrollOffset = 0, maxHeight, themeName = 'dark', wrapMode = false) {
+    const displayRows = buildDiffDisplayRows(diff);
+    if (displayRows.length === 0) {
+        return { content: '{gray-fg}No diff to display{/gray-fg}', totalRows: 0 };
+    }
+    const theme = getTheme(themeName);
+    const lineNumWidth = getDisplayRowsLineNumWidth(displayRows);
+    const contentWidth = width - lineNumWidth - 5; // line num + space + symbol + space + padding
+    const headerWidth = width - 2;
+    // Apply wrapping if enabled
+    const wrappedRows = wrapDisplayRows(displayRows, contentWidth, wrapMode);
+    const totalRows = wrappedRows.length;
+    // Apply scroll offset and max height
+    const visibleRows = maxHeight
+        ? wrappedRows.slice(scrollOffset, scrollOffset + maxHeight)
+        : wrappedRows.slice(scrollOffset);
+    const lines = visibleRows.map((row) => formatDisplayRow(row, lineNumWidth, contentWidth, headerWidth, theme, wrapMode));
+    return { content: lines.join('\n'), totalRows };
+}
+/**
+ * Format history diff (commit metadata + diff) as blessed-compatible tagged string.
+ * Returns both the content and total row count for scroll calculations.
+ */
+export function formatHistoryDiff(commit, diff, width, scrollOffset = 0, maxHeight, themeName = 'dark', wrapMode = false) {
+    const displayRows = buildHistoryDisplayRows(commit, diff);
+    if (displayRows.length === 0) {
+        return { content: '{gray-fg}No commit selected{/gray-fg}', totalRows: 0 };
+    }
+    const theme = getTheme(themeName);
+    const lineNumWidth = getDisplayRowsLineNumWidth(displayRows);
+    const contentWidth = width - lineNumWidth - 5;
+    const headerWidth = width - 2;
+    const wrappedRows = wrapDisplayRows(displayRows, contentWidth, wrapMode);
+    const totalRows = wrappedRows.length;
+    const visibleRows = maxHeight
+        ? wrappedRows.slice(scrollOffset, scrollOffset + maxHeight)
+        : wrappedRows.slice(scrollOffset);
+    const lines = visibleRows.map((row) => formatDisplayRow(row, lineNumWidth, contentWidth, headerWidth, theme, wrapMode));
+    return { content: lines.join('\n'), totalRows };
+}