@elench/shell 0.1.26 → 0.1.27

package/dist/codex/transcript-react.js

@@ -1,669 +1,7 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import Anser from "anser";
-import { ArrowDownIcon, BotIcon, CircleIcon, ClockIcon, GitBranchIcon, MessageSquareIcon, PencilIcon, PinIcon, PinOffIcon, RefreshCcwIcon, SendIcon, TerminalIcon, } from "lucide-react";
-import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, } from "react";
-import ReactMarkdown from "react-markdown";
-import remarkGfm from "remark-gfm";
-import { EmptyState } from "../components/system/async-state.js";
-import { StatusDot } from "../components/system/status.js";
-import { Button } from "../components/ui/button.js";
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuTrigger, } from "../components/ui/context-menu.js";
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, } from "../components/ui/dialog.js";
-import { Input } from "../components/ui/input.js";
-import { SimpleSelect } from "../components/ui/select.js";
-import { Textarea } from "../components/ui/textarea.js";
-import { SidebarActionRow } from "../components/shell/primitives/sidebar-action-row.js";
-import { SidebarSection } from "../components/shell/primitives/sidebar-section.js";
-import { InspectorItem, InspectorItemHeader, InspectorItemValue, } from "../components/shell/primitives/inspector-panel.js";
-import { cn } from "../lib/utils.js";
-import { useCodexAppServer, useCodexThreadSession } from "./react.js";
-import { codexInputText, codexThreadDescription, codexThreadSourceKind, codexThreadTitle, countFileUpdateChanges, DEFAULT_CODEX_TRANSCRIPT_RENDER_SETTINGS, formatNumber, formatTokenUsageBreakdown, languageForPath, mergeCodexTranscriptSettings, parseCodexUnifiedDiff, summarizeCodexThread, toCodexTranscriptEntries, tokenUsagePercent, } from "./transcript.js";
-const codexTurnControlStores = new Map();
-const CODEX_THREAD_SCROLL_BOTTOM_THRESHOLD = 48;
-const CODEX_THREAD_SIDEBAR_STORAGE_KEY = "elench-shell:codex-thread-sidebar:v1";
-const DEFAULT_CODEX_THREAD_SIDEBAR_PREFERENCES = {
-    pinnedThreadIds: [],
-};
-function readCodexThreadSidebarPreferences() {
-    if (typeof window === "undefined") {
-        return DEFAULT_CODEX_THREAD_SIDEBAR_PREFERENCES;
-    }
-    try {
-        const raw = window.localStorage.getItem(CODEX_THREAD_SIDEBAR_STORAGE_KEY);
-        if (!raw)
-            return DEFAULT_CODEX_THREAD_SIDEBAR_PREFERENCES;
-        const parsed = JSON.parse(raw);
-        return {
-            pinnedThreadIds: Array.isArray(parsed.pinnedThreadIds)
-                ? parsed.pinnedThreadIds.filter((threadId) => typeof threadId === "string")
-                : [],
-        };
-    }
-    catch {
-        return DEFAULT_CODEX_THREAD_SIDEBAR_PREFERENCES;
-    }
-}
-function writeCodexThreadSidebarPreferences(preferences) {
-    if (typeof window === "undefined")
-        return;
-    try {
-        window.localStorage.setItem(CODEX_THREAD_SIDEBAR_STORAGE_KEY, JSON.stringify(preferences));
-    }
-    catch {
-        // Ignore storage failures; pinning is a local UI preference.
-    }
-}
-function useCodexThreadSidebarPreferences() {
-    const [preferences, setPreferences] = useState(() => readCodexThreadSidebarPreferences());
-    useEffect(() => {
-        if (typeof window === "undefined")
-            return;
-        const handleStorage = (event) => {
-            if (event.key === CODEX_THREAD_SIDEBAR_STORAGE_KEY) {
-                setPreferences(readCodexThreadSidebarPreferences());
-            }
-        };
-        window.addEventListener("storage", handleStorage);
-        return () => window.removeEventListener("storage", handleStorage);
-    }, []);
-    const setPinned = useCallback((threadId, pinned) => {
-        setPreferences((current) => {
-            const pinnedThreadIds = new Set(current.pinnedThreadIds);
-            if (pinned) {
-                pinnedThreadIds.add(threadId);
-            }
-            else {
-                pinnedThreadIds.delete(threadId);
-            }
-            const next = { pinnedThreadIds: [...pinnedThreadIds] };
-            writeCodexThreadSidebarPreferences(next);
-            return next;
-        });
-    }, []);
-    return { preferences, setPinned };
-}
-function distanceFromScrollBottom(element) {
-    return Math.max(0, element.scrollHeight - element.scrollTop - element.clientHeight);
-}
-function scrollElementToBottom(element) {
-    element.scrollTop = Math.max(0, element.scrollHeight - element.clientHeight);
-}
-function codexTurnControlKey(session) {
-    if (session?.threadId)
-        return `thread:${session.threadId}`;
-    const cwd = session?.turn?.cwd ?? session?.startThread?.cwd ?? "";
-    return `new:${cwd}`;
-}
-function codexTurnControlBaseSignature(session) {
-    return JSON.stringify(session?.turn ?? {});
-}
-function mergeTurnControlBase(base, value) {
-    const next = {
-        ...base,
-        ...value,
-    };
-    if ("cwd" in base) {
-        next.cwd = base.cwd;
-    }
-    return next;
-}
-function ensureCodexTurnControlStore(key, base) {
-    let store = codexTurnControlStores.get(key);
-    if (!store) {
-        store = {
-            listeners: new Set(),
-            value: { ...base },
-        };
-        codexTurnControlStores.set(key, store);
-        return store;
-    }
-    store.value = mergeTurnControlBase(base, store.value);
-    return store;
-}
-function setCodexTurnControlStoreValue(key, value) {
-    const store = ensureCodexTurnControlStore(key, {});
-    store.value = value;
-    for (const listener of store.listeners) {
-        listener(store.value);
-    }
-}
-function useCodexTurnControlState(session) {
-    const key = codexTurnControlKey(session);
-    const baseSignature = codexTurnControlBaseSignature(session);
-    const base = useMemo(() => JSON.parse(baseSignature), [baseSignature]);
-    const [value, setValue] = useState(() => ensureCodexTurnControlStore(key, base).value);
-    useEffect(() => {
-        const store = ensureCodexTurnControlStore(key, base);
-        setValue(store.value);
-        store.listeners.add(setValue);
-        return () => {
-            store.listeners.delete(setValue);
-        };
-    }, [baseSignature, key]);
-    const update = useCallback((nextValue) => {
-        setCodexTurnControlStoreValue(key, mergeTurnControlBase(base, nextValue));
-    }, [base, key]);
-    return [value, update];
-}
-function useCodexThreadScrollFollow({ scrollRef, contentRef, threadKey, }) {
-    const followingRef = useRef(true);
-    const lastScrollHeightRef = useRef(0);
-    const lastThreadKeyRef = useRef(null);
-    const [hasNewOutput, setHasNewOutput] = useState(false);
-    const followLatest = useCallback(() => {
-        const element = scrollRef.current;
-        if (!element)
-            return;
-        scrollElementToBottom(element);
-        followingRef.current = true;
-        lastScrollHeightRef.current = element.scrollHeight;
-        setHasNewOutput(false);
-    }, [scrollRef]);
-    const handleScroll = useCallback(() => {
-        const element = scrollRef.current;
-        if (!element)
-            return;
-        const isAtBottom = distanceFromScrollBottom(element) <= CODEX_THREAD_SCROLL_BOTTOM_THRESHOLD;
-        followingRef.current = isAtBottom;
-        if (isAtBottom)
-            setHasNewOutput(false);
-        lastScrollHeightRef.current = element.scrollHeight;
-    }, [scrollRef]);
-    useLayoutEffect(() => {
-        const element = scrollRef.current;
-        if (!element)
-            return;
-        const threadChanged = threadKey !== lastThreadKeyRef.current;
-        if (threadChanged) {
-            lastThreadKeyRef.current = threadKey;
-            followingRef.current = true;
-            scrollElementToBottom(element);
-            lastScrollHeightRef.current = element.scrollHeight;
-            setHasNewOutput(false);
-            return;
-        }
-        const contentGrew = element.scrollHeight > lastScrollHeightRef.current;
-        if (followingRef.current) {
-            scrollElementToBottom(element);
-            setHasNewOutput(false);
-        }
-        else if (contentGrew) {
-            setHasNewOutput(true);
-        }
-        lastScrollHeightRef.current = element.scrollHeight;
-    });
-    useEffect(() => {
-        const contentElement = contentRef.current;
-        const scrollElement = scrollRef.current;
-        if (!contentElement ||
-            !scrollElement ||
-            typeof ResizeObserver === "undefined") {
-            return;
-        }
-        const observer = new ResizeObserver(() => {
-            if (followingRef.current) {
-                scrollElementToBottom(scrollElement);
-                lastScrollHeightRef.current = scrollElement.scrollHeight;
-                setHasNewOutput(false);
-            }
-            else if (scrollElement.scrollHeight > lastScrollHeightRef.current) {
-                lastScrollHeightRef.current = scrollElement.scrollHeight;
-                setHasNewOutput(true);
-            }
-        });
-        observer.observe(contentElement);
-        return () => observer.disconnect();
-    }, [contentRef, scrollRef, threadKey]);
-    return {
-        followLatest,
-        handleScroll,
-        hasNewOutput,
-        isFollowing: followingRef.current,
-    };
-}
-export function CodexThreadWorkspace({ className, defaultMessage = "", emptyDescription = "Send a message to start the Codex thread.", emptyTitle = "No Codex output yet", onThreadChange, placeholder = "Message Codex", settings, session, }) {
-    const [turnControls] = useCodexTurnControlState(session);
-    const resolvedSession = useMemo(() => ({
-        ...session,
-        onThreadChange,
-        turn: {
-            ...session?.turn,
-            ...turnControls,
-        },
-    }), [onThreadChange, session, turnControls]);
-    const { error, isPending, sendText, snapshot } = useCodexThreadSession(resolvedSession);
-    const scrollRef = useRef(null);
-    const transcriptContentRef = useRef(null);
-    const threadKey = snapshot?.thread?.id ?? session?.threadId ?? null;
-    const threadScroll = useCodexThreadScrollFollow({
-        contentRef: transcriptContentRef,
-        scrollRef,
-        threadKey,
-    });
-    return (_jsxs("div", { className: cn("flex h-full min-h-0 flex-col overflow-hidden", className), "data-codex-thread-workspace": true, children: [_jsxs("div", { className: "relative min-h-0 min-w-0 flex-1", children: [_jsx("div", { className: "h-full min-h-0 min-w-0 overflow-x-hidden overflow-y-auto px-6 py-5", "data-codex-thread-following": threadScroll.isFollowing ? "true" : "false", "data-codex-thread-new-output": threadScroll.hasNewOutput ? "true" : undefined, "data-codex-thread-scroll": true, onScroll: threadScroll.handleScroll, ref: scrollRef, children: _jsx("div", { ref: transcriptContentRef, children: _jsx(CodexThreadTranscript, { emptyDescription: emptyDescription, emptyTitle: emptyTitle, settings: settings, snapshot: snapshot }) }) }), threadScroll.hasNewOutput ? (_jsxs(Button, { "aria-label": "Jump to latest Codex output", className: "absolute right-5 bottom-4 shadow-sm", onClick: threadScroll.followLatest, size: "sm", type: "button", variant: "outline", children: [_jsx(ArrowDownIcon, {}), "Latest"] })) : null] }), _jsxs("div", { className: "shrink-0 border-t border-border bg-bg-surface px-4 py-3", "data-codex-thread-composer": true, children: [error ? (_jsx("div", { className: "mb-3 rounded-md border border-destructive/30 bg-destructive/8 px-3 py-2 text-[12px] text-fg", children: error.message })) : null, _jsx(CodexThreadComposer, { defaultMessage: defaultMessage, disabled: isPending, onSubmit: sendText, placeholder: placeholder })] })] }));
-}
-const CODEX_REASONING_EFFORT_OPTIONS = [
-    { label: "Configured default", value: "__default" },
-    { label: "None", value: "none" },
-    { label: "Minimal", value: "minimal" },
-    { label: "Low", value: "low" },
-    { label: "Medium", value: "medium" },
-    { label: "High", value: "high" },
-    { label: "XHigh", value: "xhigh" },
-];
-const CODEX_APPROVAL_OPTIONS = [
-    { label: "Configured default", value: "__default" },
-    { label: "On request", value: "on-request" },
-    { label: "On failure", value: "on-failure" },
-    { label: "Untrusted", value: "untrusted" },
-    { label: "Never", value: "never" },
-];
-const CODEX_REASONING_SUMMARY_OPTIONS = [
-    { label: "Configured default", value: "__default" },
-    { label: "Auto", value: "auto" },
-    { label: "Concise", value: "concise" },
-    { label: "Detailed", value: "detailed" },
-    { label: "None", value: "none" },
-];
-function useCodexModelOptions() {
-    const { client, initialized } = useCodexAppServer();
-    const [models, setModels] = useState([]);
-    useEffect(() => {
-        if (!client || !initialized)
-            return;
-        let active = true;
-        client
-            .listModels({ limit: 80 })
-            .then((response) => {
-            if (!active)
-                return;
-            setModels(response.data.map((model) => ({
-                label: model.displayName,
-                value: model.id,
-            })));
-        })
-            .catch(() => {
-            if (active)
-                setModels([]);
-        });
-        return () => {
-            active = false;
-        };
-    }, [client, initialized]);
-    return [{ label: "Configured default", value: "__default" }, ...models];
-}
-function useCodexTurnControlSetter(onChange, value) {
-    const set = (key, nextValue) => {
-        onChange({
-            ...value,
-            [key]: nextValue,
-        });
-    };
-    return set;
-}
-export function CodexTurnControls({ onChange, value }) {
-    const modelOptions = useCodexModelOptions();
-    const set = useCodexTurnControlSetter(onChange, value);
-    return (_jsxs("div", { className: "grid gap-2", children: [_jsx(ControlLabel, { label: "Model", children: _jsx(SimpleSelect, { onValueChange: (model) => set("model", model === "__default" ? null : model), options: modelOptions, value: value.model ?? "__default" }) }), _jsx(ControlLabel, { label: "Effort", children: _jsx(SimpleSelect, { onValueChange: (effort) => set("effort", effort === "__default" ? null : effort), options: CODEX_REASONING_EFFORT_OPTIONS, value: value.effort ?? "__default" }) }), _jsx(ControlLabel, { label: "Approval", children: _jsx(SimpleSelect, { onValueChange: (approvalPolicy) => set("approvalPolicy", approvalPolicy === "__default" ? null : approvalPolicy), options: CODEX_APPROVAL_OPTIONS, value: typeof value.approvalPolicy === "string"
-                        ? value.approvalPolicy
-                        : "__default" }) }), _jsx(ControlLabel, { label: "Reasoning summary", children: _jsx(SimpleSelect, { onValueChange: (summary) => set("summary", summary === "__default" ? null : summary), options: CODEX_REASONING_SUMMARY_OPTIONS, value: value.summary ?? "__default" }) })] }));
-}
-function ControlLabel({ children, label, }) {
-    return (_jsxs("label", { className: "grid gap-1 text-[11px] font-medium text-fg-tertiary", children: [label, children] }));
-}
-export function CodexThreadComposer({ defaultMessage = "", disabled = false, onSubmit, placeholder = "Message Codex", }) {
-    const [message, setMessage] = useState(defaultMessage);
-    const submit = () => {
-        const next = message.trim();
-        if (!next)
-            return;
-        setMessage("");
-        void onSubmit(next);
-    };
-    return (_jsxs("div", { className: "flex items-end gap-2", children: [_jsx(Textarea, { "aria-label": "Codex message", className: "min-h-20 resize-none", onChange: (event) => setMessage(event.target.value), onKeyDown: (event) => {
-                    if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
-                        event.preventDefault();
-                        submit();
-                    }
-                }, placeholder: placeholder, value: message }), _jsxs(Button, { "aria-label": "Send Codex message", disabled: disabled || message.trim().length === 0, onClick: submit, children: [_jsx(SendIcon, {}), "Send"] })] }));
-}
-export function CodexThreadTranscript({ emptyDescription = "Send a message to start the Codex thread.", emptyTitle = "No Codex output yet", settings, snapshot, }) {
-    const resolvedSettings = useMemo(() => mergeCodexTranscriptSettings(settings), [settings]);
-    const entries = useMemo(() => toCodexTranscriptEntries(snapshot), [snapshot]);
-    if (entries.length === 0) {
-        return (_jsx(EmptyState, { className: "min-h-[24rem]", description: emptyDescription, title: emptyTitle }));
-    }
-    return (_jsx("div", { className: cn("mx-auto w-full max-w-[980px] min-w-0", resolvedSettings.density === "compact" ? "space-y-3" : "space-y-5"), children: entries.map((entry) => {
-            switch (entry.type) {
-                case "userMessage":
-                    return (_jsx(CodexUserMessageBubble, { item: entry.item, settings: resolvedSettings }, entry.id));
-                case "assistantText":
-                    return (_jsx(CodexAssistantText, { settings: resolvedSettings, text: entry.item.text }, entry.id));
-                case "reasoning":
-                    return (_jsx(CodexReasoningBlock, { item: entry.item, settings: resolvedSettings }, entry.id));
-                case "turnPlan":
-                    return _jsx(CodexPlanText, { plan: entry.plan }, entry.id);
-                case "planItem":
-                    return (_jsx(CodexAssistantText, { settings: resolvedSettings, text: entry.item.text }, entry.id));
-                case "command":
-                    return (_jsx(CodexCommandBlock, { item: entry.item, settings: resolvedSettings }, entry.id));
-                case "fileChange":
-                    return (_jsx(CodexFileChangeBlock, { item: entry.item, settings: resolvedSettings }, entry.id));
-                case "toolCall":
-                    return (_jsx(CodexToolCallText, { item: entry.item, settings: resolvedSettings }, entry.id));
-                case "webSearch":
-                    return (_jsx(CodexTranscriptLine, { icon: _jsx(GitBranchIcon, { className: "size-3.5" }), label: "web search", value: entry.item.query }, entry.id));
-                case "pendingRequest":
-                    return (_jsx(CodexPendingRequestLine, { request: entry.request }, entry.id));
-                default:
-                    return (_jsx(CodexAssistantText, { settings: resolvedSettings, text: JSON.stringify(entry.item, null, 2) }, entry.id));
-            }
-        }) }));
-}
-export function CodexUserMessageBubble({ item, settings = DEFAULT_CODEX_TRANSCRIPT_RENDER_SETTINGS, }) {
-    return (_jsx("div", { className: "flex justify-end", children: _jsx("div", { className: "max-w-[760px] rounded-[10px] border border-primary/25 bg-primary/10 px-3.5 py-2.5 text-[13px] leading-6 text-fg", children: _jsx(CodexMarkdownText, { settings: settings, text: codexInputText(item) }) }) }));
-}
-export function CodexAssistantText({ settings = DEFAULT_CODEX_TRANSCRIPT_RENDER_SETTINGS, text, }) {
-    return (_jsx("div", { className: "max-w-[900px] text-[13px] leading-6 text-fg", children: _jsx(CodexMarkdownText, { settings: settings, text: text }) }));
-}
-export function CodexMarkdownText({ settings = DEFAULT_CODEX_TRANSCRIPT_RENDER_SETTINGS, text, }) {
-    if (settings.markdown === "raw") {
-        return _jsx("pre", { className: "whitespace-pre-wrap font-sans", children: text });
-    }
-    return (_jsx(ReactMarkdown, { components: {
-            code: MarkdownCode,
-            p: ({ children }) => _jsx("p", { className: "mb-2 last:mb-0", children: children }),
-            pre: ({ children }) => _jsx(_Fragment, { children: children }),
-        }, remarkPlugins: [remarkGfm], children: text }));
-}
-function MarkdownCode(props) {
-    const text = String(props.children ?? "").replace(/\n$/, "");
-    const language = /language-([\w-]+)/.exec(props.className ?? "")?.[1] ?? "text";
-    const inline = props.inline ?? (!props.className && !text.includes("\n"));
-    if (inline) {
-        return (_jsx("code", { className: "rounded bg-bg-elevated px-1 py-0.5 font-mono text-[0.92em]", children: text }));
-    }
-    return _jsx(CodexHighlightedCode, { code: text, language: language });
-}
-export function CodexHighlightedCode({ code, language = "text", }) {
-    const [html, setHtml] = useState(null);
-    useEffect(() => {
-        let active = true;
-        setHtml(null);
-        import("shiki")
-            .then(({ codeToHtml }) => codeToHtml(code || " ", {
-            lang: language,
-            theme: "github-dark-default",
-        }))
-            .then((nextHtml) => {
-            if (active)
-                setHtml(nextHtml);
-        })
-            .catch(() => {
-            if (active)
-                setHtml(null);
-        });
-        return () => {
-            active = false;
-        };
-    }, [code, language]);
-    if (!html) {
-        return (_jsx("pre", { className: "my-2 overflow-x-auto rounded-md border border-border bg-bg-card p-3 font-mono text-[12px] leading-5 text-fg", children: code }));
-    }
-    return (_jsx("div", { className: "codex-shiki my-2 overflow-x-auto rounded-md border border-border bg-bg-card text-[12px] leading-5 [&_pre]:!m-0 [&_pre]:!bg-transparent [&_pre]:!p-3", dangerouslySetInnerHTML: { __html: html } }));
-}
-export function CodexReasoningBlock({ item, settings, }) {
-    if (settings.reasoning === "hidden")
-        return null;
-    const content = settings.reasoning === "expanded"
-        ? [...item.summary, ...item.content]
-        : item.summary;
-    const text = content.filter(Boolean).join("\n\n");
-    if (!text)
-        return null;
-    return (_jsx(CodexTranscriptLine, { icon: _jsx(BotIcon, { className: "size-3.5" }), label: "reasoning", muted: true, value: text }));
-}
-export function CodexPlanText({ plan }) {
-    return (_jsxs("div", { className: "text-[13px] leading-6 text-fg-secondary", children: [plan.explanation ? (_jsx("p", { className: "mb-1.5 whitespace-pre-wrap", children: plan.explanation })) : null, _jsx("div", { className: "space-y-1", children: plan.steps.map((step, index) => (_jsxs("div", { className: "flex items-start gap-2", children: [_jsx(StatusDot, { className: "mt-[7px]", status: step.status === "completed" ? "healthy" : "unknown" }), _jsx("span", { className: "whitespace-pre-wrap", children: step.step })] }, `${step.step}-${index}`))) })] }));
-}
-export function CodexCommandBlock({ item, settings, }) {
-    const output = item.aggregatedOutput ?? "";
-    const collapsed = settings.commandOutput === "collapsed" ||
-        (settings.commandOutput === "auto" && output.split("\n").length > 80);
-    return (_jsxs("div", { className: "min-w-0 space-y-1.5 text-[13px] leading-6", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1 text-[12px] text-fg-tertiary", children: [_jsx(TerminalIcon, { className: "size-3.5" }), _jsx("span", { className: "font-semibold text-fg-secondary", children: "command" }), _jsx("span", { children: item.status }), item.exitCode != null ? _jsxs("span", { children: ["exit ", item.exitCode] }) : null, item.durationMs != null ? _jsxs("span", { children: [item.durationMs, "ms"] }) : null] }), _jsx("pre", { className: "max-w-full whitespace-pre-wrap break-words font-mono text-[12px] leading-5 text-fg", children: item.command }), item.cwd ? (_jsx("div", { className: "font-mono text-[11px] text-fg-tertiary", children: item.cwd })) : null, output ? (collapsed ? (_jsxs("div", { className: "font-mono text-[12px] text-fg-tertiary", children: ["output collapsed (", formatNumber(output.split("\n").length), " lines)"] })) : (_jsx("pre", { className: "max-h-[32rem] max-w-full overflow-auto rounded-md border border-border bg-bg-card p-3 font-mono text-[12px] leading-5 text-fg", children: _jsx(CodexAnsiText, { enabled: settings.ansi, text: output }) }))) : null] }));
-}
-export function CodexAnsiText({ enabled = true, text, }) {
-    if (!enabled)
-        return _jsx(_Fragment, { children: Anser.ansiToText(text) });
-    const html = Anser.ansiToHtml(Anser.escapeForHtml(text));
-    return _jsx("span", { dangerouslySetInnerHTML: { __html: html } });
-}
-export function CodexFileChangeBlock({ item, settings, }) {
-    const totals = countFileUpdateChanges(item.changes);
-    return (_jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2 text-[12px] text-fg-tertiary", children: [_jsx(GitBranchIcon, { className: "size-3.5" }), _jsx("span", { className: "font-semibold text-fg-secondary", children: "edited files" }), _jsxs("span", { className: "text-status-ok", children: ["+", totals.additions] }), _jsxs("span", { className: "text-status-err", children: ["-", totals.deletions] }), _jsx("span", { children: item.status })] }), item.changes.map((change, index) => (_jsx(CodexUnifiedDiff, { change: change, settings: settings }, `${change.path}-${index}`)))] }));
-}
-export function CodexUnifiedDiff({ change, settings = DEFAULT_CODEX_TRANSCRIPT_RENDER_SETTINGS, }) {
-    const files = parseCodexUnifiedDiff(change);
-    const collapsed = settings.diffs === "collapsed" ||
-        (settings.diffs === "auto" &&
-            files.some((file) => file.hunks.some((hunk) => hunk.changes.length > 160)));
-    return (_jsx("div", { className: "space-y-2", children: files.map((file) => (_jsx(CodexDiffFile, { collapsed: collapsed, file: file, settings: settings }, `${file.oldPath}:${file.newPath}`))) }));
-}
-function CodexDiffFile({ collapsed, file, settings, }) {
-    const language = languageForPath(file.displayPath);
-    return (_jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2 font-mono text-[12px] text-fg-secondary", children: [_jsx("span", { children: file.displayPath }), _jsxs("span", { className: "text-status-ok", children: ["+", file.totals.additions] }), _jsxs("span", { className: "text-status-err", children: ["-", file.totals.deletions] })] }), collapsed ? (_jsxs("div", { className: "font-mono text-[12px] text-fg-tertiary", children: ["diff collapsed (", formatNumber(totalDiffLines(file)), " lines)"] })) : (_jsx("div", { className: "overflow-hidden rounded-md border border-border bg-bg-card font-mono text-[12px] leading-5", children: file.hunks.map((hunk, hunkIndex) => (_jsxs("div", { children: [_jsx("div", { className: "border-b border-border/70 bg-bg-elevated px-3 py-1 text-fg-tertiary", children: hunk.content }), hunk.changes.map((change, index) => (_jsxs("div", { className: cn("grid grid-cols-[4.5rem_4.5rem_1.5rem_minmax(0,1fr)] gap-2 px-3 py-0.5", change.type === "insert" && "bg-status-ok/10", change.type === "delete" && "bg-status-err/10"), children: [_jsx("span", { className: "text-right text-fg-tertiary", children: "oldLineNumber" in change ? change.oldLineNumber : "" }), _jsx("span", { className: "text-right text-fg-tertiary", children: "newLineNumber" in change ? change.newLineNumber : "" }), _jsx("span", { className: cn("text-fg-tertiary", change.type === "insert" && "text-status-ok", change.type === "delete" && "text-status-err"), children: change.type === "insert"
-                                        ? "+"
-                                        : change.type === "delete"
-                                            ? "-"
-                                            : " " }), _jsx("span", { className: "min-w-0 whitespace-pre-wrap break-words text-fg", children: _jsx(CodexHighlightedFragment, { code: change.content.replace(/^[+\- ]/, ""), enabled: settings.syntaxHighlighting, language: language }) })] }, `${change.content}-${index}`)))] }, `${hunk.content}-${hunkIndex}`))) }))] }));
-}
-function CodexHighlightedFragment({ code, enabled, language, }) {
-    const [html, setHtml] = useState(null);
-    useEffect(() => {
-        if (!enabled || language === "text" || code.trim().length === 0) {
-            setHtml(null);
-            return;
-        }
-        let active = true;
-        import("shiki")
-            .then(({ codeToHtml }) => codeToHtml(code, { lang: language, theme: "github-dark-default" }))
-            .then((nextHtml) => {
-            if (!active)
-                return;
-            const match = /<code[^>]*>([\s\S]*?)<\/code>/.exec(nextHtml);
-            setHtml(match?.[1] ?? null);
-        })
-            .catch(() => {
-            if (active)
-                setHtml(null);
-        });
-        return () => {
-            active = false;
-        };
-    }, [code, enabled, language]);
-    if (!html)
-        return _jsx(_Fragment, { children: code });
-    return _jsx("span", { dangerouslySetInnerHTML: { __html: html } });
-}
-export function CodexToolCallText({ item, settings, }) {
-    const title = item.type === "mcpToolCall"
-        ? `${item.server}.${item.tool}`
-        : [item.namespace, item.tool].filter(Boolean).join(".");
-    const detail = settings.toolDetails === "full"
-        ? JSON.stringify(item, null, 2)
-        : item.type === "mcpToolCall" && item.error
-            ? item.error.message
-            : "";
-    return (_jsx(CodexTranscriptLine, { icon: _jsx(CircleIcon, { className: "size-3.5" }), label: item.type === "mcpToolCall" ? "mcp" : "tool", muted: true, value: [title, detail].filter(Boolean).join("\n") }));
-}
-export function CodexPendingRequestLine({ request, }) {
-    return (_jsx(CodexTranscriptLine, { icon: _jsx(ClockIcon, { className: "size-3.5" }), label: "pending request", value: `${request.method}\nrequest ${String(request.id)}` }));
-}
-function CodexTranscriptLine({ icon, label, muted = false, value, }) {
-    return (_jsxs("div", { className: cn("space-y-1 text-[13px] leading-6", muted && "text-fg-secondary"), children: [_jsxs("div", { className: "flex items-center gap-2 text-[12px] font-semibold text-fg-tertiary", children: [icon, label] }), _jsx("pre", { className: "whitespace-pre-wrap font-sans", children: value })] }));
-}
-export function CodexThreadInspector({ session, showControls = false, snapshot, }) {
-    const summary = useMemo(() => summarizeCodexThread(snapshot), [snapshot]);
-    const thread = summary.thread;
-    const usagePercent = tokenUsagePercent(summary.tokenUsage);
-    const [turnControls, setTurnControls] = useCodexTurnControlState(session);
-    const lastTurn = summary.lastTurnDurationMs == null
-        ? "none"
-        : `${summary.lastTurnDurationMs}ms`;
-    return (_jsxs("div", { className: "space-y-2", children: [_jsx(CodexInspectorValueItem, { label: "Thread", mono: true, value: thread?.id ?? "none" }), _jsx(CodexInspectorValueItem, { label: "Status", value: thread?.status.type ?? "none" }), _jsx(CodexInspectorValueItem, { label: "Source", value: thread ? codexThreadSourceKind(thread) : "none" }), _jsx(CodexInspectorValueItem, { label: "Cwd", mono: true, value: thread?.cwd ?? "none" }), showControls ? (_jsx(CodexTurnControlInspectorItems, { onChange: setTurnControls, value: turnControls })) : null, _jsx(CodexInspectorValueItem, { label: "Turns", mono: true, value: formatNumber(summary.turnCount) }), _jsx(CodexInspectorValueItem, { label: "Items", mono: true, value: formatNumber(summary.itemCount) }), _jsx(CodexInspectorValueItem, { label: "Commands", mono: true, value: formatNumber(summary.commandCount) }), _jsx(CodexInspectorValueItem, { label: "File changes", mono: true, value: formatNumber(summary.fileChangeCount) }), _jsx(CodexInspectorValueItem, { label: "Last turn", mono: true, value: lastTurn }), _jsx(CodexInspectorValueItem, { label: "Tokens", mono: true, value: formatTokenUsageBreakdown(summary.tokenUsage?.tokenUsage.total) }), _jsx(CodexInspectorValueItem, { label: "Context", mono: true, value: usagePercent == null ? "unknown" : `${usagePercent}%` }), _jsx(CodexInspectorValueItem, { label: "Pending", mono: true, value: String(summary.pendingRequestCount) })] }));
-}
-function CodexTurnControlInspectorItems({ onChange, value, }) {
-    const modelOptions = useCodexModelOptions();
-    const set = useCodexTurnControlSetter(onChange, value);
-    return (_jsxs(_Fragment, { children: [_jsx(CodexTurnControlInspectorItem, { label: "Model", children: _jsx(SimpleSelect, { className: "text-[12px]", onValueChange: (model) => set("model", model === "__default" ? null : model), options: modelOptions, value: value.model ?? "__default" }) }), _jsx(CodexTurnControlInspectorItem, { label: "Effort", children: _jsx(SimpleSelect, { className: "text-[12px]", onValueChange: (effort) => set("effort", effort === "__default" ? null : effort), options: CODEX_REASONING_EFFORT_OPTIONS, value: value.effort ?? "__default" }) }), _jsx(CodexTurnControlInspectorItem, { label: "Approval", children: _jsx(SimpleSelect, { className: "text-[12px]", onValueChange: (approvalPolicy) => set("approvalPolicy", approvalPolicy === "__default" ? null : approvalPolicy), options: CODEX_APPROVAL_OPTIONS, value: typeof value.approvalPolicy === "string"
-                        ? value.approvalPolicy
-                        : "__default" }) }), _jsx(CodexTurnControlInspectorItem, { label: "Reasoning summary", children: _jsx(SimpleSelect, { className: "text-[12px]", onValueChange: (summary) => set("summary", summary === "__default" ? null : summary), options: CODEX_REASONING_SUMMARY_OPTIONS, value: value.summary ?? "__default" }) })] }));
-}
-function CodexTurnControlInspectorItem({ children, label, }) {
-    return (_jsx(InspectorItem, { children: _jsxs("label", { className: "block", children: [_jsx(InspectorItemHeader, { className: "mb-2", title: label }), children] }) }));
-}
-function CodexInspectorValueItem({ label, mono = false, value, }) {
-    return (_jsxs(InspectorItem, { children: [_jsx(InspectorItemHeader, { title: label }), _jsx(InspectorItemValue, { className: "block whitespace-normal text-left break-words", mono: mono, children: value })] }));
-}
-export function CodexThreadSidebar({ activeThreadId, archived = false, cwd, limit = 40, onOpenThread, searchTerm, sourceKinds, }) {
-    const { client, error: serverError, initialized, status, } = useCodexAppServer();
-    const { preferences, setPinned } = useCodexThreadSidebarPreferences();
-    const [threads, setThreads] = useState([]);
-    const [error, setError] = useState(null);
-    const [loading, setLoading] = useState(false);
-    const [renamingThread, setRenamingThread] = useState(null);
-    const pinnedThreadIds = preferences.pinnedThreadIds;
-    const pinnedThreadIdSet = useMemo(() => new Set(pinnedThreadIds), [pinnedThreadIds]);
-    const requestLimit = pinnedThreadIds.length > 0
-        ? Math.max(limit, 100, limit + pinnedThreadIds.length)
-        : limit;
-    const sortedThreads = useMemo(() => threads
-        .map((thread, index) => ({ index, thread }))
-        .sort((left, right) => {
-        const leftPinned = pinnedThreadIdSet.has(left.thread.id);
-        const rightPinned = pinnedThreadIdSet.has(right.thread.id);
-        if (leftPinned !== rightPinned)
-            return leftPinned ? -1 : 1;
-        return left.index - right.index;
-    })
-        .map(({ thread }) => thread)
-        .slice(0, Math.max(limit, pinnedThreadIds.length)), [limit, pinnedThreadIdSet, pinnedThreadIds.length, threads]);
-    const refresh = useCallback(async () => {
-        if (!client || !initialized)
-            return;
-        setLoading(true);
-        setError(null);
-        try {
-            const response = await client.listThreads({
-                archived,
-                cwd,
-                limit: requestLimit,
-                searchTerm,
-                sortDirection: "desc",
-                sortKey: "updated_at",
-                sourceKinds,
-            });
-            setThreads(response.data);
-        }
-        catch (nextError) {
-            setError(nextError instanceof Error ? nextError : new Error(String(nextError)));
-        }
-        finally {
-            setLoading(false);
-        }
-    }, [
-        archived,
-        client,
-        cwd,
-        initialized,
-        requestLimit,
-        searchTerm,
-        sourceKinds,
-    ]);
-    useEffect(() => {
-        void refresh();
-    }, [refresh]);
-    useEffect(() => {
-        if (!client)
-            return;
-        return client.onNotification((notification) => {
-            if (notification.method === "thread/started" ||
-                notification.method === "thread/status/changed" ||
-                notification.method === "thread/name/updated" ||
-                notification.method === "thread/archived" ||
-                notification.method === "thread/unarchived" ||
-                notification.method === "thread/closed" ||
-                notification.method === "turn/completed") {
-                void refresh();
-            }
-        });
-    }, [client, refresh]);
-    return (_jsxs(_Fragment, { children: [_jsxs(SidebarSection, { children: [_jsx("div", { className: "mb-1 flex justify-end px-2", children: _jsx("button", { "aria-label": "Refresh Codex threads", className: "rounded-md p-1 text-fg-tertiary hover:bg-bg-hover hover:text-fg", onClick: () => void refresh(), type: "button", children: _jsx(RefreshCcwIcon, { className: cn("size-3.5", loading && "animate-spin") }) }) }), serverError || error ? (_jsx("div", { className: "px-2 py-2 text-[11px] text-status-err", children: (serverError ?? error)?.message })) : null, !serverError && !error && (!client || !initialized) ? (_jsx("div", { className: "px-2 py-2 text-[11px] text-fg-tertiary", children: status === "connecting"
-                            ? "Connecting to Codex..."
-                            : "Codex is not connected." })) : null, client && initialized && threads.length === 0 && !loading ? (_jsx("div", { className: "px-2 py-2 text-[11px] text-fg-tertiary", children: "No Codex threads found." })) : null, sortedThreads.map((thread) => {
-                        const pinned = pinnedThreadIdSet.has(thread.id);
-                        const active = activeThreadId === thread.id;
-                        return (_jsxs(ContextMenu, { children: [_jsx(ContextMenuTrigger, { asChild: true, children: _jsx(SidebarActionRow, { active: active, "aria-selected": active, "data-codex-thread-id": thread.id, "data-codex-thread-pinned": pinned ? "true" : undefined, "data-codex-thread-row": true, description: codexThreadDescription(thread), icon: pinned ? (_jsx(PinIcon, { className: "size-4" })) : thread.status.type === "active" ? (_jsx(ClockIcon, { className: "size-4" })) : (_jsx(MessageSquareIcon, { className: "size-4" })), onClick: () => onOpenThread(thread), role: "tab", title: codexThreadTitle(thread) }) }), _jsxs(ContextMenuContent, { className: "min-w-44", children: [_jsxs(ContextMenuItem, { onSelect: () => setRenamingThread(thread), children: [_jsx(PencilIcon, { className: "size-4" }), "Rename thread..."] }), _jsx(ContextMenuSeparator, {}), _jsxs(ContextMenuItem, { onSelect: () => setPinned(thread.id, !pinned), children: [pinned ? (_jsx(PinOffIcon, { className: "size-4" })) : (_jsx(PinIcon, { className: "size-4" })), pinned ? "Unpin thread" : "Pin thread"] })] })] }, thread.id));
-                    })] }), _jsx(CodexThreadRenameDialog, { client: client, onOpenChange: (open) => {
-                    if (!open)
-                        setRenamingThread(null);
-                }, onRenamed: (threadId, name) => {
-                    setThreads((current) => current.map((thread) => thread.id === threadId ? { ...thread, name } : thread));
-                    void refresh();
-                }, open: renamingThread !== null, thread: renamingThread })] }));
-}
-function CodexThreadRenameDialog({ client, onOpenChange, onRenamed, open, thread, }) {
-    const [error, setError] = useState(null);
-    const [name, setName] = useState("");
-    const [saving, setSaving] = useState(false);
-    useEffect(() => {
-        if (!thread)
-            return;
-        setName(codexThreadTitle(thread));
-        setError(null);
-        setSaving(false);
-    }, [thread]);
-    const submit = async (event) => {
-        event.preventDefault();
-        if (!client || !thread)
-            return;
-        const trimmedName = name.trim();
-        if (!trimmedName) {
-            setError(new Error("Enter a thread name."));
-            return;
-        }
-        if (trimmedName === codexThreadTitle(thread)) {
-            onOpenChange(false);
-            return;
-        }
-        setSaving(true);
-        setError(null);
-        try {
-            await client.setThreadName({
-                name: trimmedName,
-                threadId: thread.id,
-            });
-            onRenamed(thread.id, trimmedName);
-            onOpenChange(false);
-        }
-        catch (nextError) {
-            setError(nextError instanceof Error ? nextError : new Error(String(nextError)));
-        }
-        finally {
-            setSaving(false);
-        }
-    };
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsx(DialogContent, { children: _jsxs("form", { className: "grid gap-4", onSubmit: submit, children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Rename thread" }), _jsx(DialogDescription, { children: "Set a user-facing title for this Codex thread." })] }), _jsxs("label", { className: "grid gap-1.5 text-[12px] font-medium text-fg-tertiary", children: ["Thread name", _jsx(Input, { "aria-label": "Thread name", autoFocus: true, disabled: saving, onChange: (event) => setName(event.target.value), value: name })] }), error ? (_jsx("div", { className: "rounded-md border border-destructive/30 bg-destructive/8 px-3 py-2 text-[12px] text-fg", children: error.message })) : null, _jsxs(DialogFooter, { children: [_jsx(Button, { disabled: saving, onClick: () => onOpenChange(false), type: "button", variant: "outline", children: "Cancel" }), _jsx(Button, { disabled: saving || name.trim().length === 0, type: "submit", children: "Save" })] })] }) }) }));
-}
-export function CodexThreadStats({ snapshot, }) {
-    const summary = summarizeCodexThread(snapshot);
-    return (_jsxs("div", { className: "grid gap-3 md:grid-cols-4", children: [_jsx(CodexStat, { label: "Turns", value: summary.turnCount }), _jsx(CodexStat, { label: "Commands", value: summary.commandCount }), _jsx(CodexStat, { label: "Changes", value: summary.fileChangeCount }), _jsx(CodexStat, { label: "Pending", value: summary.pendingRequestCount })] }));
-}
-function CodexStat({ label, value }) {
-    return (_jsxs("div", { className: "rounded-[10px] border border-border bg-bg-card px-4 py-[14px]", children: [_jsx("p", { className: "mb-1.5 text-[11px] font-medium tracking-[0.06em] text-fg-tertiary uppercase", children: label }), _jsx("p", { className: "font-mono text-[22px] leading-[1.2] font-semibold text-fg", children: value })] }));
-}
-function totalDiffLines(file) {
-    return file.hunks.reduce((count, hunk) => count + hunk.changes.length, 0);
-}
+export { CodexThreadComposer, CodexThreadWorkspace } from "./thread-workspace.js";
+export { CodexThreadSidebar } from "./thread-sidebar.js";
+export { CodexThreadInspector, CodexThreadStats } from "./thread-inspector.js";
+export { CodexTurnControls } from "./turn-controls.js";
+export { CodexAnsiText, CodexAssistantText, CodexCommandBlock, CodexFileChangeBlock, CodexHighlightedCode, CodexMarkdownText, CodexPendingRequestLine, CodexPlanText, CodexReasoningBlock, CodexThreadTranscript, CodexToolCallText, CodexUnifiedDiff, CodexUserMessageBubble, } from "./transcript-renderers.js";
 //# sourceMappingURL=transcript-react.js.map