@within-7/minto 0.1.7 → 0.3.0

package/dist/components/PromptInput.js

@@ -7,14 +7,23 @@ import { useHistorySearch } from "../hooks/useHistorySearch.js";
 import { addToHistory, getHistory } from "../history.js";
 import TextInput from "./TextInput.js";
 import { HistorySearchOverlay } from "./HistorySearchOverlay.js";
-import { memo, useCallback, useMemo, useState } from "react";
+import {
+  HotkeyHelpPanel,
+  ContextAwareHints
+} from "./HotkeyHelpPanel.js";
+import { memo, useCallback, useEffect, useMemo, useState } from "react";
 import { countTokens } from "../utils/tokens.js";
 import { SentryErrorBoundary } from "./SentryErrorBoundary.js";
 import { TokenWarning, WARNING_THRESHOLD } from "./TokenWarning.js";
 import { useTerminalSize } from "../hooks/useTerminalSize.js";
 import { getTheme } from "../utils/theme.js";
+import { BRAND_GRADIENT, SEMANTIC_COLORS } from "../constants/colors.js";
 import { getModelManager } from "../utils/model.js";
-import { getGlobalConfig, saveGlobalConfig } from "../utils/config.js";
+import {
+  getGlobalConfig,
+  saveGlobalConfig,
+  getVerboseLabel
+} from "../utils/config.js";
 import { setTerminalTitle, clearScreen } from "../utils/terminal.js";
 import terminalSetup, {
   isShiftEnterKeyBindingInstalled,
@@ -65,6 +74,7 @@ function PromptInput({
   onQuery,
   debug,
   verbose,
+  verboseToggleMessage,
   messages,
   setToolJSX,
   tools,
@@ -87,7 +97,11 @@ function PromptInput({
   onRollbackConversation,
   onToggleBackgroundPanel,
   backgroundShellCount = 0,
-  isBackgroundPanelOpen = false
+  isBackgroundPanelOpen = false,
+  queuedPrompts = [],
+  onQueuePrompt,
+  onPopQueuedPrompt,
+  onInterrupt
 }) {
   const [exitMessage, setExitMessage] = useState({ show: false });
   const [message, setMessage] = useState({
@@ -104,10 +118,19 @@ function PromptInput({
   const [ctrlDTimer, setCtrlDTimer] = useState(null);
   const [escCount, setEscCount] = useState(0);
   const [escTimer, setEscTimer] = useState(null);
+  const ESC_DOUBLE_TAP_WINDOW = 500;
   const [hotkeyMessage, setHotkeyMessage] = useState({ show: false });
+  useEffect(() => {
+    if (verboseToggleMessage) {
+      setHotkeyMessage({ show: true, text: verboseToggleMessage });
+    }
+  }, [verboseToggleMessage]);
+  const [showHotkeyHelp, setShowHotkeyHelp] = useState(false);
   const [backgroundIndicatorFocused, setBackgroundIndicatorFocused] = useState(false);
   const { cycleMode, currentMode } = usePermissionContext();
-  const { columns } = useTerminalSize();
+  const terminalSize = useTerminalSize();
+  const { columns } = terminalSize;
+  const textInputColumns = columns - 6;
   const commandWidth = useMemo(
     () => Math.max(...commands.map((cmd) => cmd.userFacingName().length)) + 5,
     [commands]
@@ -128,6 +151,14 @@ function PromptInput({
   const history = useMemo(() => getHistory(), [submitCount]);
   const historySearch = useHistorySearch(history);
   const theme = getTheme();
+  const inputContext = useMemo(() => {
+    if (isLoading) return "loading";
+    if (historySearch.isActive) return "history_search";
+    if (completionActive) return "completion";
+    if (input.startsWith("/")) return "slash_command";
+    if (input.trim().length > 0) return "typing";
+    return "idle";
+  }, [isLoading, historySearch.isActive, completionActive, input]);
   const MAX_VISIBLE_SUGGESTIONS = 8;
   const visibleSuggestions = useMemo(() => {
     if (suggestions.length === 0) return [];
@@ -147,10 +178,10 @@ function PromptInput({
     if (suggestions.length === 0) return null;
     const hasMoreAbove = visibleSuggestions.length > 0 && visibleSuggestions[0].globalIndex > 0;
     const hasMoreBelow = visibleSuggestions.length > 0 && visibleSuggestions[visibleSuggestions.length - 1].globalIndex < suggestions.length - 1;
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, hasMoreAbove && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, " ", "\u2191 ", visibleSuggestions[0].globalIndex, " more above...")), visibleSuggestions.map((suggestion) => {
+    return /* @__PURE__ */ React.createElement(React.Fragment, null, hasMoreAbove && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\u2191 ", visibleSuggestions[0].globalIndex, " more above...")), visibleSuggestions.map((suggestion) => {
       const isSelected = suggestion.globalIndex === selectedIndex;
       const isAgent = suggestion.type === "agent";
-      const displayColor = isSelected ? theme.suggestion : isAgent && suggestion.metadata?.color ? suggestion.metadata.color : void 0;
+      const displayColor = isSelected ? BRAND_GRADIENT.START : isAgent && suggestion.metadata?.color ? suggestion.metadata.color : void 0;
       return /* @__PURE__ */ React.createElement(
         Box,
         {
@@ -160,14 +191,13 @@ function PromptInput({
         /* @__PURE__ */ React.createElement(
           Text,
           {
-            color: displayColor,
-            dimColor: !isSelected && !displayColor
+            color: displayColor || (!isSelected ? SEMANTIC_COLORS.dim : void 0)
           },
           isSelected ? "\u25C6 " : "  ",
           suggestion.displayValue
         )
       );
-    }), hasMoreBelow && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, " ", "\u2193", " ", suggestions.length - visibleSuggestions[visibleSuggestions.length - 1].globalIndex - 1, " ", "more below...")));
+    }), hasMoreBelow && /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\u2193", " ", suggestions.length - visibleSuggestions[visibleSuggestions.length - 1].globalIndex - 1, " ", "more below...")));
   }, [suggestions, selectedIndex, visibleSuggestions, theme.suggestion]);
   const onChange = useCallback(
     (value) => {
@@ -231,6 +261,14 @@ function PromptInput({
   );
   const handleHistoryUp = () => {
     if (!completionActive) {
+      if (input.trim() === "" && queuedPrompts.length > 0 && onPopQueuedPrompt) {
+        const poppedPrompt = onPopQueuedPrompt();
+        if (poppedPrompt) {
+          onInputChange(poppedPrompt);
+          setCursorOffset(poppedPrompt.length);
+          return;
+        }
+      }
       onHistoryUp();
     }
   };
@@ -330,12 +368,32 @@ function PromptInput({
       return;
     }
     if (isLoading) {
+      if (onQueuePrompt && input2.trim()) {
+        onQueuePrompt(input2.trim());
+        onInputChange("");
+        setMessage({
+          show: true,
+          text: `Queued: "${input2.slice(0, 30)}${input2.length > 30 ? "..." : ""}" (${queuedPrompts.length + 1} in queue)`
+        });
+        setTimeout(() => setMessage({ show: false }), 2e3);
+      }
       return;
     }
     if (suggestions.length > 0 && completionActive) {
       return;
     }
-    if (["exit", "quit", ":q", ":q!", ":wq", ":wq!"].includes(input2.trim())) {
+    const exitCommands = [
+      "exit",
+      "quit",
+      ":q",
+      ":q!",
+      ":wq",
+      ":wq!",
+      "/exit",
+      "/quit",
+      "/q"
+    ];
+    if (exitCommands.includes(input2.trim())) {
       exit();
     }
     let finalInput = input2;
@@ -454,19 +512,19 @@ function PromptInput({
         return true;
       }
       if (key.ctrl && inputChar === "o") {
-        const config = getGlobalConfig();
         const newVerbose = !verbose;
+        const config = getGlobalConfig();
         saveGlobalConfig({
           ...config,
           verbose: newVerbose
         });
         setHotkeyMessage({
           show: true,
-          text: `Verbose mode ${newVerbose ? "enabled" : "disabled"} (Ctrl-O)`
+          text: `${getVerboseLabel(newVerbose)} (Ctrl+O)`
         });
         setTimeout(() => setHotkeyMessage({ show: false }), 2e3);
         if (onToggleVerbose) {
-          onToggleVerbose();
+          onToggleVerbose(newVerbose);
         }
         return true;
       }
@@ -508,6 +566,10 @@ function PromptInput({
         onSubmit(bashCommand);
         return true;
       }
+      if (key.ctrl && (inputChar === "?" || inputChar === "/")) {
+        setShowHotkeyHelp((prev) => !prev);
+        return true;
+      }
       if (key.ctrl && inputChar === "r") {
         if (!historySearch.isActive) {
           historySearch.activate();
@@ -588,37 +650,6 @@ function PromptInput({
       if (inputChar === "" && (key.escape || key.backspace || key.delete)) {
         onModeChange("prompt");
       }
-      if (key.escape && !input && !isLoading && messages.length > 0 && onRollbackConversation) {
-        setEscCount((prev) => prev + 1);
-        if (escTimer) clearTimeout(escTimer);
-        const timer = setTimeout(() => setEscCount(0), 1e3);
-        setEscTimer(timer);
-        if (escCount >= 1) {
-          const success = onRollbackConversation();
-          if (success) {
-            setMessage({
-              show: true,
-              text: "Conversation rolled back (Esc Esc)"
-            });
-            setTimeout(() => setMessage({ show: false }), 2e3);
-          } else {
-            setMessage({ show: true, text: "No history to rollback" });
-            setTimeout(() => setMessage({ show: false }), 2e3);
-          }
-          setEscCount(0);
-          return true;
-        } else {
-          setMessage({
-            show: true,
-            text: "Press Esc again to rollback conversation"
-          });
-          setTimeout(() => setMessage({ show: false }), 2e3);
-          return true;
-        }
-      }
-      if (key.escape && messages.length > 0 && !input && !isLoading) {
-        onShowMessageSelector();
-      }
       if (key.tab && !key.shift && !completionActive) {
         const config = getGlobalConfig();
         const newThinking = !config.thinking;
@@ -647,11 +678,56 @@ function PromptInput({
         handleQuickModelSwitch();
         return true;
       }
+      if (key.escape) {
+        const newEscCount = escCount + 1;
+        setEscCount(newEscCount);
+        if (escTimer) clearTimeout(escTimer);
+        const timer = setTimeout(() => setEscCount(0), ESC_DOUBLE_TAP_WINDOW);
+        setEscTimer(timer);
+        if (newEscCount >= 2) {
+          setEscCount(0);
+          if (input.length > 0) {
+            onInputChange("");
+            setHotkeyMessage({ show: true, text: "Input cleared (Esc Esc)" });
+            setTimeout(() => setHotkeyMessage({ show: false }), 1e3);
+            return true;
+          } else if (isLoading && onInterrupt) {
+            onInterrupt();
+            setHotkeyMessage({
+              show: true,
+              text: "Interrupted by user (Esc Esc)"
+            });
+            setTimeout(() => setHotkeyMessage({ show: false }), 2e3);
+            return true;
+          }
+        } else {
+          if (input.length > 0) {
+            setHotkeyMessage({
+              show: true,
+              text: "Press Esc again to clear input"
+            });
+          } else if (isLoading) {
+            setHotkeyMessage({
+              show: true,
+              text: "Press Esc again to interrupt"
+            });
+          }
+          setTimeout(() => setHotkeyMessage({ show: false }), 1500);
+          return true;
+        }
+      }
       return false;
     },
-    [handleQuickModelSwitch]
+    [
+      handleQuickModelSwitch,
+      isLoading,
+      input.length,
+      onInputChange,
+      onInterrupt,
+      escCount,
+      escTimer
+    ]
   );
-  const textInputColumns = useTerminalSize().columns - 6;
   const tokenUsage = useMemo(() => countTokens(messages), [messages]);
   const modelManager = getModelManager();
   const currentModelId = modelManager.getModel("main")?.id || null;
@@ -672,22 +748,32 @@ function PromptInput({
       currentTokens: tokenUsage
     };
   }, [tokenUsage, modelSwitchMessage.show, submitCount, currentModelId]);
-  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, fallbackMode && /* @__PURE__ */ React.createElement(Box, { marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { color: "yellow" }, "\u26A0\uFE0F Limited input mode"), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, " ", "(Advanced keyboard shortcuts unavailable - raw mode not supported)")), historySearch.isActive && /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(Box, { flexDirection: "column" }, fallbackMode && /* @__PURE__ */ React.createElement(Box, { marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.running }, "\u26A0\uFE0F Limited input mode"), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "(Advanced keyboard shortcuts unavailable - raw mode not supported)")), showHotkeyHelp && /* @__PURE__ */ React.createElement(
+    HotkeyHelpPanel,
+    {
+      isVisible: showHotkeyHelp,
+      onClose: () => setShowHotkeyHelp(false)
+    }
+  ), historySearch.isActive && /* @__PURE__ */ React.createElement(
     HistorySearchOverlay,
     {
       searchTerm: historySearch.searchTerm,
       results: historySearch.filteredResults,
       selectedIndex: historySearch.selectedIndex
     }
-  ), modelInfo && /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "[", modelInfo.provider, "] ", modelInfo.name, ":", " ", Math.round(modelInfo.currentTokens / 1e3), "k /", " ", Math.round(modelInfo.contextLength / 1e3), "k")), /* @__PURE__ */ React.createElement(
+  ), modelInfo && /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", marginBottom: 1 }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, "\u25C6"), " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, modelInfo.name), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\xB7 ", Math.round(modelInfo.currentTokens / 1e3), "k /", " ", Math.round(modelInfo.contextLength / 1e3), "k"))), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Box, { flexDirection: "column", marginTop: 1 }, /* @__PURE__ */ React.createElement(Box, { paddingLeft: 2 }, /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.MIDDLE }, "\u2500\u2500 Queued (", queuedPrompts.length, ")"), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, " ", "\xB7 will run after current task \xB7", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "\u2191"), " to edit \u2500\u2500")), queuedPrompts.map((prompt, index) => /* @__PURE__ */ React.createElement(Box, { key: index, paddingLeft: 2 }, /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, "\u25C7 "), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, prompt.length > 60 ? prompt.slice(0, 60) + "..." : prompt)))), /* @__PURE__ */ React.createElement(
     Box,
     {
       alignItems: "flex-start",
       justifyContent: "flex-start",
-      borderColor: mode === "bash" ? theme.bashBorder : mode === "koding" ? theme.noting : theme.secondaryBorder,
-      borderDimColor: true,
-      borderStyle: "round",
-      marginTop: 1,
+      borderTop: true,
+      borderBottom: true,
+      borderLeft: false,
+      borderRight: false,
+      borderColor: mode === "bash" ? SEMANTIC_COLORS.running : mode === "koding" ? SEMANTIC_COLORS.info : BRAND_GRADIENT.START,
+      borderDimColor: false,
+      borderStyle: "single",
+      marginTop: queuedPrompts.length > 0 ? 0 : 1,
       width: "100%"
     },
     /* @__PURE__ */ React.createElement(
@@ -699,13 +785,20 @@ function PromptInput({
         justifyContent: "flex-start",
         width: 3
       },
-      mode === "bash" ? /* @__PURE__ */ React.createElement(Text, { color: theme.bashBorder }, "\xA0!\xA0") : mode === "koding" ? /* @__PURE__ */ React.createElement(Text, { color: theme.noting }, "\xA0#\xA0") : /* @__PURE__ */ React.createElement(Text, { color: isLoading ? theme.secondaryText : void 0 }, "\xA0>\xA0")
+      mode === "bash" ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.running }, "\xA0!\xA0") : mode === "koding" ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.info }, "\xA0#\xA0") : /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          color: isLoading ? SEMANTIC_COLORS.dim : BRAND_GRADIENT.START,
+          bold: true
+        },
+        "\xA0\u276F\xA0"
+      )
     ),
     /* @__PURE__ */ React.createElement(Box, { paddingRight: 1 }, /* @__PURE__ */ React.createElement(
       TextInput,
       {
         multiline: true,
-        focus: !isBackgroundPanelOpen,
+        focus: !isBackgroundPanelOpen && (!isLoading || !!onQueuePrompt),
         onSubmit,
         onChange,
         value: input,
@@ -718,7 +811,7 @@ function PromptInput({
         onMessage: (show, text) => setMessage({ show, text }),
         onImagePaste,
         columns: textInputColumns,
-        isDimmed: isDisabled || isLoading,
+        isDimmed: isDisabled || isLoading && !onQueuePrompt,
         disableCursorMovementForUpDownKeys: completionActive,
         cursorOffset,
         onChangeCursorOffset: setCursorOffset,
@@ -734,38 +827,69 @@ function PromptInput({
       paddingX: 2,
       paddingY: 0
     },
-    /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-start", gap: 1 }, exitMessage.show ? /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "Press ", exitMessage.key, " again to exit") : message.show ? /* @__PURE__ */ React.createElement(Text, { dimColor: true }, message.text) : hotkeyMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: theme.success }, hotkeyMessage.text) : modelSwitchMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: theme.success }, modelSwitchMessage.text) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-      Text,
-      {
-        color: mode === "bash" ? theme.bashBorder : void 0,
-        dimColor: mode !== "bash"
-      },
-      "! for bash mode"
-    ), /* @__PURE__ */ React.createElement(
-      Text,
-      {
-        color: mode === "koding" ? theme.noting : void 0,
-        dimColor: mode !== "koding"
-      },
-      "\xB7 # for ",
-      PROJECT_FILE
-    ), /* @__PURE__ */ React.createElement(Text, { dimColor: true }, "\xB7 / for commands \xB7 ctrl+c cancel \xB7 ctrl+l clear"), backgroundShellCount > 0 && /* @__PURE__ */ React.createElement(
-      Text,
-      {
-        color: backgroundIndicatorFocused ? theme.primary : theme.success,
-        backgroundColor: backgroundIndicatorFocused ? theme.success : void 0,
-        dimColor: !backgroundIndicatorFocused
-      },
-      "\xB7 ",
-      backgroundIndicatorFocused ? "\u25BA " : "",
-      backgroundShellCount,
-      " background task",
-      backgroundShellCount > 1 ? "s" : ""
-    ))),
+    /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-start", gap: 1 }, exitMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "Press", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, exitMessage.key), " ", "again to exit") : message.show ? /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, message.text) : hotkeyMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, hotkeyMessage.text) : modelSwitchMessage.show ? /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.START }, modelSwitchMessage.text) : verbose ? (
+      // Verbose mode: full static hints (商务用户友好) - 使用品牌配色
+      /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          color: mode === "bash" ? BRAND_GRADIENT.MIDDLE : SEMANTIC_COLORS.dim
+        },
+        /* @__PURE__ */ React.createElement(
+          Text,
+          {
+            color: mode === "bash" ? BRAND_GRADIENT.MIDDLE : SEMANTIC_COLORS.secondary
+          },
+          "!"
+        ),
+        " ",
+        "\u6267\u884C\u547D\u4EE4"
+      ), /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          color: mode === "koding" ? SEMANTIC_COLORS.info : SEMANTIC_COLORS.dim
+        },
+        "\xB7",
+        " ",
+        /* @__PURE__ */ React.createElement(
+          Text,
+          {
+            color: mode === "koding" ? SEMANTIC_COLORS.info : SEMANTIC_COLORS.secondary
+          },
+          "#"
+        ),
+        " ",
+        "\u8BB0\u5F55\u7B14\u8BB0"
+      ), /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "\xB7 ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "/"), " \u529F\u80FD\u83DC\u5355 \xB7", " ", /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, "ctrl+?"), " \u5E2E\u52A9"), backgroundShellCount > 0 && /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          color: backgroundIndicatorFocused ? BRAND_GRADIENT.START : BRAND_GRADIENT.MIDDLE,
+          backgroundColor: backgroundIndicatorFocused ? BRAND_GRADIENT.START : void 0
+        },
+        "\xB7 ",
+        backgroundIndicatorFocused ? "\u25BA " : "",
+        backgroundShellCount,
+        " background task",
+        backgroundShellCount > 1 ? "s" : ""
+      ), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.MIDDLE }, "\xB7 \u{1F4CB} ", queuedPrompts.length, " queued"))
+    ) : (
+      // Normal mode: context-aware hints with 0.1.7 style
+      /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ContextAwareHints, { context: inputContext, compact: true }), backgroundShellCount > 0 && /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          color: backgroundIndicatorFocused ? BRAND_GRADIENT.START : BRAND_GRADIENT.MIDDLE,
+          backgroundColor: backgroundIndicatorFocused ? BRAND_GRADIENT.START : void 0
+        },
+        "\u2502 ",
+        backgroundIndicatorFocused ? "\u25BA " : "",
+        backgroundShellCount,
+        " task",
+        backgroundShellCount > 1 ? "s" : ""
+      ), queuedPrompts.length > 0 && /* @__PURE__ */ React.createElement(Text, { color: BRAND_GRADIENT.MIDDLE }, "\u2502 \u{1F4CB} ", queuedPrompts.length, " queued"), isLoading && onQueuePrompt && queuedPrompts.length === 0 && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, "\u2502 Type to queue next prompt"))
+    )),
     /* @__PURE__ */ React.createElement(
       SentryErrorBoundary,
       {
-        children: /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", gap: 1 }, !debug && tokenUsage < WARNING_THRESHOLD && /* @__PURE__ */ React.createElement(Text, { dimColor: true }, terminalSetup.isEnabled && isShiftEnterKeyBindingInstalled() ? "shift + \u23CE for newline" : "\\\u23CE for newline"), /* @__PURE__ */ React.createElement(TokenWarning, { tokenUsage }))
+        children: /* @__PURE__ */ React.createElement(Box, { justifyContent: "flex-end", gap: 1 }, !debug && tokenUsage < WARNING_THRESHOLD && /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.dim }, /* @__PURE__ */ React.createElement(Text, { color: SEMANTIC_COLORS.secondary }, terminalSetup.isEnabled && isShiftEnterKeyBindingInstalled() ? "shift + \u23CE" : "\\\u23CE"), " ", "for newline"), /* @__PURE__ */ React.createElement(TokenWarning, { tokenUsage }))
       }
     )
   ), suggestions.length > 0 && /* @__PURE__ */ React.createElement(
@@ -782,13 +906,12 @@ function PromptInput({
         marginTop: 1,
         paddingX: 3,
         borderStyle: "round",
-        borderColor: "gray"
+        borderColor: BRAND_GRADIENT.START
       },
       /* @__PURE__ */ React.createElement(
         Text,
         {
-          dimColor: !emptyDirMessage,
-          color: emptyDirMessage ? "yellow" : void 0
+          color: emptyDirMessage ? BRAND_GRADIENT.END : SEMANTIC_COLORS.dim
         },
         emptyDirMessage || (() => {
           const selected = suggestions[selectedIndex];