@supatest/cli 0.0.4 → 0.0.5

package/dist/ui/App.js

@@ -0,0 +1,322 @@
+/**
+ * Main App Component
+ * Root component for the interactive CLI UI
+ */
+import { execSync } from "node:child_process";
+import { homedir } from "node:os";
+import { Box, Text, useApp, useInput } from "ink";
+import React, { useEffect, useRef, useState } from "react";
+import { loginCommand } from "../commands/login.js";
+import { setupCommand } from "../commands/setup.js";
+import { isLoggedIn, removeToken, saveToken, } from "../utils/token-storage.js";
+import { AuthBanner } from "./components/AuthBanner.js";
+import { AuthDialog } from "./components/AuthDialog.js";
+import { HelpMenu } from "./components/HelpMenu.js";
+import { InputPrompt } from "./components/InputPrompt.js";
+import { MessageList } from "./components/MessageList.js";
+import { QueuedMessageDisplay } from "./components/QueuedMessageDisplay.js";
+import { SessionSelector } from "./components/SessionSelector.js";
+import { useSession } from "./contexts/SessionContext.js";
+import { useModeToggle } from "./hooks/useModeToggle.js";
+import { AuthState } from "./types/auth.js";
+const getGitBranch = () => {
+    try {
+        return execSync("git rev-parse --abbrev-ref HEAD", { encoding: "utf8" }).trim();
+    }
+    catch {
+        return "";
+    }
+};
+const getCurrentFolder = () => {
+    const cwd = process.cwd();
+    const home = homedir();
+    if (cwd.startsWith(home)) {
+        return `~${cwd.slice(home.length)}`;
+    }
+    return cwd;
+};
+/**
+ * Main app content (inside SessionProvider)
+ */
+const AppContent = ({ config, sessionId, webUrl, queuedTasks = [], onExit, onSubmitTask, apiClient, onResumeSession }) => {
+    const { exit } = useApp();
+    const { addMessage, clearMessages, isAgentRunning, messages, setSessionId, setWebUrl, setShouldInterruptAgent, toggleAllToolOutputs, allToolsExpanded } = useSession();
+    // Enable Shift+Tab mode toggle
+    useModeToggle();
+    const [terminalWidth, setTerminalWidth] = useState(process.stdout.columns || 80);
+    const [terminalHeight, setTerminalHeight] = useState(process.stdout.rows || 24);
+    const [showHelp, setShowHelp] = useState(false);
+    const [showInput, setShowInput] = useState(true); // Always show input
+    const [gitBranch] = useState(() => getGitBranch());
+    const [currentFolder] = useState(() => getCurrentFolder());
+    const [hasInputContent, setHasInputContent] = useState(false);
+    const [exitWarning, setExitWarning] = useState(null);
+    const inputPromptRef = useRef(null);
+    const [showSessionSelector, setShowSessionSelector] = useState(false);
+    // Auth state
+    const [authState, setAuthState] = useState(() => isLoggedIn() ? AuthState.Authenticated : AuthState.Unauthenticated);
+    const [showAuthDialog, setShowAuthDialog] = useState(false);
+    // Show auth dialog on first start if unauthenticated and no API key provided
+    useEffect(() => {
+        if (!isLoggedIn() && !config.supatestApiKey) {
+            setShowAuthDialog(true);
+        }
+    }, [config.supatestApiKey]);
+    // Initialize session data
+    useEffect(() => {
+        if (sessionId) {
+            setSessionId(sessionId);
+        }
+        if (webUrl) {
+            setWebUrl(webUrl);
+        }
+    }, [sessionId, webUrl, setSessionId, setWebUrl]);
+    // Handle login flow
+    const handleLogin = async () => {
+        setShowAuthDialog(false);
+        setAuthState(AuthState.Authenticating);
+        addMessage({
+            type: "assistant",
+            content: "Opening browser for authentication...",
+        });
+        try {
+            const result = await loginCommand();
+            saveToken(result.token, result.expiresAt);
+            // Update ApiClient with the new token
+            if (apiClient) {
+                apiClient.setApiKey(result.token);
+            }
+            setAuthState(AuthState.Authenticated);
+            addMessage({
+                type: "assistant",
+                content: "Successfully logged in!",
+            });
+        }
+        catch (error) {
+            setAuthState(AuthState.Unauthenticated);
+            addMessage({
+                type: "error",
+                content: `Login failed: ${error instanceof Error ? error.message : "Unknown error"}`,
+                errorType: "error",
+            });
+        }
+    };
+    // Handle task submission from input prompt
+    const handleSubmitTask = async (task) => {
+        const trimmedTask = task.trim();
+        // Handle Slash Commands
+        if (trimmedTask.startsWith("/")) {
+            const command = trimmedTask.toLowerCase();
+            if (command === "/clear") {
+                clearMessages();
+                return;
+            }
+            if (command === "/exit") {
+                exit();
+                onExit(true);
+                return;
+            }
+            if (command === "/help" || command === "/?") {
+                setShowHelp((prev) => !prev);
+                return;
+            }
+            if (command === "/login") {
+                if (authState === AuthState.Authenticated) {
+                    addMessage({
+                        type: "assistant",
+                        content: "Already logged in. Use /logout first to log out.",
+                    });
+                    return;
+                }
+                setShowAuthDialog(true);
+                return;
+            }
+            if (command === "/logout") {
+                if (authState !== AuthState.Authenticated) {
+                    addMessage({
+                        type: "assistant",
+                        content: "Not currently logged in.",
+                    });
+                    return;
+                }
+                removeToken();
+                // Clear ApiClient token to prevent further API calls
+                if (apiClient) {
+                    apiClient.clearApiKey();
+                }
+                setAuthState(AuthState.Unauthenticated);
+                addMessage({
+                    type: "assistant",
+                    content: "Successfully logged out!",
+                });
+                return;
+            }
+            if (command === "/resume") {
+                if (!apiClient) {
+                    addMessage({
+                        type: "error",
+                        content: "API client not available. Cannot fetch sessions.",
+                        errorType: "error",
+                    });
+                    return;
+                }
+                setShowSessionSelector(true);
+                return;
+            }
+            if (command === "/setup") {
+                addMessage({
+                    type: "assistant",
+                    content: "Running setup...",
+                });
+                try {
+                    const result = await setupCommand();
+                    addMessage({
+                        type: "assistant",
+                        content: result.output,
+                    });
+                }
+                catch (error) {
+                    addMessage({
+                        type: "error",
+                        content: `Setup failed: ${error instanceof Error ? error.message : String(error)}`,
+                        errorType: "error",
+                    });
+                }
+                return;
+            }
+        }
+        // Check authentication before allowing task submission
+        if (authState !== AuthState.Authenticated) {
+            addMessage({
+                type: "error",
+                content: "Authentication required. Please login to continue.",
+                errorType: "warning",
+            });
+            setShowAuthDialog(true);
+            return;
+        }
+        setHasInputContent(false); // Reset content flag
+        setExitWarning(null);
+        // Don't add message here - let InteractiveApp handle it
+        // addMessage({
+        // 	type: "user",
+        // 	content: task,
+        // });
+        if (onSubmitTask) {
+            onSubmitTask(task);
+        }
+    };
+    // Handle session selection
+    const handleSessionSelect = (session) => {
+        setShowSessionSelector(false);
+        addMessage({
+            type: "assistant",
+            content: `Switching to session: ${session.title || "Untitled"} (${session.id})`,
+        });
+        if (onResumeSession) {
+            onResumeSession(session);
+        }
+    };
+    const handleSessionSelectorCancel = () => {
+        setShowSessionSelector(false);
+    };
+    // Handle terminal resize
+    useEffect(() => {
+        const handleResize = () => {
+            setTerminalWidth(process.stdout.columns || 80);
+            setTerminalHeight(process.stdout.rows || 24);
+        };
+        process.stdout.on("resize", handleResize);
+        return () => {
+            process.stdout.off("resize", handleResize);
+        };
+    }, []);
+    // Keyboard shortcuts
+    useInput((input, key) => {
+        // ESC: Cancel current request (abort running operations)
+        if (key.escape && isAgentRunning) {
+            setShouldInterruptAgent(true);
+            addMessage({
+                type: "error",
+                content: "Request cancelled",
+                errorType: "info",
+            });
+        }
+        // Ctrl+C: Cancel if running, or exit with warning
+        if (key.ctrl && input === "c") {
+            if (isAgentRunning) {
+                // Cancel the running request (same as Escape)
+                setShouldInterruptAgent(true);
+                addMessage({
+                    type: "error",
+                    content: "Request cancelled",
+                    errorType: "info",
+                });
+                // Show exit warning
+                setExitWarning("Press Ctrl+C again to exit");
+                setTimeout(() => setExitWarning(null), 1500);
+            }
+            else if (exitWarning) {
+                // Second Ctrl+C within warning period - exit
+                exit();
+                onExit(true);
+            }
+            else if (showInput && hasInputContent) {
+                // Clear input and show warning
+                inputPromptRef.current?.clear();
+                setExitWarning("Press Ctrl+C again to exit");
+                setTimeout(() => setExitWarning(null), 1500);
+            }
+            else {
+                // Nothing running, no input - show warning first
+                setExitWarning("Press Ctrl+C again to exit");
+                setTimeout(() => setExitWarning(null), 1500);
+            }
+        }
+        // Ctrl+D: Exit immediately
+        if (key.ctrl && input === "d") {
+            exit();
+            onExit(true);
+        }
+        // Ctrl+H: Toggle help (removing '?' check here as it conflicts with input)
+        if (key.ctrl && input === "h") {
+            setShowHelp((prev) => !prev);
+        }
+        // Ctrl+L: Clear screen (not messages, just terminal)
+        if (key.ctrl && input === "l") {
+            console.clear();
+        }
+        // Ctrl+O: Toggle all tool outputs
+        if (key.ctrl && input === "o") {
+            toggleAllToolOutputs();
+        }
+    });
+    // Show initial user message if task was provided
+    useEffect(() => {
+        if (config.task) {
+            addMessage({
+                type: "user",
+                content: config.task,
+            });
+        }
+    }, []); // eslint-disable-line react-hooks/exhaustive-deps
+    return (React.createElement(Box, { flexDirection: "column", flexGrow: 0, flexShrink: 0, height: terminalHeight, overflow: "hidden", paddingX: 1 },
+        React.createElement(MessageList, { currentFolder: currentFolder, gitBranch: gitBranch, terminalWidth: terminalWidth }),
+        showHelp && React.createElement(HelpMenu, { isAuthenticated: authState === AuthState.Authenticated }),
+        showSessionSelector && apiClient && (React.createElement(SessionSelector, { apiClient: apiClient, onCancel: handleSessionSelectorCancel, onSelect: handleSessionSelect })),
+        showAuthDialog && (React.createElement(AuthDialog, { onLogin: handleLogin })),
+        React.createElement(Box, { flexDirection: "column", flexGrow: 0, flexShrink: 0 },
+            React.createElement(QueuedMessageDisplay, { messageQueue: queuedTasks }),
+            !showAuthDialog && React.createElement(AuthBanner, { authState: authState }),
+            showInput && !showSessionSelector && !showAuthDialog && (React.createElement(Box, { flexDirection: "column", marginTop: 0, width: "100%" },
+                exitWarning && (React.createElement(Box, { marginBottom: 0, paddingX: 1 },
+                    React.createElement(Text, { color: "yellow" }, exitWarning))),
+                React.createElement(InputPrompt, { currentFolder: currentFolder, gitBranch: gitBranch, onHelpToggle: () => setShowHelp(prev => !prev), onInputChange: (val) => setHasInputContent(val.trim().length > 0), onSubmit: handleSubmitTask, placeholder: "Enter your task...", ref: inputPromptRef }))))));
+};
+/**
+ * Root App component
+ * Note: SessionProvider should be provided by the parent component
+ */
+export const App = (props) => {
+    return React.createElement(AppContent, { ...props });
+};

package/dist/ui/components/AuthBanner.js

@@ -0,0 +1,24 @@
+/**
+ * Auth Banner Component
+ * Shows authentication status when user is not logged in
+ */
+import { Box, Text } from "ink";
+import React from "react";
+import { AuthState } from "../types/auth.js";
+import { theme } from "../utils/theme.js";
+export const AuthBanner = ({ authState }) => {
+    // Don't show banner if authenticated
+    if (authState === AuthState.Authenticated) {
+        return null;
+    }
+    if (authState === AuthState.Authenticating) {
+        return (React.createElement(Box, { marginBottom: 0, paddingX: 1 },
+            React.createElement(Text, { color: theme.text.info }, "Authenticating...")));
+    }
+    // Not logged in - show prominent banner
+    return (React.createElement(Box, { marginBottom: 0, paddingX: 1, paddingY: 0, borderStyle: "round", borderColor: theme.text.warning },
+        React.createElement(Text, { color: theme.text.warning, bold: true }, "Not logged in"),
+        React.createElement(Text, { color: theme.text.dim }, " - Type "),
+        React.createElement(Text, { color: theme.text.info }, "/login"),
+        React.createElement(Text, { color: theme.text.dim }, " to authenticate")));
+};

package/dist/ui/components/AuthDialog.js

@@ -0,0 +1,32 @@
+/**
+ * Auth Dialog Component
+ * Prompts user to login (authentication is required)
+ *
+ * Based on Gemini CLI (Apache 2.0 License)
+ * https://github.com/google-gemini/gemini-cli
+ * Copyright 2025 Google LLC
+ */
+import { Box, Text } from "ink";
+import React from "react";
+import { useKeypress } from "../hooks/useKeypress.js";
+import { theme } from "../utils/theme.js";
+export const AuthDialog = ({ onLogin }) => {
+    useKeypress((key) => {
+        // Any key press triggers login (Enter, L, or any other key)
+        if (key.name === "return" || key.name === "l" || key.sequence === "l") {
+            onLogin();
+        }
+    }, { isActive: true });
+    return (React.createElement(Box, { borderColor: theme.border.accent, borderStyle: "round", flexDirection: "column", paddingX: 2, paddingY: 1 },
+        React.createElement(Text, { bold: true, color: theme.text.primary }, "Welcome to Supatest CLI"),
+        React.createElement(Box, { marginTop: 1 },
+            React.createElement(Text, { color: theme.text.secondary }, "Authentication is required to use Supatest CLI.")),
+        React.createElement(Box, { flexDirection: "column", marginTop: 1 },
+            React.createElement(Box, null,
+                React.createElement(Text, { color: theme.text.accent },
+                    ">",
+                    " "),
+                React.createElement(Text, { color: theme.text.primary }, "[L] Login with browser"))),
+        React.createElement(Box, { marginTop: 1 },
+            React.createElement(Text, { color: theme.text.dim, italic: true }, "Press Enter or L to login"))));
+};

package/dist/ui/components/Banner.js

@@ -0,0 +1,12 @@
+import { Box, Text } from "ink";
+import React from "react";
+import { theme } from "../utils/theme.js";
+export const Banner = ({ text, type = "info" }) => {
+    let borderColor = theme.border.default;
+    if (type === "warning")
+        borderColor = theme.text.warning;
+    if (type === "error")
+        borderColor = theme.border.error;
+    return (React.createElement(Box, { borderColor: borderColor, borderStyle: "round", flexDirection: "column", marginBottom: 1, paddingX: 1, width: "100%" },
+        React.createElement(Text, { color: type === "warning" ? theme.text.warning : type === "error" ? theme.text.error : theme.text.primary }, text)));
+};

package/dist/ui/components/ExpandableSection.js

@@ -0,0 +1,17 @@
+/**
+ * Expandable Section Component
+ * Shows a collapsible section with summary and expandable details
+ */
+import { Box, Text } from "ink";
+import React from "react";
+import { theme } from "../utils/theme.js";
+export const ExpandableSection = ({ id, summary, summaryColor = theme.text.dim, details, isExpanded = false, onToggle, }) => {
+    return (React.createElement(Box, { flexDirection: "column" },
+        React.createElement(Box, { flexDirection: "row" },
+            React.createElement(Text, { color: summaryColor }, summary),
+            details && (React.createElement(Text, { color: theme.text.dim },
+                " ",
+                isExpanded ? "▼" : "▶"))),
+        isExpanded && details && (React.createElement(Box, { flexDirection: "column", marginLeft: 2 },
+            React.createElement(Text, { color: theme.text.dim }, details)))));
+};

package/dist/ui/components/Header.js

@@ -0,0 +1,51 @@
+import { Box, Text } from "ink";
+import Gradient from "ink-gradient";
+import React from "react";
+import { getBanner } from "../../utils/banner.js";
+import { CLI_VERSION } from "../../version.js";
+import { theme } from "../utils/theme.js";
+export const Header = ({ currentFolder, gitBranch }) => {
+    const version = CLI_VERSION;
+    const banner = getBanner();
+    // Build the info line: "v0.0.2 • ~/path/to/folder on branch"
+    const infoParts = [`v${version}`];
+    if (currentFolder) {
+        let locationStr = currentFolder;
+        if (gitBranch) {
+            locationStr += ` on ${gitBranch}`;
+        }
+        infoParts.push(locationStr);
+    }
+    const infoLine = infoParts.join(" • ");
+    return (React.createElement(Box, { alignItems: "center", flexDirection: "column", marginBottom: 1, marginTop: 5, width: "100%" },
+        React.createElement(Gradient, { colors: ["#C96868", "#FF8C94"] },
+            React.createElement(Text, null, banner)),
+        React.createElement(Box, { justifyContent: "center", marginTop: 0 },
+            React.createElement(Text, { color: theme.text.dim }, infoLine)),
+        React.createElement(Box, { flexDirection: "column", marginTop: 1, paddingX: 2, width: "100%" },
+            React.createElement(Box, { flexDirection: "column", marginBottom: 0 },
+                React.createElement(Text, { color: theme.text.dim },
+                    "\uD83D\uDCA1 ",
+                    React.createElement(Text, { color: theme.text.secondary }, "Tip:"),
+                    " Use ",
+                    React.createElement(Text, { bold: true, color: theme.text.accent }, "@filename"),
+                    " to reference files, or ",
+                    React.createElement(Text, { bold: true, color: theme.text.accent }, "/help"),
+                    " for commands")),
+            React.createElement(Box, { flexDirection: "column", marginTop: 0 },
+                React.createElement(Text, { color: theme.text.dim },
+                    "\u2328\uFE0F  ",
+                    React.createElement(Text, { color: theme.text.secondary }, "Shortcuts:"),
+                    " ",
+                    React.createElement(Text, { bold: true, color: theme.text.accent }, "Ctrl+H"),
+                    " help, ",
+                    React.createElement(Text, { bold: true, color: theme.text.accent }, "Ctrl+C"),
+                    " exit, ",
+                    React.createElement(Text, { bold: true, color: theme.text.accent }, "ESC"),
+                    " interrupt")),
+            React.createElement(Box, { flexDirection: "column", marginTop: 0 },
+                React.createElement(Text, { color: theme.text.dim },
+                    "\uD83D\uDE80 ",
+                    React.createElement(Text, { color: theme.text.secondary }, "Prompt Tips:"),
+                    " Be explicit with instructions, provide context, use examples, and think step-by-step")))));
+};

package/dist/ui/components/HelpMenu.js

@@ -0,0 +1,89 @@
+/**
+ * Help Menu Component
+ * Displays available commands, keyboard shortcuts, and usage tips
+ */
+import { Box, Text } from "ink";
+import React from "react";
+import { theme } from "../utils/theme.js";
+export const HelpMenu = ({ isAuthenticated }) => {
+    return (React.createElement(Box, { borderColor: theme.border.accent, borderStyle: "round", flexDirection: "column", marginBottom: 1, marginTop: 1, paddingX: 2, paddingY: 1 },
+        React.createElement(Text, { bold: true, color: theme.text.accent }, "\uD83D\uDCD6 Supatest AI CLI - Help"),
+        React.createElement(Box, { marginTop: 1 }),
+        React.createElement(Text, { bold: true, color: theme.text.secondary }, "Slash Commands:"),
+        React.createElement(Box, { flexDirection: "column", marginLeft: 2, marginTop: 0 },
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/help"),
+                React.createElement(Text, { color: theme.text.dim }, " or "),
+                React.createElement(Text, { color: theme.text.accent }, "/?"),
+                React.createElement(Text, { color: theme.text.dim }, " - Toggle this help menu")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/resume"),
+                React.createElement(Text, { color: theme.text.dim }, " - Resume a previous session")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/clear"),
+                React.createElement(Text, { color: theme.text.dim }, " - Clear message history")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/setup"),
+                React.createElement(Text, { color: theme.text.dim }, " - Initial setup for Supatest CLI")),
+            isAuthenticated ? (React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/logout"),
+                React.createElement(Text, { color: theme.text.dim }, " - Log out of Supatest"))) : (React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/login"),
+                React.createElement(Text, { color: theme.text.dim }, " - Authenticate with Supatest"))),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "/exit"),
+                React.createElement(Text, { color: theme.text.dim }, " - Exit the CLI"))),
+        React.createElement(Box, { marginTop: 1 }),
+        React.createElement(Text, { bold: true, color: theme.text.secondary }, "Keyboard Shortcuts:"),
+        React.createElement(Box, { flexDirection: "column", marginLeft: 2, marginTop: 0 },
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "?"),
+                React.createElement(Text, { color: theme.text.dim },
+                    " ",
+                    "- Toggle help (when input is empty)")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Ctrl+H"),
+                React.createElement(Text, { color: theme.text.dim }, " - Toggle help")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Ctrl+C"),
+                React.createElement(Text, { color: theme.text.dim },
+                    " ",
+                    "- Exit (or clear input if not empty)")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Ctrl+D"),
+                React.createElement(Text, { color: theme.text.dim }, " - Exit immediately")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Ctrl+L"),
+                React.createElement(Text, { color: theme.text.dim }, " - Clear terminal screen")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Ctrl+U"),
+                React.createElement(Text, { color: theme.text.dim }, " - Clear current input line")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "ESC"),
+                React.createElement(Text, { color: theme.text.dim }, " - Interrupt running agent")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Shift+Up/Down"),
+                React.createElement(Text, { color: theme.text.dim }, " - Scroll through messages")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "Shift+Enter"),
+                React.createElement(Text, { color: theme.text.dim }, " - Add new line in input")),
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "ctrl+o"),
+                React.createElement(Text, { color: theme.text.dim }, " - Toggle tool outputs"))),
+        React.createElement(Box, { marginTop: 1 }),
+        React.createElement(Text, { bold: true, color: theme.text.secondary }, "File References:"),
+        React.createElement(Box, { flexDirection: "column", marginLeft: 2, marginTop: 0 },
+            React.createElement(Text, null,
+                React.createElement(Text, { color: theme.text.accent }, "@filename"),
+                React.createElement(Text, { color: theme.text.dim },
+                    " ",
+                    "- Reference a file (autocomplete with Tab)")),
+            React.createElement(Text, { color: theme.text.dim }, "Example: \"Fix the bug in @src/app.ts\"")),
+        React.createElement(Box, { marginTop: 1 }),
+        React.createElement(Text, { bold: true, color: theme.text.secondary }, "Tips:"),
+        React.createElement(Box, { flexDirection: "column", marginLeft: 2, marginTop: 0 },
+            React.createElement(Text, { color: theme.text.dim }, "\u2022 Press Enter to submit your task"),
+            React.createElement(Text, { color: theme.text.dim }, "\u2022 Use Shift+Enter to write multi-line prompts"),
+            React.createElement(Text, { color: theme.text.dim }, "\u2022 Drag and drop files into the terminal to add file paths"),
+            React.createElement(Text, { color: theme.text.dim }, "\u2022 The agent will automatically run tools and fix issues"))));
+};