@devang0907/agent-dev 0.1.2 → 0.1.4

package/dist/providers/openrouter-free.js

@@ -1,4 +1,5 @@
 import OpenAI from "openai";
+import { toOpenAIMessages, toOpenAITools, processOpenAIStream, formatApiError, } from "./openai-compat.js";
 export const PROVIDER_ID = "free";
 export const DEFAULT_MODEL = "meta-llama/llama-3.3-70b-instruct:free";
 export const API_KEY_ENV = "OPENROUTER_API_KEY";
@@ -26,51 +27,6 @@ export function getApiKey(settings) {
 export function hasAuth(settings) {
     return !!getApiKey(settings);
 }
-function toOpenAIMessages(ctx) {
-    const msgs = [];
-    if (ctx.systemPrompt) {
-        msgs.push({ role: "system", content: ctx.systemPrompt });
-    }
-    for (const m of ctx.messages) {
-        if (m.role === "user") {
-            msgs.push({ role: "user", content: m.content });
-        }
-        else if (m.role === "assistant") {
-            if (m.toolCalls?.length) {
-                msgs.push({
-                    role: "assistant",
-                    content: m.content || null,
-                    tool_calls: m.toolCalls.map((tc) => ({
-                        id: tc.id,
-                        type: "function",
-                        function: { name: tc.name, arguments: tc.arguments },
-                    })),
-                });
-            }
-            else {
-                msgs.push({ role: "assistant", content: m.content });
-            }
-        }
-        else if (m.role === "tool") {
-            msgs.push({
-                role: "tool",
-                tool_call_id: m.toolCallId,
-                content: m.content,
-            });
-        }
-    }
-    return msgs;
-}
-function toOpenAITools(tools) {
-    return tools.map((t) => ({
-        type: "function",
-        function: {
-            name: t.name,
-            description: t.description,
-            parameters: t.parameters,
-        },
-    }));
-}
 export async function* streamChat(model, ctx, settings) {
     const apiKey = getApiKey(settings);
     if (!apiKey) {
@@ -85,49 +41,19 @@ export async function* streamChat(model, ctx, settings) {
             "X-Title": "agent-dev",
         },
     });
+    const hasTools = ctx.tools.length > 0;
     try {
         const stream = await client.chat.completions.create({
             model: model.id,
             messages: toOpenAIMessages(ctx),
-            tools: ctx.tools.length > 0 ? toOpenAITools(ctx.tools) : undefined,
+            tools: hasTools ? toOpenAITools(ctx.tools) : undefined,
+            tool_choice: hasTools ? "auto" : undefined,
+            parallel_tool_calls: false,
             stream: true,
         }, { signal: ctx.signal });
-        const toolCalls = new Map();
-        for await (const chunk of stream) {
-            const delta = chunk.choices[0]?.delta;
-            if (!delta)
-                continue;
-            if (delta.content) {
-                yield { type: "text_delta", delta: delta.content };
-            }
-            if (delta.tool_calls) {
-                for (const tc of delta.tool_calls) {
-                    const idx = tc.index;
-                    if (!toolCalls.has(idx)) {
-                        toolCalls.set(idx, { id: tc.id ?? "", name: tc.function?.name ?? "", arguments: "" });
-                    }
-                    const existing = toolCalls.get(idx);
-                    if (tc.id)
-                        existing.id = tc.id;
-                    if (tc.function?.name)
-                        existing.name = tc.function.name;
-                    if (tc.function?.arguments) {
-                        existing.arguments += tc.function.arguments;
-                        yield {
-                            type: "tool_call_delta",
-                            index: idx,
-                            id: existing.id,
-                            name: existing.name,
-                            argumentsDelta: tc.function.arguments,
-                        };
-                    }
-                }
-            }
-        }
-        yield { type: "done" };
+        yield* processOpenAIStream(stream);
     }
     catch (err) {
-        const message = err instanceof Error ? err.message : String(err);
-        yield { type: "error", message };
+        yield { type: "error", message: formatApiError(err) };
     }
 }

package/dist/ui/ApiKeyPrompt.js

@@ -4,7 +4,6 @@ import { Box, Text, useInput } from "ink";
 import { PROVIDER_LABELS } from "../config/models.js";
 import { PROVIDER_ENV_VARS } from "../providers/registry.js";
 import { LeftBorder } from "./LeftBorder.js";
-import { Panel } from "./Panel.js";
 function BlinkingCursor({ theme, visible }) {
     if (!visible)
         return null;
@@ -35,8 +34,8 @@ export function ApiKeyPrompt({ theme, provider, model, onSubmit, onCancel }) {
         if (input && !key.ctrl && !key.meta) {
             setValue((v) => v + input);
         }
-    });
+    }, { isActive: true });
     const envVars = PROVIDER_ENV_VARS[provider];
     const masked = "•".repeat(value.length);
-    return (_jsx(Box, { paddingX: 2, marginTop: 1, children: _jsxs(LeftBorder, { theme: theme, borderColor: theme.borderActive, children: [_jsx(Text, { color: theme.text, bold: true, children: "API key required" }), _jsx(Text, { color: theme.textMuted, children: " Enter save \u00B7 Esc back" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { color: theme.textMuted, children: ["Provider: ", PROVIDER_LABELS[provider]] }), _jsxs(Text, { color: theme.textMuted, children: ["Model: ", model.name] })] }), _jsx(Box, { marginTop: 1, children: _jsx(Panel, { theme: theme, borderColor: theme.primary, marginBottom: 0, children: _jsx(Box, { flexDirection: "row", children: value.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.text, children: masked }), _jsx(BlinkingCursor, { theme: theme, visible: cursorOn })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.textMuted, children: "Paste API key\u2026" }), _jsx(BlinkingCursor, { theme: theme, visible: cursorOn })] })) }) }) }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.textMuted, children: ["Or set env: ", envVars.join(" · ")] }) })] }) }));
+    return (_jsx(Box, { flexDirection: "column", marginX: 2, marginTop: 1, marginBottom: 1, children: _jsxs(LeftBorder, { theme: theme, borderColor: theme.primary, children: [_jsx(Text, { color: theme.text, bold: true, children: "API key required" }), _jsx(Text, { color: theme.textMuted, children: " Enter save \u00B7 Esc cancel" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { color: theme.textMuted, children: ["Provider: ", PROVIDER_LABELS[provider]] }), _jsxs(Text, { color: theme.textMuted, children: ["Model: ", model.name] })] }), _jsx(Box, { flexDirection: "row", marginTop: 1, borderStyle: "round", borderColor: theme.primary, paddingX: 1, paddingY: 0, children: value.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.text, children: masked }), _jsx(BlinkingCursor, { theme: theme, visible: cursorOn })] })) : (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.textMuted, children: "Paste API key here\u2026" }), _jsx(BlinkingCursor, { theme: theme, visible: cursorOn })] })) }), _jsxs(Box, { marginTop: 1, children: [_jsxs(Text, { color: theme.textMuted, children: ["Or set env: ", envVars.join(" · ")] }), _jsx(Text, { color: theme.textMuted, children: "Saved to ~/.agent-dev/settings.json" })] })] }) }));
 }

package/dist/ui/App.d.ts

@@ -1,6 +1,7 @@
 import React from "react";
 import type { AgentSession } from "../agent/session.js";
 export interface DisplayMessage {
+    id: number;
     role: "user" | "assistant" | "tool";
     content: string;
     toolName?: string;

package/dist/ui/App.js

@@ -1,44 +1,98 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useEffect, useCallback, useRef } from "react";
-import { Box, useInput, useApp } from "ink";
+import { Box, useInput, useApp, useStdout } from "ink";
 import { ChatView } from "./ChatView.js";
 import { Editor } from "./Editor.js";
 import { Footer } from "./Footer.js";
 import { ModelSelector } from "./ModelSelector.js";
 import { ApiKeyPrompt } from "./ApiKeyPrompt.js";
 import { SettingsView } from "./SettingsView.js";
-import { hasProviderAuth } from "../providers/registry.js";
+import { hasProviderAuth, getDefaultModelForProvider } from "../providers/registry.js";
+import { findModel } from "../config/models.js";
+import { CommandApprovalPrompt } from "./CommandApprovalPrompt.js";
 import { StartupBanner } from "./StartupBanner.js";
 import { getTheme } from "./theme.js";
-import { saveSettings } from "../config/settings.js";
+import { scrollViewportToBottom } from "./scroll.js";
+let nextMessageId = 0;
+function toDisplayMessage(role, content, toolName) {
+    return { id: nextMessageId++, role, content, toolName };
+}
+function modelForProvider(provider, settings) {
+    const current = findModel(settings.defaultProvider, settings.defaultModel);
+    if (current?.provider === provider)
+        return current;
+    return getDefaultModelForProvider(provider);
+}
 export function App({ session, workdir, onQuit }) {
     const { exit } = useApp();
-    const [displayMessages, setDisplayMessages] = useState(() => session.getMessages().map((m) => ({
-        role: m.role === "tool" ? "tool" : m.role === "user" ? "user" : "assistant",
-        content: m.content,
-        toolName: m.name,
-    })));
+    const [displayMessages, setDisplayMessages] = useState(() => session.getMessages().map((m) => toDisplayMessage(m.role === "tool" ? "tool" : m.role === "user" ? "user" : "assistant", m.content, m.name)));
     const [streamingText, setStreamingText] = useState("");
     const [overlay, setOverlay] = useState("none");
     const [modelFilter, setModelFilter] = useState();
     const [pendingModel, setPendingModel] = useState(null);
+    const [apiKeyReturnOverlay, setApiKeyReturnOverlay] = useState("none");
     const [settings, setSettings] = useState(session.getSettings());
     const [model, setModel] = useState(session.getModel());
     const [running, setRunning] = useState(false);
+    const [autoFollow, setAutoFollow] = useState(true);
+    const [pendingCommand, setPendingCommand] = useState(null);
     const streamingRef = useRef("");
+    const autoFollowRef = useRef(true);
+    const startupChecked = useRef(false);
     const theme = getTheme();
+    const { stdout } = useStdout();
+    const openApiKeyPrompt = useCallback((target, returnTo = "none") => {
+        setPendingModel(target);
+        setApiKeyReturnOverlay(returnTo);
+        setOverlay("apiKey");
+    }, []);
+    const saveApiKey = useCallback((apiKey) => {
+        if (!pendingModel)
+            return;
+        const updated = {
+            ...settings,
+            apiKeys: { ...settings.apiKeys, [pendingModel.provider]: apiKey },
+        };
+        session.updateSettings(updated);
+        setSettings(updated);
+        session.setModel(pendingModel);
+        setModel(pendingModel);
+        setPendingModel(null);
+        setOverlay(apiKeyReturnOverlay);
+        setApiKeyReturnOverlay("none");
+        setModelFilter(undefined);
+    }, [pendingModel, settings, session, apiKeyReturnOverlay]);
+    useEffect(() => {
+        if (startupChecked.current)
+            return;
+        startupChecked.current = true;
+        const current = session.getModel();
+        if (!hasProviderAuth(current.provider, settings)) {
+            openApiKeyPrompt(current, "none");
+        }
+    }, [session, settings, openApiKeyPrompt]);
+    useEffect(() => {
+        if (autoFollow && streamingText) {
+            scrollViewportToBottom(stdout);
+        }
+    }, [streamingText, autoFollow, stdout]);
     useEffect(() => {
         const handler = (event) => {
             switch (event.type) {
                 case "user_message":
-                    setDisplayMessages((prev) => [...prev, { role: "user", content: event.content }]);
+                    autoFollowRef.current = true;
+                    setAutoFollow(true);
+                    setDisplayMessages((prev) => [...prev, toDisplayMessage("user", event.content)]);
                     setRunning(true);
                     streamingRef.current = "";
                     setStreamingText("");
+                    scrollViewportToBottom(stdout);
                     break;
                 case "message_start":
                     streamingRef.current = "";
                     setStreamingText("");
+                    if (autoFollowRef.current)
+                        scrollViewportToBottom(stdout);
                     break;
                 case "text_delta":
                     streamingRef.current += event.delta;
@@ -47,7 +101,7 @@ export function App({ session, workdir, onQuit }) {
                 case "tool_call":
                     const partial = streamingRef.current;
                     if (partial) {
-                        setDisplayMessages((prev) => [...prev, { role: "assistant", content: partial }]);
+                        setDisplayMessages((prev) => [...prev, toDisplayMessage("assistant", partial)]);
                         streamingRef.current = "";
                         setStreamingText("");
                     }
@@ -55,13 +109,13 @@ export function App({ session, workdir, onQuit }) {
                 case "tool_result":
                     setDisplayMessages((prev) => [
                         ...prev,
-                        { role: "tool", content: event.result, toolName: event.name },
+                        toDisplayMessage("tool", event.result, event.name),
                     ]);
                     break;
                 case "turn_end":
                     const final = streamingRef.current;
                     if (final) {
-                        setDisplayMessages((prev) => [...prev, { role: "assistant", content: final }]);
+                        setDisplayMessages((prev) => [...prev, toDisplayMessage("assistant", final)]);
                     }
                     streamingRef.current = "";
                     setStreamingText("");
@@ -70,11 +124,19 @@ export function App({ session, workdir, onQuit }) {
                 case "error":
                     setDisplayMessages((prev) => [
                         ...prev,
-                        { role: "assistant", content: `Error: ${event.message}` },
+                        toDisplayMessage("assistant", `Error: ${event.message}`),
                     ]);
                     streamingRef.current = "";
                     setStreamingText("");
                     setRunning(false);
+                    setPendingCommand(null);
+                    if (/Missing .*API_KEY/i.test(event.message)) {
+                        openApiKeyPrompt(model, "none");
+                    }
+                    break;
+                case "permission_request":
+                    setPendingCommand(event.request);
+                    setOverlay("commandApproval");
                     break;
                 case "model_changed":
                     setModel(event.model);
@@ -85,14 +147,26 @@ export function App({ session, workdir, onQuit }) {
         return () => {
             session.off("event", handler);
         };
-    }, [session]);
-    useInput((_, key) => {
+    }, [session, model, openApiKeyPrompt, stdout]);
+    autoFollowRef.current = autoFollow;
+    useInput((input, key) => {
         if (overlay !== "none")
             return;
         if (key.escape && running) {
             session.abort();
+            return;
+        }
+        if (key.pageUp || (key.upArrow && key.shift)) {
+            autoFollowRef.current = false;
+            setAutoFollow(false);
+            return;
         }
-    });
+        if (input === "g" && key.ctrl) {
+            autoFollowRef.current = true;
+            setAutoFollow(true);
+            scrollViewportToBottom(stdout);
+        }
+    }, { isActive: overlay === "none" });
     const handleSubmit = useCallback(async (value) => {
         if (value === "/quit") {
             onQuit();
@@ -103,6 +177,7 @@ export function App({ session, workdir, onQuit }) {
             session.newSession();
             setDisplayMessages([]);
             setStreamingText("");
+            setAutoFollow(true);
             return;
         }
         if (value === "/settings") {
@@ -117,13 +192,19 @@ export function App({ session, workdir, onQuit }) {
         }
         if (running)
             return;
+        if (!hasProviderAuth(model.provider, settings)) {
+            openApiKeyPrompt(model, "none");
+            return;
+        }
         await session.prompt(value);
-    }, [session, running, onQuit, exit]);
+    }, [session, running, onQuit, exit, model, settings, openApiKeyPrompt]);
     const hasChat = displayMessages.length > 0 || streamingText.length > 0;
-    return (_jsxs(Box, { flexDirection: "column", height: "100%", children: [_jsx(Box, { paddingX: 2, marginBottom: 1, children: _jsx(StartupBanner, { theme: theme, compact: hasChat }) }), _jsx(ChatView, { messages: displayMessages, theme: theme, model: model, streamingText: streamingText, running: running }), _jsx(Footer, { workdir: workdir, model: model, theme: theme }), overlay === "none" && (_jsx(Editor, { theme: theme, model: model, disabled: running, running: running, onSubmit: handleSubmit })), overlay === "model" && (_jsx(ModelSelector, { theme: theme, settings: settings, filter: modelFilter, onSelect: (m) => {
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Box, { paddingX: 2, marginBottom: 1, flexShrink: 0, children: _jsx(StartupBanner, { theme: theme, compact: hasChat }) }), _jsx(ChatView, { messages: displayMessages, theme: theme, model: model, streamingText: streamingText, running: running, autoFollow: autoFollow }), _jsx(Footer, { workdir: workdir, model: model, theme: theme }), overlay === "none" && (_jsx(Box, { flexShrink: 0, children: _jsx(Editor, { theme: theme, model: model, disabled: running, running: running, onSubmit: handleSubmit, onPauseFollow: () => {
+                        autoFollowRef.current = false;
+                        setAutoFollow(false);
+                    } }) })), overlay === "model" && (_jsx(ModelSelector, { theme: theme, settings: settings, filter: modelFilter, onSelect: (m) => {
                     if (!hasProviderAuth(m.provider, settings)) {
-                        setPendingModel(m);
-                        setOverlay("apiKey");
+                        openApiKeyPrompt(m, "model");
                         return;
                     }
                     session.setModel(m);
@@ -133,24 +214,22 @@ export function App({ session, workdir, onQuit }) {
                 }, onClose: () => {
                     setOverlay("none");
                     setModelFilter(undefined);
-                } })), overlay === "apiKey" && pendingModel && (_jsx(ApiKeyPrompt, { theme: theme, provider: pendingModel.provider, model: pendingModel, onSubmit: (apiKey) => {
-                    const updated = {
-                        ...settings,
-                        apiKeys: { ...settings.apiKeys, [pendingModel.provider]: apiKey },
-                    };
-                    session.updateSettings(updated);
-                    setSettings(updated);
-                    session.setModel(pendingModel);
-                    setModel(pendingModel);
+                } })), overlay === "apiKey" && pendingModel && (_jsx(ApiKeyPrompt, { theme: theme, provider: pendingModel.provider, model: pendingModel, onSubmit: saveApiKey, onCancel: () => {
                     setPendingModel(null);
-                    setOverlay("none");
-                    setModelFilter(undefined);
-                }, onCancel: () => {
-                    setPendingModel(null);
-                    setOverlay("model");
+                    setOverlay(apiKeyReturnOverlay);
+                    setApiKeyReturnOverlay("none");
                 } })), overlay === "settings" && (_jsx(SettingsView, { theme: theme, settings: settings, onUpdate: (s) => {
                     session.updateSettings(s);
                     setSettings(s);
-                    saveSettings(s);
-                }, onClose: () => setOverlay("none") }))] }));
+                }, onSetApiKey: (provider) => {
+                    openApiKeyPrompt(modelForProvider(provider, settings), "settings");
+                }, onClose: () => setOverlay("none") })), overlay === "commandApproval" && pendingCommand && (_jsx(CommandApprovalPrompt, { theme: theme, request: pendingCommand, onApprove: () => {
+                    session.respondToPermission(true);
+                    setPendingCommand(null);
+                    setOverlay("none");
+                }, onDeny: () => {
+                    session.respondToPermission(false);
+                    setPendingCommand(null);
+                    setOverlay("none");
+                } }))] }));
 }

package/dist/ui/ChatView.d.ts

@@ -8,6 +8,7 @@ interface ChatViewProps {
     model: Model;
     streamingText?: string;
     running?: boolean;
+    autoFollow?: boolean;
 }
-export declare function ChatView({ messages, theme, model, streamingText, running }: ChatViewProps): React.JSX.Element | null;
+export declare function ChatView({ messages, theme, model, streamingText, running, autoFollow, }: ChatViewProps): React.JSX.Element | null;
 export {};

package/dist/ui/ChatView.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useState, useEffect } from "react";
-import { Box, Text } from "ink";
+import { useEffect, useState } from "react";
+import { Box, Static, Text } from "ink";
 import { SPINNER_FRAMES, TOOL_ICONS } from "./theme.js";
 import { LeftBorder } from "./LeftBorder.js";
 import { Panel } from "./Panel.js";
@@ -8,7 +8,16 @@ import { modelRef } from "../config/models.js";
 function truncate(text, max) {
     return text.length > max ? text.slice(0, max) + "…" : text;
 }
-export function ChatView({ messages, theme, model, streamingText, running }) {
+function StaticMessage({ msg, theme, model, }) {
+    if (msg.role === "user") {
+        return (_jsx(Box, { flexDirection: "column", marginBottom: 1, children: _jsx(LeftBorder, { theme: theme, borderColor: theme.primary, marginBottom: 0, children: _jsx(Text, { color: theme.text, children: msg.content }) }) }));
+    }
+    if (msg.role === "assistant") {
+        return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, paddingLeft: 1, children: [_jsx(Text, { color: theme.text, children: msg.content || "" }), _jsxs(Text, { color: theme.textMuted, children: [_jsx(Text, { color: theme.primary, children: "\u25A3 " }), modelRef(model)] })] }));
+    }
+    return (_jsx(Box, { paddingLeft: 1, marginBottom: 1, children: _jsxs(Text, { color: theme.text, children: [_jsx(Text, { color: theme.textMuted, children: TOOL_ICONS[msg.toolName ?? ""] ?? "⚙" }), " ", _jsx(Text, { bold: true, children: msg.toolName }), _jsxs(Text, { color: theme.textMuted, children: [" ", truncate(msg.content, 500)] })] }) }));
+}
+export function ChatView({ messages, theme, model, streamingText, running, autoFollow = true, }) {
     const [spinIdx, setSpinIdx] = useState(0);
     const hasContent = messages.length > 0 || (streamingText?.length ?? 0) > 0;
     useEffect(() => {
@@ -20,5 +29,6 @@ export function ChatView({ messages, theme, model, streamingText, running }) {
     if (!hasContent) {
         return null;
     }
-    return (_jsxs(Panel, { theme: theme, flexGrow: 1, borderColor: theme.border, children: [messages.map((msg, i) => (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [msg.role === "user" && (_jsx(LeftBorder, { theme: theme, borderColor: theme.primary, marginBottom: 0, children: _jsx(Text, { color: theme.text, children: msg.content }) })), msg.role === "assistant" && (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, children: [_jsx(Text, { color: theme.text, children: msg.content || "" }), _jsxs(Text, { color: theme.textMuted, children: [_jsx(Text, { color: theme.primary, children: "\u25A3 " }), modelRef(model)] })] })), msg.role === "tool" && (_jsx(Box, { paddingLeft: 1, children: _jsxs(Text, { color: theme.text, children: [_jsx(Text, { color: theme.textMuted, children: TOOL_ICONS[msg.toolName ?? ""] ?? "⚙" }), " ", _jsx(Text, { bold: true, children: msg.toolName }), _jsxs(Text, { color: theme.textMuted, children: [" ", truncate(msg.content, 200)] })] }) }))] }, i))), streamingText && (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, children: [_jsx(Text, { color: theme.text, children: streamingText }), _jsxs(Text, { color: theme.textMuted, children: [_jsxs(Text, { color: theme.primary, children: [SPINNER_FRAMES[spinIdx], " "] }), "responding\u2026"] })] })), running && !streamingText && messages.length > 0 && (_jsx(Box, { paddingLeft: 1, children: _jsxs(Text, { color: theme.textMuted, children: [_jsx(Text, { color: theme.primary, children: SPINNER_FRAMES[spinIdx] }), " working\u2026"] }) }))] }));
+    const showWorking = running && !streamingText && messages.length > 0;
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Static, { items: messages, children: (msg) => (_jsx(StaticMessage, { msg: msg, theme: theme, model: model }, msg.id)) }), (streamingText || showWorking) && (_jsxs(Panel, { theme: theme, borderColor: theme.border, marginBottom: 1, children: [streamingText && (_jsxs(Box, { flexDirection: "column", paddingLeft: 1, children: [_jsx(Text, { color: theme.text, children: streamingText }), _jsxs(Text, { color: theme.textMuted, children: [_jsxs(Text, { color: theme.primary, children: [SPINNER_FRAMES[spinIdx], " "] }), "responding\u2026", !autoFollow && (_jsx(Text, { color: theme.warning, children: " \u00B7 paused (Ctrl+G to follow)" }))] })] })), showWorking && (_jsx(Box, { paddingLeft: 1, children: _jsxs(Text, { color: theme.textMuted, children: [_jsx(Text, { color: theme.primary, children: SPINNER_FRAMES[spinIdx] }), " working\u2026"] }) }))] }))] }));
 }

package/dist/ui/CommandApprovalPrompt.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import type { ThemeColors } from "./theme.js";
+import type { PermissionRequest } from "../agent/loop.js";
+interface CommandApprovalPromptProps {
+    theme: ThemeColors;
+    request: PermissionRequest;
+    onApprove: () => void;
+    onDeny: () => void;
+}
+export declare function CommandApprovalPrompt({ theme, request, onApprove, onDeny, }: CommandApprovalPromptProps): React.JSX.Element;
+export {};

package/dist/ui/CommandApprovalPrompt.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useInput } from "ink";
+import { LeftBorder } from "./LeftBorder.js";
+export function CommandApprovalPrompt({ theme, request, onApprove, onDeny, }) {
+    useInput((input, key) => {
+        if (input === "y" || input === "Y") {
+            onApprove();
+            return;
+        }
+        if (input === "n" || input === "N" || key.escape) {
+            onDeny();
+        }
+    }, { isActive: true });
+    return (_jsx(Box, { flexDirection: "column", marginX: 2, marginTop: 1, marginBottom: 1, children: _jsxs(LeftBorder, { theme: theme, borderColor: theme.warning, children: [_jsx(Text, { color: theme.text, bold: true, children: "Run shell command?" }), _jsx(Text, { color: theme.textMuted, children: " y approve \u00B7 n or Esc deny" }), _jsx(Box, { flexDirection: "column", marginTop: 1, borderStyle: "round", borderColor: theme.warning, paddingX: 1, paddingY: 0, children: _jsx(Text, { color: theme.text, children: request.command }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: theme.textMuted, children: "The agent wants to run this command in your project directory." }) })] }) }));
+}

package/dist/ui/Editor.d.ts

@@ -7,6 +7,7 @@ interface EditorProps {
     disabled?: boolean;
     running?: boolean;
     onSubmit: (value: string) => void;
+    onPauseFollow?: () => void;
 }
-export declare function Editor({ theme, model, disabled, running, onSubmit }: EditorProps): React.JSX.Element;
+export declare function Editor({ theme, model, disabled, running, onSubmit, onPauseFollow }: EditorProps): React.JSX.Element;
 export {};

package/dist/ui/Editor.js

@@ -10,7 +10,7 @@ function BlinkingCursor({ theme, visible }) {
         return null;
     return _jsx(Text, { color: theme.primary, children: "\u258C" });
 }
-export function Editor({ theme, model, disabled, running, onSubmit }) {
+export function Editor({ theme, model, disabled, running, onSubmit, onPauseFollow }) {
     const [value, setValue] = useState("");
     const [suggestions, setSuggestions] = useState([]);
     const [spinIdx, setSpinIdx] = useState(0);
@@ -60,6 +60,10 @@ export function Editor({ theme, model, disabled, running, onSubmit }) {
             }
             return;
         }
+        if ((key.pageUp || key.upArrow) && !key.ctrl && !key.meta) {
+            onPauseFollow?.();
+            return;
+        }
         if (key.backspace || key.delete) {
             const newVal = value.slice(0, -1);
             setValue(newVal);
@@ -71,8 +75,8 @@ export function Editor({ theme, model, disabled, running, onSubmit }) {
             setValue(newVal);
             updateSuggestions(newVal);
         }
-    });
+    }, { isActive: !disabled });
     const placeholder = "Ask anything…";
     const showCursor = !disabled && cursorOn;
-    return (_jsxs(Box, { flexDirection: "column", marginX: 2, children: [suggestions.length > 0 && (_jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.border, paddingX: 1, marginBottom: 1, children: suggestions.map((s) => (_jsxs(Text, { children: [_jsx(Text, { color: theme.primary, children: s.cmd }), _jsxs(Text, { color: theme.textMuted, children: [" \u2014 ", s.desc] })] }, s.cmd))) })), _jsxs(Panel, { theme: theme, borderColor: disabled ? theme.border : theme.primary, marginBottom: 0, children: [_jsx(Box, { flexDirection: "row", children: value.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.text, children: value }), _jsx(BlinkingCursor, { theme: theme, visible: showCursor })] })) : showCursor ? (_jsx(BlinkingCursor, { theme: theme, visible: true })) : (_jsx(Text, { color: theme.textMuted, children: placeholder })) }), _jsxs(Text, { color: theme.textMuted, children: ["agent-dev \u00B7 ", _jsx(Text, { color: theme.text, children: modelRef(model) })] })] }), _jsx(Box, { marginTop: 1, marginBottom: 1, children: running ? (_jsxs(Text, { color: theme.textMuted, children: [_jsx(Text, { color: theme.primary, children: SPINNER_FRAMES[spinIdx] }), " ", "esc interrupt"] })) : (_jsx(Text, { color: theme.textMuted, children: "Tab completes /commands" })) })] }));
+    return (_jsxs(Box, { flexDirection: "column", marginX: 2, children: [suggestions.length > 0 && (_jsx(Box, { flexDirection: "column", borderStyle: "round", borderColor: theme.border, paddingX: 1, marginBottom: 1, children: suggestions.map((s) => (_jsxs(Text, { children: [_jsx(Text, { color: theme.primary, children: s.cmd }), _jsxs(Text, { color: theme.textMuted, children: [" \u2014 ", s.desc] })] }, s.cmd))) })), _jsxs(Panel, { theme: theme, borderColor: disabled ? theme.border : theme.primary, marginBottom: 0, children: [_jsx(Box, { flexDirection: "row", children: value.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(Text, { color: theme.text, children: value }), _jsx(BlinkingCursor, { theme: theme, visible: showCursor })] })) : showCursor ? (_jsx(BlinkingCursor, { theme: theme, visible: true })) : (_jsx(Text, { color: theme.textMuted, children: placeholder })) }), _jsxs(Text, { color: theme.textMuted, children: ["agent-dev \u00B7 ", _jsx(Text, { color: theme.text, children: modelRef(model) })] })] }), _jsx(Box, { marginTop: 1, marginBottom: 1, children: running ? (_jsxs(Text, { color: theme.textMuted, children: [_jsx(Text, { color: theme.primary, children: SPINNER_FRAMES[spinIdx] }), " ", "esc interrupt"] })) : (_jsx(Text, { color: theme.textMuted, children: "Tab completes /commands \u00B7 scroll freely \u00B7 Ctrl+G follow" })) })] }));
 }

package/dist/ui/ModelSelector.js

@@ -30,7 +30,7 @@ export function ModelSelector({ theme, settings, filter, onSelect, onClose }) {
         if (key.return && filtered[safeIndex]) {
             onSelect(filtered[safeIndex]);
         }
-    });
+    }, { isActive: true });
     const providers = ["openai", "groq", "gemini", "free"];
     let lastProvider;
     return (_jsx(Box, { paddingX: 2, marginTop: 1, children: _jsxs(LeftBorder, { theme: theme, borderColor: theme.borderActive, children: [_jsx(Text, { color: theme.text, bold: true, children: "/model" }), _jsx(Text, { color: theme.textMuted, children: " \u2191\u2193 navigate \u00B7 Enter select \u00B7 Esc close" }), _jsx(Text, { color: theme.textMuted, children: " Models without a key will prompt for an API key" }), filter && _jsxs(Text, { color: theme.textMuted, children: [" filter: ", filter] }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [filtered.length === 0 && _jsx(Text, { color: theme.textMuted, children: "No models match" }), filtered.map((m, i) => {

package/dist/ui/SettingsView.d.ts

@@ -1,11 +1,13 @@
 import React from "react";
 import type { ThemeColors } from "./theme.js";
 import type { Settings } from "../config/settings.js";
+import type { ProviderId } from "../providers/types.js";
 interface SettingsViewProps {
     theme: ThemeColors;
     settings: Settings;
     onUpdate: (settings: Settings) => void;
+    onSetApiKey: (provider: ProviderId) => void;
     onClose: () => void;
 }
-export declare function SettingsView({ theme, settings, onUpdate, onClose }: SettingsViewProps): React.JSX.Element;
+export declare function SettingsView({ theme, settings, onUpdate, onSetApiKey, onClose }: SettingsViewProps): React.JSX.Element;
 export {};

package/dist/ui/SettingsView.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { Box, Text, useInput } from "ink";
-import { PROVIDER_ENV_VARS } from "../providers/registry.js";
+import { PROVIDER_ENV_VARS, hasProviderAuth } from "../providers/registry.js";
 import { LeftBorder } from "./LeftBorder.js";
 const THINKING_LEVELS = ["off", "minimal", "low", "medium", "high"];
-export function SettingsView({ theme, settings, onUpdate, onClose }) {
+const PROVIDERS = ["openai", "groq", "gemini", "free"];
+export function SettingsView({ theme, settings, onUpdate, onSetApiKey, onClose }) {
+    const items = ["thinkingLevel", ...PROVIDERS];
     const [index, setIndex] = useState(0);
-    const items = ["thinkingLevel", "envKeys"];
     useInput((_, key) => {
         if (key.escape)
             onClose();
@@ -21,12 +22,17 @@ export function SettingsView({ theme, settings, onUpdate, onClose }) {
                 const next = THINKING_LEVELS[(cur + 1) % THINKING_LEVELS.length];
                 onUpdate({ ...settings, thinkingLevel: next });
             }
+            else {
+                onSetApiKey(item);
+            }
         }
-    });
-    const providers = ["openai", "groq", "gemini", "free"];
-    return (_jsx(Box, { paddingX: 2, marginTop: 1, children: _jsxs(LeftBorder, { theme: theme, borderColor: theme.borderActive, children: [_jsx(Text, { color: theme.text, bold: true, children: "/settings" }), _jsx(Text, { color: theme.textMuted, children: " Enter cycle \u00B7 Esc close" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { color: index === 0 ? theme.primary : theme.text, children: [index === 0 ? "› " : "  ", "Thinking:", " ", _jsx(Text, { bold: true, children: settings.thinkingLevel })] }), _jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: index === 1 ? theme.primary : theme.textMuted, children: [index === 1 ? "› " : "  ", "API keys"] }) }), providers.map((p) => {
+    }, { isActive: true });
+    return (_jsx(Box, { paddingX: 2, marginTop: 1, marginBottom: 1, children: _jsxs(LeftBorder, { theme: theme, borderColor: theme.borderActive, children: [_jsx(Text, { color: theme.text, bold: true, children: "/settings" }), _jsx(Text, { color: theme.textMuted, children: " \u2191\u2193 navigate \u00B7 Enter select \u00B7 Esc close" }), _jsxs(Box, { flexDirection: "column", marginTop: 1, children: [_jsxs(Text, { color: index === 0 ? theme.primary : theme.text, children: [index === 0 ? "› " : "  ", "Thinking:", " ", _jsx(Text, { bold: true, children: settings.thinkingLevel }), index === 0 && _jsx(Text, { color: theme.textMuted, children: " (Enter to cycle)" })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: theme.textMuted, children: "API keys \u2014 Enter to set / update" }) }), PROVIDERS.map((p, i) => {
+                            const idx = i + 1;
                             const vars = PROVIDER_ENV_VARS[p];
-                            const set = vars.some((v) => process.env[v]);
-                            return (_jsxs(Text, { color: set ? theme.success : theme.textMuted, children: ["    ", set ? "✓" : "○", " ", p, ": ", vars.join(" · ")] }, p));
-                        })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: theme.textMuted, children: "OPENAI_API_KEY \u00B7 GROQ_API_KEY \u00B7 GEMINI_API_KEY \u00B7 OPENROUTER_API_KEY" }) })] }) }));
+                            const fromEnv = vars.some((v) => !!process.env[v]);
+                            const fromSettings = !!settings.apiKeys?.[p];
+                            const ok = hasProviderAuth(p, settings);
+                            return (_jsxs(Text, { color: index === idx ? theme.primary : theme.text, children: [index === idx ? "› " : "  ", ok ? "✓" : "○", " ", p, fromEnv && _jsx(Text, { color: theme.textMuted, children: " env" }), fromSettings && _jsx(Text, { color: theme.textMuted, children: " saved" })] }, p));
+                        })] })] }) }));
 }

package/dist/ui/layout.d.ts

@@ -0,0 +1,6 @@
+export interface TerminalSize {
+    rows: number;
+    cols: number;
+}
+export declare function useTerminalSize(): TerminalSize;
+export declare function chatContentWidth(cols: number): number;

package/dist/ui/layout.js

@@ -0,0 +1,22 @@
+import { useStdout } from "ink";
+import { useEffect, useState } from "react";
+export function useTerminalSize() {
+    const { stdout } = useStdout();
+    const [size, setSize] = useState({
+        rows: stdout.rows,
+        cols: stdout.columns,
+    });
+    useEffect(() => {
+        const onResize = () => {
+            setSize({ rows: stdout.rows, cols: stdout.columns });
+        };
+        stdout.on("resize", onResize);
+        return () => {
+            stdout.off("resize", onResize);
+        };
+    }, [stdout]);
+    return size;
+}
+export function chatContentWidth(cols) {
+    return Math.max(20, cols - 12);
+}

package/dist/ui/scroll.d.ts

@@ -0,0 +1,3 @@
+import type { WriteStream } from "node:tty";
+/** Nudge the terminal viewport toward the latest output (best-effort across terminals). */
+export declare function scrollViewportToBottom(stdout: WriteStream): void;

package/dist/ui/scroll.js

@@ -0,0 +1,4 @@
+/** Nudge the terminal viewport toward the latest output (best-effort across terminals). */
+export function scrollViewportToBottom(stdout) {
+    stdout.write("\x1b[999T");
+}