jupyterlab-codex-sidebar 0.1.5 → 0.1.6

package/lib/codexChat.js

@@ -12,10 +12,11 @@ import { STORAGE_KEY_SESSION_THREADS, STORAGE_KEY_SESSION_THREADS_EVENT, buildSe
 import { createSession as createBaseSession, createThreadResetSession as createBaseThreadResetSession } from './codexChatSessionFactory';
 import { resolveCurrentSessionKey, resolveSessionKey } from './codexChatSessionKey';
 import { resolveMessageSessionKey as resolveMessageSessionKeyForMessage } from './codexSessionResolver';
-import { MESSAGE_SELECTION_PREVIEW_STORED_MAX_CHARS, captureDocumentViewState, findDocumentWidgetByPath, getActiveCellOutput, getActiveCellText, getActiveDocumentWidget, getDocumentContext, getSelectedContext, getSelectedTextFromActiveCell, getSelectedTextFromFileEditor, getSupportedDocumentPath, normalizeSelectionPreviewText, restoreDocumentViewState, toCellOutputPreview, toFallbackSelectionPreview, } from './codexChatDocumentUtils';
+import { MESSAGE_SELECTION_PREVIEW_STORED_MAX_CHARS, captureDocumentViewState, findDocumentWidgetByPath, getActiveCellOutput, getActiveCellText, getActiveDocumentWidget, getDocumentContext, getSelectedContext, getSelectedTextFromActiveCell, getSelectedTextFromFileEditor, getSupportedDocumentPath, isNotebookWidget, normalizeSelectionPreviewText, restoreDocumentViewState, toCellOutputPreview, toMessageSelectionPreview, } from './codexChatDocumentUtils';
+import { resolveCellAttachmentState } from './codexChatAttachmentState';
 import { buildActiveCellOutputSignature, buildActiveCellSelectionSignature, isDuplicateActiveCellAttachmentSignature, makeActiveCellAttachmentDedupKey } from './codexChatAttachmentDedup';
-import { buildAttachmentTruncationNotice, limitActiveCellAttachmentPayload } from './codexChatAttachmentLimit';
-import { ArrowDownIcon, ArrowUpIcon, CheckIcon, ContextWindowIcon, FileIcon, GearIcon, ImageIcon, PlusIcon, PortalMenu, ReasoningEffortIcon, ShieldIcon, StopIcon, XIcon, BatteryIcon } from './codexChatPrimitives';
+import { buildAttachmentTruncationNotice, limitActiveCellAttachmentPayload, resolveSentAttachmentTruncation } from './codexChatAttachmentLimit';
+import { ArrowDownIcon, ArrowUpIcon, BatteryIcon, CellAttachmentIcon, CheckIcon, ContextWindowIcon, FileIcon, GearIcon, ImageIcon, PlusIcon, PortalMenu, ReasoningEffortIcon, ShieldIcon, StopIcon, XIcon } from './codexChatPrimitives';
 import { hasStoredValue, safeLocalStorageGet, safeLocalStorageRemove, safeLocalStorageSet } from './codexChatStorage';
 const truncateEnd = truncateEndShared;
 export class CodexPanel extends ReactWidget {
@@ -93,7 +94,8 @@ const SELECTION_PREVIEWS_STORAGE_KEY = 'jupyterlab-codex:selection-previews';
 const MAX_IMAGE_ATTACHMENTS = 4;
 const MAX_IMAGE_ATTACHMENT_BYTES = 4 * 1024 * 1024; // Avoid huge WebSocket payloads.
 const MAX_IMAGE_ATTACHMENT_TOTAL_BYTES = 6 * 1024 * 1024;
-const MAX_ACTIVE_CELL_ATTACHMENT_TOTAL_CHARS = 4000;
+const MAX_ACTIVE_CELL_SELECTION_CHARS = 4000;
+const MAX_ACTIVE_CELL_OUTPUT_CHARS = 20000;
 const MAX_STORED_SELECTION_PREVIEW_THREADS = 80;
 const MAX_STORED_SELECTION_PREVIEW_MESSAGES_PER_THREAD = 10;
 const MAX_SESSION_MESSAGES = 100;
@@ -444,7 +446,7 @@ function CodexChat(props) {
     const [autoSaveBeforeSend, setAutoSaveBeforeSend] = useState(() => readStoredAutoSave());
     const [includeActiveCell, setIncludeActiveCell] = useState(() => readStoredIncludeActiveCell());
     const [includeActiveCellOutput, setIncludeActiveCellOutput] = useState(() => readStoredIncludeActiveCellOutput());
-    const [excludeCellAttachmentForNextSend, setExcludeCellAttachmentForNextSend] = useState(false);
+    const [currentDocumentIsNotebookEditor, setCurrentDocumentIsNotebookEditor] = useState(false);
     const [notifyOnDone, setNotifyOnDone] = useState(() => readStoredNotifyOnDone());
     const [notifyOnDoneMinSeconds, setNotifyOnDoneMinSeconds] = useState(() => readStoredNotifyOnDoneMinSeconds());
     const [settingsOpen, setSettingsOpen] = useState(() => readStoredSettingsOpen());
@@ -463,7 +465,9 @@ function CodexChat(props) {
     const [reasoningMenuOpen, setReasoningMenuOpen] = useState(false);
     const [usagePopoverOpen, setUsagePopoverOpen] = useState(false);
     const [permissionMenuOpen, setPermissionMenuOpen] = useState(false);
+    const [contextPopoverOpen, setContextPopoverOpen] = useState(false);
     const [isPlainPyRunInProgress, setIsPlainPyRunInProgress] = useState(false);
+    const [cellAttachmentPopoverOpen, setCellAttachmentPopoverOpen] = useState(false);
     const [selectionPopover, setSelectionPopover] = useState(null);
     const storedSelectionPreviewsRef = useRef(readStoredSelectionPreviewsByThread());
     const previousSessionThreadIdsRef = useRef(new Map());
@@ -486,6 +490,7 @@ function CodexChat(props) {
     const reasoningMenuWrapRef = useRef(null);
     const usageMenuWrapRef = useRef(null);
     const permissionMenuWrapRef = useRef(null);
+    const contextMenuWrapRef = useRef(null);
     const modelBtnRef = useRef(null);
     const modelPopoverRef = useRef(null);
     const reasoningBtnRef = useRef(null);
@@ -494,7 +499,13 @@ function CodexChat(props) {
     const usagePopoverRef = useRef(null);
     const permissionBtnRef = useRef(null);
     const permissionPopoverRef = useRef(null);
+    const contextBtnRef = useRef(null);
+    const contextPopoverRef = useRef(null);
     const plainPyRunSessionKeyRef = useRef('');
+    const cellAttachmentAnchorRef = useRef(null);
+    const cellAttachmentPopoverRef = useRef(null);
+    const cellAttachmentPopoverCloseTimerRef = useRef(null);
+    const contextPopoverCloseTimerRef = useRef(null);
     const selectionPopoverAnchorRef = useRef(null);
     const selectionPopoverRef = useRef(null);
     const notebookLabelRef = useRef(null);
@@ -643,12 +654,6 @@ function CodexChat(props) {
     useEffect(() => {
         persistIncludeActiveCellOutput(includeActiveCellOutput);
     }, [includeActiveCellOutput]);
-    useEffect(() => {
-        // Reset one-time exclusion when the base setting is turned off.
-        if (!includeActiveCell && excludeCellAttachmentForNextSend) {
-            setExcludeCellAttachmentForNextSend(false);
-        }
-    }, [includeActiveCell, excludeCellAttachmentForNextSend]);
     useEffect(() => {
         persistCommandPath(commandPath);
     }, [commandPath]);
@@ -671,7 +676,7 @@ function CodexChat(props) {
         persistNotifyOnDoneMinSeconds(normalized);
     }, [notifyOnDoneMinSeconds]);
     useEffect(() => {
-        if (!modelMenuOpen && !reasoningMenuOpen && !usagePopoverOpen && !permissionMenuOpen) {
+        if (!modelMenuOpen && !reasoningMenuOpen && !usagePopoverOpen && !permissionMenuOpen && !contextPopoverOpen) {
             return;
         }
         const onPointerDown = (event) => {
@@ -683,24 +688,29 @@ function CodexChat(props) {
             const inReasoning = reasoningMenuWrapRef.current?.contains(target) ?? false;
             const inUsage = usageMenuWrapRef.current?.contains(target) ?? false;
             const inPermission = permissionMenuWrapRef.current?.contains(target) ?? false;
+            const inContext = contextMenuWrapRef.current?.contains(target) ?? false;
             const inModelPopover = modelPopoverRef.current?.contains(target) ?? false;
             const inReasoningPopover = reasoningPopoverRef.current?.contains(target) ?? false;
             const inUsagePopover = usagePopoverRef.current?.contains(target) ?? false;
             const inPermissionPopover = permissionPopoverRef.current?.contains(target) ?? false;
+            const inContextPopover = contextPopoverRef.current?.contains(target) ?? false;
             if (inModel ||
                 inReasoning ||
                 inUsage ||
                 inPermission ||
+                inContext ||
                 inModelPopover ||
                 inReasoningPopover ||
                 inUsagePopover ||
-                inPermissionPopover) {
+                inPermissionPopover ||
+                inContextPopover) {
                 return;
             }
             setModelMenuOpen(false);
             setReasoningMenuOpen(false);
             setUsagePopoverOpen(false);
             setPermissionMenuOpen(false);
+            setContextPopoverOpen(false);
         };
         const onKeyDown = (event) => {
             if (event.key !== 'Escape') {
@@ -711,6 +721,7 @@ function CodexChat(props) {
             setReasoningMenuOpen(false);
             setUsagePopoverOpen(false);
             setPermissionMenuOpen(false);
+            setContextPopoverOpen(false);
         };
         window.addEventListener('pointerdown', onPointerDown, true);
         window.addEventListener('keydown', onKeyDown);
@@ -718,7 +729,7 @@ function CodexChat(props) {
             window.removeEventListener('pointerdown', onPointerDown, true);
             window.removeEventListener('keydown', onKeyDown);
         };
-    }, [modelMenuOpen, reasoningMenuOpen, usagePopoverOpen, permissionMenuOpen]);
+    }, [modelMenuOpen, reasoningMenuOpen, usagePopoverOpen, permissionMenuOpen, contextPopoverOpen]);
     useEffect(() => {
         if (!selectionPopover) {
             return;
@@ -755,6 +766,66 @@ function CodexChat(props) {
         setSelectionPopover(null);
         selectionPopoverAnchorRef.current = null;
     }
+    function clearCellAttachmentPopoverCloseTimer() {
+        if (cellAttachmentPopoverCloseTimerRef.current !== null) {
+            window.clearTimeout(cellAttachmentPopoverCloseTimerRef.current);
+            cellAttachmentPopoverCloseTimerRef.current = null;
+        }
+    }
+    function clearContextPopoverCloseTimer() {
+        if (contextPopoverCloseTimerRef.current !== null) {
+            window.clearTimeout(contextPopoverCloseTimerRef.current);
+            contextPopoverCloseTimerRef.current = null;
+        }
+    }
+    function openCellAttachmentPopover() {
+        clearCellAttachmentPopoverCloseTimer();
+        if (!showCellAttachmentBadge) {
+            setCellAttachmentPopoverOpen(false);
+            return;
+        }
+        setCellAttachmentPopoverOpen(true);
+    }
+    function scheduleCloseCellAttachmentPopover() {
+        clearCellAttachmentPopoverCloseTimer();
+        cellAttachmentPopoverCloseTimerRef.current = window.setTimeout(() => {
+            setCellAttachmentPopoverOpen(false);
+            cellAttachmentPopoverCloseTimerRef.current = null;
+        }, 90);
+    }
+    function openContextPopover() {
+        clearContextPopoverCloseTimer();
+        if (!hasContextUsageSnapshot) {
+            setContextPopoverOpen(false);
+            return;
+        }
+        setContextPopoverOpen(true);
+    }
+    function scheduleCloseContextPopover() {
+        clearContextPopoverCloseTimer();
+        contextPopoverCloseTimerRef.current = window.setTimeout(() => {
+            setContextPopoverOpen(false);
+            contextPopoverCloseTimerRef.current = null;
+        }, 90);
+    }
+    function handleContextPopoverBlur(event) {
+        const nextFocused = event.relatedTarget;
+        const inAnchor = nextFocused ? contextMenuWrapRef.current?.contains(nextFocused) ?? false : false;
+        const inPopover = nextFocused ? contextPopoverRef.current?.contains(nextFocused) ?? false : false;
+        if (inAnchor || inPopover) {
+            return;
+        }
+        scheduleCloseContextPopover();
+    }
+    function handleCellAttachmentBlur(event) {
+        const nextFocused = event.relatedTarget;
+        const inAnchor = nextFocused ? cellAttachmentAnchorRef.current?.contains(nextFocused) ?? false : false;
+        const inPopover = nextFocused ? cellAttachmentPopoverRef.current?.contains(nextFocused) ?? false : false;
+        if (inAnchor || inPopover) {
+            return;
+        }
+        scheduleCloseCellAttachmentPopover();
+    }
     function toggleSelectionPopover(messageId, preview, event) {
         if (!messageId) {
             return;
@@ -932,6 +1003,7 @@ function CodexChat(props) {
         setModelMenuOpen(false);
         setReasoningMenuOpen(false);
         setPermissionMenuOpen(false);
+        setContextPopoverOpen(false);
     }
     async function updateNotifyOnDone(enabled) {
         if (!enabled) {
@@ -1428,6 +1500,8 @@ function CodexChat(props) {
             if (activeWidget) {
                 activeDocumentWidgetRef.current = activeWidget;
             }
+            const nextIsNotebookEditor = isNotebookWidget(activeWidget);
+            setCurrentDocumentIsNotebookEditor(prev => (prev === nextIsNotebookEditor ? prev : nextIsNotebookEditor));
             const path = getSupportedDocumentPath(activeWidget);
             const sessionKey = resolveSessionKey(path);
             const previousKey = currentNotebookSessionKeyRef.current;
@@ -1472,23 +1546,6 @@ function CodexChat(props) {
             props.notebooks.currentChanged.disconnect(updateNotebook);
         };
     }, [props.app, props.notebooks]);
-    useEffect(() => {
-        const onActiveCellChanged = (_tracker, _cell) => {
-            if (!includeActiveCell || !excludeCellAttachmentForNextSend) {
-                return;
-            }
-            const currentNotebookWidget = props.notebooks.currentWidget;
-            const currentNotebookWidgetPath = getSupportedDocumentPath(currentNotebookWidget);
-            if (!currentNotebookWidgetPath || currentNotebookWidgetPath !== currentNotebookPathRef.current) {
-                return;
-            }
-            setExcludeCellAttachmentForNextSend(false);
-        };
-        props.notebooks.activeCellChanged.connect(onActiveCellChanged);
-        return () => {
-            props.notebooks.activeCellChanged.disconnect(onActiveCellChanged);
-        };
-    }, [props.notebooks, includeActiveCell, excludeCellAttachmentForNextSend]);
     useEffect(() => {
         const onStorage = (event) => {
             if (event.key !== STORAGE_KEY_SESSION_THREADS_EVENT || !event.newValue) {
@@ -1935,8 +1992,7 @@ function CodexChat(props) {
         const selectedTextForContext = selectedContext?.text || '';
         let includeSelectionKey = false;
         let selection = '';
-        const includeActiveCellForNextSend = includeActiveCell && !excludeCellAttachmentForNextSend;
-        if (includeActiveCellForNextSend) {
+        if (includeActiveCell) {
             if (notebookMode === 'plain_py') {
                 const selectedText = selectedTextForContext || getSelectedTextFromActiveCell(activeWidget) || getSelectedTextFromFileEditor(activeWidget);
                 if (selectedText) {
@@ -1950,21 +2006,23 @@ function CodexChat(props) {
                     selectedTextForContext || getActiveCellText(activeWidget) || getSelectedTextFromFileEditor(activeWidget);
             }
         }
-        const includeCellOutputKey = includeActiveCellForNextSend && includeActiveCellOutput && notebookMode === 'ipynb';
+        const includeCellOutputKey = includeActiveCell &&
+            includeActiveCellOutput &&
+            (notebookMode === 'ipynb' || notebookMode === 'jupytext_py');
         const cellOutputRaw = includeCellOutputKey ? getActiveCellOutput(activeWidget) : '';
-        const attachmentLimit = limitActiveCellAttachmentPayload(includeSelectionKey ? selection : '', includeCellOutputKey ? cellOutputRaw : '', MAX_ACTIVE_CELL_ATTACHMENT_TOTAL_CHARS);
+        const attachmentLimit = limitActiveCellAttachmentPayload(includeSelectionKey ? selection : '', includeCellOutputKey ? cellOutputRaw : '', MAX_ACTIVE_CELL_SELECTION_CHARS, MAX_ACTIVE_CELL_OUTPUT_CHARS);
         const selectionForAttachment = includeSelectionKey ? attachmentLimit.selection : '';
         const cellOutputForAttachment = includeCellOutputKey ? attachmentLimit.cellOutput : '';
         const includeSelectionKeyAfterLimit = Boolean(selectionForAttachment);
         const includeCellOutputKeyAfterLimit = Boolean(cellOutputForAttachment);
         const messageSelectionPreview = includeSelectionKeyAfterLimit
-            ? toFallbackSelectionPreview(activeWidget, notebookMode, selectionForAttachment)
+            ? toMessageSelectionPreview(selectedContext, activeWidget, notebookMode, selectionForAttachment)
             : undefined;
         const messageCellOutputPreview = includeCellOutputKeyAfterLimit
             ? toCellOutputPreview(selectedContext, activeWidget, notebookMode, cellOutputForAttachment)
             : undefined;
-        const shouldDeduplicateSelection = includeActiveCellForNextSend && includeSelectionKeyAfterLimit;
-        const shouldDeduplicateCellOutput = includeActiveCellForNextSend && includeCellOutputKeyAfterLimit;
+        const shouldDeduplicateSelection = includeActiveCell && includeSelectionKeyAfterLimit;
+        const shouldDeduplicateCellOutput = includeActiveCell && includeCellOutputKeyAfterLimit;
         const activeCellAttachmentDedupKey = makeActiveCellAttachmentDedupKey(sessionKey, session.threadId);
         const previousActiveCellSignatures = lastActiveCellAttachmentSignatureRef.current.get(activeCellAttachmentDedupKey);
         const activeCellSelectionSignature = shouldDeduplicateSelection
@@ -1987,6 +2045,12 @@ function CodexChat(props) {
             isDuplicateActiveCellAttachmentSignature(previousActiveCellSignatures?.cellOutputSignature, activeCellOutputSignature);
         const includeSelectionKeyForSend = includeSelectionKeyAfterLimit && !hasDuplicateSelectionAttachment;
         const includeCellOutputKeyForSend = includeCellOutputKeyAfterLimit && !hasDuplicateCellOutputAttachment;
+        const sentAttachmentTruncation = resolveSentAttachmentTruncation({
+            includeSelection: includeSelectionKeyForSend,
+            includeCellOutput: includeCellOutputKeyForSend,
+            selectionTruncated: attachmentLimit.selectionTruncated,
+            cellOutputTruncated: attachmentLimit.cellOutputTruncated
+        });
         const messageSelectionPreviewForSend = hasDuplicateSelectionAttachment ? undefined : messageSelectionPreview;
         const messageCellOutputPreviewForSend = hasDuplicateCellOutputAttachment ? undefined : messageCellOutputPreview;
         const messageContextPreview = messageSelectionPreviewForSend || messageCellOutputPreviewForSend
@@ -2030,8 +2094,8 @@ function CodexChat(props) {
             sandbox: sandboxForSend,
             ...(includeSelectionKeyForSend ? { selection: selectionForAttachment } : {}),
             ...(includeCellOutputKeyForSend ? { cellOutput: cellOutputForAttachment } : {}),
-            ...(attachmentLimit.selectionTruncated ? { selectionTruncated: true } : {}),
-            ...(attachmentLimit.cellOutputTruncated ? { cellOutputTruncated: true } : {}),
+            ...(sentAttachmentTruncation.selectionTruncated ? { selectionTruncated: true } : {}),
+            ...(sentAttachmentTruncation.cellOutputTruncated ? { cellOutputTruncated: true } : {}),
             ...(images ? { images } : {}),
             ...(messageSelectionPreviewForSend ? { uiSelectionPreview: messageSelectionPreviewForSend } : {}),
             ...(messageCellOutputPreviewForSend ? { uiCellOutputPreview: messageCellOutputPreviewForSend } : {})
@@ -2057,7 +2121,7 @@ function CodexChat(props) {
         appendStoredSelectionPreviewEntry(session.threadId, content, messageContextPreview);
         const imageCount = images ? images.length : 0;
         const showReadOnlyWarning = sandboxForSend === 'read-only';
-        const attachmentTruncationNotice = buildAttachmentTruncationNotice(attachmentLimit.selectionTruncated, attachmentLimit.cellOutputTruncated, MAX_ACTIVE_CELL_ATTACHMENT_TOTAL_CHARS);
+        const attachmentTruncationNotice = buildAttachmentTruncationNotice(sentAttachmentTruncation.selectionTruncated, sentAttachmentTruncation.cellOutputTruncated, MAX_ACTIVE_CELL_SELECTION_CHARS, MAX_ACTIVE_CELL_OUTPUT_CHARS);
         if (notebookMode === 'plain_py' || notebookMode === 'jupytext_py') {
             plainPyRunSessionKeyRef.current = sessionKey;
             setIsPlainPyRunInProgress(true);
@@ -2156,13 +2220,36 @@ function CodexChat(props) {
     const displayPath = currentNotebookPath
         ? currentNotebookPath.split('/').pop() || 'Untitled'
         : 'No notebook';
-    const includeActiveCellForNextSend = includeActiveCell && !excludeCellAttachmentForNextSend;
     const composerNotebookMode = currentSession?.notebookMode ?? inferNotebookModeFromPath(currentNotebookPath);
-    const includeCellOutputForNextSend = includeActiveCellForNextSend && includeActiveCellOutput && composerNotebookMode === 'ipynb';
-    const showCellAttachmentBadge = includeActiveCellForNextSend &&
-        composerNotebookMode !== 'plain_py' &&
-        currentNotebookPath.length > 0 &&
-        currentSession?.pairedOk !== false;
+    const cellAttachmentState = resolveCellAttachmentState({
+        includeActiveCell,
+        includeActiveCellOutput,
+        notebookMode: composerNotebookMode,
+        isNotebookEditor: currentDocumentIsNotebookEditor,
+        currentNotebookPath,
+        pairedOk: currentSession?.pairedOk
+    });
+    const includeCellOutputForNextSend = cellAttachmentState.outputEnabled;
+    const showCellAttachmentBadge = cellAttachmentState.showBadge;
+    const cellAttachmentContentEnabled = cellAttachmentState.contentEnabled;
+    const cellAttachmentOutputEnabled = cellAttachmentState.outputEnabled;
+    useEffect(() => {
+        if (showCellAttachmentBadge) {
+            return;
+        }
+        setCellAttachmentPopoverOpen(false);
+        clearCellAttachmentPopoverCloseTimer();
+    }, [showCellAttachmentBadge]);
+    useEffect(() => {
+        return () => {
+            clearCellAttachmentPopoverCloseTimer();
+        };
+    }, []);
+    useEffect(() => {
+        return () => {
+            clearContextPopoverCloseTimer();
+        };
+    }, []);
     const trimmedInput = input.trim();
     const canSend = status !== 'disconnected' &&
         currentNotebookPath.length > 0 &&
@@ -2244,6 +2331,13 @@ function CodexChat(props) {
         ? `${Math.round(clampNumber(contextUsedPercent, 0, 100))}%`
         : 'Unknown';
     const hasContextUsageSnapshot = rateLimits?.contextWindow != null;
+    useEffect(() => {
+        if (hasContextUsageSnapshot) {
+            return;
+        }
+        setContextPopoverOpen(false);
+        clearContextPopoverCloseTimer();
+    }, [hasContextUsageSnapshot]);
     useLayoutEffect(() => {
         const target = notebookLabelRef.current;
         if (!target) {
@@ -2286,6 +2380,7 @@ function CodexChat(props) {
                                             setReasoningMenuOpen(false);
                                             setUsagePopoverOpen(false);
                                             setPermissionMenuOpen(false);
+                                            setContextPopoverOpen(false);
                                         }, className: `jp-CodexHeaderBtn jp-CodexHeaderBtn-icon${settingsOpen ? ' is-active' : ''}`, "aria-label": "Settings", "aria-expanded": settingsOpen, title: "Settings", children: _jsx(GearIcon, { width: 16, height: 16 }) })] })] }), currentSession?.pairedOk === false && (_jsxs("div", { className: "jp-CodexPairingNotice", role: "status", "aria-live": "polite", children: [_jsx("div", { className: "jp-CodexPairingNotice-title", children: "Jupytext pairing required" }), _jsx("div", { className: "jp-CodexPairingNotice-body", children: currentSession.pairedMessage ||
                                     'This notebook must be paired (.ipynb ↔ .py) via Jupytext to enable running.' })] }))] }), _jsx("div", { className: "jp-CodexChat-body", children: _jsxs("div", { className: "jp-CodexChat-messages", ref: scrollRef, onScroll: onScrollMessages, children: [status === 'disconnected' && !isReconnecting && (_jsxs("div", { className: "jp-CodexChat-message jp-CodexChat-system jp-CodexChat-reconnectNotice", children: [_jsx("div", { className: "jp-CodexChat-role", children: "system" }), _jsx("div", { className: "jp-CodexChat-text", children: "Codex connection was lost. Reconnect to continue." }), _jsx("button", { type: "button", className: "jp-CodexReconnectBtn", onClick: () => reconnectSocket(), disabled: isReconnecting, "aria-label": isReconnecting ? 'Codex reconnecting' : 'Reconnect to Codex', title: isReconnecting ? 'Attempting to reconnect...' : 'Reconnect to Codex', children: isReconnecting ? 'Connecting...' : 'Reconnect' })] })), messages.length === 0 && (_jsxs("div", { className: "jp-CodexChat-message jp-CodexChat-system", children: [_jsx("div", { className: "jp-CodexChat-role", children: "system" }), _jsx("div", { className: "jp-CodexChat-text", children: "Select a notebook, then start a conversation." })] })), messages.map(entry => {
                             if (entry.kind === 'text') {
@@ -2322,9 +2417,7 @@ function CodexChat(props) {
                                 return (_jsxs("details", { className: activityClassName, role: "status", "aria-live": "polite", children: [_jsx("summary", { className: "jp-CodexActivitySummary", children: summaryContent }), _jsx("div", { className: "jp-CodexActivityBody", children: _jsx("pre", { className: "jp-CodexActivityCode", children: _jsx("code", { children: trimmedDetail }) }) })] }, entry.id));
                             }
                             return (_jsx("div", { className: activityClassName, role: "status", "aria-live": "polite", children: _jsx("div", { className: "jp-CodexActivitySummary jp-CodexActivitySummaryStatic", children: summaryContent }) }, entry.id));
-                        }), status === 'running' && (_jsx("div", { className: `jp-CodexChat-loading${progressKind === 'reasoning' ? ' is-reasoning' : ''}`, "aria-label": progressKind === 'reasoning' ? 'Reasoning' : 'Running', children: _jsxs("div", { className: "jp-CodexChat-loading-dots", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }) })), _jsx("div", { ref: endRef })] }) }), _jsx(PortalMenu, { open: Boolean(selectionPopover), anchorRef: selectionPopoverAnchorRef, popoverRef: selectionPopoverRef, className: "jp-CodexChat-selectionPopover", ariaLabel: "Message context", constrainHeightToViewport: true, viewportMargin: 20, role: "dialog", align: "right", children: selectionPopover && (_jsxs("div", { className: "jp-CodexChat-selectionCard", role: "note", "aria-label": "Message context", children: [selectionPopover.preview.selectionPreview && (_jsxs("div", { className: "jp-CodexChat-contextSection", children: [_jsx("div", { className: "jp-CodexChat-selectionMeta", children: selectionPopover.preview.selectionPreview.locationLabel }), _jsx(SelectionPreviewCode, { code: selectionPopover.preview.selectionPreview.previewText })] })), selectionPopover.preview.cellOutputPreview && (_jsxs("div", { className: "jp-CodexChat-contextSection", children: [_jsx("div", { className: "jp-CodexChat-selectionMeta", children: selectionPopover.preview.cellOutputPreview.locationLabel }), _jsx(SelectionPreviewCode, { code: selectionPopover.preview.cellOutputPreview.previewText })] }))] })) }), _jsxs("div", { className: "jp-CodexChat-input", children: [_jsx("div", { className: `jp-CodexJumpBar${isAtBottom ? '' : ' is-visible'}`, children: _jsx("button", { type: "button", className: "jp-CodexJumpToLatestBtn", onClick: scrollToBottom, "aria-label": "Jump to latest", "aria-hidden": isAtBottom, tabIndex: isAtBottom ? -1 : 0, title: "Jump to latest", children: _jsx(ArrowDownIcon, { width: 20, height: 20 }) }) }), _jsxs("div", { className: "jp-CodexComposer", children: [_jsx("div", { className: `jp-CodexComposer-cellAttachmentWrap${showCellAttachmentBadge ? ' is-visible' : ''}`, "aria-hidden": !showCellAttachmentBadge, children: _jsxs("div", { className: "jp-CodexComposer-cellAttachment", role: "group", "aria-label": "Pending active-cell attachment", title: includeCellOutputForNextSend
-                                        ? 'Active cell and output will be attached on next send.'
-                                        : 'Active cell will be attached on next send.', children: [_jsx("span", { className: "jp-CodexComposer-cellAttachmentLabel", children: "Cell Attached" }), _jsx("button", { type: "button", className: "jp-CodexComposer-cellAttachmentRemove", onClick: () => setExcludeCellAttachmentForNextSend(true), "aria-label": "Do not attach cell on next send", title: "Do not attach cell on next send", disabled: !showCellAttachmentBadge, tabIndex: showCellAttachmentBadge ? 0 : -1, children: _jsx(XIcon, { width: 10, height: 10 }) })] }) }), _jsx("textarea", { ref: composerTextareaRef, value: input, onChange: e => {
+                        }), status === 'running' && (_jsx("div", { className: `jp-CodexChat-loading${progressKind === 'reasoning' ? ' is-reasoning' : ''}`, "aria-label": progressKind === 'reasoning' ? 'Reasoning' : 'Running', children: _jsxs("div", { className: "jp-CodexChat-loading-dots", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }) })), _jsx("div", { ref: endRef })] }) }), _jsx(PortalMenu, { open: Boolean(selectionPopover), anchorRef: selectionPopoverAnchorRef, popoverRef: selectionPopoverRef, className: "jp-CodexChat-selectionPopover", ariaLabel: "Message context", constrainHeightToViewport: true, viewportMargin: 20, role: "dialog", align: "right", children: selectionPopover && (_jsxs("div", { className: "jp-CodexChat-selectionCard", role: "note", "aria-label": "Message context", children: [selectionPopover.preview.selectionPreview && (_jsxs("div", { className: "jp-CodexChat-contextSection", children: [_jsx("div", { className: "jp-CodexChat-selectionMeta", children: selectionPopover.preview.selectionPreview.locationLabel }), _jsx(SelectionPreviewCode, { code: selectionPopover.preview.selectionPreview.previewText })] })), selectionPopover.preview.cellOutputPreview && (_jsxs("div", { className: "jp-CodexChat-contextSection", children: [_jsx("div", { className: "jp-CodexChat-selectionMeta", children: selectionPopover.preview.cellOutputPreview.locationLabel }), _jsx(SelectionPreviewCode, { code: selectionPopover.preview.cellOutputPreview.previewText })] }))] })) }), _jsx(PortalMenu, { open: cellAttachmentPopoverOpen && showCellAttachmentBadge, anchorRef: cellAttachmentAnchorRef, popoverRef: cellAttachmentPopoverRef, className: "jp-CodexCellAttachmentPopoverMenu", ariaLabel: "Cell attachment details", role: "dialog", align: "left", onMouseEnter: openCellAttachmentPopover, onMouseLeave: scheduleCloseCellAttachmentPopover, children: _jsxs("div", { className: "jp-CodexCellAttachmentPopoverCard", role: "note", "aria-label": "Cell attachment details", children: [_jsx("div", { className: "jp-CodexCellAttachmentPopoverTitle", children: "Attach On Next Send" }), _jsxs("div", { className: "jp-CodexCellAttachmentPopoverRow", children: [_jsx("span", { children: "Current cell content" }), _jsx("span", { className: `jp-CodexCellAttachmentDot ${cellAttachmentContentEnabled ? 'is-on' : 'is-off'}`, "aria-label": cellAttachmentContentEnabled ? 'Attached' : 'Not attached', title: cellAttachmentContentEnabled ? 'Attached' : 'Not attached' })] }), _jsxs("div", { className: "jp-CodexCellAttachmentPopoverRow", children: [_jsx("span", { children: "Current cell output" }), _jsx("span", { className: `jp-CodexCellAttachmentDot ${cellAttachmentOutputEnabled ? 'is-on' : 'is-off'}`, "aria-label": cellAttachmentOutputEnabled ? 'Attached' : 'Not attached', title: cellAttachmentOutputEnabled ? 'Attached' : 'Not attached' })] })] }) }), _jsxs("div", { className: "jp-CodexChat-input", children: [_jsx("div", { className: `jp-CodexJumpBar${isAtBottom ? '' : ' is-visible'}`, children: _jsx("button", { type: "button", className: "jp-CodexJumpToLatestBtn", onClick: scrollToBottom, "aria-label": "Jump to latest", "aria-hidden": isAtBottom, tabIndex: isAtBottom ? -1 : 0, title: "Jump to latest", children: _jsx(ArrowDownIcon, { width: 20, height: 20 }) }) }), _jsxs("div", { className: "jp-CodexComposer", children: [_jsx("div", { className: `jp-CodexCellAttachmentWrap jp-CodexComposer-cellAttachmentWrap${showCellAttachmentBadge ? ' is-visible' : ''}`, ref: cellAttachmentAnchorRef, "aria-hidden": !showCellAttachmentBadge, onMouseEnter: openCellAttachmentPopover, onMouseLeave: scheduleCloseCellAttachmentPopover, onFocusCapture: openCellAttachmentPopover, onBlurCapture: handleCellAttachmentBlur, children: _jsx("div", { role: "group", "aria-label": "Active-cell attachment", children: _jsxs("button", { type: "button", className: `jp-CodexComposer-cellAttachment${cellAttachmentContentEnabled ? '' : ' is-off'}`, onClick: () => setIncludeActiveCell(value => !value), "aria-pressed": cellAttachmentContentEnabled, "aria-label": cellAttachmentContentEnabled ? 'Disable active-cell attachment' : 'Enable active-cell attachment', title: cellAttachmentContentEnabled ? 'Disable active-cell attachment' : 'Enable active-cell attachment', disabled: !showCellAttachmentBadge, tabIndex: showCellAttachmentBadge ? 0 : -1, children: [_jsx(CellAttachmentIcon, { active: cellAttachmentContentEnabled, width: 15, height: 15 }), _jsx("span", { className: "jp-CodexComposer-cellAttachmentLabel", children: "Cell Attatch" })] }) }) }), _jsx("textarea", { ref: composerTextareaRef, value: input, onChange: e => {
                                     updateInput(e.currentTarget.value);
                                     // Resize using the current target so typing feels immediate.
                                     window.requestAnimationFrame(() => autosizeComposerTextarea(e.currentTarget));
@@ -2354,6 +2447,7 @@ function CodexChat(props) {
                                                         setReasoningMenuOpen(false);
                                                         setUsagePopoverOpen(false);
                                                         setPermissionMenuOpen(false);
+                                                        setContextPopoverOpen(false);
                                                     }, disabled: status === 'running', "aria-label": `Model: ${selectedModelLabel}`, "aria-haspopup": "menu", "aria-expanded": modelMenuOpen, title: `Model: ${selectedModelLabel}`, children: _jsx("span", { className: "jp-CodexModelBtn-label", children: selectedModelLabel }) }) }), _jsxs(PortalMenu, { open: modelMenuOpen, anchorRef: modelBtnRef, popoverRef: modelPopoverRef, role: "menu", ariaLabel: "Model", align: "left", children: [modelOptions.length === 0 && (_jsx("div", { className: "jp-CodexMenuItem", children: "No models available" })), modelOptions.map(option => {
                                                         const inferred = activeModelOption === '__config__' && autoModel && modelOptions.some(option => option.value === autoModel)
                                                             ? autoModel
@@ -2368,6 +2462,7 @@ function CodexChat(props) {
                                                         setModelMenuOpen(false);
                                                         setUsagePopoverOpen(false);
                                                         setPermissionMenuOpen(false);
+                                                        setContextPopoverOpen(false);
                                                     }, disabled: status === 'running', "aria-label": `Reasoning: ${selectedReasoningLabel}`, "aria-haspopup": "menu", "aria-expanded": reasoningMenuOpen, title: `Reasoning: ${selectedReasoningLabel}`, children: _jsx(ReasoningEffortIcon, { isConfig: activeReasoningEffort === '__config__' && !autoReasoningEffort, activeBars: getReasoningEffortBars((activeReasoningEffort === '__config__' && autoReasoningEffort
                                                             ? autoReasoningEffort
                                                             : activeReasoningEffort), reasoningOptions), width: 17, height: 17 }) }) }), _jsxs(PortalMenu, { open: reasoningMenuOpen, anchorRef: reasoningBtnRef, popoverRef: reasoningPopoverRef, role: "menu", ariaLabel: "Reasoning", align: "left", children: [reasoningOptions.length === 0 && (_jsx("div", { className: "jp-CodexMenuItem", children: "No reasoning options" })), reasoningOptions.map(option => {
@@ -2382,14 +2477,15 @@ function CodexChat(props) {
                                                         setModelMenuOpen(false);
                                                         setReasoningMenuOpen(false);
                                                         setUsagePopoverOpen(false);
+                                                        setContextPopoverOpen(false);
                                                     }, disabled: status === 'running', "aria-label": `Permission: ${selectedSandboxLabel}`, "aria-haspopup": "menu", "aria-expanded": permissionMenuOpen, title: `Permission: ${selectedSandboxLabel}`, children: _jsx(ShieldIcon, { width: 17, height: 17 }) }) }), _jsx(PortalMenu, { open: permissionMenuOpen, anchorRef: permissionBtnRef, popoverRef: permissionPopoverRef, role: "menu", ariaLabel: "Permissions", align: "right", children: SANDBOX_OPTIONS.map(option => (_jsxs("button", { type: "button", className: `jp-CodexMenuItem ${activeSandboxMode === option.value ? 'is-active' : ''}`, onClick: () => {
                                                         setCurrentSessionSandboxMode(option.value);
                                                         setPermissionMenuOpen(false);
-                                                    }, children: [_jsx("span", { className: "jp-CodexMenuItemLabel", children: option.label }), activeSandboxMode === option.value && _jsx(CheckIcon, { className: "jp-CodexMenuCheck", width: 16, height: 16 })] }, option.value))) }), hasContextUsageSnapshot && (_jsxs("div", { className: "jp-CodexContextWrap", children: [_jsx("button", { type: "button", className: `jp-CodexIconBtn jp-CodexContextBtn${usageIsStale ? ' is-stale' : ''}`, "aria-label": contextUsedTokens == null || contextLeftTokens == null
+                                                    }, children: [_jsx("span", { className: "jp-CodexMenuItemLabel", children: option.label }), activeSandboxMode === option.value && _jsx(CheckIcon, { className: "jp-CodexMenuCheck", width: 16, height: 16 })] }, option.value))) }), hasContextUsageSnapshot && (_jsxs("div", { className: "jp-CodexContextWrap", ref: contextMenuWrapRef, onMouseEnter: openContextPopover, onMouseLeave: scheduleCloseContextPopover, onFocusCapture: openContextPopover, onBlurCapture: handleContextPopoverBlur, children: [_jsx("button", { type: "button", className: `jp-CodexIconBtn jp-CodexContextBtn${usageIsStale ? ' is-stale' : ''}`, ref: contextBtnRef, "aria-label": contextUsedTokens == null || contextLeftTokens == null
                                                             ? 'Context window usage unavailable'
                                                             : `Context window: used ${contextUsedLabel} tokens, left ${contextLeftLabel} tokens`, title: contextUsedTokens == null || contextLeftTokens == null
                                                             ? 'Context window usage unavailable'
-                                                            : `Used ${contextUsedLabel} / left ${contextLeftLabel}`, children: _jsx(ContextWindowIcon, { level: contextLevel, width: 20, height: 20 }) }), _jsxs("div", { className: "jp-CodexContextPopover", role: "tooltip", children: [_jsx("div", { className: "jp-CodexContextPopoverTitle", children: "Context window" }), _jsxs("div", { className: "jp-CodexContextPopoverRow", children: [_jsx("span", { children: "Used" }), _jsx("strong", { children: contextUsedLabel })] }), _jsxs("div", { className: "jp-CodexContextPopoverRow", children: [_jsx("span", { children: "Left" }), _jsx("strong", { children: contextLeftLabel })] }), _jsx("div", { className: "jp-CodexContextPopoverMeta", children: contextWindowTokens == null
+                                                            : `Used ${contextUsedLabel} / left ${contextLeftLabel}`, children: _jsx(ContextWindowIcon, { level: contextLevel, width: 20, height: 20 }) }), _jsxs(PortalMenu, { open: contextPopoverOpen, anchorRef: contextBtnRef, popoverRef: contextPopoverRef, className: "jp-CodexContextPopover", role: "tooltip", ariaLabel: "Context window", align: "right", onMouseEnter: openContextPopover, onMouseLeave: scheduleCloseContextPopover, children: [_jsx("div", { className: "jp-CodexContextPopoverTitle", children: "Context window" }), _jsxs("div", { className: "jp-CodexContextPopoverRow", children: [_jsx("span", { children: "Used" }), _jsx("strong", { children: contextUsedLabel })] }), _jsxs("div", { className: "jp-CodexContextPopoverRow", children: [_jsx("span", { children: "Left" }), _jsx("strong", { children: contextLeftLabel })] }), _jsx("div", { className: "jp-CodexContextPopoverMeta", children: contextWindowTokens == null
                                                                     ? 'Window size unavailable'
                                                                     : `Window: ${contextWindowLabel} tokens (${contextUsedPercentLabel} used)` })] })] }))] }), _jsx("div", { className: "jp-CodexComposer-toolbarRight", children: _jsx("button", { type: "button", className: `jp-CodexSendBtn${sendButtonMode === 'stop' ? ' is-stop' : ''}`, onClick: () => {
                                                 if (sendButtonMode === 'stop') {