@abelfubu/dv 0.1.0

package/dist/cli.js

@@ -0,0 +1,976 @@
+#!/usr/bin/env bun
+import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "@opentuah/react/jsx-runtime";
+// CLI entrypoint for the dv diff viewer.
+// Provides TUI diff viewing with piped stdin support.
+// Usage: git diff | dv
+// Must be first import: patches process.stdout.columns/rows for Bun compiled binaries
+// where they incorrectly return 0 instead of actual terminal dimensions.
+import "./patch-terminal-dimensions.js";
+import { addDefaultParsers, createCliRenderer, MacOSScrollAccel, RGBA, ScrollBoxRenderable, } from "@opentuah/core";
+import { createPortal, createRoot, useKeyboard, useOnResize, useRenderer, useTerminalDimensions, } from "@opentuah/react";
+import { exec, spawnSync } from "child_process";
+import { goke, wrapJsonSchema } from "goke";
+import { join } from "path";
+import * as React from "react";
+import stripAnsi from "strip-ansi";
+import { promisify } from "util";
+import { copyToClipboardWithRendererSync } from "./clipboard.js";
+import { DEFAULT_SIDEBAR_WIDTH, DiffView, DirectoryTreeView, Toast } from "./components/index.js";
+import { buildUnifiedLogicalLines } from "./diff-cursor-utils.js";
+import { captureSelectedDiffText, getDiffRenderableLineCount } from "./diff-surface-copy.js";
+import Dropdown from "./dropdown.js";
+import { useCopySelection } from "./hooks/use-copy-selection.js";
+import parsersConfig from "./parsers-config.js";
+import { debounce } from "./utils.js";
+// Register custom syntax highlighting parsers
+addDefaultParsers(parsersConfig.parsers);
+// buildDirectoryTree no longer needed — DirectoryTreeView manages its own tree
+import packageJson from "../package.json" assert { type: "json" };
+import { buildGitCommand, buildSubmoduleDiffCommand, buildUntrackedFileDiff, countChanges, detectFiletype, ensureGitRepo, filterParsedFilesByPatterns, getDirtySubmodulePaths, getFileName, getFileStatus, getFilterPatterns, getGitRepoRoot, getOldFileName, getUntrackedFilePaths, getViewMode, parseGitDiffFiles, processFiles, stripSubmoduleHeaders } from "./diff-utils.js";
+import { logger } from "./logger.js";
+import { persistedState, useAppStore, } from "./store.js";
+import { defaultThemeName, getResolvedTheme, rgbaToHex, themeNames } from "./themes.js";
+// Lazy-load watcher only when --watch is used
+let watcherModule = null;
+async function getWatcher() {
+    if (!watcherModule) {
+        watcherModule = await import("@parcel/watcher");
+    }
+    return watcherModule;
+}
+async function runScrollbackMode(diffContent, options) {
+    const { renderDiffToFrame } = await import("./web-utils.js");
+    const { frameToAnsi } = await import("./ansi-output.js");
+    const { getResolvedTheme } = await import("./themes.js");
+    const themeName = options.theme && themeNames.includes(options.theme)
+        ? options.theme
+        : persistedState.themeName ?? defaultThemeName;
+    const cols = options.cols || process.stdout.columns || 120;
+    try {
+        const frame = await renderDiffToFrame(diffContent, {
+            cols,
+            maxRows: 10000,
+            themeName,
+        });
+        const theme = getResolvedTheme(themeName);
+        const transparentBackground = persistedState.transparentBackground ?? false;
+        const ansi = frameToAnsi(frame, transparentBackground ? undefined : theme.background);
+        process.stdout.write(ansi + "\n");
+        process.exit(0);
+    }
+    catch (error) {
+        const message = error instanceof Error ? error.message : String(error);
+        console.error("Failed to render scrollback:", message);
+        process.exit(1);
+    }
+}
+class ErrorBoundary extends React.Component {
+    state = { hasError: false, error: null };
+    static getDerivedStateFromError(error) {
+        return { hasError: true, error };
+    }
+    componentDidCatch = (error, errorInfo) => {
+        logger.log("Error caught by boundary:", error);
+        logger.log("Component stack:", errorInfo.componentStack);
+    };
+    render() {
+        if (this.state.hasError && this.state.error) {
+            return (_jsxs("box", { style: { flexDirection: "column", padding: 2 }, children: [_jsxs("text", { fg: "red", children: ["Error: ", this.state.error.message] }), _jsx("text", { fg: "brightBlack", children: this.state.error.stack })] }));
+        }
+        return this.props.children;
+    }
+}
+const execAsync = promisify(exec);
+async function filterCombinedDiffByPatterns(diffContent, options) {
+    if (!diffContent.trim())
+        return diffContent;
+    if (getFilterPatterns(options).length === 0)
+        return diffContent;
+    const { parsePatch, formatPatch } = await import("diff");
+    const parsedFiles = parseGitDiffFiles(stripSubmoduleHeaders(diffContent), parsePatch);
+    const filteredFiles = filterParsedFilesByPatterns(parsedFiles, options);
+    if (filteredFiles.length === 0)
+        return "";
+    return filteredFiles.map((file) => formatPatch(file)).join("\n");
+}
+const cli = goke("dv");
+class ScrollAcceleration {
+    multiplier = 1;
+    macosAccel;
+    constructor() {
+        this.macosAccel = new MacOSScrollAccel({ A: 1.5, maxMultiplier: 10 });
+    }
+    tick(delta) {
+        return this.macosAccel.tick(delta) * this.multiplier;
+    }
+    reset() {
+        this.macosAccel.reset();
+        // this.multiplier = 1;
+    }
+}
+const SIDEBAR_GAP = 2;
+const APP_HORIZONTAL_PADDING = 2;
+export function App({ parsedFiles }) {
+    const { width: initialWidth, height: initialHeight } = useTerminalDimensions();
+    const [width, setWidth] = React.useState(initialWidth);
+    const [_terminalHeight, setTerminalHeight] = React.useState(initialHeight);
+    const [scrollAcceleration] = React.useState(() => new ScrollAcceleration());
+    const themeName = useAppStore((s) => s.themeName);
+    const italicsEnabled = useAppStore((s) => s.italicsEnabled);
+    const transparentBackground = useAppStore((s) => s.transparentBackground);
+    const [showDropdown, setShowDropdown] = React.useState(false);
+    const [showThemePicker, setShowThemePicker] = React.useState(false);
+    const [previewTheme, setPreviewTheme] = React.useState(null);
+    const [currentFileIndex, setCurrentFileIndex] = React.useState(0);
+    const [currentFolderPath, setCurrentFolderPath] = React.useState(undefined);
+    const [showSidebar, setShowSidebar] = React.useState(true);
+    const [focusedPane, setFocusedPane] = React.useState("sidebar");
+    // Cursor/selection state for the diff pane
+    const [cursorLine, setCursorLine] = React.useState(0);
+    const [selectionAnchor, setSelectionAnchor] = React.useState(null);
+    // Transient copy notification shown in the footer
+    const [copyNotification, setCopyNotification] = React.useState(null);
+    const copyNotificationTimeoutRef = React.useRef(null);
+    // Refs for scroll functionality
+    const scrollboxRef = React.useRef(null);
+    const sidebarScrollboxRef = React.useRef(null);
+    const sidebarRef = React.useRef(null);
+    const diffViewRef = React.useRef(null);
+    // Ref for double-tap detection (gg)
+    const lastKeyRef = React.useRef(null);
+    // Logical diff lines for the currently rendered file, used for bounds and copy
+    const logicalLinesRef = React.useRef([]);
+    const maxCursorLine = React.useCallback(() => {
+        const renderable = diffViewRef.current?.getDiffRenderable();
+        if (renderable) {
+            return Math.max(0, getDiffRenderableLineCount(renderable) - 1);
+        }
+        return Math.max(0, logicalLinesRef.current.length - 1);
+    }, []);
+    const resetCursor = React.useCallback(() => {
+        setCursorLine(0);
+        setSelectionAnchor(null);
+    }, []);
+    const clampCursor = React.useCallback((line) => {
+        return Math.max(0, Math.min(line, maxCursorLine()));
+    }, [maxCursorLine]);
+    const scrollCursorIntoView = React.useCallback(() => {
+        const scrollbox = scrollboxRef.current;
+        if (!scrollbox)
+            return;
+        const viewportTop = scrollbox.scrollTop;
+        const viewportHeight = Math.max(1, scrollbox.viewport.height);
+        const margin = 10;
+        if (cursorLine < viewportTop) {
+            scrollbox.scrollTo(Math.max(0, cursorLine - margin));
+        }
+        else if (cursorLine >= viewportTop + viewportHeight) {
+            scrollbox.scrollTo(Math.max(0, cursorLine - viewportHeight + 1 + margin));
+        }
+        else if (cursorLine >= viewportTop + viewportHeight - margin) {
+            // Nearer the bottom edge: scroll down a bit to keep a margin ahead.
+            scrollbox.scrollTo(Math.max(0, cursorLine - viewportHeight + 1 + margin));
+        }
+    }, [cursorLine]);
+    // Copy selection to clipboard on mouse release
+    const { onMouseUp } = useCopySelection();
+    useOnResize(React.useCallback((newWidth, newHeight) => {
+        setWidth(newWidth);
+        setTerminalHeight(newHeight);
+    }, []));
+    const renderer = useRenderer();
+    const transparentBg = RGBA.fromInts(0, 0, 0, 0);
+    // Copy selected rows as rendered on screen + file path as a markdown code block.
+    const copySelectionToClipboard = React.useCallback(() => {
+        const file = currentFileIndex !== undefined ? parsedFiles[currentFileIndex] : undefined;
+        if (!file)
+            return;
+        const diffRenderable = diffViewRef.current?.getDiffRenderable();
+        if (!diffRenderable) {
+            logger.log("Copy selection unavailable: diff renderable not ready");
+            setCopyNotification({ message: "Copy unavailable: diff not ready", type: "error" });
+            return;
+        }
+        const anchor = selectionAnchor ?? cursorLine;
+        const { text: code, startLineNum } = captureSelectedDiffText(diffRenderable, {
+            start: anchor,
+            end: cursorLine,
+        });
+        if (!code) {
+            logger.log("Copy selection: no text captured");
+            setCopyNotification({ message: "Copy: no text selected", type: "error" });
+            return;
+        }
+        const fileName = getFileName(file);
+        const oldFileName = getOldFileName(file);
+        const pathHeader = oldFileName ? `${oldFileName} → ${fileName}` : fileName;
+        const lang = detectFiletype(fileName) || "";
+        const lineAttr = startLineNum !== undefined ? `:${startLineNum}` : "";
+        const markdown = ["```" + lang, `// ${pathHeader}${lineAttr}`, code, "```"].join("\n");
+        try {
+            copyToClipboardWithRendererSync(markdown, renderer);
+            const lineCount = code.split("\n").length;
+            setCopyNotification({
+                message: `Copied ${lineCount} ${lineCount === 1 ? "line" : "lines"}`,
+                type: "success",
+            });
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            logger.log("Copy selection failed:", message);
+            setCopyNotification({ message: `Copy failed: ${message}`, type: "error" });
+        }
+    }, [currentFileIndex, cursorLine, parsedFiles, renderer, selectionAnchor]);
+    // Auto-hide copy notification after a short delay.
+    React.useEffect(() => {
+        if (!copyNotification)
+            return;
+        if (copyNotificationTimeoutRef.current) {
+            clearTimeout(copyNotificationTimeoutRef.current);
+        }
+        copyNotificationTimeoutRef.current = setTimeout(() => {
+            setCopyNotification(null);
+            copyNotificationTimeoutRef.current = null;
+        }, 2000);
+        return () => {
+            if (copyNotificationTimeoutRef.current) {
+                clearTimeout(copyNotificationTimeoutRef.current);
+            }
+        };
+    }, [copyNotification]);
+    // Force a redraw when transparency is toggled so the terminal background shows through
+    React.useEffect(() => {
+        renderer.root.requestRender();
+    }, [transparentBackground]);
+    // Keep logical line model in sync with the rendered file and reset cursor on file change.
+    React.useEffect(() => {
+        if (currentFolderPath) {
+            logicalLinesRef.current = [];
+            resetCursor();
+            return;
+        }
+        const file = currentFileIndex !== undefined ? parsedFiles[currentFileIndex] : undefined;
+        logicalLinesRef.current = file?.rawDiff ? buildUnifiedLogicalLines(file.rawDiff) : [];
+        resetCursor();
+    }, [currentFileIndex, currentFolderPath, parsedFiles, resetCursor]);
+    // Auto-scroll the diff viewport so the cursor line stays visible.
+    React.useEffect(() => {
+        if (focusedPane !== "diff" || currentFolderPath)
+            return;
+        scrollCursorIntoView();
+    }, [cursorLine, focusedPane, currentFolderPath, scrollCursorIntoView]);
+    // Hide selection when leaving the diff pane.
+    React.useEffect(() => {
+        if (focusedPane !== "diff") {
+            setSelectionAnchor(null);
+        }
+    }, [focusedPane]);
+    useKeyboard((key) => {
+        if (showDropdown || showThemePicker) {
+            if (key.name === "escape") {
+                setShowDropdown(false);
+                setShowThemePicker(false);
+                setPreviewTheme(null);
+            }
+            return;
+        }
+        if (key.name === "escape" || key.name === "q") {
+            if (selectionAnchor !== null) {
+                setSelectionAnchor(null);
+                return;
+            }
+            renderer.destroy();
+            return;
+        }
+        if (key.name === "p") {
+            setShowDropdown(true);
+            return;
+        }
+        if ((key.shift && key.name === "t") || key.name === "T") {
+            useAppStore.setState({ transparentBackground: !transparentBackground });
+            return;
+        }
+        if (key.name === "t") {
+            setShowThemePicker(true);
+            return;
+        }
+        if (key.name === "b") {
+            setShowSidebar((prev) => !prev);
+            return;
+        }
+        if (key.name === "i") {
+            useAppStore.setState({ italicsEnabled: !italicsEnabled });
+            return;
+        }
+        if (key.name === "o") {
+            const file = currentFileIndex !== undefined ? parsedFiles[currentFileIndex] : undefined;
+            if (file) {
+                const editor = process.env.EDITOR || "vi";
+                const relativePath = getFileName(file).replace(/^[ab]\//, "");
+                const absolutePath = join(getGitRepoRoot(), relativePath);
+                renderer.suspend();
+                try {
+                    const match = editor.match(/(?:[^\s"]+|"[^"]*")+/g);
+                    const parts = match ? match.map((s) => s.replace(/^"|"$/g, "")) : [editor];
+                    const editorName = parts[0].toLowerCase();
+                    // GUI editors don't need the TTY; launching without stdio avoids permission prompts
+                    const isGuiEditor = editorName === "code" ||
+                        editorName === "code-insiders" ||
+                        editorName === "cursor" ||
+                        editorName === "zed" ||
+                        editorName === "subl" ||
+                        editorName === "sublime_text" ||
+                        editorName === "fleet" ||
+                        editorName === "goland" ||
+                        editorName === "idea" ||
+                        editorName === "webstorm" ||
+                        editorName === "pycharm" ||
+                        editorName === "rider" ||
+                        editorName === "clion" ||
+                        editorName === "datagrip" ||
+                        editorName === "rubymine";
+                    if (isGuiEditor) {
+                        spawnSync(parts[0], parts.slice(1).concat(absolutePath));
+                    }
+                    else {
+                        spawnSync(parts[0], parts.slice(1).concat(absolutePath), { stdio: "inherit" });
+                    }
+                }
+                catch {
+                    // Editor may exit non-zero (e.g. vim :cq)
+                }
+                renderer.resume();
+            }
+            return;
+        }
+        if (key.name === "tab") {
+            setSelectionAnchor(null);
+            setFocusedPane((prev) => (prev === "diff" ? "sidebar" : "diff"));
+            return;
+        }
+        // Diff-pane cursor/selection shortcuts
+        if (focusedPane === "diff" && !currentFolderPath) {
+            if (key.name === "v") {
+                if (selectionAnchor !== null) {
+                    setSelectionAnchor(null);
+                }
+                else {
+                    setSelectionAnchor(cursorLine);
+                }
+                key.preventDefault();
+                return;
+            }
+            if (key.name === "y") {
+                copySelectionToClipboard();
+                setSelectionAnchor(null);
+                key.preventDefault();
+                return;
+            }
+        }
+        if (key.name === "z" && key.ctrl) {
+            renderer.console.toggle();
+            return;
+        }
+        const scrollbox = scrollboxRef.current;
+        // Sidebar navigation when sidebar focused
+        if (showSidebar && focusedPane === "sidebar") {
+            // j/k: navigate rows
+            if (key.name === "j" || key.name === "k") {
+                // Ignore key repeat events to prevent double jumps
+                if (key.repeated)
+                    return;
+                if (key.name === "j") {
+                    sidebarRef.current?.focusNext();
+                }
+                else {
+                    sidebarRef.current?.focusPrev();
+                }
+                key.preventDefault();
+                return;
+            }
+            // l/h/Enter/Space: toggle folder collapse
+            if (key.name === "l" || key.name === "h" || key.name === "return" || key.name === "space") {
+                sidebarRef.current?.toggleCollapse();
+                key.preventDefault();
+                return;
+            }
+        }
+        // Vim-style navigation (diff pane)
+        if (scrollbox) {
+            // When the diff pane is focused, j/k move the cursor line and auto-scroll.
+            if (focusedPane === "diff" && !currentFolderPath && (key.name === "j" || key.name === "k")) {
+                if (key.name === "j") {
+                    setCursorLine((prev) => clampCursor(prev + 1));
+                }
+                else {
+                    setCursorLine((prev) => clampCursor(prev - 1));
+                }
+                key.preventDefault();
+                return;
+            }
+            // j - scroll down one line
+            if (key.name === "j") {
+                scrollbox.scrollBy(1, "step");
+                key.preventDefault();
+                return;
+            }
+            // k - scroll up one line
+            if (key.name === "k") {
+                scrollbox.scrollBy(-1, "step");
+                key.preventDefault();
+                return;
+            }
+            // G - go to bottom
+            if (key.name === "g" && key.shift) {
+                if (focusedPane === "diff" && !currentFolderPath) {
+                    setCursorLine(maxCursorLine());
+                }
+                else {
+                    scrollbox.scrollBy(1, "content");
+                }
+                return;
+            }
+            // gg - go to top (double-tap within 300ms)
+            if (key.name === "g" && !key.shift && !key.ctrl) {
+                const now = Date.now();
+                if (lastKeyRef.current?.key === "g" && now - lastKeyRef.current.time < 300) {
+                    if (focusedPane === "diff" && !currentFolderPath) {
+                        setCursorLine(0);
+                    }
+                    else {
+                        scrollbox.scrollTo(0);
+                    }
+                    lastKeyRef.current = null;
+                }
+                else {
+                    lastKeyRef.current = { key: "g", time: now };
+                }
+                return;
+            }
+            // Ctrl+D - half page down
+            if (key.ctrl && key.name === "d") {
+                if (focusedPane === "diff" && !currentFolderPath) {
+                    setCursorLine((prev) => clampCursor(prev + Math.floor(scrollbox.viewport.height / 2)));
+                }
+                else {
+                    scrollbox.scrollBy(0.5, "viewport");
+                }
+                return;
+            }
+            // Ctrl+U - half page up
+            if (key.ctrl && key.name === "u") {
+                if (focusedPane === "diff" && !currentFolderPath) {
+                    setCursorLine((prev) => clampCursor(prev - Math.floor(scrollbox.viewport.height / 2)));
+                }
+                else {
+                    scrollbox.scrollBy(-0.5, "viewport");
+                }
+                return;
+            }
+        }
+        if (key.option) {
+            if (key.eventType === "release") {
+                scrollAcceleration.multiplier = 1;
+            }
+            else {
+                scrollAcceleration.multiplier = 10;
+            }
+        }
+    });
+    if (parsedFiles.length === 0) {
+        return (_jsx("box", { onMouseUp: onMouseUp, style: {
+                padding: 1,
+                backgroundColor: transparentBackground ? transparentBg : getResolvedTheme(themeName).background,
+            }, children: _jsx("text", { children: "No files to display" }) }));
+    }
+    // Use preview theme if hovering, otherwise use selected theme
+    const activeTheme = previewTheme ?? themeName;
+    const resolvedTheme = getResolvedTheme(activeTheme);
+    const bgColor = transparentBackground ? transparentBg : resolvedTheme.background;
+    const sidebarBgColor = transparentBackground ? transparentBg : rgbaToHex(resolvedTheme.backgroundPanel);
+    const textColor = rgbaToHex(resolvedTheme.text);
+    const mutedColor = rgbaToHex(resolvedTheme.textMuted);
+    const availableContentWidth = Math.max(20, width - APP_HORIZONTAL_PADDING);
+    const diffPaneWidth = showSidebar
+        ? Math.max(20, availableContentWidth - DEFAULT_SIDEBAR_WIDTH - SIDEBAR_GAP)
+        : availableContentWidth;
+    const diffSelection = React.useMemo(() => {
+        if (selectionAnchor === null)
+            return null;
+        return { start: selectionAnchor, end: cursorLine };
+    }, [selectionAnchor, cursorLine]);
+    const dropdownOptions = parsedFiles.map((file, idx) => {
+        const name = getFileName(file);
+        return {
+            title: name,
+            value: String(idx),
+            keywords: name.split("/"),
+        };
+    });
+    // Build tree data for directory tree view
+    const treeFiles = parsedFiles.map((file, idx) => {
+        const { additions, deletions } = countChanges(file.hunks);
+        return {
+            path: getFileName(file),
+            status: getFileStatus(file),
+            additions,
+            deletions,
+            fileIndex: idx,
+        };
+    });
+    // Synchronous sidebar scroll handler — keeps focused row in viewport
+    const handleSidebarFocusRowChange = React.useCallback((rowY) => {
+        const sidebarScrollbox = sidebarScrollboxRef.current;
+        if (!sidebarScrollbox)
+            return;
+        const viewportTop = sidebarScrollbox.scrollTop;
+        const viewportHeight = Math.max(1, sidebarScrollbox.viewport.height);
+        if (rowY < viewportTop) {
+            sidebarScrollbox.scrollTo(rowY);
+        }
+        else if (rowY >= viewportTop + viewportHeight) {
+            sidebarScrollbox.scrollTo(Math.max(0, rowY - viewportHeight + 1));
+        }
+    }, []);
+    const handleFileSelect = (value) => {
+        const index = parseInt(value, 10);
+        setCurrentFileIndex(index);
+        setCurrentFolderPath(undefined);
+        setShowDropdown(false);
+        // Reset scroll when switching files via picker
+        const scrollbox = scrollboxRef.current;
+        if (scrollbox)
+            scrollbox.scrollTo(0);
+    };
+    const themeOptions = themeNames.map((name) => ({
+        title: name,
+        value: name,
+    }));
+    const handleThemeSelect = (value) => {
+        useAppStore.setState({ themeName: value });
+        setShowThemePicker(false);
+        setPreviewTheme(null);
+    };
+    const handleThemeFocus = (value) => {
+        setPreviewTheme(value);
+    };
+    const renderCurrentFile = () => {
+        if (currentFolderPath) {
+            const folderFiles = parsedFiles.filter((file) => {
+                const name = getFileName(file);
+                return name.startsWith(currentFolderPath + "/");
+            });
+            if (folderFiles.length === 0) {
+                return (_jsx("box", { style: { padding: 1 }, children: _jsx("text", { fg: mutedColor, children: "No changes in this folder" }) }));
+            }
+            const totalAdditions = folderFiles.reduce((sum, f) => sum + countChanges(f.hunks).additions, 0);
+            const totalDeletions = folderFiles.reduce((sum, f) => sum + countChanges(f.hunks).deletions, 0);
+            return (_jsxs("box", { style: { flexDirection: "column" }, children: [_jsxs("box", { style: {
+                            paddingBottom: 1,
+                            paddingLeft: 1,
+                            paddingRight: 1,
+                            flexShrink: 0,
+                            flexDirection: "row",
+                            alignItems: "center",
+                        }, children: [_jsxs("text", { fg: textColor, children: [currentFolderPath, "/"] }), _jsxs("text", { fg: "#2d8a47", children: [" +", totalAdditions] }), _jsxs("text", { fg: "#c53b53", children: [" -", totalDeletions] }), _jsxs("text", { fg: mutedColor, children: [" (", folderFiles.length, " files)"] })] }), folderFiles.map((file, idx) => {
+                        const fileName = getFileName(file);
+                        const oldFileName = getOldFileName(file);
+                        const filetype = detectFiletype(fileName);
+                        const { additions, deletions } = countChanges(file.hunks);
+                        const viewMode = getViewMode(additions, deletions, diffPaneWidth);
+                        return (_jsxs("box", { style: { flexDirection: "column" }, children: [_jsxs("box", { style: {
+                                        paddingTop: idx > 0 ? 1 : 0,
+                                        paddingBottom: 1,
+                                        paddingLeft: 1,
+                                        paddingRight: 1,
+                                        flexShrink: 0,
+                                        flexDirection: "row",
+                                        alignItems: "center",
+                                    }, children: [oldFileName ? (_jsxs(_Fragment, { children: [_jsx("text", { fg: mutedColor, children: oldFileName.trim() }), _jsx("text", { fg: mutedColor, children: " \u2192 " }), _jsx("text", { fg: textColor, children: fileName.trim() })] })) : (_jsx("text", { fg: textColor, children: fileName.trim() })), _jsxs("text", { fg: "#2d8a47", children: [" +", additions] }), _jsxs("text", { fg: "#c53b53", children: [" -", deletions] })] }), _jsx(DiffView, { diff: file.rawDiff || "", view: viewMode, filetype: filetype, themeName: activeTheme, italicsEnabled: italicsEnabled, transparentBackground: transparentBackground, focused: false })] }, idx));
+                    })] }));
+        }
+        const file = parsedFiles[currentFileIndex ?? 0];
+        if (!file)
+            return null;
+        const fileName = getFileName(file);
+        const oldFileName = getOldFileName(file);
+        const filetype = detectFiletype(fileName);
+        const { additions, deletions } = countChanges(file.hunks);
+        const viewMode = getViewMode(additions, deletions, diffPaneWidth);
+        return (_jsxs("box", { style: { flexDirection: "column" }, children: [_jsxs("box", { style: {
+                        paddingBottom: 1,
+                        paddingLeft: 1,
+                        paddingRight: 1,
+                        flexShrink: 0,
+                        flexDirection: "row",
+                        alignItems: "center",
+                    }, children: [oldFileName ? (_jsxs(_Fragment, { children: [_jsx("text", { fg: mutedColor, children: oldFileName.trim() }), _jsx("text", { fg: mutedColor, children: " \u2192 " }), _jsx("text", { fg: textColor, children: fileName.trim() })] })) : (_jsx("text", { fg: textColor, children: fileName.trim() })), _jsxs("text", { fg: "#2d8a47", children: [" +", additions] }), _jsxs("text", { fg: "#c53b53", children: ["-", deletions] })] }), _jsx(DiffView, { ref: diffViewRef, diff: file.rawDiff || "", view: viewMode, filetype: filetype, themeName: activeTheme, italicsEnabled: italicsEnabled, transparentBackground: transparentBackground, focused: focusedPane === "diff", cursorLine: cursorLine, selection: diffSelection })] }));
+    };
+    // Always render the same structure - scrollbox is never remounted
+    return (_jsxs("box", { style: {
+            flexDirection: "column",
+            height: "100%",
+            padding: 1,
+            backgroundColor: bgColor,
+        }, children: [copyNotification &&
+                createPortal(_jsx(Toast, { message: copyNotification.message, type: copyNotification.type, theme: resolvedTheme, transparentBackground: transparentBackground }), renderer.root, null), showThemePicker && (_jsx("box", { style: { flexShrink: 0, maxHeight: 15 }, children: _jsx(Dropdown, { tooltip: "Select theme", options: themeOptions, selectedValues: [themeName], onChange: handleThemeSelect, onFocus: handleThemeFocus, onEscape: () => {
+                        setShowThemePicker(false);
+                        setPreviewTheme(null);
+                    }, placeholder: "Search themes...", itemsPerPage: 6, theme: resolvedTheme }) })), showDropdown && (_jsx("box", { style: { flexShrink: 0, maxHeight: 15 }, children: _jsx(Dropdown, { tooltip: "Select file", options: dropdownOptions, selectedValues: [], onChange: handleFileSelect, onEscape: () => {
+                        setShowDropdown(false);
+                    }, placeholder: "Search files...", itemsPerPage: 6, theme: resolvedTheme }) })), _jsxs("box", { style: {
+                    flexDirection: "row",
+                    flexGrow: 1,
+                    flexShrink: 1,
+                }, children: [showSidebar && (_jsx("box", { style: {
+                            width: DEFAULT_SIDEBAR_WIDTH,
+                            flexShrink: 0,
+                            marginRight: SIDEBAR_GAP,
+                            backgroundColor: sidebarBgColor,
+                            flexDirection: "column",
+                        }, children: _jsx("scrollbox", { ref: sidebarScrollboxRef, scrollY: true, style: {
+                                flexGrow: 1,
+                                flexShrink: 1,
+                                rootOptions: {
+                                    backgroundColor: sidebarBgColor,
+                                    border: false,
+                                },
+                                contentOptions: {
+                                    minHeight: 0,
+                                },
+                                scrollbarOptions: {
+                                    showArrows: false,
+                                    trackOptions: {
+                                        foregroundColor: mutedColor,
+                                        backgroundColor: sidebarBgColor,
+                                    },
+                                },
+                            }, children: _jsx(DirectoryTreeView, { ref: sidebarRef, files: treeFiles, themeName: activeTheme, width: DEFAULT_SIDEBAR_WIDTH, activeFileIndex: currentFileIndex, activeFolderPath: currentFolderPath, transparentBackground: transparentBackground, onFocusRowChange: handleSidebarFocusRowChange, onFileSelect: (fileIndex) => {
+                                    setCurrentFileIndex(fileIndex);
+                                    setCurrentFolderPath(undefined);
+                                    scrollboxRef.current?.scrollTo(0);
+                                }, onFolderSelect: (folderPath) => {
+                                    setCurrentFolderPath(folderPath);
+                                    setCurrentFileIndex(undefined);
+                                    scrollboxRef.current?.scrollTo(0);
+                                } }) }) })), _jsx("box", { style: {
+                            flexGrow: 1,
+                            flexShrink: 1,
+                        }, children: _jsx("scrollbox", { ref: scrollboxRef, scrollY: true, scrollAcceleration: scrollAcceleration, style: {
+                                flexGrow: 1,
+                                flexShrink: 1,
+                                rootOptions: {
+                                    backgroundColor: bgColor,
+                                    border: false,
+                                },
+                                contentOptions: {
+                                    minHeight: 0,
+                                },
+                                scrollbarOptions: {
+                                    showArrows: false,
+                                    trackOptions: {
+                                        foregroundColor: mutedColor,
+                                        backgroundColor: bgColor,
+                                    },
+                                },
+                            }, focused: !showDropdown && !showThemePicker, children: renderCurrentFile() }) })] }), !showDropdown && !showThemePicker && (_jsxs("box", { style: {
+                    paddingTop: 1,
+                    paddingLeft: 1,
+                    paddingRight: 1,
+                    flexShrink: 0,
+                    flexDirection: "row",
+                    alignItems: "center",
+                }, children: [_jsx("text", { fg: textColor, children: "p" }), _jsxs("text", { fg: mutedColor, children: [" files (", parsedFiles.length, ")  "] }), _jsx("text", { fg: textColor, children: "t" }), _jsx("text", { fg: mutedColor, children: " theme  " }), _jsx("text", { fg: textColor, children: "b" }), _jsx("text", { fg: mutedColor, children: " sidebar  " }), _jsx("text", { fg: textColor, children: "i" }), _jsxs("text", { fg: mutedColor, children: [" ", italicsEnabled ? "italic" : "no-italic", "  "] }), _jsx("text", { fg: textColor, children: "T" }), _jsxs("text", { fg: mutedColor, children: [" ", transparentBackground ? "transparent" : "opaque", "  "] }), _jsx("text", { fg: textColor, children: "o" }), _jsx("text", { fg: mutedColor, children: " edit  " }), _jsx("text", { fg: textColor, children: "tab" }), _jsx("text", { fg: mutedColor, children: " focus" }), focusedPane === "diff" && !currentFolderPath && (_jsxs(_Fragment, { children: [_jsx("text", { fg: textColor, children: "  j/k" }), _jsx("text", { fg: mutedColor, children: " cursor" }), _jsx("text", { fg: textColor, children: "  v" }), _jsxs("text", { fg: mutedColor, children: [" ", selectionAnchor !== null ? "stop" : "select"] }), _jsx("text", { fg: textColor, children: "  y" }), _jsx("text", { fg: mutedColor, children: " copy" })] })), _jsx("box", { flexGrow: 1 })] }))] }));
+}
+cli
+    .command("[base] [head]", "Show diff for git references (defaults to unstaged changes)")
+    .option("--staged", "Show staged changes")
+    .option("--commit <ref>", "Show changes from a specific commit")
+    .option("--watch", "Watch for file changes and refresh diff")
+    .option("--context <lines>", "Number of context lines (default: 6)")
+    .option("--filter <pattern>", wrapJsonSchema({
+    type: "array",
+    items: { type: "string" },
+    description: "Filter files by glob pattern (can be used multiple times)",
+}))
+    .option("--theme <name>", "Theme to use for rendering")
+    .option("--no-italics", "Disable italic text in syntax highlighting")
+    .option("--transparent", "Use transparent background")
+    .option("--cols <cols>", "Columns for scrollback output (default: terminal width)")
+    .option("--stdin", "Read diff from stdin (for use as a pager)")
+    .option("--no-stdin", "Ignore piped stdin, always read diff from git")
+    .option("--scrollback", "Output to terminal scrollback instead of TUI (auto-enabled when non-TTY)")
+    .action(async (base, head, options) => {
+    // Auto-detect piped stdin (e.g. `git diff | critique`)
+    // Explicit --stdin is for PTY pager integration (lazygit) where stdin IS a TTY
+    // --no-stdin forces git diff mode even when stdin is a pipe
+    const mightHaveStdin = (options.stdin || !process.stdin.isTTY) && !options.noStdin;
+    // Ensure we're inside a git repository before doing anything
+    if (!mightHaveStdin) {
+        ensureGitRepo();
+    }
+    // Apply theme and italics if specified (zustand subscription auto-persists)
+    if (options.theme && themeNames.includes(options.theme)) {
+        useAppStore.setState({ themeName: options.theme });
+    }
+    if (options.noItalics) {
+        useAppStore.setState({ italicsEnabled: false });
+    }
+    if (options.transparent) {
+        useAppStore.setState({ transparentBackground: true });
+    }
+    // Build git command once (used by all modes)
+    const gitCommand = buildGitCommand({
+        staged: options.staged,
+        commit: options.commit,
+        base,
+        head,
+        context: options.context,
+        filter: options.filter,
+        positionalFilters: options['--'],
+    });
+    // Get diff content - from stdin or git
+    let diffContent = "";
+    let isStdinMode = false;
+    if (mightHaveStdin) {
+        // Handle stdin mode (for lazygit pager integration or piped input)
+        // Lazygit uses --color=always by default, so strip ANSI escape codes
+        // before parsing the diff (parsePatch expects plain text)
+        diffContent = "";
+        for await (const chunk of process.stdin) {
+            diffContent += chunk;
+        }
+        diffContent = stripAnsi(diffContent);
+        isStdinMode = true;
+    }
+    if (!isStdinMode) {
+        // Stdin was not requested — read diff from git
+        ensureGitRepo();
+        const { stdout: gitDiff } = await execAsync(gitCommand, {
+            encoding: "utf-8",
+        });
+        diffContent = gitDiff;
+    }
+    // Detect default mode (no args): submodule diffs are handled separately
+    const isDefaultMode = !options.staged && !options.commit && !base && !head && !isStdinMode;
+    // In default mode, append diffs from dirty submodules only.
+    // The main git diff uses --ignore-submodules=all, so we separately
+    // fetch diffs for submodules that have uncommitted changes.
+    // This avoids showing submodule ref changes where the submodule
+    // itself has already committed everything.
+    if (isDefaultMode) {
+        const dirtySubmodules = getDirtySubmodulePaths();
+        if (dirtySubmodules.length > 0) {
+            const subCmd = buildSubmoduleDiffCommand(dirtySubmodules, {
+                context: options.context,
+            });
+            try {
+                const { stdout: subDiff } = await execAsync(subCmd, {
+                    encoding: "utf-8",
+                });
+                if (subDiff.trim()) {
+                    diffContent = diffContent + "\n" + subDiff;
+                }
+            }
+            catch {
+                // Submodule diff failed (e.g. submodule not initialized) — skip
+            }
+        }
+        // Append synthetic diffs for untracked files without modifying the git index.
+        const untrackedPaths = getUntrackedFilePaths();
+        for (const untrackedPath of untrackedPaths) {
+            const untrackedDiff = buildUntrackedFileDiff(untrackedPath);
+            if (untrackedDiff) {
+                diffContent = diffContent + "\n" + untrackedDiff;
+            }
+        }
+        diffContent = await filterCombinedDiffByPatterns(diffContent, {
+            filter: options.filter,
+            positionalFilters: options['--'],
+        });
+    }
+    // Clean submodule headers once
+    const cleanedDiff = stripSubmoduleHeaders(diffContent);
+    // Check for empty diff (except for --watch mode which may get content later)
+    const shouldWatch = options.watch && !base && !head && !options.commit && !isStdinMode;
+    if (!cleanedDiff.trim() && !shouldWatch) {
+        console.log("No changes to display");
+        process.exit(0);
+    }
+    // Explicit --stdin forces scrollback (pager mode). Auto-detected piped stdin
+    // only forces scrollback when stdout is also non-TTY.
+    if (options.scrollback || options.stdin || !process.stdout.isTTY) {
+        // For scrollback, prefer terminal width over --cols default (240 is for web)
+        const scrollbackCols = process.stdout.columns || parseInt(options.cols) || 120;
+        await runScrollbackMode(cleanedDiff, {
+            theme: options.theme,
+            cols: scrollbackCols,
+        });
+        return;
+    }
+    // TUI mode
+    try {
+        // When diff came from a piped stdin, process.stdin is consumed and cannot
+        // be used for keyboard input. Open /dev/tty (the controlling terminal) for
+        // keyboard events instead.
+        let rendererStdin;
+        if (isStdinMode && !options.stdin) {
+            try {
+                const fs = await import("fs");
+                const tty = await import("tty");
+                const fd = fs.openSync("/dev/tty", "r");
+                rendererStdin = new tty.ReadStream(fd);
+            }
+            catch {
+                // /dev/tty not available — fall back to scrollback
+                const scrollbackCols = process.stdout.columns || parseInt(options.cols) || 120;
+                await runScrollbackMode(cleanedDiff, {
+                    theme: options.theme,
+                    cols: scrollbackCols,
+                });
+                return;
+            }
+        }
+        // Parallelize diff module loading with renderer creation
+        const [diffModule, renderer] = await Promise.all([
+            import("diff"),
+            createCliRenderer({
+                stdin: rendererStdin,
+                onDestroy() {
+                    process.exit(0);
+                },
+                exitOnCtrlC: true,
+                useMouse: true,
+                enableMouseMovement: true,
+            }),
+        ]);
+        const { parsePatch, formatPatch } = diffModule;
+        // Parse initial diff (already have it, no need to fetch again)
+        const initialParsedFiles = cleanedDiff.trim()
+            ? processFiles(parseGitDiffFiles(cleanedDiff, parsePatch), formatPatch)
+            : [];
+        function AppWithWatch() {
+            // Use initial parsed files, only re-fetch if watching
+            const [parsedFiles, setParsedFiles] = React.useState(shouldWatch ? null : initialParsedFiles);
+            const themeName = useAppStore((s) => s.themeName);
+            const watchRenderer = useRenderer();
+            // Copy selection to clipboard on mouse release
+            const { onMouseUp } = useCopySelection();
+            // Handle exit keys (Q, Escape) for loading and empty states
+            useKeyboard((key) => {
+                if (parsedFiles && parsedFiles.length > 0) {
+                    return;
+                }
+                if (key.name === "escape" || key.name === "q") {
+                    watchRenderer.destroy();
+                }
+            });
+            React.useEffect(() => {
+                // Skip initial fetch if not watching (we already have the data)
+                if (!shouldWatch) {
+                    return;
+                }
+                const fetchDiff = async () => {
+                    try {
+                        const { stdout: gitDiff } = await execAsync(gitCommand, {
+                            encoding: "utf-8",
+                        });
+                        // In default mode (watch is only enabled in default mode),
+                        // append dirty submodule diffs
+                        let fullDiff = gitDiff;
+                        if (isDefaultMode) {
+                            const dirtySubmodules = getDirtySubmodulePaths();
+                            if (dirtySubmodules.length > 0) {
+                                const subCmd = buildSubmoduleDiffCommand(dirtySubmodules, {
+                                    context: options.context,
+                                });
+                                try {
+                                    const { stdout: subDiff } = await execAsync(subCmd, {
+                                        encoding: "utf-8",
+                                    });
+                                    if (subDiff.trim()) {
+                                        fullDiff = fullDiff + "\n" + subDiff;
+                                    }
+                                }
+                                catch {
+                                    // Submodule diff failed — skip
+                                }
+                            }
+                            // Append synthetic diffs for untracked files without modifying the git index.
+                            const untrackedPaths = getUntrackedFilePaths();
+                            for (const untrackedPath of untrackedPaths) {
+                                const untrackedDiff = buildUntrackedFileDiff(untrackedPath);
+                                if (untrackedDiff) {
+                                    fullDiff = fullDiff + "\n" + untrackedDiff;
+                                }
+                            }
+                        }
+                        if (!fullDiff.trim()) {
+                            setParsedFiles([]);
+                            return;
+                        }
+                        const files = parseGitDiffFiles(stripSubmoduleHeaders(fullDiff), parsePatch);
+                        const filteredFiles = isDefaultMode
+                            ? filterParsedFilesByPatterns(files, {
+                                filter: options.filter,
+                                positionalFilters: options['--'],
+                            })
+                            : files;
+                        const processedFiles = processFiles(filteredFiles, formatPatch);
+                        setParsedFiles(processedFiles);
+                    }
+                    catch (error) {
+                        setParsedFiles([]);
+                    }
+                };
+                // Initial fetch for watch mode
+                fetchDiff();
+                const cwd = process.cwd();
+                const debouncedFetch = debounce(() => {
+                    fetchDiff();
+                }, 200);
+                let subscription;
+                // Lazy-load watcher module only when watching
+                getWatcher().then((watcher) => {
+                    watcher
+                        .subscribe(cwd, (err, events) => {
+                        if (err) {
+                            return;
+                        }
+                        if (events.length > 0) {
+                            debouncedFetch();
+                        }
+                    })
+                        .then((sub) => {
+                        subscription = sub;
+                    });
+                });
+                return () => {
+                    if (subscription) {
+                        subscription.unsubscribe();
+                    }
+                };
+            }, []);
+            const defaultBg = getResolvedTheme(themeName).background;
+            if (parsedFiles === null) {
+                return (_jsx("box", { onMouseUp: onMouseUp, style: { padding: 1, backgroundColor: defaultBg }, children: _jsx("text", { children: "Loading..." }) }));
+            }
+            if (parsedFiles.length === 0) {
+                return (_jsx("box", { onMouseUp: onMouseUp, style: { padding: 1, backgroundColor: defaultBg }, children: _jsx("text", { children: "No changes to display" }) }));
+            }
+            return _jsx(App, { parsedFiles: parsedFiles });
+        }
+        createRoot(renderer).render(
+        // @ts-ignore - ErrorBoundary class is incompatible with @opentuah/react's ElementClass + React 19 types; works correctly at runtime
+        _jsx(ErrorBoundary, { children: _jsx(AppWithWatch, {}) }));
+    }
+    catch (error) {
+        console.error("Error getting git diff:", error);
+        process.exit(1);
+    }
+});
+if (import.meta.main) {
+    cli.help();
+    cli.version(packageJson.version);
+    cli.parse();
+}