@dexto/tui 1.6.2

package/dist/components/SlashCommandAutocomplete.js

@@ -0,0 +1,363 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import React, {
+  useState,
+  useEffect,
+  useRef,
+  useMemo,
+  useCallback,
+  forwardRef,
+  useImperativeHandle
+} from "react";
+import { Box, Text } from "ink";
+import { getAllCommands } from "../interactive-commands/commands.js";
+import { useTerminalSize } from "../hooks/useTerminalSize.js";
+import { getMaxVisibleItemsForTerminalRows } from "../utils/overlaySizing.js";
+function getPromptMatchScore(prompt, query) {
+  if (!query) return 3;
+  const lowerQuery = query.toLowerCase();
+  const name = prompt.name.toLowerCase();
+  const description = (prompt.description || "").toLowerCase();
+  const title = (prompt.title || "").toLowerCase();
+  if (name.startsWith(lowerQuery)) {
+    return 3;
+  }
+  if (name.includes(lowerQuery)) {
+    return 2;
+  }
+  if (description.includes(lowerQuery) || title.includes(lowerQuery)) {
+    return 1;
+  }
+  return 0;
+}
+function matchesPromptQuery(prompt, query) {
+  return getPromptMatchScore(prompt, query) > 0;
+}
+function getSystemCommandMatchScore(cmd, query) {
+  if (!query) return 4;
+  const lowerQuery = query.toLowerCase();
+  const name = cmd.name.toLowerCase();
+  const description = (cmd.description || "").toLowerCase();
+  if (name.startsWith(lowerQuery)) {
+    return 4;
+  }
+  if (name.includes(lowerQuery)) {
+    return 3;
+  }
+  if (cmd.aliases) {
+    for (const alias of cmd.aliases) {
+      const lowerAlias = alias.toLowerCase();
+      if (lowerAlias.startsWith(lowerQuery)) {
+        return 2;
+      }
+      if (lowerAlias.includes(lowerQuery)) {
+        return 2;
+      }
+    }
+  }
+  if (description.includes(lowerQuery)) {
+    return 1;
+  }
+  return 0;
+}
+function matchesSystemCommandQuery(cmd, query) {
+  return getSystemCommandMatchScore(cmd, query) > 0;
+}
+const SlashCommandAutocompleteInner = forwardRef(function SlashCommandAutocomplete({
+  isVisible,
+  searchQuery,
+  onSelectPrompt,
+  onSelectSystemCommand,
+  onLoadIntoInput,
+  onSubmitRaw,
+  onClose,
+  agent
+}, ref) {
+  const [prompts, setPrompts] = useState([]);
+  const [systemCommands, setSystemCommands] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const { columns: terminalWidth, rows: terminalRows } = useTerminalSize();
+  const maxVisibleItems = useMemo(() => {
+    return getMaxVisibleItemsForTerminalRows({
+      rows: terminalRows,
+      hardCap: 8,
+      reservedRows: 8
+    });
+  }, [terminalRows]);
+  const [selection, setSelection] = useState({ index: 0, offset: 0 });
+  const selectedIndexRef = useRef(0);
+  const updateSelection = useCallback(
+    (indexUpdater) => {
+      setSelection((prev) => {
+        const newIndex = typeof indexUpdater === "function" ? indexUpdater(prev.index) : indexUpdater;
+        selectedIndexRef.current = newIndex;
+        let newOffset = prev.offset;
+        if (newIndex < prev.offset) {
+          newOffset = newIndex;
+        } else if (newIndex >= prev.offset + maxVisibleItems) {
+          newOffset = Math.max(0, newIndex - maxVisibleItems + 1);
+        }
+        return { index: newIndex, offset: newOffset };
+      });
+    },
+    [maxVisibleItems]
+  );
+  useEffect(() => {
+    if (!isVisible) return;
+    let cancelled = false;
+    setIsLoading(true);
+    const fetchCommands = async () => {
+      try {
+        const promptSet = await agent.listPrompts();
+        const promptList = Object.values(promptSet).map((p) => ({
+          ...p,
+          kind: "prompt"
+        }));
+        const allCommands = getAllCommands();
+        const commandList = allCommands.map((cmd) => ({
+          kind: "system",
+          name: cmd.name,
+          description: cmd.description,
+          ...cmd.category && { category: cmd.category },
+          ...cmd.aliases && { aliases: cmd.aliases }
+        }));
+        if (!cancelled) {
+          setPrompts(promptList);
+          setSystemCommands(commandList);
+          setIsLoading(false);
+        }
+      } catch {
+        if (!cancelled) {
+          setPrompts([]);
+          setSystemCommands([]);
+          setIsLoading(false);
+        }
+      }
+    };
+    void fetchCommands();
+    return () => {
+      cancelled = true;
+    };
+  }, [isVisible, agent]);
+  const commandQuery = useMemo(() => {
+    if (!searchQuery.startsWith("/")) return "";
+    const afterSlash = searchQuery.slice(1).trim();
+    const spaceIndex = afterSlash.indexOf(" ");
+    return spaceIndex > 0 ? afterSlash.slice(0, spaceIndex) : afterSlash;
+  }, [searchQuery]);
+  const filteredPrompts = useMemo(() => {
+    if (!commandQuery) {
+      return prompts;
+    }
+    return prompts.filter((p) => matchesPromptQuery(p, commandQuery)).sort((a, b) => {
+      const scoreA = getPromptMatchScore(a, commandQuery);
+      const scoreB = getPromptMatchScore(b, commandQuery);
+      return scoreB - scoreA;
+    });
+  }, [prompts, commandQuery]);
+  const filteredSystemCommands = useMemo(() => {
+    if (!commandQuery) {
+      return systemCommands;
+    }
+    return systemCommands.filter((cmd) => matchesSystemCommandQuery(cmd, commandQuery)).sort((a, b) => {
+      const scoreA = getSystemCommandMatchScore(a, commandQuery);
+      const scoreB = getSystemCommandMatchScore(b, commandQuery);
+      return scoreB - scoreA;
+    });
+  }, [systemCommands, commandQuery]);
+  const hasArguments = useMemo(() => {
+    if (!searchQuery.startsWith("/")) return false;
+    const afterSlash = searchQuery.slice(1).trim();
+    return afterSlash.includes(" ");
+  }, [searchQuery]);
+  const combinedItems = useMemo(() => {
+    const items = [];
+    if (hasArguments) {
+      const exactSystemCmd = systemCommands.find(
+        (cmd) => cmd.name.toLowerCase() === commandQuery.toLowerCase()
+      );
+      if (exactSystemCmd) {
+        items.push({ kind: "system", command: exactSystemCmd });
+      }
+      const exactPrompt = prompts.find(
+        (p) => p.name.toLowerCase() === commandQuery.toLowerCase() || p.displayName && p.displayName.toLowerCase() === commandQuery.toLowerCase()
+      );
+      if (exactPrompt) {
+        items.push({ kind: "prompt", prompt: exactPrompt });
+      }
+      return items;
+    }
+    filteredSystemCommands.forEach((cmd) => items.push({ kind: "system", command: cmd }));
+    filteredPrompts.forEach((prompt) => items.push({ kind: "prompt", prompt }));
+    return items;
+  }, [
+    hasArguments,
+    filteredPrompts,
+    filteredSystemCommands,
+    systemCommands,
+    prompts,
+    commandQuery
+  ]);
+  const getFirstItemId = () => {
+    const first = combinedItems[0];
+    if (!first) return null;
+    if (first.kind === "system") return `sys:${first.command.name}`;
+    return `prompt:${first.prompt.name}`;
+  };
+  const currentFirstId = getFirstItemId();
+  const prevItemsRef = useRef({ length: combinedItems.length, firstId: currentFirstId });
+  const itemsChanged = combinedItems.length !== prevItemsRef.current.length || currentFirstId !== prevItemsRef.current.firstId;
+  const selectedIndex = itemsChanged ? 0 : Math.min(selection.index, Math.max(0, combinedItems.length - 1));
+  const scrollOffset = itemsChanged ? 0 : Math.min(selection.offset, Math.max(0, combinedItems.length - maxVisibleItems));
+  useEffect(() => {
+    if (itemsChanged) {
+      prevItemsRef.current = { length: combinedItems.length, firstId: currentFirstId };
+      if (selection.index !== 0 || selection.offset !== 0) {
+        selectedIndexRef.current = 0;
+        setSelection({ index: 0, offset: 0 });
+      } else {
+        selectedIndexRef.current = 0;
+      }
+    }
+  }, [itemsChanged, combinedItems.length, currentFirstId, selection.index, selection.offset]);
+  const visibleItems = useMemo(() => {
+    return combinedItems.slice(scrollOffset, scrollOffset + maxVisibleItems);
+  }, [combinedItems, scrollOffset, maxVisibleItems]);
+  useImperativeHandle(
+    ref,
+    () => ({
+      handleInput: (input, key) => {
+        if (!isVisible) return false;
+        if (key.escape) {
+          onClose();
+          return true;
+        }
+        const itemsLength = combinedItems.length;
+        if (itemsLength === 0 || hasArguments) {
+          if (key.return) {
+            void Promise.resolve(onSubmitRaw?.(searchQuery)).catch((err) => {
+              const message = err instanceof Error ? err.message : String(err);
+              agent.logger.error(
+                `SlashCommandAutocomplete: Failed to submit raw command: ${message}`
+              );
+            });
+            onClose();
+            return true;
+          }
+          return false;
+        }
+        if (key.upArrow) {
+          updateSelection((prev) => (prev - 1 + itemsLength) % itemsLength);
+          return true;
+        }
+        if (key.downArrow) {
+          updateSelection((prev) => (prev + 1) % itemsLength);
+          return true;
+        }
+        if (key.tab) {
+          const item = combinedItems[selectedIndexRef.current];
+          if (!item) return false;
+          const interactiveCommands = ["model", "resume", "switch"];
+          const isInteractiveCommand = item.kind === "system" && interactiveCommands.includes(item.command.name);
+          if (isInteractiveCommand && item.kind === "system") {
+            onSelectSystemCommand?.(item.command.name);
+          } else if (item.kind === "system") {
+            onLoadIntoInput?.(`/${item.command.name}`);
+          } else {
+            const cmdName = item.prompt.commandName || item.prompt.displayName || item.prompt.name;
+            const argsString = item.prompt.arguments && item.prompt.arguments.length > 0 ? " " + item.prompt.arguments.map((arg) => `<${arg.name}${arg.required ? "" : "?"}>`).join(" ") : "";
+            onLoadIntoInput?.(`/${cmdName}${argsString}`);
+          }
+          return true;
+        }
+        if (key.return) {
+          const item = combinedItems[selectedIndexRef.current];
+          if (!item) return false;
+          if (item.kind === "system") {
+            onSelectSystemCommand?.(item.command.name);
+          } else {
+            onSelectPrompt(item.prompt);
+          }
+          onClose();
+          return true;
+        }
+        return false;
+      }
+    }),
+    [
+      isVisible,
+      combinedItems,
+      hasArguments,
+      selectedIndexRef,
+      searchQuery,
+      onClose,
+      onLoadIntoInput,
+      onSubmitRaw,
+      onSelectPrompt,
+      onSelectSystemCommand,
+      updateSelection,
+      agent
+    ]
+  );
+  if (!isVisible) return null;
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Box, { width: terminalWidth, paddingX: 0, paddingY: 0, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: "Loading commands..." }) });
+  }
+  if (combinedItems.length === 0) {
+    return null;
+  }
+  const nameColumnWidth = Math.max(16, Math.min(28, Math.floor(terminalWidth * 0.32)));
+  const descriptionColor = (isSelected) => isSelected ? "white" : "gray";
+  const commandColor = (isSelected) => isSelected ? "cyan" : "gray";
+  return /* @__PURE__ */ jsx(Box, { flexDirection: "column", width: terminalWidth, children: visibleItems.map((item, visibleIndex) => {
+    const actualIndex = scrollOffset + visibleIndex;
+    const isSelected = actualIndex === selectedIndex;
+    if (item.kind === "system") {
+      const cmd = item.command;
+      const nameText2 = `/${cmd.name}`;
+      const descText = cmd.description || "";
+      return /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
+        /* @__PURE__ */ jsx(Box, { marginRight: 1, children: /* @__PURE__ */ jsx(Text, { color: commandColor(isSelected), children: isSelected ? "\u276F" : " " }) }),
+        /* @__PURE__ */ jsx(Box, { width: nameColumnWidth, children: /* @__PURE__ */ jsx(
+          Text,
+          {
+            wrap: "truncate-end",
+            color: commandColor(isSelected),
+            bold: isSelected,
+            children: nameText2
+          }
+        ) }),
+        /* @__PURE__ */ jsx(Box, { flexGrow: 1, minWidth: 0, children: /* @__PURE__ */ jsx(Text, { wrap: "truncate-end", color: descriptionColor(isSelected), children: descText }) })
+      ] }, `system-${cmd.name}`);
+    }
+    const prompt = item.prompt;
+    const displayName = prompt.displayName || prompt.name;
+    const hasCollision = prompt.commandName && prompt.commandName !== displayName;
+    const nameText = `/${displayName}`;
+    const argsString = prompt.arguments && prompt.arguments.length > 0 ? " " + prompt.arguments.map((arg) => `<${arg.name}${arg.required ? "" : "?"}>`).join(" ") : "";
+    const description = prompt.title || prompt.description || "";
+    const commandText = nameText + argsString;
+    const collisionSuffix = hasCollision ? ` (use /${prompt.commandName})` : "";
+    return /* @__PURE__ */ jsxs(Box, { flexDirection: "row", children: [
+      /* @__PURE__ */ jsx(Box, { marginRight: 1, children: /* @__PURE__ */ jsx(Text, { color: commandColor(isSelected), children: isSelected ? "\u276F" : " " }) }),
+      /* @__PURE__ */ jsx(Box, { width: nameColumnWidth, children: /* @__PURE__ */ jsx(
+        Text,
+        {
+          wrap: "truncate-end",
+          color: commandColor(isSelected),
+          bold: isSelected,
+          children: commandText
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Box, { flexGrow: 1, minWidth: 0, children: /* @__PURE__ */ jsxs(Text, { wrap: "truncate-end", color: descriptionColor(isSelected), children: [
+        description,
+        collisionSuffix
+      ] }) })
+    ] }, `prompt-${prompt.name}`);
+  }) });
+});
+const SlashCommandAutocomplete2 = React.memo(
+  SlashCommandAutocompleteInner
+);
+export {
+  SlashCommandAutocomplete2 as SlashCommandAutocomplete
+};

package/dist/components/StatusBar.cjs

@@ -0,0 +1,142 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var StatusBar_exports = {};
+__export(StatusBar_exports, {
+  StatusBar: () => StatusBar
+});
+module.exports = __toCommonJS(StatusBar_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_ink = require("ink");
+var import_usePhraseCycler = require("../hooks/usePhraseCycler.js");
+var import_useElapsedTime = require("../hooks/useElapsedTime.js");
+var import_useTokenCounter = require("../hooks/useTokenCounter.js");
+var import_useAnimationTick = require("../hooks/useAnimationTick.js");
+var import_spinnerFrames = require("../constants/spinnerFrames.js");
+function StatusSpinner({ enabled, color }) {
+  const tick = (0, import_useAnimationTick.useAnimationTick)({ enabled, intervalMs: 80 });
+  const frame = import_spinnerFrames.BRAILLE_SPINNER_FRAMES[tick % import_spinnerFrames.BRAILLE_SPINNER_FRAMES.length];
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color, children: frame });
+}
+function StatusBar({
+  agent,
+  isProcessing,
+  isThinking,
+  isCompacting,
+  approvalQueueCount,
+  copyModeEnabled = false,
+  isAwaitingApproval = false,
+  todoExpanded = true,
+  hasTodos = false,
+  planModeActive = false,
+  autoApproveEdits = false,
+  backgroundTasksRunning = 0
+}) {
+  const animationsActive = isProcessing && !isAwaitingApproval && !copyModeEnabled;
+  const { phrase } = (0, import_usePhraseCycler.usePhraseCycler)({ isActive: animationsActive && !isCompacting });
+  const { formatted: elapsedTime, elapsedMs } = (0, import_useElapsedTime.useElapsedTime)({
+    isActive: animationsActive,
+    intervalMs: 1e3
+  });
+  const { formatted: tokenCount } = (0, import_useTokenCounter.useTokenCounter)({ agent, isActive: animationsActive });
+  const showTime = elapsedMs >= 3e4;
+  if (copyModeEnabled) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { paddingX: 1, marginBottom: 0, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "yellowBright", bold: true, children: "\u{1F4CB} Copy Mode - Select text with mouse. Press any key to exit." }) });
+  }
+  if (!isProcessing) {
+    return null;
+  }
+  if (isAwaitingApproval) {
+    return null;
+  }
+  const todoHint = hasTodos ? todoExpanded ? "ctrl+t to hide todos" : "ctrl+t to show todos" : null;
+  const backgroundHint = backgroundTasksRunning > 0 ? "ctrl+b to view bg tasks" : null;
+  if (isCompacting) {
+    const metaParts2 = [];
+    if (showTime) metaParts2.push(`(${elapsedTime})`);
+    if (backgroundTasksRunning > 0) {
+      metaParts2.push(
+        `${backgroundTasksRunning} bg task${backgroundTasksRunning > 1 ? "s" : ""}`
+      );
+    }
+    if (backgroundHint) metaParts2.push(backgroundHint);
+    metaParts2.push("Esc to cancel");
+    if (todoHint) metaParts2.push(todoHint);
+    const metaContent2 = metaParts2.join(" \u2022 ");
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { paddingX: 1, marginTop: 1, flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "row", alignItems: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusSpinner, { enabled: true, color: "yellow" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "yellow", children: " \u{1F4E6} Compacting context..." })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginLeft: 2, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: metaContent2 }) })
+    ] });
+  }
+  if (isThinking) {
+    const metaParts2 = [];
+    if (showTime) metaParts2.push(`(${elapsedTime})`);
+    if (tokenCount) metaParts2.push(tokenCount);
+    if (backgroundTasksRunning > 0) {
+      metaParts2.push(
+        `${backgroundTasksRunning} bg task${backgroundTasksRunning > 1 ? "s" : ""}`
+      );
+    }
+    if (backgroundHint) metaParts2.push(backgroundHint);
+    metaParts2.push("Esc to cancel");
+    if (todoHint) metaParts2.push(todoHint);
+    const metaContent2 = metaParts2.join(" \u2022 ");
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { paddingX: 1, marginTop: 1, flexDirection: "column", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "row", alignItems: "center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusSpinner, { enabled: true, color: "green" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "green", children: [
+          " ",
+          phrase
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginLeft: 2, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: metaContent2 }) })
+    ] });
+  }
+  const metaParts = [];
+  if (showTime) metaParts.push(`(${elapsedTime})`);
+  if (tokenCount) metaParts.push(tokenCount);
+  if (backgroundTasksRunning > 0) {
+    metaParts.push(`${backgroundTasksRunning} bg task${backgroundTasksRunning > 1 ? "s" : ""}`);
+  }
+  if (backgroundHint) metaParts.push(backgroundHint);
+  metaParts.push("Esc to cancel");
+  if (todoHint) metaParts.push(todoHint);
+  const metaContent = metaParts.join(" \u2022 ");
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { paddingX: 1, marginTop: 1, flexDirection: "column", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Box, { flexDirection: "row", alignItems: "center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusSpinner, { enabled: true, color: "green" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "green", children: [
+        " ",
+        phrase
+      ] }),
+      approvalQueueCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ink.Text, { color: "yellowBright", children: [
+        " \u2022 ",
+        approvalQueueCount,
+        " queued"
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Box, { marginLeft: 2, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ink.Text, { color: "gray", children: metaContent }) })
+  ] });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  StatusBar
+});

package/dist/components/StatusBar.d.ts

@@ -0,0 +1,41 @@
+/**
+ * StatusBar Component
+ * Displays processing status and controls above the input area
+ *
+ * Layout:
+ * - Line 1: Spinner + phrase (+ queue count if any)
+ * - Line 2: Meta info (time, tokens, cancel hint)
+ * This 2-line layout prevents truncation on any terminal width.
+ */
+import type { DextoAgent } from '@dexto/core';
+interface StatusBarProps {
+    agent: DextoAgent;
+    isProcessing: boolean;
+    isThinking: boolean;
+    isCompacting: boolean;
+    approvalQueueCount: number;
+    copyModeEnabled?: boolean;
+    /** Whether an approval prompt is currently shown */
+    isAwaitingApproval?: boolean;
+    /** Whether the todo list is expanded */
+    todoExpanded?: boolean;
+    /** Whether there are todos to display */
+    hasTodos?: boolean;
+    /** Whether plan mode is active */
+    planModeActive?: boolean;
+    /** Whether accept all edits mode is active */
+    autoApproveEdits?: boolean;
+    /** Number of running background tasks */
+    backgroundTasksRunning?: number;
+}
+/**
+ * Status bar that shows processing state above input area
+ * Provides clear feedback on whether the agent is running or idle
+ *
+ * Design decisions:
+ * - Hide spinner during approval wait (user is reviewing, not waiting)
+ * - Only show elapsed time after 30s (avoid visual noise for fast operations)
+ */
+export declare function StatusBar({ agent, isProcessing, isThinking, isCompacting, approvalQueueCount, copyModeEnabled, isAwaitingApproval, todoExpanded, hasTodos, planModeActive, autoApproveEdits, backgroundTasksRunning, }: StatusBarProps): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=StatusBar.d.ts.map

package/dist/components/StatusBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusBar.d.ts","sourceRoot":"","sources":["../../src/components/StatusBar.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAa9C,UAAU,cAAc;IACpB,KAAK,EAAE,UAAU,CAAC;IAClB,YAAY,EAAE,OAAO,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;IACtB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oDAAoD;IACpD,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,wCAAwC;IACxC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kCAAkC;IAClC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,8CAA8C;IAC9C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,yCAAyC;IACzC,sBAAsB,CAAC,EAAE,MAAM,CAAC;CACnC;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,EACtB,KAAK,EACL,YAAY,EACZ,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,eAAuB,EACvB,kBAA0B,EAC1B,YAAmB,EACnB,QAAgB,EAChB,cAAsB,EACtB,gBAAwB,EACxB,sBAA0B,GAC7B,EAAE,cAAc,kDAwIhB"}

package/dist/components/StatusBar.js

@@ -0,0 +1,118 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Box, Text } from "ink";
+import { usePhraseCycler } from "../hooks/usePhraseCycler.js";
+import { useElapsedTime } from "../hooks/useElapsedTime.js";
+import { useTokenCounter } from "../hooks/useTokenCounter.js";
+import { useAnimationTick } from "../hooks/useAnimationTick.js";
+import { BRAILLE_SPINNER_FRAMES } from "../constants/spinnerFrames.js";
+function StatusSpinner({ enabled, color }) {
+  const tick = useAnimationTick({ enabled, intervalMs: 80 });
+  const frame = BRAILLE_SPINNER_FRAMES[tick % BRAILLE_SPINNER_FRAMES.length];
+  return /* @__PURE__ */ jsx(Text, { color, children: frame });
+}
+function StatusBar({
+  agent,
+  isProcessing,
+  isThinking,
+  isCompacting,
+  approvalQueueCount,
+  copyModeEnabled = false,
+  isAwaitingApproval = false,
+  todoExpanded = true,
+  hasTodos = false,
+  planModeActive = false,
+  autoApproveEdits = false,
+  backgroundTasksRunning = 0
+}) {
+  const animationsActive = isProcessing && !isAwaitingApproval && !copyModeEnabled;
+  const { phrase } = usePhraseCycler({ isActive: animationsActive && !isCompacting });
+  const { formatted: elapsedTime, elapsedMs } = useElapsedTime({
+    isActive: animationsActive,
+    intervalMs: 1e3
+  });
+  const { formatted: tokenCount } = useTokenCounter({ agent, isActive: animationsActive });
+  const showTime = elapsedMs >= 3e4;
+  if (copyModeEnabled) {
+    return /* @__PURE__ */ jsx(Box, { paddingX: 1, marginBottom: 0, children: /* @__PURE__ */ jsx(Text, { color: "yellowBright", bold: true, children: "\u{1F4CB} Copy Mode - Select text with mouse. Press any key to exit." }) });
+  }
+  if (!isProcessing) {
+    return null;
+  }
+  if (isAwaitingApproval) {
+    return null;
+  }
+  const todoHint = hasTodos ? todoExpanded ? "ctrl+t to hide todos" : "ctrl+t to show todos" : null;
+  const backgroundHint = backgroundTasksRunning > 0 ? "ctrl+b to view bg tasks" : null;
+  if (isCompacting) {
+    const metaParts2 = [];
+    if (showTime) metaParts2.push(`(${elapsedTime})`);
+    if (backgroundTasksRunning > 0) {
+      metaParts2.push(
+        `${backgroundTasksRunning} bg task${backgroundTasksRunning > 1 ? "s" : ""}`
+      );
+    }
+    if (backgroundHint) metaParts2.push(backgroundHint);
+    metaParts2.push("Esc to cancel");
+    if (todoHint) metaParts2.push(todoHint);
+    const metaContent2 = metaParts2.join(" \u2022 ");
+    return /* @__PURE__ */ jsxs(Box, { paddingX: 1, marginTop: 1, flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs(Box, { flexDirection: "row", alignItems: "center", children: [
+        /* @__PURE__ */ jsx(StatusSpinner, { enabled: true, color: "yellow" }),
+        /* @__PURE__ */ jsx(Text, { color: "yellow", children: " \u{1F4E6} Compacting context..." })
+      ] }),
+      /* @__PURE__ */ jsx(Box, { marginLeft: 2, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: metaContent2 }) })
+    ] });
+  }
+  if (isThinking) {
+    const metaParts2 = [];
+    if (showTime) metaParts2.push(`(${elapsedTime})`);
+    if (tokenCount) metaParts2.push(tokenCount);
+    if (backgroundTasksRunning > 0) {
+      metaParts2.push(
+        `${backgroundTasksRunning} bg task${backgroundTasksRunning > 1 ? "s" : ""}`
+      );
+    }
+    if (backgroundHint) metaParts2.push(backgroundHint);
+    metaParts2.push("Esc to cancel");
+    if (todoHint) metaParts2.push(todoHint);
+    const metaContent2 = metaParts2.join(" \u2022 ");
+    return /* @__PURE__ */ jsxs(Box, { paddingX: 1, marginTop: 1, flexDirection: "column", children: [
+      /* @__PURE__ */ jsxs(Box, { flexDirection: "row", alignItems: "center", children: [
+        /* @__PURE__ */ jsx(StatusSpinner, { enabled: true, color: "green" }),
+        /* @__PURE__ */ jsxs(Text, { color: "green", children: [
+          " ",
+          phrase
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx(Box, { marginLeft: 2, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: metaContent2 }) })
+    ] });
+  }
+  const metaParts = [];
+  if (showTime) metaParts.push(`(${elapsedTime})`);
+  if (tokenCount) metaParts.push(tokenCount);
+  if (backgroundTasksRunning > 0) {
+    metaParts.push(`${backgroundTasksRunning} bg task${backgroundTasksRunning > 1 ? "s" : ""}`);
+  }
+  if (backgroundHint) metaParts.push(backgroundHint);
+  metaParts.push("Esc to cancel");
+  if (todoHint) metaParts.push(todoHint);
+  const metaContent = metaParts.join(" \u2022 ");
+  return /* @__PURE__ */ jsxs(Box, { paddingX: 1, marginTop: 1, flexDirection: "column", children: [
+    /* @__PURE__ */ jsxs(Box, { flexDirection: "row", alignItems: "center", children: [
+      /* @__PURE__ */ jsx(StatusSpinner, { enabled: true, color: "green" }),
+      /* @__PURE__ */ jsxs(Text, { color: "green", children: [
+        " ",
+        phrase
+      ] }),
+      approvalQueueCount > 0 && /* @__PURE__ */ jsxs(Text, { color: "yellowBright", children: [
+        " \u2022 ",
+        approvalQueueCount,
+        " queued"
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx(Box, { marginLeft: 2, children: /* @__PURE__ */ jsx(Text, { color: "gray", children: metaContent }) })
+  ] });
+}
+export {
+  StatusBar
+};