@exoscient/control-panel 0.1.0

package/dist/TaskDetail.js

@@ -0,0 +1,889 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { Check, Hourglass, Maximize2, Minimize2, PanelBottomClose, PanelBottomOpen, Paperclip, RefreshCw, Send, Share2, Square, Trash2, Waypoints, X } from 'lucide-react';
+import { externalContinuation, isReloadClientAppAction, isUserDecisionAction, userDecisionAllowsOther, userDecisionOtherLabel, userDecisionOtherPlaceholder, userDecisionSelectionMode, } from './client-actions';
+import { splitAgentResult } from './result';
+import { buildTraceItems, latestContextPressure, traceItemMatchesFilter } from './trace';
+export function TaskDetailPage({ restoreMaximized, setMaximized, setMinimized, setRestoreMaximized, setOpenTraceTurnId, onCloseTask, onCloseReset, ...taskDetailProps }) {
+    return (_jsx(TaskDetail, { ...taskDetailProps, onClose: () => {
+            onCloseTask();
+            setMinimized(false);
+            setRestoreMaximized(false);
+            setOpenTraceTurnId(null);
+            onCloseReset?.();
+        }, onMinimize: () => {
+            setRestoreMaximized(taskDetailProps.maximized);
+            setMinimized(true);
+            setMaximized(false);
+            setOpenTraceTurnId(null);
+        }, onRestore: () => {
+            setMinimized(false);
+            setMaximized(restoreMaximized);
+        }, onToggleMaximized: () => setMaximized((maximized) => !maximized), onCloseTrace: () => setOpenTraceTurnId(null) }));
+}
+export function TaskDetail({ task, maximized, minimized, platformStatus, elapsedNow, traceLoadingTurnId, selectedTraceTurn, selectedTraceTurnIndex, turnRefs, followUp, followUpAttachments, followUpSubmitting, followUpError = null, interruptMessage, interruptSubmitting, steerSubmitting, taskCommandStatus = null, refreshSubmitting = false, onClose, onMinimize, onRestore, onToggleMaximized, onRefresh, onOpenTrace, onCloseTrace, onSubmitFollowUp, onSubmitSteer, onFollowUpChange, onFollowUpAttachmentsChange, uploadAttachment, onSubmitInterrupt, onInterruptMessageChange, onSubmitClientAction, currentUserId, shareTask, unshareTask, }) {
+    const [followUpAttachmentsProcessing, setFollowUpAttachmentsProcessing] = useState(false);
+    const [accessDetailsOpen, setAccessDetailsOpen] = useState(false);
+    const [shareUser, setShareUser] = useState('');
+    const [shareLevel, setShareLevel] = useState('read');
+    const [shareSubmitting, setShareSubmitting] = useState(false);
+    const [shareError, setShareError] = useState(null);
+    const [clientActionSubmitting, setClientActionSubmitting] = useState(false);
+    const [clientActionError, setClientActionError] = useState(null);
+    const previousTaskStateRef = useRef(null);
+    const taskInputPlaceholder = 'Send instructions to the AI agent';
+    const taskQueued = task ? isTaskQueued(task) : false;
+    useEffect(() => {
+        setAccessDetailsOpen(false);
+        setShareUser('');
+        setShareLevel('read');
+        setShareError(null);
+        setClientActionError(null);
+    }, [task?.id]);
+    const canManageSharing = Boolean(task && shareTask && unshareTask && (!currentUserId || task.createdByUserId === currentUserId));
+    async function submitShare(event) {
+        event.preventDefault();
+        if (!task || !shareTask || !shareUser.trim() || shareSubmitting)
+            return;
+        setShareSubmitting(true);
+        setShareError(null);
+        try {
+            const updated = await shareTask(task.id, {
+                userId: shareUser.trim(),
+                email: shareUser.includes('@') ? shareUser.trim() : undefined,
+                accessLevel: shareLevel,
+            });
+            if (updated)
+                setShareUser('');
+            else
+                setShareError('Task sharing failed.');
+        }
+        catch (error) {
+            setShareError(error instanceof Error ? error.message : 'Task sharing failed.');
+        }
+        finally {
+            setShareSubmitting(false);
+        }
+    }
+    async function removeShare(userId) {
+        if (!task || !unshareTask || shareSubmitting)
+            return;
+        setShareSubmitting(true);
+        setShareError(null);
+        try {
+            const updated = await unshareTask(task.id, userId);
+            if (!updated)
+                setShareError('Task sharing failed.');
+        }
+        catch (error) {
+            setShareError(error instanceof Error ? error.message : 'Task sharing failed.');
+        }
+        finally {
+            setShareSubmitting(false);
+        }
+    }
+    useEffect(() => {
+        const previous = previousTaskStateRef.current;
+        if (!task) {
+            previousTaskStateRef.current = null;
+            return;
+        }
+        if (previous?.id === task.id && previous.busy && !isTaskBusy(task) && isTaskFinishedStatus(task.status)) {
+            notifyTaskFinished(task);
+        }
+        previousTaskStateRef.current = { id: task.id, busy: isTaskBusy(task), status: task.status };
+    }, [task]);
+    useEffect(() => {
+        if (!task || !isReloadClientAppAction(task.clientAction))
+            return;
+        if (typeof window === 'undefined')
+            return;
+        const action = task.clientAction;
+        const key = `exo-client-action:${task.id}:${action.id}`;
+        try {
+            if (window.sessionStorage.getItem(key))
+                return;
+            window.sessionStorage.setItem(key, new Date().toISOString());
+        }
+        catch {
+            // Storage is only for deduping reload loops; continue if unavailable.
+        }
+        const delay = typeof action.delayMs === 'number' && Number.isFinite(action.delayMs)
+            ? Math.max(0, Math.min(30000, action.delayMs))
+            : 0;
+        const timer = window.setTimeout(() => window.location.reload(), delay);
+        return () => window.clearTimeout(timer);
+    }, [task?.id, task?.clientAction]);
+    async function submitClientAction(action, message) {
+        const continuation = externalContinuation(action);
+        if (!task || !onSubmitClientAction || !continuation?.token || clientActionSubmitting)
+            return;
+        setClientActionSubmitting(true);
+        setClientActionError(null);
+        try {
+            const updated = await onSubmitClientAction(task.id, { actionId: action.id, token: continuation.token, message });
+            if (!updated)
+                setClientActionError('Decision could not be submitted.');
+        }
+        catch (error) {
+            setClientActionError(error instanceof Error ? error.message : 'Decision could not be submitted.');
+        }
+        finally {
+            setClientActionSubmitting(false);
+        }
+    }
+    return (_jsxs(_Fragment, { children: [task && minimized && (_jsxs("div", { className: "task-detail-dock", role: "region", "aria-label": "Minimized task detail", children: [_jsxs("div", { className: "task-detail-dock-main", children: [_jsx("strong", { title: formatTaskFullTitle(task), children: formatTaskDetailTitle(task) }), _jsx("span", { children: taskStatusContent(task, platformStatus) })] }), _jsxs("div", { className: "task-detail-dock-actions", children: [onRefresh && (_jsx("button", { className: "icon-button", onClick: onRefresh, disabled: refreshSubmitting, "aria-label": "Refresh task detail", title: "Refresh", children: refreshSubmitting ? _jsx(InlineSpinner, {}) : _jsx(RefreshCw, { "aria-hidden": "true" }) })), _jsx("button", { className: "icon-button", onClick: onRestore, "aria-label": "Restore task detail", title: "Restore", children: _jsx(PanelBottomOpen, { "aria-hidden": "true" }) }), _jsx("button", { className: "icon-button", onClick: onClose, "aria-label": "Close", title: "Close", children: _jsx(X, { "aria-hidden": "true" }) })] })] })), _jsx("aside", { className: `drawer${task && !minimized ? ' open' : ''}${maximized ? ' maximized' : ''}`, "aria-hidden": !task || minimized, children: task && (_jsxs(_Fragment, { children: [_jsxs("header", { children: [_jsxs("div", { className: "drawer-heading", children: [_jsxs("div", { className: "drawer-status-row", children: [_jsx("p", { children: taskStatusContent(task, platformStatus) }), _jsx(TaskAccessSummary, { task: task, detailsOpen: accessDetailsOpen, onToggle: () => setAccessDetailsOpen((open) => !open) })] }), _jsxs("div", { className: "drawer-tools", children: [onRefresh && (_jsx("button", { className: "icon-button", onClick: onRefresh, disabled: refreshSubmitting, "aria-label": "Refresh task detail", title: "Refresh", children: refreshSubmitting ? _jsx(InlineSpinner, {}) : _jsx(RefreshCw, { "aria-hidden": "true" }) })), _jsx("button", { className: "icon-button", onClick: onMinimize, "aria-label": "Minimize task detail", title: "Minimize", children: _jsx(PanelBottomClose, { "aria-hidden": "true" }) }), _jsx("button", { className: "icon-button", onClick: onToggleMaximized, "aria-label": maximized ? 'Restore task detail' : 'Maximize task detail', title: maximized ? 'Restore' : 'Maximize', children: maximized ? _jsx(Minimize2, { "aria-hidden": "true" }) : _jsx(Maximize2, { "aria-hidden": "true" }) }), _jsx("button", { className: "icon-button", onClick: onClose, "aria-label": "Close", title: "Close", children: _jsx(X, { "aria-hidden": "true" }) })] })] }), _jsx("h2", { title: formatTaskFullTitle(task), children: formatTaskDetailTitle(task) }), accessDetailsOpen && _jsx(TaskDetailDetails, { task: task }), canManageSharing && (_jsx(TaskSharingPanel, { task: task, shareUser: shareUser, shareLevel: shareLevel, submitting: shareSubmitting, error: shareError, onShareUserChange: setShareUser, onShareLevelChange: setShareLevel, onSubmit: submitShare, onRemove: removeShare }))] }), _jsxs("div", { className: "drawer-content", children: [_jsxs("div", { className: "drawer-body", children: [task.updatePublicationFailures?.length ? (_jsx(TaskUpdatePublicationWarning, { failures: task.updatePublicationFailures })) : null, task.turns.map((turn, index) => {
+                                            const result = taskTurnResult(task, turn, index);
+                                            return (_jsxs("article", { className: "turn", ref: (element) => {
+                                                    if (element) {
+                                                        turnRefs.current.set(turn.id, element);
+                                                    }
+                                                    else {
+                                                        turnRefs.current.delete(turn.id);
+                                                    }
+                                                }, children: [_jsxs("section", { className: "turn-panel request-panel", "aria-label": `Request ${index + 1}`, children: [_jsx(TurnTitle, { index: index, timestamp: turn.createdAt }), _jsx("p", { children: turn.content })] }), _jsx(SteeringMessages, { messages: taskSteeringMessages(task, index) }), _jsxs("section", { className: "turn-panel output-panel", "aria-label": `AI agent output for request ${index + 1}`, children: [_jsxs("div", { className: "turn-title output-title", children: [_jsx("h3", { children: formatAgentTitle(turn, elapsedNow) }), _jsx("time", { children: formatCompletionTime(turn) })] }), _jsx("div", { className: "result", children: isTurnQueued(turn) ? (_jsx("div", { className: "working-result-body", children: _jsx("span", { className: `status-text ${statusToneClass(turn.status)}`, children: "Queued" }) })) : isTurnWorking(turn) ? (_jsxs(_Fragment, { children: [_jsx("div", { className: "working-result-body", children: _jsx(WorkingIndicator, { label: platformStatus.available ? 'Working' : 'The platform is down. Wait until it is back up', animate: platformStatus.available }) }), _jsx("div", { className: "output-panel-actions", children: _jsx(TraceButton, { loading: traceLoadingTurnId === turn.id, onClick: () => onOpenTrace(turn.id) }) })] })) : (_jsxs(_Fragment, { children: [_jsx(FormattedText, { text: result.owner || 'No output recorded.' }), result.technical && (_jsxs("details", { className: "technical-summary", children: [_jsxs("summary", { children: [_jsx("span", { className: "technical-summary-title", children: "Technical summary" }), _jsx(TraceButton, { loading: traceLoadingTurnId === turn.id, onClick: () => onOpenTrace(turn.id), stopPropagation: true })] }), _jsx("div", { className: "technical-summary-body", children: _jsx(FormattedText, { text: result.technical }) })] })), !result.technical && (_jsx("div", { className: "output-panel-actions", children: _jsx(TraceButton, { loading: traceLoadingTurnId === turn.id, onClick: () => onOpenTrace(turn.id) }) })), index === task.turns.length - 1 && isUserDecisionAction(task.clientAction) && (_jsx(ClientActionPanel, { action: task.clientAction, submitting: clientActionSubmitting, error: clientActionError, canSubmit: Boolean(onSubmitClientAction), onSubmit: (message) => void submitClientAction(task.clientAction, message) }))] })) })] })] }, turn.id));
+                                        })] }), _jsx("form", { className: "drawer-form", onSubmit: followUpAttachmentsProcessing ? (event) => event.preventDefault() : onSubmitFollowUp, children: task.busy ? (_jsxs("div", { className: "interrupt-panel", children: [_jsxs("div", { className: "drawer-form-toolbar", children: [_jsx(CommandStatus, { status: taskCommandStatus }), _jsxs("div", { className: "drawer-form-buttons", children: [_jsx("button", { className: "primary icon-action-button", type: "button", disabled: taskQueued || interruptSubmitting || steerSubmitting || !interruptMessage.trim(), onClick: onSubmitSteer, "aria-label": "Send steering message", title: "Steer", children: steerSubmitting ? _jsx(InlineSpinner, {}) : (_jsx(Send, { "aria-hidden": "true" })) }), _jsx("button", { className: "danger icon-action-button", type: "button", disabled: interruptSubmitting || steerSubmitting, onClick: onSubmitInterrupt, "aria-label": "Interrupt task", title: "Interrupt", children: interruptSubmitting ? _jsx(InlineSpinner, {}) : (_jsx(Square, { "aria-hidden": "true" })) })] })] }), _jsx("textarea", { disabled: taskQueued || interruptSubmitting || steerSubmitting, value: interruptMessage, onChange: (event) => onInterruptMessageChange(event.target.value), placeholder: taskQueued ? 'Task is queued' : taskInputPlaceholder })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "drawer-form-toolbar", children: [_jsx(AttachmentPicker, { attachments: followUpAttachments, disabled: followUpSubmitting, onChange: onFollowUpAttachmentsChange, onProcessingChange: setFollowUpAttachmentsProcessing, uploadAttachment: uploadAttachment, compact: true }), followUpError && _jsx("span", { className: "command-status error", role: "alert", children: followUpError }), _jsx("div", { className: "drawer-form-buttons", children: _jsx("button", { className: "primary icon-action-button", disabled: followUpAttachmentsProcessing || followUpSubmitting || !followUp.trim(), "aria-label": "Continue task", title: "Continue", children: followUpAttachmentsProcessing || followUpSubmitting ? _jsx(InlineSpinner, {}) : (_jsx(Send, { "aria-hidden": "true" })) }) })] }), _jsx("textarea", { disabled: followUpSubmitting, value: followUp, onChange: (event) => onFollowUpChange(event.target.value), placeholder: taskInputPlaceholder })] })) }), selectedTraceTurn && (_jsx("div", { className: "task-trace-overlay", role: "dialog", "aria-modal": "false", "aria-label": `Trace for request ${selectedTraceTurnIndex + 1}`, children: _jsx(TracePanel, { turn: selectedTraceTurn, turnIndex: selectedTraceTurnIndex, loading: traceLoadingTurnId === selectedTraceTurn.id && (selectedTraceTurn.trace?.events?.length ?? 0) === 0, onCollapse: onCloseTrace }) }))] })] })) })] }));
+}
+function TaskUpdatePublicationWarning({ failures }) {
+    const latest = failures[failures.length - 1];
+    const previousCount = failures.length - 1;
+    return (_jsxs("section", { className: "task-publication-warning", "aria-label": "Task update publication warning", children: [_jsx("strong", { children: "Update publication degraded" }), _jsxs("span", { children: [latest.updateType, " could not be published. Retry status: ", formatRetryStatus(latest.retryStatus, latest.retryAttempts), ".", previousCount > 0 ? ` ${previousCount} earlier update${previousCount === 1 ? '' : 's'} also failed.` : ''] })] }));
+}
+function ClientActionPanel({ action, submitting, error, canSubmit, onSubmit, }) {
+    const mode = userDecisionSelectionMode(action);
+    const options = action.options.filter((option) => option && typeof option.id === 'string' && typeof option.label === 'string');
+    const [selectedIds, setSelectedIds] = useState(() => options[0]?.id ? [options[0].id] : []);
+    const [otherText, setOtherText] = useState('');
+    const allowsOther = userDecisionAllowsOther(action);
+    const continuation = externalContinuation(action);
+    const canContinue = canSubmit && Boolean(continuation?.token) && (selectedIds.length > 0 || (allowsOther && Boolean(otherText.trim())));
+    useEffect(() => {
+        setSelectedIds(options[0]?.id ? [options[0].id] : []);
+        setOtherText('');
+    }, [action.id]);
+    function toggleOption(optionId) {
+        if (mode === 'single') {
+            setSelectedIds([optionId]);
+            return;
+        }
+        setSelectedIds((current) => current.includes(optionId)
+            ? current.filter((id) => id !== optionId)
+            : [...current, optionId]);
+    }
+    function submit(event) {
+        event.preventDefault();
+        if (!canContinue || submitting)
+            return;
+        onSubmit(`User decision result:\n${JSON.stringify({
+            clientActionResult: {
+                type: 'userDecision',
+                actionId: action.id,
+                selectedOptionIds: selectedIds,
+                otherText: allowsOther && otherText.trim() ? otherText.trim() : null,
+                submittedAt: new Date().toISOString(),
+            },
+        }, null, 2)}`);
+    }
+    return (_jsxs("form", { className: "client-action-panel", onSubmit: submit, children: [_jsx("div", { className: "client-action-heading", children: _jsx("strong", { children: action.prompt }) }), _jsx("div", { className: "client-action-options", children: options.map((option) => {
+                    const checked = selectedIds.includes(option.id);
+                    return (_jsxs("label", { className: "client-action-option", children: [_jsx("input", { type: mode === 'multiple' ? 'checkbox' : 'radio', name: `client-action-${action.id}`, checked: checked, onChange: () => toggleOption(option.id) }), _jsxs("span", { children: [_jsx("strong", { children: option.label }), option.description && _jsx("small", { children: option.description })] })] }, option.id));
+                }) }), allowsOther && (_jsxs("label", { className: "client-action-other", children: [_jsx("span", { children: userDecisionOtherLabel(action) }), _jsx("textarea", { value: otherText, onChange: (event) => setOtherText(event.target.value), placeholder: userDecisionOtherPlaceholder(action), rows: 2 })] })), _jsxs("div", { className: "client-action-footer", children: [error && _jsx("span", { className: "command-status error", role: "alert", children: error }), !continuation?.token && _jsx("span", { className: "command-status muted", children: "Waiting for continuation access." }), _jsx("button", { className: "primary icon-action-button", type: "submit", disabled: !canContinue || submitting, "aria-label": "Submit decision", title: "Submit decision", children: submitting ? _jsx(InlineSpinner, {}) : _jsx(Check, { "aria-hidden": "true" }) })] })] }));
+}
+function formatRetryStatus(status, attempts) {
+    const label = status.trim().replace(/[-_]+/g, ' ') || 'unknown';
+    return attempts > 0 ? `${label}, ${attempts} attempt${attempts === 1 ? '' : 's'}` : label;
+}
+function TaskSharingPanel({ task, shareUser, shareLevel, submitting, error, onShareUserChange, onShareLevelChange, onSubmit, onRemove, }) {
+    return (_jsxs("section", { className: "task-sharing-panel", "aria-label": "Task sharing", children: [_jsxs("form", { className: "task-sharing-form", onSubmit: onSubmit, children: [_jsx(Share2, { "aria-hidden": "true" }), _jsx("input", { value: shareUser, onChange: (event) => onShareUserChange(event.target.value), placeholder: "User ID or email", disabled: submitting }), _jsxs("select", { value: shareLevel, onChange: (event) => onShareLevelChange(event.target.value), disabled: submitting, children: [_jsx("option", { value: "read", children: "Read only" }), _jsx("option", { value: "full", children: "Full" })] }), _jsx("button", { type: "submit", disabled: submitting || !shareUser.trim(), children: submitting ? _jsx(InlineSpinner, {}) : 'Share' })] }), error && _jsx("div", { className: "task-sharing-error", children: error }), (task.shares?.length ?? 0) > 0 && (_jsx("div", { className: "task-share-list", children: task.shares.map((share) => (_jsxs("div", { className: "task-share-row", children: [_jsx("span", { children: share.displayName || share.email || share.userId }), _jsx("strong", { children: share.accessLevel === 'full' ? 'Full' : 'Read only' }), _jsx("button", { type: "button", onClick: () => onRemove(share.userId), disabled: submitting, "aria-label": `Remove ${share.displayName || share.email || share.userId}`, children: _jsx(Trash2, { "aria-hidden": "true" }) })] }, share.userId))) }))] }));
+}
+function TaskDetailDetails({ task }) {
+    return (_jsxs("div", { className: "task-detail-details", children: [_jsx(TaskDetailMeta, { task: task }), _jsx(TaskAccessChips, { task: task })] }));
+}
+function TaskDetailMeta({ task }) {
+    const startedAt = task.startedAt ?? task.createdAt;
+    const completedAt = task.completedAt ?? null;
+    const updatedAt = task.updatedAt ?? completedAt ?? startedAt;
+    const turnsCount = task.turns.length;
+    const codexModel = normalizeMetadataValue(task.codexModel);
+    const codexReasoningEffort = normalizeMetadataValue(task.codexReasoningEffort);
+    const creator = formatCreatorName(task);
+    return (_jsxs("div", { className: "drawer-meta", "aria-label": "Task metadata", children: [_jsxs("span", { children: [_jsx("span", { className: "muted", children: "ID" }), "\u00A0", _jsx("code", { children: task.id })] }), _jsxs("span", { children: [_jsx("span", { className: "muted", children: "Creator" }), "\u00A0", creator] }), codexModel && _jsxs("span", { children: [_jsx("span", { className: "muted", children: "Model" }), "\u00A0", _jsx("code", { children: codexModel })] }), codexReasoningEffort && _jsxs("span", { children: [_jsx("span", { className: "muted", children: "Effort" }), "\u00A0", _jsx("code", { children: codexReasoningEffort })] }), _jsxs("span", { children: [_jsx("span", { className: "muted", children: "Started" }), "\u00A0", _jsx("time", { dateTime: startedAt, children: formatDateTime(startedAt) })] }), _jsxs("span", { children: [_jsx("span", { className: "muted", children: "Updated" }), "\u00A0", _jsx("time", { dateTime: updatedAt, children: formatDateTime(updatedAt) })] }), _jsxs("span", { children: [_jsx("span", { className: "muted", children: "Turns" }), "\u00A0", turnsCount] })] }));
+}
+function formatCreatorName(task) {
+    return normalizeMetadataValue(task.createdByUserDisplayName)
+        ?? normalizeMetadataValue(task.createdByUserEmail)
+        ?? normalizeMetadataValue(task.createdByUserId)
+        ?? 'Unknown';
+}
+function normalizeMetadataValue(value) {
+    const normalized = value?.trim();
+    return normalized ? normalized : null;
+}
+function TraceButton({ loading, onClick, stopPropagation = false, }) {
+    return (_jsxs("button", { className: `trace-open-button${loading ? ' loading' : ''}`, type: "button", onClick: (event) => {
+            if (stopPropagation)
+                event.stopPropagation();
+            onClick();
+        }, disabled: loading, "aria-busy": loading, children: [loading ? _jsx(InlineSpinner, {}) : _jsx(Waypoints, { "aria-hidden": "true" }), _jsx("span", { children: loading ? 'Loading trace' : 'Trace' })] }));
+}
+function TaskAccessSummary({ task, detailsOpen, onToggle, }) {
+    const counts = accessRequestCounts(groupedAccessRequests(task.accessRequests ?? []));
+    const total = counts.granted + counts.released + counts.waiting + counts.denied;
+    return (_jsx("button", { className: `task-access-summary${total === 0 ? ' task-details-summary' : ''}`, type: "button", onClick: onToggle, "aria-expanded": detailsOpen, "aria-label": accessSummaryLabel(counts, detailsOpen), title: detailsOpen ? 'Hide access details' : 'Show access details', children: total === 0 ? (_jsx("span", { className: "task-details-summary-label", children: "Details" })) : (_jsxs(_Fragment, { children: [counts.granted > 0 && _jsx(TaskAccessSummaryItem, { state: "granted", count: counts.granted }), counts.released > 0 && _jsx(TaskAccessSummaryItem, { state: "released", count: counts.released }), counts.waiting > 0 && _jsx(TaskAccessSummaryItem, { state: "waiting", count: counts.waiting }), counts.denied > 0 && _jsx(TaskAccessSummaryItem, { state: "denied", count: counts.denied })] })) }));
+}
+function TaskAccessSummaryItem({ state, count }) {
+    const Icon = accessRequestIcon(state);
+    return (_jsxs("span", { className: `task-access-summary-item ${state}`, children: [_jsx(Icon, { className: "task-access-summary-icon", "aria-hidden": "true" }), _jsx("span", { children: count })] }));
+}
+function TaskAccessChips({ task }) {
+    const requests = groupedAccessRequests(task.accessRequests ?? []);
+    if (requests.length === 0) {
+        return (_jsx("div", { className: "task-access-chips", "aria-label": "Agent access", children: _jsx("span", { className: "task-access-chip muted", children: "No access requests" }) }));
+    }
+    return (_jsx("div", { className: "task-access-chips", "aria-label": "Agent access", children: requests.map((request, index) => (_jsx(TaskAccessChip, { request: request, index: index }, accessRequestKey(request, index)))) }));
+}
+function TaskAccessChip({ request, index }) {
+    const state = accessRequestState(request);
+    const label = accessRequestLabel(request);
+    const Icon = accessRequestIcon(state);
+    const occurrences = accessRequestOccurrences(request);
+    return (_jsxs("span", { className: `task-access-chip ${state}`, title: `${label} ${request.level} access to ${request.target} at ${formatDateTime(accessRequestTime(request))}${occurrences > 1 ? ` (${occurrences} requests)` : ''}`, "aria-label": `${label} ${request.target} ${request.level}`, "data-access-index": index, children: [_jsx(Icon, { className: "task-access-icon", "aria-hidden": "true" }), _jsxs("span", { className: "task-access-text", children: [_jsx("strong", { children: request.target }), " ", request.level, occurrences > 1 ? ` x${occurrences}` : ''] })] }));
+}
+function groupedAccessRequests(requests) {
+    const groups = new Map();
+    for (const request of requests) {
+        const key = `${request.target.trim().toLowerCase()}\u0000${request.level.trim().toLowerCase()}`;
+        groups.set(key, [...(groups.get(key) ?? []), request]);
+    }
+    return Array.from(groups.values())
+        .map((group) => {
+        const ordered = [...group].sort((left, right) => Date.parse(left.requestedAt) - Date.parse(right.requestedAt));
+        const active = ordered.filter((request) => accessRequestState(request) !== 'released');
+        const selected = latestAccessRequest(active.length > 0 ? active : ordered);
+        return {
+            ...selected,
+            occurrences: ordered.length,
+            firstRequestedAt: ordered[0]?.requestedAt,
+            lastRequestedAt: ordered[ordered.length - 1]?.requestedAt,
+        };
+    })
+        .sort((left, right) => Date.parse(accessRequestTime(right)) - Date.parse(accessRequestTime(left)));
+}
+function latestAccessRequest(requests) {
+    return requests.reduce((latest, request) => (Date.parse(accessRequestTime(request)) >= Date.parse(accessRequestTime(latest)) ? request : latest), requests[0]);
+}
+function accessRequestState(request) {
+    if (request.status?.toLowerCase() === 'released' || request.releasedAt)
+        return 'released';
+    if (request.granted)
+        return 'granted';
+    const status = `${request.status ?? ''} ${request.message ?? ''}`.toLowerCase();
+    if (status.includes('wait') || status.includes('queue'))
+        return 'waiting';
+    return 'denied';
+}
+function accessRequestIcon(state) {
+    return state === 'granted' || state === 'released' ? Check : state === 'waiting' ? Hourglass : Square;
+}
+function accessRequestCounts(requests) {
+    return requests.reduce((counts, request) => {
+        counts[accessRequestState(request)] += 1;
+        return counts;
+    }, { granted: 0, released: 0, waiting: 0, denied: 0 });
+}
+function accessSummaryLabel(counts, detailsOpen) {
+    const parts = [
+        counts.granted > 0 ? `${counts.granted} granted` : null,
+        counts.released > 0 ? `${counts.released} released` : null,
+        counts.waiting > 0 ? `${counts.waiting} waiting` : null,
+        counts.denied > 0 ? `${counts.denied} denied` : null,
+    ].filter(Boolean);
+    if (parts.length === 0)
+        return `${detailsOpen ? 'Hide' : 'Show'} task details`;
+    return `${detailsOpen ? 'Hide' : 'Show'} access details: ${parts.join(', ')}`;
+}
+function accessRequestLabel(request) {
+    const state = accessRequestState(request);
+    return state === 'granted' ? 'Granted' : state === 'released' ? 'Released' : state === 'waiting' ? 'Waiting' : 'Denied';
+}
+function accessRequestTime(request) {
+    return request.releasedAt ?? request.requestedAt;
+}
+function accessRequestOccurrences(request) {
+    return request.occurrences ?? 1;
+}
+function accessRequestKey(request, index) {
+    return request.requestId || `${request.requestedAt}-${request.target}-${request.level}-${index}`;
+}
+export function AttachmentPicker({ attachments, disabled, compact, onChange, onProcessingChange, uploadAttachment, }) {
+    const inputRef = useRef(null);
+    const [processingFiles, setProcessingFiles] = useState([]);
+    const hasUploadingAttachments = attachments.some((attachment) => attachment.status === 'uploading');
+    const hasFailedAttachments = attachments.some((attachment) => attachment.status === 'failed');
+    const hasBlockingAttachments = hasUploadingAttachments || hasFailedAttachments;
+    const isProcessing = processingFiles.length > 0 || hasBlockingAttachments;
+    const preparingCount = Math.max(processingFiles.length, attachments.filter((attachment) => attachment.status === 'uploading').length);
+    const statusLabel = hasFailedAttachments && !hasUploadingAttachments && processingFiles.length === 0
+        ? 'Remove failed attachment before sending'
+        : compact ? 'Preparing attachments' : `Preparing ${preparingCount} attachment${preparingCount === 1 ? '' : 's'}`;
+    useEffect(() => {
+        onProcessingChange?.(isProcessing);
+    }, [isProcessing, onProcessingChange]);
+    async function addFiles(files) {
+        if (!files || disabled || isProcessing)
+            return;
+        const selectedFiles = Array.from(files).slice(0, 8);
+        const batchId = `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+        const pendingAttachments = selectedFiles.map((file) => ({
+            name: file.name,
+            contentType: file.type || 'text/plain',
+            content: '',
+            uploadId: `pending-${batchId}-${file.name}-${file.size}-${file.lastModified}`,
+            status: 'uploading',
+            progress: 0,
+            sizeBytes: file.size,
+        }));
+        let nextAttachments = [...attachments, ...pendingAttachments];
+        onChange(nextAttachments);
+        setProcessingFiles(selectedFiles.map((file) => file.name));
+        try {
+            for (let index = 0; index < selectedFiles.length; index += 1) {
+                const file = selectedFiles[index];
+                const pending = pendingAttachments[index];
+                const pendingId = pending.uploadId;
+                const setProgress = (progress) => {
+                    nextAttachments = nextAttachments.map((attachment) => attachment.uploadId === pendingId ? { ...attachment, progress } : attachment);
+                    onChange(nextAttachments);
+                };
+                try {
+                    const attachment = uploadAttachment
+                        ? await uploadAttachment(file, setProgress)
+                        : await readAttachment(file);
+                    nextAttachments = nextAttachments.map((item) => item.uploadId === pendingId ? {
+                        ...attachment,
+                        name: file.name,
+                        contentType: file.type || 'text/plain',
+                        sizeBytes: file.size,
+                        status: 'uploaded',
+                        progress: 100,
+                    } : item);
+                    onChange(nextAttachments);
+                }
+                catch (error) {
+                    nextAttachments = nextAttachments.map((item) => item.uploadId === pendingId ? {
+                        ...item,
+                        status: 'failed',
+                        progress: 0,
+                        error: error instanceof Error ? error.message : 'Upload failed.',
+                    } : item);
+                    onChange(nextAttachments);
+                }
+                setProcessingFiles(selectedFiles.slice(index + 1).map((item) => item.name));
+            }
+        }
+        finally {
+            setProcessingFiles([]);
+            if (inputRef.current)
+                inputRef.current.value = '';
+        }
+    }
+    return (_jsxs("div", { className: `attachment-picker${compact ? ' compact' : ''}`, children: [_jsx("input", { ref: inputRef, type: "file", multiple: true, onChange: (event) => void addFiles(event.target.files), disabled: disabled || isProcessing }), _jsxs("button", { type: "button", className: "attachment-button", disabled: disabled || isProcessing, onClick: () => inputRef.current?.click(), "aria-label": compact ? 'Attach files' : undefined, title: compact ? 'Attach files' : undefined, children: [_jsx(Paperclip, { "aria-hidden": "true" }), !compact && _jsx("span", { children: "Attach files" })] }), isProcessing && (_jsxs("div", { className: "attachment-status", role: "status", "aria-live": "polite", children: [!hasFailedAttachments && _jsx(InlineSpinner, {}), _jsx("span", { children: statusLabel })] })), attachments.length > 0 && (_jsx("div", { className: "attachment-list", children: attachments.map((attachment, index) => (_jsxs("span", { className: "attachment-chip", children: [_jsx("span", { children: attachment.name }), attachment.status === 'uploading' && _jsxs("small", { children: [Math.max(0, Math.min(100, Math.round(attachment.progress ?? 0))), "%"] }), attachment.status === 'failed' && _jsx("small", { children: attachment.error ?? 'Upload failed' }), _jsx("button", { type: "button", onClick: () => onChange(attachments.filter((_, itemIndex) => itemIndex !== index)), "aria-label": `Remove ${attachment.name}`, children: _jsx(X, { "aria-hidden": "true" }) })] }, `${attachment.name}-${index}`))) }))] }));
+}
+function CommandStatus({ status }) {
+    if (!status) {
+        return _jsx("span", { "aria-hidden": "true" });
+    }
+    const label = {
+        interrupting: 'Requesting interrupt',
+        'interrupt-accepted': 'Interrupt accepted',
+        steering: 'Sending steering',
+        'steer-accepted': 'Steering accepted',
+        failed: 'Command was not accepted',
+    }[status];
+    return (_jsx("span", { className: `command-status ${status === 'failed' ? 'error' : ''}`, role: "status", children: label }));
+}
+async function readAttachment(file) {
+    const maxAttachmentBytes = 10 * 1024 * 1024;
+    if (file.size > maxAttachmentBytes) {
+        return { content: `[Attachment omitted: ${file.name} is larger than 10 MB.]` };
+    }
+    const dataUrl = await readFileAsDataUrl(file);
+    return { content: dataUrl.split(',', 2)[1] ?? '', contentEncoding: 'base64' };
+}
+function readFileAsDataUrl(file) {
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onload = () => resolve(String(reader.result));
+        reader.onerror = () => reject(reader.error ?? Error('Unable to read attachment.'));
+        reader.readAsDataURL(file);
+    });
+}
+function formatTaskDetailTitle(task) {
+    return truncateWords(taskTitleText(task), 15) || formatTaskLabel(task);
+}
+function formatTaskFullTitle(task) {
+    return taskTitleText(task) || formatTaskLabel(task);
+}
+export function formatTaskLabel(task) {
+    return `Task: created: ${formatDateTime(task.createdAt)}, modified: ${formatDateTime(task.updatedAt ?? task.completedAt ?? task.startedAt ?? task.createdAt)}`;
+}
+export function taskTitleText(task) {
+    return collapseWhitespace(task.turns[0]?.content || task.message);
+}
+export function truncateWords(value, maxWords) {
+    const words = collapseWhitespace(value).split(' ').filter(Boolean);
+    if (words.length <= maxWords)
+        return words.join(' ');
+    return `${words.slice(0, maxWords).join(' ')}...`;
+}
+function isTaskFinishedStatus(status) {
+    const normalized = status.toLocaleLowerCase();
+    return normalized === 'closed'
+        || normalized === 'failed'
+        || normalized === 'error'
+        || normalized === 'cancelled'
+        || normalized === 'canceled';
+}
+function notifyTaskFinished(task) {
+    if (typeof window === 'undefined' || !('Notification' in window))
+        return;
+    const title = taskTitleText(task) || 'Task finished';
+    const body = `${capitalize(task.status)}.`;
+    const showNotification = () => {
+        try {
+            new Notification(title, { body, tag: `exoscient-task-${task.id}` });
+        }
+        catch {
+            // Some browsers expose Notification but still reject construction.
+        }
+    };
+    if (Notification.permission === 'granted') {
+        showNotification();
+        return;
+    }
+    if (Notification.permission === 'default') {
+        void Notification.requestPermission().then((permission) => {
+            if (permission === 'granted')
+                showNotification();
+        }).catch(() => { });
+    }
+}
+function taskTurnResult(task, turn, index) {
+    const split = splitAgentResult(taskTurnResultText(task, turn, index));
+    const turnTechnical = turn.technicalMessage?.trim();
+    if (turnTechnical) {
+        return {
+            owner: split.owner,
+            technical: turnTechnical,
+        };
+    }
+    if (index === task.turns.length - 1 && task.technicalMessage) {
+        return {
+            owner: split.owner || task.ownerMessage || '',
+            technical: task.technicalMessage,
+        };
+    }
+    return split;
+}
+function taskTurnResultText(task, turn, index) {
+    if (turn.output || turn.error)
+        return turn.output || turn.error || '';
+    if (index === task.turns.length - 1 && (task.ownerMessage || task.technicalMessage))
+        return task.ownerMessage || task.technicalMessage || '';
+    return index === task.turns.length - 1 ? task.latestResult || '' : '';
+}
+function taskSteeringMessages(task, index) {
+    if (index !== task.turns.length - 1)
+        return [];
+    return (task.steeringMessages ?? []).filter((item) => item.message.trim().length > 0);
+}
+function collapseWhitespace(value) {
+    return value.trim().replace(/\s+/g, ' ');
+}
+function SteeringMessages({ messages }) {
+    if (messages.length === 0)
+        return null;
+    return (_jsx("section", { className: "turn-panel steering-panel", "aria-label": "Steering messages", children: messages.map((item, index) => (_jsxs("div", { className: "steering-message", children: [_jsx(Send, { "aria-hidden": "true" }), _jsxs("div", { children: [_jsxs("div", { className: "steering-message-title", children: [_jsx("span", { children: "Steering" }), item.at && _jsx("time", { children: formatDateTime(item.at) })] }), _jsx("p", { children: item.message })] })] }, `${item.at ?? 'steering'}-${index}`))) }));
+}
+function TurnTitle({ index, timestamp }) {
+    return (_jsxs("div", { className: "turn-title", children: [_jsxs("h3", { children: ["#", index + 1] }), _jsx("time", { children: formatDateTime(timestamp) })] }));
+}
+function formatAgentTitle(turn, now) {
+    const duration = formatTurnDuration(turn, now);
+    return duration ? `AI agent, ${duration}` : 'AI agent';
+}
+function taskStatusContent(task, platformStatus) {
+    if (isTaskQueued(task)) {
+        return _jsx("span", { className: `status-text ${statusToneClass(task.status)}`, children: "Queued" });
+    }
+    if (task.busy) {
+        return _jsx(WorkingIndicator, { label: platformStatus.available ? 'Working' : 'The platform is down. Wait until it is back up', animate: platformStatus.available });
+    }
+    return _jsx("span", { className: `status-text ${statusToneClass(task.status)}`, children: taskStatusLabel(task.status) });
+}
+function formatCompletionTime(turn) {
+    const completedAt = turn.completedAt ?? turn.trace?.completedAt;
+    return completedAt ? formatDateTime(completedAt) : 'In progress';
+}
+function formatTurnDuration(turn, now = Date.now()) {
+    const completedAt = turn.completedAt ?? turn.trace?.completedAt;
+    if (!completedAt && !isTurnWorking(turn))
+        return '';
+    const startedAt = turn.startedAt ?? turn.trace?.startedAt ?? turn.createdAt;
+    const elapsedMs = (completedAt ? new Date(completedAt).getTime() : now) - new Date(startedAt).getTime();
+    if (!Number.isFinite(elapsedMs) || elapsedMs < 0)
+        return '';
+    const totalSeconds = Math.max(1, Math.round(elapsedMs / 1000));
+    const hours = Math.floor(totalSeconds / 3600);
+    const minutes = Math.floor((totalSeconds % 3600) / 60);
+    const seconds = totalSeconds % 60;
+    if (hours > 0)
+        return `${hours}h ${minutes}m`;
+    if (minutes > 0)
+        return `${minutes}m ${seconds}s`;
+    return `${seconds}s`;
+}
+export function formatDateTime(value) {
+    if (!value)
+        return '';
+    const date = new Date(value);
+    return Number.isFinite(date.getTime()) ? date.toLocaleString() : '';
+}
+function isTurnQueued(turn) {
+    return turn.status.trim().toLocaleLowerCase() === 'queued';
+}
+function isTurnWorking(turn) {
+    const normalized = turn.status.trim().toLocaleLowerCase();
+    return normalized === 'running' || normalized === 'working' || isTurnQueued(turn);
+}
+export function isTaskBusy(task) {
+    const normalized = task.status.trim().toLocaleLowerCase();
+    return task.busy || normalized === 'running' || normalized === 'working' || isTaskQueued(task);
+}
+export function isTaskQueued(task) {
+    return task.status.trim().toLocaleLowerCase() === 'queued';
+}
+export function useElapsedNow(active) {
+    const [now, setNow] = useState(() => Date.now());
+    useEffect(() => {
+        if (!active)
+            return;
+        const timer = window.setInterval(() => setNow(Date.now()), 1000);
+        return () => window.clearInterval(timer);
+    }, [active]);
+    return now;
+}
+export function capitalize(value) {
+    return value ? `${value.charAt(0).toLocaleUpperCase()}${value.slice(1)}` : value;
+}
+export function taskStatusLabel(status) {
+    const normalized = status.trim().toLocaleLowerCase();
+    if (normalized === 'waiting_for_user_continuation')
+        return 'Waiting for user continuation';
+    if (normalized === 'waiting_for_external_continuation')
+        return 'Waiting for external continuation';
+    if (normalized === 'closed')
+        return 'Closed';
+    if (normalized === 'working' || normalized === 'running' || normalized === 'in_progress')
+        return 'Working';
+    return capitalize(status.replace(/[_-]+/g, ' '));
+}
+export function statusToneClass(status) {
+    const normalized = status.trim().toLocaleLowerCase();
+    if (normalized === 'closed')
+        return 'status-success';
+    if (normalized === 'running' || normalized === 'working' || normalized === 'queued' || normalized === 'in_progress')
+        return 'status-active';
+    if (normalized === 'failed' || normalized === 'error' || normalized === 'cancelled' || normalized === 'canceled')
+        return 'status-danger';
+    return 'status-muted';
+}
+export function WorkingIndicator({ label = 'Working', animate = true }) {
+    return (_jsxs("span", { className: "working-indicator", role: "status", "aria-label": label, children: [_jsx("span", { children: label }), animate && (_jsxs("span", { className: "working-dots", "aria-hidden": "true", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }))] }));
+}
+export function InlineSpinner() {
+    return _jsx("span", { className: "inline-spinner", "aria-hidden": "true" });
+}
+export function LoadingState({ label }) {
+    return (_jsxs("div", { className: "loading-state", role: "status", "aria-live": "polite", children: [_jsx(InlineSpinner, {}), _jsx("span", { children: label })] }));
+}
+function TracePanel({ turn, turnIndex, loading, onCollapse, }) {
+    const isWorking = isTurnWorking(turn);
+    const [follow, setFollow] = useState(isWorking);
+    const [filters, setFilters] = useState(['narration']);
+    const scrollRef = useRef(null);
+    const events = turn.trace?.events ?? [];
+    const items = useMemo(() => buildTraceItems(events), [events]);
+    const contextPressure = useMemo(() => latestContextPressure(events), [events]);
+    const visibleItems = useMemo(() => items.filter((item) => traceItemMatchesFilter(item, filters)), [filters, items]);
+    useEffect(() => {
+        if (follow && scrollRef.current) {
+            scrollRef.current.scrollTop = scrollRef.current.scrollHeight;
+        }
+    }, [follow, visibleItems.length, events.length]);
+    return (_jsxs("div", { className: "trace-shell", children: [_jsxs("div", { className: "trace-toolbar", children: [_jsxs("div", { className: "trace-toolbar-summary", children: [_jsxs("span", { children: ["Request #", turnIndex + 1, " trace - ", events.length, " events"] }), contextPressure && (_jsxs("div", { className: `context-pressure context-pressure-${contextPressure.tone}`, title: contextPressure.label, children: [_jsxs("span", { children: ["Context ", contextPressure.percent, "%"] }), _jsx("div", { className: "context-pressure-meter", "aria-hidden": "true", children: _jsx("div", { className: "context-pressure-fill", style: { width: `${Math.min(contextPressure.percent, 100)}%` } }) })] }))] }), _jsxs("div", { className: "trace-toolbar-actions", children: [isWorking && (_jsx("button", { className: `trace-toggle-button${follow ? ' active' : ''}`, type: "button", onClick: () => setFollow((current) => !current), "aria-pressed": follow, children: "Follow" })), _jsx("button", { className: "trace-collapse-button", type: "button", onClick: onCollapse, "aria-label": "Close trace", title: "Close trace", children: _jsx(X, { "aria-hidden": "true" }) })] })] }), _jsx("div", { className: "trace-filter-bar", "aria-label": "Trace filters", children: traceFilterOptions.map((option) => (_jsx("button", { className: `trace-filter-button${filters.includes(option.value) ? ' active' : ''}`, type: "button", onClick: () => setFilters((current) => current.includes(option.value) ? current.filter((item) => item !== option.value) : [...current, option.value]), "aria-pressed": filters.includes(option.value), children: option.label }, option.value))) }), _jsxs("div", { className: "trace-list", ref: scrollRef, children: [loading && _jsx(LoadingState, { label: "Loading trace" }), !loading && items.length === 0 && _jsx("p", { className: "muted", children: "No trace events yet" }), !loading && items.length > 0 && visibleItems.length === 0 && _jsx("p", { className: "muted", children: "No events match this filter" }), visibleItems.map((item, index) => (_jsx(TraceItemView, { item: item }, `${item.kind}-${item.at}-${index}`)))] })] }));
+}
+const traceFilterOptions = [
+    { value: 'narration', label: 'Assistant Remarks' },
+    { value: 'coding', label: 'Coding' },
+    { value: 'shell', label: 'Shell Commands' },
+    { value: 'tokens', label: 'Token Usage' },
+    { value: 'status', label: 'Status' },
+    { value: 'errors', label: 'Errors' },
+    { value: 'raw', label: 'Raw' },
+];
+function TraceItemView({ item }) {
+    const label = item.kind === 'output'
+        ? item.stream ?? item.kind
+        : item.kind === 'raw'
+            ? item.label
+            : 'title' in item
+                ? item.title
+                : item.kind;
+    return (_jsxs("div", { className: `trace-event ${item.kind}`, children: [_jsxs("div", { className: "trace-event-header", children: [_jsx("span", { children: formatDateTime(item.at) || 'Unknown time' }), _jsx("strong", { children: label })] }), _jsx(TraceItemBody, { item: item })] }));
+}
+function TraceItemBody({ item }) {
+    if (item.kind === 'assistant' || item.kind === 'result') {
+        return _jsx(FormattedText, { text: item.text });
+    }
+    if (item.kind === 'command') {
+        return (_jsxs("div", { className: "trace-body", children: [item.status && _jsx("p", { className: "trace-meta", children: item.status }), item.command && _jsx("pre", { className: "trace-command", children: item.command }), item.output && _jsx("pre", { children: item.output }), item.raw && _jsx(RawDetails, { text: item.raw })] }));
+    }
+    if (item.kind === 'tool') {
+        return (_jsxs("div", { className: "trace-body", children: [item.status && _jsx("p", { className: "trace-meta", children: item.status }), item.input && _jsx("pre", { children: item.input }), item.output && _jsx("pre", { children: item.output }), item.raw && _jsx(RawDetails, { text: item.raw })] }));
+    }
+    if (item.kind === 'file') {
+        return (_jsxs("div", { className: "trace-body", children: [item.path && _jsx("p", { className: "trace-meta", children: item.path }), item.text && _jsx("pre", { children: item.text }), item.raw && _jsx(RawDetails, { text: item.raw })] }));
+    }
+    if (item.kind === 'status' || item.kind === 'error' || item.kind === 'tokens') {
+        return (_jsxs("div", { className: "trace-body", children: [_jsx(TraceTextOrJson, { text: item.text }), item.raw && _jsx(RawDetails, { text: item.raw })] }));
+    }
+    return _jsx(TraceTextOrJson, { text: item.text });
+}
+function RawDetails({ text }) {
+    return (_jsxs("details", { className: "raw-details", children: [_jsx("summary", { children: "Raw event" }), _jsx(TraceTextOrJson, { text: text })] }));
+}
+function TraceTextOrJson({ text }) {
+    const json = parseTraceJson(text);
+    if (json !== undefined) {
+        return _jsx(JsonTree, { value: json });
+    }
+    return _jsx("pre", { children: text });
+}
+function JsonTree({ value }) {
+    if (Array.isArray(value)) {
+        return (_jsx("ol", { className: "json-tree json-array", children: value.map((entry, index) => (_jsxs("li", { children: [_jsx("span", { className: "json-key", children: index }), _jsx(JsonTree, { value: entry })] }, index))) }));
+    }
+    if (isJsonObject(value)) {
+        const entries = Object.entries(value);
+        return (_jsx("ul", { className: "json-tree", children: entries.map(([key, entry]) => (_jsxs("li", { children: [_jsx("span", { className: "json-key", children: key }), _jsx(JsonTree, { value: entry })] }, key))) }));
+    }
+    return _jsx("span", { className: `json-value ${value === null ? 'null' : typeof value}`, children: formatJsonScalar(value) });
+}
+function parseTraceJson(text) {
+    const trimmed = text.trim();
+    if (!trimmed || (!trimmed.startsWith('{') && !trimmed.startsWith('[')))
+        return undefined;
+    try {
+        return normalizeTraceJson(JSON.parse(trimmed));
+    }
+    catch {
+        return undefined;
+    }
+}
+function normalizeTraceJson(value, depth = 0) {
+    if (depth > 6)
+        return value;
+    if (typeof value === 'string') {
+        const trimmed = value.trim();
+        if ((trimmed.startsWith('{') && trimmed.endsWith('}')) || (trimmed.startsWith('[') && trimmed.endsWith(']'))) {
+            try {
+                return normalizeTraceJson(JSON.parse(trimmed), depth + 1);
+            }
+            catch {
+                return value;
+            }
+        }
+        return value;
+    }
+    if (Array.isArray(value)) {
+        return value.map((entry) => normalizeTraceJson(entry, depth + 1));
+    }
+    if (isJsonObject(value)) {
+        return Object.fromEntries(Object.entries(value).map(([key, entry]) => [key, normalizeTraceJson(entry, depth + 1)]));
+    }
+    return value;
+}
+function formatJsonScalar(value) {
+    if (value === null)
+        return 'null';
+    if (typeof value === 'string')
+        return value;
+    if (typeof value === 'number' || typeof value === 'boolean')
+        return String(value);
+    return '';
+}
+function isJsonObject(value) {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+}
+function FormattedText({ text }) {
+    const blocks = parseMarkdownBlocks(text);
+    return (_jsx("div", { className: "formatted-text", children: blocks.map((block, index) => renderMarkdownBlock(block, index)) }));
+}
+function parseMarkdownBlocks(text) {
+    const lines = text.replace(/\r\n?/g, '\n').split('\n');
+    const blocks = [];
+    let index = 0;
+    while (index < lines.length) {
+        const line = lines[index];
+        if (line.trim() === '') {
+            index += 1;
+            continue;
+        }
+        const fence = line.match(/^```([a-zA-Z0-9_-]+)?\s*$/);
+        if (fence) {
+            const codeLines = [];
+            index += 1;
+            while (index < lines.length && !/^```\s*$/.test(lines[index])) {
+                codeLines.push(lines[index]);
+                index += 1;
+            }
+            if (index < lines.length)
+                index += 1;
+            blocks.push({ type: 'code', text: codeLines.join('\n'), language: fence[1] });
+            continue;
+        }
+        const heading = line.match(/^(#{1,6})\s+(.+)$/);
+        if (heading) {
+            blocks.push({ type: 'heading', depth: heading[1].length, text: heading[2].trim() });
+            index += 1;
+            continue;
+        }
+        const unordered = line.match(/^\s*[-*]\s+(.+)$/);
+        if (unordered) {
+            const items = [];
+            while (index < lines.length) {
+                const item = lines[index].match(/^\s*[-*]\s+(.+)$/);
+                if (!item)
+                    break;
+                items.push(item[1].trim());
+                index += 1;
+            }
+            blocks.push({ type: 'unordered-list', items });
+            continue;
+        }
+        const ordered = line.match(/^\s*\d+[.)]\s+(.+)$/);
+        if (ordered) {
+            const items = [];
+            while (index < lines.length) {
+                const item = lines[index].match(/^\s*\d+[.)]\s+(.+)$/);
+                if (!item)
+                    break;
+                items.push(item[1].trim());
+                index += 1;
+            }
+            blocks.push({ type: 'ordered-list', items });
+            continue;
+        }
+        const paragraphLines = [];
+        while (index < lines.length) {
+            const current = lines[index];
+            if (current.trim() === ''
+                || /^```([a-zA-Z0-9_-]+)?\s*$/.test(current)
+                || /^(#{1,6})\s+(.+)$/.test(current)
+                || /^\s*[-*]\s+(.+)$/.test(current)
+                || /^\s*\d+[.)]\s+(.+)$/.test(current)) {
+                break;
+            }
+            paragraphLines.push(current);
+            index += 1;
+        }
+        blocks.push({ type: 'paragraph', text: paragraphLines.join('\n').trimEnd() });
+    }
+    return blocks.length === 0 ? [{ type: 'paragraph', text }] : blocks;
+}
+function renderMarkdownBlock(block, index) {
+    switch (block.type) {
+        case 'code':
+            return _jsx("pre", { className: "code-block", "data-language": block.language, children: block.text }, index);
+        case 'heading':
+            return _jsx(MarkdownHeading, { depth: block.depth, text: block.text }, index);
+        case 'unordered-list':
+            return _jsx("ul", { children: block.items.map((item, itemIndex) => _jsx("li", { children: renderInlineMarkdown(item, `u-${index}-${itemIndex}`) }, itemIndex)) }, index);
+        case 'ordered-list':
+            return _jsx("ol", { children: block.items.map((item, itemIndex) => _jsx("li", { children: renderInlineMarkdown(item, `o-${index}-${itemIndex}`) }, itemIndex)) }, index);
+        case 'paragraph':
+            return _jsx("p", { children: renderInlineMarkdown(block.text, `p-${index}`) }, index);
+    }
+}
+function MarkdownHeading({ depth, text }) {
+    const children = renderInlineMarkdown(text, `h-${depth}-${text}`);
+    if (depth <= 2)
+        return _jsx("h4", { children: children });
+    if (depth === 3)
+        return _jsx("h5", { children: children });
+    return _jsx("h6", { children: children });
+}
+function renderInlineMarkdown(text, keyPrefix) {
+    const nodes = [];
+    let index = 0;
+    let nodeIndex = 0;
+    const pushText = (value) => {
+        if (value)
+            nodes.push(value);
+    };
+    while (index < text.length) {
+        if (text[index] === '`') {
+            const end = text.indexOf('`', index + 1);
+            if (end > index + 1) {
+                nodes.push(_jsx("code", { children: text.slice(index + 1, end) }, `${keyPrefix}-code-${nodeIndex++}`));
+                index = end + 1;
+                continue;
+            }
+        }
+        if (text.startsWith('**', index)) {
+            const end = text.indexOf('**', index + 2);
+            if (end > index + 2) {
+                nodes.push(_jsx("strong", { children: renderInlineMarkdown(text.slice(index + 2, end), `${keyPrefix}-strong-${nodeIndex}`) }, `${keyPrefix}-strong-${nodeIndex++}`));
+                index = end + 2;
+                continue;
+            }
+        }
+        if (text[index] === '*') {
+            const end = text.indexOf('*', index + 1);
+            if (end > index + 1) {
+                nodes.push(_jsx("em", { children: renderInlineMarkdown(text.slice(index + 1, end), `${keyPrefix}-em-${nodeIndex}`) }, `${keyPrefix}-em-${nodeIndex++}`));
+                index = end + 1;
+                continue;
+            }
+        }
+        if (text[index] === '[') {
+            const textEnd = text.indexOf(']', index + 1);
+            const hrefStart = textEnd >= 0 ? text.indexOf('(', textEnd) : -1;
+            const hrefEnd = hrefStart === textEnd + 1 ? text.indexOf(')', hrefStart + 1) : -1;
+            if (textEnd > index + 1 && hrefEnd > hrefStart + 1) {
+                const label = text.slice(index + 1, textEnd);
+                const href = text.slice(hrefStart + 1, hrefEnd).trim();
+                nodes.push(isSafeMarkdownHref(href)
+                    ? _jsx("a", { href: href, rel: "noreferrer", target: "_blank", children: renderInlineMarkdown(label, `${keyPrefix}-link-${nodeIndex}`) }, `${keyPrefix}-link-${nodeIndex++}`)
+                    : label);
+                index = hrefEnd + 1;
+                continue;
+            }
+        }
+        const nextSpecial = nextMarkdownSpecialIndex(text, index + 1);
+        pushText(text.slice(index, nextSpecial));
+        index = nextSpecial;
+    }
+    return nodes;
+}
+function nextMarkdownSpecialIndex(text, start) {
+    const indexes = ['`', '*', '[']
+        .map((character) => text.indexOf(character, start))
+        .filter((value) => value >= 0);
+    return indexes.length > 0 ? Math.min(...indexes) : text.length;
+}
+function isSafeMarkdownHref(href) {
+    return /^(https?:|mailto:|tel:|\/|#)/i.test(href);
+}
+//# sourceMappingURL=TaskDetail.js.map