import React, { useState } from 'react';
import { Box, Text, useInput } from 'ink';
/**
 * Collapsible block that displays model reasoning/thinking content.
 * Shows a dimmed "Thinking..." header with the reasoning text below.
 * Can be toggled with 't' key when not in streaming mode.
 */
export function ReasoningBlock({ content, isStreaming = false }) {
    const [collapsed, setCollapsed] = useState(false);
    useInput((input) => {
        if (input === 't' && !isStreaming) {
            setCollapsed(prev => !prev);
        }
    });
    const lines = content.split('\n');
    const previewLength = 2;
    const hasMore = lines.length > previewLength;
    return (React.createElement(Box, { flexDirection: "column", marginTop: 1 },
        React.createElement(Box, null,
            React.createElement(Text, { dimColor: true, color: "gray" },
                collapsed ? '▶' : '▼',
                " Thinking",
                isStreaming ? '...' : ` (${lines.length} lines)`),
            !isStreaming && hasMore && (React.createElement(Text, { dimColor: true, color: "gray" },
                " [t to ",
                collapsed ? 'expand' : 'collapse',
                "]"))),
        !collapsed && (React.createElement(Box, { paddingLeft: 2, flexDirection: "column" },
            (collapsed ? [] : lines).map((line, idx) => (React.createElement(Text, { key: idx, dimColor: true, color: "gray" }, line))),
            isStreaming && React.createElement(Text, { dimColor: true, color: "gray" }, "\u2588")))));
}
//# sourceMappingURL=ReasoningBlock.js.map