@codingame/monaco-vscode-api 30.0.1 → 31.0.0

package/vscode/src/vs/workbench/contrib/notebook/browser/media/notebook.css

@@ -3,6 +3,11 @@
  *  Licensed under the MIT License. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 
+.monaco-workbench .editor-instance .notebook-editor {
+	width: 100%;
+	height: 100%;
+}
+
 .monaco-workbench .notebookOverlay.notebook-editor {
 	box-sizing: border-box;
 	line-height: 22px;
@@ -134,6 +139,7 @@
 	display: flex;
 	align-items: center;
 }
+
 .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .monaco-tokenized-source {
 	font-size: var(--notebook-cell-input-preview-font-size);
 	font-family: var(--notebook-cell-input-preview-font-family);
@@ -177,7 +183,7 @@
 	left: 0px;
 	padding: 2px;
 	border-radius: 5px;
-	vertical-align:middle;
+	vertical-align: middle;
 	margin-left: 4px;
 	height: 16px;
 	width: 16px;
@@ -347,15 +353,31 @@
 }
 
 /* high contrast border for multi-select */
-.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-top:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-top:before { border-top-style: dotted; }
-.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-bottom:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-bottom:before { border-bottom-style: dotted; }
-.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before { border-left-style: dotted; }
-.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before, .hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before  { border-right-style: dotted; }
+.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-top:before,
+.hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-top:before {
+	border-top-style: dotted;
+}
+
+.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-bottom:before,
+.hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-focus-indicator-bottom:before {
+	border-bottom-style: dotted;
+}
+
+.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before,
+.hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-left:before {
+	border-left-style: dotted;
+}
+
+.hc-black .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before,
+.hc-light .notebookOverlay .monaco-list.selection-multiple:focus-within .monaco-list-row.selected:not(.focused) .cell-inner-container:not(.cell-editor-focus) .cell-focus-indicator-right:before {
+	border-right-style: dotted;
+}
 
 /** Notebook Cell Comments */
 
 .cell-comment-container.review-widget {
-	border-left: 1px solid var(--vscode-peekView-border); border-right: 1px solid var(--vscode-peekView-border);
+	border-left: 1px solid var(--vscode-peekView-border);
+	border-right: 1px solid var(--vscode-peekView-border);
 	/* Restore text-wrap to default value to avoid inheriting nowrap from monaco-list. */
 	text-wrap: initial;
 }
@@ -411,9 +433,11 @@
 .notebookOverlay .cell-list-top-cell-toolbar-container .action-item {
 	border: solid 1px var(--vscode-notebook-cellToolbarSeparator);
 }
+
 .notebookOverlay .monaco-action-bar .action-item.verticalSeparator {
 	background-color: var(--vscode-notebook-cellToolbarSeparator);
 }
+
 .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container {
 	border-bottom: solid 1px var(--vscode-notebook-cellToolbarSeparator);
 }
@@ -484,6 +508,7 @@
 	overflow: hidden;
 	box-sizing: border-box;
 }
+
 /* -- base cursor styling -- */
 .nb-multicursor-cursor {
 	top: 0;
@@ -495,12 +520,14 @@
 	overflow: hidden;
 	box-sizing: border-box;
 }
+
 /* ======================================================================== */
 /* ======================================================================== */
 /* -- block-style -- */
 .nb-cursor-block-style {
 	width: 8px !important;
 }
+
 /* -- underline-style -- */
 .nb-cursor-underline-style {
 	width: 8px !important;
@@ -508,11 +535,13 @@
 	border-bottom-style: solid;
 	background: transparent;
 }
+
 /* -- line-thin-style -- */
 .nb-cursor-line-thin-style {
 	min-width: none;
 	width: 0.9px !important;
 }
+
 /* -- block-outline-style -- */
 .nb-cursor-block-outline-style {
 	width: 8px !important;
@@ -520,6 +549,7 @@
 	border-style: solid;
 	background: transparent;
 }
+
 /* -- underline-thin-style -- */
 .nb-cursor-underline-thin-style {
 	width: 8px !important;
@@ -527,21 +557,26 @@
 	border-bottom-style: solid;
 	background: transparent;
 }
+
 /* ======================================================================== */
 /* ======================================================================== */
 /* -- cursor animations -- */
 .nb-blink {
 	animation: nb-cursor-blink 1s step-end infinite;
 }
+
 .nb-smooth {
 	animation: nb-cursor-smooth 0.5s ease-in-out 0.5s infinite alternate;
 }
+
 .nb-phase {
 	animation: nb-cursor-phase 0.5s ease-in-out 0.5s infinite alternate;
 }
-.nb-expand{
+
+.nb-expand {
 	animation: nb-cursor-expand 0.5s ease-in-out 0.5s infinite alternate;
 }
+
 .nb-smooth-caret-animation {
 	transition: all 80ms;
 }
@@ -551,38 +586,49 @@
 	0% {
 		opacity: 1;
 	}
+
 	50% {
 		opacity: 0;
 	}
+
 	100% {
 		opacity: 1;
 	}
 }
+
 @keyframes nb-cursor-smooth {
+
 	0%,
 	20% {
 		opacity: 1;
 	}
+
 	60%,
 	100% {
 		opacity: 0;
 	}
 }
+
 @keyframes nb-cursor-phase {
+
 	0%,
 	20% {
 		opacity: 1;
 	}
+
 	90%,
 	100% {
 		opacity: 0;
 	}
 }
+
 @keyframes nb-cursor-expand {
+
 	0%,
 	20% {
 		transform: scaleY(1);
 	}
+
 	80%,
 	100% {
 		transform: scaleY(0);
@@ -601,8 +647,13 @@
 }
 
 /** Cell border color */
-.notebookOverlay .cell.markdown h1 { border-color: var(--vscode-notebook-cellBorderColor); }
-.notebookOverlay .monaco-list-row .cell-editor-part:before { outline: solid 1px var(--vscode-notebook-cellBorderColor); }
+.notebookOverlay .cell.markdown h1 {
+	border-color: var(--vscode-notebook-cellBorderColor);
+}
+
+.notebookOverlay .monaco-list-row .cell-editor-part:before {
+	outline: solid 1px var(--vscode-notebook-cellBorderColor);
+}
 
 /** Cell status bar */
 .monaco-workbench .notebookOverlay .cell-statusbar-container .cell-language-picker:hover,
@@ -660,7 +711,9 @@
 	background-color: var(--vscode-diffEditor-removedTextBackground) !important;
 }
 
-.monaco-workbench .notebookOverlay .codicon-debug-continue { color: var(--vscode-icon-foreground) !important; }
+.monaco-workbench .notebookOverlay .codicon-debug-continue {
+	color: var(--vscode-icon-foreground) !important;
+}
 
 /** Cell Chat **/
 .monaco-workbench .notebookOverlay .monaco-list .monaco-list-row.code-cell-row.nb-chatGenerationHighlight .cell-focus-indicator,

package/vscode/src/vs/workbench/contrib/notebook/browser/notebookAccessibilityProvider.js

@@ -92,18 +92,18 @@ let NotebookAccessibilityProvider = class NotebookAccessibilityProvider extends
         return this.createItemLabel(executionLabel, element.cellKind);
     }
     get widgetAriaLabelName() {
-        return this.isReplHistory ? ( localize(11321, "REPL Editor History")) : ( localize(11322, "Notebook"));
+        return this.isReplHistory ? ( localize(11453, "REPL Editor History")) : ( localize(11454, "Notebook"));
     }
     getWidgetAriaLabel() {
         const keybinding = this.keybindingService.lookupKeybinding(AccessibilityCommandId.OpenAccessibilityHelp)?.getLabel();
         if (this.configurationService.getValue(this.verbositySettingId)) {
             return keybinding ? ( localize(
-                11323,
+                11455,
                 "{0}\nUse {1} for accessibility help",
                 this.widgetAriaLabelName,
                 keybinding
             )) : ( localize(
-                11324,
+                11456,
                 "{0}\nRun the Open Accessibility Help command for more information",
                 this.widgetAriaLabelName
             ));

package/vscode/src/vs/workbench/contrib/notebook/browser/notebookEditor.js

@@ -244,7 +244,7 @@ let NotebookEditor = class NotebookEditor extends EditorPane {
                 const knownProvider = this._notebookService.getViewTypeProvider(input.viewType);
                 if (!knownProvider) {
                     throw ( new Error(( localize(
-                        11325,
+                        11457,
                         "Cannot open resource with notebook editor type '{0}', please check if you have the right extension installed and enabled.",
                         input.viewType
                     ))));
@@ -252,12 +252,12 @@ let NotebookEditor = class NotebookEditor extends EditorPane {
                 await this._extensionsWorkbenchService.whenInitialized;
                 const extensionInfo = this._extensionsWorkbenchService.local.find(e => e.identifier.id === knownProvider);
                 throw createEditorOpenError(( new Error(( localize(
-                    11326,
+                    11458,
                     "Cannot open resource with notebook editor type '{0}', please check if you have the right extension installed and enabled.",
                     input.viewType
                 )))), [toAction({
                     id: "workbench.notebook.action.installOrEnableMissing",
-                    label: extensionInfo ? ( localize(11327, "Enable extension for '{0}'", input.viewType)) : ( localize(11328, "Install extension for '{0}'", input.viewType)),
+                    label: extensionInfo ? ( localize(11459, "Enable extension for '{0}'", input.viewType)) : ( localize(11460, "Install extension for '{0}'", input.viewType)),
                     run: async () => {
                         const d = this._notebookService.onAddViewType(viewType => {
                             if (viewType === input.viewType) {
@@ -284,7 +284,7 @@ let NotebookEditor = class NotebookEditor extends EditorPane {
                     }
                 }), toAction({
                     id: "workbench.notebook.action.openAsText",
-                    label: ( localize(11329, "Open As Text")),
+                    label: ( localize(11461, "Open As Text")),
                     run: async () => {
                         const backup = await this._workingCopyBackupService.resolve({
                             resource: input.resource,
@@ -348,13 +348,13 @@ let NotebookEditor = class NotebookEditor extends EditorPane {
                 let message;
                 if (e instanceof TooLargeFileOperationError) {
                     message = ( localize(
-                        11330,
+                        11462,
                         "The notebook is not displayed in the notebook editor because it is very large ({0}).",
                         ByteSize.formatSize(e.size)
                     ));
                 } else {
                     message = ( localize(
-                        11331,
+                        11463,
                         "The notebook is not displayed in the notebook editor because it is very large."
                     ));
                 }
@@ -362,7 +362,7 @@ let NotebookEditor = class NotebookEditor extends EditorPane {
             }
             const error = createEditorOpenError(e instanceof Error ? e : ( new Error((e ? e.message : ""))), [toAction({
                 id: "workbench.notebook.action.openInTextEditor",
-                label: ( localize(11332, "Open in Text Editor")),
+                label: ( localize(11464, "Open in Text Editor")),
                 run: async () => {
                     const activeEditorPane = this._editorService.activeEditorPane;
                     if (!activeEditorPane) {

package/vscode/src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.d.ts

@@ -10,7 +10,7 @@ import { IConfigurationService } from "../../../../platform/configuration/common
 import { IContextKeyService } from "../../../../platform/contextkey/common/contextkey.service.js";
 import { IContextMenuService } from "../../../../platform/contextview/browser/contextView.service.js";
 import { IInstantiationService } from "../../../../platform/instantiation/common/instantiation.js";
-import { ILayoutService } from "../../../../platform/layout/browser/layoutService.service.js";
+import { IWorkbenchLayoutService } from "../../../services/layout/browser/layoutService.service.js";
 import { IEditorProgressService } from "../../../../platform/progress/common/progress.service.js";
 import { ITelemetryService } from "../../../../platform/telemetry/common/telemetry.service.js";
 import { CellFindMatchWithIndex, CellLayoutContext, IActiveNotebookEditorDelegate, IBaseCellEditorOptions, ICellOutputViewModel, ICellViewModel, ICommonCellInfo, IFocusNotebookCellOptions, IInsetRenderOutput, IModelDecorationsChangeAccessor, INotebookCellOverlayChangeAccessor, INotebookDeltaDecoration, INotebookEditor, INotebookEditorContribution, INotebookEditorCreationOptions, INotebookEditorDelegate, INotebookEditorMouseEvent, INotebookEditorOptions, INotebookEditorViewState, INotebookViewCellsUpdateEvent, INotebookViewZoneChangeAccessor, INotebookWebviewMessage } from "./notebookBrowser.js";
@@ -34,6 +34,7 @@ import { INotebookLoggingService } from "../common/notebookLoggingService.servic
 export declare function getDefaultNotebookCreationOptions(): INotebookEditorCreationOptions;
 export declare class NotebookEditorWidget extends Disposable implements INotebookEditorDelegate, INotebookEditor {
     readonly creationOptions: INotebookEditorCreationOptions;
+    private readonly editorGroupsService;
     private readonly notebookRendererMessaging;
     private readonly notebookEditorService;
     private readonly notebookKernelService;
@@ -92,6 +93,7 @@ export declare class NotebookEditorWidget extends Disposable implements INoteboo
     private readonly _onDidResizeOutputEmitter;
     readonly onDidResizeOutput: Event<ICellViewModel>;
     private _overlayContainer;
+    private _overlayLayout;
     private _notebookTopToolbarContainer;
     private _notebookTopToolbar;
     private _notebookStickyScrollContainer;
@@ -119,7 +121,6 @@ export declare class NotebookEditorWidget extends Disposable implements INoteboo
     private _dimension?;
     private _position?;
     private _shadowElement?;
-    private _shadowElementViewInfo;
     private _cellLayoutManager;
     private readonly _editorFocus;
     private readonly _outputFocus;
@@ -159,7 +160,7 @@ export declare class NotebookEditorWidget extends Disposable implements INoteboo
     private readonly _notebookOptions;
     private _currentProgress;
     get notebookOptions(): NotebookOptions;
-    constructor(creationOptions: INotebookEditorCreationOptions, dimension: DOM.Dimension | undefined, instantiationService: IInstantiationService, editorGroupsService: IEditorGroupsService, notebookRendererMessaging: INotebookRendererMessagingService, notebookEditorService: INotebookEditorService, notebookKernelService: INotebookKernelService, _notebookService: INotebookService, configurationService: IConfigurationService, contextKeyService: IContextKeyService, layoutService: ILayoutService, contextMenuService: IContextMenuService, telemetryService: ITelemetryService, notebookExecutionService: INotebookExecutionService, editorProgressService: IEditorProgressService, logService: INotebookLoggingService);
+    constructor(creationOptions: INotebookEditorCreationOptions, dimension: DOM.Dimension | undefined, instantiationService: IInstantiationService, editorGroupsService: IEditorGroupsService, notebookRendererMessaging: INotebookRendererMessagingService, notebookEditorService: INotebookEditorService, notebookKernelService: INotebookKernelService, _notebookService: INotebookService, configurationService: IConfigurationService, contextKeyService: IContextKeyService, layoutService: IWorkbenchLayoutService, contextMenuService: IContextMenuService, telemetryService: ITelemetryService, notebookExecutionService: INotebookExecutionService, editorProgressService: IEditorProgressService, logService: INotebookLoggingService);
     private _debugFlag;
     private _debug;
     /**
@@ -218,7 +219,6 @@ export declare class NotebookEditorWidget extends Disposable implements INoteboo
     private getBodyHeight;
     layout(dimension: DOM.Dimension, shadowElement?: HTMLElement, position?: DOM.IDomPosition): void;
     private layoutNotebook;
-    private updateShadowElement;
     private layoutContainerOverShadowElement;
     focus(): void;
     onShow(): void;

package/vscode/src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.js

@@ -17,8 +17,9 @@ import * as notebookKernelActionViewItem from './media/notebookKernelActionViewI
 import * as notebookOutline from './media/notebookOutline.css';
 import * as notebookChatEditController from './media/notebookChatEditController.css';
 import * as notebookChatEditorOverlay from './media/notebookChatEditorOverlay.css';
-import { $ as $$1, createElement, getWindow, append, addStandardDisposableGenericMouseDownListener, addStandardDisposableGenericMouseUpListener, trackFocus, runWhenWindowIdle, scheduleAtNextAnimationFrame, getActiveElement, size, isAncestorOfActiveElement } from '../../../../base/browser/dom.js';
+import { $ as $$1, getWindow, createElement, append, addStandardDisposableGenericMouseDownListener, addStandardDisposableGenericMouseUpListener, trackFocus, runWhenWindowIdle, scheduleAtNextAnimationFrame, getActiveElement, size, isHTMLElement, isAncestorOfActiveElement } from '../../../../base/browser/dom.js';
 import { createStyleSheet } from '../../../../base/browser/domStylesheets.js';
+import { OverlayLayoutElement } from '../../../../base/browser/overlayLayoutElement.js';
 import { mainWindow } from '../../../../base/browser/window.js';
 import { SequencerByKey } from '../../../../base/common/async.js';
 import { Color, RGBA } from '../../../../base/common/color.js';
@@ -40,7 +41,8 @@ import { IContextKeyService } from '../../../../platform/contextkey/common/conte
 import { IContextMenuService } from '../../../../platform/contextview/browser/contextView.service.js';
 import { IInstantiationService } from '../../../../platform/instantiation/common/instantiation.js';
 import { ServiceCollection } from '../../../../platform/instantiation/common/serviceCollection.js';
-import { ILayoutService } from '../../../../platform/layout/browser/layoutService.service.js';
+import { Parts } from '../../../services/layout/browser/layoutService.js';
+import { IWorkbenchLayoutService } from '../../../services/layout/browser/layoutService.service.js';
 import { registerZIndex, ZIndex } from '../../../../platform/layout/browser/zIndexRegistry.js';
 import { IEditorProgressService } from '../../../../platform/progress/common/progress.service.js';
 import { ITelemetryService } from '../../../../platform/telemetry/common/telemetry.service.js';
@@ -214,6 +216,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
     ) {
         super();
         this.creationOptions = creationOptions;
+        this.editorGroupsService = editorGroupsService;
         this.notebookRendererMessaging = notebookRendererMessaging;
         this.notebookEditorService = notebookEditorService;
         this.notebookKernelService = notebookKernelService;
@@ -280,7 +283,6 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
         this._renderedEditors = ( new Map());
         this._localStore = this._register(( new DisposableStore()));
         this._localCellStateListeners = [];
-        this._shadowElementViewInfo = null;
         this._contributions = ( new Map());
         this._insetModifyQueueByOutputId = ( new SequencerByKey());
         this._cellContextKeyManager = null;
@@ -296,7 +298,8 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
         this._dimension = dimension;
         this.isReplHistory = creationOptions.isReplHistory ?? false;
         this._readOnly = creationOptions.isReadOnly ?? false;
-        this._overlayContainer = createElement("div");
+        this._overlayLayout = this._register(( new OverlayLayoutElement()));
+        this._overlayContainer = this._overlayLayout.content;
         this.scopedContextKeyService = this._register(contextKeyService.createScoped(this._overlayContainer));
         this.instantiationService = this._register(instantiationService.createChild(( new ServiceCollection([IContextKeyService, this.scopedContextKeyService]))));
         this._notebookOptions = creationOptions.options ?? this.instantiationService.createInstance(
@@ -361,8 +364,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
             if (!this._shadowElement || !this._isVisible) {
                 return;
             }
-            this.updateShadowElement(this._shadowElement, this._dimension);
-            this.layoutContainerOverShadowElement(this._dimension, this._position);
+            this.layoutContainerOverShadowElement(this._shadowElement, this._dimension, this._position);
         }));
         this.notebookEditorService.addNotebookEditor(this);
         const id = generateUuid();
@@ -371,7 +373,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
         this._overlayContainer.classList.add("notebook-editor");
         this._overlayContainer.inert = true;
         this._overlayContainer.style.visibility = "hidden";
-        container.appendChild(this._overlayContainer);
+        container.appendChild(this._overlayLayout.root);
         this._createBody(this._overlayContainer);
         this._generateFontInfo();
         this._isVisible = true;
@@ -1691,7 +1693,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
         );
     }
     layout(dimension, shadowElement, position) {
-        if (!shadowElement && this._shadowElementViewInfo === null) {
+        if (!shadowElement && !this._shadowElement) {
             this._dimension = dimension;
             this._position = position;
             return;
@@ -1709,11 +1711,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
     }
     layoutNotebook(dimension, shadowElement, position) {
         if (shadowElement) {
-            this.updateShadowElement(shadowElement, dimension, position);
-        }
-        if (this._shadowElementViewInfo && this._shadowElementViewInfo.width <= 0 && this._shadowElementViewInfo.height <= 0) {
-            this.onWillHide();
-            return;
+            this._shadowElement = shadowElement;
         }
         this._dimension = dimension;
         this._position = position;
@@ -1734,11 +1732,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
             });
         }
         this._overlayContainer.inert = false;
-        this._overlayContainer.style.visibility = "visible";
-        this._overlayContainer.style.display = "block";
-        this._overlayContainer.style.position = "absolute";
-        this._overlayContainer.style.overflow = "hidden";
-        this.layoutContainerOverShadowElement(dimension, position);
+        this.layoutContainerOverShadowElement(shadowElement ?? this._shadowElement, dimension, position);
         if (this._webviewTransparentCover) {
             this._webviewTransparentCover.style.height = `${dimension.height}px`;
             this._webviewTransparentCover.style.width = `${dimension.width}px`;
@@ -1750,41 +1744,24 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
             fontInfo: true
         }, this.getLayoutInfo()))]);
     }
-    updateShadowElement(shadowElement, dimension, position) {
-        this._shadowElement = shadowElement;
-        if (dimension && position) {
-            this._shadowElementViewInfo = {
-                height: dimension.height,
-                width: dimension.width,
-                top: position.top,
-                left: position.left
-            };
-        } else {
-            const containerRect = shadowElement.getBoundingClientRect();
-            const elementContainerRect = this._overlayContainer.parentElement?.getBoundingClientRect();
-            this._shadowElementViewInfo = {
-                height: containerRect.height,
-                width: containerRect.width,
-                top: containerRect.top - (elementContainerRect?.top || 0),
-                left: containerRect.left - (elementContainerRect?.left || 0)
-            };
-        }
-    }
-    layoutContainerOverShadowElement(dimension, position) {
-        if (dimension && position) {
-            this._overlayContainer.style.top = `${position.top}px`;
-            this._overlayContainer.style.left = `${position.left}px`;
-            this._overlayContainer.style.width = `${dimension.width}px`;
-            this._overlayContainer.style.height = `${dimension.height}px`;
+    layoutContainerOverShadowElement(shadowElement, dimension, position) {
+        if (!shadowElement) {
             return;
         }
-        if (!this._shadowElementViewInfo) {
-            return;
+        const modalEditorContainer = this.editorGroupsService.activeModalEditorPart?.modalElement;
+        let clippingContainer;
+        if (isHTMLElement(modalEditorContainer) && modalEditorContainer.contains(shadowElement)) {
+            clippingContainer = modalEditorContainer;
+        } else {
+            clippingContainer = this.layoutService.getContainer(getWindow(this.getDomNode()), Parts.EDITOR_PART);
         }
-        this._overlayContainer.style.top = `${this._shadowElementViewInfo.top}px`;
-        this._overlayContainer.style.left = `${this._shadowElementViewInfo.left}px`;
-        this._overlayContainer.style.width = `${dimension ? dimension.width : this._shadowElementViewInfo.width}px`;
-        this._overlayContainer.style.height = `${dimension ? dimension.height : this._shadowElementViewInfo.height}px`;
+        this._overlayContainer.style.visibility = "visible";
+        this._overlayLayout.layoutOverAnchorElement(shadowElement, {
+            clippingContainer,
+            fallbackDimension: dimension,
+            fallbackPosition: position
+        });
+        this._overlayLayout.reapplyLayoutStyles();
     }
     focus() {
         this._isVisible = true;
@@ -2838,7 +2815,7 @@ let NotebookEditorWidget = class NotebookEditorWidget extends Disposable {
         };
     }
 };
-NotebookEditorWidget = ( __decorate([( __param(2, IInstantiationService)), ( __param(3, IEditorGroupsService)), ( __param(4, INotebookRendererMessagingService)), ( __param(5, INotebookEditorService)), ( __param(6, INotebookKernelService)), ( __param(7, INotebookService)), ( __param(8, IConfigurationService)), ( __param(9, IContextKeyService)), ( __param(10, ILayoutService)), ( __param(11, IContextMenuService)), ( __param(12, ITelemetryService)), ( __param(13, INotebookExecutionService)), ( __param(14, IEditorProgressService)), ( __param(15, INotebookLoggingService))], NotebookEditorWidget));
+NotebookEditorWidget = ( __decorate([( __param(2, IInstantiationService)), ( __param(3, IEditorGroupsService)), ( __param(4, INotebookRendererMessagingService)), ( __param(5, INotebookEditorService)), ( __param(6, INotebookKernelService)), ( __param(7, INotebookService)), ( __param(8, IConfigurationService)), ( __param(9, IContextKeyService)), ( __param(10, IWorkbenchLayoutService)), ( __param(11, IContextMenuService)), ( __param(12, ITelemetryService)), ( __param(13, INotebookExecutionService)), ( __param(14, IEditorProgressService)), ( __param(15, INotebookLoggingService))], NotebookEditorWidget));
 registerZIndex(ZIndex.Base, 5, "notebook-progress-bar");
 registerZIndex(ZIndex.Base, 10, "notebook-list-insertion-indicator");
 registerZIndex(ZIndex.Base, 20, "notebook-cell-editor-outline");
@@ -2858,51 +2835,51 @@ const notebookCellBorder = registerColor("notebook.cellBorderColor", {
     light: ( transparent(listInactiveSelectionBackground, 1)),
     hcDark: PANEL_BORDER,
     hcLight: PANEL_BORDER
-}, ( localize(11333, "The border color for notebook cells.")));
-registerColor("notebook.focusedEditorBorder", focusBorder, ( localize(11334, "The color of the notebook cell editor border.")));
+}, ( localize(11465, "The border color for notebook cells.")));
+registerColor("notebook.focusedEditorBorder", focusBorder, ( localize(11466, "The color of the notebook cell editor border.")));
 const cellStatusIconSuccess = registerColor(
     "notebookStatusSuccessIcon.foreground",
     debugIconStartForeground,
-    ( localize(11335, "The error icon color of notebook cells in the cell status bar."))
+    ( localize(11467, "The error icon color of notebook cells in the cell status bar."))
 );
 const runningCellRulerDecorationColor = registerColor(
     "notebookEditorOverviewRuler.runningCellForeground",
     debugIconStartForeground,
     ( localize(
-    11336,
+    11468,
     "The color of the running cell decoration in the notebook editor overview ruler."
 ))
 );
-const cellStatusIconError = registerColor("notebookStatusErrorIcon.foreground", errorForeground, ( localize(11337, "The error icon color of notebook cells in the cell status bar.")));
-registerColor("notebookStatusRunningIcon.foreground", foreground, ( localize(11338, "The running icon color of notebook cells in the cell status bar.")));
-registerColor("notebook.outputContainerBorderColor", null, ( localize(11339, "The border color of the notebook output container.")));
-registerColor("notebook.outputContainerBackgroundColor", null, ( localize(11340, "The color of the notebook output container background.")));
+const cellStatusIconError = registerColor("notebookStatusErrorIcon.foreground", errorForeground, ( localize(11469, "The error icon color of notebook cells in the cell status bar.")));
+registerColor("notebookStatusRunningIcon.foreground", foreground, ( localize(11470, "The running icon color of notebook cells in the cell status bar.")));
+registerColor("notebook.outputContainerBorderColor", null, ( localize(11471, "The border color of the notebook output container.")));
+registerColor("notebook.outputContainerBackgroundColor", null, ( localize(11472, "The color of the notebook output container background.")));
 registerColor("notebook.cellToolbarSeparator", {
     dark: ( ( Color.fromHex("#808080")).transparent(0.35)),
     light: ( ( Color.fromHex("#808080")).transparent(0.35)),
     hcDark: contrastBorder,
     hcLight: contrastBorder
-}, ( localize(11341, "The color of the separator in the cell bottom toolbar")));
-const focusedCellBackground = registerColor("notebook.focusedCellBackground", null, ( localize(11342, "The background color of a cell when the cell is focused.")));
+}, ( localize(11473, "The color of the separator in the cell bottom toolbar")));
+const focusedCellBackground = registerColor("notebook.focusedCellBackground", null, ( localize(11474, "The background color of a cell when the cell is focused.")));
 registerColor("notebook.selectedCellBackground", {
     dark: listInactiveSelectionBackground,
     light: listInactiveSelectionBackground,
     hcDark: null,
     hcLight: null
-}, ( localize(11343, "The background color of a cell when the cell is selected.")));
+}, ( localize(11475, "The background color of a cell when the cell is selected.")));
 registerColor("notebook.cellHoverBackground", {
     dark: ( transparent(focusedCellBackground, .5)),
     light: ( transparent(focusedCellBackground, .7)),
     hcDark: null,
     hcLight: null
-}, ( localize(11344, "The background color of a cell when the cell is hovered.")));
+}, ( localize(11476, "The background color of a cell when the cell is hovered.")));
 registerColor("notebook.selectedCellBorder", {
     dark: notebookCellBorder,
     light: notebookCellBorder,
     hcDark: contrastBorder,
     hcLight: contrastBorder
 }, ( localize(
-    11345,
+    11477,
     "The color of the cell's top and bottom border when the cell is selected but not focused."
 )));
 registerColor("notebook.inactiveSelectedCellBorder", {
@@ -2910,13 +2887,13 @@ registerColor("notebook.inactiveSelectedCellBorder", {
     light: null,
     hcDark: focusBorder,
     hcLight: focusBorder
-}, ( localize(11346, "The color of the cell's borders when multiple cells are selected.")));
+}, ( localize(11478, "The color of the cell's borders when multiple cells are selected.")));
 registerColor("notebook.focusedCellBorder", focusBorder, ( localize(
-    11347,
+    11479,
     "The color of the cell's focus indicator borders when the cell is focused."
 )));
 registerColor("notebook.inactiveFocusedCellBorder", notebookCellBorder, ( localize(
-    11348,
+    11480,
     "The color of the cell's top and bottom border when a cell is focused while the primary focus is outside of the editor."
 )));
 registerColor("notebook.cellStatusBarItemHoverBackground", {
@@ -2924,40 +2901,40 @@ registerColor("notebook.cellStatusBarItemHoverBackground", {
     dark: ( new Color(( new RGBA(255, 255, 255, 0.15)))),
     hcDark: ( new Color(( new RGBA(255, 255, 255, 0.15)))),
     hcLight: ( new Color(( new RGBA(0, 0, 0, 0.08))))
-}, ( localize(11349, "The background color of notebook cell status bar items.")));
-registerColor("notebook.cellInsertionIndicator", focusBorder, ( localize(11350, "The color of the notebook cell insertion indicator.")));
+}, ( localize(11481, "The background color of notebook cell status bar items.")));
+registerColor("notebook.cellInsertionIndicator", focusBorder, ( localize(11482, "The color of the notebook cell insertion indicator.")));
 registerColor(
     "notebookScrollbarSlider.background",
     scrollbarSliderBackground,
-    ( localize(11351, "Notebook scrollbar slider background color."))
+    ( localize(11483, "Notebook scrollbar slider background color."))
 );
 registerColor(
     "notebookScrollbarSlider.hoverBackground",
     scrollbarSliderHoverBackground,
-    ( localize(11352, "Notebook scrollbar slider background color when hovering."))
+    ( localize(11484, "Notebook scrollbar slider background color when hovering."))
 );
 registerColor(
     "notebookScrollbarSlider.activeBackground",
     scrollbarSliderActiveBackground,
-    ( localize(11353, "Notebook scrollbar slider background color when clicked on."))
+    ( localize(11485, "Notebook scrollbar slider background color when clicked on."))
 );
 registerColor("notebook.symbolHighlightBackground", {
     dark: ( Color.fromHex("#ffffff0b")),
     light: ( Color.fromHex("#fdff0033")),
     hcDark: null,
     hcLight: null
-}, ( localize(11354, "Background color of highlighted cell")));
+}, ( localize(11486, "Background color of highlighted cell")));
 registerColor("notebook.cellEditorBackground", {
     light: SIDE_BAR_BACKGROUND,
     dark: SIDE_BAR_BACKGROUND,
     hcDark: null,
     hcLight: null
-}, ( localize(11355, "Cell editor background color.")));
+}, ( localize(11487, "Cell editor background color.")));
 const notebookEditorBackground = registerColor("notebook.editorBackground", {
     light: EDITOR_PANE_BACKGROUND,
     dark: EDITOR_PANE_BACKGROUND,
     hcDark: null,
     hcLight: null
-}, ( localize(11356, "Notebook background color.")));
+}, ( localize(11488, "Notebook background color.")));
 
 export { NotebookEditorWidget, cellStatusIconError, cellStatusIconSuccess, focusedCellBackground, getDefaultNotebookCreationOptions, notebookCellBorder, runningCellRulerDecorationColor };