@codingame/monaco-vscode-api 2.2.2 → 3.1.0

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

@@ -1,9 +1,17 @@
 async function webviewPreloads(ctx) {
-    const $window = window;
     const userAgent = navigator.userAgent;
     const isChrome = (userAgent.indexOf('Chrome') >= 0);
     const textEncoder = ( new TextEncoder());
     const textDecoder = ( new TextDecoder());
+    function promiseWithResolvers() {
+        let resolve;
+        let reject;
+        const promise = ( new Promise((res, rej) => {
+            resolve = res;
+            reject = rej;
+        }));
+        return { promise, resolve: resolve, reject: reject };
+    }
     let currentOptions = ctx.options;
     const isWorkspaceTrusted = ctx.isWorkspaceTrusted;
     let currentRenderOptions = ctx.renderOptions;
@@ -51,7 +59,7 @@ async function webviewPreloads(ctx) {
             };
         };
     const checkOutputInputFocus = () => {
-        const activeElement = $window.document.activeElement;
+        const activeElement = window.document.activeElement;
         if (!activeElement) {
             return;
         }
@@ -148,8 +156,8 @@ async function webviewPreloads(ctx) {
             console.error(e.message);
         }
     };
-    $window.document.body.addEventListener('click', handleInnerClick);
-    $window.document.body.addEventListener('focusin', checkOutputInputFocus);
+    window.document.body.addEventListener('click', handleInnerClick);
+    window.document.body.addEventListener('focusin', checkOutputInputFocus);
     function createKernelContext() {
         return ( Object.freeze({
             onDidReceiveKernelMessage: onDidReceiveKernelMessage.event,
@@ -215,7 +223,7 @@ async function webviewPreloads(ctx) {
             this._observedElements = ( new WeakMap());
             this._observer = ( new ResizeObserver(entries => {
                 for (const entry of entries) {
-                    if (!$window.document.body.contains(entry.target)) {
+                    if (!window.document.body.contains(entry.target)) {
                         continue;
                     }
                     const observedElementInfo = this._observedElements.get(entry.target);
@@ -237,7 +245,7 @@ async function webviewPreloads(ctx) {
                     const shouldUpdatePadding = (newHeight !== 0 && observedElementInfo.lastKnownPadding === 0) ||
                         (newHeight === 0 && observedElementInfo.lastKnownPadding !== 0);
                     if (shouldUpdatePadding) {
-                        $window.requestAnimationFrame(() => {
+                        window.requestAnimationFrame(() => {
                             if (newHeight !== 0) {
                                 entry.target.style.padding = `${ctx.style.outputNodePadding}px ${ctx.style.outputNodePadding}px ${ctx.style.outputNodePadding}px ${ctx.style.outputNodeLeftPadding}px`;
                             }
@@ -289,7 +297,7 @@ async function webviewPreloads(ctx) {
                 if (node.scrollHeight - node.scrollTop - node.clientHeight < 2) {
                     continue;
                 }
-                if ($window.getComputedStyle(node).overflowY === 'hidden' || $window.getComputedStyle(node).overflowY === 'visible') {
+                if (window.getComputedStyle(node).overflowY === 'hidden' || window.getComputedStyle(node).overflowY === 'visible') {
                     continue;
                 }
                 return true;
@@ -307,9 +315,9 @@ async function webviewPreloads(ctx) {
                 deltaX: event.deltaX,
                 deltaY: event.deltaY,
                 deltaZ: event.deltaZ,
-                wheelDelta: event.wheelDelta && isChrome ? (event.wheelDelta / $window.devicePixelRatio) : event.wheelDelta,
-                wheelDeltaX: event.wheelDeltaX && isChrome ? (event.wheelDeltaX / $window.devicePixelRatio) : event.wheelDeltaX,
-                wheelDeltaY: event.wheelDeltaY && isChrome ? (event.wheelDeltaY / $window.devicePixelRatio) : event.wheelDeltaY,
+                wheelDelta: event.wheelDelta && isChrome ? (event.wheelDelta / window.devicePixelRatio) : event.wheelDelta,
+                wheelDeltaX: event.wheelDeltaX && isChrome ? (event.wheelDeltaX / window.devicePixelRatio) : event.wheelDeltaX,
+                wheelDeltaY: event.wheelDeltaY && isChrome ? (event.wheelDeltaY / window.devicePixelRatio) : event.wheelDeltaY,
                 detail: event.detail,
                 shiftKey: event.shiftKey,
                 type: event.type
@@ -317,10 +325,10 @@ async function webviewPreloads(ctx) {
         });
     };
     function focusFirstFocusableOrContainerInOutput(cellOrOutputId, alternateId) {
-        const cellOutputContainer = $window.document.getElementById(cellOrOutputId) ??
-            (alternateId ? $window.document.getElementById(alternateId) : undefined);
+        const cellOutputContainer = window.document.getElementById(cellOrOutputId) ??
+            (alternateId ? window.document.getElementById(alternateId) : undefined);
         if (cellOutputContainer) {
-            if (cellOutputContainer.contains($window.document.activeElement)) {
+            if (cellOutputContainer.contains(window.document.activeElement)) {
                 return;
             }
             let focusableElement = cellOutputContainer.querySelector('[tabindex="0"], [href], button, input, option, select, textarea');
@@ -428,7 +436,7 @@ async function webviewPreloads(ctx) {
         };
     }
     function selectRange(_range) {
-        const sel = $window.getSelection();
+        const sel = window.getSelection();
         if (sel) {
             try {
                 sel.removeAllRanges();
@@ -463,8 +471,8 @@ async function webviewPreloads(ctx) {
             };
         }
         else {
-            $window.document.execCommand('hiliteColor', false, matchColor);
-            const cloneRange = $window.getSelection().getRangeAt(0).cloneRange();
+            window.document.execCommand('hiliteColor', false, matchColor);
+            const cloneRange = window.getSelection().getRangeAt(0).cloneRange();
             const _range = {
                 collapsed: cloneRange.collapsed,
                 commonAncestorContainer: cloneRange.commonAncestorContainer,
@@ -479,9 +487,9 @@ async function webviewPreloads(ctx) {
                     selectRange(_range);
                     try {
                         document.designMode = 'On';
-                        $window.document.execCommand('removeFormat', false, undefined);
+                        window.document.execCommand('removeFormat', false, undefined);
                         document.designMode = 'Off';
-                        $window.getSelection()?.removeAllRanges();
+                        window.getSelection()?.removeAllRanges();
                     }
                     catch (e) {
                         console.log(e);
@@ -491,10 +499,10 @@ async function webviewPreloads(ctx) {
                     selectRange(_range);
                     try {
                         document.designMode = 'On';
-                        $window.document.execCommand('removeFormat', false, undefined);
-                        $window.document.execCommand('hiliteColor', false, color);
+                        window.document.execCommand('removeFormat', false, undefined);
+                        window.document.execCommand('hiliteColor', false, color);
                         document.designMode = 'Off';
-                        $window.getSelection()?.removeAllRanges();
+                        window.getSelection()?.removeAllRanges();
                     }
                     catch (e) {
                         console.log(e);
@@ -549,11 +557,10 @@ async function webviewPreloads(ctx) {
         }
         getOutputItem(outputId, mime) {
             const requestId = this._requestPool++;
-            let resolve;
-            const p = ( new Promise(r => resolve = r));
-            this._requests.set(requestId, { resolve: resolve });
+            const { promise, resolve } = promiseWithResolvers();
+            this._requests.set(requestId, { resolve });
             postNotebookMessage('getOutputItem', { requestId, outputId, mime });
-            return p;
+            return promise;
         }
         resolveOutputItem(requestId, output) {
             const request = this._requests.get(requestId);
@@ -621,13 +628,13 @@ async function webviewPreloads(ctx) {
         return item;
     }
     const onDidReceiveKernelMessage = createEmitter();
-    const ttPolicy = $window.trustedTypes?.createPolicy('notebookRenderer', {
+    const ttPolicy = window.trustedTypes?.createPolicy('notebookRenderer', {
         createHTML: value => value,
         createScript: value => value,
     });
-    $window.addEventListener('wheel', handleWheel);
-    const matchColor = $window.getComputedStyle($window.document.getElementById('_defaultColorPalatte')).color;
-    const currentMatchColor = $window.getComputedStyle($window.document.getElementById('_defaultColorPalatte')).backgroundColor;
+    window.addEventListener('wheel', handleWheel);
+    const matchColor = window.getComputedStyle(window.document.getElementById('_defaultColorPalatte')).color;
+    const currentMatchColor = window.getComputedStyle(window.document.getElementById('_defaultColorPalatte')).backgroundColor;
     class JSHighlighter {
         constructor() {
             this._activeHighlightInfo = ( new Map());
@@ -664,11 +671,11 @@ async function webviewPreloads(ctx) {
             oldMatch?.highlightResult?.update(matchColor, oldMatch.isShadow ? undefined : 'find-match');
             const match = highlightInfo.matches[index];
             highlightInfo.currentMatchIndex = index;
-            const sel = $window.getSelection();
+            const sel = window.getSelection();
             if (!!match && !!sel && match.highlightResult) {
                 let offset = 0;
                 try {
-                    const outputOffset = $window.document.getElementById(match.id).getBoundingClientRect().top;
+                    const outputOffset = window.document.getElementById(match.id).getBoundingClientRect().top;
                     const tempRange = document.createRange();
                     tempRange.selectNode(match.highlightResult.range.startContainer);
                     match.highlightResult.range.startContainer.parentElement?.scrollIntoView({ behavior: 'auto', block: 'end', inline: 'nearest' });
@@ -680,7 +687,7 @@ async function webviewPreloads(ctx) {
                     console.error(e);
                 }
                 match.highlightResult?.update(currentMatchColor, match.isShadow ? undefined : 'current-find-match');
-                $window.document.getSelection()?.removeAllRanges();
+                window.document.getSelection()?.removeAllRanges();
                 postNotebookMessage('didFindHighlightCurrent', {
                     offset
                 });
@@ -697,7 +704,7 @@ async function webviewPreloads(ctx) {
             }
         }
         dispose() {
-            $window.document.getSelection()?.removeAllRanges();
+            window.document.getSelection()?.removeAllRanges();
             this._activeHighlightInfo.forEach(highlightInfo => {
                 highlightInfo.matches.forEach(match => {
                     match.highlightResult?.dispose();
@@ -752,7 +759,7 @@ async function webviewPreloads(ctx) {
             if (match) {
                 let offset = 0;
                 try {
-                    const outputOffset = $window.document.getElementById(match.id).getBoundingClientRect().top;
+                    const outputOffset = window.document.getElementById(match.id).getBoundingClientRect().top;
                     match.originalRange.startContainer.parentElement?.scrollIntoView({ behavior: 'auto', block: 'end', inline: 'nearest' });
                     const rangeOffset = match.originalRange.getBoundingClientRect().top;
                     offset = rangeOffset - outputOffset;
@@ -778,7 +785,7 @@ async function webviewPreloads(ctx) {
             this._refreshRegistry();
         }
         dispose() {
-            $window.document.getSelection()?.removeAllRanges();
+            window.document.getSelection()?.removeAllRanges();
             this._currentMatchesHighlight.clear();
             this._matchesHighlight.clear();
         }
@@ -844,21 +851,21 @@ async function webviewPreloads(ctx) {
         let find = true;
         const matches = [];
         const range = document.createRange();
-        range.selectNodeContents($window.document.getElementById('findStart'));
-        const sel = $window.getSelection();
+        range.selectNodeContents(window.document.getElementById('findStart'));
+        const sel = window.getSelection();
         sel?.removeAllRanges();
         sel?.addRange(range);
         viewModel.toggleDragDropEnabled(false);
         try {
             document.designMode = 'On';
             while (find && matches.length < 500) {
-                find = $window.find(query,  !!options.caseSensitive,
+                find = window.find(query,  !!options.caseSensitive,
                  false,
                  false,
                  !!options.wholeWord,
                  true, false);
                 if (find) {
-                    const selection = $window.getSelection();
+                    const selection = window.getSelection();
                     if (!selection) {
                         console.log('no selection');
                         break;
@@ -932,7 +939,7 @@ async function webviewPreloads(ctx) {
                                     }
                                     break;
                                 }
-                                if (node.id === 'container' || node === $window.document.body) {
+                                if (node.id === 'container' || node === window.document.body) {
                                     break;
                                 }
                             }
@@ -948,7 +955,7 @@ async function webviewPreloads(ctx) {
             console.log(e);
         }
         _highlighter.addHighlights(matches, options.ownerID);
-        $window.document.getSelection()?.removeAllRanges();
+        window.document.getSelection()?.removeAllRanges();
         viewModel.toggleDragDropEnabled(currentOptions.dragAndDropEnabled);
         document.designMode = 'Off';
         postNotebookMessage('didFind', {
@@ -962,27 +969,38 @@ async function webviewPreloads(ctx) {
         });
     };
     const copyOutputImage = async (outputId, altOutputId, retries = 5) => {
-        if (!$window.document.hasFocus() && retries > 0) {
+        if (!window.document.hasFocus() && retries > 0) {
             setTimeout(() => { copyOutputImage(outputId, altOutputId, retries - 1); }, 20);
             return;
         }
         try {
-            const image = $window.document.getElementById(outputId)?.querySelector('img')
-                ?? $window.document.getElementById(altOutputId)?.querySelector('img');
+            const outputElement = window.document.getElementById(outputId)
+                ?? window.document.getElementById(altOutputId);
+            let image = outputElement?.querySelector('img');
+            if (!image) {
+                const svgImage = outputElement?.querySelector('svg.output-image') ??
+                    outputElement?.querySelector('div.svgContainerStyle > svg');
+                if (svgImage) {
+                    image = ( new Image());
+                    image.src = 'data:image/svg+xml,' + encodeURIComponent(svgImage.outerHTML);
+                }
+            }
             if (image) {
+                const imageToCopy = image;
                 await navigator.clipboard.write([( new ClipboardItem({
                         'image/png': ( new Promise((resolve) => {
                             const canvas = document.createElement('canvas');
-                            if (canvas !== null) {
-                                canvas.width = image.naturalWidth;
-                                canvas.height = image.naturalHeight;
-                                const context = canvas.getContext('2d');
-                                context?.drawImage(image, 0, 0);
-                            }
+                            canvas.width = imageToCopy.naturalWidth;
+                            canvas.height = imageToCopy.naturalHeight;
+                            const context = canvas.getContext('2d');
+                            context.drawImage(imageToCopy, 0, 0);
                             canvas.toBlob((blob) => {
                                 if (blob) {
                                     resolve(blob);
                                 }
+                                else {
+                                    console.error('No blob data to write to clipboard');
+                                }
                                 canvas.remove();
                             }, 'image/png');
                         }))
@@ -996,7 +1014,7 @@ async function webviewPreloads(ctx) {
             console.error('Could not copy image:', e);
         }
     };
-    $window.addEventListener('message', async (rawEvent) => {
+    window.addEventListener('message', async (rawEvent) => {
         const event = rawEvent;
         switch (event.data.type) {
             case 'initializeMarkup': {
@@ -1060,7 +1078,7 @@ async function webviewPreloads(ctx) {
             case 'clear':
                 renderers.clearAll();
                 viewModel.clearAll();
-                $window.document.getElementById('container').innerText = '';
+                window.document.getElementById('container').innerText = '';
                 break;
             case 'clearOutput': {
                 const { cellId, rendererId, outputId } = event.data;
@@ -1111,10 +1129,10 @@ async function webviewPreloads(ctx) {
                 focusFirstFocusableOrContainerInOutput(event.data.cellOrOutputId, event.data.alternateId);
                 break;
             case 'decorations': {
-                let outputContainer = $window.document.getElementById(event.data.cellId);
+                let outputContainer = window.document.getElementById(event.data.cellId);
                 if (!outputContainer) {
                     viewModel.ensureOutputCell(event.data.cellId, -100000, true);
-                    outputContainer = $window.document.getElementById(event.data.cellId);
+                    outputContainer = window.document.getElementById(event.data.cellId);
                 }
                 outputContainer?.classList.add(...event.data.addedClassNames);
                 outputContainer?.classList.remove(...event.data.removedClassNames);
@@ -1127,7 +1145,7 @@ async function webviewPreloads(ctx) {
                 renderers.getRenderer(event.data.rendererId)?.receiveMessage(event.data.message);
                 break;
             case 'notebookStyles': {
-                const documentStyle = $window.document.documentElement.style;
+                const documentStyle = window.document.documentElement.style;
                 for (let i = documentStyle.length - 1; i >= 0; i--) {
                     const property = documentStyle[i];
                     if (property && property.startsWith('--notebook-')) {
@@ -1425,7 +1443,7 @@ async function webviewPreloads(ctx) {
         async render(item, preferredRendererId, element, signal) {
             const primaryRenderer = this.findRenderer(preferredRendererId, item);
             if (!primaryRenderer) {
-                const errorMessage = ($window.document.documentElement.style.getPropertyValue('--notebook-cell-renderer-not-found-error') || '').replace('$0', () => item.mime);
+                const errorMessage = (window.document.documentElement.style.getPropertyValue('--notebook-cell-renderer-not-found-error') || '').replace('$0', () => item.mime);
                 this.showRenderError(item, element, errorMessage);
                 return;
             }
@@ -1449,7 +1467,7 @@ async function webviewPreloads(ctx) {
                     }
                 }
             }
-            const errorMessage = ($window.document.documentElement.style.getPropertyValue('--notebook-cell-renderer-fallbacks-exhausted') || '').replace('$0', () => item.mime);
+            const errorMessage = (window.document.documentElement.style.getPropertyValue('--notebook-cell-renderer-fallbacks-exhausted') || '').replace('$0', () => item.mime);
             this.showRenderError(item, element, errorMessage);
         }
         async _doRender(item, element, renderer, signal) {
@@ -1670,12 +1688,8 @@ async function webviewPreloads(ctx) {
             const self = this;
             this.id = id;
             this._content = { value: content, version: 0, metadata: metadata };
-            let resolve;
-            let reject;
-            this.ready = ( new Promise((res, rej) => {
-                resolve = res;
-                reject = rej;
-            }));
+            const { promise, resolve, reject } = promiseWithResolvers();
+            this.ready = promise;
             let cachedData;
             this.outputItem = ( Object.freeze({
                 id,
@@ -1705,7 +1719,7 @@ async function webviewPreloads(ctx) {
                         getItem: async () => this.outputItem,
                     }]
             }));
-            const root = $window.document.getElementById('container');
+            const root = window.document.getElementById('container');
             const markupCell = document.createElement('div');
             markupCell.className = 'markup';
             markupCell.style.position = 'absolute';
@@ -1845,7 +1859,7 @@ async function webviewPreloads(ctx) {
     class OutputCell {
         constructor(cellId) {
             this.outputElements = ( new Map());
-            const container = $window.document.getElementById('container');
+            const container = window.document.getElementById('container');
             const upperWrapperElement = createFocusSink(cellId);
             container.appendChild(upperWrapperElement);
             this.element = document.createElement('div');
@@ -2061,10 +2075,10 @@ async function webviewPreloads(ctx) {
     }
     const markupCellDragManager = new (class MarkupCellDragManager {
         constructor() {
-            $window.document.addEventListener('dragover', e => {
+            window.document.addEventListener('dragover', e => {
                 e.preventDefault();
             });
-            $window.document.addEventListener('drop', e => {
+            window.document.addEventListener('drop', e => {
                 e.preventDefault();
                 const drag = this.currentDrag;
                 if (!drag) {
@@ -2097,7 +2111,7 @@ async function webviewPreloads(ctx) {
                 this.dragOverlay.style.width = '100%';
                 this.dragOverlay.style.height = '100%';
                 this.dragOverlay.style.background = 'transparent';
-                $window.document.body.appendChild(this.dragOverlay);
+                window.document.body.appendChild(this.dragOverlay);
             }
             e.target.style.zIndex = `${overlayZIndex + 1}`;
             e.target.classList.add('dragging');
@@ -2113,9 +2127,9 @@ async function webviewPreloads(ctx) {
                     cellId: cellId,
                     dragOffsetY: this.currentDrag.clientY,
                 });
-                $window.requestAnimationFrame(trySendDragUpdate);
+                window.requestAnimationFrame(trySendDragUpdate);
             };
-            $window.requestAnimationFrame(trySendDragUpdate);
+            window.requestAnimationFrame(trySendDragUpdate);
         }
         updateDrag(e, cellId) {
             if (cellId !== this.currentDrag?.cellId) {
@@ -2132,7 +2146,7 @@ async function webviewPreloads(ctx) {
                 cellId: cellId
             });
             if (this.dragOverlay) {
-                $window.document.body.removeChild(this.dragOverlay);
+                window.document.body.removeChild(this.dragOverlay);
                 this.dragOverlay = undefined;
             }
             e.target.style.zIndex = '';

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

@@ -6,7 +6,6 @@ import { Selection } from '../../../../../editor/common/core/selection.js';
 import { SearchParams } from '../../../../../editor/common/model/textModelSearch.js';
 import { writeTransientState, readTransientState } from '../../../codeEditor/browser/toggleWordWrap.js';
 import { CellEditState, CellFocusMode, CursorAtLineBoundary, CursorAtBoundary } from '../notebookBrowser.js';
-import { getEditorTopPadding } from '../notebookOptions.js';
 class BaseCellViewModel extends Disposable {
     get handle() {
         return this.model.handle;
@@ -170,7 +169,7 @@ class BaseCellViewModel extends Disposable {
                     viewState: {
                         scrollLeft: 0,
                         firstPosition: { lineNumber: 1, column: 1 },
-                        firstPositionDeltaTop: getEditorTopPadding()
+                        firstPositionDeltaTop: this._viewContext.notebookOptions.getLayoutConfiguration().editorTopPadding
                     }
                 });
             }

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

@@ -283,10 +283,7 @@ let NotebookViewModel = class NotebookViewModel extends Disposable {
         }
         const start = clamp(cellRange.start, 0, this.length);
         const end = clamp(cellRange.end, 0, this.length);
-        if (start === end) {
-            return null;
-        }
-        if (start < end) {
+        if (start <= end) {
             return { start, end };
         }
         else {

package/vscode/src/vs/workbench/contrib/notebook/browser/viewParts/notebookEditorStickyScroll.js

@@ -1,5 +1,5 @@
 import { __decorate, __param } from '../../../../../../../../external/tslib/tslib.es6.js';
-import { localizeWithPath } from '../../../../../nls.js';
+import { localize2WithPath, localizeWithPath } from '../../../../../nls.js';
 import { addDisposableListener, EventType, getWindow, clearNode } from '../../../../../base/browser/dom.js';
 import { StandardMouseEvent } from '../../../../../base/browser/mouseEvent.js';
 import { Emitter } from '../../../../../base/common/event.js';
@@ -20,7 +20,7 @@ class ToggleNotebookStickyScroll extends Action2 {
         super({
             id: 'notebook.action.toggleNotebookStickyScroll',
             title: {
-                value: ( localizeWithPath(
+                ...( localize2WithPath(
                     'vs/workbench/contrib/notebook/browser/viewParts/notebookEditorStickyScroll',
                     'toggleStickyScroll',
                     "Toggle Notebook Sticky Scroll"
@@ -30,7 +30,6 @@ class ToggleNotebookStickyScroll extends Action2 {
                     { key: 'mitoggleStickyScroll', comment: ['&& denotes a mnemonic'] },
                     "&&Toggle Notebook Sticky Scroll"
                 )),
-                original: 'Toggle Notebook Sticky Scroll',
             },
             category: Categories.View,
             toggled: {