@humain/terminal 0.0.17 → 0.1.0

package/dist/modes/interactive/interactive-mode.js

@@ -7,7 +7,7 @@ import * as fs from "node:fs";
 import * as os from "node:os";
 import * as path from "node:path";
 import * as TuiLayouts from "@earendil-works/pi-tui";
-import { CombinedAutocompleteProvider, Container, fuzzyFilter, getCapabilities, hyperlink, Markdown, matchesKey, ProcessTerminal, Spacer, setCapabilityOverrides, setKeybindings, Text, TruncatedText, TuiAltScreen, TuiMainScreen, visibleWidth, } from "@earendil-works/pi-tui";
+import { CombinedAutocompleteProvider, Container, fuzzyFilter, getCapabilities, hyperlink, Markdown, matchesKey, Spacer, setCapabilityOverrides, setKeybindings, Text, TruncatedText, TuiAltScreen, TuiMainScreen, visibleWidth, } from "@earendil-works/pi-tui";
 import chalk from "chalk";
 import { spawn } from "child_process";
 import { APP_NAME, APP_TITLE, CONFIG_DIR_NAME, getAgentDir, getAuthPath, getDebugLogPath, getDocsPath, VERSION, } from "../../config.js";
@@ -26,19 +26,20 @@ import { formatMissingSessionCwdPrompt, MissingSessionCwdError } from "../../cor
 import { SessionManager, sessionEntryToContextMessages } from "../../core/session-manager.js";
 import { BUILTIN_SLASH_COMMANDS } from "../../core/slash-commands.js";
 import { isInstallTelemetryEnabled } from "../../core/telemetry.js";
+import { withBuiltInRenderers } from "../../core/tools/renderers/index.js";
 import { hasTrustRequiringProjectResources, ProjectTrustStore } from "../../core/trust-manager.js";
 import { getUsageCostBreakdown } from "../../core/usage-totals.js";
 import { getChangelogPath, getNewEntries, normalizeChangelogLinks, parseChangelog } from "../../utils/changelog.js";
 import { copyToClipboard, readClipboardText } from "../../utils/clipboard.js";
 import { extensionForImageMimeType, readClipboardImage } from "../../utils/clipboard-image.js";
 import { parseGitUrl } from "../../utils/git.js";
-import { openBrowser } from "../../utils/open-browser.js";
 import { getCwdRelativePath } from "../../utils/paths.js";
 import { getPiUserAgent } from "../../utils/pi-user-agent.js";
 import { killTrackedDetachedChildren } from "../../utils/shell.js";
 import { loadAllHighlightLanguages } from "../../utils/syntax-highlight.js";
 import { ensureTool } from "../../utils/tools-manager.js";
 import { checkForNewPiVersion } from "../../utils/version-check.js";
+import { createChatViewport } from "./chat-viewport.js";
 import { ArminComponent } from "./components/armin.js";
 import { AssistantMessageComponent } from "./components/assistant-message.js";
 import { BashExecutionComponent } from "./components/bash-execution.js";
@@ -76,6 +77,14 @@ import { getModelSearchText } from "./model-search.js";
 import { shareSession } from "./session-share.js";
 import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, onThemeChange, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
 import { InteractiveThemeController } from "./theme/theme-controller.js";
+import { createInteractiveTui, createInteractiveTuiReference } from "./tui-renderer.js";
+export { createInteractiveTui, createInteractiveTuiReference } from "./tui-renderer.js";
+function isWorkingStatusEditor(editor) {
+    return ("embedWorkingStatus" in editor &&
+        editor.embedWorkingStatus === true &&
+        "setWorkingStatusIndicator" in editor &&
+        typeof editor.setWorkingStatusIndicator === "function");
+}
 function isExpandable(obj) {
     return typeof obj === "object" && obj !== null && "setExpanded" in obj && typeof obj.setExpanded === "function";
 }
@@ -175,61 +184,6 @@ function formatLoginProviderCompletionDescription(provider) {
     const authTypes = provider.authTypes.map(formatAuthSelectorProviderType).join("/");
     return provider.name === provider.id ? authTypes : `${provider.name} · ${authTypes}`;
 }
-/** Composition root for selecting the interactive terminal renderer. */
-export function createInteractiveTui(options) {
-    const terminal = options.terminal ?? new ProcessTerminal();
-    if (options.tuiMode === "fullscreen") {
-        const styleSearchMatch = (text) => theme.bg("searchMatchBg", theme.fg("searchMatchText", text));
-        return new TuiAltScreen(terminal, options.showHardwareCursor, options.logDirectory, {
-            searchMatchStyle: (text) => theme.underline(styleSearchMatch(text)),
-            searchCurrentMatchStyle: (text) => theme.bold(theme.inverse(styleSearchMatch(text))),
-            openUrl: openBrowser,
-            onRightClickPaste: options.onRightClickPaste,
-            copyOnSelect: options.fullscreenCopyOnSelect,
-            copySelection: async (text) => {
-                try {
-                    await copyToClipboard(text);
-                    return true;
-                }
-                catch {
-                    return false;
-                }
-            },
-        });
-    }
-    return new TuiMainScreen(terminal, options.showHardwareCursor, options.logDirectory);
-}
-/** Stable reference for components while InteractiveMode replaces the active renderer. */
-export function createInteractiveTuiReference(getTui) {
-    return new Proxy({}, {
-        get: (_target, property) => {
-            const tui = getTui();
-            const value = Reflect.get(tui, property, tui);
-            if (typeof value !== "function")
-                return value;
-            let methodTui = tui;
-            let method = value;
-            return (...args) => {
-                const currentTui = getTui();
-                if (currentTui !== methodTui) {
-                    const currentMethod = Reflect.get(currentTui, property, currentTui);
-                    if (typeof currentMethod !== "function") {
-                        throw new TypeError(`TUI property ${String(property)} is not callable`);
-                    }
-                    methodTui = currentTui;
-                    method = currentMethod;
-                }
-                return Reflect.apply(method, methodTui, args);
-            };
-        },
-        set: (_target, property, value) => {
-            const tui = getTui();
-            return Reflect.set(tui, property, value, tui);
-        },
-        has: (_target, property) => Reflect.has(getTui(), property),
-        getPrototypeOf: () => Reflect.getPrototypeOf(getTui()),
-    });
-}
 export class InteractiveMode {
     // Convenience accessors
     get session() {
@@ -249,11 +203,12 @@ export class InteractiveMode {
         this.isInitialized = false;
         this.pendingUserInputs = [];
         this.activeStatusIndicator = undefined;
+        this.activeWorkingIndicatorEmbedded = false;
         this.idleStatus = new IdleStatus();
         this.workingMessage = undefined;
         this.workingVisible = true;
         this.workingIndicatorOptions = undefined;
-        this.defaultWorkingMessage = "Working...";
+        this.defaultWorkingMessage = "Working";
         this.defaultHiddenThinkingLabel = "Thinking...";
         this.hiddenThinkingLabel = this.defaultHiddenThinkingLabel;
         this.lastSigintTime = 0;
@@ -355,6 +310,7 @@ export class InteractiveMode {
         this.defaultEditor = new CustomEditor(this.ui, getEditorTheme(), this.keybindings, {
             paddingX: editorPaddingX,
             autocompleteMaxVisible,
+            embedWorkingStatus: true,
         });
         this.editor = this.defaultEditor;
         this.editorContainer = new Container();
@@ -626,25 +582,20 @@ export class InteractiveMode {
         }
         // Keep one component tree and remount it when changing renderers.
         this.renderWidgets(); // Initialize with default spacer
-        this.transcriptScrollView = new TuiLayouts.ScrollView(this.documentContainer, {
-            follow: "end",
-            primary: true,
-            overscroll: "chain",
+        const viewport = createChatViewport({
+            document: this.documentContainer,
+            pendingMessages: this.pendingMessagesContainer,
+            status: this.statusContainer,
+            widgetsAbove: this.widgetContainerAbove,
+            editor: this.editorContainer,
+            widgetsBelow: this.widgetContainerBelow,
+            footer: this.footerContainer,
             scrollbar: this.settingsManager.getFullscreenScrollbar(),
-            scrollbarStyle: (text) => theme.bg("scrollbarThumb", text),
+            scrollbarTrackStyle: (text) => theme.fg("scrollbarTrack", text),
+            scrollbarThumbStyle: (text) => theme.fg("scrollbarThumb", text),
         });
-        const dock = new TuiLayouts.VStack([
-            { component: this.pendingMessagesContainer, shrink: 1, minSize: 0 },
-            { component: this.statusContainer, shrink: 1, minSize: 0 },
-            { component: this.widgetContainerAbove, shrink: 1, minSize: 0 },
-            { component: this.editorContainer, shrink: 1, minSize: 3 },
-            { component: this.widgetContainerBelow, shrink: 1, minSize: 0 },
-            { component: this.footerContainer, shrink: 1, minSize: 1 },
-        ]);
-        this.fullscreenLayoutRoot = new TuiLayouts.VStack([
-            { component: this.transcriptScrollView, basis: 0, grow: 1, shrink: 1, minSize: 1 },
-            { component: dock, basis: "auto", grow: 0, shrink: 1, minSize: 1 },
-        ]);
+        this.transcriptScrollView = viewport.transcript;
+        this.fullscreenLayoutRoot = viewport.root;
         this.mountInteractiveTui(this.renderer, [
             this.documentContainer,
             this.pendingMessagesContainer,
@@ -697,7 +648,7 @@ export class InteractiveMode {
                 hint("app.tools.expand", "more"),
             ].join(theme.fg("muted", " · "));
             const compactOnboarding = theme.fg("dim", `Press ${keyText("app.tools.expand")} to show full startup help and loaded resources.`);
-            const onboarding = theme.fg("dim", `Pi can explain its own features and look up its docs. Ask it how to use or extend Pi.`);
+            const onboarding = theme.fg("dim", `${APP_NAME} can explain its own features and look up its docs. Ask it how to use or extend ${APP_NAME}.`);
             this.builtInHeader = new ExpandableText(() => `${logo}\n${compactInstructions}\n${compactOnboarding}\n\n${onboarding}`, () => `${logo}\n${expandedInstructions}\n\n${onboarding}`, this.getStartupExpansionState(), 1, 0);
             // Setup UI layout
             this.headerContainer.addChild(new Spacer(1));
@@ -1556,8 +1507,12 @@ export class InteractiveMode {
     /**
      * Get a registered tool definition by name (for custom rendering).
      */
+    /**
+     * Extension-registered definition, falling back to the built-in one. The renderer components take
+     * whatever this returns, so they never reach into the tool registry themselves.
+     */
     getRegisteredToolDefinition(toolName) {
-        return this.session.getToolDefinition(toolName);
+        return withBuiltInRenderers(toolName, this.session.getToolDefinition(toolName));
     }
     getMarkdownTransformers() {
         return [this.mermaidMarkdownTransformer, ...this.session.extensionRunner.getMarkdownTransformers()];
@@ -1627,26 +1582,48 @@ export class InteractiveMode {
         this.footerDataProvider.setExtensionStatus(key, text);
         this.ui.requestRender();
     }
+    setEditorWorkingStatusIndicator(indicator) {
+        this.defaultEditor.setWorkingStatusIndicator(undefined);
+        if (!isWorkingStatusEditor(this.editor))
+            return false;
+        this.editor.setWorkingStatusIndicator(indicator);
+        return true;
+    }
     showStatusIndicator(indicator) {
         this.activeStatusIndicator?.dispose();
         this.activeStatusIndicator = indicator;
+        this.activeWorkingIndicatorEmbedded = false;
         this.statusContainer.clear();
+        this.setEditorWorkingStatusIndicator(undefined);
+        if (indicator instanceof WorkingStatusIndicator && this.setEditorWorkingStatusIndicator(indicator)) {
+            this.activeWorkingIndicatorEmbedded = true;
+            return;
+        }
         this.statusContainer.addChild(indicator);
     }
     clearStatusIndicator(kind) {
         if (kind && this.activeStatusIndicator?.kind !== kind) {
             return;
         }
-        const hadActiveStatusIndicator = this.activeStatusIndicator !== undefined;
-        this.activeStatusIndicator?.dispose();
+        const clearedIndicator = this.activeStatusIndicator;
+        const clearedIndicatorWasEmbedded = clearedIndicator?.kind === "working" && this.activeWorkingIndicatorEmbedded;
+        clearedIndicator?.dispose();
         this.activeStatusIndicator = undefined;
+        this.activeWorkingIndicatorEmbedded = false;
         this.statusContainer.clear();
-        if (hadActiveStatusIndicator && this.options.tuiMode === "regular" && this.ui.getClearOnShrink()) {
+        this.setEditorWorkingStatusIndicator(undefined);
+        if (clearedIndicator &&
+            !clearedIndicatorWasEmbedded &&
+            this.options.tuiMode === "regular" &&
+            this.ui.getClearOnShrink()) {
             this.statusContainer.addChild(this.idleStatus);
         }
     }
     showWorkingStatusIndicator() {
-        this.showStatusIndicator(new WorkingStatusIndicator(this.ui, this.workingMessage ?? this.defaultWorkingMessage, this.workingIndicatorOptions));
+        const colorFn = isWorkingStatusEditor(this.editor)
+            ? (text) => (this.editor.borderColor ?? theme.getThinkingBorderColor(this.session.thinkingLevel || "off"))(text)
+            : undefined;
+        this.showStatusIndicator(new WorkingStatusIndicator(this.ui, this.workingMessage ?? this.defaultWorkingMessage, this.workingIndicatorOptions, colorFn));
     }
     setWorkingVisible(visible) {
         this.workingVisible = visible;
@@ -2118,6 +2095,13 @@ export class InteractiveMode {
             this.editor = this.defaultEditor;
         }
         this.editorContainer.addChild(this.editor);
+        if (this.activeStatusIndicator instanceof WorkingStatusIndicator) {
+            this.statusContainer.clear();
+            this.activeWorkingIndicatorEmbedded = this.setEditorWorkingStatusIndicator(this.activeStatusIndicator);
+            if (!this.activeWorkingIndicatorEmbedded) {
+                this.statusContainer.addChild(this.activeStatusIndicator);
+            }
+        }
         this.ui.setFocus(this.editor);
         this.ui.requestRender();
     }
@@ -2659,6 +2643,7 @@ export class InteractiveMode {
                         for (const [, component] of this.pendingTools.entries()) {
                             component.setArgsComplete();
                         }
+                        this.maybeShowAssistantDiagnostics(this.streamingMessage);
                         this.maybeShowCacheMissNotice(this.streamingMessage);
                     }
                     this.streamingComponent = undefined;
@@ -3022,6 +3007,7 @@ export class InteractiveMode {
                     }
                 }
                 if (message.stopReason !== "aborted" && message.stopReason !== "error") {
+                    this.maybeShowAssistantDiagnostics(message);
                     const miss = cacheMisses.get(message);
                     if (miss)
                         this.addCacheMissNotice(miss);
@@ -3078,6 +3064,32 @@ export class InteractiveMode {
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new Text(theme.fg("warning", `${label}: ${formatTokens(tokens)} tokens billed${cost}`), 1, 0));
     }
+    maybeShowAssistantDiagnostics(message) {
+        if (!this.settingsManager.getShowCacheMissNotices())
+            return;
+        for (const diagnostic of message.diagnostics ?? []) {
+            if (diagnostic.type !== "anthropic_input_transformations")
+                continue;
+            const transformations = diagnostic.details?.transformations;
+            if (!Array.isArray(transformations))
+                continue;
+            const dropped = transformations.flatMap((transformation) => {
+                if (typeof transformation !== "object" || transformation === null)
+                    return [];
+                const details = transformation;
+                if (details.type !== "thinking_dropped")
+                    return [];
+                const reason = typeof details.reason === "string" ? details.reason : "unknown reason";
+                const location = typeof details.path === "string" ? ` at ${details.path}` : "";
+                return [`${reason}${location}`];
+            });
+            if (dropped.length === 0)
+                continue;
+            const noun = dropped.length === 1 ? "thinking block" : `${dropped.length} thinking blocks`;
+            this.chatContainer.addChild(new Spacer(1));
+            this.chatContainer.addChild(new Text(theme.fg("warning", `Anthropic dropped ${noun}: ${dropped.join("; ")}`), 1, 0));
+        }
+    }
     /**
      * Show a transcript notice when a completed assistant message paid for a
      * significant cache miss. Only states observable facts: the miss itself,
@@ -3369,6 +3381,9 @@ export class InteractiveMode {
             const level = this.session.thinkingLevel || "off";
             this.editor.borderColor = theme.getThinkingBorderColor(level);
         }
+        if (this.activeStatusIndicator?.kind === "working") {
+            this.activeStatusIndicator.invalidate();
+        }
         this.ui.requestRender();
     }
     cycleThinkingLevel() {