diffstalker 0.2.2 → 0.2.4

package/dist/ui/modals/RepoPicker.js

@@ -0,0 +1,109 @@
+import blessed from 'neo-blessed';
+import { abbreviateHomePath } from '../../config.js';
+/**
+ * RepoPicker modal for switching between recently-visited repositories.
+ */
+export class RepoPicker {
+    box;
+    screen;
+    repos;
+    selectedIndex;
+    currentRepo;
+    onSelect;
+    onCancel;
+    constructor(screen, repos, currentRepo, onSelect, onCancel) {
+        this.screen = screen;
+        this.repos = repos;
+        this.currentRepo = currentRepo;
+        this.onSelect = onSelect;
+        this.onCancel = onCancel;
+        // Find current repo index
+        this.selectedIndex = repos.indexOf(currentRepo);
+        if (this.selectedIndex < 0)
+            this.selectedIndex = 0;
+        // Create modal box
+        const screenWidth = screen.width;
+        const width = Math.min(70, screenWidth - 4);
+        const maxVisibleRepos = Math.min(repos.length, 15);
+        const height = maxVisibleRepos + 6; // repos + header + 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,
+            scrollable: true,
+            alwaysScroll: true,
+        });
+        // Setup key handlers
+        this.setupKeyHandlers();
+        // Initial render
+        this.render();
+    }
+    setupKeyHandlers() {
+        this.box.key(['escape'], () => {
+            this.destroy();
+            this.onCancel();
+        });
+        this.box.key(['enter', 'space'], () => {
+            const selected = this.repos[this.selectedIndex];
+            if (selected) {
+                this.destroy();
+                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(this.repos.length - 1, this.selectedIndex + 1);
+            this.render();
+        });
+    }
+    render() {
+        const lines = [];
+        // Header
+        lines.push('{bold}{cyan-fg}     Recent Repositories{/cyan-fg}{/bold}');
+        lines.push('');
+        if (this.repos.length === 0) {
+            lines.push('{gray-fg}No recent repositories{/gray-fg}');
+        }
+        else {
+            // Repo list
+            for (let i = 0; i < this.repos.length; i++) {
+                const repo = this.repos[i];
+                const isSelected = i === this.selectedIndex;
+                const isCurrent = repo === this.currentRepo;
+                let line = isSelected ? '{cyan-fg}{bold}> ' : '  ';
+                line += abbreviateHomePath(repo);
+                if (isSelected)
+                    line += '{/bold}{/cyan-fg}';
+                if (isCurrent)
+                    line += ' {gray-fg}(current){/gray-fg}';
+                lines.push(line);
+            }
+        }
+        // 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();
+    }
+    destroy() {
+        this.box.destroy();
+    }
+    focus() {
+        this.box.focus();
+    }
+}

package/dist/ui/modals/ThemePicker.js

@@ -45,13 +45,13 @@ export class ThemePicker {
         this.render();
     }
     setupKeyHandlers() {
-        this.box.key(['escape', 'q'], () => {
-            this.close();
+        this.box.key(['escape'], () => {
+            this.destroy();
             this.onCancel();
         });
         this.box.key(['enter', 'space'], () => {
             const selected = themeOrder[this.selectedIndex];
-            this.close();
+            this.destroy();
             this.onSelect(selected);
         });
         this.box.key(['up', 'k'], () => {
@@ -94,12 +94,9 @@ export class ThemePicker {
         this.box.setContent(lines.join('\n'));
         this.screen.render();
     }
-    close() {
+    destroy() {
         this.box.destroy();
     }
-    /**
-     * Focus the modal.
-     */
     focus() {
         this.box.focus();
     }

package/dist/ui/widgets/CommitPanel.js

@@ -1,7 +1,8 @@
 /**
- * Format the commit panel as blessed-compatible tagged string.
+ * Build all lines for the commit panel (used for both rendering and totalRows).
  */
-export function formatCommitPanel(state, stagedCount, width) {
+export function buildCommitPanelLines(opts) {
+    const { state, stagedCount, width, focusedZone } = opts;
     const lines = [];
     // Title
     let title = '{bold}Commit Message{/bold}';
@@ -10,9 +11,9 @@ export function formatCommitPanel(state, stagedCount, width) {
     }
     lines.push(title);
     lines.push('');
-    // Message input area
-    const borderChar = '\u2502';
-    const borderColor = state.inputFocused ? 'cyan' : 'gray';
+    // Message input area - cyan when zone-focused or input-focused
+    const messageFocused = state.inputFocused || focusedZone === 'commitMessage';
+    const borderColor = messageFocused ? 'cyan' : 'gray';
     // Top border
     const innerWidth = Math.max(20, width - 6);
     lines.push(`{${borderColor}-fg}\u250c${'─'.repeat(innerWidth + 2)}\u2510{/${borderColor}-fg}`);
@@ -24,14 +25,20 @@ export function formatCommitPanel(state, stagedCount, width) {
     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}`);
+    lines.push(`{${borderColor}-fg}\u2502{/${borderColor}-fg} ${messageColor}${truncatedMessage}${messageEnd} {${borderColor}-fg}\u2502{/${borderColor}-fg}`);
     // Bottom border
     lines.push(`{${borderColor}-fg}\u2514${'─'.repeat(innerWidth + 2)}\u2518{/${borderColor}-fg}`);
     lines.push('');
-    // Amend checkbox
+    // Amend checkbox - cyan marker when zone-focused
+    const amendFocused = focusedZone === 'commitAmend';
     const checkbox = state.amend ? '[x]' : '[ ]';
-    const checkboxColor = state.amend ? 'green' : 'gray';
-    lines.push(`{${checkboxColor}-fg}${checkbox}{/${checkboxColor}-fg} Amend {gray-fg}(a){/gray-fg}`);
+    let checkboxColor = 'gray';
+    if (amendFocused)
+        checkboxColor = 'cyan';
+    else if (state.amend)
+        checkboxColor = 'green';
+    const amendPrefix = amendFocused ? '{cyan-fg}\u25b8 {/cyan-fg}' : '  ';
+    lines.push(`${amendPrefix}{${checkboxColor}-fg}${checkbox}{/${checkboxColor}-fg} Amend {gray-fg}(a){/gray-fg}`);
     // Error message
     if (state.error) {
         lines.push('');
@@ -43,12 +50,43 @@ export function formatCommitPanel(state, stagedCount, width) {
         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';
+    // Help text - context-sensitive based on focused zone
+    let helpText;
+    if (state.inputFocused) {
+        helpText = 'Enter: commit | Ctrl+a: amend | Esc: unfocus';
+    }
+    else if (focusedZone === 'commitMessage') {
+        helpText = 'Tab: next | Space: edit | a: amend';
+    }
+    else if (focusedZone === 'commitAmend') {
+        helpText = 'Tab: next | Space: toggle | Esc: back';
+    }
+    else {
+        helpText = 'i/Enter: edit | a: amend | Esc: back';
+    }
     lines.push(`{gray-fg}Staged: ${stagedCount} file(s) | ${helpText}{/gray-fg}`);
-    return lines.join('\n');
+    return lines;
+}
+/**
+ * Get total row count for the commit panel (for scroll calculations).
+ */
+export function getCommitPanelTotalRows(opts) {
+    return buildCommitPanelLines(opts).length;
+}
+/**
+ * Format the commit panel as blessed-compatible tagged string.
+ */
+export function formatCommitPanel(state, stagedCount, width, scrollOffset = 0, visibleHeight, focusedZone) {
+    const allLines = buildCommitPanelLines({
+        state,
+        stagedCount,
+        width,
+        focusedZone,
+    });
+    if (visibleHeight && allLines.length > visibleHeight) {
+        return allLines.slice(scrollOffset, scrollOffset + visibleHeight).join('\n');
+    }
+    return allLines.join('\n');
 }
 /**
  * Format inactive commit panel.

package/dist/ui/widgets/CompareListView.js

@@ -1,17 +1,7 @@
 import { formatDate } from '../../utils/formatDate.js';
 import { formatCommitDisplay } from '../../utils/commitFormat.js';
 import { buildFileTree, flattenTree, buildTreePrefix } from '../../utils/fileTree.js';
-// ANSI escape codes for raw terminal output (avoids blessed tag escaping issues)
-const ANSI_RESET = '\x1b[0m';
-const ANSI_BOLD = '\x1b[1m';
-const ANSI_GRAY = '\x1b[90m';
-const ANSI_CYAN = '\x1b[36m';
-const ANSI_YELLOW = '\x1b[33m';
-const ANSI_GREEN = '\x1b[32m';
-const ANSI_RED = '\x1b[31m';
-const ANSI_BLUE = '\x1b[34m';
-const ANSI_MAGENTA = '\x1b[35m';
-const ANSI_INVERSE = '\x1b[7m';
+import { ANSI_RESET, ANSI_BOLD, ANSI_GRAY, ANSI_CYAN, ANSI_YELLOW, ANSI_GREEN, ANSI_RED, ANSI_BLUE, ANSI_MAGENTA, ANSI_INVERSE, } from '../../utils/ansi.js';
 /**
  * Build the list of row items for the compare list view.
  */

package/dist/ui/widgets/DiffView.js

@@ -1,14 +1,7 @@
 import { getTheme } from '../../themes.js';
 import { buildDiffDisplayRows, buildCombinedDiffDisplayRows, buildHistoryDisplayRows, getDisplayRowsLineNumWidth, wrapDisplayRows, getHunkBoundaries, } from '../../utils/displayRows.js';
 import { truncateAnsi } from '../../utils/ansiTruncate.js';
-// ANSI escape codes for raw terminal output (avoids blessed tag escaping issues)
-const ANSI_RESET = '\x1b[0m';
-const ANSI_BOLD = '\x1b[1m';
-const ANSI_GRAY = '\x1b[90m';
-const ANSI_CYAN = '\x1b[36m';
-const ANSI_GREEN = '\x1b[32m';
-const ANSI_YELLOW = '\x1b[33m';
-const ANSI_INVERSE = '\x1b[7m';
+import { ANSI_RESET, ANSI_BOLD, ANSI_GRAY, ANSI_CYAN, ANSI_GREEN, ANSI_YELLOW, ANSI_INVERSE, ansiBg, ansiFg, } from '../../utils/ansi.js';
 /**
  * Truncate string to fit within maxWidth, adding ellipsis if needed.
  */
@@ -33,24 +26,6 @@ function formatLineNum(lineNum, width) {
 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`;
-}
 /**
  * Format a diff file header row (e.g. "── path/to/file ──").
  */
@@ -166,7 +141,7 @@ function formatDisplayRow(row, lineNumWidth, contentWidth, headerWidth, theme, w
             const lineNum = formatLineNum(row.lineNum, lineNumWidth);
             const prefix = `${lineNum} ${symbol}  `;
             const rawContent = row.content || '';
-            const prefixAnsi = `\x1b[90m${prefix}\x1b[0m`;
+            const prefixAnsi = `${ANSI_GRAY}${prefix}${ANSI_RESET}`;
             if (row.highlighted && !isCont) {
                 const content = wrapMode ? row.highlighted : truncateAnsi(row.highlighted, contentWidth);
                 return `{escape}${prefixAnsi}${content}${ANSI_RESET}{/escape}`;

package/dist/ui/widgets/ExplorerContent.js

@@ -1,9 +1,6 @@
 import { buildExplorerContentRows, wrapExplorerContentRows, getExplorerContentRowCount, getExplorerContentLineNumWidth, } from '../../utils/explorerDisplayRows.js';
 import { truncateAnsi } from '../../utils/ansiTruncate.js';
-const ANSI_RESET = '\x1b[0m';
-const ANSI_GRAY = '\x1b[90m';
-const ANSI_CYAN = '\x1b[36m';
-const ANSI_YELLOW = '\x1b[33m';
+import { ANSI_RESET, ANSI_GRAY, ANSI_CYAN, ANSI_YELLOW } from '../../utils/ansi.js';
 /**
  * Format explorer file content as blessed-compatible tagged string.
  */

package/dist/ui/widgets/ExplorerView.js

@@ -1,14 +1,4 @@
-// ANSI escape codes
-const ANSI_RESET = '\x1b[0m';
-const ANSI_BOLD = '\x1b[1m';
-const ANSI_GRAY = '\x1b[90m';
-const ANSI_CYAN = '\x1b[36m';
-const ANSI_YELLOW = '\x1b[33m';
-const ANSI_GREEN = '\x1b[32m';
-const ANSI_RED = '\x1b[31m';
-const ANSI_BLUE = '\x1b[34m';
-const ANSI_MAGENTA = '\x1b[35m';
-const ANSI_INVERSE = '\x1b[7m';
+import { ANSI_RESET, ANSI_BOLD, ANSI_GRAY, ANSI_CYAN, ANSI_YELLOW, ANSI_GREEN, ANSI_RED, ANSI_BLUE, ANSI_MAGENTA, ANSI_INVERSE, } from '../../utils/ansi.js';
 /**
  * Build tree prefix characters (│ ├ └).
  */

package/dist/ui/widgets/FileList.js

@@ -1,4 +1,4 @@
-import { categorizeFiles } from '../../utils/fileCategories.js';
+import { categorizeFiles, getFileAtIndex } from '../../utils/fileCategories.js';
 import { getStatusChar, getStatusColor, formatStats, formatSelectionIndicator, formatFilePath, formatOriginalPath, } from './fileRowFormatters.js';
 /**
  * Build the list of row items for the file list.
@@ -119,13 +119,7 @@ export function formatFileList(files, selectedIndex, isFocused, width, scrollOff
 export function getFileListTotalRows(files) {
     return buildFileListRows(files).length;
 }
-/**
- * Get the file at a specific index (accounting for category ordering).
- */
-export function getFileAtIndex(files, index) {
-    const { ordered } = categorizeFiles(files);
-    return ordered[index] ?? null;
-}
+export { getFileAtIndex };
 /**
  * Get the file index from a visual row (accounting for headers and spacers).
  * Returns null if the row is a header or spacer.

package/dist/ui/widgets/Footer.js

@@ -35,6 +35,7 @@ export function formatFooter(activeTab, mouseEnabled, autoTabEnabled, wrapMode,
     if (activeTab === 'diff' && currentPane === 'diff') {
         leftContent += ' {gray-fg}n/N:hunk s:toggle{/gray-fg}';
     }
+    leftContent += ' {gray-fg}Tab:next{/gray-fg}';
     // Right side: tabs
     const tabs = [
         { key: '1', label: 'Diff', tab: 'diff' },

package/dist/ui/widgets/Header.js

@@ -38,7 +38,7 @@ function computeBranchVisibleLength(branch) {
 /**
  * Format header content as blessed-compatible tagged string.
  */
-export function formatHeader(repoPath, branch, isLoading, error, width) {
+export function formatHeader(repoPath, branch, isLoading, error, width, remoteState) {
     if (!repoPath) {
         return '{gray-fg}Waiting for target path...{/gray-fg}';
     }
@@ -55,6 +55,39 @@ export function formatHeader(repoPath, branch, isLoading, error, width) {
     else if (error) {
         leftContent += ` {red-fg}(${error}){/red-fg}`;
     }
+    // Remote operation status (shown after left content)
+    let remoteStatus = '';
+    let remoteStatusLen = 0;
+    if (remoteState) {
+        if (remoteState.inProgress && remoteState.operation) {
+            const labels = {
+                push: 'pushing...',
+                fetch: 'fetching...',
+                pull: 'rebasing...',
+                stash: 'stashing...',
+                stashPop: 'popping stash...',
+                branchSwitch: 'switching branch...',
+                branchCreate: 'creating branch...',
+                softReset: 'resetting...',
+                cherryPick: 'cherry-picking...',
+                revert: 'reverting...',
+            };
+            const label = labels[remoteState.operation] ?? '';
+            remoteStatus = ` {yellow-fg}${label}{/yellow-fg}`;
+            remoteStatusLen = 1 + label.length;
+        }
+        else if (remoteState.error) {
+            const brief = remoteState.error.length > 40
+                ? remoteState.error.slice(0, 40) + '\u2026'
+                : remoteState.error;
+            remoteStatus = ` {red-fg}${brief}{/red-fg}`;
+            remoteStatusLen = 1 + brief.length;
+        }
+        else if (remoteState.lastResult) {
+            remoteStatus = ` {green-fg}${remoteState.lastResult}{/green-fg}`;
+            remoteStatusLen = 1 + remoteState.lastResult.length;
+        }
+    }
     // Build right side content (branch info)
     const rightContent = branch ? formatBranch(branch) : '';
     if (rightContent) {
@@ -68,9 +101,10 @@ export function formatHeader(repoPath, branch, isLoading, error, width) {
         else if (error) {
             leftLen += error.length + 3; // " (error)"
         }
+        leftLen += remoteStatusLen;
         const rightLen = branch ? computeBranchVisibleLength(branch) : 0;
         const padding = Math.max(1, width - leftLen - rightLen - 2);
-        return leftContent + ' '.repeat(padding) + rightContent;
+        return leftContent + remoteStatus + ' '.repeat(padding) + rightContent;
     }
-    return leftContent;
+    return leftContent + remoteStatus;
 }

package/dist/utils/ansi.js

@@ -0,0 +1,38 @@
+/**
+ * Centralized ANSI escape code constants and helpers.
+ *
+ * All terminal color/style codes live here to avoid duplication across widgets.
+ * Terminal mode sequences (mouse mode, cursor visibility) are NOT included —
+ * those are a different concern and remain in index.ts.
+ */
+// --- SGR 3/4-bit color and style constants ---
+export const ANSI_RESET = '\x1b[0m';
+export const ANSI_BOLD = '\x1b[1m';
+export const ANSI_INVERSE = '\x1b[7m';
+export const ANSI_RED = '\x1b[31m';
+export const ANSI_GREEN = '\x1b[32m';
+export const ANSI_YELLOW = '\x1b[33m';
+export const ANSI_BLUE = '\x1b[34m';
+export const ANSI_MAGENTA = '\x1b[35m';
+export const ANSI_CYAN = '\x1b[36m';
+export const ANSI_GRAY = '\x1b[90m';
+/** Reset foreground color only (preserves background). */
+export const ANSI_FG_RESET = '\x1b[39m';
+// --- ANSI escape sequence pattern for parsing/stripping ---
+/** Matches SGR sequences like \x1b[32m, \x1b[0m, \x1b[1;34m, \x1b[48;2;30;30;30m */
+export const ANSI_PATTERN = /\x1b\[[0-9;]*m/g;
+// --- 24-bit RGB helpers ---
+/** Build ANSI escape for 24-bit RGB background from hex color (e.g. '#1e1e2e'). */
+export 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 ANSI escape for 24-bit RGB foreground from hex color (e.g. '#e0e0e0'). */
+export 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`;
+}

package/dist/utils/ansiTruncate.js

@@ -4,11 +4,7 @@
  * Truncates strings containing ANSI escape codes at a visual character limit
  * while preserving formatting up to the truncation point.
  */
-// ANSI escape sequence pattern: ESC [ ... m
-// Matches sequences like \x1b[32m, \x1b[0m, \x1b[1;34m, etc.
-const ANSI_PATTERN = /\x1b\[[0-9;]*m/g;
-// ANSI reset sequence to clear all formatting
-const ANSI_RESET = '\x1b[0m';
+import { ANSI_PATTERN, ANSI_RESET } from './ansi.js';
 /**
  * Calculate the visual length of a string (excluding ANSI codes).
  */

package/dist/utils/displayRows.js

@@ -5,21 +5,12 @@ import { isDisplayableDiffLine } from './diffFilters.js';
 import { breakLine, getLineRowCount } from './lineBreaking.js';
 import { computeWordDiff, areSimilarEnough } from './wordDiff.js';
 import { getLanguageFromPath, highlightBlockPreserveBg } from './languageDetection.js';
+import { getLineContent as extractLineContent } from './diffRowCalculations.js';
 /**
  * Get the text content from a diff line (strip leading +/-/space and control chars)
  */
 function getLineContent(line) {
-    let content;
-    if (line.type === 'addition' || line.type === 'deletion') {
-        content = line.content.slice(1);
-    }
-    else if (line.type === 'context') {
-        // Context lines start with space
-        content = line.content.startsWith(' ') ? line.content.slice(1) : line.content;
-    }
-    else {
-        content = line.content;
-    }
+    const content = extractLineContent(line);
     // Strip control characters that cause rendering artifacts
     // and convert tabs to spaces for consistent width calculation
     return content.replace(/[\x00-\x08\x0a-\x1f\x7f]/g, '').replace(/\t/g, '    ');
@@ -60,20 +51,38 @@ function extractFilePathFromHeader(content) {
     const match = content.match(/^diff --git a\/.+ b\/(.+)$/);
     return match ? match[1] : null;
 }
+/** Type guard for rows that can receive syntax highlighting. */
+function isHighlightable(row) {
+    return row.type === 'diff-add' || row.type === 'diff-del' || row.type === 'diff-context';
+}
 /**
- * Build display rows from a DiffResult.
- * Filters out non-displayable lines (index, ---, +++ headers).
- * Pairs consecutive deletions/additions within hunks and computes word-level diffs.
- * Applies block-based syntax highlighting to properly handle multi-line constructs.
+ * Pair consecutive deletions with additions and compute word-level diffs.
+ * Returns maps from pair index to word diff segments for each side.
  */
-export function buildDiffDisplayRows(diff) {
-    if (!diff)
-        return [];
-    const filteredLines = diff.lines.filter(isDisplayableDiffLine);
+function pairDeletionsAndAdditions(deletions, additions) {
+    const delSegmentsMap = new Map();
+    const addSegmentsMap = new Map();
+    const pairCount = Math.min(deletions.length, additions.length);
+    for (let j = 0; j < pairCount; j++) {
+        const delContent = getLineContent(deletions[j]);
+        const addContent = getLineContent(additions[j]);
+        if (areSimilarEnough(delContent, addContent)) {
+            const { oldSegments, newSegments } = computeWordDiff(delContent, addContent);
+            delSegmentsMap.set(j, oldSegments);
+            addSegmentsMap.set(j, newSegments);
+        }
+    }
+    return { delSegmentsMap, addSegmentsMap };
+}
+/**
+ * Build display rows from filtered diff lines in a single pass.
+ * Collects content streams per file section for later syntax highlighting.
+ * Pairs consecutive del/add lines for word-level diff computation.
+ */
+function buildRawDiffRows(filteredLines) {
     const rows = [];
     const fileSections = [];
     let currentSection = null;
-    // Phase 1: Build display rows and collect content streams per file section
     let i = 0;
     while (i < filteredLines.length) {
         const line = filteredLines[i];
@@ -134,18 +143,7 @@ export function buildDiffDisplayRows(diff) {
             i++;
         }
         // Pair deletions with additions for word-level diff
-        const delSegmentsMap = new Map();
-        const addSegmentsMap = new Map();
-        const pairCount = Math.min(deletions.length, additions.length);
-        for (let j = 0; j < pairCount; j++) {
-            const delContent = getLineContent(deletions[j]);
-            const addContent = getLineContent(additions[j]);
-            if (areSimilarEnough(delContent, addContent)) {
-                const { oldSegments, newSegments } = computeWordDiff(delContent, addContent);
-                delSegmentsMap.set(j, oldSegments);
-                addSegmentsMap.set(j, newSegments);
-            }
-        }
+        const { delSegmentsMap, addSegmentsMap } = pairDeletionsAndAdditions(deletions, additions);
         for (let j = 0; j < deletions.length; j++) {
             const delLine = deletions[j];
             const delContent = getLineContent(delLine);
@@ -182,37 +180,52 @@ export function buildDiffDisplayRows(diff) {
     if (currentSection) {
         fileSections.push(currentSection);
     }
-    // Phase 2: Apply block highlighting for each file section
+    return { rows, fileSections };
+}
+/**
+ * Highlight a content stream and map results back to display rows.
+ * Only applies highlighting to rows that match the expected types.
+ */
+function applyStreamHighlighting(rows, content, rowIndices, language, allowedTypes) {
+    if (content.length === 0)
+        return;
+    const highlighted = highlightBlockPreserveBg(content, language);
+    for (let j = 0; j < rowIndices.length; j++) {
+        const rowIndex = rowIndices[j];
+        const row = rows[rowIndex];
+        const hl = highlighted[j];
+        if (hl && isHighlightable(row) && allowedTypes.has(row.type) && hl !== row.content) {
+            row.highlighted = hl;
+        }
+    }
+}
+const OLD_STREAM_TYPES = new Set(['diff-del', 'diff-context']);
+const NEW_STREAM_TYPES = new Set(['diff-add', 'diff-context']);
+/**
+ * Apply block-based syntax highlighting to display rows.
+ * Each file section's old and new content streams are highlighted separately,
+ * then mapped back to the corresponding row indices.
+ */
+function applySyntaxHighlighting(rows, fileSections) {
     for (const section of fileSections) {
         if (!section.language)
             continue;
-        if (section.oldContent.length > 0) {
-            const oldHighlighted = highlightBlockPreserveBg(section.oldContent, section.language);
-            for (let j = 0; j < section.oldRowIndices.length; j++) {
-                const rowIndex = section.oldRowIndices[j];
-                const row = rows[rowIndex];
-                const highlighted = oldHighlighted[j];
-                if (highlighted &&
-                    highlighted !== row.content &&
-                    (row.type === 'diff-del' || row.type === 'diff-context')) {
-                    row.highlighted = highlighted;
-                }
-            }
-        }
-        if (section.newContent.length > 0) {
-            const newHighlighted = highlightBlockPreserveBg(section.newContent, section.language);
-            for (let j = 0; j < section.newRowIndices.length; j++) {
-                const rowIndex = section.newRowIndices[j];
-                const row = rows[rowIndex];
-                const highlighted = newHighlighted[j];
-                if (highlighted &&
-                    highlighted !== row.content &&
-                    (row.type === 'diff-add' || row.type === 'diff-context')) {
-                    row.highlighted = highlighted;
-                }
-            }
-        }
+        applyStreamHighlighting(rows, section.oldContent, section.oldRowIndices, section.language, OLD_STREAM_TYPES);
+        applyStreamHighlighting(rows, section.newContent, section.newRowIndices, section.language, NEW_STREAM_TYPES);
     }
+}
+/**
+ * Build display rows from a DiffResult.
+ * Filters out non-displayable lines (index, ---, +++ headers).
+ * Pairs consecutive deletions/additions within hunks and computes word-level diffs.
+ * Applies block-based syntax highlighting to properly handle multi-line constructs.
+ */
+export function buildDiffDisplayRows(diff) {
+    if (!diff)
+        return [];
+    const filteredLines = diff.lines.filter(isDisplayableDiffLine);
+    const { rows, fileSections } = buildRawDiffRows(filteredLines);
+    applySyntaxHighlighting(rows, fileSections);
     return rows;
 }
 /**

package/dist/utils/fileCategories.js

@@ -61,3 +61,10 @@ export function getIndexForCategoryPosition(files, category, categoryIndex) {
     };
     return offsets[category] + clampedIndex;
 }
+/**
+ * Get the file at a specific index (accounting for category ordering).
+ */
+export function getFileAtIndex(files, index) {
+    const { ordered } = categorizeFiles(files);
+    return ordered[index] ?? null;
+}