@codingame/monaco-vscode-api 3.2.3 → 4.1.0

package/vscode/src/vs/workbench/contrib/notebook/browser/view/renderers/backLayerWebView.js

@@ -26,7 +26,17 @@ import { IFileService } from '../../../../../../platform/files/common/files.js';
 import { IOpenerService } from '../../../../../../platform/opener/common/opener.js';
 import { IStorageService } from '../../../../../../platform/storage/common/storage.js';
 import { ITelemetryService } from '../../../../../../platform/telemetry/common/telemetry.js';
-import { editorFindMatch, editorFindMatchHighlight } from '../../../../../../platform/theme/common/colorRegistry.js';
+import '../../../../../../platform/theme/common/colorUtils.js';
+import '../../../../../../platform/theme/common/colors/baseColors.js';
+import '../../../../../../platform/theme/common/colors/chartsColors.js';
+import { editorFindMatch, editorFindMatchHighlight } from '../../../../../../platform/theme/common/colors/editorColors.js';
+import '../../../../../../platform/theme/common/colors/inputColors.js';
+import '../../../../../../platform/theme/common/colors/listColors.js';
+import '../../../../../../platform/theme/common/colors/menuColors.js';
+import '../../../../../../platform/theme/common/colors/minimapColors.js';
+import '../../../../../../platform/theme/common/colors/miscColors.js';
+import '../../../../../../platform/theme/common/colors/quickpickColors.js';
+import '../../../../../../platform/theme/common/colors/searchColors.js';
 import { Themable, IThemeService } from '../../../../../../platform/theme/common/themeService.js';
 import { IWorkspaceContextService } from '../../../../../../platform/workspace/common/workspace.js';
 import { IWorkspaceTrustManagementService } from '../../../../../../platform/workspace/common/workspaceTrust.js';
@@ -288,6 +298,14 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
 						background-color: var(--theme-notebook-symbol-highlight-background);
 					}
 
+					#container .nb-symbolHighlight .output_container .output {
+						background-color: var(--theme-notebook-symbol-highlight-background);
+					}
+
+					#container .nb-chatGenerationHighlight .output_container .output {
+						background-color: var(--vscode-notebook-selectedCellBackground);
+					}
+
 					#container > div.nb-cellDeleted .output_container {
 						background-color: var(--theme-notebook-diff-removed-background);
 					}
@@ -402,10 +420,10 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
     isResolved() {
         return !!this.webview;
     }
-    createWebview(codeWindow) {
+    createWebview(targetWindow) {
         const baseUrl = this.asWebviewUri(this.getNotebookBaseUri(), undefined);
         const htmlContent = this.generateContent(( baseUrl.toString()));
-        return this._initialize(htmlContent, codeWindow);
+        return this._initialize(htmlContent, targetWindow);
     }
     getNotebookBaseUri() {
         if (this.documentUri.scheme === Schemas.untitled) {
@@ -431,14 +449,14 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
             dirname(( FileAccess.asFileUri('vs/loader.js'))),
         ];
     }
-    _initialize(content, codeWindow) {
+    _initialize(content, targetWindow) {
         if (!getWindow(this.element).document.body.contains(this.element)) {
             throw new Error('Element is already detached from the DOM tree');
         }
-        this.webview = this._createInset(this.webviewService, content, codeWindow);
-        this.webview.mountTo(this.element);
+        this.webview = this._createInset(this.webviewService, content);
+        this.webview.mountTo(this.element, targetWindow);
         this._register(this.webview);
-        this._register(( new WebviewWindowDragMonitor(() => this.webview)));
+        this._register(( new WebviewWindowDragMonitor(targetWindow, () => this.webview)));
         const initializePromise = ( new DeferredPromise());
         this._register(this.webview.onFatalError(e => {
             initializePromise.error(( new Error(`Could not initialize webview: ${e.message}}`)));
@@ -543,6 +561,7 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
                         const latestCell = this.notebookEditor.getCellByInfo(resolvedResult.cellInfo);
                         if (latestCell) {
                             latestCell.outputIsFocused = false;
+                            latestCell.inputInOutputIsFocused = false;
                         }
                     }
                     break;
@@ -752,6 +771,13 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
                     break;
                 }
                 case 'outputInputFocus': {
+                    const resolvedResult = this.resolveOutputId(data.id);
+                    if (resolvedResult) {
+                        const latestCell = this.notebookEditor.getCellByInfo(resolvedResult.cellInfo);
+                        if (latestCell) {
+                            latestCell.inputInOutputIsFocused = data.inputFocused;
+                        }
+                    }
                     this.notebookEditor.didFocusOutputInputChange(data.inputFocused);
                 }
             }
@@ -937,7 +963,7 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
         await this.fileService.writeFile(newFileUri, buff);
         await this.openerService.open(newFileUri);
     }
-    _createInset(webviewService, content, codeWindow) {
+    _createInset(webviewService, content) {
         this.localResourceRootsCache = this._getResourceRootsCache();
         const webview = webviewService.createWebviewElement({
             origin: BackLayerWebView_1.getOriginStore(this.storageService).getOrigin(this.notebookViewType, undefined),
@@ -957,8 +983,7 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
                 localResourceRoots: this.localResourceRootsCache,
             },
             extension: undefined,
-            providedViewType: 'notebook.output',
-            codeWindow: codeWindow
+            providedViewType: 'notebook.output'
         });
         webview.setHtml(content);
         webview.setContextKeyService(this.contextKeyService);
@@ -1398,6 +1423,28 @@ let BackLayerWebView = class BackLayerWebView extends Themable {
         }
         this.webview?.focus();
     }
+    selectOutputContents(cell) {
+        if (this._disposed) {
+            return;
+        }
+        const output = cell.outputsViewModels.find(o => o.model.outputId === cell.focusedOutputId);
+        const outputId = output ? this.insetMapping.get(output)?.outputId : undefined;
+        this._sendMessageToWebview({
+            type: 'select-output-contents',
+            cellOrOutputId: outputId || cell.id
+        });
+    }
+    selectInputContents(cell) {
+        if (this._disposed) {
+            return;
+        }
+        const output = cell.outputsViewModels.find(o => o.model.outputId === cell.focusedOutputId);
+        const outputId = output ? this.insetMapping.get(output)?.outputId : undefined;
+        this._sendMessageToWebview({
+            type: 'select-input-contents',
+            cellOrOutputId: outputId || cell.id
+        });
+    }
     focusOutput(cellOrOutputId, alternateId, viewFocused) {
         if (this._disposed) {
             return;

package/vscode/src/vs/workbench/contrib/notebook/browser/view/renderers/cellRenderer.js

@@ -3,7 +3,7 @@ import { PixelRatio } from '../../../../../../base/browser/pixelRatio.js';
 import { append, $ as $$1, getWindow } from '../../../../../../base/browser/dom.js';
 import { FastDomNode } from '../../../../../../base/browser/fastDomNode.js';
 import { DisposableStore, Disposable } from '../../../../../../base/common/lifecycle.js';
-import { CodeEditorWidget } from '../../../../../../editor/browser/widget/codeEditorWidget.js';
+import { CodeEditorWidget } from '../../../../../../editor/browser/widget/codeEditor/codeEditorWidget.js';
 import { BareFontInfo } from '../../../../../../editor/common/config/fontInfo.js';
 import { EditorContextKeys } from '../../../../../../editor/common/editorContextKeys.js';
 import { PLAINTEXT_LANGUAGE_ID } from '../../../../../../editor/common/languages/modesRegistry.js';
@@ -37,6 +37,7 @@ import { CollapsedCellOutput } from '../cellParts/collapsedCellOutput.js';
 import { FoldedCellHint } from '../cellParts/foldedCellHint.js';
 import { MarkupCell } from '../cellParts/markupCell.js';
 import { CellKind } from '../../../common/notebookCommon.js';
+import { INotebookExecutionStateService } from '../../../common/notebookExecutionStateService.js';
 var MarkupCellRenderer_1, CodeCellRenderer_1;
 const $ = $$1;
 let NotebookCellListDelegate = class NotebookCellListDelegate extends Disposable {
@@ -88,9 +89,10 @@ class AbstractCellRenderer {
 let MarkupCellRenderer = class MarkupCellRenderer extends AbstractCellRenderer {
     static { MarkupCellRenderer_1 = this; }
     static { this.TEMPLATE_ID = 'markdown_cell'; }
-    constructor(notebookEditor, dndController, renderedEditors, contextKeyServiceProvider, configurationService, instantiationService, contextMenuService, menuService, keybindingService, notificationService) {
+    constructor(notebookEditor, dndController, renderedEditors, contextKeyServiceProvider, configurationService, instantiationService, contextMenuService, menuService, keybindingService, notificationService, notebookExecutionStateService) {
         super(instantiationService, notebookEditor, contextMenuService, menuService, configurationService, keybindingService, notificationService, contextKeyServiceProvider, 'markdown', dndController);
         this.renderedEditors = renderedEditors;
+        this._notebookExecutionStateService = notebookExecutionStateService;
     }
     get templateId() {
         return MarkupCellRenderer_1.TEMPLATE_ID;
@@ -139,7 +141,11 @@ let MarkupCellRenderer = class MarkupCellRenderer extends AbstractCellRenderer {
                 focusIndicatorRight,
                 focusIndicatorBottom
             ))),
-            templateDisposables.add(( new FoldedCellHint(this.notebookEditor, append(container, $('.notebook-folded-hint'))))),
+            templateDisposables.add(( new FoldedCellHint(
+                this.notebookEditor,
+                append(container, $('.notebook-folded-hint')),
+                this._notebookExecutionStateService
+            ))),
             templateDisposables.add(( new CellDecorations(rootContainer, decorationContainer))),
             templateDisposables.add(scopedInstaService.createInstance(CellComments, this.notebookEditor, cellCommentPartContainer)),
             templateDisposables.add(( new CollapsedCellInput(this.notebookEditor, cellInputCollapsedContainer))),
@@ -194,7 +200,8 @@ MarkupCellRenderer = MarkupCellRenderer_1 = ( __decorate([
     ( __param(6, IContextMenuService)),
     ( __param(7, IMenuService)),
     ( __param(8, IKeybindingService)),
-    ( __param(9, INotificationService))
+    ( __param(9, INotificationService)),
+    ( __param(10, INotebookExecutionStateService))
 ], MarkupCellRenderer));
 let CodeCellRenderer = class CodeCellRenderer extends AbstractCellRenderer {
     static { CodeCellRenderer_1 = this; }

package/vscode/src/vs/workbench/contrib/notebook/browser/view/renderers/webviewPreloads.js

@@ -58,15 +58,41 @@ async function webviewPreloads(ctx) {
                 }
             };
         };
-    const checkOutputInputFocus = () => {
+    function getOutputContainer(event) {
+        for (const node of event.composedPath()) {
+            if (node instanceof HTMLElement && node.classList.contains('output')) {
+                return {
+                    id: node.id
+                };
+            }
+        }
+        return;
+    }
+    let lastFocusedOutput = undefined;
+    const handleOutputFocusOut = (event) => {
+        const outputFocus = event && getOutputContainer(event);
+        if (!outputFocus) {
+            return;
+        }
+        lastFocusedOutput = undefined;
+        setTimeout(() => {
+            if (lastFocusedOutput?.id === outputFocus.id) {
+                return;
+            }
+            postNotebookMessage('outputBlur', outputFocus);
+        }, 0);
+    };
+    const checkOutputInputFocus = (e) => {
+        lastFocusedOutput = getOutputContainer(e);
         const activeElement = window.document.activeElement;
         if (!activeElement) {
             return;
         }
-        if (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA') {
-            postNotebookMessage('outputInputFocus', { inputFocused: true });
+        const id = lastFocusedOutput?.id;
+        if (id && (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA')) {
+            postNotebookMessage('outputInputFocus', { inputFocused: true, id });
             activeElement.addEventListener('blur', () => {
-                postNotebookMessage('outputInputFocus', { inputFocused: false });
+                postNotebookMessage('outputInputFocus', { inputFocused: false, id });
             }, { once: true });
         }
     };
@@ -74,15 +100,7 @@ async function webviewPreloads(ctx) {
         if (!event || !event.view || !event.view.document) {
             return;
         }
-        let outputFocus = undefined;
-        for (const node of event.composedPath()) {
-            if (node instanceof HTMLElement && node.classList.contains('output')) {
-                outputFocus = {
-                    id: node.id
-                };
-                break;
-            }
-        }
+        const outputFocus = lastFocusedOutput = getOutputContainer(event);
         for (const node of event.composedPath()) {
             if (node instanceof HTMLAnchorElement && node.href) {
                 if (node.href.startsWith('blob:')) {
@@ -136,6 +154,74 @@ async function webviewPreloads(ctx) {
             postNotebookMessage('outputFocus', outputFocus);
         }
     };
+    const selectOutputContents = (cellOrOutputId) => {
+        const selection = window.getSelection();
+        if (!selection) {
+            return;
+        }
+        const cellOutputContainer = window.document.getElementById(cellOrOutputId);
+        if (!cellOutputContainer) {
+            return;
+        }
+        selection.removeAllRanges();
+        const range = document.createRange();
+        range.selectNode(cellOutputContainer);
+        selection.addRange(range);
+    };
+    const selectInputContents = (cellOrOutputId) => {
+        const cellOutputContainer = window.document.getElementById(cellOrOutputId);
+        if (!cellOutputContainer) {
+            return;
+        }
+        const activeElement = window.document.activeElement;
+        if (activeElement?.tagName === 'INPUT' || activeElement?.tagName === 'TEXTAREA') {
+            activeElement.select();
+        }
+    };
+    const onPageUpDownSelectionHandler = (e) => {
+        if (!lastFocusedOutput?.id || !e.shiftKey) {
+            return;
+        }
+        if (!(e.code === 'PageUp' || e.code === 'PageDown') && !(e.metaKey && (e.code === 'ArrowDown' || e.code === 'ArrowUp'))) {
+            return;
+        }
+        const outputContainer = window.document.getElementById(lastFocusedOutput.id);
+        const selection = window.getSelection();
+        if (!outputContainer || !selection?.anchorNode) {
+            return;
+        }
+        const activeElement = window.document.activeElement;
+        if (activeElement?.tagName === 'INPUT' || activeElement?.tagName === 'TEXTAREA') {
+            return;
+        }
+        e.stopPropagation();
+        e.preventDefault();
+        const { anchorNode, anchorOffset } = selection;
+        const range = document.createRange();
+        if (e.code === 'PageDown' || e.code === 'ArrowDown') {
+            range.setStart(anchorNode, anchorOffset);
+            range.setEnd(outputContainer, 1);
+        }
+        else {
+            range.setStart(outputContainer, 0);
+            range.setEnd(anchorNode, anchorOffset);
+        }
+        selection.removeAllRanges();
+        selection.addRange(range);
+    };
+    const disableNativeSelectAll = (e) => {
+        if (!lastFocusedOutput?.id) {
+            return;
+        }
+        const activeElement = window.document.activeElement;
+        if (activeElement?.tagName === 'INPUT' || activeElement?.tagName === 'TEXTAREA') {
+            return;
+        }
+        if ((e.key === 'a' && e.ctrlKey) || (e.metaKey && e.key === 'a')) {
+            e.preventDefault();
+            return;
+        }
+    };
     const handleDataUrl = async (data, downloadName) => {
         postNotebookMessage('clicked-data-url', {
             data,
@@ -158,6 +244,9 @@ async function webviewPreloads(ctx) {
     };
     window.document.body.addEventListener('click', handleInnerClick);
     window.document.body.addEventListener('focusin', checkOutputInputFocus);
+    window.document.body.addEventListener('focusout', handleOutputFocusOut);
+    window.document.body.addEventListener('keydown', onPageUpDownSelectionHandler);
+    window.document.body.addEventListener('keydown', disableNativeSelectAll);
     function createKernelContext() {
         return ( Object.freeze({
             onDidReceiveKernelMessage: onDidReceiveKernelMessage.event,
@@ -285,12 +374,51 @@ async function webviewPreloads(ctx) {
             }, 250);
         }
     });
-    function scrollWillGoToParent(event) {
+    let previousDelta;
+    let scrollTimeout;
+    let scrolledElement;
+    let lastTimeScrolled;
+    function flagRecentlyScrolled(node, deltaY) {
+        scrolledElement = node;
+        if (deltaY === undefined) {
+            lastTimeScrolled = Date.now();
+            previousDelta = undefined;
+            node.setAttribute('recentlyScrolled', 'true');
+            clearTimeout(scrollTimeout);
+            scrollTimeout = setTimeout(() => { scrolledElement?.removeAttribute('recentlyScrolled'); }, 300);
+            return true;
+        }
+        if (node.hasAttribute('recentlyScrolled')) {
+            if (lastTimeScrolled && Date.now() - lastTimeScrolled > 300) {
+                if (!!previousDelta && deltaY < 0 && deltaY < previousDelta - 2) {
+                    clearTimeout(scrollTimeout);
+                    scrolledElement?.removeAttribute('recentlyScrolled');
+                    return false;
+                }
+                else if (!!previousDelta && deltaY > 0 && deltaY > previousDelta + 2) {
+                    clearTimeout(scrollTimeout);
+                    scrolledElement?.removeAttribute('recentlyScrolled');
+                    return false;
+                }
+                clearTimeout(scrollTimeout);
+                scrollTimeout = setTimeout(() => { scrolledElement?.removeAttribute('recentlyScrolled'); }, 50);
+            }
+            else {
+                clearTimeout(scrollTimeout);
+                scrollTimeout = setTimeout(() => { scrolledElement?.removeAttribute('recentlyScrolled'); }, 300);
+            }
+            previousDelta = deltaY;
+            return true;
+        }
+        return false;
+    }
+    function eventTargetShouldHandleScroll(event) {
         for (let node = event.target; node; node = node.parentNode) {
             if (!(node instanceof Element) || node.id === 'container' || node.classList.contains('cell_container') || node.classList.contains('markup') || node.classList.contains('output_container')) {
                 return false;
             }
             if (event.deltaY < 0 && node.scrollTop > 0) {
+                flagRecentlyScrolled(node);
                 return true;
             }
             if (event.deltaY > 0 && node.scrollTop + node.clientHeight < node.scrollHeight) {
@@ -300,13 +428,17 @@ async function webviewPreloads(ctx) {
                 if (window.getComputedStyle(node).overflowY === 'hidden' || window.getComputedStyle(node).overflowY === 'visible') {
                     continue;
                 }
+                flagRecentlyScrolled(node);
+                return true;
+            }
+            if (flagRecentlyScrolled(node, event.deltaY)) {
                 return true;
             }
         }
         return false;
     }
     const handleWheel = (event) => {
-        if (event.defaultPrevented || scrollWillGoToParent(event)) {
+        if (event.defaultPrevented || eventTargetShouldHandleScroll(event)) {
             return;
         }
         postNotebookMessage('did-scroll-wheel', {
@@ -331,11 +463,19 @@ async function webviewPreloads(ctx) {
             if (cellOutputContainer.contains(window.document.activeElement)) {
                 return;
             }
+            const id = cellOutputContainer.id;
             let focusableElement = cellOutputContainer.querySelector('[tabindex="0"], [href], button, input, option, select, textarea');
             if (!focusableElement) {
                 focusableElement = cellOutputContainer;
                 focusableElement.tabIndex = -1;
+                postNotebookMessage('outputInputFocus', { inputFocused: false, id });
             }
+            else {
+                const inputFocused = focusableElement.tagName === 'INPUT' || focusableElement.tagName === 'TEXTAREA';
+                postNotebookMessage('outputInputFocus', { inputFocused, id });
+            }
+            lastFocusedOutput = cellOutputContainer;
+            postNotebookMessage('outputFocus', { id: cellOutputContainer.id });
             focusableElement.focus();
         }
     }
@@ -1128,6 +1268,12 @@ async function webviewPreloads(ctx) {
             case 'focus-output':
                 focusFirstFocusableOrContainerInOutput(event.data.cellOrOutputId, event.data.alternateId);
                 break;
+            case 'select-output-contents':
+                selectOutputContents(event.data.cellOrOutputId);
+                break;
+            case 'select-input-contents':
+                selectInputContents(event.data.cellOrOutputId);
+                break;
             case 'decorations': {
                 let outputContainer = window.document.getElementById(event.data.cellId);
                 if (!outputContainer) {

package/vscode/src/vs/workbench/contrib/notebook/browser/viewModel/baseCellViewModel.js

@@ -1,5 +1,5 @@
 import { Emitter } from '../../../../../base/common/event.js';
-import { Disposable, dispose } from '../../../../../base/common/lifecycle.js';
+import { Disposable, MutableDisposable, dispose } from '../../../../../base/common/lifecycle.js';
 import { Mimes } from '../../../../../base/common/mime.js';
 import { Range } from '../../../../../editor/common/core/range.js';
 import { Selection } from '../../../../../editor/common/core/selection.js';
@@ -106,6 +106,7 @@ class BaseCellViewModel extends Disposable {
         this._editorViewStates = null;
         this._editorTransientState = null;
         this._resolvedCellDecorations = ( new Map());
+        this._textModelRefChangeDisposable = this._register(( new MutableDisposable()));
         this._cellDecorationsChanged = this._register(( new Emitter()));
         this.onCellDecorationsChanged = this._cellDecorationsChanged.event;
         this._resolvedDecorations = ( new Map());
@@ -212,6 +213,7 @@ class BaseCellViewModel extends Disposable {
             this._textModelRef.dispose();
             this._textModelRef = undefined;
         }
+        this._textModelRefChangeDisposable.clear();
     }
     getText() {
         return this.model.getValue();
@@ -462,7 +464,7 @@ class BaseCellViewModel extends Disposable {
             if (!this._textModelRef) {
                 throw new Error(`Cannot resolve text model for ${this.uri}`);
             }
-            this._register(this.textModel.onDidChangeContent(() => this.onDidChangeTextModelContent()));
+            this._textModelRefChangeDisposable.value = this.textModel.onDidChangeContent(() => this.onDidChangeTextModelContent());
         }
         return this.textModel;
     }

package/vscode/src/vs/workbench/contrib/notebook/browser/viewModel/codeCellViewModel.js

@@ -12,8 +12,13 @@ import { CellOutputViewModel } from './cellOutputViewModel.js';
 import { CellKind } from '../../common/notebookCommon.js';
 import { INotebookService } from '../../common/notebookService.js';
 import { BaseCellViewModel } from './baseCellViewModel.js';
+import { CellDiagnostics } from '../contrib/cellDiagnostics/cellDiagnostics.js';
+import { IInstantiationService } from '../../../../../platform/instantiation/common/instantiation.js';
 const outputDisplayLimit = 500;
 let CodeCellViewModel = class CodeCellViewModel extends BaseCellViewModel {
+    get cellDiagnostics() {
+        return this._cellDiagnostics;
+    }
     set editorHeight(height) {
         if (this._editorHeight === height) {
             return;
@@ -55,6 +60,12 @@ let CodeCellViewModel = class CodeCellViewModel extends BaseCellViewModel {
         this._focusOnOutput = v;
         this._onDidChangeState.fire({ outputIsFocusedChanged: true });
     }
+    get inputInOutputIsFocused() {
+        return this._focusInputInOutput;
+    }
+    set inputInOutputIsFocused(v) {
+        this._focusInputInOutput = v;
+    }
     get outputMinHeight() {
         return this._outputMinHeight;
     }
@@ -67,7 +78,7 @@ let CodeCellViewModel = class CodeCellViewModel extends BaseCellViewModel {
     get outputsViewModels() {
         return this._outputViewModels;
     }
-    constructor(viewType, model, initialNotebookLayoutInfo, viewContext, configurationService, _notebookService, modelService, undoRedoService, codeEditorService) {
+    constructor(viewType, model, initialNotebookLayoutInfo, viewContext, configurationService, _notebookService, modelService, undoRedoService, codeEditorService, instantiationService) {
         super(viewType, model, generateUuid(), viewContext, configurationService, modelService, undoRedoService, codeEditorService);
         this.viewContext = viewContext;
         this._notebookService = _notebookService;
@@ -91,6 +102,7 @@ let CodeCellViewModel = class CodeCellViewModel extends BaseCellViewModel {
         this._commentHeight = 0;
         this._hoveringOutput = false;
         this._focusOnOutput = false;
+        this._focusInputInOutput = false;
         this._outputMinHeight = 0;
         this._hasFindResult = this._register(( new Emitter()));
         this.hasFindResult = this._hasFindResult.event;
@@ -111,9 +123,14 @@ let CodeCellViewModel = class CodeCellViewModel extends BaseCellViewModel {
             if (outputLayoutChange) {
                 this.layoutChange({ outputHeight: true }, 'CodeCellViewModel#model.onDidChangeOutputs');
             }
+            if (this._outputCollection.length === 0) {
+                this._cellDiagnostics.clear();
+            }
             dispose(removedOutputs);
         }));
         this._outputCollection = ( new Array(this.model.outputs.length));
+        this._cellDiagnostics = instantiationService.createInstance(CellDiagnostics, this);
+        this._register(this._cellDiagnostics);
         this._layoutInfo = {
             fontInfo: initialNotebookLayoutInfo?.fontInfo || null,
             editorHeight: 0,
@@ -350,6 +367,7 @@ let CodeCellViewModel = class CodeCellViewModel extends BaseCellViewModel {
             this.updateEditState(CellEditState.Editing, 'onDidChangeTextModelContent');
             this._onDidChangeState.fire({ contentChanged: true });
         }
+        this._cellDiagnostics.clear();
     }
     onDeselect() {
         this.updateEditState(CellEditState.Preview, 'onDeselect');
@@ -430,6 +448,7 @@ CodeCellViewModel = ( __decorate([
     ( __param(5, INotebookService)),
     ( __param(6, ITextModelService)),
     ( __param(7, IUndoRedoService)),
-    ( __param(8, ICodeEditorService))
+    ( __param(8, ICodeEditorService)),
+    ( __param(9, IInstantiationService))
 ], CodeCellViewModel));
 export { CodeCellViewModel, outputDisplayLimit };

package/vscode/src/vs/workbench/contrib/notebook/browser/viewModel/foldingModel.js

@@ -249,7 +249,7 @@ function* getMarkdownHeadersInCell(cellContent) {
         if (token.type === 'heading') {
             yield {
                 depth: token.depth,
-                text: renderMarkdownAsPlaintext({ value: token.text }).trim()
+                text: renderMarkdownAsPlaintext({ value: token.raw }).trim()
             };
         }
     }

package/vscode/src/vs/workbench/contrib/notebook/browser/viewModel/markupCellViewModel.js

@@ -54,6 +54,11 @@ let MarkupCellViewModel = class MarkupCellViewModel extends BaseCellViewModel {
     set outputIsFocused(v) {
         this._focusOnOutput = v;
     }
+    get inputInOutputIsFocused() {
+        return false;
+    }
+    set inputInOutputIsFocused(_) {
+    }
     get cellIsHovered() {
         return this._hoveringCell;
     }

package/vscode/src/vs/workbench/contrib/notebook/browser/viewModel/notebookOutlineEntryFactory.js

@@ -8,7 +8,7 @@ class NotebookOutlineEntryFactory {
         this.executionStateService = executionStateService;
         this.cellOutlineEntryCache = {};
     }
-    getOutlineEntries(cell, index) {
+    getOutlineEntries(cell, target, index) {
         const entries = [];
         const isMarkdown = cell.cellKind === CellKind.Markup;
         let content = getCellFirstNonEmptyLine(cell);
@@ -33,9 +33,21 @@ class NotebookOutlineEntryFactory {
             }
         }
         if (!hasHeader) {
+            const exeState = !isMarkdown && this.executionStateService.getCellExecution(cell.uri);
+            let preview = content.trim();
             if (!isMarkdown && cell.model.textModel) {
                 const cachedEntries = this.cellOutlineEntryCache[cell.model.textModel.id];
                 if (cachedEntries) {
+                    if (target === 1 ) {
+                        entries.push(( new OutlineEntry(
+                            index++,
+                            7,
+                            cell,
+                            preview,
+                            !!exeState,
+                            exeState ? exeState.isPaused : false
+                        )));
+                    }
                     cachedEntries.forEach((cached) => {
                         entries.push(( new OutlineEntry(
                             index++,
@@ -50,9 +62,7 @@ class NotebookOutlineEntryFactory {
                     });
                 }
             }
-            const exeState = !isMarkdown && this.executionStateService.getCellExecution(cell.uri);
             if (entries.length === 0) {
-                let preview = content.trim();
                 if (preview.length === 0) {
                     preview = ( localizeWithPath(
                         'vs/workbench/contrib/notebook/browser/viewModel/notebookOutlineEntryFactory',
@@ -75,7 +85,7 @@ class NotebookOutlineEntryFactory {
     async cacheSymbols(cell, outlineModelService, cancelToken) {
         const textModel = await cell.resolveTextModel();
         const outlineModel = await outlineModelService.getOrCreate(textModel, cancelToken);
-        const entries = createOutlineEntries(outlineModel.getTopLevelSymbols(), 7);
+        const entries = createOutlineEntries(outlineModel.getTopLevelSymbols(), 8);
         this.cellOutlineEntryCache[textModel.id] = entries;
     }
 }

package/vscode/src/vs/workbench/contrib/notebook/browser/viewModel/notebookOutlineProvider.js

@@ -5,7 +5,7 @@ import { isEqual } from '../../../../../base/common/resources.js';
 import { IConfigurationService } from '../../../../../platform/configuration/common/configuration.js';
 import { IMarkerService } from '../../../../../platform/markers/common/markers.js';
 import { IThemeService } from '../../../../../platform/theme/common/themeService.js';
-import { CellKind } from '../../common/notebookCommon.js';
+import { NotebookSetting, CellKind } from '../../common/notebookCommon.js';
 import { NotebookExecutionType, INotebookExecutionStateService } from '../../common/notebookExecutionStateService.js';
 import { IOutlineModelService } from '../../../../../editor/contrib/documentSymbols/browser/outlineModel.js';
 import { NotebookOutlineEntryFactory } from './notebookOutlineEntryFactory.js';
@@ -33,7 +33,10 @@ let NotebookCellOutlineProvider = class NotebookCellOutlineProvider {
         this._dispoables.add(selectionListener);
         selectionListener.value = combinedDisposable(Event.debounce(_editor.onDidChangeSelection, (last, _current) => last, 200)(this._recomputeActive, this), Event.debounce(_editor.onDidChangeViewCells, (last, _current) => last ?? _current, 200)(this._recomputeState, this));
         this._dispoables.add(_configurationService.onDidChangeConfiguration(e => {
-            if (e.affectsConfiguration('notebook.outline.showCodeCells')) {
+            if (e.affectsConfiguration(NotebookSetting.outlineShowMarkdownHeadersOnly) ||
+                e.affectsConfiguration(NotebookSetting.outlineShowCodeCells) ||
+                e.affectsConfiguration(NotebookSetting.outlineShowCodeCellSymbols) ||
+                e.affectsConfiguration(NotebookSetting.breadcrumbsShowCodeCells)) {
                 this._recomputeState();
             }
         }));
@@ -82,16 +85,19 @@ let NotebookCellOutlineProvider = class NotebookCellOutlineProvider {
             return;
         }
         let includeCodeCells = true;
-        if (this._target === 1 ) {
-            includeCodeCells = this._configurationService.getValue('notebook.outline.showCodeCells');
-        }
-        else if (this._target === 2 ) {
+        if (this._target === 2 ) {
             includeCodeCells = this._configurationService.getValue('notebook.breadcrumbs.showCodeCells');
         }
-        const notebookCells = notebookEditorWidget.getViewModel().viewCells.filter((cell) => cell.cellKind === CellKind.Markup || includeCodeCells);
+        let notebookCells;
+        if (this._target === 2 ) {
+            notebookCells = notebookEditorWidget.getViewModel().viewCells.filter((cell) => cell.cellKind === CellKind.Markup || includeCodeCells);
+        }
+        else {
+            notebookCells = notebookEditorWidget.getViewModel().viewCells;
+        }
         const entries = [];
         for (const cell of notebookCells) {
-            entries.push(...this._outlineEntryFactory.getOutlineEntries(cell, entries.length));
+            entries.push(...this._outlineEntryFactory.getOutlineEntries(cell, this._target, entries.length));
             this._entriesDisposables.add(cell.model.onDidChangeContent(() => {
                 this._recomputeState();
                 this._onDidChange.fire({});