diffstalker 0.1.7 → 0.2.1

package/dist/ui/widgets/ExplorerView.js

@@ -0,0 +1,204 @@
+// 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';
+/**
+ * Build tree prefix characters (│ ├ └).
+ */
+function buildTreePrefix(row) {
+    let prefix = '';
+    // Add vertical lines for parent levels
+    for (let i = 0; i < row.depth; i++) {
+        if (row.parentIsLast[i]) {
+            prefix += '  '; // Parent was last, no line needed
+        }
+        else {
+            prefix += '│ '; // Parent has siblings below, draw line
+        }
+    }
+    // Add connector for this item
+    if (row.depth > 0 || row.parentIsLast.length === 0) {
+        if (row.isLast) {
+            prefix += '└ ';
+        }
+        else {
+            prefix += '├ ';
+        }
+    }
+    return prefix;
+}
+/**
+ * Get status marker for git status.
+ */
+function getStatusMarker(status) {
+    if (!status)
+        return '';
+    switch (status) {
+        case 'modified':
+            return 'M';
+        case 'added':
+            return 'A';
+        case 'deleted':
+            return 'D';
+        case 'untracked':
+            return '?';
+        case 'renamed':
+            return 'R';
+        case 'copied':
+            return 'C';
+        default:
+            return '';
+    }
+}
+/**
+ * Get color for git status.
+ */
+function getStatusColor(status) {
+    if (!status)
+        return ANSI_RESET;
+    switch (status) {
+        case 'modified':
+            return ANSI_YELLOW;
+        case 'added':
+            return ANSI_GREEN;
+        case 'deleted':
+            return ANSI_RED;
+        case 'untracked':
+            return ANSI_GRAY;
+        case 'renamed':
+            return ANSI_BLUE;
+        case 'copied':
+            return ANSI_MAGENTA;
+        default:
+            return ANSI_RESET;
+    }
+}
+/**
+ * Format the explorer tree view as blessed-compatible tagged string.
+ */
+export function formatExplorerView(displayRows, selectedIndex, isFocused, width, scrollOffset = 0, maxHeight, isLoading = false, error = null) {
+    if (error) {
+        return `{red-fg}Error: ${escapeContent(error)}{/red-fg}`;
+    }
+    if (isLoading) {
+        return '{gray-fg}Loading...{/gray-fg}';
+    }
+    if (displayRows.length === 0) {
+        return '{gray-fg}(empty directory){/gray-fg}';
+    }
+    // Apply scroll offset and max height
+    const visibleRows = maxHeight
+        ? displayRows.slice(scrollOffset, scrollOffset + maxHeight)
+        : displayRows.slice(scrollOffset);
+    const lines = [];
+    for (let i = 0; i < visibleRows.length; i++) {
+        const row = visibleRows[i];
+        const actualIndex = scrollOffset + i;
+        const isSelected = actualIndex === selectedIndex;
+        const isHighlighted = isSelected && isFocused;
+        const node = row.node;
+        // Build tree prefix
+        const prefix = buildTreePrefix(row);
+        // Directory icon (▸ collapsed, ▾ expanded)
+        let icon = '';
+        if (node.isDirectory) {
+            icon = node.expanded ? '▾ ' : '▸ ';
+        }
+        // Git status indicator
+        const statusMarker = getStatusMarker(node.gitStatus);
+        const statusColor = getStatusColor(node.gitStatus);
+        const statusDisplay = statusMarker ? `${statusColor}${statusMarker}${ANSI_RESET} ` : '';
+        // Directory status indicator (dot if has changed children)
+        const dirStatusDisplay = node.isDirectory && node.hasChangedChildren ? `${ANSI_YELLOW}●${ANSI_RESET} ` : '';
+        // Calculate available width for name
+        const prefixLen = prefix.length +
+            icon.length +
+            (statusMarker ? 2 : 0) +
+            (node.hasChangedChildren && node.isDirectory ? 2 : 0);
+        const maxNameLen = Math.max(5, width - prefixLen - 2);
+        // Display name (with trailing / for directories)
+        let displayName = node.isDirectory ? `${node.name}/` : node.name;
+        if (displayName.length > maxNameLen) {
+            displayName = displayName.slice(0, maxNameLen - 1) + '…';
+        }
+        // Build the line
+        let line = `${ANSI_GRAY}${prefix}${ANSI_RESET}`;
+        if (node.isDirectory) {
+            line += `${ANSI_BLUE}${icon}${ANSI_RESET}`;
+            line += dirStatusDisplay;
+            if (isHighlighted) {
+                line += `${ANSI_CYAN}${ANSI_BOLD}${ANSI_INVERSE}${displayName}${ANSI_RESET}`;
+            }
+            else {
+                line += `${ANSI_BLUE}${displayName}${ANSI_RESET}`;
+            }
+        }
+        else {
+            // File
+            line += statusDisplay;
+            if (isHighlighted) {
+                line += `${ANSI_CYAN}${ANSI_BOLD}${ANSI_INVERSE}${displayName}${ANSI_RESET}`;
+            }
+            else if (node.gitStatus) {
+                line += `${statusColor}${displayName}${ANSI_RESET}`;
+            }
+            else {
+                line += displayName;
+            }
+        }
+        lines.push(`{escape}${line}{/escape}`);
+    }
+    return lines.join('\n');
+}
+/**
+ * Escape blessed tags in content.
+ */
+function escapeContent(content) {
+    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
+}
+/**
+ * Build breadcrumb segments from a path.
+ * Returns segments like ["src", "components"] for "src/components"
+ */
+export function buildBreadcrumbs(currentPath) {
+    if (!currentPath)
+        return [];
+    return currentPath.split('/').filter(Boolean);
+}
+/**
+ * Format breadcrumbs for display.
+ */
+export function formatBreadcrumbs(currentPath, repoName) {
+    const segments = buildBreadcrumbs(currentPath);
+    if (segments.length === 0) {
+        return `{bold}${escapeContent(repoName)}{/bold}`;
+    }
+    const parts = [repoName, ...segments];
+    return parts
+        .map((part, i) => {
+        if (i === parts.length - 1) {
+            return `{bold}${escapeContent(part)}{/bold}`;
+        }
+        return `{gray-fg}${escapeContent(part)}{/gray-fg}`;
+    })
+        .join('{gray-fg}/{/gray-fg}');
+}
+/**
+ * Get total rows in explorer for scroll calculations.
+ */
+export function getExplorerTotalRows(displayRows) {
+    return displayRows.length;
+}
+/**
+ * Get row at index.
+ */
+export function getExplorerRowAtIndex(displayRows, index) {
+    return displayRows[index] ?? null;
+}

package/dist/ui/widgets/FileList.js

@@ -0,0 +1,185 @@
+import { categorizeFiles } from '../../utils/fileCategories.js';
+import { shortenPath } from '../../utils/formatPath.js';
+function getStatusChar(status) {
+    switch (status) {
+        case 'modified':
+            return 'M';
+        case 'added':
+            return 'A';
+        case 'deleted':
+            return 'D';
+        case 'untracked':
+            return '?';
+        case 'renamed':
+            return 'R';
+        case 'copied':
+            return 'C';
+        default:
+            return ' ';
+    }
+}
+function getStatusColor(status) {
+    switch (status) {
+        case 'modified':
+            return 'yellow';
+        case 'added':
+            return 'green';
+        case 'deleted':
+            return 'red';
+        case 'untracked':
+            return 'gray';
+        case 'renamed':
+            return 'blue';
+        case 'copied':
+            return 'cyan';
+        default:
+            return 'white';
+    }
+}
+function formatStats(insertions, deletions) {
+    if (insertions === undefined && deletions === undefined)
+        return '';
+    const parts = [];
+    if (insertions !== undefined && insertions > 0) {
+        parts.push(`{green-fg}+${insertions}{/green-fg}`);
+    }
+    if (deletions !== undefined && deletions > 0) {
+        parts.push(`{red-fg}-${deletions}{/red-fg}`);
+    }
+    return parts.length > 0 ? ' ' + parts.join(' ') : '';
+}
+/**
+ * Build the list of row items for the file list.
+ */
+export function buildFileListRows(files) {
+    const { modified, untracked, staged } = categorizeFiles(files);
+    const rows = [];
+    let currentFileIndex = 0;
+    if (modified.length > 0) {
+        rows.push({ type: 'header', content: 'Modified:', headerColor: 'yellow' });
+        modified.forEach((file) => {
+            rows.push({ type: 'file', file, fileIndex: currentFileIndex++ });
+        });
+    }
+    if (untracked.length > 0) {
+        if (modified.length > 0) {
+            rows.push({ type: 'spacer' });
+        }
+        rows.push({ type: 'header', content: 'Untracked:', headerColor: 'gray' });
+        untracked.forEach((file) => {
+            rows.push({ type: 'file', file, fileIndex: currentFileIndex++ });
+        });
+    }
+    if (staged.length > 0) {
+        if (modified.length > 0 || untracked.length > 0) {
+            rows.push({ type: 'spacer' });
+        }
+        rows.push({ type: 'header', content: 'Staged:', headerColor: 'green' });
+        staged.forEach((file) => {
+            rows.push({ type: 'file', file, fileIndex: currentFileIndex++ });
+        });
+    }
+    return rows;
+}
+/**
+ * Format the file list as blessed-compatible tagged string.
+ */
+export function formatFileList(files, selectedIndex, isFocused, width, scrollOffset = 0, maxHeight) {
+    if (files.length === 0) {
+        return '{gray-fg} No changes{/gray-fg}';
+    }
+    const rows = buildFileListRows(files);
+    const maxPathLength = width - 12; // Account for prefix chars
+    // 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 === 'header') {
+            lines.push(`{bold}{${row.headerColor}-fg}${row.content}{/${row.headerColor}-fg}{/bold}`);
+        }
+        else if (row.type === 'spacer') {
+            lines.push('');
+        }
+        else if (row.type === 'file' && row.file && row.fileIndex !== undefined) {
+            const file = row.file;
+            const isSelected = row.fileIndex === selectedIndex;
+            const isHighlighted = isSelected && isFocused;
+            const statusChar = getStatusChar(file.status);
+            const statusColor = getStatusColor(file.status);
+            const actionButton = file.staged ? '[-]' : '[+]';
+            const buttonColor = file.staged ? 'red' : 'green';
+            // Calculate available space for path
+            const stats = formatStats(file.insertions, file.deletions);
+            const statsLength = stats.replace(/\{[^}]+\}/g, '').length;
+            const availableForPath = maxPathLength - statsLength;
+            const displayPath = shortenPath(file.path, availableForPath);
+            // Build the line
+            let line = '';
+            // Selection indicator
+            if (isHighlighted) {
+                line += '{cyan-fg}{bold}\u25b8 {/bold}{/cyan-fg}';
+            }
+            else {
+                line += '  ';
+            }
+            // Action button
+            line += `{${buttonColor}-fg}${actionButton}{/${buttonColor}-fg} `;
+            // Status character
+            line += `{${statusColor}-fg}${statusChar}{/${statusColor}-fg} `;
+            // File path (with highlighting)
+            if (isHighlighted) {
+                line += `{cyan-fg}{inverse}${displayPath}{/inverse}{/cyan-fg}`;
+            }
+            else {
+                line += displayPath;
+            }
+            // Original path for renames
+            if (file.originalPath) {
+                line += ` {gray-fg}\u2190 ${shortenPath(file.originalPath, 30)}{/gray-fg}`;
+            }
+            // Stats
+            line += stats;
+            lines.push(line);
+        }
+    }
+    return lines.join('\n');
+}
+/**
+ * Get the total number of rows in the file list (for scroll calculation).
+ */
+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;
+}
+/**
+ * Get the file index from a visual row (accounting for headers and spacers).
+ * Returns null if the row is a header or spacer.
+ */
+export function getFileIndexFromRow(row, files) {
+    const rows = buildFileListRows(files);
+    const rowItem = rows[row];
+    if (rowItem?.type === 'file' && rowItem.fileIndex !== undefined) {
+        return rowItem.fileIndex;
+    }
+    return null;
+}
+/**
+ * Get the visual row index for a file index.
+ */
+export function getRowFromFileIndex(fileIndex, files) {
+    const rows = buildFileListRows(files);
+    for (let i = 0; i < rows.length; i++) {
+        if (rows[i].type === 'file' && rows[i].fileIndex === fileIndex) {
+            return i;
+        }
+    }
+    return 0;
+}

package/dist/ui/widgets/Footer.js

@@ -0,0 +1,50 @@
+/**
+ * Calculate visible length by stripping blessed tags.
+ */
+function calculateVisibleLength(content) {
+    return content.replace(/\{[^}]+\}/g, '').length;
+}
+/**
+ * Format footer content as blessed-compatible tagged string.
+ */
+export function formatFooter(activeTab, mouseEnabled, autoTabEnabled, wrapMode, followEnabled, showOnlyChanges, width) {
+    // Left side: indicators
+    let leftContent = '{gray-fg}?{/gray-fg} ';
+    leftContent += mouseEnabled
+        ? '{yellow-fg}[scroll]{/yellow-fg}'
+        : '{yellow-fg}m:[select]{/yellow-fg}';
+    leftContent += ' ';
+    leftContent += autoTabEnabled ? '{blue-fg}[auto]{/blue-fg}' : '{gray-fg}[auto]{/gray-fg}';
+    leftContent += ' ';
+    leftContent += wrapMode ? '{blue-fg}[wrap]{/blue-fg}' : '{gray-fg}[wrap]{/gray-fg}';
+    leftContent += ' ';
+    leftContent += followEnabled ? '{blue-fg}[follow]{/blue-fg}' : '{gray-fg}[follow]{/gray-fg}';
+    if (activeTab === 'explorer') {
+        leftContent += ' ';
+        leftContent += showOnlyChanges
+            ? '{blue-fg}[changes]{/blue-fg}'
+            : '{gray-fg}[changes]{/gray-fg}';
+    }
+    // Right side: tabs
+    const tabs = [
+        { key: '1', label: 'Diff', tab: 'diff' },
+        { key: '2', label: 'Commit', tab: 'commit' },
+        { key: '3', label: 'History', tab: 'history' },
+        { key: '4', label: 'Compare', tab: 'compare' },
+        { key: '5', label: 'Explorer', tab: 'explorer' },
+    ];
+    const rightContent = tabs
+        .map(({ key, label, tab }) => {
+        const isActive = activeTab === tab;
+        if (isActive) {
+            return `{bold}{cyan-fg}[${key}]${label}{/cyan-fg}{/bold}`;
+        }
+        return `[${key}]${label}`;
+    })
+        .join(' ');
+    // Calculate padding for right alignment
+    const leftLen = calculateVisibleLength(leftContent);
+    const rightLen = calculateVisibleLength(rightContent);
+    const padding = Math.max(1, width - leftLen - rightLen);
+    return leftContent + ' '.repeat(padding) + rightContent;
+}

package/dist/ui/widgets/Header.js

@@ -0,0 +1,68 @@
+import { abbreviateHomePath } from '../../config.js';
+/**
+ * Calculate header height based on content.
+ * Currently always returns 1 (single line header).
+ */
+export function getHeaderHeight() {
+    return 1;
+}
+/**
+ * Format branch info as blessed-compatible tagged string.
+ */
+function formatBranch(branch) {
+    let result = `{bold}{green-fg}${branch.current}{/green-fg}{/bold}`;
+    if (branch.tracking) {
+        result += ` {gray-fg}\u2192{/gray-fg} {blue-fg}${branch.tracking}{/blue-fg}`;
+    }
+    if (branch.ahead > 0) {
+        result += ` {green-fg}\u2191${branch.ahead}{/green-fg}`;
+    }
+    if (branch.behind > 0) {
+        result += ` {red-fg}\u2193${branch.behind}{/red-fg}`;
+    }
+    return result;
+}
+/**
+ * Format header content as blessed-compatible tagged string.
+ */
+export function formatHeader(repoPath, branch, isLoading, error, width) {
+    if (!repoPath) {
+        return '{gray-fg}Waiting for target path...{/gray-fg}';
+    }
+    const displayPath = abbreviateHomePath(repoPath);
+    const isNotGitRepo = error === 'Not a git repository';
+    // Build left side content
+    let leftContent = `{bold}{cyan-fg}${displayPath}{/cyan-fg}{/bold}`;
+    if (isLoading) {
+        leftContent += ' {yellow-fg}\u27f3{/yellow-fg}';
+    }
+    if (isNotGitRepo) {
+        leftContent += ' {yellow-fg}(not a git repository){/yellow-fg}';
+    }
+    else if (error) {
+        leftContent += ` {red-fg}(${error}){/red-fg}`;
+    }
+    // Build right side content (branch info)
+    const rightContent = branch ? formatBranch(branch) : '';
+    if (rightContent) {
+        // Calculate visible text length for left side (excluding ANSI/tags)
+        let leftLen = displayPath.length;
+        if (isLoading)
+            leftLen += 2; // " ⟳"
+        if (isNotGitRepo) {
+            leftLen += 24; // " (not a git repository)"
+        }
+        else if (error) {
+            leftLen += error.length + 3; // " (error)"
+        }
+        const rightLen = branch
+            ? branch.current.length +
+                (branch.tracking ? 3 + branch.tracking.length : 0) +
+                (branch.ahead > 0 ? 3 + String(branch.ahead).length : 0) +
+                (branch.behind > 0 ? 3 + String(branch.behind).length : 0)
+            : 0;
+        const padding = Math.max(1, width - leftLen - rightLen - 2);
+        return leftContent + ' '.repeat(padding) + rightContent;
+    }
+    return leftContent;
+}

package/dist/ui/widgets/HistoryView.js

@@ -0,0 +1,69 @@
+import { formatDate } from '../../utils/formatDate.js';
+import { formatCommitDisplay } from '../../utils/commitFormat.js';
+/**
+ * Format the history view as blessed-compatible tagged string.
+ */
+export function formatHistoryView(commits, selectedIndex, isFocused, width, scrollOffset = 0, maxHeight) {
+    if (commits.length === 0) {
+        return '{gray-fg}No commits yet{/gray-fg}';
+    }
+    // Apply scroll offset and max height
+    const visibleCommits = maxHeight
+        ? commits.slice(scrollOffset, scrollOffset + maxHeight)
+        : commits.slice(scrollOffset);
+    const lines = [];
+    for (let i = 0; i < visibleCommits.length; i++) {
+        const commit = visibleCommits[i];
+        const actualIndex = scrollOffset + i;
+        const isSelected = actualIndex === selectedIndex;
+        const isHighlighted = isSelected && isFocused;
+        const dateStr = formatDate(commit.date);
+        // Fixed parts: hash(7) + spaces(4) + date + parens(2) + selection indicator(2)
+        const baseWidth = 7 + 4 + dateStr.length + 2 + 2;
+        const remainingWidth = Math.max(10, width - baseWidth);
+        const { displayMessage, displayRefs } = formatCommitDisplay(commit.message, commit.refs, remainingWidth);
+        let line = '';
+        // Selection indicator
+        if (isHighlighted) {
+            line += '{cyan-fg}{bold}▸ {/bold}{/cyan-fg}';
+        }
+        else {
+            line += '  ';
+        }
+        // Short hash
+        line += `{yellow-fg}${commit.shortHash}{/yellow-fg} `;
+        // Message (with highlighting)
+        if (isHighlighted) {
+            line += `{cyan-fg}{inverse}${escapeContent(displayMessage)}{/inverse}{/cyan-fg}`;
+        }
+        else {
+            line += escapeContent(displayMessage);
+        }
+        // Date
+        line += ` {gray-fg}(${dateStr}){/gray-fg}`;
+        // Refs (branch names, tags)
+        if (displayRefs) {
+            line += ` {green-fg}${escapeContent(displayRefs)}{/green-fg}`;
+        }
+        lines.push(line);
+    }
+    return lines.join('\n');
+}
+/**
+ * Escape blessed tags in content.
+ */
+function escapeContent(content) {
+    return content.replace(/\{/g, '{{').replace(/\}/g, '}}');
+}
+/**
+ * Get the total number of rows in the history view (for scroll calculation).
+ */
+export function getHistoryTotalRows(commits) {
+    return commits.length;
+}
+/**
+ * Get the commit at a specific index.
+ */
+export function getCommitAtIndex(commits, index) {
+    return commits[index] ?? null;
+}