glitool 1.0.0 → 2.0.0

package/dist/ui/App.js

@@ -1,6 +1,6 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import React, { useState, useCallback } from "react";
-import { Box, Text, useApp } from 'ink';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useState, useRef } from "react";
+import { Box, Text, useApp, Static } from 'ink';
 import TextInput from "ink-text-input";
 import { chat, clearSession, llm, sessionMessages } from '../agent.js';
 import { clearSummary, generateAndSaveSummary } from "../memory.js";
@@ -8,40 +8,181 @@ import { clearProjectMemory, extractAndSaveProjectMemory } from "../projectMemor
 import { useInput } from 'ink';
 import { setConfirmHandler } from "../confirmHandler.js";
 import { explainResponse } from "../agents/explainer.js";
-const COMMANDS = ['/help', '/clear', 'model', '/tools', '/exit', '/reset'];
+import { loadConfig } from '../config.js';
+import { Welcome } from './Welcome.js';
+import { StatusBar } from './StatusBar.js';
+import { execSync } from 'child_process';
+import { SlashPalette, filterCommands } from './SlashPalette.js';
+import { ToolLog } from "./ToolLog.js";
+import { Pipeline } from "./Pipeline.js";
+import { ConfirmCard } from './ConfirmCard.js';
+import { ExplainCard } from "./ExplainCard.js";
+import { colors } from "./tokens.js";
+import { EscalationCard } from './EscalationCard.js';
+import { log } from "../logger.js";
+import { renderMarkdown } from "./renderMarkdown.js";
+import { ProcessTrace } from './ProcessTrace.js';
+import { AuthFlow } from './AuthFlow.js';
+import { getAnonRequestCount, incrementAnonCount, isAnonLimitReached, isAuthenticated, readAuth, ANON_LIMIT, } from '../auth.js';
+// const previousInputRef = useRef('');
+const config = loadConfig();
+function getWorkspaceStats() {
+    const cwd = process.cwd();
+    let branch = 'main';
+    let files = 0;
+    let loc = '';
+    try {
+        branch = execSync('git rev-parse --abbrev-ref HEAD', { encoding: 'utf8', stdio: ['pipe', 'pipe', 'ignore'] }).trim();
+    }
+    catch { }
+    try {
+        files = parseInt(execSync('git ls-files | wc -l', { encoding: 'utf8', stdio: ['pipe', 'pipe', 'ignore'] }).trim(), 10);
+    }
+    catch { }
+    try {
+        const raw = execSync('git ls-files | xargs wc -l 2>/dev/null | tail -1', { encoding: 'utf8', stdio: ['pipe', 'pipe', 'ignore'] }).trim();
+        const n = parseInt(raw, 10);
+        if (!isNaN(n))
+            loc = `${(n / 1000).toFixed(1)}k LOC`;
+    }
+    catch { }
+    return {
+        path: cwd.replace(process.env.HOME ?? '', '~'),
+        branch,
+        files,
+        loc,
+    };
+}
+const workspaceStats = getWorkspaceStats();
 export const App = ({ explainMode = false }) => {
     const { exit } = useApp();
+    const auth = readAuth();
+    const [anonCount, setAnonCount] = useState(getAnonRequestCount());
+    const isByok = !!process.env.OPENAI_API_KEY;
+    const anonLeft = (isAuthenticated() || isByok) ? undefined : Math.max(0, ANON_LIMIT - anonCount);
     const [messages, setMessages] = useState([]);
     const [input, setInput] = useState('');
-    const [isThinking, setIsThinking] = useState(false);
-    const [toolInfo, setToolInfo] = useState('');
-    const [suggestions, setSuggestions] = useState([]);
-    const [confirmMessage, setConfirmMessage] = useState('');
-    const [confirmInput, setConfirmInput] = useState('');
+    const previousInputRef = useRef('');
+    const ctrlVHandledRef = useRef(false);
+    // ← ADD HERE
+    const [pastedContent, setPastedContent] = useState('');
     const [confirmResolver, setConfirmResolver] = useState(null);
     const [streamingContent, setStreamingContent] = useState('');
     const [inputHistory, setInputHistory] = useState([]);
     const [historyIndex, setHistoryIndex] = useState(-1);
+    const [statusState, setStatusState] = useState('idle');
+    const [statusDetail, setStatusDetail] = useState('');
+    const [tokens, setTokens] = useState(0);
+    const [cost, setCost] = useState(0);
+    const [confirmRequest, setConfirmRequest] = useState(null);
+    const [toolLog, setToolLog] = useState([]);
+    const [stageEvents, setStageEvents] = useState([]);
+    const [planner, setPlanner] = useState({ status: 'idle' });
+    const [coder, setCoder] = useState({ status: 'idle' });
+    const [workflow, setWorkflow] = useState({ status: 'idle' });
+    const [validator, setValidator] = useState({ status: 'idle' });
+    const [escalation, setEscalation] = useState(null);
+    const [judge, setJudge] = useState({ status: 'idle' });
+    const [inputKey, setInputKey] = useState(0);
+    const [showAuth, setShowAuth] = useState(false);
+    const [paletteIndex, setPaletteIndex] = useState(0);
+    const paletteItems = filterCommands(input);
     const handleChange = (value) => {
-        setInput(value);
-        if (value.startsWith('/')) {
-            const matches = COMMANDS.filter(c => c.startsWith(value));
-            setSuggestions(value === matches[0] ? [] : matches);
+        if (ctrlVHandledRef.current) {
+            ctrlVHandledRef.current = false;
+            return;
+        }
+        const previous = previousInputRef.current;
+        const grew = value.length - previous.length;
+        const grewALot = grew > 20;
+        const newlineAppeared = /[\r\n]/.test(value) && !/[\r\n]/.test(previous);
+        if (grewALot || newlineAppeared) {
+            let pasted;
+            if (value.startsWith(previous)) {
+                pasted = value.slice(previous.length);
+            }
+            else if (value.endsWith(previous)) {
+                pasted = value.slice(0, value.length - previous.length);
+            }
+            else if (previous && value.includes(previous)) {
+                pasted = value.replace(previous, '');
+            }
+            else {
+                pasted = value;
+            }
+            if (pasted.includes('\n')) {
+                // multi-line → clipping section
+                setPastedContent(prev => (prev ? `${prev}\n\n${pasted}` : pasted));
+                setInput(previous);
+                previousInputRef.current = previous;
+            }
+            else {
+                // single line → stays in input field
+                setInput(value);
+                previousInputRef.current = value;
+            }
         }
         else {
-            setSuggestions([]);
+            setInput(value);
+            previousInputRef.current = value;
         }
+        setPaletteIndex(0);
     };
     const handleExit = async () => {
         await generateAndSaveSummary(sessionMessages, llm);
         await extractAndSaveProjectMemory(sessionMessages, llm);
         exit();
     };
-    useInput((_, key) => {
-        if (confirmMessage)
+    useInput((inputKey, key) => {
+        if (confirmRequest)
+            return;
+        if (escalation)
+            return;
+        if (statusState === 'working')
+            return;
+        // Ctrl+V — read clipboard directly
+        if (inputKey === '\x16' || (key.ctrl && inputKey === 'v')) {
+            try {
+                ctrlVHandledRef.current = true;
+                const text = execSync('xclip -selection clipboard -o 2>/dev/null || xsel --clipboard --output 2>/dev/null', { encoding: 'utf8', timeout: 2000 }).trimEnd();
+                if (!text)
+                    return;
+                if (text.includes('\n')) {
+                    // multi-line → clipping section
+                    setPastedContent(prev => prev ? `${prev}\n\n${text}` : text);
+                }
+                else {
+                    // single line → goes straight into input field
+                    setInput(prev => prev + text);
+                    previousInputRef.current = previousInputRef.current + text;
+                    setInputKey(k => k + 1);
+                }
+            }
+            catch { }
+            return;
+        }
+        if (key.escape && showAuth) {
+            setShowAuth(false);
             return;
-        if (isThinking)
+        }
+        if (key.escape && pastedContent) {
+            setPastedContent('');
             return;
+        }
+        if (paletteItems.length > 0) {
+            if (key.upArrow) {
+                setPaletteIndex(i => (i - 1 + paletteItems.length) % paletteItems.length);
+                return;
+            }
+            if (key.downArrow) {
+                setPaletteIndex(i => (i + 1) % paletteItems.length);
+                return;
+            }
+            if (key.escape) {
+                setInput('');
+                return;
+            }
+        }
         if (key.upArrow) {
             if (inputHistory.length === 0)
                 return;
@@ -59,27 +200,45 @@ export const App = ({ explainMode = false }) => {
             setHistoryIndex(newIndex);
             setInput(inputHistory[inputHistory.length - 1 - newIndex] ?? '');
         }
-        if (key.tab && suggestions.length > 0) {
-            setInput(suggestions[0] ?? '');
-            setSuggestions([]);
-        }
     });
+    function pastePreview(content) {
+        const lines = content.split('\n');
+        const sizeKB = (content.length / 1024).toFixed(1);
+        const lineCount = lines.length;
+        const headline = `${lineCount} line${lineCount === 1 ? '' : 's'} · ${sizeKB} KB`;
+        const firstNonEmpty = lines.find(l => l.trim()) ?? '';
+        const truncated = firstNonEmpty.length > 80 ? firstNonEmpty.slice(0, 80) + '…' : firstNonEmpty;
+        const moreNote = lineCount > 1 ? ` · +${lineCount - 1} more line${lineCount - 1 === 1 ? '' : 's'}` : '';
+        return { headline, body: `${truncated}${moreNote}` };
+    }
     React.useEffect(() => {
-        setConfirmHandler((messages) => {
+        setConfirmHandler((req) => {
             return new Promise((resolve) => {
-                setConfirmMessage(messages);
+                setConfirmRequest(req);
+                setStatusState('awaiting');
                 setConfirmResolver(() => resolve);
+                log('confirm:resolver-set', { filePath: req.filePath });
             });
         });
     }, []);
-    const handleSubmit = useCallback(async (value) => {
-        const cmd = value.trim();
+    const handleSubmit = async (value) => {
+        let cmd = value.trim();
+        if (pastedContent) {
+            cmd = cmd ? `${pastedContent}\n\n${cmd}` : pastedContent;
+            setPastedContent('');
+        }
         setInput('');
-        setSuggestions([]);
         if (!cmd)
             return;
         setInputHistory(prev => prev[prev.length - 1] === cmd ? prev : [...prev, cmd]);
         setHistoryIndex(-1);
+        if (paletteItems.length > 0 && value.startsWith('/')) {
+            const selected = paletteItems[paletteIndex];
+            if (selected && selected.cmd !== value) {
+                setInput(selected.cmd);
+                return;
+            }
+        }
         if (cmd === '/exit') {
             await handleExit();
             return;
@@ -99,33 +258,159 @@ export const App = ({ explainMode = false }) => {
         if (cmd === '/help') {
             setMessages(prev => [...prev, {
                     role: 'assistant',
-                    content: 'Commands: /exit /clear /model /tools /help'
+                    content: [
+                        'Slash commands:',
+                        '  /plan      — create or update plan.md',
+                        '  /coder     — run the full coding pipeline',
+                        '  /debug     — investigate and fix a bug',
+                        '  /refactor  — structural code improvements',
+                        '  /review    — read-only code analysis',
+                        '  /git       — git operations',
+                        '  /explain   — explain a concept or file',
+                        '  /quick     — fast chat, no tools',
+                        '',
+                        'Session commands:',
+                        '  /clear     — clear conversation (keep memory)',
+                        '  /reset     — clear conversation + memory',
+                        '  /model     — show current model',
+                        '  /tools     — list available tools',
+                        '  /memory    — show project memory',
+                        '  /exit      — save session and exit',
+                        '  /signup    — sign in with GitHub (50 req/month free)',
+                    ].join('\n')
                 }]);
             return;
         }
         if (cmd === '/model') {
-            setMessages(prev => [...prev, { role: 'assistant', content: 'Model: gpr-5-mini' }]);
+            setMessages(prev => [...prev, { role: 'assistant', content: `Model: ${config.preferredModel ?? 'gpt-4o-mini'}` }]);
             return;
         }
         if (cmd === '/tools') {
             setMessages(prev => [...prev, {
                     role: 'assistant',
-                    content: 'Tools: listFile readFile searchCode editFile writeFile analyzeProject'
+                    content: [
+                        'Available tools:',
+                        '  listFiles       — list project files (supports glob patterns)',
+                        '  readFile        — read a file by name or path',
+                        '  searchCode      — grep for symbols, functions, keywords',
+                        '  editFile        — make targeted edits to existing files',
+                        '  writeFile       — create or overwrite a file',
+                        '  bash            — run shell commands (risk-gated)',
+                        '  webFetch        — fetch a URL and return markdown content',
+                        '  readBackground  — read output from a background process',
+                    ].join('\n')
                 }]);
             return;
         }
+        if (cmd === '/memory') {
+            const { loadProjectMemory } = await import('../projectMemory.js');
+            const mem = loadProjectMemory();
+            const content = mem
+                ? [
+                    `Tech stack: ${mem.techStack?.join(', ') ?? 'unknown'}`,
+                    mem.architectureDecisions?.length ? `Architecture: ${mem.architectureDecisions.join(' · ')}` : '',
+                    mem.todos?.length ? `TODOs: ${mem.todos.join(' · ')}` : '',
+                ].filter(Boolean).join('\n')
+                : 'No project memory recorded yet. Keep chatting — it builds automatically on exit.';
+            setMessages(prev => [...prev, { role: 'assistant', content }]);
+            return;
+        }
+        if (cmd === '/signup') {
+            setShowAuth(true);
+            return;
+        }
         setMessages(prev => [...prev, { role: 'user', content: cmd }]);
-        setIsThinking(true);
+        setStatusState('working');
+        setToolLog([]);
+        setStageEvents([]);
+        setPlanner({ status: 'idle' });
+        setWorkflow({ status: 'idle' });
+        setCoder({ status: 'idle' });
+        setValidator({ status: 'idle' });
+        setJudge({ status: 'idle' });
+        if (!isAuthenticated() && !process.env.OPENAI_API_KEY && isAnonLimitReached()) {
+            setMessages(prev => [...prev, {
+                    role: 'assistant',
+                    content: [
+                        "You've used your 5 free requests.",
+                        '',
+                        'Sign in with GitHub — free, 50 requests/month:',
+                        '  → https://glitool.dev/activate',
+                        '',
+                        'Type /signup to start the sign-in flow in your terminal.',
+                    ].join('\n'),
+                }]);
+            setStatusState('idle');
+            return;
+        }
         try {
             const reply = await chat(cmd, (toolName, args) => {
-                const argStr = args ? String(Object.values(args)[0]) : '';
-                setToolInfo(`⚙  ${toolName}${argStr ? ` -> ${argStr}` : ''} `);
+                let argStr = '';
+                if (args) {
+                    const first = Object.values(args)[0];
+                    if (typeof first === 'string') {
+                        try {
+                            const parsed = JSON.parse(first);
+                            argStr = parsed.command ?? parsed.filePath ?? parsed.pattern ?? parsed.query ?? parsed.url ?? first;
+                        }
+                        catch {
+                            argStr = first;
+                        }
+                    }
+                    else if (typeof first === 'object' && first !== null) {
+                        argStr = first.command ?? first.filePath ?? JSON.stringify(first).slice(0, 60);
+                    }
+                    else {
+                        argStr = String(first ?? '');
+                    }
+                }
+                setToolLog(prev => {
+                    const updated = prev.map(e => e.status === 'running' ? { ...e, status: 'done' } : e);
+                    return [...updated, { tool: toolName, target: argStr, status: 'running' }];
+                });
             }, (status) => {
-                setToolInfo(status);
-            }, (token) => {
-                setStreamingContent(prev => prev + token);
-            });
+                if (status.startsWith('Planning')) {
+                    setPlanner({ status: 'active', detail: 'planning steps' });
+                    setWorkflow({ status: 'queued' });
+                    setCoder({ status: 'queued' });
+                    setValidator({ status: 'queued' });
+                    setJudge({ status: 'queued' });
+                }
+                else if (status.startsWith('Building execution') || status.startsWith('Workflow')) {
+                    setPlanner({ status: 'done' });
+                    setWorkflow({ status: 'active', detail: 'building DAG' });
+                }
+                else if (status.startsWith('Executing')) {
+                    setWorkflow({ status: 'done' });
+                    setCoder({ status: 'active', detail: 'editing files' });
+                }
+                else if (status.startsWith('Validating')) {
+                    setCoder({ status: 'done' });
+                    setValidator({ status: 'active', detail: 'tsc + eslint' });
+                }
+                else if (status.startsWith('Validation failed')) {
+                    setValidator({ status: 'active', detail: status.replace('Validation failed', '').trim() });
+                }
+                else if (status.startsWith('Judging') || status.startsWith('Judge:')) {
+                    setValidator({ status: 'done' });
+                    setJudge({ status: 'active', detail: 'reviewing output' });
+                }
+                else if (status.startsWith('Escalating')) {
+                    setJudge({ status: 'active', detail: 'escalating' });
+                }
+            }, (token) => setStreamingContent(prev => prev + token), (payload) => setEscalation(payload), (newTokens, newCost) => {
+                setTokens(prev => prev + newTokens);
+                setCost(prev => prev + newCost);
+            }, (event) => setStageEvents(prev => [...prev, event]));
+            if (!isAuthenticated() && !process.env.OPENAI_API_KEY) {
+                const newCount = incrementAnonCount();
+                setAnonCount(newCount);
+            }
             setStreamingContent('');
+            if (stageEvents.length > 0) {
+                setMessages(prev => [...prev, { role: 'trace', content: '', traceEvents: [...stageEvents] }]);
+            }
+            setStageEvents([]);
             setMessages(prev => [...prev, { role: 'assistant', content: reply }]);
             if (explainMode && reply) {
                 const explanation = await explainResponse(reply);
@@ -141,16 +426,68 @@ export const App = ({ explainMode = false }) => {
                 }]);
         }
         finally {
-            setIsThinking(false);
-            setToolInfo('');
-        }
-    }, [exit]);
-    return (_jsxs(Box, { flexDirection: "column", padding: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { bold: true, color: "green", children: "glitool" }), _jsx(Text, { dimColor: true, children: "- AI coding assistant" })] }), messages.map((msg, i) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [msg.role === 'user' && (_jsxs(Box, { borderStyle: "round", borderColor: "white", paddingX: 1, children: [_jsx(Text, { bold: true, color: "white", children: "You" }), _jsx(Text, { wrap: "wrap", children: msg.content })] })), msg.role === 'assistant' && (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, children: [_jsx(Text, { bold: true, color: "red", children: " Assistant   " }), _jsxs(Text, { color: "red", wrap: "wrap", children: [" ", msg.content, " "] })] })), msg.role === 'error' && (_jsxs(Box, { borderStyle: "round", borderColor: "red", paddingX: 1, children: [_jsx(Text, { bold: true, color: "red", children: " Error " }), _jsx(Text, { color: "red", wrap: "wrap", children: msg.content })] })), msg.role === 'explain' && (_jsxs(Box, { borderStyle: "round", borderColor: "magenta", paddingX: 1, children: [_jsx(Text, { bold: true, color: "magenta", children: "\uD83D\uDCA1 Explain " }), _jsx(Text, { wrap: "wrap", children: msg.content })] }))] }, i))), streamingContent !== '' && (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, marginBottom: 1, children: [_jsx(Text, { bold: true, color: 'cyan', children: "Assistant" }), _jsxs(Text, { wrap: "wrap", children: [streamingContent, "\u258A"] })] })), isThinking && (_jsx(Box, { marginBottom: 1, padding: 1, children: _jsx(Text, { color: "yellow", children: toolInfo || 'Thinking...' }) })), suggestions.length > 0 && (_jsx(Box, { flexDirection: "column", marginBottom: 1, paddingX: 2, children: suggestions.map(s => (_jsx(Text, { dimColor: true, children: s }, s))) })), confirmMessage !== '' ? (_jsxs(Box, { borderStyle: "round", borderColor: "yellow", paddingX: 1, children: [_jsxs(Text, { color: "yellow", children: [" ", confirmMessage, " (y/n): "] }), _jsx(TextInput, { value: confirmInput, onChange: setConfirmInput, onSubmit: (val) => {
-                            const approved = val.toLowerCase() === 'y' || val === '';
-                            confirmResolver?.(approved);
-                            setConfirmMessage('');
-                            setConfirmInput('');
+            setStageEvents([]); // ← add this
+            setToolLog(prev => prev.map(e => e.status === 'running' ? { ...e, status: 'done' } : e));
+            setPlanner(p => p.status === 'active' ? { status: 'done' } : p);
+            setWorkflow(w => w.status === 'active' ? { status: 'done' } : w);
+            setCoder(c => c.status === 'active' ? { status: 'done' } : c);
+            setValidator(v => v.status === 'active' ? { status: 'done' } : v);
+            setJudge(j => j.status === 'active' ? { status: 'done' } : j);
+            setStreamingContent('');
+            setStatusState('idle');
+        }
+    };
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Static, { items: [1], children: (_, i) => (_jsx(Welcome, { name: config.name, version: "1.0.1", workspace: workspaceStats, runtime: {
+                        model: config.preferredModel,
+                        toolsCount: 6,
+                        explainOn: explainMode,
+                        routerOn: true,
+                    } }, i)) }), _jsxs(Box, { flexDirection: "column", padding: 1, children: [messages.map((msg, i) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [msg.role === 'user' && (_jsxs(Box, { borderStyle: "round", borderColor: "white", paddingX: 1, children: [_jsx(Text, { bold: true, color: "white", children: "You" }), _jsx(Text, { wrap: "wrap", children: msg.content })] })), msg.role === 'trace' && msg.traceEvents && (_jsx(Box, { marginLeft: 1, marginBottom: 1, children: _jsx(ProcessTrace, { events: msg.traceEvents, active: false }) })), msg.role === 'assistant' && (() => {
+                                const rendered = renderMarkdown(msg.content);
+                                const isLong = msg.content.split('\n').length > 6;
+                                if (isLong) {
+                                    return (_jsxs(Box, { flexDirection: "column", marginLeft: 1, children: [_jsx(Text, { bold: true, color: "cyan", children: "Assistant" }), _jsx(Text, { children: rendered })] }));
+                                }
+                                return (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, children: [_jsx(Text, { bold: true, color: "cyan", children: " Assistant " }), _jsxs(Text, { children: [" ", rendered, " "] })] }));
+                            })(), msg.role === 'error' && (_jsxs(Box, { borderStyle: "round", borderColor: "red", paddingX: 1, children: [_jsx(Text, { bold: true, color: "red", children: " Error " }), _jsx(Text, { color: "red", wrap: "wrap", children: renderMarkdown(msg.content) })] })), msg.role === 'explain' && (_jsx(ExplainCard, { footer: "to switch: /explain off \u00B7 or set explainMode: false in ~/.glitool/config.json", children: renderMarkdown(msg.content) }))] }, i))), streamingContent !== '' && (_jsxs(Box, { borderStyle: "round", borderColor: "cyan", paddingX: 1, marginBottom: 1, children: [_jsx(Text, { bold: true, color: 'cyan', children: "Assistant" }), _jsxs(Text, { wrap: "wrap", children: [streamingContent, "\u258A"] })] })), (statusState === 'working' || stageEvents.length > 0) && (stageEvents.length > 0
+                        ? _jsx(ProcessTrace, { events: stageEvents, active: statusState === 'working' })
+                        : _jsx(ToolLog, { entries: toolLog })), _jsx(SlashPalette, { items: paletteItems, selectedIndex: paletteIndex }), confirmRequest ? (_jsx(ConfirmCard, { request: confirmRequest, onChoice: (choice) => {
+                            if (choice === 'd')
+                                return; // TODO: show full diff later
+                            log('confirm:choice', { choice, hasResolver: !!confirmResolver });
+                            const resolve = confirmResolver;
+                            setConfirmRequest(null);
                             setConfirmResolver(null);
-                        } })] })) :
-                _jsxs(Box, { borderStyle: "round", borderColor: input.length > 200 ? 'yellow' : 'green', paddingX: 1, children: [_jsx(Text, { bold: true, color: "green", children: " You: " }), _jsx(TextInput, { value: input, onChange: handleChange, onSubmit: handleSubmit, placeholder: "Type a message or /help..." }), input.length > 50 && (_jsxs(Text, { dimColor: true, children: [" [", input.length, "]"] }))] })] }));
+                            setStatusState('working');
+                            resolve?.(choice === 'y');
+                            log('confirm:resolved', { value: choice === 'y' });
+                        } })) : showAuth ? (_jsx(AuthFlow, { onDone: (auth) => {
+                            setShowAuth(false);
+                            setMessages(prev => [...prev, {
+                                    role: 'assistant',
+                                    content: `✓ Signed in as ${auth.email}  ·  ${auth.plan}  ·  ${auth.requestsRemaining ?? 50} req/month`,
+                                }]);
+                        }, onCancel: () => setShowAuth(false) })) : (_jsxs(_Fragment, { children: [pastedContent && (() => {
+                                const { headline, body } = pastePreview(pastedContent);
+                                return (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: colors.mustard, paddingX: 1, marginBottom: 0, children: [_jsxs(Box, { children: [_jsx(Text, { color: colors.mustard, bold: true, children: "\uD83D\uDCCE PASTED  " }), _jsx(Text, { color: colors.muted, children: headline }), _jsx(Text, { color: colors.muted, children: "  \u00B7  " }), _jsx(Text, { color: colors.amber, bold: true, children: "Esc" }), _jsx(Text, { color: colors.muted, children: " to remove  \u00B7  will prepend on send" })] }), _jsx(Text, { color: colors.muted, dimColor: true, children: body })] }));
+                            })(), _jsxs(Box, { borderStyle: "round", borderColor: input.length > 200 ? 'yellow' : 'green', paddingX: 1, children: [_jsx(Text, { bold: true, color: "green", children: " You: " }), _jsx(TextInput, { value: input, onChange: handleChange, onSubmit: handleSubmit, placeholder: "Type a message or /help..." }, inputKey), input.length > 50 && (_jsxs(Text, { dimColor: true, children: [" [", input.length, "]"] }))] })] })), escalation && (_jsx(EscalationCard, { payload: escalation, onChoice: (choice) => {
+                            if (choice === 'approve') {
+                                setEscalation(null);
+                            }
+                            else if (choice === 'abort') {
+                                setMessages(prev => prev.slice(0, -1));
+                                setEscalation(null);
+                                setMessages(prev => [...prev, {
+                                        role: 'error',
+                                        content: 'Aborted. The last response was discarded.',
+                                    }]);
+                            }
+                            else if (choice === 'correct') {
+                                setEscalation(null);
+                                setMessages(prev => [...prev, {
+                                        role: 'assistant',
+                                        content: 'Tell me what to fix and I will retry.',
+                                    }]);
+                            }
+                        } }))] }), _jsx(StatusBar, { state: statusState, detail: statusDetail, tier: auth?.plan, anonLeft: anonLeft, model: config.preferredModel, tokens: tokens, cost: cost })] }));
 };

package/dist/ui/AuthFlow.js

@@ -0,0 +1,76 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import React, { useState, useEffect, useRef } from 'react';
+import { Box, Text } from 'ink';
+import { colors } from './tokens.js';
+import { startDeviceFlow, pollDeviceFlow, saveAuth } from '../auth.js';
+const SPINNER = ['◐', '◓', '◑', '◒'];
+export const AuthFlow = ({ onDone, onCancel }) => {
+    const [flow, setFlow] = useState(null);
+    const [phase, setPhase] = useState('loading');
+    const [errorMsg, setErrorMsg] = useState('');
+    const [frame, setFrame] = useState(0);
+    const pollTimer = useRef(null);
+    const spinTimer = useRef(null);
+    useEffect(() => {
+        spinTimer.current = setInterval(() => setFrame(f => (f + 1) % SPINNER.length), 180);
+        startDeviceFlow()
+            .then(data => {
+            setFlow(data);
+            setPhase('waiting');
+            pollTimer.current = setInterval(async () => {
+                try {
+                    const result = await pollDeviceFlow(data.device_code);
+                    if (result.status === 'complete' && result.access_token) {
+                        clearInterval(pollTimer.current);
+                        clearInterval(spinTimer.current);
+                        const auth = {
+                            token: result.access_token,
+                            plan: result.plan ?? 'free',
+                            email: result.email ?? '',
+                            requestsRemaining: result.requests_remaining ?? 50,
+                            resetDate: result.reset_date ?? '',
+                            savedAt: new Date().toISOString(),
+                        };
+                        saveAuth(auth);
+                        setPhase('success');
+                        setTimeout(() => onDone(auth), 1200);
+                    }
+                    else if (result.status === 'expired') {
+                        clearInterval(pollTimer.current);
+                        clearInterval(spinTimer.current);
+                        setPhase('expired');
+                    }
+                }
+                catch {
+                    // network hiccup — keep polling
+                }
+            }, 5000);
+        })
+            .catch(err => {
+            clearInterval(spinTimer.current);
+            setPhase('error');
+            setErrorMsg(err?.message ?? 'Could not reach Glitool server');
+        });
+        return () => {
+            if (pollTimer.current)
+                clearInterval(pollTimer.current);
+            if (spinTimer.current)
+                clearInterval(spinTimer.current);
+        };
+    }, []);
+    if (phase === 'loading') {
+        return (_jsxs(Box, { borderStyle: "round", borderColor: colors.amber, paddingX: 1, children: [_jsxs(Text, { color: colors.amber, children: [SPINNER[frame], "  "] }), _jsx(Text, { color: colors.muted, children: "Connecting to Glitool..." })] }));
+    }
+    if (phase === 'error') {
+        return (_jsxs(Box, { borderStyle: "round", borderColor: colors.rust, paddingX: 1, flexDirection: "column", children: [_jsxs(Text, { color: colors.rust, children: ["\u2717 Sign-in failed: ", errorMsg] }), _jsx(Text, { color: colors.muted, dimColor: true, children: "Type /signup to try again, or Esc to cancel." })] }));
+    }
+    if (phase === 'expired') {
+        return (_jsxs(Box, { borderStyle: "round", borderColor: colors.rust, paddingX: 1, flexDirection: "column", children: [_jsx(Text, { color: colors.rust, children: "\u2717 Code expired." }), _jsx(Text, { color: colors.muted, dimColor: true, children: "Type /signup to get a new code." })] }));
+    }
+    if (phase === 'success') {
+        return (_jsx(Box, { borderStyle: "round", borderColor: colors.sage, paddingX: 1, children: _jsx(Text, { color: colors.sage, children: "\u2713 Signed in! Glitool is ready." }) }));
+    }
+    // waiting
+    const activateUrl = `${flow.verification_uri}?code=${flow.user_code}`;
+    return (_jsxs(Box, { borderStyle: "round", borderColor: colors.amber, paddingX: 1, flexDirection: "column", children: [_jsx(Text, { color: colors.amber, bold: true, children: "Sign in to Glitool  (free \u00B7 50 req/month)" }), _jsx(Text, { children: " " }), _jsx(Text, { color: colors.muted, children: "1.  Open this URL in your browser:" }), _jsxs(Text, { color: "cyan", children: ["    ", activateUrl] }), _jsx(Text, { children: " " }), _jsxs(Text, { color: colors.muted, children: ["2.  Your terminal code: ", _jsx(Text, { color: "white", bold: true, children: flow.user_code })] }), _jsx(Text, { children: " " }), _jsxs(Text, { color: colors.muted, children: [SPINNER[frame], "  Waiting for sign-in...  ", _jsx(Text, { dimColor: true, children: "(Esc to cancel)" })] })] }));
+};

package/dist/ui/ConfirmCard.js

@@ -0,0 +1,53 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import React from "react";
+import { Box, Text, useInput } from "ink";
+import { colors } from "./tokens.js";
+import { symbols } from "./symbols.js";
+function buildDiff(req) {
+    const lines = [];
+    if (req.type === 'write') {
+        const all = (req.content ?? '').split('\n');
+        all.slice(0, 20).forEach(text => lines.push({ type: 'add', text }));
+        if (all.length > 20) {
+            lines.push({ type: 'context', text: `...${all.length - 20} more lines` });
+        }
+    }
+    else {
+        (req.oldString ?? '').split('\n').forEach(text => lines.push({ type: 'remove', text }));
+        (req.newString ?? '').split('\n').forEach(text => lines.push({ type: 'add', text }));
+    }
+    return lines;
+}
+const DiffLine = ({ line }) => {
+    if (line.type === 'add') {
+        return _jsxs(Text, { color: colors.sage, children: [" ", symbols.add, " ", line.text] });
+    }
+    if (line.type === 'remove') {
+        return _jsxs(Text, { color: colors.rust, children: [" ", symbols.remove, " ", line.text] });
+    }
+    return _jsxs(Text, { color: colors.muted, children: [" ", line.text] });
+};
+export const ConfirmCard = ({ request, onChoice }) => {
+    useInput((input, key) => {
+        const lower = input.toLowerCase();
+        if (lower === 'y' || key.return) {
+            onChoice('y');
+            return;
+        }
+        if (lower === 'n' || key.escape) {
+            onChoice('n');
+            return;
+        }
+        if (lower === 'd') {
+            onChoice('d');
+            return;
+        }
+    });
+    const risk = request.risk ?? 'low';
+    const riskColor = risk === 'high' ? colors.rust : colors.mustard;
+    const verb = request.type === 'write' ? 'write' : 'edit';
+    const diffLines = buildDiff(request);
+    const added = diffLines.filter(l => l.type === 'add').length;
+    const removed = diffLines.filter(l => l.type === 'remove').length;
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Box, { marginBottom: 1, children: [_jsx(Text, { color: colors.mustard, bold: true, children: symbols.warning }), _jsxs(Text, { color: colors.ink, bold: true, children: ["glitool wants to ", verb, " ", request.filePath] }), _jsx(Text, { color: colors.muted, children: "     " }), _jsxs(Text, { color: riskColor, bold: true, children: ["risk \u00B7 ", risk] })] }), _jsxs(Box, { borderStyle: "single", borderColor: colors.line, flexDirection: "column", paddingX: 1, children: [_jsxs(Box, { children: [_jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: colors.muted, children: request.filePath }) }), _jsxs(Text, { color: colors.sage, children: ["+", added] }), _jsx(Text, { color: colors.muted, children: "  " }), _jsxs(Text, { color: colors.rust, children: ["-", removed] })] }), diffLines.map((line, i) => (_jsx(DiffLine, { line: line }, i)))] }), _jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: colors.muted, children: "Apply this change?   " }), _jsx(Text, { color: colors.amber, bold: true, children: "[d]" }), _jsx(Text, { color: colors.muted, children: " view full diff   " }), _jsx(Text, { color: colors.amber, bold: true, children: "[n]" }), _jsx(Text, { color: colors.muted, children: " reject   " }), _jsx(Text, { color: colors.amber, bold: true, children: "[y]" }), _jsx(Text, { color: colors.muted, children: " approve" })] })] }));
+};