monaco-editor-core
Version:
A browser based code editor
1,309 lines • 55.3 kB
JavaScript
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the MIT License. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import * as browser from './browser.js';
import { BrowserFeatures } from './canIUse.js';
import { StandardKeyboardEvent } from './keyboardEvent.js';
import { StandardMouseEvent } from './mouseEvent.js';
import { AbstractIdleValue, IntervalTimer, _runWhenIdle } from '../common/async.js';
import { BugIndicatingError, onUnexpectedError } from '../common/errors.js';
import * as event from '../common/event.js';
import { Disposable, DisposableStore, toDisposable } from '../common/lifecycle.js';
import { RemoteAuthorities } from '../common/network.js';
import * as platform from '../common/platform.js';
import { hash } from '../common/hash.js';
import { ensureCodeWindow, mainWindow } from './window.js';
import { derived, derivedOpts, observableValue } from '../common/observable.js';
//# region Multi-Window Support Utilities
export const { registerWindow, getWindow, getDocument, getWindows, getWindowsCount, getWindowId, getWindowById, hasWindow, onDidRegisterWindow, onWillUnregisterWindow, onDidUnregisterWindow } = (function () {
const windows = new Map();
ensureCodeWindow(mainWindow, 1);
const mainWindowRegistration = { window: mainWindow, disposables: new DisposableStore() };
windows.set(mainWindow.vscodeWindowId, mainWindowRegistration);
const onDidRegisterWindow = new event.Emitter();
const onDidUnregisterWindow = new event.Emitter();
const onWillUnregisterWindow = new event.Emitter();
function getWindowById(windowId, fallbackToMain) {
const window = typeof windowId === 'number' ? windows.get(windowId) : undefined;
return window ?? (fallbackToMain ? mainWindowRegistration : undefined);
}
return {
onDidRegisterWindow: onDidRegisterWindow.event,
onWillUnregisterWindow: onWillUnregisterWindow.event,
onDidUnregisterWindow: onDidUnregisterWindow.event,
registerWindow(window) {
if (windows.has(window.vscodeWindowId)) {
return Disposable.None;
}
const disposables = new DisposableStore();
const registeredWindow = {
window,
disposables: disposables.add(new DisposableStore())
};
windows.set(window.vscodeWindowId, registeredWindow);
disposables.add(toDisposable(() => {
windows.delete(window.vscodeWindowId);
onDidUnregisterWindow.fire(window);
}));
disposables.add(addDisposableListener(window, EventType.BEFORE_UNLOAD, () => {
onWillUnregisterWindow.fire(window);
}));
onDidRegisterWindow.fire(registeredWindow);
return disposables;
},
getWindows() {
return windows.values();
},
getWindowsCount() {
return windows.size;
},
getWindowId(targetWindow) {
return targetWindow.vscodeWindowId;
},
hasWindow(windowId) {
return windows.has(windowId);
},
getWindowById,
getWindow(e) {
const candidateNode = e;
if (candidateNode?.ownerDocument?.defaultView) {
return candidateNode.ownerDocument.defaultView.window;
}
const candidateEvent = e;
if (candidateEvent?.view) {
return candidateEvent.view.window;
}
return mainWindow;
},
getDocument(e) {
const candidateNode = e;
return getWindow(candidateNode).document;
}
};
})();
//#endregion
export function clearNode(node) {
while (node.firstChild) {
node.firstChild.remove();
}
}
class DomListener {
constructor(node, type, handler, options) {
this._node = node;
this._type = type;
this._handler = handler;
this._options = (options || false);
this._node.addEventListener(this._type, this._handler, this._options);
}
dispose() {
if (!this._handler) {
// Already disposed
return;
}
this._node.removeEventListener(this._type, this._handler, this._options);
// Prevent leakers from holding on to the dom or handler func
this._node = null;
this._handler = null;
}
}
export function addDisposableListener(node, type, handler, useCaptureOrOptions) {
return new DomListener(node, type, handler, useCaptureOrOptions);
}
function _wrapAsStandardMouseEvent(targetWindow, handler) {
return function (e) {
return handler(new StandardMouseEvent(targetWindow, e));
};
}
function _wrapAsStandardKeyboardEvent(handler) {
return function (e) {
return handler(new StandardKeyboardEvent(e));
};
}
export const addStandardDisposableListener = function addStandardDisposableListener(node, type, handler, useCapture) {
let wrapHandler = handler;
if (type === 'click' || type === 'mousedown' || type === 'contextmenu') {
wrapHandler = _wrapAsStandardMouseEvent(getWindow(node), handler);
}
else if (type === 'keydown' || type === 'keypress' || type === 'keyup') {
wrapHandler = _wrapAsStandardKeyboardEvent(handler);
}
return addDisposableListener(node, type, wrapHandler, useCapture);
};
export const addStandardDisposableGenericMouseDownListener = function addStandardDisposableListener(node, handler, useCapture) {
const wrapHandler = _wrapAsStandardMouseEvent(getWindow(node), handler);
return addDisposableGenericMouseDownListener(node, wrapHandler, useCapture);
};
export const addStandardDisposableGenericMouseUpListener = function addStandardDisposableListener(node, handler, useCapture) {
const wrapHandler = _wrapAsStandardMouseEvent(getWindow(node), handler);
return addDisposableGenericMouseUpListener(node, wrapHandler, useCapture);
};
export function addDisposableGenericMouseDownListener(node, handler, useCapture) {
return addDisposableListener(node, platform.isIOS && BrowserFeatures.pointerEvents ? EventType.POINTER_DOWN : EventType.MOUSE_DOWN, handler, useCapture);
}
export function addDisposableGenericMouseMoveListener(node, handler, useCapture) {
return addDisposableListener(node, platform.isIOS && BrowserFeatures.pointerEvents ? EventType.POINTER_MOVE : EventType.MOUSE_MOVE, handler, useCapture);
}
export function addDisposableGenericMouseUpListener(node, handler, useCapture) {
return addDisposableListener(node, platform.isIOS && BrowserFeatures.pointerEvents ? EventType.POINTER_UP : EventType.MOUSE_UP, handler, useCapture);
}
/**
* Execute the callback the next time the browser is idle, returning an
* {@link IDisposable} that will cancel the callback when disposed. This wraps
* [requestIdleCallback] so it will fallback to [setTimeout] if the environment
* doesn't support it.
*
* @param targetWindow The window for which to run the idle callback
* @param callback The callback to run when idle, this includes an
* [IdleDeadline] that provides the time alloted for the idle callback by the
* browser. Not respecting this deadline will result in a degraded user
* experience.
* @param timeout A timeout at which point to queue no longer wait for an idle
* callback but queue it on the regular event loop (like setTimeout). Typically
* this should not be used.
*
* [IdleDeadline]: https://developer.mozilla.org/en-US/docs/Web/API/IdleDeadline
* [requestIdleCallback]: https://developer.mozilla.org/en-US/docs/Web/API/Window/requestIdleCallback
* [setTimeout]: https://developer.mozilla.org/en-US/docs/Web/API/Window/setTimeout
*/
export function runWhenWindowIdle(targetWindow, callback, timeout) {
return _runWhenIdle(targetWindow, callback, timeout);
}
/**
* An implementation of the "idle-until-urgent"-strategy as introduced
* here: https://philipwalton.com/articles/idle-until-urgent/
*/
export class WindowIdleValue extends AbstractIdleValue {
constructor(targetWindow, executor) {
super(targetWindow, executor);
}
}
/**
* Schedule a callback to be run at the next animation frame.
* This allows multiple parties to register callbacks that should run at the next animation frame.
* If currently in an animation frame, `runner` will be executed immediately.
* @return token that can be used to cancel the scheduled runner (only if `runner` was not executed immediately).
*/
export let runAtThisOrScheduleAtNextAnimationFrame;
/**
* Schedule a callback to be run at the next animation frame.
* This allows multiple parties to register callbacks that should run at the next animation frame.
* If currently in an animation frame, `runner` will be executed at the next animation frame.
* @return token that can be used to cancel the scheduled runner.
*/
export let scheduleAtNextAnimationFrame;
export class WindowIntervalTimer extends IntervalTimer {
/**
*
* @param node The optional node from which the target window is determined
*/
constructor(node) {
super();
this.defaultTarget = node && getWindow(node);
}
cancelAndSet(runner, interval, targetWindow) {
return super.cancelAndSet(runner, interval, targetWindow ?? this.defaultTarget);
}
}
class AnimationFrameQueueItem {
constructor(runner, priority = 0) {
this._runner = runner;
this.priority = priority;
this._canceled = false;
}
dispose() {
this._canceled = true;
}
execute() {
if (this._canceled) {
return;
}
try {
this._runner();
}
catch (e) {
onUnexpectedError(e);
}
}
// Sort by priority (largest to lowest)
static sort(a, b) {
return b.priority - a.priority;
}
}
(function () {
/**
* The runners scheduled at the next animation frame
*/
const NEXT_QUEUE = new Map();
/**
* The runners scheduled at the current animation frame
*/
const CURRENT_QUEUE = new Map();
/**
* A flag to keep track if the native requestAnimationFrame was already called
*/
const animFrameRequested = new Map();
/**
* A flag to indicate if currently handling a native requestAnimationFrame callback
*/
const inAnimationFrameRunner = new Map();
const animationFrameRunner = (targetWindowId) => {
animFrameRequested.set(targetWindowId, false);
const currentQueue = NEXT_QUEUE.get(targetWindowId) ?? [];
CURRENT_QUEUE.set(targetWindowId, currentQueue);
NEXT_QUEUE.set(targetWindowId, []);
inAnimationFrameRunner.set(targetWindowId, true);
while (currentQueue.length > 0) {
currentQueue.sort(AnimationFrameQueueItem.sort);
const top = currentQueue.shift();
top.execute();
}
inAnimationFrameRunner.set(targetWindowId, false);
};
scheduleAtNextAnimationFrame = (targetWindow, runner, priority = 0) => {
const targetWindowId = getWindowId(targetWindow);
const item = new AnimationFrameQueueItem(runner, priority);
let nextQueue = NEXT_QUEUE.get(targetWindowId);
if (!nextQueue) {
nextQueue = [];
NEXT_QUEUE.set(targetWindowId, nextQueue);
}
nextQueue.push(item);
if (!animFrameRequested.get(targetWindowId)) {
animFrameRequested.set(targetWindowId, true);
targetWindow.requestAnimationFrame(() => animationFrameRunner(targetWindowId));
}
return item;
};
runAtThisOrScheduleAtNextAnimationFrame = (targetWindow, runner, priority) => {
const targetWindowId = getWindowId(targetWindow);
if (inAnimationFrameRunner.get(targetWindowId)) {
const item = new AnimationFrameQueueItem(runner, priority);
let currentQueue = CURRENT_QUEUE.get(targetWindowId);
if (!currentQueue) {
currentQueue = [];
CURRENT_QUEUE.set(targetWindowId, currentQueue);
}
currentQueue.push(item);
return item;
}
else {
return scheduleAtNextAnimationFrame(targetWindow, runner, priority);
}
};
})();
export function getComputedStyle(el) {
return getWindow(el).getComputedStyle(el, null);
}
export function getClientArea(element, defaultValue, fallbackElement) {
const elWindow = getWindow(element);
const elDocument = elWindow.document;
// Try with DOM clientWidth / clientHeight
if (element !== elDocument.body) {
return new Dimension(element.clientWidth, element.clientHeight);
}
// If visual view port exits and it's on mobile, it should be used instead of window innerWidth / innerHeight, or document.body.clientWidth / document.body.clientHeight
if (platform.isIOS && elWindow?.visualViewport) {
return new Dimension(elWindow.visualViewport.width, elWindow.visualViewport.height);
}
// Try innerWidth / innerHeight
if (elWindow?.innerWidth && elWindow.innerHeight) {
return new Dimension(elWindow.innerWidth, elWindow.innerHeight);
}
// Try with document.body.clientWidth / document.body.clientHeight
if (elDocument.body && elDocument.body.clientWidth && elDocument.body.clientHeight) {
return new Dimension(elDocument.body.clientWidth, elDocument.body.clientHeight);
}
// Try with document.documentElement.clientWidth / document.documentElement.clientHeight
if (elDocument.documentElement && elDocument.documentElement.clientWidth && elDocument.documentElement.clientHeight) {
return new Dimension(elDocument.documentElement.clientWidth, elDocument.documentElement.clientHeight);
}
if (fallbackElement) {
return getClientArea(fallbackElement, defaultValue);
}
if (defaultValue) {
return defaultValue;
}
throw new Error('Unable to figure out browser width and height');
}
class SizeUtils {
// Adapted from WinJS
// Converts a CSS positioning string for the specified element to pixels.
static convertToPixels(element, value) {
return parseFloat(value) || 0;
}
static getDimension(element, cssPropertyName) {
const computedStyle = getComputedStyle(element);
const value = computedStyle ? computedStyle.getPropertyValue(cssPropertyName) : '0';
return SizeUtils.convertToPixels(element, value);
}
static getBorderLeftWidth(element) {
return SizeUtils.getDimension(element, 'border-left-width');
}
static getBorderRightWidth(element) {
return SizeUtils.getDimension(element, 'border-right-width');
}
static getBorderTopWidth(element) {
return SizeUtils.getDimension(element, 'border-top-width');
}
static getBorderBottomWidth(element) {
return SizeUtils.getDimension(element, 'border-bottom-width');
}
static getPaddingLeft(element) {
return SizeUtils.getDimension(element, 'padding-left');
}
static getPaddingRight(element) {
return SizeUtils.getDimension(element, 'padding-right');
}
static getPaddingTop(element) {
return SizeUtils.getDimension(element, 'padding-top');
}
static getPaddingBottom(element) {
return SizeUtils.getDimension(element, 'padding-bottom');
}
static getMarginLeft(element) {
return SizeUtils.getDimension(element, 'margin-left');
}
static getMarginTop(element) {
return SizeUtils.getDimension(element, 'margin-top');
}
static getMarginRight(element) {
return SizeUtils.getDimension(element, 'margin-right');
}
static getMarginBottom(element) {
return SizeUtils.getDimension(element, 'margin-bottom');
}
}
export class Dimension {
static { this.None = new Dimension(0, 0); }
constructor(width, height) {
this.width = width;
this.height = height;
}
with(width = this.width, height = this.height) {
if (width !== this.width || height !== this.height) {
return new Dimension(width, height);
}
else {
return this;
}
}
static is(obj) {
return typeof obj === 'object' && typeof obj.height === 'number' && typeof obj.width === 'number';
}
static lift(obj) {
if (obj instanceof Dimension) {
return obj;
}
else {
return new Dimension(obj.width, obj.height);
}
}
static equals(a, b) {
if (a === b) {
return true;
}
if (!a || !b) {
return false;
}
return a.width === b.width && a.height === b.height;
}
}
export function getTopLeftOffset(element) {
// Adapted from WinJS.Utilities.getPosition
// and added borders to the mix
let offsetParent = element.offsetParent;
let top = element.offsetTop;
let left = element.offsetLeft;
while ((element = element.parentNode) !== null
&& element !== element.ownerDocument.body
&& element !== element.ownerDocument.documentElement) {
top -= element.scrollTop;
const c = isShadowRoot(element) ? null : getComputedStyle(element);
if (c) {
left -= c.direction !== 'rtl' ? element.scrollLeft : -element.scrollLeft;
}
if (element === offsetParent) {
left += SizeUtils.getBorderLeftWidth(element);
top += SizeUtils.getBorderTopWidth(element);
top += element.offsetTop;
left += element.offsetLeft;
offsetParent = element.offsetParent;
}
}
return {
left: left,
top: top
};
}
export function size(element, width, height) {
if (typeof width === 'number') {
element.style.width = `${width}px`;
}
if (typeof height === 'number') {
element.style.height = `${height}px`;
}
}
/**
* Returns the position of a dom node relative to the entire page.
*/
export function getDomNodePagePosition(domNode) {
const bb = domNode.getBoundingClientRect();
const window = getWindow(domNode);
return {
left: bb.left + window.scrollX,
top: bb.top + window.scrollY,
width: bb.width,
height: bb.height
};
}
/**
* Returns the effective zoom on a given element before window zoom level is applied
*/
export function getDomNodeZoomLevel(domNode) {
let testElement = domNode;
let zoom = 1.0;
do {
// eslint-disable-next-line local/code-no-any-casts
const elementZoomLevel = getComputedStyle(testElement).zoom;
if (elementZoomLevel !== null && elementZoomLevel !== undefined && elementZoomLevel !== '1') {
zoom *= elementZoomLevel;
}
testElement = testElement.parentElement;
} while (testElement !== null && testElement !== testElement.ownerDocument.documentElement);
return zoom;
}
// Adapted from WinJS
// Gets the width of the element, including margins.
export function getTotalWidth(element) {
const margin = SizeUtils.getMarginLeft(element) + SizeUtils.getMarginRight(element);
return element.offsetWidth + margin;
}
export function getContentWidth(element) {
const border = SizeUtils.getBorderLeftWidth(element) + SizeUtils.getBorderRightWidth(element);
const padding = SizeUtils.getPaddingLeft(element) + SizeUtils.getPaddingRight(element);
return element.offsetWidth - border - padding;
}
// Adapted from WinJS
// Gets the height of the content of the specified element. The content height does not include borders or padding.
export function getContentHeight(element) {
const border = SizeUtils.getBorderTopWidth(element) + SizeUtils.getBorderBottomWidth(element);
const padding = SizeUtils.getPaddingTop(element) + SizeUtils.getPaddingBottom(element);
return element.offsetHeight - border - padding;
}
// Adapted from WinJS
// Gets the height of the element, including its margins.
export function getTotalHeight(element) {
const margin = SizeUtils.getMarginTop(element) + SizeUtils.getMarginBottom(element);
return element.offsetHeight + margin;
}
// ----------------------------------------------------------------------------------------
export function isAncestor(testChild, testAncestor) {
return Boolean(testAncestor?.contains(testChild));
}
export function findParentWithClass(node, clazz, stopAtClazzOrNode) {
while (node && node.nodeType === node.ELEMENT_NODE) {
if (node.classList.contains(clazz)) {
return node;
}
if (stopAtClazzOrNode) {
if (typeof stopAtClazzOrNode === 'string') {
if (node.classList.contains(stopAtClazzOrNode)) {
return null;
}
}
else {
if (node === stopAtClazzOrNode) {
return null;
}
}
}
node = node.parentNode;
}
return null;
}
export function hasParentWithClass(node, clazz, stopAtClazzOrNode) {
return !!findParentWithClass(node, clazz, stopAtClazzOrNode);
}
export function isShadowRoot(node) {
return (node && !!node.host && !!node.mode);
}
export function isInShadowDOM(domNode) {
return !!getShadowRoot(domNode);
}
export function getShadowRoot(domNode) {
while (domNode.parentNode) {
if (domNode === domNode.ownerDocument?.body) {
// reached the body
return null;
}
domNode = domNode.parentNode;
}
return isShadowRoot(domNode) ? domNode : null;
}
/**
* Returns the active element across all child windows
* based on document focus. Falls back to the main
* window if no window has focus.
*/
export function getActiveElement() {
let result = getActiveDocument().activeElement;
while (result?.shadowRoot) {
result = result.shadowRoot.activeElement;
}
return result;
}
/**
* Returns true if the focused window active element matches
* the provided element. Falls back to the main window if no
* window has focus.
*/
export function isActiveElement(element) {
return getActiveElement() === element;
}
/**
* Returns true if the focused window active element is contained in
* `ancestor`. Falls back to the main window if no window has focus.
*/
export function isAncestorOfActiveElement(ancestor) {
return isAncestor(getActiveElement(), ancestor);
}
/**
* Returns the active document across main and child windows.
* Prefers the window with focus, otherwise falls back to
* the main windows document.
*/
export function getActiveDocument() {
if (getWindowsCount() <= 1) {
return mainWindow.document;
}
const documents = Array.from(getWindows()).map(({ window }) => window.document);
return documents.find(doc => doc.hasFocus()) ?? mainWindow.document;
}
/**
* Returns the active window across main and child windows.
* Prefers the window with focus, otherwise falls back to
* the main window.
*/
export function getActiveWindow() {
const document = getActiveDocument();
return (document.defaultView?.window ?? mainWindow);
}
export const sharedMutationObserver = new class {
constructor() {
this.mutationObservers = new Map();
}
observe(target, disposables, options) {
let mutationObserversPerTarget = this.mutationObservers.get(target);
if (!mutationObserversPerTarget) {
mutationObserversPerTarget = new Map();
this.mutationObservers.set(target, mutationObserversPerTarget);
}
const optionsHash = hash(options);
let mutationObserverPerOptions = mutationObserversPerTarget.get(optionsHash);
if (!mutationObserverPerOptions) {
const onDidMutate = new event.Emitter();
const observer = new MutationObserver(mutations => onDidMutate.fire(mutations));
observer.observe(target, options);
const resolvedMutationObserverPerOptions = mutationObserverPerOptions = {
users: 1,
observer,
onDidMutate: onDidMutate.event
};
disposables.add(toDisposable(() => {
resolvedMutationObserverPerOptions.users -= 1;
if (resolvedMutationObserverPerOptions.users === 0) {
onDidMutate.dispose();
observer.disconnect();
mutationObserversPerTarget?.delete(optionsHash);
if (mutationObserversPerTarget?.size === 0) {
this.mutationObservers.delete(target);
}
}
}));
mutationObserversPerTarget.set(optionsHash, mutationObserverPerOptions);
}
else {
mutationObserverPerOptions.users += 1;
}
return mutationObserverPerOptions.onDidMutate;
}
};
export function isHTMLElement(e) {
// eslint-disable-next-line no-restricted-syntax
return e instanceof HTMLElement || e instanceof getWindow(e).HTMLElement;
}
export function isHTMLAnchorElement(e) {
// eslint-disable-next-line no-restricted-syntax
return e instanceof HTMLAnchorElement || e instanceof getWindow(e).HTMLAnchorElement;
}
export function isSVGElement(e) {
// eslint-disable-next-line no-restricted-syntax
return e instanceof SVGElement || e instanceof getWindow(e).SVGElement;
}
export function isMouseEvent(e) {
// eslint-disable-next-line no-restricted-syntax
return e instanceof MouseEvent || e instanceof getWindow(e).MouseEvent;
}
export function isKeyboardEvent(e) {
// eslint-disable-next-line no-restricted-syntax
return e instanceof KeyboardEvent || e instanceof getWindow(e).KeyboardEvent;
}
export const EventType = {
// Mouse
CLICK: 'click',
AUXCLICK: 'auxclick',
DBLCLICK: 'dblclick',
MOUSE_UP: 'mouseup',
MOUSE_DOWN: 'mousedown',
MOUSE_OVER: 'mouseover',
MOUSE_MOVE: 'mousemove',
MOUSE_OUT: 'mouseout',
MOUSE_ENTER: 'mouseenter',
MOUSE_LEAVE: 'mouseleave',
MOUSE_WHEEL: 'wheel',
POINTER_UP: 'pointerup',
POINTER_DOWN: 'pointerdown',
POINTER_MOVE: 'pointermove',
POINTER_LEAVE: 'pointerleave',
CONTEXT_MENU: 'contextmenu',
WHEEL: 'wheel',
// Keyboard
KEY_DOWN: 'keydown',
KEY_PRESS: 'keypress',
KEY_UP: 'keyup',
// HTML Document
LOAD: 'load',
BEFORE_UNLOAD: 'beforeunload',
UNLOAD: 'unload',
PAGE_SHOW: 'pageshow',
PAGE_HIDE: 'pagehide',
PASTE: 'paste',
ABORT: 'abort',
ERROR: 'error',
RESIZE: 'resize',
SCROLL: 'scroll',
FULLSCREEN_CHANGE: 'fullscreenchange',
WK_FULLSCREEN_CHANGE: 'webkitfullscreenchange',
// Form
SELECT: 'select',
CHANGE: 'change',
SUBMIT: 'submit',
RESET: 'reset',
FOCUS: 'focus',
FOCUS_IN: 'focusin',
FOCUS_OUT: 'focusout',
BLUR: 'blur',
INPUT: 'input',
// Local Storage
STORAGE: 'storage',
// Drag
DRAG_START: 'dragstart',
DRAG: 'drag',
DRAG_ENTER: 'dragenter',
DRAG_LEAVE: 'dragleave',
DRAG_OVER: 'dragover',
DROP: 'drop',
DRAG_END: 'dragend',
// Animation
ANIMATION_START: browser.isWebKit ? 'webkitAnimationStart' : 'animationstart',
ANIMATION_END: browser.isWebKit ? 'webkitAnimationEnd' : 'animationend',
ANIMATION_ITERATION: browser.isWebKit ? 'webkitAnimationIteration' : 'animationiteration'
};
export function isEventLike(obj) {
const candidate = obj;
return !!(candidate && typeof candidate.preventDefault === 'function' && typeof candidate.stopPropagation === 'function');
}
export const EventHelper = {
stop: (e, cancelBubble) => {
e.preventDefault();
if (cancelBubble) {
e.stopPropagation();
}
return e;
}
};
export function saveParentsScrollTop(node) {
const r = [];
for (let i = 0; node && node.nodeType === node.ELEMENT_NODE; i++) {
r[i] = node.scrollTop;
node = node.parentNode;
}
return r;
}
export function restoreParentsScrollTop(node, state) {
for (let i = 0; node && node.nodeType === node.ELEMENT_NODE; i++) {
if (node.scrollTop !== state[i]) {
node.scrollTop = state[i];
}
node = node.parentNode;
}
}
class FocusTracker extends Disposable {
get onDidFocus() { return this._onDidFocus.event; }
get onDidBlur() { return this._onDidBlur.event; }
static hasFocusWithin(element) {
if (isHTMLElement(element)) {
const shadowRoot = getShadowRoot(element);
const activeElement = (shadowRoot ? shadowRoot.activeElement : element.ownerDocument.activeElement);
return isAncestor(activeElement, element);
}
else {
const window = element;
return isAncestor(window.document.activeElement, window.document);
}
}
constructor(element) {
super();
this._onDidFocus = this._register(new event.Emitter());
this._onDidBlur = this._register(new event.Emitter());
let hasFocus = FocusTracker.hasFocusWithin(element);
let loosingFocus = false;
const onFocus = () => {
loosingFocus = false;
if (!hasFocus) {
hasFocus = true;
this._onDidFocus.fire();
}
};
const onBlur = () => {
if (hasFocus) {
loosingFocus = true;
(isHTMLElement(element) ? getWindow(element) : element).setTimeout(() => {
if (loosingFocus) {
loosingFocus = false;
hasFocus = false;
this._onDidBlur.fire();
}
}, 0);
}
};
this._refreshStateHandler = () => {
const currentNodeHasFocus = FocusTracker.hasFocusWithin(element);
if (currentNodeHasFocus !== hasFocus) {
if (hasFocus) {
onBlur();
}
else {
onFocus();
}
}
};
this._register(addDisposableListener(element, EventType.FOCUS, onFocus, true));
this._register(addDisposableListener(element, EventType.BLUR, onBlur, true));
if (isHTMLElement(element)) {
this._register(addDisposableListener(element, EventType.FOCUS_IN, () => this._refreshStateHandler()));
this._register(addDisposableListener(element, EventType.FOCUS_OUT, () => this._refreshStateHandler()));
}
}
}
/**
* Creates a new `IFocusTracker` instance that tracks focus changes on the given `element` and its descendants.
*
* @param element The `HTMLElement` or `Window` to track focus changes on.
* @returns An `IFocusTracker` instance.
*/
export function trackFocus(element) {
return new FocusTracker(element);
}
export function after(sibling, child) {
sibling.after(child);
return child;
}
export function append(parent, ...children) {
parent.append(...children);
if (children.length === 1 && typeof children[0] !== 'string') {
return children[0];
}
}
export function prepend(parent, child) {
parent.insertBefore(child, parent.firstChild);
return child;
}
/**
* Removes all children from `parent` and appends `children`
*/
export function reset(parent, ...children) {
parent.textContent = '';
append(parent, ...children);
}
const SELECTOR_REGEX = /([\w\-]+)?(#([\w\-]+))?((\.([\w\-]+))*)/;
export var Namespace;
(function (Namespace) {
Namespace["HTML"] = "http://www.w3.org/1999/xhtml";
Namespace["SVG"] = "http://www.w3.org/2000/svg";
})(Namespace || (Namespace = {}));
function _$(namespace, description, attrs, ...children) {
const match = SELECTOR_REGEX.exec(description);
if (!match) {
throw new Error('Bad use of emmet');
}
const tagName = match[1] || 'div';
let result;
if (namespace !== Namespace.HTML) {
result = document.createElementNS(namespace, tagName);
}
else {
result = document.createElement(tagName);
}
if (match[3]) {
result.id = match[3];
}
if (match[4]) {
result.className = match[4].replace(/\./g, ' ').trim();
}
if (attrs) {
Object.entries(attrs).forEach(([name, value]) => {
if (typeof value === 'undefined') {
return;
}
if (/^on\w+$/.test(name)) {
// eslint-disable-next-line local/code-no-any-casts
result[name] = value;
}
else if (name === 'selected') {
if (value) {
result.setAttribute(name, 'true');
}
}
else {
result.setAttribute(name, value);
}
});
}
result.append(...children);
return result;
}
export function $(description, attrs, ...children) {
return _$(Namespace.HTML, description, attrs, ...children);
}
$.SVG = function (description, attrs, ...children) {
return _$(Namespace.SVG, description, attrs, ...children);
};
export function setVisibility(visible, ...elements) {
if (visible) {
show(...elements);
}
else {
hide(...elements);
}
}
export function show(...elements) {
for (const element of elements) {
element.style.display = '';
element.removeAttribute('aria-hidden');
}
}
export function hide(...elements) {
for (const element of elements) {
element.style.display = 'none';
element.setAttribute('aria-hidden', 'true');
}
}
/**
* Find a value usable for a dom node size such that the likelihood that it would be
* displayed with constant screen pixels size is as high as possible.
*
* e.g. We would desire for the cursors to be 2px (CSS px) wide. Under a devicePixelRatio
* of 1.25, the cursor will be 2.5 screen pixels wide. Depending on how the dom node aligns/"snaps"
* with the screen pixels, it will sometimes be rendered with 2 screen pixels, and sometimes with 3 screen pixels.
*/
export function computeScreenAwareSize(window, cssPx) {
const screenPx = window.devicePixelRatio * cssPx;
return Math.max(1, Math.floor(screenPx)) / window.devicePixelRatio;
}
/**
* Open safely a new window. This is the best way to do so, but you cannot tell
* if the window was opened or if it was blocked by the browser's popup blocker.
* If you want to tell if the browser blocked the new window, use {@link windowOpenWithSuccess}.
*
* See https://github.com/microsoft/monaco-editor/issues/601
* To protect against malicious code in the linked site, particularly phishing attempts,
* the window.opener should be set to null to prevent the linked site from having access
* to change the location of the current page.
* See https://mathiasbynens.github.io/rel-noopener/
*/
export function windowOpenNoOpener(url) {
// By using 'noopener' in the `windowFeatures` argument, the newly created window will
// not be able to use `window.opener` to reach back to the current page.
// See https://stackoverflow.com/a/46958731
// See https://developer.mozilla.org/en-US/docs/Web/API/Window/open#noopener
// However, this also doesn't allow us to realize if the browser blocked
// the creation of the window.
mainWindow.open(url, '_blank', 'noopener');
}
export function animate(targetWindow, fn) {
const step = () => {
fn();
stepDisposable = scheduleAtNextAnimationFrame(targetWindow, step);
};
let stepDisposable = scheduleAtNextAnimationFrame(targetWindow, step);
return toDisposable(() => stepDisposable.dispose());
}
RemoteAuthorities.setPreferredWebSchema(/^https:/.test(mainWindow.location.href) ? 'https' : 'http');
export class ModifierKeyEmitter extends event.Emitter {
constructor() {
super();
this._subscriptions = new DisposableStore();
this._keyStatus = {
altKey: false,
shiftKey: false,
ctrlKey: false,
metaKey: false
};
this._subscriptions.add(event.Event.runAndSubscribe(onDidRegisterWindow, ({ window, disposables }) => this.registerListeners(window, disposables), { window: mainWindow, disposables: this._subscriptions }));
}
registerListeners(window, disposables) {
disposables.add(addDisposableListener(window, 'keydown', e => {
if (e.defaultPrevented) {
return;
}
const event = new StandardKeyboardEvent(e);
// If Alt-key keydown event is repeated, ignore it #112347
// Only known to be necessary for Alt-Key at the moment #115810
if (event.keyCode === 6 /* KeyCode.Alt */ && e.repeat) {
return;
}
if (e.altKey && !this._keyStatus.altKey) {
this._keyStatus.lastKeyPressed = 'alt';
}
else if (e.ctrlKey && !this._keyStatus.ctrlKey) {
this._keyStatus.lastKeyPressed = 'ctrl';
}
else if (e.metaKey && !this._keyStatus.metaKey) {
this._keyStatus.lastKeyPressed = 'meta';
}
else if (e.shiftKey && !this._keyStatus.shiftKey) {
this._keyStatus.lastKeyPressed = 'shift';
}
else if (event.keyCode !== 6 /* KeyCode.Alt */) {
this._keyStatus.lastKeyPressed = undefined;
}
else {
return;
}
this._keyStatus.altKey = e.altKey;
this._keyStatus.ctrlKey = e.ctrlKey;
this._keyStatus.metaKey = e.metaKey;
this._keyStatus.shiftKey = e.shiftKey;
if (this._keyStatus.lastKeyPressed) {
this._keyStatus.event = e;
this.fire(this._keyStatus);
}
}, true));
disposables.add(addDisposableListener(window, 'keyup', e => {
if (e.defaultPrevented) {
return;
}
if (!e.altKey && this._keyStatus.altKey) {
this._keyStatus.lastKeyReleased = 'alt';
}
else if (!e.ctrlKey && this._keyStatus.ctrlKey) {
this._keyStatus.lastKeyReleased = 'ctrl';
}
else if (!e.metaKey && this._keyStatus.metaKey) {
this._keyStatus.lastKeyReleased = 'meta';
}
else if (!e.shiftKey && this._keyStatus.shiftKey) {
this._keyStatus.lastKeyReleased = 'shift';
}
else {
this._keyStatus.lastKeyReleased = undefined;
}
if (this._keyStatus.lastKeyPressed !== this._keyStatus.lastKeyReleased) {
this._keyStatus.lastKeyPressed = undefined;
}
this._keyStatus.altKey = e.altKey;
this._keyStatus.ctrlKey = e.ctrlKey;
this._keyStatus.metaKey = e.metaKey;
this._keyStatus.shiftKey = e.shiftKey;
if (this._keyStatus.lastKeyReleased) {
this._keyStatus.event = e;
this.fire(this._keyStatus);
}
}, true));
disposables.add(addDisposableListener(window.document.body, 'mousedown', () => {
this._keyStatus.lastKeyPressed = undefined;
}, true));
disposables.add(addDisposableListener(window.document.body, 'mouseup', () => {
this._keyStatus.lastKeyPressed = undefined;
}, true));
disposables.add(addDisposableListener(window.document.body, 'mousemove', e => {
if (e.buttons) {
this._keyStatus.lastKeyPressed = undefined;
}
}, true));
disposables.add(addDisposableListener(window, 'blur', () => {
this.resetKeyStatus();
}));
}
get keyStatus() {
return this._keyStatus;
}
/**
* Allows to explicitly reset the key status based on more knowledge (#109062)
*/
resetKeyStatus() {
this.doResetKeyStatus();
this.fire(this._keyStatus);
}
doResetKeyStatus() {
this._keyStatus = {
altKey: false,
shiftKey: false,
ctrlKey: false,
metaKey: false
};
}
static getInstance() {
if (!ModifierKeyEmitter.instance) {
ModifierKeyEmitter.instance = new ModifierKeyEmitter();
}
return ModifierKeyEmitter.instance;
}
dispose() {
super.dispose();
this._subscriptions.dispose();
}
}
export class DragAndDropObserver extends Disposable {
constructor(element, callbacks) {
super();
this.element = element;
this.callbacks = callbacks;
// A helper to fix issues with repeated DRAG_ENTER / DRAG_LEAVE
// calls see https://github.com/microsoft/vscode/issues/14470
// when the element has child elements where the events are fired
// repeadedly.
this.counter = 0;
// Allows to measure the duration of the drag operation.
this.dragStartTime = 0;
this.registerListeners();
}
registerListeners() {
if (this.callbacks.onDragStart) {
this._register(addDisposableListener(this.element, EventType.DRAG_START, (e) => {
this.callbacks.onDragStart?.(e);
}));
}
if (this.callbacks.onDrag) {
this._register(addDisposableListener(this.element, EventType.DRAG, (e) => {
this.callbacks.onDrag?.(e);
}));
}
this._register(addDisposableListener(this.element, EventType.DRAG_ENTER, (e) => {
this.counter++;
this.dragStartTime = e.timeStamp;
this.callbacks.onDragEnter?.(e);
}));
this._register(addDisposableListener(this.element, EventType.DRAG_OVER, (e) => {
e.preventDefault(); // needed so that the drop event fires (https://stackoverflow.com/questions/21339924/drop-event-not-firing-in-chrome)
this.callbacks.onDragOver?.(e, e.timeStamp - this.dragStartTime);
}));
this._register(addDisposableListener(this.element, EventType.DRAG_LEAVE, (e) => {
this.counter--;
if (this.counter === 0) {
this.dragStartTime = 0;
this.callbacks.onDragLeave?.(e);
}
}));
this._register(addDisposableListener(this.element, EventType.DRAG_END, (e) => {
this.counter = 0;
this.dragStartTime = 0;
this.callbacks.onDragEnd?.(e);
}));
this._register(addDisposableListener(this.element, EventType.DROP, (e) => {
this.counter = 0;
this.dragStartTime = 0;
this.callbacks.onDrop?.(e);
}));
}
}
const H_REGEX = /(?<tag>[\w\-]+)?(?:#(?<id>[\w\-]+))?(?<class>(?:\.(?:[\w\-]+))*)(?:@(?<name>(?:[\w\_])+))?/;
export function h(tag, ...args) {
let attributes;
let children;
if (Array.isArray(args[0])) {
attributes = {};
children = args[0];
}
else {
// eslint-disable-next-line local/code-no-any-casts
attributes = args[0] || {};
children = args[1];
}
const match = H_REGEX.exec(tag);
if (!match || !match.groups) {
throw new Error('Bad use of h');
}
const tagName = match.groups['tag'] || 'div';
const el = document.createElement(tagName);
if (match.groups['id']) {
el.id = match.groups['id'];
}
const classNames = [];
if (match.groups['class']) {
for (const className of match.groups['class'].split('.')) {
if (className !== '') {
classNames.push(className);
}
}
}
if (attributes.className !== undefined) {
for (const className of attributes.className.split('.')) {
if (className !== '') {
classNames.push(className);
}
}
}
if (classNames.length > 0) {
el.className = classNames.join(' ');
}
const result = {};
if (match.groups['name']) {
result[match.groups['name']] = el;
}
if (children) {
for (const c of children) {
if (isHTMLElement(c)) {
el.appendChild(c);
}
else if (typeof c === 'string') {
el.append(c);
}
else if ('root' in c) {
Object.assign(result, c);
el.appendChild(c.root);
}
}
}
for (const [key, value] of Object.entries(attributes)) {
if (key === 'className') {
continue;
}
else if (key === 'style') {
for (const [cssKey, cssValue] of Object.entries(value)) {
el.style.setProperty(camelCaseToHyphenCase(cssKey), typeof cssValue === 'number' ? cssValue + 'px' : '' + cssValue);
}
}
else if (key === 'tabIndex') {
el.tabIndex = value;
}
else {
el.setAttribute(camelCaseToHyphenCase(key), value.toString());
}
}
result['root'] = el;
return result;
}
function camelCaseToHyphenCase(str) {
return str.replace(/([a-z])([A-Z])/g, '$1-$2').toLowerCase();
}
export function isEditableElement(element) {
return element.tagName.toLowerCase() === 'input' || element.tagName.toLowerCase() === 'textarea' || isHTMLElement(element) && !!element.editContext;
}
export var n;
(function (n) {
function nodeNs(elementNs = undefined) {
return (tag, attributes, children) => {
const className = attributes.class;
delete attributes.class;
const ref = attributes.ref;
delete attributes.ref;
const obsRef = attributes.obsRef;
delete attributes.obsRef;
// eslint-disable-next-line local/code-no-any-casts
return new ObserverNodeWithElement(tag, ref, obsRef, elementNs, className, attributes, children);
};
}
function node(tag, elementNs = undefined) {
// eslint-disable-next-line local/code-no-any-casts
const f = nodeNs(elementNs);
return (attributes, children) => {
return f(tag, attributes, children);
};
}
n.div = node('div');
n.elem = nodeNs(undefined);
n.svg = node('svg', 'http://www.w3.org/2000/svg');
n.svgElem = nodeNs('http://www.w3.org/2000/svg');
function ref() {
let value = undefined;
const result = function (val) {
value = val;
};
Object.defineProperty(result, 'element', {
get() {
if (!value) {
throw new BugIndicatingError('Make sure the ref is set before accessing the element. Maybe wrong initialization order?');
}
return value;
}
});
// eslint-disable-next-line local/code-no-any-casts
return result;
}
n.ref = ref;
})(n || (n = {}));
export class ObserverNode {
constructor(tag, ref, obsRef, ns, className, attributes, children) {
this._deriveds = [];
this._element = (ns ? document.createElementNS(ns, tag) : document.createElement(tag));
if (ref) {
ref(this._element);
}
if (obsRef) {
this._deriveds.push(derived((_reader) => {
obsRef(this);
_reader.store.add({
dispose: () => {
obsRef(null);
}
});
}));
}
if (className) {
if (hasObservable(className)) {
this._deriveds.push(derived(this, reader => {
/** @description set.class */
setClassName(this._element, getClassName(className, reader));
}));
}
else {
setClassName(this._element, getClassName(className, undefined));
}
}
for (const [key, value] of Object.entries(attributes)) {
if (key === 'style') {
for (const [cssKey, cssValue] of Object.entries(value)) {
const key = camelCaseToHyphenCase(cssKey);
if (isObservable(cssValue)) {
this._deriveds.push(derivedOpts({ owner: this, debugName: () => `set.style.${key}` }, reader => {
this._element.style.setProperty(key, convertCssValue(cssValue.read(reader)));
}));
}
else {
this._element.style.setProperty(key, convertCssValue(cssValue));
}
}
}
else if (key === 'tabIndex') {
if (isObservable(value)) {
this._deriveds.push(derived(this, reader => {
/** @description set.tabIndex */
// eslint-disable-next-line local/code-no-any-casts
this._element.tabIndex = value.read(reader);
}));
}
else {
this._element.tabIndex = value;
}
}
else if (key.startsWith('on')) {
// eslint-disable-next-line local/code-no-any-casts
this._element[key] = value;
}
else {
if (isObservable(value)) {
this._deriveds.push(derivedOpts({ owner: this, debugName: () => `set.${key}` }, reader => {
setOrRemoveAttribute(this._element, key, valu