salmon-loop 0.2.3

package/dist/cli/ui/components/CommandInput.js

@@ -0,0 +1,200 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text, useInput } from 'ink';
+import TextInput from 'ink-text-input';
+import React, { useState } from 'react';
+import { en } from '../../locales/en.js';
+import { rejectAuthorization } from '../authorization/bus.js';
+import { UI_CONFIG } from '../config.js';
+import { useCommandSuggestions } from '../hooks/useCommandSuggestions.js';
+import { useInputHistory } from '../hooks/useInputHistory.js';
+import { rejectSelection, resolveSelection } from '../selection/bus.js';
+import { useUIStore } from '../store/context.js';
+import { CommandSuggestionList } from './CommandSuggestionList.js';
+export const CommandInput = ({ value, onChange, onSubmit, placeholder, getSuggestions, findCommand, }) => {
+    const { state, dispatch } = useUIStore();
+    const { pendingConfirmation } = state;
+    const { pendingAuthorization } = state;
+    const { pendingSelection } = state;
+    const isConfirming = !!pendingConfirmation;
+    const isAuthorizing = !!pendingAuthorization;
+    const isSelecting = !!pendingSelection;
+    const isMultiSelecting = Boolean(pendingSelection?.multiSelect);
+    const isIntercepting = isAuthorizing || isConfirming || isSelecting;
+    const activeChallenge = pendingAuthorization?.challenge || pendingConfirmation?.challenge;
+    const [inputKey, setInputKey] = useState(0);
+    const [selectionIndex, setSelectionIndex] = useState(0);
+    const [selectedItems, setSelectedItems] = useState([]);
+    const suppressNextInputChangeRef = React.useRef(false);
+    React.useEffect(() => {
+        if (pendingSelection) {
+            setSelectionIndex(0);
+            setSelectedItems([]);
+        }
+    }, [pendingSelection?.id]);
+    const { suggestions, selectedIndex, startIndex, isListClosed, setIsListClosed, setSuggestions, setSelectedIndex, setStartIndex, navigateSuggestions, activeCommand, } = useCommandSuggestions(value, getSuggestions, isIntercepting, findCommand);
+    const { navigateHistory, resetHistory } = useInputHistory(value, (val) => {
+        setInputKey((prev) => prev + 1);
+        onChange(val);
+    });
+    // Calculate ghost text for non-intrusive suggestions
+    const getGhostText = () => {
+        if (selectedIndex === -1 || suggestions.length === 0 || isListClosed)
+            return '';
+        const selected = suggestions[selectedIndex].name.trimEnd();
+        const parts = value.split(/\s+/);
+        const lastToken = parts[parts.length - 1];
+        if (selected.toLowerCase().startsWith(lastToken.toLowerCase())) {
+            return selected.slice(lastToken.length);
+        }
+        return '';
+    };
+    const getCompletedValue = (selectedName) => {
+        const parts = value.split(/\s+/);
+        const trimmedName = selectedName.trimEnd();
+        if (value.endsWith(' ')) {
+            return value + trimmedName + ' ';
+        }
+        parts.pop();
+        const prefix = parts.join(' ');
+        return (prefix ? prefix + ' ' : '') + trimmedName + ' ';
+    };
+    const applySelection = (selected, config) => {
+        const nextValue = getCompletedValue(selected.name);
+        if (config.closeList) {
+            setSuggestions([]);
+            setSelectedIndex(-1);
+            setStartIndex(0);
+            setIsListClosed(true);
+        }
+        else {
+            setIsListClosed(false);
+        }
+        setInputKey((prev) => prev + 1);
+        onChange(nextValue);
+    };
+    useInput((input, key) => {
+        if (key.ctrl &&
+            (input === 't' || input === 'T' || input === '\u0014' || key.name === 't')) {
+            suppressNextInputChangeRef.current = true;
+            return;
+        }
+        if (key.escape) {
+            if (!isListClosed && suggestions.length > 0) {
+                setIsListClosed(true);
+            }
+            else if (isSelecting) {
+                rejectSelection();
+            }
+            else if (isAuthorizing) {
+                rejectAuthorization();
+            }
+            else if (isConfirming) {
+                dispatch({ type: 'CLEAR_CONFIRMATION' });
+            }
+            return;
+        }
+        if (isSelecting) {
+            const items = pendingSelection?.items ?? [];
+            if (key.upArrow) {
+                if (items.length > 0) {
+                    setSelectionIndex((prev) => (prev - 1 + items.length) % items.length);
+                }
+                return;
+            }
+            if (key.downArrow) {
+                if (items.length > 0) {
+                    setSelectionIndex((prev) => (prev + 1) % items.length);
+                }
+                return;
+            }
+            if (isMultiSelecting && input === ' ') {
+                const picked = items[selectionIndex]?.id;
+                if (!picked)
+                    return;
+                setSelectedItems((prev) => prev.includes(picked) ? prev.filter((id) => id !== picked) : [...prev, picked]);
+                return;
+            }
+            return;
+        }
+        if (isIntercepting)
+            return;
+        if ((key.rightArrow || key.tab) &&
+            suggestions.length > 0 &&
+            !isListClosed &&
+            selectedIndex !== -1) {
+            applySelection(suggestions[selectedIndex], { closeList: false });
+            return;
+        }
+        if (key.upArrow) {
+            if (!navigateSuggestions('up')) {
+                navigateHistory('up');
+            }
+        }
+        else if (key.downArrow) {
+            if (!navigateSuggestions('down')) {
+                navigateHistory('down');
+            }
+        }
+    });
+    const visibleSuggestions = suggestions.slice(startIndex, startIndex + UI_CONFIG.MAX_SUGGESTIONS);
+    const ghostText = getGhostText();
+    return (_jsxs(Box, { flexDirection: "column", children: [_jsxs(Box, { children: [_jsx(TextInput, { value: isSelecting ? '' : value, focus: true, onChange: (val) => {
+                            if (isSelecting)
+                                return;
+                            if (suppressNextInputChangeRef.current) {
+                                suppressNextInputChangeRef.current = false;
+                                if (val === `${value}t` || val === `${value}T` || val === `${value}\u0014`) {
+                                    return;
+                                }
+                            }
+                            setIsListClosed(false);
+                            resetHistory();
+                            onChange(val);
+                        }, onSubmit: (val) => {
+                            if (isSelecting && pendingSelection) {
+                                const items = pendingSelection.items ?? [];
+                                if (isMultiSelecting) {
+                                    resolveSelection(pendingSelection.id, selectedItems.length > 0 ? selectedItems : []);
+                                }
+                                else {
+                                    const picked = items[selectionIndex]?.id ?? null;
+                                    resolveSelection(pendingSelection.id, picked ? [picked] : []);
+                                }
+                                dispatch({ type: 'SET_INPUT', payload: '' });
+                                return;
+                            }
+                            if (isIntercepting && activeChallenge) {
+                                const trimmed = val.trim();
+                                if (trimmed === activeChallenge || trimmed.startsWith(`${activeChallenge} `)) {
+                                    onSubmit(val);
+                                }
+                                return;
+                            }
+                            if (suggestions.length > 0 && !isListClosed && selectedIndex !== -1) {
+                                applySelection(suggestions[selectedIndex], { closeList: false });
+                                return;
+                            }
+                            resetHistory();
+                            if (val.trim()) {
+                                dispatch({ type: 'APPEND_INPUT', payload: val });
+                            }
+                            onSubmit(val);
+                        }, placeholder: isSelecting
+                            ? isMultiSelecting
+                                ? en.gui.selectionPlaceholderMulti
+                                : en.gui.selectionPlaceholder
+                            : isIntercepting && activeChallenge
+                                ? en.gui.confirmationChallenge(activeChallenge)
+                                : placeholder }, inputKey), ghostText && (_jsx(Text, { color: "gray", dimColor: true, children: ghostText }))] }), isIntercepting && (_jsxs(Box, { flexDirection: "column", borderStyle: "round", borderColor: "yellow", paddingX: 1, children: [_jsx(Text, { color: "yellow", bold: true, children: isSelecting
+                            ? pendingSelection?.title
+                            : isAuthorizing
+                                ? en.gui.authorizationTitle
+                                : en.gui.confirmationTitle }), !isSelecting && (_jsx(Text, { color: "white", children: isAuthorizing ? pendingAuthorization?.message : pendingConfirmation?.message })), _jsx(Text, { color: "gray", dimColor: true, children: isSelecting
+                            ? isMultiSelecting
+                                ? en.gui.selectionHintMulti
+                                : en.gui.selectionHint
+                            : isAuthorizing
+                                ? en.gui.authorizationWarning
+                                : en.gui.highRiskWarning }), isAuthorizing && (_jsx(Text, { color: "gray", dimColor: true, children: en.gui.authorizationHint })), isSelecting && pendingSelection && (_jsx(Box, { flexDirection: "column", marginTop: 1, children: pendingSelection.items.map((item, idx) => (_jsxs(Text, { color: idx === selectionIndex ? 'green' : 'gray', children: [isMultiSelecting && (_jsx(Text, { color: selectedItems.includes(item.id) ? 'green' : 'gray', children: selectedItems.includes(item.id) ? '[x] ' : '[ ] ' })), item.label, item.description ? ` - ${item.description}` : ''] }, item.id))) }))] })), !isIntercepting && suggestions.length > 0 && !isListClosed && (_jsx(CommandSuggestionList, { suggestions: visibleSuggestions, selectedIndex: selectedIndex - startIndex, parentCommand: activeCommand }))] }));
+};
+//# sourceMappingURL=CommandInput.js.map

package/dist/cli/ui/components/CommandSuggestionList.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Text } from 'ink';
+import { COLORS } from '../styles/theme.js';
+export const CommandSuggestionList = ({ suggestions, selectedIndex, parentCommand, }) => {
+    if (suggestions.length === 0)
+        return null;
+    // Header Title Logic
+    let title = 'SLASH COMMANDS';
+    if (parentCommand) {
+        title = `${parentCommand.name} / SUBCOMMANDS`;
+    }
+    // Calculate dynamic column width
+    const maxNameLength = suggestions.reduce((max, s) => Math.max(max, s.name.length), 0);
+    return (_jsxs(Box, { flexDirection: "column", borderStyle: "single", borderColor: COLORS.border.subtle, marginTop: 0, marginBottom: 0, paddingX: 0, width: "100%", children: [_jsx(Box, { flexDirection: "column", paddingY: 0, children: suggestions.map((item, index) => {
+                    const isSelected = index === selectedIndex;
+                    const hasSubcommands = !!item.command?.subcommands?.length;
+                    return (_jsxs(Box, { flexDirection: "row", paddingX: 1, children: [_jsx(Box, { width: 2, children: _jsx(Text, { color: COLORS.semantic.salmon, children: isSelected ? '│ ' : '  ' }) }), _jsx(Box, { width: maxNameLength + 4, children: _jsx(Text, { color: isSelected ? COLORS.semantic.cyan : COLORS.semantic.blue, bold: isSelected, children: item.name }) }), _jsx(Box, { width: 2, marginRight: 1, children: hasSubcommands ? _jsx(Text, { color: COLORS.text.muted, children: " " }) : _jsx(Text, { children: " " }) }), _jsx(Box, { flexGrow: 1, children: _jsx(Text, { color: isSelected ? COLORS.text.primary : COLORS.text.muted, wrap: "truncate", children: item.description }) })] }, `${item.name}-${index}`));
+                }) }), suggestions[selectedIndex]?.command?.usage && (_jsxs(Box, { flexDirection: "row", borderStyle: "single", borderTop: true, borderLeft: false, borderRight: false, borderBottom: false, borderColor: COLORS.border.subtle, paddingX: 1, paddingY: 0, children: [_jsx(Text, { color: COLORS.semantic.blue, children: "TIP: " }), _jsx(Text, { color: COLORS.text.muted, children: "Usage: " }), _jsx(Text, { color: COLORS.text.primary, children: suggestions[selectedIndex].command?.usage })] })), _jsxs(Box, { flexDirection: "row", borderStyle: "single", borderTop: true, borderLeft: false, borderRight: false, borderBottom: false, borderColor: COLORS.border.subtle, paddingX: 1, paddingY: 0, justifyContent: "space-between", children: [_jsxs(Box, { children: [_jsx(Text, { color: COLORS.semantic.salmon, children: "\u2502 " }), _jsx(Text, { color: COLORS.semantic.blue, bold: true, children: title })] }), _jsx(Box, { children: _jsx(Text, { color: COLORS.text.muted, dimColor: true, children: "\u2191\u2193 nav \u00B7 \u23CE select \u00B7 esc close" }) })] })] }));
+};
+//# sourceMappingURL=CommandSuggestionList.js.map

package/dist/cli/ui/components/Markdown.js

@@ -0,0 +1,423 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// 1. MUST be at the very top to force all chalk instances to use color before any imports.
+process.env.FORCE_COLOR = '3';
+import chalk from 'chalk';
+import { Text } from 'ink';
+import { Marked } from 'marked';
+import TerminalRendererOriginal from 'marked-terminal';
+import { useMemo } from 'react';
+import { DEFAULT_MARKDOWN_RENDER_MODE, DEFAULT_MARKDOWN_THEME, } from '../../../core/config/types.js';
+import { COLORS } from '../styles/theme.js';
+if (chalk.level < 3) {
+    chalk.level = 3;
+}
+const CODE_WRAP_SAFETY_MARGIN = 2;
+const THEME_OVERRIDES = {
+    vivid: {
+        heading: chalk.green.bold,
+        firstHeading: chalk.magenta.underline.bold,
+        strong: chalk.yellowBright.bold,
+        em: chalk.cyan.italic,
+        codespan: chalk.yellowBright,
+        code: chalk.yellowBright,
+        link: chalk.blueBright,
+        href: chalk.blueBright.underline,
+        listitem: chalk.hex(COLORS.text.primary),
+        blockquote: chalk.gray.italic,
+        html: chalk.gray,
+        table: chalk.hex(COLORS.text.primary),
+    },
+    default: {
+        heading: chalk.green.bold,
+        firstHeading: chalk.magenta.underline.bold,
+        strong: chalk.bold,
+        em: chalk.italic,
+        codespan: chalk.yellow,
+        code: chalk.yellow,
+        link: chalk.blue,
+        href: chalk.blue.underline,
+        listitem: chalk.hex(COLORS.text.primary),
+        blockquote: chalk.gray.italic,
+        html: chalk.gray,
+        table: chalk.hex(COLORS.text.primary),
+    },
+};
+export function __applyMarkedTerminalTaskListCompat(m) {
+    // marked@17 emits explicit `checkbox` tokens for task lists.
+    // marked-terminal also injects checkboxes for task list items, which can cause duplicates
+    // (e.g. "[x] [x] Task") if we render checkbox tokens as-is.
+    m.use({
+        walkTokens(token) {
+            if (!token || token.type !== 'list_item' || token.task !== true)
+                return;
+            if (!Array.isArray(token.tokens) || token.tokens.length === 0)
+                return;
+            token.tokens = token.tokens.filter((t) => t?.type !== 'checkbox');
+        },
+    });
+}
+export const Markdown = ({ children, theme = DEFAULT_MARKDOWN_THEME, mode = DEFAULT_MARKDOWN_RENDER_MODE, }) => {
+    const parser = useMemo(() => {
+        const m = new Marked();
+        const RendererClass = TerminalRendererOriginal.TerminalRenderer || TerminalRendererOriginal;
+        const rendererInstance = new RendererClass({
+            showSectionPrefix: false,
+            unescape: true,
+            color: true,
+            width: process.stdout.columns || 80,
+            ...(THEME_OVERRIDES[theme] ?? THEME_OVERRIDES.default),
+        });
+        __applyMarkedTerminalTaskListCompat(m);
+        if (mode === 'native') {
+            m.use({ renderer: rendererInstance });
+            return m;
+        }
+        const originalListitem = rendererInstance.listitem.bind(rendererInstance);
+        rendererInstance.listitem = function (token) {
+            if (isTightListItemWithCode(token)) {
+                const previous = rendererInstance.__inTightListItem;
+                rendererInstance.__inTightListItem = true;
+                try {
+                    return originalListitem(token);
+                }
+                finally {
+                    rendererInstance.__inTightListItem = previous;
+                }
+            }
+            return originalListitem(token);
+        };
+        const standardHooks = [
+            'blockquote',
+            'br',
+            'checkbox',
+            'code',
+            'codespan',
+            'del',
+            'em',
+            'heading',
+            'hr',
+            'html',
+            'image',
+            'link',
+            'list',
+            'listitem',
+            'paragraph',
+            'strong',
+            'table',
+            'tablecell',
+            'tablerow',
+            'text',
+        ];
+        const renderCodeWithLineNumbers = function (token, infostring, escaped) {
+            rendererInstance.options = this.options;
+            rendererInstance.parser = this.parser;
+            let codeText = '';
+            let codeToken;
+            if (token && typeof token === 'object') {
+                codeText = String(token.text ?? '');
+                const normalizedCodeText = normalizeCodeBlockForDisplay(codeText);
+                codeToken = {
+                    text: normalizedCodeText,
+                    lang: token.lang ?? infostring,
+                    escaped: Boolean(token.escaped ?? escaped),
+                };
+                codeText = normalizedCodeText;
+            }
+            else {
+                codeText = String(token ?? '');
+                const normalizedCodeText = normalizeCodeBlockForDisplay(codeText);
+                codeToken = {
+                    text: normalizedCodeText,
+                    lang: infostring,
+                    escaped: Boolean(escaped),
+                };
+                codeText = normalizedCodeText;
+            }
+            const logicalLines = codeText.endsWith('\n')
+                ? codeText.slice(0, -1).split('\n')
+                : codeText.split('\n');
+            const lineCount = Math.max(logicalLines.length, 1);
+            const numberWidth = String(lineCount).length;
+            const availableWidth = resolveRendererWidth(this.options, rendererInstance.options);
+            const maxContentWidth = Math.max(8, availableWidth - (numberWidth + 3) - CODE_WRAP_SAFETY_MARGIN);
+            const wrapped = wrapLogicalCodeLines(logicalLines, maxContentWidth);
+            codeToken.text = wrapped.lines.join('\n');
+            const base = String(rendererInstance.code(codeToken));
+            const { lines: baseLines, suffix } = splitRenderedCodeLines(base);
+            const normalizedBaseLines = removeRenderedCommonIndent(baseLines);
+            let visualLineIndex = 0;
+            let logicalLineIndex = 0;
+            const continuationPrefix = `${' '.repeat(numberWidth)}${chalk.gray(' | ')}`;
+            const numbered = normalizedBaseLines.map((line) => {
+                if (visualLineIndex >= wrapped.firstChunkFlags.length)
+                    return line;
+                const isFirstChunk = wrapped.firstChunkFlags[visualLineIndex];
+                visualLineIndex += 1;
+                if (!isFirstChunk) {
+                    return `${continuationPrefix}${line}`;
+                }
+                const number = String(logicalLineIndex + 1).padStart(numberWidth, ' ');
+                logicalLineIndex += 1;
+                return `${chalk.gray(number)}${chalk.gray(' | ')}${line}`;
+            });
+            const numberedBlock = `${numbered.join('\n')}${suffix}`;
+            if (rendererInstance.__inTightListItem &&
+                numberedBlock.length > 0 &&
+                !numberedBlock.startsWith('\n')) {
+                return `\n${numberedBlock}`;
+            }
+            return numberedBlock;
+        };
+        const cleanRenderer = Object.create(null);
+        for (const hook of standardHooks) {
+            if (typeof rendererInstance[hook] !== 'function')
+                continue;
+            if (hook === 'code') {
+                cleanRenderer.code = renderCodeWithLineNumbers;
+                continue;
+            }
+            if (hook === 'text') {
+                cleanRenderer.text = function (token) {
+                    rendererInstance.options = this.options;
+                    rendererInstance.parser = this.parser;
+                    if (token && typeof token === 'object' && Array.isArray(token.tokens)) {
+                        return this.parser.parseInline(token.tokens);
+                    }
+                    return rendererInstance.text(token);
+                };
+                continue;
+            }
+            cleanRenderer[hook] = function (...args) {
+                rendererInstance.options = this.options;
+                rendererInstance.parser = this.parser;
+                return rendererInstance[hook](...args);
+            };
+        }
+        m.use({ renderer: cleanRenderer });
+        return m;
+    }, [mode, theme]);
+    const content = useMemo(() => {
+        try {
+            if (!children)
+                return '';
+            if (mode === 'native') {
+                const result = parser.parse(children);
+                return typeof result === 'string' ? result.trimEnd() : String(result).trimEnd();
+            }
+            const preparedChildren = prepareMarkdownInput(children);
+            if (!preparedChildren)
+                return '';
+            const result = parser.parse(preparedChildren);
+            const rendered = typeof result === 'string' ? result : String(result);
+            return compactRenderedSpacing(rendered).trimEnd();
+        }
+        catch (_error) {
+            return children;
+        }
+    }, [children, mode, parser]);
+    return _jsx(Text, { children: content });
+};
+function prepareMarkdownInput(content) {
+    const lines = trimOuterEmptyLines(content.split('\n'));
+    if (lines.length === 0)
+        return '';
+    const minIndent = lines.reduce((min, line) => {
+        if (!line.trim())
+            return min;
+        const match = line.match(/^[ \t]*/);
+        const indent = match ? match[0].replace(/\t/g, '    ').length : 0;
+        return Math.min(min, indent);
+    }, Infinity);
+    if (minIndent === Infinity || minIndent <= 0) {
+        return lines.join('\n');
+    }
+    return lines.map((line) => removeIndent(line, minIndent)).join('\n');
+}
+function trimOuterEmptyLines(lines) {
+    let first = -1;
+    let last = -1;
+    for (let i = 0; i < lines.length; i += 1) {
+        if (lines[i].trim().length === 0)
+            continue;
+        if (first === -1)
+            first = i;
+        last = i;
+    }
+    if (first === -1)
+        return [];
+    return lines.slice(first, last + 1);
+}
+function removeIndent(line, amount) {
+    let index = 0;
+    let width = 0;
+    while (index < line.length && width < amount) {
+        const ch = line[index];
+        if (ch === ' ') {
+            width += 1;
+            index += 1;
+            continue;
+        }
+        if (ch === '\t') {
+            width += 4;
+            index += 1;
+            continue;
+        }
+        break;
+    }
+    return line.slice(index);
+}
+function normalizeCodeBlockForDisplay(code) {
+    const lines = code.split('\n');
+    const minIndent = lines.reduce((min, line) => {
+        if (!line.trim())
+            return min;
+        const match = line.match(/^[ \t]*/);
+        const indent = match ? match[0].replace(/\t/g, '    ').length : 0;
+        return Math.min(min, indent);
+    }, Infinity);
+    if (minIndent === Infinity || minIndent <= 0) {
+        return code;
+    }
+    return lines.map((line) => removeIndent(line, minIndent)).join('\n');
+}
+function isTightListItemWithCode(token) {
+    if (!token || typeof token !== 'object')
+        return false;
+    if (token.loose)
+        return false;
+    if (!Array.isArray(token.tokens))
+        return false;
+    return token.tokens.some((item) => item && item.type === 'code');
+}
+function splitRenderedCodeLines(code) {
+    const suffixMatch = code.match(/\n+$/);
+    const suffix = suffixMatch ? suffixMatch[0] : '';
+    const body = suffix.length > 0 ? code.slice(0, -suffix.length) : code;
+    if (!body)
+        return { lines: [''], suffix };
+    return { lines: body.split('\n'), suffix };
+}
+function removeRenderedCommonIndent(lines) {
+    const minIndent = lines.reduce((min, line) => {
+        if (!line.trim())
+            return min;
+        const match = line.match(/^[ \t]*/);
+        const indent = match ? match[0].replace(/\t/g, '    ').length : 0;
+        return Math.min(min, indent);
+    }, Infinity);
+    if (minIndent === Infinity || minIndent <= 0)
+        return lines;
+    return lines.map((line) => removeIndent(line, minIndent));
+}
+function resolveRendererWidth(markedOptions, rendererOptions) {
+    const markedWidth = markedOptions?.width;
+    if (typeof markedWidth === 'number' && Number.isFinite(markedWidth) && markedWidth > 0) {
+        return markedWidth;
+    }
+    const rendererWidth = rendererOptions?.width;
+    if (typeof rendererWidth === 'number' && Number.isFinite(rendererWidth) && rendererWidth > 0) {
+        return rendererWidth;
+    }
+    return process.stdout.columns || 80;
+}
+function wrapLogicalCodeLines(logicalLines, maxContentWidth) {
+    const lines = [];
+    const firstChunkFlags = [];
+    for (const logicalLine of logicalLines) {
+        const chunks = wrapPlainCodeLine(logicalLine, maxContentWidth);
+        for (let index = 0; index < chunks.length; index += 1) {
+            lines.push(chunks[index]);
+            firstChunkFlags.push(index === 0);
+        }
+    }
+    return { lines, firstChunkFlags };
+}
+function wrapPlainCodeLine(line, maxContentWidth) {
+    if (maxContentWidth <= 0)
+        return [line];
+    if (line.length === 0 || getDisplayWidth(line) <= maxContentWidth)
+        return [line];
+    const chunks = [];
+    let current = '';
+    let currentWidth = 0;
+    for (const ch of line) {
+        const width = getCharacterDisplayWidth(ch);
+        if (currentWidth + width > maxContentWidth && current.length > 0) {
+            chunks.push(current);
+            current = '';
+            currentWidth = 0;
+        }
+        current += ch;
+        currentWidth += width;
+    }
+    if (current.length > 0 || chunks.length === 0) {
+        chunks.push(current);
+    }
+    return chunks;
+}
+function getDisplayWidth(input) {
+    let width = 0;
+    for (const ch of input) {
+        width += getCharacterDisplayWidth(ch);
+    }
+    return width;
+}
+function getCharacterDisplayWidth(ch) {
+    if (ch === '\t')
+        return 4;
+    const codePoint = ch.codePointAt(0);
+    if (codePoint === undefined)
+        return 0;
+    if (isZeroWidthCodePoint(codePoint))
+        return 0;
+    if (isFullWidthCodePoint(codePoint))
+        return 2;
+    return 1;
+}
+function isZeroWidthCodePoint(codePoint) {
+    return ((codePoint >= 0x0000 && codePoint <= 0x001f) ||
+        (codePoint >= 0x007f && codePoint <= 0x009f) ||
+        (codePoint >= 0x0300 && codePoint <= 0x036f) ||
+        (codePoint >= 0x200b && codePoint <= 0x200f) ||
+        (codePoint >= 0x202a && codePoint <= 0x202e) ||
+        (codePoint >= 0x2060 && codePoint <= 0x206f) ||
+        codePoint === 0xfeff);
+}
+function isFullWidthCodePoint(codePoint) {
+    if (codePoint < 0x1100)
+        return false;
+    return (codePoint <= 0x115f ||
+        codePoint === 0x2329 ||
+        codePoint === 0x232a ||
+        (codePoint >= 0x2e80 && codePoint <= 0x3247 && codePoint !== 0x303f) ||
+        (codePoint >= 0x3250 && codePoint <= 0x4dbf) ||
+        (codePoint >= 0x4e00 && codePoint <= 0xa4c6) ||
+        (codePoint >= 0xa960 && codePoint <= 0xa97c) ||
+        (codePoint >= 0xac00 && codePoint <= 0xd7a3) ||
+        (codePoint >= 0xf900 && codePoint <= 0xfaff) ||
+        (codePoint >= 0xfe10 && codePoint <= 0xfe19) ||
+        (codePoint >= 0xfe30 && codePoint <= 0xfe6b) ||
+        (codePoint >= 0xff01 && codePoint <= 0xff60) ||
+        (codePoint >= 0xffe0 && codePoint <= 0xffe6) ||
+        (codePoint >= 0x1b000 && codePoint <= 0x1b001) ||
+        (codePoint >= 0x1f200 && codePoint <= 0x1f251) ||
+        (codePoint >= 0x20000 && codePoint <= 0x3fffd));
+}
+function compactRenderedSpacing(content) {
+    let output = '';
+    let newlineCount = 0;
+    for (let index = 0; index < content.length; index += 1) {
+        const ch = content[index];
+        if (ch === '\n') {
+            newlineCount += 1;
+            if (newlineCount <= 2) {
+                output += ch;
+            }
+            continue;
+        }
+        newlineCount = 0;
+        output += ch;
+    }
+    return output;
+}
+//# sourceMappingURL=Markdown.js.map

package/dist/cli/ui/components/MessageList.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Box, Static } from 'ink';
+import React from 'react';
+import { UI_CONFIG } from '../config.js';
+import { useUIStore } from '../store/context.js';
+import { MessageItem } from './messageList/MessageItem.js';
+import { computeContainerWidth, computeSeparatorLine, computeStreamingMaxLines, } from './messageList/messageListLayout.js';
+import { QueuePreviewList } from './messageList/QueuePreviewList.js';
+export const MessageList = ({ markdownTheme, markdownRenderMode }) => {
+    const { state } = useUIStore();
+    const { completedMessages, activeStreamingMessage, queueMessages } = state;
+    const streamingMaxLines = React.useMemo(() => computeStreamingMaxLines({ terminalHeight: state.terminalHeight, logMode: state.logMode }), [state.terminalHeight, state.logMode]);
+    const containerWidth = React.useMemo(() => computeContainerWidth(state.terminalWidth), [state.terminalWidth]);
+    const separatorLine = React.useMemo(() => computeSeparatorLine(containerWidth), [containerWidth]);
+    const ctx = React.useMemo(() => ({
+        markdownTheme,
+        markdownRenderMode,
+        containerWidth,
+        separatorLine,
+        streamingMaxLines,
+        logView: state.logView,
+        logMode: state.logMode,
+    }), [
+        markdownTheme,
+        markdownRenderMode,
+        containerWidth,
+        separatorLine,
+        streamingMaxLines,
+        state.logView,
+        state.logMode,
+    ]);
+    return (_jsxs(Box, { flexDirection: "column", flexGrow: 1, width: containerWidth, children: [_jsx(Static, { items: completedMessages, children: (msg, index) => (_jsx(Box, { paddingLeft: UI_CONFIG.MESSAGE_AREA_PADDING_X, children: _jsx(MessageItem, { msg: msg, nextMsg: completedMessages[index + 1], ctx: ctx }) }, msg.id)) }), activeStreamingMessage && (_jsx(MessageItem, { msg: activeStreamingMessage, ctx: ctx }, activeStreamingMessage.id)), _jsx(QueuePreviewList, { queueMessages: queueMessages })] }));
+};
+//# sourceMappingURL=MessageList.js.map