dmux 1.3.3 → 1.5.0

package/dist/DmuxApp.js

@@ -1,13 +1,14 @@
 import React, { useState, useEffect } from 'react';
 import { Box, Text, useInput, useApp } from 'ink';
-import TextInput from 'ink-text-input';
+import CleanTextInput from './CleanTextInput.js';
+import StyledTextInput from './StyledTextInput.js';
 import { execSync } from 'child_process';
 import fs from 'fs/promises';
 import path from 'path';
 import { createRequire } from 'module';
 const require = createRequire(import.meta.url);
 const packageJson = require('../package.json');
-const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile }) => {
+const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile, autoUpdater }) => {
     const [panes, setPanes] = useState([]);
     const [selectedIndex, setSelectedIndex] = useState(0);
     const [showNewPaneDialog, setShowNewPaneDialog] = useState(false);
@@ -25,14 +26,23 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
     const [showFileCopyPrompt, setShowFileCopyPrompt] = useState(false);
     const [currentCommandType, setCurrentCommandType] = useState(null);
     const [runningCommand, setRunningCommand] = useState(false);
+    const [updateInfo, setUpdateInfo] = useState(null);
+    const [showUpdateDialog, setShowUpdateDialog] = useState(false);
+    const [isUpdating, setIsUpdating] = useState(false);
+    const [isLoading, setIsLoading] = useState(true);
     const { exit } = useApp();
     // Track terminal dimensions for responsive layout
     const [terminalWidth, setTerminalWidth] = useState(process.stdout.columns || 80);
     // Load panes and settings on mount and refresh periodically
     useEffect(() => {
+        // Load immediately for initial data
         loadPanes();
         loadSettings();
-        const interval = setInterval(loadPanes, 2000);
+        // Start polling after a short delay to avoid competing with startup
+        let pollingInterval;
+        const startPolling = setTimeout(() => {
+            pollingInterval = setInterval(loadPanes, 3000); // Poll every 3 seconds instead of 2
+        }, 1000); // Wait 1 second before starting polling
         // Handle terminal resize
         const handleResize = () => {
             setTerminalWidth(process.stdout.columns || 80);
@@ -53,142 +63,202 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
         process.on('SIGINT', handleTermination);
         process.on('SIGTERM', handleTermination);
         return () => {
-            clearInterval(interval);
+            clearTimeout(startPolling);
+            if (pollingInterval)
+                clearInterval(pollingInterval);
             process.stdout.removeListener('resize', handleResize);
             process.removeListener('SIGINT', handleTermination);
             process.removeListener('SIGTERM', handleTermination);
         };
     }, []);
+    // Auto-show new pane dialog when starting with no panes
+    useEffect(() => {
+        // Only show the dialog if:
+        // 1. We have no panes
+        // 2. We're not already showing the dialog
+        // 3. We're not showing any other dialogs or prompts
+        if (panes.length === 0 &&
+            !showNewPaneDialog &&
+            !showMergeConfirmation &&
+            !showCloseOptions &&
+            !showCommandPrompt &&
+            !showFileCopyPrompt &&
+            !showUpdateDialog &&
+            !isCreatingPane &&
+            !runningCommand &&
+            !isUpdating) {
+            setShowNewPaneDialog(true);
+        }
+    }, [panes.length, showNewPaneDialog, showMergeConfirmation, showCloseOptions, showCommandPrompt, showFileCopyPrompt, showUpdateDialog, isCreatingPane, runningCommand, isUpdating]);
+    // Check for updates periodically
+    useEffect(() => {
+        if (!autoUpdater)
+            return;
+        const checkForUpdates = async () => {
+            try {
+                const info = await autoUpdater.checkForUpdates();
+                if (await autoUpdater.shouldShowUpdateNotification(info)) {
+                    setUpdateInfo(info);
+                    setShowUpdateDialog(true);
+                }
+            }
+            catch {
+                // Silently ignore update check failures
+            }
+        };
+        // Delay initial update check to avoid slowing startup
+        const initialCheckTimer = setTimeout(() => {
+            checkForUpdates();
+        }, 3000); // Check after 3 seconds
+        // Check for updates every 6 hours
+        const updateInterval = setInterval(checkForUpdates, 6 * 60 * 60 * 1000);
+        return () => {
+            clearTimeout(initialCheckTimer);
+            clearInterval(updateInterval);
+        };
+    }, [autoUpdater]);
     // Monitor Claude status in all panes with proper dependency tracking
     useEffect(() => {
         if (panes.length === 0)
             return;
-        const monitorClaudeStatus = async () => {
-            // Monitor Claude Code status for all panes
-            const updatedPanesWithNulls = await Promise.all(panes.map(async (pane) => {
-                try {
-                    // Skip if recently checked (within 500ms to avoid overlapping checks)
-                    if (pane.lastClaudeCheck && Date.now() - pane.lastClaudeCheck < 500) {
-                        return pane;
-                    }
-                    // First check if pane exists before trying to capture
-                    const paneIds = execSync(`tmux list-panes -F '#{pane_id}'`, {
-                        encoding: 'utf-8',
-                        stdio: 'pipe'
-                    }).trim().split('\n');
-                    if (!paneIds.includes(pane.paneId)) {
-                        // Pane doesn't exist anymore, return unchanged
-                        return pane;
-                    }
-                    // Capture the last 30 lines of the pane for better detection
-                    const captureOutput = execSync(`tmux capture-pane -t '${pane.paneId}' -p -S -30`, { encoding: 'utf-8', stdio: 'pipe' });
-                    // Pattern detection for Claude Code states
-                    // Working patterns - Claude is processing
-                    // The ONLY reliable indicator is "(esc to interrupt)"
-                    const workingPatterns = [
-                        /esc to interrupt/i, // The ONLY reliable indicator that Claude is actively working
-                    ];
-                    // Extract last few lines to check for patterns
-                    const lines = captureOutput.split('\n');
-                    const lastLines = lines.slice(-10).join('\n');
-                    // Check if Claude's input box is present (waiting for input)
-                    const hasInputBox = /╭─+╮/.test(lastLines) && /╰─+╯/.test(lastLines) && /│\s+>\s+.*│/.test(lastLines);
-                    // Permission/attention patterns - needs user input (very forgiving)
-                    const attentionPatterns = [
-                        /\?\s*$/m, // Any line ending with a question mark
-                        /y\/n/i, // Any y/n prompt
-                        /yes.*no/i, // Yes or no prompts
-                        /\ballow\b.*\?/i,
-                        /\bapprove\b.*\?/i,
-                        /\bgrant\b.*\?/i,
-                        /\btrust\b.*\?/i,
-                        /\baccept\b.*\?/i,
-                        /\bcontinue\b.*\?/i,
-                        /\bproceed\b.*\?/i,
-                        /permission/i,
-                        /confirmation/i,
-                        /press.*enter/i,
-                        /waiting for/i,
-                        /are you sure/i,
-                        /would you like/i,
-                        /do you want/i,
-                        /please confirm/i,
-                        /requires.*approval/i,
-                        /needs.*input/i,
-                        /⏵⏵\s*accept edits/i, // Claude's accept edits mode
-                        /shift\+tab to cycle/i, // Claude's interface hints
-                    ];
-                    // Check if Claude is working
-                    const isWorking = workingPatterns.some(pattern => pattern.test(captureOutput));
-                    // Check if Claude needs attention
-                    const needsAttention = attentionPatterns.some(pattern => pattern.test(captureOutput)) || hasInputBox;
-                    // Determine status - working takes precedence
-                    let newStatus = 'idle';
-                    if (isWorking) {
-                        newStatus = 'working';
-                    }
-                    else if (needsAttention && !isWorking) {
-                        // Only show as waiting if NOT working (working takes precedence)
-                        newStatus = 'waiting';
-                    }
-                    // Additional checks for specific Claude states
-                    // If we see "accept edits" without other working indicators, it's waiting
-                    if (/accept edits/i.test(captureOutput) && !/esc to interrupt/i.test(captureOutput)) {
-                        newStatus = 'waiting';
-                    }
-                    // If Claude's input box is visible and no working indicators, it's waiting for input
-                    if (hasInputBox && !isWorking) {
-                        newStatus = 'waiting';
-                    }
-                    // Check for specific Claude question patterns that might not end with ?
-                    const claudeQuestionPatterns = [
-                        /I (can|could|should|would|will|may|might)/i,
-                        /Let me know/i,
-                        /Please (tell|let|inform|advise)/i,
-                        /Would you prefer/i,
-                        /Should I (proceed|continue|go ahead)/i,
-                    ];
-                    if (claudeQuestionPatterns.some(pattern => pattern.test(lastLines)) && !isWorking) {
-                        newStatus = 'waiting';
-                    }
-                    // Return updated pane if status changed
-                    if (pane.claudeStatus !== newStatus) {
+        // Defer Claude monitoring to avoid slowing down startup and dialog interactions
+        const startupDelay = setTimeout(() => {
+            const monitorClaudeStatus = async () => {
+                // Skip monitoring if any dialog is open to avoid UI freezing
+                if (showNewPaneDialog || showMergeConfirmation || showCloseOptions ||
+                    showCommandPrompt || showFileCopyPrompt || showUpdateDialog) {
+                    return;
+                }
+                // Monitor Claude Code status for all panes
+                const updatedPanesWithNulls = await Promise.all(panes.map(async (pane) => {
+                    try {
+                        // Skip if recently checked (within 500ms to avoid overlapping checks)
+                        if (pane.lastClaudeCheck && Date.now() - pane.lastClaudeCheck < 500) {
+                            return pane;
+                        }
+                        // First check if pane exists before trying to capture
+                        const paneIds = execSync(`tmux list-panes -F '#{pane_id}'`, {
+                            encoding: 'utf-8',
+                            stdio: 'pipe'
+                        }).trim().split('\n');
+                        if (!paneIds.includes(pane.paneId)) {
+                            // Pane doesn't exist anymore, return unchanged
+                            return pane;
+                        }
+                        // Capture the last 30 lines of the pane for better detection
+                        const captureOutput = execSync(`tmux capture-pane -t '${pane.paneId}' -p -S -30`, { encoding: 'utf-8', stdio: 'pipe' });
+                        // Pattern detection for Claude Code states
+                        // Working patterns - Claude is processing
+                        // The ONLY reliable indicator is "(esc to interrupt)"
+                        const workingPatterns = [
+                            /esc to interrupt/i, // The ONLY reliable indicator that Claude is actively working
+                        ];
+                        // Extract last few lines to check for patterns
+                        const lines = captureOutput.split('\n');
+                        const lastLines = lines.slice(-10).join('\n');
+                        // Check if Claude's input box is present (waiting for input)
+                        const hasInputBox = /╭─+╮/.test(lastLines) && /╰─+╯/.test(lastLines) && /│\s+>\s+.*│/.test(lastLines);
+                        // Permission/attention patterns - needs user input (very forgiving)
+                        const attentionPatterns = [
+                            /\?\s*$/m, // Any line ending with a question mark
+                            /y\/n/i, // Any y/n prompt
+                            /yes.*no/i, // Yes or no prompts
+                            /\ballow\b.*\?/i,
+                            /\bapprove\b.*\?/i,
+                            /\bgrant\b.*\?/i,
+                            /\btrust\b.*\?/i,
+                            /\baccept\b.*\?/i,
+                            /\bcontinue\b.*\?/i,
+                            /\bproceed\b.*\?/i,
+                            /permission/i,
+                            /confirmation/i,
+                            /press.*enter/i,
+                            /waiting for/i,
+                            /are you sure/i,
+                            /would you like/i,
+                            /do you want/i,
+                            /please confirm/i,
+                            /requires.*approval/i,
+                            /needs.*input/i,
+                            /⏵⏵\s*accept edits/i, // Claude's accept edits mode
+                            /shift\+tab to cycle/i, // Claude's interface hints
+                        ];
+                        // Check if Claude is working
+                        const isWorking = workingPatterns.some(pattern => pattern.test(captureOutput));
+                        // Check if Claude needs attention
+                        const needsAttention = attentionPatterns.some(pattern => pattern.test(captureOutput)) || hasInputBox;
+                        // Determine status - working takes precedence
+                        let newStatus = 'idle';
+                        if (isWorking) {
+                            newStatus = 'working';
+                        }
+                        else if (needsAttention && !isWorking) {
+                            // Only show as waiting if NOT working (working takes precedence)
+                            newStatus = 'waiting';
+                        }
+                        // Additional checks for specific Claude states
+                        // If we see "accept edits" without other working indicators, it's waiting
+                        if (/accept edits/i.test(captureOutput) && !/esc to interrupt/i.test(captureOutput)) {
+                            newStatus = 'waiting';
+                        }
+                        // If Claude's input box is visible and no working indicators, it's waiting for input
+                        if (hasInputBox && !isWorking) {
+                            newStatus = 'waiting';
+                        }
+                        // Check for specific Claude question patterns that might not end with ?
+                        const claudeQuestionPatterns = [
+                            /I (can|could|should|would|will|may|might)/i,
+                            /Let me know/i,
+                            /Please (tell|let|inform|advise)/i,
+                            /Would you prefer/i,
+                            /Should I (proceed|continue|go ahead)/i,
+                        ];
+                        if (claudeQuestionPatterns.some(pattern => pattern.test(lastLines)) && !isWorking) {
+                            newStatus = 'waiting';
+                        }
+                        // Return updated pane if status changed
+                        if (pane.claudeStatus !== newStatus) {
+                            return {
+                                ...pane,
+                                claudeStatus: newStatus,
+                                lastClaudeCheck: Date.now()
+                            };
+                        }
+                        // Just update timestamp
                         return {
                             ...pane,
-                            claudeStatus: newStatus,
                             lastClaudeCheck: Date.now()
                         };
                     }
-                    // Just update timestamp
-                    return {
-                        ...pane,
-                        lastClaudeCheck: Date.now()
-                    };
-                }
-                catch (error) {
-                    // If we can't capture the pane, it might be dead - mark it for removal
-                    return null; // Will be filtered out below
+                    catch (error) {
+                        // If we can't capture the pane, it might be dead - mark it for removal
+                        return null; // Will be filtered out below
+                    }
+                }));
+                // Filter out null values (dead panes) and keep only valid panes
+                const updatedPanes = updatedPanesWithNulls.filter((pane) => pane !== null);
+                // Check if we have changes (including pane removals)
+                const hasChanges = updatedPanes.length !== panes.length ||
+                    updatedPanes.some((pane, index) => pane.claudeStatus !== panes[index]?.claudeStatus);
+                if (hasChanges) {
+                    setPanes(updatedPanes);
+                    // Save to file
+                    await fs.writeFile(panesFile, JSON.stringify(updatedPanes, null, 2));
                 }
-            }));
-            // Filter out null values (dead panes) and keep only valid panes
-            const updatedPanes = updatedPanesWithNulls.filter((pane) => pane !== null);
-            // Check if we have changes (including pane removals)
-            const hasChanges = updatedPanes.length !== panes.length ||
-                updatedPanes.some((pane, index) => pane.claudeStatus !== panes[index]?.claudeStatus);
-            if (hasChanges) {
-                setPanes(updatedPanes);
-                // Save to file
-                await fs.writeFile(panesFile, JSON.stringify(updatedPanes, null, 2));
-            }
-        };
-        // Run monitoring immediately
-        monitorClaudeStatus();
-        // Set up interval for continuous monitoring
-        const claudeInterval = setInterval(monitorClaudeStatus, 1000); // Check every second
+            };
+            // Run monitoring after delay
+            monitorClaudeStatus();
+            // Set up interval for continuous monitoring (less frequent for better performance)
+            const claudeInterval = setInterval(monitorClaudeStatus, 2000); // Check every 2 seconds
+            return () => {
+                clearInterval(claudeInterval);
+            };
+        }, 500); // Wait 500ms before starting monitoring
         return () => {
-            clearInterval(claudeInterval);
+            clearTimeout(startupDelay);
         };
-    }, [panes, panesFile]); // Re-run when panes change
+    }, [panes, panesFile, showNewPaneDialog, showMergeConfirmation, showCloseOptions,
+        showCommandPrompt, showFileCopyPrompt, showUpdateDialog]); // Re-run when panes or dialogs change
     const loadSettings = async () => {
         try {
             const content = await fs.readFile(settingsFile, 'utf-8');
@@ -205,42 +275,58 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
         setProjectSettings(settings);
     };
     const loadPanes = async () => {
+        // Skip loading if any dialog is open to avoid UI freezing
+        if (showNewPaneDialog || showMergeConfirmation || showCloseOptions ||
+            showCommandPrompt || showFileCopyPrompt || showUpdateDialog) {
+            return;
+        }
+        if (isLoading) {
+            // Don't set loading to false immediately - keep it true for initial load
+        }
         try {
             const content = await fs.readFile(panesFile, 'utf-8');
             const loadedPanes = JSON.parse(content);
-            // Filter out dead panes and update titles for active ones
-            const activePanes = loadedPanes.filter(pane => {
-                try {
-                    // Get list of all pane IDs
-                    const paneIds = execSync(`tmux list-panes -F '#{pane_id}'`, {
-                        encoding: 'utf-8',
-                        stdio: 'pipe'
-                    }).trim().split('\n');
-                    // Check if our pane ID exists in the list
-                    if (paneIds.includes(pane.paneId)) {
-                        // Update pane title to match the slug
-                        try {
-                            execSync(`tmux select-pane -t '${pane.paneId}' -T "${pane.slug}"`, { stdio: 'pipe' });
-                        }
-                        catch {
-                            // Ignore if setting title fails
-                        }
-                        return true;
+            // Get all pane IDs in a single call (much faster)
+            let allPaneIds = [];
+            try {
+                allPaneIds = execSync(`tmux list-panes -F '#{pane_id}'`, {
+                    encoding: 'utf-8',
+                    stdio: 'pipe'
+                }).trim().split('\n').filter(id => id);
+            }
+            catch {
+                // No panes or tmux error
+            }
+            // Filter out dead panes
+            const activePanes = loadedPanes.filter(pane => allPaneIds.includes(pane.paneId));
+            // Batch update all pane titles in one go (only if needed)
+            if (activePanes.length > 0) {
+                // Update titles for all active panes at once
+                activePanes.forEach(pane => {
+                    try {
+                        execSync(`tmux select-pane -t '${pane.paneId}' -T "${pane.slug}"`, { stdio: 'pipe' });
                     }
-                    return false;
-                }
-                catch {
-                    return false;
-                }
-            });
+                    catch {
+                        // Ignore if setting title fails
+                    }
+                });
+            }
             setPanes(activePanes);
             // Save cleaned list
             if (activePanes.length !== loadedPanes.length) {
                 await fs.writeFile(panesFile, JSON.stringify(activePanes, null, 2));
             }
+            // Set loading to false after first load
+            if (isLoading) {
+                setIsLoading(false);
+            }
         }
         catch {
             setPanes([]);
+            // Set loading to false even on error
+            if (isLoading) {
+                setIsLoading(false);
+            }
         }
     };
     const getPanePositions = () => {
@@ -272,7 +358,7 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
         return { row, col };
     };
     const findCardInDirection = (currentIndex, direction) => {
-        const totalItems = panes.length + 1; // +1 for "New dmux pane" button
+        const totalItems = panes.length + (isLoading ? 0 : 1); // +1 for "New dmux pane" button when not loading
         const currentPos = getCardGridPosition(currentIndex);
         // Calculate cards per row based on current terminal width
         const cardWidth = 35 + 2; // Card width plus gap
@@ -1479,6 +1565,45 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
             setTimeout(() => setStatusMessage(''), 3000);
         }
     };
+    // Update handling functions
+    const performUpdate = async () => {
+        if (!autoUpdater || !updateInfo)
+            return;
+        try {
+            setIsUpdating(true);
+            setStatusMessage('Updating dmux...');
+            const success = await autoUpdater.performUpdate(updateInfo);
+            if (success) {
+                setStatusMessage('Update completed successfully! Please restart dmux.');
+                setTimeout(() => {
+                    process.exit(0);
+                }, 3000);
+            }
+            else {
+                setStatusMessage('Update failed. Please update manually.');
+                setTimeout(() => setStatusMessage(''), 3000);
+            }
+        }
+        catch (error) {
+            setStatusMessage('Update failed. Please update manually.');
+            setTimeout(() => setStatusMessage(''), 3000);
+        }
+        finally {
+            setIsUpdating(false);
+            setShowUpdateDialog(false);
+        }
+    };
+    const skipUpdate = async () => {
+        if (!autoUpdater || !updateInfo)
+            return;
+        await autoUpdater.skipVersion(updateInfo.latestVersion);
+        setShowUpdateDialog(false);
+        setUpdateInfo(null);
+    };
+    const dismissUpdate = () => {
+        setShowUpdateDialog(false);
+        setUpdateInfo(null);
+    };
     // Cleanup function for exit
     const cleanExit = () => {
         // Clear screen multiple times to ensure no artifacts
@@ -1495,8 +1620,20 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
         exit();
     };
     useInput(async (input, key) => {
-        if (isCreatingPane || runningCommand) {
-            // Disable input while performing operations
+        if (isCreatingPane || runningCommand || isUpdating || isLoading) {
+            // Disable input while performing operations or loading
+            return;
+        }
+        if (showUpdateDialog && updateInfo) {
+            if (input === 'u' || input === 'U') {
+                await performUpdate();
+            }
+            else if (input === 's' || input === 'S') {
+                await skipUpdate();
+            }
+            else if (input === 'l' || input === 'L' || key.escape) {
+                dismissUpdate();
+            }
             return;
         }
         if (showFileCopyPrompt) {
@@ -1645,8 +1782,11 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
         if (input === 'q') {
             cleanExit();
         }
-        else if (input === 'n' || (key.return && selectedIndex === panes.length)) {
+        else if (!isLoading && (input === 'n' || (key.return && selectedIndex === panes.length))) {
+            // Defer state updates slightly to avoid blocking UI
             setShowNewPaneDialog(true);
+            setTimeout(() => setNewPanePrompt(''), 0); // Clear after dialog renders
+            return; // Consume the 'n' keystroke so it doesn't propagate
         }
         else if (input === 'j' && selectedIndex < panes.length) {
             jumpToPane(panes[selectedIndex].paneId);
@@ -1725,20 +1865,23 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
                                     " ",
                                     pane.devUrl.replace(/https?:\/\//, '').substring(0, 15))))))))));
             }),
-            React.createElement(Box, { paddingX: 1, borderStyle: "single", borderColor: selectedIndex === panes.length ? 'green' : 'gray', width: 35, flexShrink: 0 },
-                React.createElement(Text, { color: selectedIndex === panes.length ? 'green' : 'white' }, "+ New dmux pane"))),
-        showNewPaneDialog && (React.createElement(Box, { borderStyle: "round", borderColor: "gray", paddingX: 1 },
-            React.createElement(Box, { flexDirection: "column" },
-                React.createElement(Text, null, "Enter initial Claude prompt (ESC to cancel):"),
-                React.createElement(Box, { marginTop: 1 },
-                    React.createElement(Box, { flexDirection: "column" },
-                        React.createElement(TextInput, { value: newPanePrompt, onChange: setNewPanePrompt, placeholder: "Optional prompt... (@ to reference files)", onSubmit: () => {
-                                createNewPane(newPanePrompt);
-                                setShowNewPaneDialog(false);
-                                setNewPanePrompt('');
-                            } }),
-                        React.createElement(Box, { marginTop: 1 },
-                            React.createElement(Text, { dimColor: true, italic: true }, "Press Ctrl+O to open in $EDITOR for complex multi-line input"))))))),
+            !isLoading && !showNewPaneDialog && (React.createElement(Box, { paddingX: 1, borderStyle: "single", borderColor: selectedIndex === panes.length ? 'green' : 'gray', width: 35, flexShrink: 0 },
+                React.createElement(Text, { color: selectedIndex === panes.length ? 'green' : 'white' }, "+ New dmux pane")))),
+        isLoading && (React.createElement(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 2, marginTop: 1 },
+            React.createElement(Box, { flexDirection: "row", gap: 1 },
+                React.createElement(Text, { color: "cyan" }, "\u23F3"),
+                React.createElement(Text, null, "Loading dmux sessions...")))),
+        showNewPaneDialog && (React.createElement(Box, { flexDirection: "column", marginTop: 1 },
+            React.createElement(Text, null, "Enter initial Claude prompt (ESC to cancel):"),
+            React.createElement(Box, { borderStyle: "round", borderColor: "#E67E22", paddingX: 1, marginTop: 1 },
+                React.createElement(CleanTextInput, { value: newPanePrompt, onChange: setNewPanePrompt, onSubmit: (expandedValue) => {
+                        // Use expanded value if provided (for paste references), otherwise use raw value
+                        createNewPane(expandedValue || newPanePrompt);
+                        setShowNewPaneDialog(false);
+                        setNewPanePrompt('');
+                    } })),
+            React.createElement(Box, { marginTop: 1 },
+                React.createElement(Text, { dimColor: true, italic: true }, "Press Ctrl+O to open in $EDITOR for complex multi-line input")))),
         isCreatingPane && (React.createElement(Box, { borderStyle: "single", borderColor: "yellow", paddingX: 1, marginTop: 1 },
             React.createElement(Text, { color: "yellow" },
                 React.createElement(Text, { bold: true }, "\u23F3 Creating new pane... "),
@@ -1786,7 +1929,7 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
                     " in worktrees"),
                 React.createElement(Text, { dimColor: true }, "(Press Enter with empty input for suggested command, ESC to cancel)"),
                 React.createElement(Box, { marginTop: 1 },
-                    React.createElement(TextInput, { value: commandInput, onChange: setCommandInput, placeholder: showCommandPrompt === 'test' ? 'e.g., npm test, pnpm test' : 'e.g., npm run dev, pnpm dev' }))))),
+                    React.createElement(StyledTextInput, { value: commandInput, onChange: setCommandInput, placeholder: showCommandPrompt === 'test' ? 'e.g., npm test, pnpm test' : 'e.g., npm run dev, pnpm dev' }))))),
         showFileCopyPrompt && (React.createElement(Box, { borderStyle: "double", borderColor: "yellow", paddingX: 1, marginTop: 1 },
             React.createElement(Box, { flexDirection: "column" },
                 React.createElement(Text, { color: "yellow", bold: true }, "First Run Setup"),
@@ -1797,6 +1940,28 @@ const DmuxApp = ({ dmuxDir, panesFile, projectName, sessionName, settingsFile })
         runningCommand && (React.createElement(Box, { borderStyle: "single", borderColor: "blue", paddingX: 1, marginTop: 1 },
             React.createElement(Text, { color: "blue" },
                 React.createElement(Text, { bold: true }, "\u25B6 Running command...")))),
+        isUpdating && (React.createElement(Box, { borderStyle: "single", borderColor: "yellow", paddingX: 1, marginTop: 1 },
+            React.createElement(Text, { color: "yellow" },
+                React.createElement(Text, { bold: true }, "\u2B07 Updating dmux...")))),
+        showUpdateDialog && updateInfo && (React.createElement(Box, { borderStyle: "double", borderColor: "green", paddingX: 1, marginTop: 1 },
+            React.createElement(Box, { flexDirection: "column" },
+                React.createElement(Text, { color: "green", bold: true }, "\uD83C\uDF89 dmux Update Available!"),
+                React.createElement(Text, null,
+                    "Current version: ",
+                    React.createElement(Text, { color: "cyan" }, updateInfo.currentVersion)),
+                React.createElement(Text, null,
+                    "Latest version: ",
+                    React.createElement(Text, { color: "green" }, updateInfo.latestVersion)),
+                updateInfo.installMethod === 'global' && updateInfo.packageManager && (React.createElement(Text, null,
+                    "Detected global install via: ",
+                    React.createElement(Text, { color: "yellow" }, updateInfo.packageManager))),
+                React.createElement(Box, { marginTop: 1 }, updateInfo.installMethod === 'global' && updateInfo.packageManager ? (React.createElement(Text, null, "[U]pdate now \u2022 [S]kip this version \u2022 [L]ater")) : (React.createElement(Text, null,
+                    "Manual update required: ",
+                    React.createElement(Text, { color: "cyan" },
+                        updateInfo.packageManager || 'npm',
+                        " update -g dmux"),
+                    '\n',
+                    "[S]kip this version \u2022 [L]ater")))))),
         statusMessage && (React.createElement(Box, { marginTop: 1 },
             React.createElement(Text, { color: "green" }, statusMessage))),
         !showNewPaneDialog && !showCommandPrompt && (React.createElement(Box, { marginTop: 1, flexDirection: "column" },