byterover-cli 1.0.5 → 1.2.0

package/dist/tui/components/execution/execution-progress.d.ts

@@ -12,6 +12,8 @@ interface ProgressItem {
     toolCallName: string;
 }
 interface ExecutionProgressProps {
+    /** Whether content should be fully expanded (no truncation) */
+    isExpand?: boolean;
     /** Maximum number of lines (rows) this component can use, including hint line (default: 3) */
     maxLines?: number;
     /** Array of progress items */

package/dist/tui/components/execution/execution-progress.js

@@ -1,4 +1,4 @@
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Execution Progress Component
  *
@@ -10,11 +10,15 @@ import Spinner from 'ink-spinner';
 import { useTheme } from '../../hooks/index.js';
 /** Default maximum number of lines (rows) for progress display */
 const DEFAULT_MAX_LINES = 3;
-export const ExecutionProgress = ({ maxLines = DEFAULT_MAX_LINES, progress }) => {
+export const ExecutionProgress = ({ isExpand = false, maxLines = DEFAULT_MAX_LINES, progress, }) => {
     const { theme: { colors }, } = useTheme();
     if (!progress || progress.length === 0) {
         return null;
     }
+    // In expand mode, show all items without truncation
+    if (isExpand) {
+        return (_jsx(Box, { flexDirection: "column", children: progress.map((item) => (_jsxs(Box, { children: [item.status === 'completed' && _jsx(Text, { color: colors.primary, children: "\u2713 " }), item.status === 'running' && (_jsxs(Text, { color: colors.dimText, children: [_jsx(Spinner, { type: "dots" }), ' '] })), item.status === 'failed' && _jsx(Text, { color: colors.errorText, children: "\u2717 " }), _jsx(Text, { color: colors.dimText, children: item.toolCallName })] }, item.id))) }));
+    }
     const hasMore = progress.length > maxLines;
     // If there's overflow, reserve 1 line for hint, show (maxLines - 1) items
     const visibleCount = hasMore ? maxLines - 1 : maxLines;

package/dist/tui/components/execution/expanded-log-view.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Expanded Log View Component
+ *
+ * Full-screen overlay displaying a single log item with scrollable content.
+ * Activated by Ctrl+O on a selected log item, dismissed with Ctrl+O or Esc.
+ */
+import React from 'react';
+import type { ActivityLog } from '../../types.js';
+interface ExpandedLogViewProps {
+    /** Available height for the expanded view (in terminal rows) */
+    availableHeight: number;
+    /** Whether input handling is active */
+    isActive: boolean;
+    /** The log to display in expanded view */
+    log: ActivityLog;
+    /** Callback when the view should close */
+    onClose: () => void;
+}
+export declare const ExpandedLogView: React.FC<ExpandedLogViewProps>;
+export {};

package/dist/tui/components/execution/expanded-log-view.js

@@ -0,0 +1,75 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Expanded Log View Component
+ *
+ * Full-screen overlay displaying a single log item with scrollable content.
+ * Activated by Ctrl+O on a selected log item, dismissed with Ctrl+O or Esc.
+ */
+import { Box, Spacer, Text, useInput, useStdout } from 'ink';
+import { ScrollView } from 'ink-scroll-view';
+import { useEffect, useRef, useState } from 'react';
+import { useTheme } from '../../hooks/index.js';
+import { formatTime } from '../../utils/index.js';
+import { ExecutionChanges } from './execution-changes.js';
+import { ExecutionContent } from './execution-content.js';
+import { ExecutionProgress } from './execution-progress.js';
+import { ExecutionStatus } from './execution-status.js';
+export const ExpandedLogView = ({ availableHeight, isActive, log, onClose, }) => {
+    const { theme: { colors }, } = useTheme();
+    const { stdout } = useStdout();
+    const scrollViewRef = useRef(null);
+    const [hasMoreBelow, setHasMoreBelow] = useState(false);
+    const updateScrollIndicator = () => {
+        if (!scrollViewRef.current)
+            return;
+        const currentOffset = scrollViewRef.current.getScrollOffset();
+        const maxOffset = scrollViewRef.current.getBottomOffset();
+        setHasMoreBelow(currentOffset < maxOffset);
+    };
+    useEffect(() => {
+        const timer = setTimeout(updateScrollIndicator, 50);
+        return () => clearTimeout(timer);
+    }, [log]);
+    // Terminal resize handling
+    useEffect(() => {
+        const handleResize = () => {
+            scrollViewRef.current?.remeasure();
+            updateScrollIndicator();
+        };
+        stdout?.on('resize', handleResize);
+        return () => {
+            stdout?.off('resize', handleResize);
+        };
+    }, [stdout]);
+    useInput((input, key) => {
+        if (!scrollViewRef.current)
+            return;
+        if ((key.ctrl && input === 'o') || key.escape) {
+            onClose();
+        }
+        if (key.upArrow || input === 'k') {
+            scrollViewRef.current.scrollBy(-1);
+            updateScrollIndicator();
+        }
+        if (key.downArrow || input === 'j') {
+            const currentOffset = scrollViewRef.current.getScrollOffset();
+            const maxOffset = scrollViewRef.current.getBottomOffset();
+            const newOffset = Math.min(currentOffset + 1, maxOffset);
+            scrollViewRef.current.scrollTo(newOffset);
+            updateScrollIndicator();
+        }
+        if (input === 'g') {
+            scrollViewRef.current.scrollTo(0);
+            updateScrollIndicator();
+        }
+        if (input === 'G') {
+            scrollViewRef.current.scrollTo(scrollViewRef.current.getBottomOffset());
+            updateScrollIndicator();
+        }
+    }, { isActive });
+    const displayTime = formatTime(log.timestamp);
+    return (_jsxs(Box, { flexDirection: "column", height: "100%", paddingX: 2, width: "100%", children: [_jsxs(Box, { children: [_jsxs(Text, { color: log.type === 'curate' ? colors.curateCommand : colors.queryCommand, children: ["[", log.type, "] "] }), _jsxs(Text, { color: colors.dimText, children: ["@", log.source ?? 'system'] }), _jsx(Text, { dimColor: true, children: "  -  [ctrl+o/esc] close | [\u2191\u2193/jk] scroll | [g/G] top/bottom" }), _jsx(Spacer, {}), _jsxs(Text, { color: colors.dimText, children: ["[", displayTime, "]"] })] }), _jsxs(Box, { borderColor: colors.border, borderStyle: "single", flexDirection: "column", height: availableHeight - 1, children: [_jsxs(ScrollView, { height: availableHeight - 2, ref: scrollViewRef, children: [_jsx(Box, { marginBottom: 1, paddingX: 1, children: _jsx(Text, { children: log.input }) }), _jsxs(Box, { flexDirection: "column", paddingX: 1, children: [log.progress && (_jsx(ExecutionProgress, { isExpand: true, maxLines: Number.MAX_SAFE_INTEGER, progress: log.progress })), _jsx(ExecutionStatus, { status: log.status })] }), (log.status === 'failed' || log.status === 'completed') && (_jsx(Box, { paddingX: 1, children: _jsx(ExecutionContent, { bottomMargin: 0, content: log.content ?? '', isError: log.status === 'failed', isExpand: true, maxLines: Number.MAX_SAFE_INTEGER }) })), log.status === 'completed' && (_jsx(Box, { paddingX: 1, children: _jsx(ExecutionChanges, { created: log.changes.created, isExpand: true, maxChanges: {
+                                        created: Number.MAX_SAFE_INTEGER,
+                                        updated: Number.MAX_SAFE_INTEGER,
+                                    }, updated: log.changes.updated }) }))] }), _jsx(Box, { justifyContent: "center", children: _jsx(Text, { color: colors.dimText, children: hasMoreBelow ? '↓' : ' ' }) })] })] }));
+};

package/dist/tui/components/execution/expanded-message-view.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Expanded Message View Component
+ *
+ * Full-screen overlay displaying a single command message with scrollable output.
+ * Activated by Ctrl+O on a selected message, dismissed with Ctrl+O or Esc.
+ */
+import React from 'react';
+import type { CommandMessage } from '../../types.js';
+interface ExpandedMessageViewProps {
+    /** Available height for the expanded view (in terminal rows) */
+    availableHeight: number;
+    /** Whether input handling is active */
+    isActive: boolean;
+    /** The message to display in expanded view */
+    message: CommandMessage;
+    /** Index of the message */
+    messageIndex: number;
+    /** Callback when the view should close */
+    onClose: () => void;
+    /** Render function for the message item */
+    renderMessageItem: (msg: CommandMessage, index: number, isExpanded?: boolean) => React.ReactNode;
+}
+export declare const ExpandedMessageView: React.FC<ExpandedMessageViewProps>;
+export {};

package/dist/tui/components/execution/expanded-message-view.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Expanded Message View Component
+ *
+ * Full-screen overlay displaying a single command message with scrollable output.
+ * Activated by Ctrl+O on a selected message, dismissed with Ctrl+O or Esc.
+ */
+import { Box, Spacer, Text, useInput, useStdout } from 'ink';
+import { ScrollView } from 'ink-scroll-view';
+import { useEffect, useRef, useState } from 'react';
+import { useTheme } from '../../hooks/index.js';
+export const ExpandedMessageView = ({ availableHeight, isActive, message, messageIndex, onClose, renderMessageItem, }) => {
+    const { theme: { colors }, } = useTheme();
+    const { stdout } = useStdout();
+    const scrollViewRef = useRef(null);
+    const [hasMoreBelow, setHasMoreBelow] = useState(false);
+    const updateScrollIndicator = () => {
+        if (!scrollViewRef.current)
+            return;
+        const currentOffset = scrollViewRef.current.getScrollOffset();
+        const maxOffset = scrollViewRef.current.getBottomOffset();
+        setHasMoreBelow(currentOffset < maxOffset);
+    };
+    // Initial scroll position check
+    useEffect(() => {
+        // Delay to allow ScrollView to measure content
+        const timer = setTimeout(updateScrollIndicator, 50);
+        return () => clearTimeout(timer);
+    }, [message]);
+    // Terminal resize handling
+    useEffect(() => {
+        const handleResize = () => {
+            scrollViewRef.current?.remeasure();
+            updateScrollIndicator();
+        };
+        stdout?.on('resize', handleResize);
+        return () => {
+            stdout?.off('resize', handleResize);
+        };
+    }, [stdout]);
+    useInput((input, key) => {
+        if (!scrollViewRef.current)
+            return;
+        if ((key.ctrl && input === 'o') || key.escape) {
+            onClose();
+        }
+        if (key.upArrow || input === 'k') {
+            scrollViewRef.current.scrollBy(-1);
+            updateScrollIndicator();
+        }
+        if (key.downArrow || input === 'j') {
+            const currentOffset = scrollViewRef.current.getScrollOffset();
+            const maxOffset = scrollViewRef.current.getBottomOffset();
+            const newOffset = Math.min(currentOffset + 1, maxOffset);
+            scrollViewRef.current.scrollTo(newOffset);
+            updateScrollIndicator();
+        }
+        if (input === 'g') {
+            scrollViewRef.current.scrollTo(0);
+            updateScrollIndicator();
+        }
+        if (input === 'G') {
+            scrollViewRef.current.scrollTo(scrollViewRef.current.getBottomOffset());
+            updateScrollIndicator();
+        }
+    }, { isActive });
+    return (_jsxs(Box, { flexDirection: "column", height: "100%", paddingX: 2, width: "100%", children: [_jsxs(Box, { children: [_jsx(Text, { dimColor: true, children: "[ctrl+o/esc] close | [\u2191\u2193/jk] scroll | [g/G] top/bottom" }), _jsx(Spacer, {})] }), _jsxs(Box, { borderColor: colors.border, borderStyle: "single", flexDirection: "column", flexGrow: 1, height: availableHeight - 1, children: [_jsx(ScrollView, { height: availableHeight - 2, ref: scrollViewRef, children: renderMessageItem(message, messageIndex, true) }), _jsx(Box, { justifyContent: "center", children: _jsx(Text, { color: colors.dimText, children: hasMoreBelow ? "↓" : " " }) })] })] }));
+};

package/dist/tui/components/execution/index.d.ts

@@ -8,4 +8,6 @@ export { ExecutionContent, truncateContent } from './execution-content.js';
 export { ExecutionInput } from './execution-input.js';
 export { ExecutionProgress } from './execution-progress.js';
 export { ExecutionStatus } from './execution-status.js';
+export { ExpandedLogView } from './expanded-log-view.js';
+export { ExpandedMessageView } from './expanded-message-view.js';
 export { LogItem } from './log-item.js';

package/dist/tui/components/execution/index.js

@@ -8,4 +8,6 @@ export { ExecutionContent, truncateContent } from './execution-content.js';
 export { ExecutionInput } from './execution-input.js';
 export { ExecutionProgress } from './execution-progress.js';
 export { ExecutionStatus } from './execution-status.js';
+export { ExpandedLogView } from './expanded-log-view.js';
+export { ExpandedMessageView } from './expanded-message-view.js';
 export { LogItem } from './log-item.js';

package/dist/tui/components/execution/log-item.d.ts

@@ -9,6 +9,10 @@ import type { ActivityLog } from '../../types.js';
 interface LogItemProps {
     /** Dynamic heights based on terminal breakpoint */
     heights: MessageItemHeights;
+    /** Whether content should be fully expanded (no truncation) */
+    isExpand?: boolean;
+    /** Whether this log item is currently selected */
+    isSelected?: boolean;
     /** The activity log to display */
     log: ActivityLog;
 }

package/dist/tui/components/execution/log-item.js

@@ -12,8 +12,8 @@ import { ExecutionContent } from './execution-content.js';
 import { ExecutionInput } from './execution-input.js';
 import { ExecutionProgress } from './execution-progress.js';
 import { ExecutionStatus } from './execution-status.js';
-export const LogItem = ({ heights, log }) => {
+export const LogItem = ({ heights, isExpand, isSelected, log }) => {
     const { theme: { colors }, } = useTheme();
     const displayTime = formatTime(log.timestamp);
-    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, width: "100%", children: [_jsxs(Box, { children: [_jsxs(Text, { color: log.type === 'curate' ? colors.curateCommand : colors.queryCommand, children: ["[", log.type, "] "] }), _jsxs(Text, { color: colors.dimText, children: ["@", log.source ?? 'system'] }), _jsx(Spacer, {}), _jsxs(Text, { color: colors.dimText, children: ["[", displayTime, "]"] })] }), _jsx(ExecutionInput, { input: log.input }), _jsxs(Box, { flexDirection: "column", children: [log.progress && _jsx(ExecutionProgress, { maxLines: heights.maxProgressItems, progress: log.progress }), _jsx(ExecutionStatus, { status: log.status })] }), (log.status === 'failed' || log.status === 'completed') && (_jsx(ExecutionContent, { bottomMargin: heights.contentBottomMargin, content: log.content ?? '', isError: log.status === 'failed', maxLines: heights.maxContentLines })), log.status === 'completed' && (_jsx(ExecutionChanges, { created: log.changes.created, maxChanges: heights.maxChanges, updated: log.changes.updated }))] }));
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, width: "100%", children: [_jsxs(Box, { children: [_jsxs(Text, { color: log.type === 'curate' ? colors.curateCommand : colors.queryCommand, children: ["[", log.type, "] "] }), _jsxs(Text, { color: colors.dimText, children: ["@", log.source ?? 'system'] }), isSelected && (_jsxs(Text, { dimColor: true, italic: true, children: ["  \u2190  [ctrl+o] to ", isExpand ? 'collapse' : 'expand'] })), _jsx(Spacer, {}), _jsxs(Text, { color: colors.dimText, children: ["[", displayTime, "]"] })] }), _jsx(ExecutionInput, { input: log.input, isExpand: isExpand }), _jsxs(Box, { flexDirection: "column", children: [log.progress && (_jsx(ExecutionProgress, { isExpand: isExpand, maxLines: heights.maxProgressItems, progress: log.progress })), _jsx(ExecutionStatus, { status: log.status })] }), (log.status === 'failed' || log.status === 'completed') && (_jsx(ExecutionContent, { bottomMargin: heights.contentBottomMargin, content: log.content ?? '', isError: log.status === 'failed', isExpand: isExpand, maxLines: heights.maxContentLines })), log.status === 'completed' && (_jsx(ExecutionChanges, { created: log.changes.created, isExpand: isExpand, maxChanges: heights.maxChanges, updated: log.changes.updated }))] }));
 };

package/dist/tui/components/footer.js

@@ -13,5 +13,5 @@ export const Footer = () => {
     const { theme: { colors }, } = useTheme();
     // Filter out 'tab' shortcut during onboarding (tab switching is disabled)
     const visibleShortcuts = useMemo(() => (shouldShowOnboarding ? shortcuts.filter((s) => s.key !== 'tab') : shortcuts), [shortcuts, shouldShowOnboarding]);
-    return (_jsx(Box, { gap: 1, paddingX: 1, width: "100%", children: visibleShortcuts.map((shortcut, index) => (_jsxs(Box, { children: [index > 0 && _jsx(Text, { color: colors.dimText, children: " \u2022 " }), _jsx(Text, { color: colors.text, children: shortcut.key }), _jsxs(Text, { color: colors.dimText, children: [" ", shortcut.description] })] }, shortcut.key))) }));
+    return (_jsx(Box, { paddingX: 1, width: "100%", children: visibleShortcuts.map((shortcut, index) => (_jsxs(Box, { children: [index > 0 && _jsx(Text, { color: colors.dimText, children: " \u2022 " }), _jsx(Text, { color: colors.text, children: shortcut.key }), _jsxs(Text, { color: colors.dimText, children: [" ", shortcut.description] })] }, shortcut.key))) }));
 };

package/dist/tui/components/index.d.ts

@@ -3,13 +3,14 @@
  */
 export { CommandDetails } from './command-details.js';
 export { EnterPrompt } from './enter-prompt.js';
-export { ExecutionChanges, ExecutionContent, ExecutionInput, ExecutionProgress, ExecutionStatus, LogItem, truncateContent, } from './execution/index.js';
+export { ExecutionChanges, ExecutionContent, ExecutionInput, ExecutionProgress, ExecutionStatus, ExpandedLogView, LogItem, truncateContent, } from './execution/index.js';
 export { Footer } from './footer.js';
 export { Header } from './header.js';
 export { Init } from './init.js';
 export type { InitProps } from './init.js';
 export { Logo } from './logo.js';
 export type { LogoVariant } from './logo.js';
+export { Markdown } from './markdown.js';
 export { MessageItem } from './message-item.js';
 export { CopyablePrompt, OnboardingFlow, OnboardingStep, WelcomeBox } from './onboarding/index.js';
 export type { OnboardingStepType } from './onboarding/index.js';

package/dist/tui/components/index.js

@@ -3,11 +3,12 @@
  */
 export { CommandDetails } from './command-details.js';
 export { EnterPrompt } from './enter-prompt.js';
-export { ExecutionChanges, ExecutionContent, ExecutionInput, ExecutionProgress, ExecutionStatus, LogItem, truncateContent, } from './execution/index.js';
+export { ExecutionChanges, ExecutionContent, ExecutionInput, ExecutionProgress, ExecutionStatus, ExpandedLogView, LogItem, truncateContent, } from './execution/index.js';
 export { Footer } from './footer.js';
 export { Header } from './header.js';
 export { Init } from './init.js';
 export { Logo } from './logo.js';
+export { Markdown } from './markdown.js';
 export { MessageItem } from './message-item.js';
 export { CopyablePrompt, OnboardingFlow, OnboardingStep, WelcomeBox } from './onboarding/index.js';
 export { OutputLog } from './output-log.js';

package/dist/tui/components/init.js

@@ -237,17 +237,10 @@ export const Init = ({ active = true, autoStart = false, idleMessage = 'Your pro
         handleSelectResponse,
         maxSearchItems,
     ]);
-    // Running state - show streaming output
-    if (isRunningInit) {
-        const { displayMessages } = getMessagesFromEnd(processedStreamingMessages, maxOutputLines);
-        return (_jsx(Box, { flexDirection: "column", width: "100%", children: _jsxs(Box, { borderColor: colors.border, borderStyle: "single", flexDirection: "column", paddingX: 1, paddingY: 0, width: "100%", children: [displayMessages.map((streamMsg) => renderStreamingMessage(streamMsg)), renderActivePrompt()] }) }));
-    }
     // Error state - show error with retry
     if (initError) {
         return (_jsxs(Box, { flexDirection: "column", rowGap: 1, children: [_jsxs(Text, { color: colors.errorText, children: ["Error: ", initError] }), _jsx(EnterPrompt, { action: "try again", active: active && !isRunningInit && !activePrompt, onEnter: runInit })] }));
     }
-    if (autoStart) {
-        return null;
-    }
-    return (_jsxs(Box, { flexDirection: "column", rowGap: 1, children: [showIdleMessage && _jsx(Text, { color: colors.text, children: idleMessage }), _jsx(EnterPrompt, { action: "initialize your project", active: active && !isRunningInit && !activePrompt, onEnter: runInit })] }));
+    const { displayMessages } = getMessagesFromEnd(processedStreamingMessages, maxOutputLines);
+    return (_jsxs(Box, { flexDirection: "column", rowGap: 1, children: [showIdleMessage && _jsx(Text, { color: colors.text, children: idleMessage }), displayMessages.length > 0 && (_jsxs(Box, { borderColor: colors.border, borderStyle: "single", flexDirection: "column", paddingX: 1, paddingY: 0, width: "100%", children: [displayMessages.map((streamMsg) => renderStreamingMessage(streamMsg)), renderActivePrompt()] })), !isRunningInit && displayMessages.length === 0 && (_jsx(EnterPrompt, { action: "initialize your project", active: active && !isRunningInit && !activePrompt, onEnter: runInit }))] }));
 };

package/dist/tui/components/logo.js

@@ -8,7 +8,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import { Box, Text, useStdout } from 'ink';
 import { useMemo } from 'react';
-import { useTheme } from '../hooks/index.js';
+import { useIsLatestVersion, useTheme } from '../hooks/index.js';
 /**
  * Full ASCII logo "ByteRover" for large terminals
  */
@@ -83,6 +83,7 @@ function getLogoLines(variant, terminalWidth) {
 export const Logo = ({ compact, version }) => {
     const { stdout } = useStdout();
     const { theme: { colors }, } = useTheme();
+    const isLatestVersion = useIsLatestVersion(version ?? '');
     const terminalWidth = stdout?.columns ?? 80;
     const terminalHeight = stdout?.rows ?? 24;
     const variant = useMemo(() => (compact ? 'text' : selectLogoVariant(terminalWidth, terminalHeight)), [compact, terminalWidth, terminalHeight]);
@@ -90,9 +91,9 @@ export const Logo = ({ compact, version }) => {
     const headerLine = useMemo(() => (variant === 'full' && LOGO_FULL[0] ? getHeaderLine(LOGO_FULL[0], version ?? '', terminalWidth) : null), [variant, version, terminalWidth]);
     // Text-only logo for minimal terminals
     if (variant === 'text') {
-        const textContent = MINI_LOGO + (version ? ` v${version}` : '');
+        const textContent = MINI_LOGO + (version ? ` v${version}` : '') + (isLatestVersion ? ' (latest)' : '');
         const padEnd = calculatePadEnd(textContent.length, terminalWidth);
-        return (_jsxs(Box, { children: [_jsx(Text, { color: colors.logoDecor, children: PAD_START }), _jsxs(Text, { children: [_jsx(Text, { bold: true, color: colors.logoBold, children: MINI_LOGO }), version && _jsxs(Text, { color: colors.logoVersion, children: [" v", version] })] }), _jsx(Text, { color: colors.logoDecor, children: padEnd })] }));
+        return (_jsxs(Box, { children: [_jsx(Text, { color: colors.logoDecor, children: PAD_START }), _jsxs(Text, { children: [_jsx(Text, { bold: true, color: colors.logoBold, children: MINI_LOGO }), version && _jsxs(Text, { color: colors.logoVersion, children: [" v", version] }), isLatestVersion && _jsx(Text, { color: colors.logoVersion, children: " (latest)" })] }), _jsx(Text, { color: colors.logoDecor, children: padEnd })] }));
     }
     // ASCII logo with header line and version
     return (_jsxs(Box, { flexDirection: "column", children: [headerLine && (_jsxs(Box, { children: [_jsx(Text, { color: colors.logoDecor, children: headerLine.padStart }), _jsxs(Text, { children: [_jsx(Text, { children: headerLine.brv }), _jsx(Text, { children: headerLine.spaces }), _jsx(Text, { color: colors.logoVersion, children: headerLine.version })] }), _jsx(Text, { color: colors.logoDecor, children: headerLine.padEnd })] })), logoLines.map((line, index) => (_jsxs(Box, { children: [_jsx(Text, { color: colors.logoDecor, children: line.padStart }), _jsx(Text, { color: colors.logoBold, children: line.content }), _jsx(Text, { color: colors.logoDecor, children: line.padEnd })] }, index)))] }));

package/dist/tui/components/markdown.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Markdown Component
+ *
+ * Parses markdown strings using unified/remark-parse and renders them as Ink components.
+ * Supports headings, paragraphs, inline formatting (bold, italic, code), code blocks,
+ * lists (ordered/unordered), and links.
+ */
+import React from 'react';
+interface MarkdownProps {
+    children: string;
+}
+export declare const Markdown: ({ children }: MarkdownProps) => React.ReactElement;
+export {};

package/dist/tui/components/markdown.js

@@ -0,0 +1,88 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import remarkParse from 'remark-parse';
+import { unified } from 'unified';
+import { useTheme } from '../hooks/index.js';
+const renderPhrasingContent = (nodes, theme) => nodes.map((node, index) => {
+    switch (node.type) {
+        case 'break': {
+            return _jsx(Text, { children: '\n' }, index);
+        }
+        case 'emphasis': {
+            return (_jsx(Text, { italic: true, children: renderPhrasingContent(node.children, theme) }, index));
+        }
+        case 'inlineCode': {
+            return (_jsx(Text, { backgroundColor: theme.colors.bg2, children: node.value }, index));
+        }
+        case 'link': {
+            return (_jsx(Text, { color: theme.colors.info, underline: true, children: renderPhrasingContent(node.children, theme) }, index));
+        }
+        case 'strong': {
+            return (_jsx(Text, { bold: true, children: renderPhrasingContent(node.children, theme) }, index));
+        }
+        case 'text': {
+            return _jsx(Text, { children: node.value }, index);
+        }
+        default: {
+            return null;
+        }
+    }
+});
+const renderListItem = (node, context, theme) => {
+    const bullet = context.ordered ? `${context.index + 1}. ` : '• ';
+    const hasNestedList = node.children.some((child) => child.type === 'list');
+    if (hasNestedList) {
+        return (_jsx(Box, { flexDirection: "column", children: node.children.map((child, childIndex) => {
+                if (child.type === 'paragraph') {
+                    return (_jsxs(Box, { children: [_jsx(Text, { children: bullet }), _jsx(Text, { children: renderPhrasingContent(child.children, theme) })] }, childIndex));
+                }
+                if (child.type === 'list') {
+                    return (_jsx(Box, { marginLeft: 2, children: renderList(child, theme) }, childIndex));
+                }
+                return renderNode(child, theme, childIndex);
+            }) }, context.index));
+    }
+    const content = node.children.map((child, childIndex) => {
+        if (child.type === 'paragraph') {
+            return _jsx(Text, { children: renderPhrasingContent(child.children, theme) }, childIndex);
+        }
+        return renderNode(child, theme, childIndex);
+    });
+    return (_jsxs(Box, { children: [_jsx(Text, { children: bullet }), content] }, context.index));
+};
+const renderList = (node, theme) => (_jsx(Box, { flexDirection: "column", children: node.children.map((item, index) => renderListItem(item, { index, ordered: node.ordered ?? false }, theme)) }));
+const renderNode = (node, theme, key) => {
+    switch (node.type) {
+        case 'blockquote': {
+            const blockquote = node;
+            return (_jsx(Box, { marginBottom: 1, children: _jsx(Box, { borderBottom: false, borderLeft: true, borderLeftColor: theme.colors.dimText, borderRight: false, borderStyle: "single", borderTop: false, flexDirection: "column", children: blockquote.children.map((child, index) => renderNode(child, theme, index)) }) }, key));
+        }
+        case 'code': {
+            const code = node;
+            const langLabel = code.lang ? `[${code.lang}]` : '';
+            return (_jsxs(Box, { backgroundColor: theme.colors.bg2, flexDirection: "column", marginY: 1, paddingX: 1, children: [langLabel && _jsx(Text, { color: theme.colors.dimText, children: langLabel }), _jsx(Text, { children: code.value })] }, key));
+        }
+        case 'heading': {
+            const heading = node;
+            return (_jsx(Box, { marginBottom: 1, children: _jsxs(Text, { bold: true, color: theme.colors.primary, children: ['#'.repeat(heading.depth), " ", renderPhrasingContent(heading.children, theme)] }) }, key));
+        }
+        case 'list': {
+            return (_jsx(Box, { marginBottom: 1, children: renderList(node, theme) }, key));
+        }
+        case 'paragraph': {
+            return (_jsx(Box, { children: _jsx(Text, { children: renderPhrasingContent(node.children, theme) }) }, key));
+        }
+        case 'thematicBreak': {
+            return (_jsx(Box, { marginY: 1, children: _jsx(Text, { color: theme.colors.dimText, children: "\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500" }) }, key));
+        }
+        default: {
+            return null;
+        }
+    }
+};
+const renderChildren = (children, theme) => children.map((child, index) => renderNode(child, theme, index));
+export const Markdown = ({ children }) => {
+    const { theme } = useTheme();
+    const tree = unified().use(remarkParse).parse(children);
+    return _jsx(Box, { flexDirection: "column", children: renderChildren(tree.children, theme) });
+};

package/dist/tui/components/message-item.js

@@ -8,5 +8,5 @@ import { Box, Text } from 'ink';
 import { useTheme } from '../hooks/index.js';
 export const MessageItem = ({ message }) => {
     const { theme: { colors } } = useTheme();
-    return (_jsxs(Box, { alignItems: "flex-start", flexDirection: "column", marginBottom: 1, children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Box, { borderBottom: false, borderLeftColor: colors.primary, borderRight: false, borderStyle: "bold", borderTop: false }), _jsx(Text, { children: message.fromCommand })] }), _jsx(Box, { borderColor: colors.border, borderStyle: "single", width: "100%", children: _jsx(Text, { children: message.content }) })] }));
+    return (_jsxs(Box, { alignItems: "flex-start", flexDirection: "column", marginBottom: 1, width: "100%", children: [_jsxs(Box, { flexDirection: "row", gap: 1, children: [_jsx(Box, { borderBottom: false, borderLeftColor: colors.primary, borderRight: false, borderStyle: "bold", borderTop: false }), _jsx(Text, { children: message.fromCommand })] }), _jsx(Box, { borderColor: colors.border, borderStyle: "single", width: "100%", children: _jsx(Text, { children: message.content }) })] }));
 };

package/dist/tui/components/onboarding/onboarding-flow.js

@@ -16,8 +16,8 @@ import { Init } from '../init.js';
 import { CopyablePrompt } from './copyable-prompt.js';
 import { OnboardingStep } from './onboarding-step.js';
 /** Example prompts for curate and query steps */
-const CURATE_PROMPT = 'run `brv curate "Auth uses JWT with 24h expiry. Tokens stored in httpOnly cookies"`';
-const QUERY_PROMPT = 'run `brv query "How is authentication implemented?"`';
+const CURATE_PROMPT = 'Save our API authentication patterns, use brv curate';
+const QUERY_PROMPT = 'How do we handle error responses?, use brv query';
 /** Minimum output lines to show before truncation */
 const MIN_OUTPUT_LINES = 3;
 /** Get step number for display */
@@ -37,11 +37,10 @@ function getStepNumber(step) {
         }
     }
 }
-// eslint-disable-next-line complexity -- React component renders multiple onboarding steps with conditional logic
 export const OnboardingFlow = ({ availableHeight, onInitComplete }) => {
-    const { theme: { colors } } = useTheme();
+    const { theme: { colors }, } = useTheme();
     const { mode } = useMode();
-    const { completeOnboarding, curateAcknowledged, currentStep, hasCurated, hasQueried, queryAcknowledged, setCurateAcknowledged, setQueryAcknowledged, totalSteps, } = useOnboarding();
+    const { completeOnboarding, curateAcknowledged, currentStep, hasCurated, hasQueried, initAcknowledged, isInitialized, queryAcknowledged, setCurateAcknowledged, setInitAcknowledged, setQueryAcknowledged, totalSteps, } = useOnboarding();
     const { logs } = useActivityLogs();
     const { messageItem } = useUIHeights();
     // Find running or queued curate/query logs
@@ -49,8 +48,8 @@ export const OnboardingFlow = ({ availableHeight, onInitComplete }) => {
     const queryLog = useMemo(() => logs.find((log) => log.type === 'query'), [logs]);
     // Onboarding UI overhead: step title (1) + description (1) + content margin top (1)
     const onboardingOverhead = 3;
-    const enterPromptHeight = ((currentStep === 'curate' && hasCurated && !curateAcknowledged) ||
-        (currentStep === 'query' && hasQueried && !queryAcknowledged))
+    const enterPromptHeight = (currentStep === 'curate' && hasCurated && !curateAcknowledged) ||
+        (currentStep === 'query' && hasQueried && !queryAcknowledged)
         ? 4
         : 0;
     const activeLog = currentStep === 'curate' ? curateLog : currentStep === 'query' ? queryLog : null;
@@ -70,6 +69,10 @@ export const OnboardingFlow = ({ availableHeight, onInitComplete }) => {
             completeOnboarding(true); // Pass true to indicate skipped
         }
     }, { isActive: isInWaitingState });
+    const renderInitContent = () => (_jsxs(Box, { flexDirection: "column", gap: 1, width: "100%", children: [_jsx(Init, { active: mode === 'activity' && currentStep === 'init', maxOutputLines: 10, showIdleMessage: false }), isInitialized && !initAcknowledged && (_jsxs(Box, { flexDirection: "column", gap: 1, children: [_jsx(Text, { children: "Project initialized successfully!" }), _jsx(EnterPrompt, { action: "continue", active: isInitialized && !initAcknowledged && mode === 'activity' && currentStep === 'init', onEnter: () => {
+                            setInitAcknowledged(true);
+                            onInitComplete?.();
+                        } })] }))] }));
     // Render curate step content
     const renderCurateContent = () => {
         // Show execution progress if curate is running
@@ -77,7 +80,7 @@ export const OnboardingFlow = ({ availableHeight, onInitComplete }) => {
             return (_jsxs(Box, { flexDirection: "column", width: "100%", children: [_jsx(LogItem, { heights: { ...messageItem, maxContentLines: maxOutputLines }, log: curateLog }), hasCurated && !curateAcknowledged && (_jsx(EnterPrompt, { action: "continue", active: mode === 'activity' && currentStep === 'curate', onEnter: () => setCurateAcknowledged(true) }))] }));
         }
         // Show copyable prompt when waiting
-        return (_jsxs(Box, { backgroundColor: colors.bg2, flexDirection: "column", padding: 1, width: "100%", children: [_jsx(Text, { color: colors.text, wrap: "wrap", children: "Try saying this to your AI Agent:" }), _jsx(Box, { marginBottom: 1, paddingLeft: 4, children: _jsx(Text, { color: colors.primary, wrap: "wrap", children: CURATE_PROMPT }) }), _jsxs(Text, { children: [_jsx(CopyablePrompt, { buttonLabel: '[ctrl+y] to copy', isActive: mode === 'activity' && currentStep === 'curate', textToCopy: CURATE_PROMPT }), _jsx(Text, { color: colors.dimText, children: " | [Esc] to skip onboarding" })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.dimText, children: "Waiting for curate..." }) })] }));
+        return (_jsxs(Box, { backgroundColor: colors.bg2, flexDirection: "column", padding: 1, width: "100%", children: [_jsx(Text, { color: colors.text, wrap: "wrap", children: "Try saying this to your AI Agent:" }), _jsx(Box, { marginBottom: 1, paddingLeft: 4, children: _jsx(Text, { color: colors.primary, wrap: "wrap", children: CURATE_PROMPT }) }), _jsxs(Text, { children: [_jsx(CopyablePrompt, { buttonLabel: "[ctrl+y] to copy", isActive: mode === 'activity' && currentStep === 'curate', textToCopy: CURATE_PROMPT }), _jsx(Text, { color: colors.dimText, children: " | [Esc] to skip onboarding" })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.dimText, children: "Waiting for curate..." }) })] }));
     };
     // Render query step content
     const renderQueryContent = () => {
@@ -86,9 +89,9 @@ export const OnboardingFlow = ({ availableHeight, onInitComplete }) => {
             return (_jsxs(Box, { flexDirection: "column", width: "100%", children: [_jsx(LogItem, { heights: { ...messageItem, maxContentLines: maxOutputLines }, log: queryLog }), hasQueried && !queryAcknowledged && (_jsx(EnterPrompt, { action: "continue", active: mode === 'activity' && currentStep === 'query', onEnter: () => setQueryAcknowledged(true) }))] }));
         }
         // Show copyable prompt when waiting
-        return (_jsxs(Box, { backgroundColor: colors.bg2, flexDirection: "column", padding: 1, width: "100%", children: [_jsx(Text, { color: colors.text, wrap: "wrap", children: "You can now query your memory:" }), _jsx(Box, { marginBottom: 1, paddingLeft: 4, children: _jsx(Text, { color: colors.primary, wrap: "wrap", children: QUERY_PROMPT }) }), _jsxs(Text, { children: [_jsx(CopyablePrompt, { buttonLabel: '[ctrl+y] to copy', isActive: mode === 'activity' && currentStep === 'query', textToCopy: QUERY_PROMPT }), _jsx(Text, { color: colors.dimText, children: " | [Esc] to skip onboarding" })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.dimText, children: "Waiting for query..." }) })] }));
+        return (_jsxs(Box, { backgroundColor: colors.bg2, flexDirection: "column", padding: 1, width: "100%", children: [_jsx(Text, { color: colors.text, wrap: "wrap", children: "You can now query your memory:" }), _jsx(Box, { marginBottom: 1, paddingLeft: 4, children: _jsx(Text, { color: colors.primary, wrap: "wrap", children: QUERY_PROMPT }) }), _jsxs(Text, { children: [_jsx(CopyablePrompt, { buttonLabel: "[ctrl+y] to copy", isActive: mode === 'activity' && currentStep === 'query', textToCopy: QUERY_PROMPT }), _jsx(Text, { color: colors.dimText, children: " | [Esc] to skip onboarding" })] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.dimText, children: "Waiting for query..." }) })] }));
     };
     // Render complete step content
-    const renderCompleteContent = () => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: colors.dimText, wrap: "wrap", children: "Activity logs will appear here as you use brv curate and brv query." }), _jsxs(Box, { flexDirection: "column", marginY: 1, children: [_jsx(Text, { color: colors.dimText, children: "Tips:" }), _jsx(Text, { color: colors.dimText, children: "- Press [Tab] to switch to commands view" }), _jsx(Text, { color: colors.dimText, children: "- Use /push to sync your context to the cloud" }), _jsx(Text, { color: colors.dimText, children: "- Use /gen-rules to generate agent rules" }), _jsx(Text, { color: colors.dimText, children: "- Type / for available commands" })] }), _jsx(EnterPrompt, { action: "finish onboarding", active: mode === 'activity' && currentStep === 'complete', onEnter: completeOnboarding })] }));
-    return (_jsx(Box, { borderColor: colors.border, borderLeft: false, borderRight: false, borderStyle: "single", borderTop: false, flexDirection: "column", height: availableHeight, width: "100%", children: _jsxs(Box, { flexDirection: "column", paddingX: 1, children: [currentStep === 'init' && (_jsx(OnboardingStep, { description: "Let's get your project set up with ByteRover.", stepNumber: getStepNumber('init'), title: "Welcome to ByteRover!", totalSteps: totalSteps, children: _jsx(Init, { active: mode === 'activity' && currentStep === 'init', maxOutputLines: MIN_OUTPUT_LINES, onInitComplete: onInitComplete, showIdleMessage: false }) })), currentStep === 'curate' && (_jsx(OnboardingStep, { description: "Great! Now let's add some context to your knowledge base.", stepNumber: getStepNumber('curate'), title: "Add Your First Context", totalSteps: totalSteps, children: renderCurateContent() })), currentStep === 'query' && (_jsx(OnboardingStep, { description: "Excellent! Your context is saved. Let's query it.", stepNumber: getStepNumber('query'), title: "Query Your Knowledge", totalSteps: totalSteps, children: renderQueryContent() })), currentStep === 'complete' && (_jsx(OnboardingStep, { description: "Your ByteRover workspace is ready!", showStepIndicator: false, stepNumber: totalSteps, title: "You're All Set!", totalSteps: totalSteps, children: renderCompleteContent() }))] }) }));
+    const renderCompleteContent = () => (_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { color: colors.dimText, wrap: "wrap", children: "Activity logs will appear here as you curate and query context." }), _jsxs(Box, { flexDirection: "column", marginY: 1, children: [_jsx(Text, { color: colors.dimText, children: "Tips:" }), _jsx(Text, { color: colors.dimText, children: "- Press [Tab] to switch to commands view" }), _jsx(Text, { color: colors.dimText, children: "- Use /push to sync your context to the cloud" }), _jsx(Text, { color: colors.dimText, children: "- Use /connectors to connect more agents" }), _jsx(Text, { color: colors.dimText, children: "- Type / for available commands" })] }), _jsx(EnterPrompt, { action: "finish onboarding", active: mode === 'activity' && currentStep === 'complete', onEnter: completeOnboarding })] }));
+    return (_jsx(Box, { borderColor: colors.border, borderLeft: false, borderRight: false, borderStyle: "single", borderTop: false, flexDirection: "column", height: availableHeight, width: "100%", children: _jsxs(Box, { flexDirection: "column", paddingX: 1, children: [currentStep === 'init' && (_jsx(OnboardingStep, { description: "Let's get your project set up with ByteRover.", stepNumber: getStepNumber('init'), title: "Welcome to ByteRover!", totalSteps: totalSteps, children: renderInitContent() })), currentStep === 'curate' && (_jsx(OnboardingStep, { description: "Great! Now let's add some context to your knowledge base.", stepNumber: getStepNumber('curate'), title: "Add Your First Context", totalSteps: totalSteps, children: renderCurateContent() })), currentStep === 'query' && (_jsx(OnboardingStep, { description: "Excellent! Your context is saved. Let's query it.", stepNumber: getStepNumber('query'), title: "Query Your Knowledge", totalSteps: totalSteps, children: renderQueryContent() })), currentStep === 'complete' && (_jsx(OnboardingStep, { description: "Your ByteRover workspace is ready!", showStepIndicator: false, stepNumber: totalSteps, title: "You're All Set!", totalSteps: totalSteps, children: renderCompleteContent() }))] }) }));
 };

package/dist/tui/components/onboarding/welcome-box.js

@@ -19,5 +19,5 @@ export const WelcomeBox = ({ isCopyActive }) => {
         const randomIndex = Math.floor(Math.random() * welcomeExamplePrompts.length);
         return welcomeExamplePrompts[randomIndex];
     }, []);
-    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, width: "100%", children: [_jsxs(Box, { children: [_jsx(Text, { color: colors.dimText, children: "@agent" }), _jsx(Spacer, {}), _jsxs(Text, { color: colors.dimText, children: ["[", formatTime(new Date()), "]"] })] }), _jsxs(Box, { borderColor: colors.border, borderStyle: "single", flexDirection: "column", gap: 1, paddingX: 1, children: [_jsx(Text, { bold: true, color: colors.primary, children: "Welcome to ByteRover!" }), _jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Text, { color: colors.text, children: ["Tell your AI Agent what to save or retrieve. Just start your prompt with \"", _jsx(Text, { color: colors.primary, children: "brv" }), "\"."] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.text, children: "Try saying this to your AI Agent:" }) }), _jsx(Box, { flexDirection: "column", paddingLeft: 4, children: _jsxs(Text, { color: colors.text, children: [randomPrompt, '    ', _jsx(CopyablePrompt, { buttonLabel: "[ctrl+y] to copy", isActive: isCopyActive, textToCopy: randomPrompt })] }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.text, dimColor: true, children: "Press [Tab] to switch to Console mode" }) })] })] })] }));
+    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, width: "100%", children: [_jsxs(Box, { children: [_jsx(Text, { color: colors.dimText, children: "@agent" }), _jsx(Spacer, {}), _jsxs(Text, { color: colors.dimText, children: ["[", formatTime(new Date()), "]"] })] }), _jsxs(Box, { borderColor: colors.border, borderStyle: "single", flexDirection: "column", gap: 1, paddingX: 1, children: [_jsx(Text, { bold: true, color: colors.primary, children: "Welcome to ByteRover!" }), _jsxs(Box, { flexDirection: "column", paddingLeft: 2, children: [_jsxs(Text, { color: colors.text, children: ["Tell your AI Agent what to save or retrieve. Just include \"", _jsx(Text, { color: colors.primary, children: "brv" }), "\" in your prompt."] }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.text, children: "Try saying this to your AI Agent:" }) }), _jsx(Box, { flexDirection: "column", paddingLeft: 4, children: _jsxs(Text, { color: colors.text, children: [_jsxs(Text, { bold: true, children: ["\"", randomPrompt, "\""] }), '    ', _jsx(CopyablePrompt, { buttonLabel: "[ctrl+y] to copy", isActive: isCopyActive, textToCopy: randomPrompt })] }) }), _jsx(Box, { marginTop: 1, children: _jsx(Text, { color: colors.text, dimColor: true, children: "Press [Tab] to switch to Console mode" }) })] })] })] }));
 };

package/dist/tui/components/suggestions.js

@@ -13,7 +13,7 @@ import { useMode } from '../contexts/mode-context.js';
 import { useTheme } from '../contexts/theme-context.js';
 import { useSlashCompletion } from '../hooks/index.js';
 import { CommandDetails } from './command-details.js';
-const MAX_VISIBLE_ITEMS = 5;
+const MAX_VISIBLE_ITEMS = 7;
 export const Suggestions = ({ input, onInsert, onSelect }) => {
     const { theme: { colors }, } = useTheme();
     const { mode, setMode } = useMode();
@@ -140,7 +140,7 @@ export const Suggestions = ({ input, onInsert, onSelect }) => {
     // Don't show when user is typing arguments for a known command
     if (suggestions.length === 0) {
         if (isCommandAttempt && !hasMatchedCommand && input.trim().length > 1) {
-            return (_jsx(Box, { borderColor: colors.border, borderStyle: "single", height: 7, paddingX: 1, children: _jsx(Text, { color: colors.dimText, children: "No commands found" }) }));
+            return (_jsx(Box, { borderColor: colors.border, borderStyle: "single", height: 9, paddingX: 1, children: _jsx(Text, { color: colors.dimText, children: "No commands found" }) }));
         }
         return null;
     }
@@ -152,7 +152,7 @@ export const Suggestions = ({ input, onInsert, onSelect }) => {
     // Calculate if there are more items above/below
     const hasMoreAbove = windowStart > 0;
     const hasMoreBelow = windowStart + visibleSuggestions.length < suggestions.length;
-    return (_jsxs(Box, { borderColor: colors.border, borderStyle: "single", columnGap: 1, height: 7, paddingX: 1, children: [_jsxs(Box, { flexDirection: 'column', flexShrink: 0, children: [hasMoreAbove && (_jsxs(Text, { color: colors.dimText, dimColor: true, children: ["\u2191 ", windowStart, " more"] })), visibleSuggestions.map((suggestion, index) => {
+    return (_jsxs(Box, { borderColor: colors.border, borderStyle: "single", columnGap: 1, height: 9, overflowY: 'hidden', paddingX: 1, children: [_jsxs(Box, { flexDirection: 'column', flexShrink: 0, children: [hasMoreAbove && (_jsxs(Text, { color: colors.dimText, dimColor: true, children: ["\u2191 ", windowStart, " more"] })), visibleSuggestions.map((suggestion, index) => {
                         const actualIndex = windowStart + index;
                         const isActive = actualIndex === activeIndex;
                         return (_jsx(Box, { children: _jsxs(Text, { backgroundColor: isActive ? colors.dimText : undefined, color: colors.text, children: [isActive ? '❯ ' : '  ', suggestion.label.padEnd(labelWidth)] }) }, suggestion.value));