codeep 1.1.20 → 1.1.22

package/dist/renderer/App.d.ts

@@ -8,7 +8,6 @@ export interface Message {
     role: 'user' | 'assistant' | 'system';
     content: string;
 }
-export type AppScreen = 'chat' | 'status';
 export interface ConfirmOptions {
     title: string;
     message: string[];
@@ -34,7 +33,6 @@ export declare class App {
     private streamingContent;
     private isStreaming;
     private isLoading;
-    private currentScreen;
     private options;
     private scrollOffset;
     private notification;
@@ -49,6 +47,7 @@ export declare class App {
     private pasteInfoOpen;
     private helpOpen;
     private helpScrollIndex;
+    private statusOpen;
     private settingsState;
     private showAutocomplete;
     private autocompleteIndex;
@@ -278,6 +277,10 @@ export declare class App {
      * Update autocomplete suggestions
      */
     private updateAutocomplete;
+    /**
+     * Handle inline status keys
+     */
+    private handleInlineStatusKey;
     /**
      * Handle help screen keys
      */
@@ -347,6 +350,7 @@ export declare class App {
     /**
      * Render inline help below status bar
      */
+    private renderInlineStatus;
     private renderInlineHelp;
     /**
      * Render inline autocomplete below status bar

package/dist/renderer/App.js

@@ -4,7 +4,7 @@
  */
 import { Screen } from './Screen.js';
 import { Input, LineEditor } from './Input.js';
-import { fg, style } from './ansi.js';
+import { fg, style, stringWidth } from './ansi.js';
 import clipboardy from 'clipboardy';
 // Primary color: #f02a30 (Codeep red)
 const PRIMARY_COLOR = fg.rgb(240, 42, 48);
@@ -30,11 +30,14 @@ const KEYWORDS = {
     go: ['func', 'return', 'if', 'else', 'for', 'range', 'switch', 'case', 'break', 'continue', 'fallthrough', 'default', 'go', 'select', 'chan', 'defer', 'panic', 'recover', 'type', 'struct', 'interface', 'map', 'package', 'import', 'const', 'var', 'nil', 'true', 'false', 'iota', 'make', 'new', 'append', 'len', 'cap', 'copy', 'delete'],
     rust: ['fn', 'let', 'mut', 'const', 'static', 'return', 'if', 'else', 'match', 'for', 'while', 'loop', 'break', 'continue', 'struct', 'enum', 'trait', 'impl', 'type', 'where', 'use', 'mod', 'pub', 'crate', 'self', 'super', 'async', 'await', 'move', 'ref', 'true', 'false', 'Some', 'None', 'Ok', 'Err', 'Self', 'dyn', 'unsafe', 'extern'],
     sh: ['if', 'then', 'else', 'elif', 'fi', 'case', 'esac', 'for', 'while', 'until', 'do', 'done', 'in', 'function', 'return', 'local', 'export', 'readonly', 'declare', 'typeset', 'unset', 'shift', 'exit', 'break', 'continue', 'source', 'alias', 'echo', 'printf', 'read', 'test', 'true', 'false'],
+    html: ['html', 'head', 'body', 'div', 'span', 'p', 'a', 'img', 'ul', 'ol', 'li', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'table', 'tr', 'td', 'th', 'form', 'input', 'button', 'select', 'option', 'textarea', 'label', 'section', 'article', 'nav', 'header', 'footer', 'main', 'aside', 'meta', 'link', 'script', 'style', 'title', 'DOCTYPE'],
+    css: ['import', 'media', 'keyframes', 'font-face', 'supports', 'charset', 'namespace', 'page', 'inherit', 'initial', 'unset', 'none', 'auto', 'block', 'inline', 'flex', 'grid', 'absolute', 'relative', 'fixed', 'sticky', 'static', 'hidden', 'visible', 'solid', 'dashed', 'dotted', 'transparent', 'important'],
 };
 // Map language aliases
 const LANG_ALIASES = {
     javascript: 'js', typescript: 'ts', python: 'py', golang: 'go',
     bash: 'sh', shell: 'sh', zsh: 'sh', tsx: 'ts', jsx: 'js',
+    htm: 'html', scss: 'css', sass: 'css', less: 'css',
 };
 /**
  * Syntax highlighter for code with better token handling
@@ -42,6 +45,20 @@ const LANG_ALIASES = {
 function highlightCode(code, lang) {
     const normalizedLang = LANG_ALIASES[lang.toLowerCase()] || lang.toLowerCase();
     const keywords = KEYWORDS[normalizedLang] || KEYWORDS['js'] || [];
+    // HTML: highlight tags, attributes, and values
+    if (normalizedLang === 'html' || normalizedLang === 'xml' || normalizedLang === 'svg') {
+        return code.replace(/(<\/?)(\w[\w-]*)((?:\s+[\w-]+(?:=(?:"[^"]*"|'[^']*'|\S+))?)*)(\s*\/?>)/g, (_match, open, tag, attrs, close) => {
+            const highlightedAttrs = attrs.replace(/([\w-]+)(=)("[^"]*"|'[^']*')/g, (_m, attr, eq, val) => SYNTAX.function + attr + '\x1b[0m' + SYNTAX.operator + eq + '\x1b[0m' + SYNTAX.string + val + '\x1b[0m');
+            return SYNTAX.punctuation + open + '\x1b[0m' + SYNTAX.keyword + tag + '\x1b[0m' + highlightedAttrs + SYNTAX.punctuation + close + '\x1b[0m';
+        }).replace(/<!--[\s\S]*?-->/g, (comment) => SYNTAX.comment + comment + '\x1b[0m');
+    }
+    // CSS: highlight selectors, properties, and values
+    if (normalizedLang === 'css') {
+        return code
+            .replace(/\/\*[\s\S]*?\*\//g, (comment) => SYNTAX.comment + comment + '\x1b[0m')
+            .replace(/([\w-]+)(\s*:\s*)([^;{}]+)/g, (_m, prop, colon, val) => SYNTAX.function + prop + '\x1b[0m' + colon + SYNTAX.string + val + '\x1b[0m')
+            .replace(/([.#]?[\w-]+(?:\s*[,>+~]\s*[.#]?[\w-]+)*)\s*\{/g, (match, selector) => SYNTAX.keyword + selector + '\x1b[0m' + ' {');
+    }
     // Tokenize and highlight
     let result = '';
     let i = 0;
@@ -202,7 +219,6 @@ const COMMAND_DESCRIPTIONS = {
     'learn': 'Learn code preferences',
 };
 import { helpCategories, keyboardShortcuts } from './components/Help.js';
-import { renderStatusScreen } from './components/Status.js';
 import { handleSettingsKey, SETTINGS } from './components/Settings.js';
 export class App {
     screen;
@@ -212,7 +228,6 @@ export class App {
     streamingContent = '';
     isStreaming = false;
     isLoading = false;
-    currentScreen = 'chat';
     options;
     scrollOffset = 0;
     notification = '';
@@ -231,6 +246,8 @@ export class App {
     // Inline help state
     helpOpen = false;
     helpScrollIndex = 0;
+    // Inline status state
+    statusOpen = false;
     // Settings screen state
     settingsState = {
         selectedIndex: 0,
@@ -784,19 +801,7 @@ export class App {
             this.options.onExit();
             return;
         }
-        // Screen-specific handling
-        switch (this.currentScreen) {
-            case 'status':
-                if (event.key === 'escape' || event.key === 'q') {
-                    this.currentScreen = 'chat';
-                    this.render();
-                }
-                break;
-            case 'chat':
-            default:
-                this.handleChatKey(event);
-                break;
-        }
+        this.handleChatKey(event);
     }
     /**
      * Handle chat screen keys
@@ -822,6 +827,11 @@ export class App {
             this.handleInlineConfirmKey(event);
             return;
         }
+        // If status is open, handle status keys first
+        if (this.statusOpen) {
+            this.handleInlineStatusKey(event);
+            return;
+        }
         // If help is open, handle help keys first
         if (this.helpOpen) {
             this.handleInlineHelpKey(event);
@@ -1036,6 +1046,15 @@ export class App {
             this.autocompleteItems = [];
         }
     }
+    /**
+     * Handle inline status keys
+     */
+    handleInlineStatusKey(event) {
+        if (event.key === 'escape' || event.key === 'q') {
+            this.statusOpen = false;
+            this.render();
+        }
+    }
     /**
      * Handle help screen keys
      */
@@ -1515,7 +1534,7 @@ export class App {
                 this.render();
                 break;
             case 'status':
-                this.currentScreen = 'status';
+                this.statusOpen = true;
                 this.render();
                 break;
             case 'clear':
@@ -1542,15 +1561,7 @@ export class App {
             this.renderIntro();
             return;
         }
-        switch (this.currentScreen) {
-            case 'status':
-                renderStatusScreen(this.screen, this.options.getStatus());
-                break;
-            case 'chat':
-            default:
-                this.renderChat();
-                break;
-        }
+        this.renderChat();
     }
     /**
      * Render chat screen
@@ -1603,31 +1614,12 @@ export class App {
             bottomPanelHeight = Math.min(this.autocompleteItems.length + 3, 12);
         }
         const mainHeight = height - bottomPanelHeight;
-        // Determine if we have enough space for logo (need at least 20 lines)
-        const showLogo = height >= 24;
-        const logoSpace = showLogo ? LOGO_HEIGHT + 1 : 1; // +1 for tagline or simple header
         // Layout - main UI takes top portion
-        const headerLine = 0;
-        const messagesStart = logoSpace;
+        const messagesStart = 0;
         const messagesEnd = mainHeight - 4;
         const separatorLine = mainHeight - 3;
         const inputLine = mainHeight - 2;
         const statusLine = mainHeight - 1;
-        // Header - show logo if space permits, otherwise simple text
-        if (showLogo) {
-            // Center the logo
-            const logoWidth = LOGO_LINES[0].length;
-            const logoX = Math.max(0, Math.floor((width - logoWidth) / 2));
-            for (let i = 0; i < LOGO_LINES.length; i++) {
-                this.screen.write(logoX, headerLine + i, LOGO_LINES[i], PRIMARY_COLOR);
-            }
-        }
-        else {
-            // Simple header for small terminals
-            const header = ' Codeep ';
-            const headerPadding = '─'.repeat(Math.max(0, (width - header.length) / 2));
-            this.screen.writeLine(headerLine, headerPadding + header + headerPadding, PRIMARY_COLOR);
-        }
         // Messages
         const messagesHeight = messagesEnd - messagesStart + 1;
         const messagesToRender = this.getVisibleMessages(messagesHeight, width - 2);
@@ -1662,6 +1654,10 @@ export class App {
         if (this.helpOpen) {
             this.renderInlineHelp(statusLine + 1, width, height - statusLine - 1);
         }
+        // Inline status renders BELOW status bar
+        if (this.statusOpen) {
+            this.renderInlineStatus(statusLine + 1, width);
+        }
         // Inline search renders BELOW status bar
         if (this.searchOpen) {
             this.renderInlineSearch(statusLine + 1, width, height - statusLine - 1);
@@ -1946,6 +1942,35 @@ export class App {
     /**
      * Render inline help below status bar
      */
+    renderInlineStatus(startY, width) {
+        const status = this.options.getStatus();
+        let y = startY;
+        // Separator line
+        this.screen.horizontalLine(y++, '─', PRIMARY_COLOR);
+        // Title
+        this.screen.writeLine(y++, 'Status', PRIMARY_COLOR + style.bold);
+        const items = [
+            { label: 'Version', value: 'v' + status.version, color: fg.white },
+            { label: 'Provider', value: status.provider, color: fg.white },
+            { label: 'Model', value: status.model, color: fg.white },
+            { label: 'Agent Mode', value: status.agentMode.toUpperCase(), color: status.agentMode === 'on' ? fg.green : status.agentMode === 'manual' ? fg.yellow : fg.gray },
+            { label: 'Project', value: status.projectPath, color: fg.white },
+            { label: 'Write Access', value: status.hasWriteAccess ? 'Yes' : 'No', color: status.hasWriteAccess ? fg.green : fg.red },
+            { label: 'Session', value: status.sessionId || 'New', color: fg.white },
+            { label: 'Messages', value: status.messageCount.toString(), color: fg.white },
+            { label: 'Platform', value: process.platform, color: fg.white },
+            { label: 'Node', value: process.version, color: fg.white },
+            { label: 'Terminal', value: width + 'x' + this.screen.getSize().height, color: fg.white },
+        ];
+        const labelWidth = Math.max(...items.map(i => i.label.length)) + 2;
+        for (const item of items) {
+            this.screen.write(2, y, item.label + ':', fg.gray);
+            this.screen.write(2 + labelWidth, y, item.value, item.color);
+            y++;
+        }
+        y++;
+        this.screen.writeLine(y, 'Esc close', fg.gray);
+    }
     renderInlineHelp(startY, width, availableHeight) {
         // Build all help items
         const allItems = [];
@@ -2326,6 +2351,20 @@ export class App {
      */
     getVisibleMessages(height, width) {
         const allLines = [];
+        // Logo at the top, scrolls with content
+        if (height >= 20) {
+            const logoWidth = LOGO_LINES[0].length;
+            const logoX = Math.max(0, Math.floor((width - logoWidth) / 2));
+            const pad = ' '.repeat(logoX);
+            for (const line of LOGO_LINES) {
+                allLines.push({ text: pad + line, style: PRIMARY_COLOR, raw: false });
+            }
+            allLines.push({ text: '', style: '' });
+        }
+        else {
+            allLines.push({ text: ' Codeep', style: PRIMARY_COLOR, raw: false });
+            allLines.push({ text: '', style: '' });
+        }
         for (const msg of this.messages) {
             const msgLines = this.formatMessage(msg.role, msg.content, width);
             allLines.push(...msgLines);
@@ -2335,10 +2374,7 @@ export class App {
             allLines.push(...streamLines);
         }
         // Calculate visible window based on scroll offset
-        // scrollOffset=0 means show the most recent (bottom) lines
-        // scrollOffset>0 means scroll up to see older messages
         const totalLines = allLines.length;
-        // Clamp scrollOffset to valid range
         const maxScroll = Math.max(0, totalLines - height);
         if (this.scrollOffset > maxScroll) {
             this.scrollOffset = maxScroll;
@@ -2355,7 +2391,7 @@ export class App {
         const roleStyle = role === 'user' ? fg.green : role === 'assistant' ? PRIMARY_COLOR : fg.yellow;
         const roleLabel = role === 'user' ? '> ' : role === 'assistant' ? '  ' : '# ';
         // Parse content for code blocks
-        const codeBlockRegex = /```(\w*)\n([\s\S]*?)```/g;
+        const codeBlockRegex = /```([^\n]*)\n([\s\S]*?)```/g;
         let lastIndex = 0;
         let match;
         let isFirstLine = true;
@@ -2368,7 +2404,13 @@ export class App {
                 isFirstLine = false;
             }
             // Add code block with syntax highlighting
-            const lang = match[1] || 'text';
+            const rawLang = (match[1] || 'text').trim();
+            // Handle filepath:name.ext format - extract extension as language
+            let lang = rawLang;
+            if (rawLang.includes(':') || rawLang.includes('.')) {
+                const ext = rawLang.split('.').pop() || rawLang;
+                lang = ext;
+            }
             const code = match[2];
             const codeLines = this.formatCodeBlock(code, lang, maxWidth);
             lines.push(...codeLines);
@@ -2508,7 +2550,7 @@ export class App {
             }
             else {
                 // Plain text - word wrap as before
-                if (line.length > maxWidth - prefix.length) {
+                if (stringWidth(line) > maxWidth - prefix.length) {
                     const wrapped = this.wordWrap(line, maxWidth - prefix.length);
                     for (let j = 0; j < wrapped.length; j++) {
                         lines.push({
@@ -2790,7 +2832,7 @@ export class App {
         const lines = [];
         let currentLine = '';
         for (const word of words) {
-            if (currentLine.length + word.length + 1 > maxWidth && currentLine) {
+            if (stringWidth(currentLine) + stringWidth(word) + 1 > maxWidth && currentLine) {
                 lines.push(currentLine);
                 currentLine = word;
             }

package/dist/renderer/Screen.js

@@ -2,7 +2,7 @@
  * Screen buffer with diff-based rendering
  * Only writes changes to terminal - minimizes flickering
  */
-import { cursor, screen, style, visibleLength } from './ansi.js';
+import { cursor, screen, style, visibleLength, charWidth } from './ansi.js';
 export class Screen {
     width;
     height;
@@ -73,10 +73,15 @@ export class Screen {
                 break;
             }
             else {
+                const w = charWidth(char);
                 if (col >= 0 && col < this.width) {
                     this.buffer[y][col] = { char, style: currentStyle };
+                    // Wide char: fill next cell with empty placeholder
+                    if (w === 2 && col + 1 < this.width) {
+                        this.buffer[y][col + 1] = { char: '', style: currentStyle };
+                    }
                 }
-                col++;
+                col += w;
             }
         }
     }
@@ -132,10 +137,15 @@ export class Screen {
             }
             else {
                 // Regular character
+                const w = charWidth(text[i]);
                 if (col < this.width) {
                     this.buffer[y][col] = { char: text[i], style: currentStyle };
-                    col++;
+                    // Wide char: fill next cell with empty placeholder
+                    if (w === 2 && col + 1 < this.width) {
+                        this.buffer[y][col + 1] = { char: '', style: currentStyle };
+                    }
                 }
+                col += w;
                 i++;
             }
         }
@@ -216,6 +226,11 @@ export class Screen {
                 if (cell.char === renderedCell.char && cell.style === renderedCell.style) {
                     continue;
                 }
+                // Skip wide-char placeholder cells
+                if (cell.char === '') {
+                    this.rendered[y][x] = { ...cell };
+                    continue;
+                }
                 // Move cursor and write
                 output += cursor.to(y + 1, x + 1);
                 if (cell.style !== lastStyle) {

package/dist/renderer/ansi.d.ts

@@ -81,6 +81,15 @@ export declare const style: {
  * Helper to create styled text
  */
 export declare function styled(text: string, ...styles: string[]): string;
+/**
+ * Get terminal display width of a single character
+ * CJK, fullwidth, and emoji characters take 2 columns
+ */
+export declare function charWidth(char: string): number;
+/**
+ * Get terminal display width of a string (excluding ANSI codes)
+ */
+export declare function stringWidth(str: string): number;
 /**
  * Strip ANSI codes from string (for length calculation)
  */

package/dist/renderer/ansi.js

@@ -101,6 +101,84 @@ export function styled(text, ...styles) {
         return text;
     return styles.join('') + text + style.reset;
 }
+/**
+ * Get terminal display width of a single character
+ * CJK, fullwidth, and emoji characters take 2 columns
+ */
+export function charWidth(char) {
+    const code = char.codePointAt(0);
+    if (code === undefined)
+        return 0;
+    // Control characters
+    if (code < 32 || (code >= 0x7f && code < 0xa0))
+        return 0;
+    // CJK Unified Ideographs
+    if (code >= 0x4e00 && code <= 0x9fff)
+        return 2;
+    // CJK Unified Ideographs Extension A
+    if (code >= 0x3400 && code <= 0x4dbf)
+        return 2;
+    // CJK Unified Ideographs Extension B
+    if (code >= 0x20000 && code <= 0x2a6df)
+        return 2;
+    // CJK Compatibility Ideographs
+    if (code >= 0xf900 && code <= 0xfaff)
+        return 2;
+    // CJK Radicals / Kangxi Radicals
+    if (code >= 0x2e80 && code <= 0x2fdf)
+        return 2;
+    // CJK Strokes / Enclosed CJK
+    if (code >= 0x31c0 && code <= 0x33ff)
+        return 2;
+    // CJK Symbols and Punctuation
+    if (code >= 0x3000 && code <= 0x303f)
+        return 2;
+    // Hiragana, Katakana
+    if (code >= 0x3040 && code <= 0x30ff)
+        return 2;
+    // Katakana Phonetic Extensions
+    if (code >= 0x31f0 && code <= 0x31ff)
+        return 2;
+    // Hangul Jamo
+    if (code >= 0x1100 && code <= 0x11ff)
+        return 2;
+    // Hangul Syllables
+    if (code >= 0xac00 && code <= 0xd7af)
+        return 2;
+    // Hangul Jamo Extended-A/B
+    if (code >= 0xa960 && code <= 0xa97f)
+        return 2;
+    if (code >= 0xd7b0 && code <= 0xd7ff)
+        return 2;
+    // Fullwidth Forms
+    if (code >= 0xff01 && code <= 0xff60)
+        return 2;
+    if (code >= 0xffe0 && code <= 0xffe6)
+        return 2;
+    // Bopomofo
+    if (code >= 0x3100 && code <= 0x312f)
+        return 2;
+    // Emoji ranges (common)
+    if (code >= 0x1f300 && code <= 0x1f9ff)
+        return 2;
+    if (code >= 0x1fa00 && code <= 0x1fa6f)
+        return 2;
+    if (code >= 0x1fa70 && code <= 0x1faff)
+        return 2;
+    if (code >= 0x2600 && code <= 0x27bf)
+        return 2;
+    return 1;
+}
+/**
+ * Get terminal display width of a string (excluding ANSI codes)
+ */
+export function stringWidth(str) {
+    let width = 0;
+    for (const char of str) {
+        width += charWidth(char);
+    }
+    return width;
+}
 /**
  * Strip ANSI codes from string (for length calculation)
  */
@@ -112,14 +190,14 @@ export function stripAnsi(str) {
  * Get visible length of string (excluding ANSI codes)
  */
 export function visibleLength(str) {
-    return stripAnsi(str).length;
+    return stringWidth(stripAnsi(str));
 }
 /**
  * Truncate string to visible length, preserving ANSI codes
  */
 export function truncate(str, maxLength, suffix = '...') {
     const visible = stripAnsi(str);
-    if (visible.length <= maxLength)
+    if (stringWidth(visible) <= maxLength)
         return str;
     // Simple truncation - may cut ANSI codes
     // For proper handling, we'd need to parse ANSI sequences
@@ -138,13 +216,11 @@ export function truncate(str, maxLength, suffix = '...') {
             }
         }
         else {
-            if (visibleCount < maxLength - suffix.length) {
-                result += char;
-                visibleCount++;
-            }
-            else {
+            const w = charWidth(char);
+            if (visibleCount + w > maxLength - suffix.length)
                 break;
-            }
+            result += char;
+            visibleCount += w;
         }
     }
     return result + style.reset + suffix;

package/dist/renderer/index.d.ts

@@ -9,7 +9,7 @@ export { cursor, screen, fg, bg, style, styled, stripAnsi, visibleLength, trunca
 export { Screen, Cell } from './Screen';
 export { Input, LineEditor, KeyEvent, KeyHandler } from './Input';
 export { ChatUI, ChatMessage, ChatUIOptions } from './ChatUI';
-export { App, AppScreen, AppOptions, Message } from './App';
+export { App, AppOptions, Message } from './App';
 export { createBox, centerBox, BoxStyle, BoxOptions } from './components/Box';
 export { renderModal, renderHelpModal, renderListModal, ModalOptions } from './components/Modal';
 export { renderHelpScreen, helpCategories, keyboardShortcuts } from './components/Help';

package/dist/renderer/main.js

@@ -620,6 +620,13 @@ function handleCommand(command, args) {
                 return;
             }
             const newName = args.join('-');
+            // Save current session first so there's a file to rename
+            const messages = app.getMessages();
+            if (messages.length === 0) {
+                app.notify('No messages to save. Start a conversation first.');
+                return;
+            }
+            saveSession(sessionId, messages, projectPath);
             if (renameSession(sessionId, newName, projectPath)) {
                 sessionId = newName;
                 app.notify(`Session renamed to: ${newName}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "codeep",
-  "version": "1.1.20",
+  "version": "1.1.22",
   "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",