codeep 1.0.106 → 1.0.108

package/dist/components/AgentProgress.d.ts

@@ -1,5 +1,6 @@
 /**
  * Agent progress display component
+ * Optimized with isolated spinner animation and memoization
  */
 import React from 'react';
 import { ActionLog } from '../utils/tools';

package/dist/components/AgentProgress.js

@@ -1,22 +1,27 @@
 import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 /**
  * Agent progress display component
+ * Optimized with isolated spinner animation and memoization
  */
-import { useState, useEffect, useRef } from 'react';
+import { useState, useEffect, useRef, memo } from 'react';
 import { Box, Text } from 'ink';
 // Spinner frames for animation (no emojis)
 const SPINNER_FRAMES = ['/', '-', '\\', '|'];
-export const AgentProgress = ({ isRunning, iteration, maxIterations, actions, currentThinking, dryRun, }) => {
-    const [spinnerFrame, setSpinnerFrame] = useState(0);
-    // Animate spinner when running
+/**
+ * Isolated spinner component - animation doesn't cause parent re-renders
+ */
+const AgentSpinner = memo(({ color = '#f02a30' }) => {
+    const [frame, setFrame] = useState(0);
     useEffect(() => {
-        if (!isRunning)
-            return;
         const timer = setInterval(() => {
-            setSpinnerFrame(f => (f + 1) % SPINNER_FRAMES.length);
+            setFrame(f => (f + 1) % SPINNER_FRAMES.length);
         }, 150);
         return () => clearInterval(timer);
-    }, [isRunning]);
+    }, []);
+    return _jsxs(Text, { color: color, children: ["[", SPINNER_FRAMES[frame], "]"] });
+});
+AgentSpinner.displayName = 'AgentSpinner';
+export const AgentProgress = memo(({ isRunning, iteration, maxIterations, actions, currentThinking, dryRun, }) => {
     // Don't show anything if not running and no actions
     if (!isRunning && actions.length === 0) {
         return null;
@@ -40,8 +45,9 @@ export const AgentProgress = ({ isRunning, iteration, maxIterations, actions, cu
         deleted: actions.filter(a => a.type === 'delete' && a.result === 'success').length,
     };
     const totalFileChanges = fileChanges.created + fileChanges.modified + fileChanges.deleted;
-    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: dryRun ? 'yellow' : '#f02a30', paddingX: 1, marginY: 1, children: [_jsx(Box, { children: isRunning ? (_jsxs(_Fragment, { children: [_jsxs(Text, { color: dryRun ? 'yellow' : '#f02a30', children: ["[", SPINNER_FRAMES[spinnerFrame], "]"] }), _jsxs(Text, { color: dryRun ? 'yellow' : '#f02a30', bold: true, children: [' ', dryRun ? 'DRY RUN' : 'AGENT', ' '] }), _jsx(Text, { color: "cyan", children: "|" }), _jsxs(Text, { color: "cyan", children: [" step ", iteration] }), _jsx(Text, { color: "cyan", children: " | " }), actionCounts.reads > 0 && _jsxs(Text, { color: "blue", children: [actionCounts.reads, "R "] }), actionCounts.writes > 0 && _jsxs(Text, { color: "green", children: [actionCounts.writes, "W "] }), actionCounts.edits > 0 && _jsxs(Text, { color: "yellow", children: [actionCounts.edits, "E "] }), actionCounts.commands > 0 && _jsxs(Text, { color: "magenta", children: [actionCounts.commands, "C "] }), actionCounts.searches > 0 && _jsxs(Text, { color: "cyan", children: [actionCounts.searches, "S "] }), actions.length === 0 && _jsx(Text, { color: "cyan", children: "0 actions" })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { color: "green", bold: true, children: "[DONE] " }), _jsx(Text, { children: "Agent completed" }), _jsx(Text, { color: "cyan", children: " | " }), _jsxs(Text, { color: "white", children: [actions.length, " actions"] })] })) }), isRunning && currentAction && (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "white", bold: true, children: "Now: " }), _jsxs(Text, { color: getActionColor(currentAction.type), children: [getActionLabel(currentAction.type), " "] }), _jsx(Text, { color: "white", children: formatTarget(currentAction.target) })] })), _jsx(Text, { color: "cyan", children: '─'.repeat(50) }), recentActions.length > 1 && (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: "cyan", dimColor: true, children: "Recent:" }), recentActions.slice(0, -1).map((action, i) => (_jsx(ActionItem, { action: action }, i)))] })), isRunning && totalFileChanges > 0 && (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "cyan", children: "Changes: " }), fileChanges.created > 0 && _jsxs(Text, { color: "green", children: ["+", fileChanges.created, " "] }), fileChanges.modified > 0 && _jsxs(Text, { color: "yellow", children: ["~", fileChanges.modified, " "] }), fileChanges.deleted > 0 && _jsxs(Text, { color: "red", children: ["-", fileChanges.deleted] })] })), isRunning && currentThinking && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "cyan", wrap: "truncate-end", children: ["> ", currentThinking.slice(0, 80), currentThinking.length > 80 ? '...' : ''] }) })), isRunning && (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "cyan", children: "Press " }), _jsx(Text, { color: "#f02a30", children: "Esc" }), _jsx(Text, { color: "cyan", children: " to stop" })] })), !isRunning && totalFileChanges > 0 && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { bold: true, children: "File Changes:" }), fileChanges.created > 0 && (_jsxs(Text, { color: "green", children: ["  + ", fileChanges.created, " file(s) created"] })), fileChanges.modified > 0 && (_jsxs(Text, { color: "yellow", children: ["  ~ ", fileChanges.modified, " file(s) modified"] })), fileChanges.deleted > 0 && (_jsxs(Text, { color: "red", children: ["  - ", fileChanges.deleted, " file(s) deleted"] }))] }))] }));
-};
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: dryRun ? 'yellow' : '#f02a30', paddingX: 1, marginY: 1, children: [_jsx(Box, { children: isRunning ? (_jsxs(_Fragment, { children: [_jsx(AgentSpinner, { color: dryRun ? 'yellow' : '#f02a30' }), _jsxs(Text, { color: dryRun ? 'yellow' : '#f02a30', bold: true, children: [' ', dryRun ? 'DRY RUN' : 'AGENT', ' '] }), _jsx(Text, { color: "cyan", children: "|" }), _jsxs(Text, { color: "cyan", children: [" step ", iteration] }), _jsx(Text, { color: "cyan", children: " | " }), actionCounts.reads > 0 && _jsxs(Text, { color: "blue", children: [actionCounts.reads, "R "] }), actionCounts.writes > 0 && _jsxs(Text, { color: "green", children: [actionCounts.writes, "W "] }), actionCounts.edits > 0 && _jsxs(Text, { color: "yellow", children: [actionCounts.edits, "E "] }), actionCounts.commands > 0 && _jsxs(Text, { color: "magenta", children: [actionCounts.commands, "C "] }), actionCounts.searches > 0 && _jsxs(Text, { color: "cyan", children: [actionCounts.searches, "S "] }), actions.length === 0 && _jsx(Text, { color: "cyan", children: "0 actions" })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { color: "green", bold: true, children: "[DONE] " }), _jsx(Text, { children: "Agent completed" }), _jsx(Text, { color: "cyan", children: " | " }), _jsxs(Text, { color: "white", children: [actions.length, " actions"] })] })) }), isRunning && currentAction && (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "white", bold: true, children: "Now: " }), _jsxs(Text, { color: getActionColor(currentAction.type), children: [getActionLabel(currentAction.type), " "] }), _jsx(Text, { color: "white", children: formatTarget(currentAction.target) })] })), _jsx(Text, { color: "cyan", children: '─'.repeat(50) }), recentActions.length > 1 && (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: "cyan", dimColor: true, children: "Recent:" }), recentActions.slice(0, -1).map((action, i) => (_jsx(ActionItem, { action: action }, i)))] })), isRunning && totalFileChanges > 0 && (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "cyan", children: "Changes: " }), fileChanges.created > 0 && _jsxs(Text, { color: "green", children: ["+", fileChanges.created, " "] }), fileChanges.modified > 0 && _jsxs(Text, { color: "yellow", children: ["~", fileChanges.modified, " "] }), fileChanges.deleted > 0 && _jsxs(Text, { color: "red", children: ["-", fileChanges.deleted] })] })), isRunning && currentThinking && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: "cyan", wrap: "truncate-end", children: ["> ", currentThinking.slice(0, 80), currentThinking.length > 80 ? '...' : ''] }) })), isRunning && (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: "cyan", children: "Press " }), _jsx(Text, { color: "#f02a30", children: "Esc" }), _jsx(Text, { color: "cyan", children: " to stop" })] })), !isRunning && totalFileChanges > 0 && (_jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsx(Text, { bold: true, children: "File Changes:" }), fileChanges.created > 0 && (_jsxs(Text, { color: "green", children: ["  + ", fileChanges.created, " file(s) created"] })), fileChanges.modified > 0 && (_jsxs(Text, { color: "yellow", children: ["  ~ ", fileChanges.modified, " file(s) modified"] })), fileChanges.deleted > 0 && (_jsxs(Text, { color: "red", children: ["  - ", fileChanges.deleted, " file(s) deleted"] }))] }))] }));
+});
+AgentProgress.displayName = 'AgentProgress';
 // Get file extension for language detection
 const getFileExtension = (filename) => {
     const parts = filename.split('.');
@@ -140,7 +146,7 @@ const isSectionBreak = (line, prevLine) => {
     return false;
 };
 const LINES_PER_CHUNK = 10; // Show 10 lines at a time
-export const LiveCodeStream = ({ actions, isRunning, terminalWidth = 80 }) => {
+export const LiveCodeStream = memo(({ actions, isRunning, terminalWidth = 80 }) => {
     // Track how many lines we've shown so far
     const [visibleLineCount, setVisibleLineCount] = useState(LINES_PER_CHUNK);
     const lastActionIdRef = useRef('');
@@ -174,7 +180,7 @@ export const LiveCodeStream = ({ actions, isRunning, terminalWidth = 80 }) => {
             return () => clearTimeout(timer);
         }
     }, [isRunning, currentAction, visibleLineCount]);
-    // Only show for write/edit actions with content while running
+    // Only show for write/edit actions with content
     if (!isRunning || !currentAction)
         return null;
     if (currentAction.type !== 'write' && currentAction.type !== 'edit')
@@ -188,6 +194,18 @@ export const LiveCodeStream = ({ actions, isRunning, terminalWidth = 80 }) => {
     const langLabel = getLanguageLabel(ext);
     const allLines = code.split('\n');
     const totalLines = allLines.length;
+    // When action completes, show compact summary with blank lines to overwrite ghost
+    const isCompleted = currentAction.result === 'success' || currentAction.result === 'error';
+    if (isCompleted) {
+        const statusIcon = currentAction.result === 'success' ? '✓' : '✗';
+        const statusColor = currentAction.result === 'success' ? 'green' : 'red';
+        const actionVerb = currentAction.type === 'write' ? 'Created' : 'Edited';
+        // Calculate how many blank lines we need to overwrite the previous code display
+        // Header (2) + code lines shown + footer (1) + loading indicator (1)
+        const previousHeight = Math.min(visibleLineCount, totalLines) + 4;
+        const blankLines = Math.max(0, previousHeight - 1); // -1 for our summary line
+        return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Text, { color: statusColor, children: [statusIcon, " ", actionVerb, " ", filename, " (", totalLines, " lines)"] }), Array.from({ length: blankLines }).map((_, i) => (_jsx(Text, { children: " " }, i)))] }));
+    }
     const actionLabel = currentAction.type === 'write' ? '✨ Creating' : '✏️  Editing';
     const actionColor = currentAction.type === 'write' ? 'green' : 'yellow';
     // Show lines up to visibleLineCount
@@ -199,7 +217,8 @@ export const LiveCodeStream = ({ actions, isRunning, terminalWidth = 80 }) => {
                 const lineNum = i + 1;
                 return (_jsxs(Text, { children: [_jsxs(Text, { color: "cyan", dimColor: true, children: [String(lineNum).padStart(4, ' '), " \u2502", ' '] }), _jsx(Text, { color: getCodeColor(line, ext), children: line.slice(0, 80) }), line.length > 80 && _jsx(Text, { color: "cyan", children: "\u2026" })] }, `line-${i}`));
             }), hasMoreLines && (_jsxs(Text, { color: "cyan", dimColor: true, children: ['     ', "\u2502 ... ", totalLines - visibleLineCount, " more lines loading..."] })), _jsx(Text, { color: actionColor, children: '─'.repeat(lineWidth) })] }));
-};
+});
+LiveCodeStream.displayName = 'LiveCodeStream';
 // Helper functions for action display
 const getActionColor = (type) => {
     switch (type) {
@@ -257,7 +276,7 @@ const ActionItem = ({ action }) => {
     };
     return (_jsxs(Text, { children: [getStatusIndicator(), ' ', _jsx(Text, { color: getActionColor(action.type), children: getActionLabel(action.type).padEnd(10) }), ' ', _jsx(Text, { color: "cyan", children: formatTarget(action.target) })] }));
 };
-export const AgentSummary = ({ success, iterations, actions, error, aborted, }) => {
+export const AgentSummary = memo(({ success, iterations, actions, error, aborted, }) => {
     const filesWritten = actions.filter(a => a.type === 'write' && a.result === 'success');
     const filesEdited = actions.filter(a => a.type === 'edit' && a.result === 'success');
     const filesDeleted = actions.filter(a => a.type === 'delete' && a.result === 'success');
@@ -267,7 +286,8 @@ export const AgentSummary = ({ success, iterations, actions, error, aborted, })
     const hasFileChanges = filesWritten.length > 0 || filesEdited.length > 0 ||
         filesDeleted.length > 0 || dirsCreated.length > 0;
     return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: success ? 'green' : aborted ? 'yellow' : 'red', padding: 1, marginY: 1, children: [_jsxs(Box, { children: [success ? (_jsx(Text, { color: "green", bold: true, children: "[OK] Agent completed" })) : aborted ? (_jsx(Text, { color: "yellow", bold: true, children: "[--] Agent stopped" })) : (_jsx(Text, { color: "red", bold: true, children: "[!!] Agent failed" })), _jsxs(Text, { color: "cyan", children: [" | ", iterations, " iterations | ", actions.length, " actions"] })] }), error && (_jsxs(Text, { color: "red", children: ["Error: ", error] })), hasFileChanges && (_jsxs(_Fragment, { children: [_jsx(Text, { color: "cyan", children: '─'.repeat(40) }), _jsx(Text, { bold: true, children: "Changes:" }), filesWritten.length > 0 && (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: "green", children: ["+ Created (", filesWritten.length, "):"] }), filesWritten.map((f, i) => (_jsxs(Text, { color: "green", children: ["    ", f.target] }, i)))] })), filesEdited.length > 0 && (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: "yellow", children: ["~ Modified (", filesEdited.length, "):"] }), filesEdited.map((f, i) => (_jsxs(Text, { color: "yellow", children: ["    ", f.target] }, i)))] })), filesDeleted.length > 0 && (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Text, { color: "red", children: ["- Deleted (", filesDeleted.length, "):"] }), filesDeleted.map((f, i) => (_jsxs(Text, { color: "red", children: ["    ", f.target] }, i)))] })), dirsCreated.length > 0 && (_jsxs(Text, { color: "blue", children: ["+ ", dirsCreated.length, " director(ies) created"] }))] })), commandsRun.length > 0 && (_jsxs(Text, { color: "magenta", children: [commandsRun.length, " command(s) executed"] })), errors.length > 0 && (_jsxs(Text, { color: "red", children: [errors.length, " error(s) occurred"] }))] }));
-};
+});
+AgentSummary.displayName = 'AgentSummary';
 export const ChangesList = ({ actions }) => {
     const writes = actions.filter(a => a.type === 'write' && a.result === 'success');
     const edits = actions.filter(a => a.type === 'edit' && a.result === 'success');

package/dist/components/Loading.d.ts

@@ -2,7 +2,15 @@ import React from 'react';
 interface LoadingProps {
     isStreaming?: boolean;
 }
+/**
+ * Loading indicator with isolated animation
+ * Parent component won't re-render when spinner animates
+ */
 export declare const Loading: React.FC<LoadingProps>;
+/**
+ * Simple inline spinner for smaller spaces
+ * Also uses isolated animation
+ */
 export declare const InlineSpinner: React.FC<{
     text?: string;
 }>;

package/dist/components/Loading.js

@@ -1,31 +1,52 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
-import { useState, useEffect } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState, useEffect, memo } from 'react';
 import { Text, Box } from 'ink';
-// Spinner frames
+// Spinner frames - Braille pattern for smooth animation
 const SPINNER = ['⣾', '⣽', '⣻', '⢿', '⡿', '⣟', '⣯', '⣷'];
-export const Loading = ({ isStreaming = false }) => {
-    const [tick, setTick] = useState(0);
+/**
+ * Isolated spinner animation component
+ * Only this component re-renders during animation, not the parent
+ */
+const AnimatedSpinner = memo(() => {
+    const [frame, setFrame] = useState(0);
     useEffect(() => {
-        // Force re-render every 100ms to animate even when parent doesn't update
         const timer = setInterval(() => {
-            setTick(t => t + 1);
+            setFrame(f => (f + 1) % SPINNER.length);
         }, 100);
         return () => clearInterval(timer);
     }, []);
-    const spinnerFrame = tick % SPINNER.length;
-    const dotsCount = (Math.floor(tick / 3) % 4); // 0, 1, 2, 3 dots cycling
-    const dots = '.'.repeat(dotsCount);
-    const message = isStreaming ? 'Writing' : 'Thinking';
-    return (_jsx(Box, { paddingLeft: 2, paddingY: 0, children: _jsxs(Text, { color: "#f02a30", bold: true, children: [SPINNER[spinnerFrame], " ", message, dots] }) }));
-};
-// Simple inline spinner for smaller spaces
-export const InlineSpinner = ({ text = 'Loading' }) => {
-    const [tick, setTick] = useState(0);
+    return _jsx(Text, { color: "#f02a30", children: SPINNER[frame] });
+});
+AnimatedSpinner.displayName = 'AnimatedSpinner';
+/**
+ * Animated dots component
+ * Isolated animation state
+ */
+const AnimatedDots = memo(() => {
+    const [count, setCount] = useState(0);
     useEffect(() => {
         const timer = setInterval(() => {
-            setTick(t => t + 1);
-        }, 80);
+            setCount(c => (c + 1) % 4);
+        }, 300);
         return () => clearInterval(timer);
     }, []);
-    return (_jsxs(Text, { children: [_jsxs(Text, { color: "#f02a30", children: [SPINNER[tick % SPINNER.length], " "] }), _jsx(Text, { children: text })] }));
-};
+    return _jsx(Text, { color: "#f02a30", children: '.'.repeat(count) });
+});
+AnimatedDots.displayName = 'AnimatedDots';
+/**
+ * Loading indicator with isolated animation
+ * Parent component won't re-render when spinner animates
+ */
+export const Loading = memo(({ isStreaming = false }) => {
+    const message = isStreaming ? 'Writing' : 'Thinking';
+    return (_jsxs(Box, { paddingLeft: 2, paddingY: 0, children: [_jsx(AnimatedSpinner, {}), _jsxs(Text, { color: "#f02a30", bold: true, children: [" ", message] }), _jsx(AnimatedDots, {})] }));
+});
+Loading.displayName = 'Loading';
+/**
+ * Simple inline spinner for smaller spaces
+ * Also uses isolated animation
+ */
+export const InlineSpinner = memo(({ text = 'Loading' }) => {
+    return (_jsxs(Text, { children: [_jsx(AnimatedSpinner, {}), _jsxs(Text, { children: [" ", text] })] }));
+});
+InlineSpinner.displayName = 'InlineSpinner';

package/dist/components/MessageList.d.ts

@@ -3,8 +3,13 @@ import { Message } from '../config/index';
 interface MessageListProps {
     messages: Message[];
     streamingContent?: string;
-    scrollOffset: number;
-    terminalHeight: number;
+    scrollOffset?: number;
+    terminalHeight?: number;
 }
+/**
+ * Message list with optimized rendering
+ * Uses Static component for stable scroll position
+ * Uses content-based keys instead of index for better React reconciliation
+ */
 export declare const MessageList: React.FC<MessageListProps>;
 export {};

package/dist/components/MessageList.js

@@ -1,8 +1,25 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo } from 'react';
 import { Box, Static } from 'ink';
 import { MessageView } from './Message.js';
-export const MessageList = ({ messages, }) => {
-    // Use Static component to prevent messages from re-rendering on every keystroke
-    // This keeps the scroll position stable when typing in input field
-    return (_jsx(Box, { flexDirection: "column", children: _jsx(Static, { items: messages, children: (msg, index) => (_jsx(MessageView, { role: msg.role, content: msg.content }, index)) }) }));
+import { StreamingMessage } from './StreamingMessage.js';
+/**
+ * Generate unique key for message based on content and position
+ * More stable than index-based keys
+ */
+const getMessageKey = (msg, index) => {
+    // Use hash of first 50 chars + role + index for uniqueness
+    const contentHash = msg.content.slice(0, 50).split('').reduce((acc, char) => {
+        return ((acc << 5) - acc) + char.charCodeAt(0);
+    }, 0);
+    return `${msg.role}-${index}-${Math.abs(contentHash)}`;
 };
+/**
+ * Message list with optimized rendering
+ * Uses Static component for stable scroll position
+ * Uses content-based keys instead of index for better React reconciliation
+ */
+export const MessageList = memo(({ messages, streamingContent, }) => {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: messages, children: (msg, index) => (_jsx(MessageView, { role: msg.role, content: msg.content }, getMessageKey(msg, index))) }), streamingContent && (_jsx(StreamingMessage, { content: streamingContent }))] }));
+});
+MessageList.displayName = 'MessageList';

package/dist/components/Spinner.d.ts

@@ -0,0 +1,34 @@
+/**
+ * Isolated Spinner component
+ * Animation state is local - doesn't cause parent re-renders
+ */
+import React from 'react';
+declare const SPINNERS: {
+    dots: string[];
+    line: string[];
+    simple: string[];
+    arrow: string[];
+    bounce: string[];
+};
+type SpinnerType = keyof typeof SPINNERS;
+interface SpinnerProps {
+    type?: SpinnerType;
+    color?: string;
+    interval?: number;
+    prefix?: string;
+    suffix?: string;
+}
+/**
+ * Spinner with isolated animation state
+ * Parent component won't re-render when spinner frame changes
+ */
+export declare const Spinner: React.FC<SpinnerProps>;
+/**
+ * Static spinner character (no animation)
+ * Use when you want consistent display without flickering
+ */
+export declare const StaticSpinner: React.FC<{
+    char?: string;
+    color?: string;
+}>;
+export default Spinner;

package/dist/components/Spinner.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Isolated Spinner component
+ * Animation state is local - doesn't cause parent re-renders
+ */
+import { useState, useEffect, memo } from 'react';
+import { Text } from 'ink';
+// Different spinner styles
+const SPINNERS = {
+    dots: ['⠋', '⠙', '⠹', '⠸', '⠼', '⠴', '⠦', '⠧', '⠇', '⠏'],
+    line: ['/', '-', '\\', '|'],
+    simple: ['·', '•', '●', '•'],
+    arrow: ['←', '↖', '↑', '↗', '→', '↘', '↓', '↙'],
+    bounce: ['⠁', '⠂', '⠄', '⠂'],
+};
+/**
+ * Spinner with isolated animation state
+ * Parent component won't re-render when spinner frame changes
+ */
+export const Spinner = memo(({ type = 'line', color = '#f02a30', interval = 100, prefix = '', suffix = '', }) => {
+    const [frame, setFrame] = useState(0);
+    const frames = SPINNERS[type];
+    useEffect(() => {
+        const timer = setInterval(() => {
+            setFrame(f => (f + 1) % frames.length);
+        }, interval);
+        return () => clearInterval(timer);
+    }, [frames.length, interval]);
+    return (_jsxs(Text, { children: [prefix, _jsx(Text, { color: color, children: frames[frame] }), suffix] }));
+});
+Spinner.displayName = 'Spinner';
+/**
+ * Static spinner character (no animation)
+ * Use when you want consistent display without flickering
+ */
+export const StaticSpinner = memo(({ char = '●', color = '#f02a30', }) => (_jsx(Text, { color: color, children: char })));
+StaticSpinner.displayName = 'StaticSpinner';
+export default Spinner;

package/dist/components/StreamingMessage.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Streaming message component
+ * Isolates streaming state from main App to reduce re-renders
+ */
+import React from 'react';
+interface StreamingMessageProps {
+    content: string;
+}
+/**
+ * Displays streaming content as it arrives
+ * Wrapped in memo to prevent unnecessary re-renders when content hasn't changed
+ */
+export declare const StreamingMessage: React.FC<StreamingMessageProps>;
+export default StreamingMessage;

package/dist/components/StreamingMessage.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Streaming message component
+ * Isolates streaming state from main App to reduce re-renders
+ */
+import { memo } from 'react';
+import { Box } from 'ink';
+import { MessageView } from './Message.js';
+/**
+ * Displays streaming content as it arrives
+ * Wrapped in memo to prevent unnecessary re-renders when content hasn't changed
+ */
+export const StreamingMessage = memo(({ content }) => {
+    if (!content)
+        return null;
+    return (_jsx(Box, { flexDirection: "column", children: _jsx(MessageView, { role: "assistant", content: content }) }));
+});
+StreamingMessage.displayName = 'StreamingMessage';
+export default StreamingMessage;

package/dist/hooks/index.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Custom hooks for Codeep
+ */
+export { useAgent } from './useAgent';

package/dist/hooks/index.js

@@ -0,0 +1,4 @@
+/**
+ * Custom hooks for Codeep
+ */
+export { useAgent } from './useAgent.js';

package/dist/hooks/useAgent.d.ts

@@ -0,0 +1,29 @@
+/**
+ * useAgent hook - isolates agent state management from main App
+ * Reduces re-renders in App component when agent state changes
+ */
+import { AgentResult } from '../utils/agent';
+import { ActionLog } from '../utils/tools';
+import { ProjectContext } from '../utils/project';
+import { Message } from '../config/index';
+interface UseAgentOptions {
+    projectContext: ProjectContext | null;
+    hasWriteAccess: boolean;
+    messages: Message[];
+    projectPath: string;
+    onMessageAdd: (message: Message) => void;
+    notify: (msg: string, duration?: number) => void;
+}
+interface UseAgentReturn {
+    isAgentRunning: boolean;
+    agentIteration: number;
+    agentActions: ActionLog[];
+    agentThinking: string;
+    agentResult: AgentResult | null;
+    agentDryRun: boolean;
+    startAgent: (prompt: string, dryRun?: boolean) => Promise<void>;
+    stopAgent: () => void;
+    clearAgentState: () => void;
+}
+export declare function useAgent({ projectContext, hasWriteAccess, messages, projectPath, onMessageAdd, notify, }: UseAgentOptions): UseAgentReturn;
+export default useAgent;

package/dist/hooks/useAgent.js

@@ -0,0 +1,148 @@
+/**
+ * useAgent hook - isolates agent state management from main App
+ * Reduces re-renders in App component when agent state changes
+ */
+import { useState, useCallback, useRef } from 'react';
+import { runAgent, formatAgentResult } from '../utils/agent.js';
+import { createActionLog } from '../utils/tools.js';
+import { autoSaveSession } from '../config/index.js';
+export function useAgent({ projectContext, hasWriteAccess, messages, projectPath, onMessageAdd, notify, }) {
+    const [isAgentRunning, setIsAgentRunning] = useState(false);
+    const [agentIteration, setAgentIteration] = useState(0);
+    const [agentActions, setAgentActions] = useState([]);
+    const [agentThinking, setAgentThinking] = useState('');
+    const [agentResult, setAgentResult] = useState(null);
+    const [agentDryRun, setAgentDryRun] = useState(false);
+    const abortControllerRef = useRef(null);
+    const clearAgentState = useCallback(() => {
+        setAgentResult(null);
+        setAgentActions([]);
+        setAgentThinking('');
+        setAgentIteration(0);
+    }, []);
+    const stopAgent = useCallback(() => {
+        abortControllerRef.current?.abort();
+    }, []);
+    const startAgent = useCallback(async (prompt, dryRun = false) => {
+        if (!projectContext) {
+            notify('Agent mode requires project context. Run in a project directory.');
+            return;
+        }
+        if (!hasWriteAccess && !dryRun) {
+            notify('Agent mode requires write access. Grant permission first or use /agent-dry');
+            return;
+        }
+        // Reset agent state
+        setIsAgentRunning(true);
+        setAgentIteration(0);
+        setAgentActions([]);
+        setAgentThinking('');
+        setAgentResult(null);
+        setAgentDryRun(dryRun);
+        // Add user message
+        const userMessage = {
+            role: 'user',
+            content: dryRun ? `[DRY RUN] ${prompt}` : `[AGENT] ${prompt}`
+        };
+        onMessageAdd(userMessage);
+        const controller = new AbortController();
+        abortControllerRef.current = controller;
+        try {
+            const result = await runAgent(prompt, projectContext, {
+                dryRun,
+                onIteration: (iteration) => {
+                    setAgentIteration(iteration);
+                },
+                onToolCall: (tool) => {
+                    const toolName = tool.tool.toLowerCase().replace(/-/g, '_');
+                    let details;
+                    if (toolName === 'write_file' && tool.parameters.content) {
+                        details = tool.parameters.content;
+                    }
+                    else if (toolName === 'edit_file' && tool.parameters.new_text) {
+                        details = tool.parameters.new_text;
+                    }
+                    const actionLog = {
+                        type: toolName === 'write_file' ? 'write' :
+                            toolName === 'edit_file' ? 'edit' :
+                                toolName === 'read_file' ? 'read' :
+                                    toolName === 'delete_file' ? 'delete' :
+                                        toolName === 'execute_command' ? 'command' :
+                                            toolName === 'search_code' ? 'search' :
+                                                toolName === 'list_files' ? 'list' :
+                                                    toolName === 'create_directory' ? 'mkdir' :
+                                                        toolName === 'fetch_url' ? 'fetch' : 'command',
+                        target: tool.parameters.path ||
+                            tool.parameters.command ||
+                            tool.parameters.pattern ||
+                            tool.parameters.url || 'unknown',
+                        result: 'success',
+                        details,
+                        timestamp: Date.now(),
+                    };
+                    setAgentActions(prev => [...prev, actionLog]);
+                },
+                onToolResult: (result, toolCall) => {
+                    const actionLog = createActionLog(toolCall, result);
+                    setAgentActions(prev => {
+                        const updated = [...prev];
+                        if (updated.length > 0) {
+                            updated[updated.length - 1] = actionLog;
+                        }
+                        return updated;
+                    });
+                },
+                onThinking: (text) => {
+                    const cleanText = text
+                        .replace(/<think>[\s\S]*?<\/think>/gi, '')
+                        .replace(/<tool_call>[\s\S]*?<\/tool_call>/gi, '')
+                        .replace(/<toolcall>[\s\S]*?<\/toolcall>/gi, '')
+                        .trim();
+                    if (cleanText) {
+                        setAgentThinking(prev => prev + cleanText);
+                    }
+                },
+                abortSignal: controller.signal,
+            });
+            setAgentResult(result);
+            // Add agent summary as assistant message
+            const summaryMessage = {
+                role: 'assistant',
+                content: result.finalResponse || formatAgentResult(result),
+            };
+            onMessageAdd(summaryMessage);
+            // Auto-save session
+            autoSaveSession([...messages, userMessage, summaryMessage], projectPath);
+            if (result.success) {
+                notify(`Agent completed: ${result.actions.length} action(s)`);
+            }
+            else if (result.aborted) {
+                notify('Agent stopped by user');
+            }
+            else {
+                notify(`Agent failed: ${result.error}`);
+            }
+        }
+        catch (error) {
+            const err = error;
+            notify(`Agent error: ${err.message}`);
+        }
+        finally {
+            setIsAgentRunning(false);
+            abortControllerRef.current = null;
+            setAgentThinking('');
+        }
+    }, [projectContext, hasWriteAccess, messages, projectPath, onMessageAdd, notify]);
+    return {
+        isAgentRunning,
+        agentIteration,
+        agentActions,
+        agentThinking,
+        agentResult,
+        agentDryRun,
+        startAgent,
+        stopAgent,
+        clearAgentState,
+    };
+}
+export default useAgent;

package/dist/utils/terminal.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Terminal utilities for better rendering control
+ * Implements DEC Mode 2026 (Synchronized Output) and other optimizations
+ */
+import { WriteStream } from 'tty';
+/**
+ * Check if terminal supports synchronized output (DEC 2026)
+ * Modern terminals: Ghostty, iTerm2 3.5+, Kitty, WezTerm, VSCode 1.80+
+ */
+export declare function supportsSynchronizedOutput(): boolean;
+/**
+ * Wrap stdout.write to use synchronized output when available
+ */
+export declare function createSyncWriter(stdout: WriteStream | undefined): {
+    startSync: () => void;
+    endSync: () => void;
+    write: (data: string) => void;
+};
+/**
+ * Hide cursor during heavy rendering operations
+ */
+export declare function hideCursor(stdout: WriteStream | undefined): void;
+/**
+ * Show cursor after rendering
+ */
+export declare function showCursor(stdout: WriteStream | undefined): void;
+/**
+ * Clear N lines above cursor without scrolling
+ * More targeted than full screen clear
+ */
+export declare function clearLinesAbove(stdout: WriteStream | undefined, lines: number): void;
+/**
+ * Move cursor to specific line (relative to current position)
+ */
+export declare function moveCursor(stdout: WriteStream | undefined, lines: number): void;
+/**
+ * Request terminal size (for responsive layouts)
+ */
+export declare function getTerminalSize(stdout: WriteStream | undefined): {
+    columns: number;
+    rows: number;
+};

package/dist/utils/terminal.js

@@ -0,0 +1,121 @@
+/**
+ * Terminal utilities for better rendering control
+ * Implements DEC Mode 2026 (Synchronized Output) and other optimizations
+ */
+// DEC Mode 2026 - Synchronized Output
+// Tells terminal to batch all output until end marker
+const SYNC_START = '\x1b[?2026h';
+const SYNC_END = '\x1b[?2026l';
+// Alternate screen buffer (not used - loses scroll history)
+// const ALT_SCREEN_ON = '\x1b[?1049h';
+// const ALT_SCREEN_OFF = '\x1b[?1049l';
+// Cursor visibility
+const CURSOR_HIDE = '\x1b[?25l';
+const CURSOR_SHOW = '\x1b[?25h';
+// Screen clearing (avoid - causes scroll jump)
+// const CLEAR_SCREEN = '\x1b[2J';
+// const CLEAR_SCROLLBACK = '\x1b[3J';
+/**
+ * Check if terminal supports synchronized output (DEC 2026)
+ * Modern terminals: Ghostty, iTerm2 3.5+, Kitty, WezTerm, VSCode 1.80+
+ */
+export function supportsSynchronizedOutput() {
+    const term = process.env.TERM_PROGRAM?.toLowerCase() || '';
+    const termEnv = process.env.TERM?.toLowerCase() || '';
+    // Known supported terminals
+    const supportedTerminals = [
+        'ghostty',
+        'iterm.app',
+        'iterm2',
+        'kitty',
+        'wezterm',
+        'vscode',
+        'alacritty', // 0.13+
+    ];
+    // Check TERM_PROGRAM
+    if (supportedTerminals.some(t => term.includes(t))) {
+        return true;
+    }
+    // Check for xterm-256color with modern terminal
+    if (termEnv.includes('xterm') || termEnv.includes('256color')) {
+        // Most modern terminals report as xterm-256color
+        // We'll enable sync output and let it gracefully degrade if not supported
+        return true;
+    }
+    return false;
+}
+/**
+ * Wrap stdout.write to use synchronized output when available
+ */
+export function createSyncWriter(stdout) {
+    const syncSupported = supportsSynchronizedOutput();
+    let inSync = false;
+    return {
+        startSync: () => {
+            if (syncSupported && stdout && !inSync) {
+                stdout.write(SYNC_START);
+                inSync = true;
+            }
+        },
+        endSync: () => {
+            if (syncSupported && stdout && inSync) {
+                stdout.write(SYNC_END);
+                inSync = false;
+            }
+        },
+        write: (data) => {
+            stdout?.write(data);
+        },
+    };
+}
+/**
+ * Hide cursor during heavy rendering operations
+ */
+export function hideCursor(stdout) {
+    stdout?.write(CURSOR_HIDE);
+}
+/**
+ * Show cursor after rendering
+ */
+export function showCursor(stdout) {
+    stdout?.write(CURSOR_SHOW);
+}
+/**
+ * Clear N lines above cursor without scrolling
+ * More targeted than full screen clear
+ */
+export function clearLinesAbove(stdout, lines) {
+    if (!stdout || lines <= 0)
+        return;
+    let seq = '';
+    seq += `\x1b[${lines}A`; // Move up N lines
+    for (let i = 0; i < lines; i++) {
+        seq += '\x1b[2K'; // Clear line
+        if (i < lines - 1)
+            seq += '\x1b[B'; // Move down (except last)
+    }
+    seq += `\x1b[${lines - 1}A`; // Move back to top of cleared area
+    stdout.write(seq);
+}
+/**
+ * Move cursor to specific line (relative to current position)
+ */
+export function moveCursor(stdout, lines) {
+    if (!stdout || lines === 0)
+        return;
+    if (lines > 0) {
+        stdout.write(`\x1b[${lines}B`); // Move down
+    }
+    else {
+        stdout.write(`\x1b[${Math.abs(lines)}A`); // Move up
+    }
+}
+/**
+ * Request terminal size (for responsive layouts)
+ */
+export function getTerminalSize(stdout) {
+    return {
+        columns: stdout?.columns || 80,
+        rows: stdout?.rows || 24,
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codeep",
-  "version": "1.0.106",
+  "version": "1.0.108",
   "description": "AI-powered coding assistant built for the terminal. Multiple LLM providers, project-aware context, and a seamless development workflow.",
   "type": "module",
   "main": "dist/index.js",