@butlerw/vellum 0.1.16 → 0.1.17

package/dist/index.mjs

@@ -17,7 +17,7 @@ import OpenAI from 'openai';
 import { ThinkingLevel, GoogleGenAI } from '@google/genai';
 import { Writable, Readable } from 'stream';
 import * as fs30 from 'fs';
-import fs30__default, { existsSync, stat as stat$1, unwatchFile, watchFile, promises, readFileSync, writeFileSync, watch as watch$1, mkdirSync, readdirSync, statSync, copyFileSync, rmSync, createWriteStream } from 'fs';
+import fs30__default, { existsSync, stat as stat$1, unwatchFile, watchFile, promises, mkdirSync, readFileSync, writeFileSync, watch as watch$1, readdirSync, statSync, copyFileSync, rmSync, createWriteStream } from 'fs';
 import * as os16 from 'os';
 import os16__default, { type as type$1, homedir, platform, tmpdir, arch, hostname, release } from 'os';
 import * as util from 'util';
@@ -35,7 +35,7 @@ import { WebSocketClientTransport } from '@modelcontextprotocol/sdk/client/webso
 import { SSEClientTransport } from '@modelcontextprotocol/sdk/client/sse.js';
 import { StreamableHTTPClientTransport } from '@modelcontextprotocol/sdk/client/streamableHttp.js';
 import { Command } from 'commander';
-import { Text, Box, useInput, Static, render, measureElement, useApp, useStdout, useStdin } from 'ink';
+import { Text, Box, useInput, render, measureElement, useApp, useStdout, useStdin } from 'ink';
 import React6, { createContext, memo, useMemo, useState, useRef, useEffect, useCallback, forwardRef, startTransition, useContext, useImperativeHandle, useId, useReducer, useLayoutEffect, Component } from 'react';
 import { confirm, select, input } from '@inquirer/prompts';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -19513,9 +19513,9 @@ var init_handler = __esm({
         if (this.fsw.closed) {
           return;
         }
-        const dirname51 = sp2.dirname(file);
+        const dirname53 = sp2.dirname(file);
         const basename26 = sp2.basename(file);
-        const parent = this.fsw._getWatchedDir(dirname51);
+        const parent = this.fsw._getWatchedDir(dirname53);
         let prevStats = stats;
         if (parent.has(basename26))
           return;
@@ -19542,7 +19542,7 @@ var init_handler = __esm({
                 prevStats = newStats2;
               }
             } catch (error2) {
-              this.fsw._remove(dirname51, basename26);
+              this.fsw._remove(dirname53, basename26);
             }
           } else if (parent.has(basename26)) {
             const at = newStats.atimeMs;
@@ -167829,9 +167829,9 @@ var NodeFsHandler2 = class {
     if (this.fsw.closed) {
       return;
     }
-    const dirname51 = sp2.dirname(file);
+    const dirname53 = sp2.dirname(file);
     const basename26 = sp2.basename(file);
-    const parent = this.fsw._getWatchedDir(dirname51);
+    const parent = this.fsw._getWatchedDir(dirname53);
     let prevStats = stats;
     if (parent.has(basename26))
       return;
@@ -167858,7 +167858,7 @@ var NodeFsHandler2 = class {
             prevStats = newStats2;
           }
         } catch (error2) {
-          this.fsw._remove(dirname51, basename26);
+          this.fsw._remove(dirname53, basename26);
         }
       } else if (parent.has(basename26)) {
         const at = newStats.atimeMs;
@@ -172704,8 +172704,10 @@ var EN_TRANSLATIONS = {
     thinking: "Thinking...",
     generating: "Generating...",
     user: "You",
-    assistant: "Assistant",
+    assistant: "Vellum",
     system: "System",
+    tool: "Tool",
+    unknown: "Unknown",
     error: "Error",
     empty: "No messages yet",
     copied: "Copied to clipboard",
@@ -172899,8 +172901,10 @@ var ZH_TRANSLATIONS = {
     thinking: "\u601D\u8003\u4E2D...",
     generating: "\u751F\u6210\u4E2D...",
     user: "\u4F60",
-    assistant: "\u52A9\u624B",
+    assistant: "Vellum",
     system: "\u7CFB\u7EDF",
+    tool: "\u5DE5\u5177",
+    unknown: "\u672A\u77E5",
     error: "\u9519\u8BEF",
     empty: "\u6682\u65E0\u6D88\u606F",
     copied: "\u5DF2\u590D\u5236\u5230\u526A\u8D34\u677F",
@@ -189538,7 +189542,7 @@ init_esm_shims();
 
 // src/version.ts
 init_esm_shims();
-var version = "0.1.16" ;
+var version = "0.1.17" ;
 
 // src/tui/components/Banner/ShimmerText.tsx
 init_esm_shims();
@@ -191786,9 +191790,72 @@ init_esm_shims();
 
 // src/tui/hooks/useInputHistory.ts
 init_esm_shims();
+var VELLUM_DIR2 = join(homedir(), ".vellum");
+var HISTORY_FILE = join(VELLUM_DIR2, "input-history.json");
+function isLocalStorageAvailable() {
+  try {
+    if (typeof globalThis.localStorage === "undefined") {
+      return false;
+    }
+    const testKey = "__vellum_storage_test__";
+    globalThis.localStorage.setItem(testKey, "test");
+    globalThis.localStorage.removeItem(testKey);
+    return true;
+  } catch {
+    return false;
+  }
+}
+var cachedBackend = null;
+function getStorageBackend() {
+  if (cachedBackend !== null) {
+    return cachedBackend;
+  }
+  if (isLocalStorageAvailable()) {
+    cachedBackend = "localStorage";
+    return cachedBackend;
+  }
+  try {
+    if (!existsSync(VELLUM_DIR2)) {
+      mkdirSync(VELLUM_DIR2, { recursive: true });
+    }
+    cachedBackend = "file";
+    return cachedBackend;
+  } catch {
+    cachedBackend = "none";
+    return cachedBackend;
+  }
+}
+function readHistoryFile() {
+  try {
+    if (!existsSync(HISTORY_FILE)) {
+      return {};
+    }
+    const content = readFileSync(HISTORY_FILE, "utf-8");
+    const parsed = JSON.parse(content);
+    if (typeof parsed === "object" && parsed !== null) {
+      return parsed;
+    }
+    return {};
+  } catch {
+    return {};
+  }
+}
+function writeHistoryFile(data) {
+  try {
+    const dir = dirname(HISTORY_FILE);
+    if (!existsSync(dir)) {
+      mkdirSync(dir, { recursive: true });
+    }
+    writeFileSync(HISTORY_FILE, JSON.stringify(data, null, 2), "utf-8");
+    return true;
+  } catch {
+    return false;
+  }
+}
 function loadFromStorage(key) {
+  const backend = getStorageBackend();
   try {
-    if (typeof globalThis.localStorage !== "undefined") {
+    if (backend === "localStorage") {
       const stored = globalThis.localStorage.getItem(key);
       if (stored) {
         const parsed = JSON.parse(stored);
@@ -191796,15 +191863,26 @@ function loadFromStorage(key) {
           return parsed.filter((item) => typeof item === "string");
         }
       }
+    } else if (backend === "file") {
+      const historyData = readHistoryFile();
+      const entries = historyData[key];
+      if (Array.isArray(entries)) {
+        return entries.filter((item) => typeof item === "string");
+      }
     }
   } catch {
   }
   return [];
 }
 function saveToStorage(key, history2) {
+  const backend = getStorageBackend();
   try {
-    if (typeof globalThis.localStorage !== "undefined") {
+    if (backend === "localStorage") {
       globalThis.localStorage.setItem(key, JSON.stringify(history2));
+    } else if (backend === "file") {
+      const historyData = readHistoryFile();
+      historyData[key] = history2;
+      writeHistoryFile(historyData);
     }
   } catch {
   }
@@ -199975,33 +200053,52 @@ var DEFAULT_STATIC_MULTIPLIER = 1.2;
 var DEFAULT_VIRTUAL_MULTIPLIER = 5;
 var DEFAULT_MIN_WINDOW_SIZE = 10;
 var DEFAULT_MAX_WINDOW_SIZE_RATIO = 0.8;
+var DEFAULT_MESSAGE_COUNT_THRESHOLD = 50;
+var DEFAULT_MESSAGE_COUNT_HYSTERESIS = 10;
 function useModeController(input3) {
-  const { availableHeight, totalContentHeight, config = {} } = input3;
+  const { availableHeight, totalContentHeight, config = {}, messageCount = 0 } = input3;
   const {
     staticMultiplier = DEFAULT_STATIC_MULTIPLIER,
     virtualMultiplier = DEFAULT_VIRTUAL_MULTIPLIER,
     forceMode,
     minWindowSize = DEFAULT_MIN_WINDOW_SIZE,
-    maxWindowSizeRatio = DEFAULT_MAX_WINDOW_SIZE_RATIO
+    maxWindowSizeRatio = DEFAULT_MAX_WINDOW_SIZE_RATIO,
+    messageCountThreshold = DEFAULT_MESSAGE_COUNT_THRESHOLD,
+    messageCountHysteresis = DEFAULT_MESSAGE_COUNT_HYSTERESIS
   } = config;
+  const wasVirtualizedByCountRef = useRef(false);
   return useMemo(() => {
     const staticThreshold = Math.max(1, availableHeight * staticMultiplier);
     const virtualThreshold = Math.max(1, availableHeight * virtualMultiplier);
     const windowSize = Math.max(minWindowSize, Math.floor(availableHeight * maxWindowSizeRatio));
     const isAutoMode = !forceMode;
     if (forceMode) {
+      wasVirtualizedByCountRef.current = false;
       return {
         mode: forceMode,
         windowSize,
         modeReason: "forced",
         staticThreshold,
         virtualThreshold,
-        isAutoMode
+        isAutoMode,
+        messageCountThreshold,
+        virtualizedByMessageCount: false
       };
     }
+    let virtualizedByMessageCount = false;
+    const exitThreshold = messageCountThreshold - messageCountHysteresis;
+    if (wasVirtualizedByCountRef.current) {
+      virtualizedByMessageCount = messageCount >= exitThreshold;
+    } else {
+      virtualizedByMessageCount = messageCount >= messageCountThreshold;
+    }
+    wasVirtualizedByCountRef.current = virtualizedByMessageCount;
     let mode;
     let modeReason;
-    if (totalContentHeight <= staticThreshold) {
+    if (virtualizedByMessageCount) {
+      mode = "virtualized";
+      modeReason = "content-very-large";
+    } else if (totalContentHeight <= staticThreshold) {
       mode = "static";
       modeReason = "content-fits";
     } else if (totalContentHeight <= virtualThreshold) {
@@ -200017,7 +200114,9 @@ function useModeController(input3) {
       modeReason,
       staticThreshold,
       virtualThreshold,
-      isAutoMode
+      isAutoMode,
+      messageCountThreshold,
+      virtualizedByMessageCount
     };
   }, [
     availableHeight,
@@ -200026,7 +200125,10 @@ function useModeController(input3) {
     virtualMultiplier,
     forceMode,
     minWindowSize,
-    maxWindowSizeRatio
+    maxWindowSizeRatio,
+    messageCount,
+    messageCountThreshold,
+    messageCountHysteresis
   ]);
 }
 
@@ -200753,18 +200855,18 @@ function getRoleIcon(role) {
       return icons2.info;
   }
 }
-function getRoleLabel(role) {
+function getRoleLabel(role, t) {
   switch (role) {
     case "user":
-      return "You";
+      return t("messages.user");
     case "assistant":
-      return "Vellum";
+      return t("messages.assistant");
     case "system":
-      return "System";
+      return t("messages.system");
     case "tool":
-      return "Tool";
+      return t("messages.tool");
     default:
-      return "Unknown";
+      return t("messages.unknown");
   }
 }
 function estimateMessageHeightLegacy(message2, width, includeToolCalls) {
@@ -200898,8 +201000,9 @@ var MessageItem = memo(function MessageItem2({
   thinkingToggleHint,
   onThinkingHeightChange
 }) {
+  const { t } = useTUITranslation();
   const icon = getRoleIcon(message2.role);
-  const label = getRoleLabel(message2.role);
+  const label = getRoleLabel(message2.role, t);
   const timestamp2 = formatTimestamp2(message2.timestamp);
   const hasThinking = message2.thinking && message2.thinking.length > 0;
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [
@@ -201006,10 +201109,18 @@ var MessageList = memo(function MessageList2({
       0
     );
   }, [messages, estimatedContentWidth]);
-  const { mode, windowSize, modeReason, staticThreshold, virtualThreshold } = useModeController({
+  const {
+    mode,
+    windowSize,
+    modeReason,
+    staticThreshold,
+    virtualThreshold,
+    virtualizedByMessageCount
+  } = useModeController({
     availableHeight,
     totalContentHeight,
-    config: modeConfig
+    config: modeConfig,
+    messageCount: messages.length
   });
   const toolGroupCallIds = useMemo(() => {
     const ids = /* @__PURE__ */ new Set();
@@ -201042,6 +201153,7 @@ var MessageList = memo(function MessageList2({
   );
   const isStaticOutputMode = process.env.VELLUM_STATIC_OUTPUT === "1";
   const shouldConstrainHeight = !isStaticOutputMode && (useAltBuffer || (process.stdout.isTTY ?? false));
+  const allowStaticRendering = false;
   const virtualizedListRef = useRef(null);
   const expectedScrollTopRef = useRef(null);
   const isApplyingControllerScrollRef = useRef(false);
@@ -201085,13 +201197,13 @@ var MessageList = memo(function MessageList2({
     const base = computedMaxHeight ?? availableHeight ?? 20;
     return Math.max(MIN_SCROLL_VIEWPORT, Math.max(0, base - thinkingIndicatorHeight));
   }, [computedMaxHeight, availableHeight, thinkingIndicatorHeight]);
-  const hasActiveStreamingThinking = useMemo(() => {
+  useMemo(() => {
     if (pendingMessage?.thinking && pendingMessage.isStreaming && !pendingMessage.isThinkingComplete) {
       return true;
     }
     return false;
   }, [pendingMessage?.thinking, pendingMessage?.isStreaming, pendingMessage?.isThinkingComplete]);
-  const useStaticRendering = historyMessages !== void 0 && !computedMaxHeight && !hasActiveStreamingThinking && (mode === "static" || !adaptive);
+  const useStaticRendering = allowStaticRendering;
   const prevMessageLengthRef = useRef(messages.length);
   const [scrollState, scrollActions] = useScrollController({
     viewportHeight: scrollViewportHeight,
@@ -201143,6 +201255,7 @@ var MessageList = memo(function MessageList2({
         useStaticRendering,
         useVirtualizedListInternal,
         messageCount: messages.length,
+        virtualizedByMessageCount,
         adaptive
       });
     }
@@ -201158,6 +201271,7 @@ var MessageList = memo(function MessageList2({
     useStaticRendering,
     useVirtualizedListInternal,
     messages.length,
+    virtualizedByMessageCount,
     adaptive
   ]);
   const [scrollOffset, setScrollOffset] = useState(0);
@@ -201535,7 +201649,7 @@ var MessageList = memo(function MessageList2({
     ]
   );
   const keyExtractor = useCallback((item) => item.id, []);
-  const pendingThinkingToggle = pendingMessage ? getThinkingToggleInfo(pendingMessage) : null;
+  pendingMessage ? getThinkingToggleInfo(pendingMessage) : null;
   const handleStickingChange = useCallback(
     (isSticking) => {
       setUserScrolledUp(!isSticking);
@@ -201758,89 +201872,6 @@ var MessageList = memo(function MessageList2({
       !enableScroll && userScrolledUp && autoScroll && /* @__PURE__ */ jsx(Box, { justifyContent: "center", children: /* @__PURE__ */ jsx(Text, { color: mutedColor, italic: true, children: "Auto-scroll paused (scroll to bottom to resume)" }) })
     ] });
   }
-  if (useStaticRendering && historyMessages) {
-    return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [
-      !enableScroll && showScrollUp && /* @__PURE__ */ jsx(Box, { justifyContent: "center", borderBottom: true, borderColor, children: /* @__PURE__ */ jsxs(Text, { color: mutedColor, children: [
-        "\u2191 ",
-        scrollOffset,
-        " more above \u2191"
-      ] }) }),
-      /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
-        /* @__PURE__ */ jsxs(Box, { flexDirection: "column", flexGrow: 1, children: [
-          /* @__PURE__ */ jsx(Static, { items: historyMessages, children: (message2) => {
-            const thinkingToggle = getThinkingToggleInfo(message2);
-            return /* @__PURE__ */ jsx(Box, { paddingX: 1, children: /* @__PURE__ */ jsx(
-              MessageItem,
-              {
-                message: message2,
-                roleColor: roleColors[message2.role],
-                mutedColor,
-                accentColor,
-                thinkingColor,
-                successColor,
-                errorColor,
-                showToolCalls: shouldRenderInlineToolCalls(message2),
-                thinkingDisplayMode,
-                thinkingToggleSignal: thinkingToggle.signal,
-                thinkingToggleHint: thinkingToggle.hint
-              }
-            ) }, message2.id);
-          } }),
-          pendingMessage && /* @__PURE__ */ jsx(Box, { paddingX: 1, children: /* @__PURE__ */ jsx(
-            MessageItem,
-            {
-              message: pendingMessage,
-              roleColor: roleColors[pendingMessage.role],
-              mutedColor,
-              accentColor,
-              thinkingColor,
-              successColor,
-              errorColor,
-              showToolCalls: shouldRenderInlineToolCalls(pendingMessage),
-              thinkingDisplayMode,
-              thinkingToggleSignal: pendingThinkingToggle?.signal,
-              thinkingToggleHint: pendingThinkingToggle?.hint
-            }
-          ) })
-        ] }),
-        enableScroll && /* @__PURE__ */ jsx(
-          ScrollIndicator,
-          {
-            totalHeight: scrollState.totalHeight,
-            offsetFromBottom: scrollState.offsetFromBottom,
-            viewportHeight: scrollState.viewportHeight,
-            thumbColor: animatedThumbColor,
-            trackColor: animatedTrackColor
-          }
-        )
-      ] }),
-      showThinkingIndicator && /* @__PURE__ */ jsx(ThinkingIndicator, {}),
-      messageSeparation.streamingMessages.length > 0 && /* @__PURE__ */ jsx(Box, { flexDirection: "column", paddingX: 1, children: messageSeparation.streamingMessages.map((msg) => /* @__PURE__ */ jsx(
-        StreamingMessageItem,
-        {
-          id: msg.id,
-          content: msg.content,
-          meta: msg.meta,
-          onComplete: messageSeparation.markComplete
-        },
-        msg.id
-      )) }),
-      bannerState.isVisible && /* @__PURE__ */ jsx(
-        NewMessagesBanner,
-        {
-          unreadCount: scrollState.newMessageCount,
-          isAtBottom: isAtBottomForBanner,
-          onJumpToBottom: scrollActions.scrollToBottom
-        }
-      ),
-      !enableScroll && showScrollDown && /* @__PURE__ */ jsx(Box, { justifyContent: "center", borderTop: true, borderColor, children: /* @__PURE__ */ jsxs(Text, { color: mutedColor, children: [
-        "\u2193 ",
-        messages.length - scrollOffset - (computedMaxHeight ?? 0),
-        " more below \u2193"
-      ] }) }),
-      !enableScroll && userScrolledUp && autoScroll && /* @__PURE__ */ jsx(Box, { justifyContent: "center", children: /* @__PURE__ */ jsx(Text, { color: mutedColor, italic: true, children: "Auto-scroll paused (scroll to bottom to resume)" }) })
-    ] });
-  }
   return /* @__PURE__ */ jsxs(Box, { flexDirection: "column", flexGrow: 1, justifyContent: "flex-end", children: [
     !enableScroll && showScrollUp && /* @__PURE__ */ jsx(Box, { justifyContent: "center", borderBottom: true, borderColor, children: /* @__PURE__ */ jsxs(Text, { color: mutedColor, children: [
       "\u2191 ",
@@ -208218,9 +208249,6 @@ function useProviderStatus(options = {}) {
   };
 }
 
-// src/tui/hooks/useScrollEventBatcher.ts
-init_esm_shims();
-
 // src/tui/hooks/useSmoothScroll.ts
 init_esm_shims();
 
@@ -214321,6 +214349,48 @@ function renderSidebarContent({
     /* @__PURE__ */ jsx(SystemStatusPanel, { compact: false, persistence })
   ] });
 }
+function useOverlayPositioning() {
+  const { width, isNarrow } = useTerminalDimensions();
+  if (isNarrow) {
+    return {
+      margins: {
+        standard: { top: 2, left: 1 },
+        compact: { top: 1, left: 1 },
+        loading: { top: 2, left: 1 }
+      },
+      loadingMinWidth: Math.min(36, width - 4),
+      // Leave 4 cols for border+padding
+      isNarrow: true,
+      width
+    };
+  }
+  if (width <= 120) {
+    const t = (width - 80) / 40;
+    const standardLeft = Math.round(2 + t * 8);
+    const compactLeft = Math.round(1 + t * 4);
+    const loadingLeft = Math.round(2 + t * 6);
+    return {
+      margins: {
+        standard: { top: Math.round(3 + t * 2), left: standardLeft },
+        compact: { top: Math.round(2 + t * 1), left: compactLeft },
+        loading: { top: Math.round(2 + t * 2), left: loadingLeft }
+      },
+      loadingMinWidth: Math.min(40, width - standardLeft * 2 - 4),
+      isNarrow: false,
+      width
+    };
+  }
+  return {
+    margins: {
+      standard: { top: 5, left: 10 },
+      compact: { top: 3, left: 5 },
+      loading: { top: 4, left: 8 }
+    },
+    loadingMinWidth: 40,
+    isNarrow: false,
+    width
+  };
+}
 function AppOverlays({
   activeApproval,
   activeRiskLevel,
@@ -214356,6 +214426,7 @@ function AppOverlays({
   themeContext,
   updateAvailable
 }) {
+  const { margins, loadingMinWidth, isNarrow } = useOverlayPositioning();
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     updateAvailable && /* @__PURE__ */ jsx(
       UpdateBanner,
@@ -214371,18 +214442,18 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 5,
-        marginLeft: 10,
+        marginTop: margins.standard.top,
+        marginLeft: margins.standard.left,
         borderStyle: "round",
         borderColor: themeContext.theme.colors.info,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           ModeSelector,
           {
             currentMode: currentMode2,
             onSelect: handleModeSelect,
             isActive: showModeSelector,
-            showDescriptions: true
+            showDescriptions: !isNarrow
           }
         )
       }
@@ -214391,11 +214462,11 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 3,
-        marginLeft: 5,
+        marginTop: margins.compact.top,
+        marginLeft: margins.compact.left,
         borderStyle: "round",
         borderColor: themeContext.theme.colors.primary,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           SessionPicker,
           {
@@ -214413,11 +214484,11 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 5,
-        marginLeft: 10,
+        marginTop: margins.standard.top,
+        marginLeft: margins.standard.left,
         borderStyle: "double",
         borderColor: themeContext.theme.colors.warning,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           PermissionDialog,
           {
@@ -214435,11 +214506,11 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 5,
-        marginLeft: 10,
+        marginTop: margins.standard.top,
+        marginLeft: margins.standard.left,
         borderStyle: "round",
         borderColor: themeContext.theme.colors.success,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           ModelSelector,
           {
@@ -214447,7 +214518,7 @@ function AppOverlays({
             currentProvider,
             onSelect: handleModelSelect,
             isActive: showModelSelector,
-            showDetails: true
+            showDetails: !isNarrow
           }
         )
       }
@@ -214456,13 +214527,13 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 4,
-        marginLeft: 8,
+        marginTop: margins.loading.top,
+        marginLeft: margins.loading.left,
         borderStyle: "round",
         borderColor: themeContext.theme.colors.warning,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         flexDirection: "column",
-        minWidth: 40,
+        minWidth: loadingMinWidth,
         children: [
           /* @__PURE__ */ jsx(LoadingIndicator, { message: pendingOperation.message }),
           pendingOperation.cancel && /* @__PURE__ */ jsx(Text, { dimColor: true, children: "Press Esc to cancel" })
@@ -214473,11 +214544,11 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 5,
-        marginLeft: 10,
+        marginTop: margins.standard.top,
+        marginLeft: margins.standard.left,
         borderStyle: "round",
         borderColor: themeContext.theme.colors.info,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           HotkeyHelpModal,
           {
@@ -214492,11 +214563,11 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 3,
-        marginLeft: 5,
+        marginTop: margins.compact.top,
+        marginLeft: margins.compact.left,
         borderStyle: "double",
         borderColor: themeContext.theme.colors.warning,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           ApprovalQueue,
           {
@@ -214514,11 +214585,11 @@ function AppOverlays({
       Box,
       {
         position: "absolute",
-        marginTop: 3,
-        marginLeft: 5,
+        marginTop: margins.compact.top,
+        marginLeft: margins.compact.left,
         borderStyle: "double",
         borderColor: themeContext.theme.colors.info,
-        padding: 1,
+        padding: isNarrow ? 0 : 1,
         children: /* @__PURE__ */ jsx(
           CheckpointDiffView,
           {
@@ -214784,10 +214855,9 @@ function AppContentView({
       MessageList,
       {
         messages,
-        historyMessages: messages.filter((m) => !m.isStreaming),
         pendingMessage,
         isLoading,
-        useVirtualizedList: true,
+        adaptive: true,
         estimatedItemHeight: 4,
         scrollKeyMode: commandInputFocused ? "page" : "all",
         forceFollowOnInput: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@butlerw/vellum",
-  "version": "0.1.16",
+  "version": "0.1.17",
   "description": "Next-generation AI coding assistant CLI",
   "private": false,
   "publishConfig": {
@@ -57,9 +57,9 @@
     "tsx": "^4.21.0",
     "typescript": "^5.9.3",
     "@vellum/core": "0.1.14",
-    "@vellum/lsp": "0.1.0",
     "@vellum/mcp": "0.1.2",
     "@vellum/plugin": "0.1.2",
+    "@vellum/lsp": "0.1.0",
     "@vellum/provider": "0.1.0",
     "@vellum/sandbox": "0.1.0",
     "@vellum/shared": "0.1.0"