diffstalker 0.1.7 → 0.2.1

package/dist/components/ExplorerContentView.js

@@ -1,80 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { Box, Text } from 'ink';
-import { ScrollableList } from './ScrollableList.js';
-import { buildExplorerContentRows, wrapExplorerContentRows, getExplorerContentRowCount, getExplorerContentLineNumWidth, applyMiddleDots, } from '../utils/explorerDisplayRows.js';
-import { truncateAnsi } from '../utils/ansiTruncate.js';
-export function ExplorerContentView({ filePath, content, maxHeight, scrollOffset, truncated = false, wrapMode = false, width, showMiddleDots = false, }) {
-    // Build base rows with syntax highlighting
-    const baseRows = useMemo(() => buildExplorerContentRows(content, filePath, truncated), [content, filePath, truncated]);
-    // Calculate line number width
-    const lineNumWidth = useMemo(() => getExplorerContentLineNumWidth(baseRows), [baseRows]);
-    // Calculate content width for wrapping
-    // Layout: paddingX(1) + lineNum + space(1) + content + paddingX(1)
-    const contentWidth = width - lineNumWidth - 3;
-    // Apply wrapping if enabled
-    const displayRows = useMemo(() => wrapExplorerContentRows(baseRows, contentWidth, wrapMode), [baseRows, contentWidth, wrapMode]);
-    if (!filePath) {
-        return (_jsx(Box, { paddingX: 1, children: _jsx(Text, { dimColor: true, children: "Select a file to view its contents" }) }));
-    }
-    if (!content) {
-        return (_jsx(Box, { paddingX: 1, children: _jsx(Text, { dimColor: true, children: "Loading..." }) }));
-    }
-    if (displayRows.length === 0) {
-        return (_jsx(Box, { paddingX: 1, children: _jsx(Text, { dimColor: true, children: "(empty file)" }) }));
-    }
-    return (_jsx(Box, { flexDirection: "column", paddingX: 1, children: _jsx(ScrollableList, { items: displayRows, maxHeight: maxHeight, scrollOffset: scrollOffset, getKey: (row, index) => `${index}`, renderItem: (row) => {
-                if (row.type === 'truncation') {
-                    return (_jsx(Box, { children: _jsx(Text, { color: "yellow", dimColor: true, children: row.content }) }));
-                }
-                // Code row
-                const isContinuation = row.isContinuation ?? false;
-                // Line number display
-                let lineNumDisplay;
-                if (isContinuation) {
-                    // Show continuation marker instead of line number
-                    lineNumDisplay = '>>'.padStart(lineNumWidth, ' ');
-                }
-                else {
-                    lineNumDisplay = String(row.lineNum).padStart(lineNumWidth, ' ');
-                }
-                // Determine what content to display
-                const rawContent = row.content;
-                const shouldTruncate = !wrapMode && rawContent.length > contentWidth;
-                // Use highlighted content if available and not a continuation or middle-dots mode
-                const canUseHighlighting = row.highlighted && !isContinuation && !showMiddleDots;
-                let displayContent;
-                if (canUseHighlighting && row.highlighted) {
-                    // Use ANSI-aware truncation to preserve syntax highlighting
-                    displayContent = shouldTruncate
-                        ? truncateAnsi(row.highlighted, contentWidth)
-                        : row.highlighted;
-                }
-                else {
-                    // Plain content path
-                    let content = rawContent;
-                    // Apply middle-dots to raw content
-                    if (showMiddleDots && !isContinuation) {
-                        content = applyMiddleDots(content, true);
-                    }
-                    // Simple truncation for plain content
-                    if (shouldTruncate) {
-                        content = content.slice(0, Math.max(0, contentWidth - 1)) + '…';
-                    }
-                    displayContent = content;
-                }
-                return (_jsxs(Box, { children: [_jsxs(Text, { dimColor: !isContinuation, color: isContinuation ? 'cyan' : undefined, children: [lineNumDisplay, ' '] }), _jsx(Text, { dimColor: showMiddleDots && !canUseHighlighting, children: displayContent || ' ' })] }));
-            } }) }));
-}
-/**
- * Get total rows for scroll calculations.
- * Accounts for wrap mode when calculating.
- */
-export function getExplorerContentTotalRows(content, filePath, truncated, width, wrapMode) {
-    if (!content)
-        return 0;
-    const rows = buildExplorerContentRows(content, filePath, truncated);
-    const lineNumWidth = getExplorerContentLineNumWidth(rows);
-    const contentWidth = width - lineNumWidth - 3;
-    return getExplorerContentRowCount(rows, contentWidth, wrapMode);
-}

package/dist/components/ExplorerView.js

@@ -1,37 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { Box, Text } from 'ink';
-import { ScrollableList } from './ScrollableList.js';
-export function ExplorerView({ currentPath: _currentPath, items, selectedIndex, scrollOffset, maxHeight, isActive, width, isLoading = false, error = null, }) {
-    if (error) {
-        return (_jsx(Box, { flexDirection: "column", children: _jsxs(Text, { color: "red", children: ["Error: ", error] }) }));
-    }
-    if (isLoading) {
-        return (_jsx(Box, { flexDirection: "column", children: _jsx(Text, { dimColor: true, children: "Loading..." }) }));
-    }
-    if (items.length === 0) {
-        return (_jsx(Box, { flexDirection: "column", children: _jsx(Text, { dimColor: true, children: "(empty directory)" }) }));
-    }
-    // Calculate max name width for alignment
-    const maxNameWidth = Math.min(Math.max(...items.map((item) => item.name.length + (item.isDirectory ? 1 : 0))), width - 10);
-    return (_jsx(ScrollableList, { items: items, maxHeight: maxHeight, scrollOffset: scrollOffset, getKey: (item) => item.path || item.name, renderItem: (item, actualIndex) => {
-            const isSelected = actualIndex === selectedIndex && isActive;
-            const displayName = item.isDirectory ? `${item.name}/` : item.name;
-            const paddedName = displayName.padEnd(maxNameWidth + 1);
-            return (_jsx(Box, { children: _jsx(Text, { color: isSelected ? 'cyan' : undefined, bold: isSelected, inverse: isSelected, children: item.isDirectory ? (_jsx(Text, { color: isSelected ? 'cyan' : 'blue', children: paddedName })) : (_jsx(Text, { color: isSelected ? 'cyan' : undefined, children: paddedName })) }) }));
-        } }));
-}
-/**
- * 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);
-}
-/**
- * Get total rows in explorer for scroll calculations.
- */
-export function getExplorerTotalRows(items) {
-    return items.length;
-}

package/dist/components/FileList.js

@@ -1,131 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text } from 'ink';
-import { shortenPath } from '../utils/formatPath.js';
-import { categorizeFiles } from '../utils/fileCategories.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 null;
-    const add = insertions ?? 0;
-    const del = deletions ?? 0;
-    if (add === 0 && del === 0)
-        return null;
-    const parts = [];
-    if (add > 0)
-        parts.push(`+${add}`);
-    if (del > 0)
-        parts.push(`-${del}`);
-    return parts.join(' ');
-}
-function FileRow({ file, isSelected, isFocused, maxPathLength }) {
-    const statusChar = getStatusChar(file.status);
-    const statusColor = getStatusColor(file.status);
-    const actionButton = file.staged ? '[-]' : '[+]';
-    const buttonColor = file.staged ? 'red' : 'green';
-    const stats = formatStats(file.insertions, file.deletions);
-    const isHighlighted = isSelected && isFocused;
-    // Calculate available space for path (account for stats if present)
-    const statsLength = stats ? stats.length + 1 : 0;
-    const availableForPath = maxPathLength - statsLength;
-    const displayPath = shortenPath(file.path, availableForPath);
-    return (_jsxs(Box, { children: [_jsx(Text, { color: isHighlighted ? 'cyan' : undefined, bold: isHighlighted, children: isHighlighted ? '▸ ' : '  ' }), _jsxs(Text, { color: buttonColor, children: [actionButton, " "] }), _jsxs(Text, { color: statusColor, children: [statusChar, " "] }), _jsx(Text, { color: isHighlighted ? 'cyan' : undefined, inverse: isHighlighted, children: displayPath }), file.originalPath && _jsxs(Text, { dimColor: true, children: [" \u2190 ", shortenPath(file.originalPath, 30)] }), stats && (_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: " " }), file.insertions !== undefined && file.insertions > 0 && (_jsxs(Text, { color: "green", children: ["+", file.insertions] })), file.insertions !== undefined &&
-                        file.insertions > 0 &&
-                        file.deletions !== undefined &&
-                        file.deletions > 0 && _jsx(Text, { dimColor: true, children: " " }), file.deletions !== undefined && file.deletions > 0 && (_jsxs(Text, { color: "red", children: ["-", file.deletions] }))] }))] }));
-}
-export function FileList({ files, selectedIndex, isFocused, scrollOffset = 0, maxHeight, width = 80, }) {
-    // Calculate max path length: width minus prefix chars (▸/space + [+]/[-] + status + spaces = ~10)
-    const maxPathLength = width - 10;
-    // Split files into 3 categories: Modified, Untracked, Staged
-    const { modified: modifiedFiles, untracked: untrackedFiles, staged: stagedFiles, } = categorizeFiles(files);
-    if (files.length === 0) {
-        return (_jsx(Box, { flexDirection: "column", children: _jsx(Text, { dimColor: true, children: " No changes" }) }));
-    }
-    // Build a flat list of all rows
-    // Order: Modified → Untracked → Staged
-    const rows = [];
-    let currentFileIndex = 0;
-    if (modifiedFiles.length > 0) {
-        rows.push({ type: 'header', content: 'Modified:', headerColor: 'yellow' });
-        modifiedFiles.forEach((file) => {
-            rows.push({ type: 'file', file, fileIndex: currentFileIndex++ });
-        });
-    }
-    if (untrackedFiles.length > 0) {
-        if (modifiedFiles.length > 0) {
-            rows.push({ type: 'spacer' });
-        }
-        rows.push({ type: 'header', content: 'Untracked:', headerColor: 'gray' });
-        untrackedFiles.forEach((file) => {
-            rows.push({ type: 'file', file, fileIndex: currentFileIndex++ });
-        });
-    }
-    if (stagedFiles.length > 0) {
-        if (modifiedFiles.length > 0 || untrackedFiles.length > 0) {
-            rows.push({ type: 'spacer' });
-        }
-        rows.push({ type: 'header', content: 'Staged:', headerColor: 'green' });
-        stagedFiles.forEach((file) => {
-            rows.push({ type: 'file', file, fileIndex: currentFileIndex++ });
-        });
-    }
-    // Apply scroll offset and max height
-    const visibleRows = maxHeight
-        ? rows.slice(scrollOffset, scrollOffset + maxHeight)
-        : rows.slice(scrollOffset);
-    return (_jsx(Box, { flexDirection: "column", children: visibleRows.map((row, i) => {
-            const key = `row-${scrollOffset + i}`;
-            if (row.type === 'header') {
-                return (_jsx(Text, { bold: true, color: row.headerColor, children: row.content }, key));
-            }
-            if (row.type === 'spacer') {
-                return _jsx(Text, { children: " " }, key);
-            }
-            if (row.type === 'file' && row.file !== undefined && row.fileIndex !== undefined) {
-                return (_jsx(FileRow, { file: row.file, isSelected: row.fileIndex === selectedIndex, isFocused: isFocused, maxPathLength: maxPathLength }, key));
-            }
-            return null;
-        }) }));
-}
-export function getFileAtIndex(files, index) {
-    const { ordered } = categorizeFiles(files);
-    return ordered[index] ?? null;
-}
-export function getTotalFileCount(files) {
-    return files.length;
-}

package/dist/components/Footer.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text } from 'ink';
-export function Footer({ activeTab, mouseEnabled = true, autoTabEnabled = false, wrapMode = false, showMiddleDots = false, }) {
-    // Layout: "? [scroll] [auto] [wrap] [dots]" with spaces between
-    return (_jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Text, { children: [_jsx(Text, { dimColor: true, children: "?" }), ' ', _jsx(Text, { color: "yellow", children: mouseEnabled ? '[scroll]' : 'm:[select]' }), ' ', _jsx(Text, { color: autoTabEnabled ? 'blue' : undefined, dimColor: !autoTabEnabled, children: "[auto]" }), ' ', _jsx(Text, { color: wrapMode ? 'blue' : undefined, dimColor: !wrapMode, children: "[wrap]" }), activeTab === 'explorer' && (_jsxs(_Fragment, { children: [' ', _jsx(Text, { color: showMiddleDots ? 'blue' : undefined, dimColor: !showMiddleDots, children: "[dots]" })] }))] }), _jsxs(Text, { children: [_jsx(Text, { color: activeTab === 'diff' ? 'cyan' : undefined, bold: activeTab === 'diff', children: "[1]Diff" }), ' ', _jsx(Text, { color: activeTab === 'commit' ? 'cyan' : undefined, bold: activeTab === 'commit', children: "[2]Commit" }), ' ', _jsx(Text, { color: activeTab === 'history' ? 'cyan' : undefined, bold: activeTab === 'history', children: "[3]History" }), ' ', _jsx(Text, { color: activeTab === 'compare' ? 'cyan' : undefined, bold: activeTab === 'compare', children: "[4]Compare" })] })] }));
-}

package/dist/components/Header.js

@@ -1,107 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text } from 'ink';
-import { abbreviateHomePath } from '../config.js';
-/**
- * Calculate the header height based on whether content needs to wrap.
- * Returns 1 for single line, 2 if branch wraps to second line.
- */
-export function getHeaderHeight(repoPath, branch, watcherState, width, error = null, isLoading = false) {
-    if (!repoPath)
-        return 1;
-    const displayPath = abbreviateHomePath(repoPath);
-    const isNotGitRepo = error === 'Not a git repository';
-    // Calculate branch width
-    let branchWidth = 0;
-    if (branch) {
-        branchWidth = branch.current.length;
-        if (branch.tracking)
-            branchWidth += 3 + branch.tracking.length;
-        if (branch.ahead > 0)
-            branchWidth += 3 + String(branch.ahead).length;
-        if (branch.behind > 0)
-            branchWidth += 3 + String(branch.behind).length;
-    }
-    // Calculate left side width
-    let leftWidth = displayPath.length;
-    if (isLoading)
-        leftWidth += 2;
-    if (isNotGitRepo)
-        leftWidth += 24;
-    if (error && !isNotGitRepo)
-        leftWidth += error.length + 3;
-    // Check if follow indicator causes wrap
-    if (watcherState?.enabled && watcherState.sourceFile) {
-        const followPath = abbreviateHomePath(watcherState.sourceFile);
-        const fullFollow = ` (follow: ${followPath})`;
-        const availableOneLine = width - leftWidth - branchWidth - 4;
-        if (fullFollow.length > availableOneLine) {
-            // Would need to wrap
-            const availableWithWrap = width - leftWidth - 2;
-            if (fullFollow.length <= availableWithWrap) {
-                return 2; // Branch wraps to second line
-            }
-        }
-    }
-    return 1;
-}
-function BranchDisplay({ branch }) {
-    return (_jsxs(Box, { children: [_jsx(Text, { color: "green", bold: true, children: branch.current }), branch.tracking && (_jsxs(_Fragment, { children: [_jsx(Text, { dimColor: true, children: " \u2192 " }), _jsx(Text, { color: "blue", children: branch.tracking })] })), (branch.ahead > 0 || branch.behind > 0) && (_jsxs(Text, { children: [branch.ahead > 0 && _jsxs(Text, { color: "green", children: [" \u2191", branch.ahead] }), branch.behind > 0 && _jsxs(Text, { color: "red", children: [" \u2193", branch.behind] })] }))] }));
-}
-export function Header({ repoPath, branch, isLoading, error, debug, watcherState, width = 80, }) {
-    if (!repoPath) {
-        return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(Text, { dimColor: true, children: "Waiting for target path..." }), _jsx(Text, { dimColor: true, children: " (write path to ~/.cache/diffstalker/target)" })] }), debug && watcherState && watcherState.enabled && watcherState.sourceFile && (_jsxs(Box, { children: [_jsxs(Text, { dimColor: true, children: ["[debug] source: ", abbreviateHomePath(watcherState.sourceFile)] }), watcherState.rawContent && _jsxs(Text, { dimColor: true, children: [" | raw: \"", watcherState.rawContent, "\""] })] }))] }));
-    }
-    const displayPath = abbreviateHomePath(repoPath);
-    const isNotGitRepo = error === 'Not a git repository';
-    const formatTime = (date) => {
-        if (!date)
-            return '';
-        return date.toLocaleTimeString();
-    };
-    // Calculate branch info width for layout
-    let branchWidth = 0;
-    if (branch) {
-        branchWidth = branch.current.length;
-        if (branch.tracking) {
-            branchWidth += 3 + branch.tracking.length; // " → tracking"
-        }
-        if (branch.ahead > 0)
-            branchWidth += 3 + String(branch.ahead).length;
-        if (branch.behind > 0)
-            branchWidth += 3 + String(branch.behind).length;
-    }
-    // Calculate left side content width (without follow)
-    let leftWidth = displayPath.length;
-    if (isLoading)
-        leftWidth += 2;
-    if (isNotGitRepo)
-        leftWidth += 24;
-    if (error && !isNotGitRepo)
-        leftWidth += error.length + 3;
-    // Determine follow indicator display and layout
-    let followText = null;
-    let wrapBranch = false;
-    if (watcherState?.enabled && watcherState.sourceFile) {
-        const followPath = abbreviateHomePath(watcherState.sourceFile);
-        const fullFollow = ` (follow: ${followPath})`;
-        const availableOneLine = width - leftWidth - branchWidth - 4; // 4 for spacing
-        if (fullFollow.length <= availableOneLine) {
-            // Everything fits on one line
-            followText = fullFollow;
-        }
-        else {
-            // Need to wrap branch to second line
-            const availableWithWrap = width - leftWidth - 2;
-            if (fullFollow.length <= availableWithWrap) {
-                followText = fullFollow;
-                wrapBranch = true;
-            }
-            // If it doesn't fit, don't show follow at all
-        }
-    }
-    return (_jsxs(Box, { flexDirection: "column", width: width, children: [wrapBranch ? (
-            // Two-line layout: path + follow on first line, branch on second
-            _jsxs(_Fragment, { children: [_jsx(Box, { justifyContent: "space-between", children: _jsxs(Box, { children: [_jsx(Text, { bold: true, color: "cyan", children: displayPath }), isLoading && _jsx(Text, { color: "yellow", children: " \u27F3" }), isNotGitRepo && _jsx(Text, { color: "yellow", children: " (not a git repository)" }), error && !isNotGitRepo && _jsxs(Text, { color: "red", children: [" (", error, ")"] }), followText && _jsx(Text, { dimColor: true, children: followText })] }) }), _jsx(Box, { justifyContent: "flex-end", children: branch && _jsx(BranchDisplay, { branch: branch }) })] })) : (
-            // Single-line layout
-            _jsxs(Box, { justifyContent: "space-between", children: [_jsxs(Box, { children: [_jsx(Text, { bold: true, color: "cyan", children: displayPath }), isLoading && _jsx(Text, { color: "yellow", children: " \u27F3" }), isNotGitRepo && _jsx(Text, { color: "yellow", children: " (not a git repository)" }), error && !isNotGitRepo && _jsxs(Text, { color: "red", children: [" (", error, ")"] }), followText && _jsx(Text, { dimColor: true, children: followText })] }), branch && _jsx(BranchDisplay, { branch: branch })] })), debug && watcherState && watcherState.enabled && watcherState.sourceFile && (_jsxs(Box, { children: [_jsxs(Text, { dimColor: true, children: ["[debug] source: ", abbreviateHomePath(watcherState.sourceFile)] }), _jsxs(Text, { dimColor: true, children: [" | raw: \"", watcherState.rawContent, "\""] }), watcherState.lastUpdate && (_jsxs(Text, { dimColor: true, children: [" | updated: ", formatTime(watcherState.lastUpdate)] }))] }))] }));
-}

package/dist/components/HistoryView.js

@@ -1,21 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Box, Text } from 'ink';
-import { ScrollableList } from './ScrollableList.js';
-import { formatDate } from '../utils/formatDate.js';
-import { formatCommitDisplay } from '../utils/commitFormat.js';
-// Re-export from utils for backwards compatibility
-export { getCommitIndexFromRow, getHistoryTotalRows, getHistoryRowOffset, } from '../utils/rowCalculations.js';
-export function HistoryView({ commits, selectedIndex, scrollOffset, maxHeight, isActive, width, onSelectCommit: _onSelectCommit, }) {
-    if (commits.length === 0) {
-        return (_jsx(Box, { children: _jsx(Text, { dimColor: true, children: "No commits yet" }) }));
-    }
-    return (_jsx(ScrollableList, { items: commits, maxHeight: maxHeight, scrollOffset: scrollOffset, getKey: (commit) => commit.hash, renderItem: (commit, actualIndex) => {
-            const isSelected = actualIndex === selectedIndex && isActive;
-            const dateStr = formatDate(commit.date);
-            // Fixed parts: hash(7) + spaces(4) + date + parens(2)
-            const baseWidth = 7 + 4 + dateStr.length + 2;
-            const remainingWidth = width - baseWidth;
-            const { displayMessage, displayRefs } = formatCommitDisplay(commit.message, commit.refs, remainingWidth);
-            return (_jsxs(_Fragment, { children: [_jsx(Text, { color: "yellow", children: commit.shortHash }), _jsx(Text, { children: " " }), _jsx(Text, { color: isSelected ? 'cyan' : undefined, bold: isSelected, inverse: isSelected, children: displayMessage }), _jsx(Text, { children: " " }), _jsxs(Text, { dimColor: true, children: ["(", dateStr, ")"] }), displayRefs && (_jsxs(_Fragment, { children: [_jsx(Text, { children: " " }), _jsx(Text, { color: "green", children: displayRefs })] }))] }));
-        } }));
-}

package/dist/components/HotkeysModal.js

@@ -1,108 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text, useInput } from 'ink';
-import { Modal, centerModal } from './Modal.js';
-const hotkeyGroups = [
-    {
-        title: 'Navigation',
-        entries: [
-            { key: '↑/k', description: 'Move up' },
-            { key: '↓/j', description: 'Move down' },
-            { key: 'Tab', description: 'Toggle pane focus' },
-        ],
-    },
-    {
-        title: 'Staging',
-        entries: [
-            { key: '^S', description: 'Stage file' },
-            { key: '^U', description: 'Unstage file' },
-            { key: '^A', description: 'Stage all' },
-            { key: '^Z', description: 'Unstage all' },
-            { key: 'Space/Enter', description: 'Toggle stage' },
-        ],
-    },
-    {
-        title: 'Actions',
-        entries: [
-            { key: 'c', description: 'Open commit panel' },
-            { key: 'r', description: 'Refresh' },
-            { key: 'q', description: 'Quit' },
-        ],
-    },
-    {
-        title: 'Pane Resize',
-        entries: [
-            { key: '[', description: 'Shrink top pane' },
-            { key: ']', description: 'Grow top pane' },
-        ],
-    },
-    {
-        title: 'Tabs',
-        entries: [
-            { key: '1', description: 'Diff view' },
-            { key: '2', description: 'Commit panel' },
-            { key: '3', description: 'History view' },
-            { key: '4', description: 'Compare view' },
-            { key: '5', description: 'Explorer view' },
-            { key: 'a', description: 'Toggle auto-tab mode' },
-        ],
-    },
-    {
-        title: 'Explorer',
-        entries: [
-            { key: '.', description: 'Toggle middle-dots' },
-            { key: '^H', description: 'Toggle hidden files' },
-            { key: '^G', description: 'Toggle gitignored' },
-            { key: 'Enter', description: 'Enter directory' },
-            { key: 'Backspace/h', description: 'Go up' },
-        ],
-    },
-    {
-        title: 'Other',
-        entries: [
-            { key: 'm', description: 'Toggle scroll/select' },
-            { key: 'f', description: 'Toggle follow mode' },
-            { key: 'w', description: 'Toggle wrap mode' },
-            { key: 't', description: 'Theme picker' },
-            { key: 'b', description: 'Base branch picker' },
-            { key: 'u', description: 'Toggle uncommitted' },
-            { key: '?', description: 'This help' },
-        ],
-    },
-];
-export function HotkeysModal({ onClose, width, height }) {
-    useInput((input, key) => {
-        if (key.escape || key.return || input === '?') {
-            onClose();
-        }
-    });
-    // Determine if we should use 2 columns (need at least 90 chars width)
-    const useTwoColumns = width >= 90;
-    const columnWidth = useTwoColumns ? 38 : 30;
-    const boxWidth = useTwoColumns ? Math.min(82, width - 4) : Math.min(40, width - 4);
-    // Calculate height based on layout
-    let boxHeight;
-    if (useTwoColumns) {
-        // Split groups into two columns
-        const midpoint = Math.ceil(hotkeyGroups.length / 2);
-        const leftGroups = hotkeyGroups.slice(0, midpoint);
-        const rightGroups = hotkeyGroups.slice(midpoint);
-        const leftLines = leftGroups.reduce((sum, g) => sum + g.entries.length + 2, 0);
-        const rightLines = rightGroups.reduce((sum, g) => sum + g.entries.length + 2, 0);
-        boxHeight = Math.min(Math.max(leftLines, rightLines) + 5, height - 4);
-    }
-    else {
-        const totalLines = hotkeyGroups.reduce((sum, g) => sum + g.entries.length + 2, 0) + 4;
-        boxHeight = Math.min(totalLines, height - 4);
-    }
-    // Center the modal
-    const { x, y } = centerModal(boxWidth, boxHeight, width, height);
-    // Render a single group
-    const renderGroup = (group, colWidth) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { bold: true, dimColor: true, children: group.title }), group.entries.map((entry) => (_jsxs(Box, { children: [_jsx(Box, { width: 13, children: _jsx(Text, { color: "cyan", children: entry.key }) }), _jsx(Box, { width: colWidth - 13, children: _jsx(Text, { children: entry.description }) })] }, entry.key)))] }, group.title));
-    if (useTwoColumns) {
-        const midpoint = Math.ceil(hotkeyGroups.length / 2);
-        const leftGroups = hotkeyGroups.slice(0, midpoint);
-        const rightGroups = hotkeyGroups.slice(midpoint);
-        return (_jsx(Modal, { x: x, y: y, width: boxWidth, height: boxHeight, children: _jsxs(Box, { borderStyle: "round", borderColor: "cyan", flexDirection: "column", width: boxWidth, children: [_jsx(Box, { justifyContent: "center", marginBottom: 1, children: _jsxs(Text, { bold: true, color: "cyan", children: [' ', "Keyboard Shortcuts", ' '] }) }), _jsxs(Box, { children: [_jsx(Box, { flexDirection: "column", width: columnWidth, marginRight: 2, children: leftGroups.map((g) => renderGroup(g, columnWidth)) }), _jsx(Box, { flexDirection: "column", width: columnWidth, children: rightGroups.map((g) => renderGroup(g, columnWidth)) })] }), _jsx(Box, { marginTop: 1, justifyContent: "center", children: _jsx(Text, { dimColor: true, children: "Press Esc, Enter, or ? to close" }) })] }) }));
-    }
-    return (_jsx(Modal, { x: x, y: y, width: boxWidth, height: boxHeight, children: _jsxs(Box, { borderStyle: "round", borderColor: "cyan", flexDirection: "column", width: boxWidth, children: [_jsx(Box, { justifyContent: "center", marginBottom: 1, children: _jsxs(Text, { bold: true, color: "cyan", children: [' ', "Keyboard Shortcuts", ' '] }) }), hotkeyGroups.map((group) => renderGroup(group, columnWidth)), _jsx(Box, { marginTop: 1, justifyContent: "center", children: _jsx(Text, { dimColor: true, children: "Press Esc, Enter, or ? to close" }) })] }) }));
-}

package/dist/components/Modal.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, Text } from 'ink';
-/**
- * A modal overlay that blankets only its own area before rendering children.
- * Use this to create popups that cover the content behind them.
- */
-export function Modal({ x, y, width, height, children }) {
-    const blankLine = ' '.repeat(width);
-    return (_jsxs(Box, { position: "absolute", marginLeft: x, marginTop: y, flexDirection: "column", children: [Array.from({ length: height }).map((_, i) => (_jsx(Text, { children: blankLine }, `blank-${i}`))), _jsx(Box, { position: "absolute", flexDirection: "column", children: children })] }));
-}
-/**
- * Helper to calculate centered modal position.
- */
-export function centerModal(modalWidth, modalHeight, screenWidth, screenHeight) {
-    return {
-        x: Math.floor((screenWidth - modalWidth) / 2),
-        y: Math.floor((screenHeight - modalHeight) / 2),
-    };
-}

package/dist/components/ScrollableList.js

@@ -1,125 +0,0 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { useMemo } from 'react';
-import { Box, Text } from 'ink';
-/**
- * A generic scrollable list component that properly handles:
- * - Scroll indicators (↑/↓) taking up space
- * - Consistent height calculations
- * - Proper React keys for re-rendering
- *
- * Usage:
- * ```tsx
- * <ScrollableList
- *   items={myItems}
- *   renderItem={(item, i) => <MyRow item={item} />}
- *   maxHeight={20}
- *   scrollOffset={offset}
- *   getKey={(item, i) => item.id}
- * />
- * ```
- */
-export function ScrollableList({ items, renderItem, maxHeight, scrollOffset, getKey, header, showIndicators = true, getItemHeight, }) {
-    // If getItemHeight is not provided, use simple item-based scrolling
-    const hasVariableHeight = !!getItemHeight;
-    // Calculate cumulative row positions for variable height items
-    const { itemRowStarts, totalRows } = useMemo(() => {
-        if (!hasVariableHeight) {
-            return { itemRowStarts: [], totalRows: items.length };
-        }
-        const starts = [];
-        let cumulative = 0;
-        for (let i = 0; i < items.length; i++) {
-            starts.push(cumulative);
-            cumulative += getItemHeight(items[i], i);
-        }
-        return { itemRowStarts: starts, totalRows: cumulative };
-    }, [items, getItemHeight, hasVariableHeight]);
-    // Calculate available space for actual content
-    let availableHeight = maxHeight;
-    // Reserve space for header if present
-    if (header) {
-        availableHeight--;
-    }
-    const hasPrevious = scrollOffset > 0;
-    const contentTotal = hasVariableHeight ? totalRows : items.length;
-    const needsScrolling = contentTotal > maxHeight;
-    // Simple rule: if content needs scrolling, ALWAYS reserve 2 rows for indicators
-    // No clever predictions - just consistent, predictable behavior
-    if (showIndicators && needsScrolling) {
-        availableHeight -= 2;
-    }
-    // Ensure we have at least 1 line for content
-    availableHeight = Math.max(1, availableHeight);
-    // Find visible items based on scroll offset (in rows)
-    const visibleItems = [];
-    let usedRows = 0;
-    let rowsAbove = 0;
-    let rowsBelow = 0;
-    if (hasVariableHeight) {
-        // Find first visible item (the one that contains scrollOffset row)
-        let startIdx = 0;
-        for (let i = 0; i < items.length; i++) {
-            const itemHeight = getItemHeight(items[i], i);
-            if (itemRowStarts[i] + itemHeight > scrollOffset) {
-                startIdx = i;
-                break;
-            }
-        }
-        // Collect items that fit in available height
-        for (let i = startIdx; i < items.length && usedRows < availableHeight; i++) {
-            const itemHeight = getItemHeight(items[i], i);
-            visibleItems.push({ item: items[i], index: i });
-            usedRows += itemHeight;
-        }
-        rowsAbove = scrollOffset;
-        // Simple calculation: total rows minus what we've scrolled past minus what we're showing
-        rowsBelow = Math.max(0, totalRows - scrollOffset - usedRows);
-    }
-    else {
-        // Simple item-based scrolling (1 item = 1 row)
-        const endIdx = Math.min(scrollOffset + availableHeight, items.length);
-        for (let i = scrollOffset; i < endIdx; i++) {
-            visibleItems.push({ item: items[i], index: i });
-            usedRows++;
-        }
-        rowsAbove = scrollOffset;
-        rowsBelow = Math.max(0, items.length - scrollOffset - usedRows);
-    }
-    return (_jsxs(Box, { flexDirection: "column", overflowX: "hidden", height: maxHeight, overflow: "hidden", children: [header, showIndicators &&
-                needsScrolling &&
-                (hasPrevious ? _jsxs(Text, { dimColor: true, children: ["\u2191 ", rowsAbove, " more above"] }) : _jsx(Text, { children: " " })), visibleItems.map(({ item, index }) => (_jsx(Box, { children: renderItem(item, index) }, `${scrollOffset}-${index}-${getKey(item, index)}`))), showIndicators &&
-                needsScrolling &&
-                (rowsBelow > 0 ? _jsxs(Text, { dimColor: true, children: ["\u2193 ", rowsBelow, " more below"] }) : _jsx(Text, { children: " " }))] }));
-}
-/**
- * Calculate the maximum scroll offset for a list.
- */
-export function getMaxScrollOffset(totalItems, maxHeight, hasHeader = false, showIndicators = true) {
-    let availableHeight = maxHeight;
-    if (hasHeader)
-        availableHeight--;
-    // When scrolled, we always show "↑ above" indicator
-    // and usually "↓ below" indicator, so subtract 2
-    if (showIndicators && totalItems > availableHeight) {
-        availableHeight -= 2;
-    }
-    availableHeight = Math.max(1, availableHeight);
-    return Math.max(0, totalItems - availableHeight);
-}
-/**
- * Calculate visible item count for a given configuration.
- * Useful for scroll calculations in parent components.
- */
-export function getVisibleItemCount(totalItems, maxHeight, scrollOffset, hasHeader = false, showIndicators = true) {
-    let availableHeight = maxHeight;
-    if (hasHeader)
-        availableHeight--;
-    if (showIndicators) {
-        if (scrollOffset > 0)
-            availableHeight--;
-        if (totalItems > scrollOffset + availableHeight)
-            availableHeight--;
-    }
-    availableHeight = Math.max(1, availableHeight);
-    return Math.min(availableHeight, totalItems - scrollOffset);
-}