@codingame/monaco-vscode-api 25.1.2 → 26.0.0

package/vscode/src/vs/base/browser/ui/hover/hover.d.ts

@@ -188,6 +188,11 @@ export interface IHoverOptions {
      * Options that define how the hover looks.
      */
     appearance?: IHoverAppearanceOptions;
+    /**
+     * An optional callback that is called when the hover is shown. This is called
+     * later for delayed hovers.
+     */
+    onDidShow?(): void;
 }
 export type IDelayedHoverOptions = Omit<IHoverOptions, "target">;
 export type IDelayedHoverAtMouseOptions = Omit<IDelayedHoverOptions, "position" | "appearance"> & {
@@ -214,6 +219,11 @@ export interface IHoverLifecycleOptions {
      * ```
      */
     groupId?: string;
+    /**
+     * Whether to use a reduced delay before showing the hover. If true, the
+     * `workbench.hover.reducedDelay` setting is used instead of `workbench.hover.delay`.
+     */
+    reducedDelay?: boolean;
     /**
      * Whether to set up space and enter keyboard events for the hover, when these are pressed when
      * the hover's target is focused it will show and focus the hover.

package/vscode/src/vs/base/browser/ui/hover/hoverDelegateFactory.js

@@ -2,24 +2,28 @@
 import { Lazy } from '../../../common/lazy.js';
 
 const nullHoverDelegateFactory = () => ({
-    get delay() { return -1; },
-    dispose: () => { },
-    showHover: () => { return undefined; },
+    get delay() {
+        return -1;
+    },
+    dispose: () => {},
+    showHover: () => {
+        return undefined;
+    }
 });
 let hoverDelegateFactory = nullHoverDelegateFactory;
-const defaultHoverDelegateMouse = ( new Lazy(() => hoverDelegateFactory('mouse', false)));
-const defaultHoverDelegateElement = ( new Lazy(() => hoverDelegateFactory('element', false)));
+const defaultHoverDelegateMouse = ( new Lazy(() => hoverDelegateFactory("mouse", false)));
+const defaultHoverDelegateElement = ( new Lazy(() => hoverDelegateFactory("element", false)));
 function setHoverDelegateFactory(hoverDelegateProvider) {
     hoverDelegateFactory = hoverDelegateProvider;
 }
 function getDefaultHoverDelegate(placement) {
-    if (placement === 'element') {
+    if (placement === "element") {
         return defaultHoverDelegateElement.value;
     }
     return defaultHoverDelegateMouse.value;
 }
 function createInstantHoverDelegate() {
-    return hoverDelegateFactory('element', true);
+    return hoverDelegateFactory("element", true);
 }
 
 export { createInstantHoverDelegate, getDefaultHoverDelegate, setHoverDelegateFactory };

package/vscode/src/vs/base/browser/ui/hover/hoverWidget.js

@@ -11,7 +11,7 @@ import { localize } from '../../../../nls.js';
 registerCss(hoverWidget);
 const $ = $$1;
 var HoverPosition;
-(function (HoverPosition) {
+(function(HoverPosition) {
     HoverPosition[HoverPosition["LEFT"] = 0] = "LEFT";
     HoverPosition[HoverPosition["RIGHT"] = 1] = "RIGHT";
     HoverPosition[HoverPosition["BELOW"] = 2] = "BELOW";
@@ -20,13 +20,13 @@ var HoverPosition;
 class HoverWidget extends Disposable {
     constructor(fadeIn) {
         super();
-        this.containerDomNode = createElement('div');
-        this.containerDomNode.className = 'monaco-hover';
-        this.containerDomNode.classList.toggle('fade-in', !!fadeIn);
+        this.containerDomNode = createElement("div");
+        this.containerDomNode.className = "monaco-hover";
+        this.containerDomNode.classList.toggle("fade-in", !!fadeIn);
         this.containerDomNode.tabIndex = 0;
-        this.containerDomNode.setAttribute('role', 'tooltip');
-        this.contentsDomNode = createElement('div');
-        this.contentsDomNode.className = 'monaco-hover-content';
+        this.containerDomNode.setAttribute("role", "tooltip");
+        this.contentsDomNode = createElement("div");
+        this.contentsDomNode.className = "monaco-hover-content";
         this.scrollbar = this._register(( new DomScrollableElement(this.contentsDomNode, {
             consumeMouseWheelIfScrollbarIsNeeded: true
         })));
@@ -44,16 +44,16 @@ class HoverAction extends Disposable {
         super();
         this.actionLabel = actionOptions.label;
         this.actionKeybindingLabel = keybindingLabel;
-        this.actionContainer = append(parent, $('div.action-container'));
-        this.actionContainer.setAttribute('tabindex', '0');
-        this.action = append(this.actionContainer, $('a.action'));
-        this.action.setAttribute('role', 'button');
+        this.actionContainer = append(parent, $("div.action-container"));
+        this.actionContainer.setAttribute("tabindex", "0");
+        this.action = append(this.actionContainer, $("a.action"));
+        this.action.setAttribute("role", "button");
         if (actionOptions.iconClass) {
             const iconElement = append(this.action, $(`span.icon`));
-            iconElement.classList.add(...actionOptions.iconClass.split(' '));
+            iconElement.classList.add(...actionOptions.iconClass.split(" "));
         }
         this.actionRenderedLabel = keybindingLabel ? `${actionOptions.label} (${keybindingLabel})` : actionOptions.label;
-        const label = append(this.action, $('span'));
+        const label = append(this.action, $("span"));
         label.textContent = this.actionRenderedLabel;
         this._store.add(( new ClickAction(this.actionContainer, actionOptions.run)));
         this._store.add(( new KeyDownAction(this.actionContainer, actionOptions.run, [KeyCode.Enter, KeyCode.Space])));
@@ -61,12 +61,11 @@ class HoverAction extends Disposable {
     }
     setEnabled(enabled) {
         if (enabled) {
-            this.actionContainer.classList.remove('disabled');
-            this.actionContainer.removeAttribute('aria-disabled');
-        }
-        else {
-            this.actionContainer.classList.add('disabled');
-            this.actionContainer.setAttribute('aria-disabled', 'true');
+            this.actionContainer.classList.remove("disabled");
+            this.actionContainer.removeAttribute("aria-disabled");
+        } else {
+            this.actionContainer.classList.add("disabled");
+            this.actionContainer.setAttribute("aria-disabled", "true");
         }
     }
 }
@@ -74,7 +73,7 @@ function getHoverAccessibleViewHint(shouldHaveHint, keybinding) {
     return shouldHaveHint && keybinding ? ( localize(16, "Inspect this in the accessible view with {0}.", keybinding)) : shouldHaveHint ? ( localize(
         17,
         "Inspect this in the accessible view via the command Open Accessible View which is currently not triggerable via keybinding."
-    )) : '';
+    )) : "";
 }
 class ClickAction extends Disposable {
     constructor(container, run) {

package/vscode/src/vs/base/browser/ui/iconLabel/iconLabel.js

@@ -31,7 +31,7 @@ class FastLabelNode {
             return;
         }
         this._classNames = classNames;
-        this._element.classList.value = '';
+        this._element.classList.value = "";
         this._element.classList.add(...classNames);
     }
     set empty(empty) {
@@ -39,7 +39,7 @@ class FastLabelNode {
             return;
         }
         this._empty = empty;
-        this._element.style.marginLeft = empty ? '0' : '';
+        this._element.style.marginLeft = empty ? "0" : "";
     }
     dispose() {
         this.disposed = true;
@@ -50,96 +50,99 @@ class IconLabel extends Disposable {
         super();
         this.customHovers = ( new Map());
         this.creationOptions = options;
-        this.domNode = this._register(( new FastLabelNode(append(container, $('.monaco-icon-label')))));
-        this.labelContainer = append(this.domNode.element, $('.monaco-icon-label-container'));
-        this.nameContainer = append(this.labelContainer, $('span.monaco-icon-name-container'));
+        this.domNode = this._register(( new FastLabelNode(append(container, $(".monaco-icon-label")))));
+        this.labelContainer = append(this.domNode.element, $(".monaco-icon-label-container"));
+        this.nameContainer = append(this.labelContainer, $("span.monaco-icon-name-container"));
         if (options?.supportHighlights || options?.supportIcons) {
             this.nameNode = this._register(( new LabelWithHighlights(this.nameContainer, !!options.supportIcons)));
-        }
-        else {
+        } else {
             this.nameNode = ( new Label(this.nameContainer));
         }
-        this.hoverDelegate = options?.hoverDelegate ?? getDefaultHoverDelegate('mouse');
+        this.hoverDelegate = options?.hoverDelegate ?? getDefaultHoverDelegate("mouse");
     }
     get element() {
         return this.domNode.element;
     }
     setLabel(label, description, options) {
-        const labelClasses = ['monaco-icon-label'];
-        const containerClasses = ['monaco-icon-label-container'];
-        let ariaLabel = '';
+        const labelClasses = ["monaco-icon-label"];
+        const containerClasses = ["monaco-icon-label-container"];
+        let ariaLabel = "";
         if (options) {
             if (options.extraClasses) {
                 labelClasses.push(...options.extraClasses);
             }
             if (options.bold) {
-                labelClasses.push('bold');
+                labelClasses.push("bold");
             }
             if (options.italic) {
-                labelClasses.push('italic');
+                labelClasses.push("italic");
             }
             if (options.strikethrough) {
-                labelClasses.push('strikethrough');
+                labelClasses.push("strikethrough");
             }
             if (options.disabledCommand) {
-                containerClasses.push('disabled');
+                containerClasses.push("disabled");
             }
             if (options.title) {
-                if (typeof options.title === 'string') {
+                if (typeof options.title === "string") {
                     ariaLabel += options.title;
-                }
-                else {
+                } else {
                     ariaLabel += label;
                 }
             }
         }
-        const existingIconNode = this.domNode.element.querySelector('.monaco-icon-label-iconpath');
+        const existingIconNode = this.domNode.element.querySelector(".monaco-icon-label-iconpath");
         if (options?.iconPath) {
             let iconNode;
             if (!existingIconNode || !(isHTMLElement(existingIconNode))) {
-                iconNode = $('.monaco-icon-label-iconpath');
+                iconNode = $(".monaco-icon-label-iconpath");
                 this.domNode.element.prepend(iconNode);
-            }
-            else {
+            } else {
                 iconNode = existingIconNode;
             }
             if (ThemeIcon.isThemeIcon(options.iconPath)) {
                 const iconClass = ThemeIcon.asClassName(options.iconPath);
                 iconNode.className = `monaco-icon-label-iconpath ${iconClass}`;
-                iconNode.style.backgroundImage = '';
-            }
-            else {
+                iconNode.style.backgroundImage = "";
+            } else {
                 iconNode.style.backgroundImage = asCSSUrl(options?.iconPath);
             }
-            iconNode.style.backgroundRepeat = 'no-repeat';
-            iconNode.style.backgroundPosition = 'center';
-            iconNode.style.backgroundSize = 'contain';
-        }
-        else if (existingIconNode) {
+            iconNode.style.backgroundRepeat = "no-repeat";
+            iconNode.style.backgroundPosition = "center";
+            iconNode.style.backgroundSize = "contain";
+        } else if (existingIconNode) {
             existingIconNode.remove();
         }
         this.domNode.classNames = labelClasses;
-        this.domNode.element.setAttribute('aria-label', ariaLabel);
-        this.labelContainer.classList.value = '';
+        this.domNode.element.setAttribute("aria-label", ariaLabel);
+        this.labelContainer.classList.value = "";
         this.labelContainer.classList.add(...containerClasses);
-        this.setupHover(options?.descriptionTitle ? this.labelContainer : this.element, options?.title);
+        this.setupHover(
+            options?.descriptionTitle ? this.labelContainer : this.element,
+            options?.title
+        );
         this.nameNode.setLabel(label, options);
         if (description || this.descriptionNode) {
             const descriptionNode = this.getOrCreateDescriptionNode();
             if (descriptionNode instanceof HighlightedLabel) {
                 const supportIcons = options?.supportIcons ?? this.creationOptions?.supportIcons;
-                descriptionNode.set(description || '', options ? options.descriptionMatches : undefined, undefined, options?.labelEscapeNewLines, supportIcons);
+                descriptionNode.set(
+                    description || "",
+                    options ? options.descriptionMatches : undefined,
+                    undefined,
+                    options?.labelEscapeNewLines,
+                    supportIcons
+                );
                 this.setupHover(descriptionNode.element, options?.descriptionTitle);
-            }
-            else {
-                descriptionNode.textContent = description && options?.labelEscapeNewLines ? HighlightedLabel.escapeNewLines(description, []) : (description || '');
-                this.setupHover(descriptionNode.element, options?.descriptionTitle || '');
+            } else {
+                descriptionNode.textContent = description && options?.labelEscapeNewLines ? HighlightedLabel.escapeNewLines(description, []) : (description || "");
+                this.setupHover(descriptionNode.element, options?.descriptionTitle || "");
                 descriptionNode.empty = !description;
             }
         }
         if (options?.suffix || this.suffixNode) {
             const suffixNode = this.getOrCreateSuffixNode();
-            suffixNode.textContent = options?.suffix ?? '';
+            suffixNode.textContent = options?.suffix ?? "";
         }
     }
     setupHover(htmlElement, tooltip) {
@@ -149,13 +152,13 @@ class IconLabel extends Disposable {
             this.customHovers.delete(htmlElement);
         }
         if (!tooltip) {
-            htmlElement.removeAttribute('title');
+            htmlElement.removeAttribute("title");
             return;
         }
         let hoverTarget = htmlElement;
         if (this.creationOptions?.hoverTargetOverride) {
             if (!isAncestor(htmlElement, this.creationOptions.hoverTargetOverride)) {
-                throw ( new Error('hoverTargetOverrride must be an ancestor of the htmlElement'));
+                throw ( new Error("hoverTargetOverrride must be an ancestor of the htmlElement"));
             }
             hoverTarget = this.creationOptions.hoverTargetOverride;
         }
@@ -173,21 +176,20 @@ class IconLabel extends Disposable {
     }
     getOrCreateSuffixNode() {
         if (!this.suffixNode) {
-            const suffixContainer = this._register(( new FastLabelNode(after(this.nameContainer, $('span.monaco-icon-suffix-container')))));
-            this.suffixNode = this._register(( new FastLabelNode(append(suffixContainer.element, $('span.label-suffix')))));
+            const suffixContainer = this._register(( new FastLabelNode(after(this.nameContainer, $("span.monaco-icon-suffix-container")))));
+            this.suffixNode = this._register(( new FastLabelNode(append(suffixContainer.element, $("span.label-suffix")))));
         }
         return this.suffixNode;
     }
     getOrCreateDescriptionNode() {
         if (!this.descriptionNode) {
             const descriptionContainer = this._register(( new FastLabelNode(
-                append(this.labelContainer, $('span.monaco-icon-description-container'))
+                append(this.labelContainer, $("span.monaco-icon-description-container"))
             )));
             if (this.creationOptions?.supportDescriptionHighlights) {
-                this.descriptionNode = this._register(( new HighlightedLabel(append(descriptionContainer.element, $('span.label-description')))));
-            }
-            else {
-                this.descriptionNode = this._register(( new FastLabelNode(append(descriptionContainer.element, $('span.label-description')))));
+                this.descriptionNode = this._register(( new HighlightedLabel(append(descriptionContainer.element, $("span.label-description")))));
+            } else {
+                this.descriptionNode = this._register(( new FastLabelNode(append(descriptionContainer.element, $("span.label-description")))));
             }
         }
         return this.descriptionNode;
@@ -205,24 +207,33 @@ class Label {
         }
         this.label = label;
         this.options = options;
-        if (typeof label === 'string') {
+        if (typeof label === "string") {
             if (!this.singleLabel) {
-                this.container.textContent = '';
-                this.container.classList.remove('multiple');
-                this.singleLabel = append(this.container, $('a.label-name', { id: options?.domId }));
+                this.container.textContent = "";
+                this.container.classList.remove("multiple");
+                this.singleLabel = append(this.container, $("a.label-name", {
+                    id: options?.domId
+                }));
             }
             this.singleLabel.textContent = label;
-        }
-        else {
-            this.container.textContent = '';
-            this.container.classList.add('multiple');
+        } else {
+            this.container.textContent = "";
+            this.container.classList.add("multiple");
             this.singleLabel = undefined;
             for (let i = 0; i < label.length; i++) {
                 const l = label[i];
                 const id = options?.domId && `${options?.domId}_${i}`;
-                append(this.container, $('a.label-name', { id, 'data-icon-label-count': label.length, 'data-icon-label-index': i, 'role': 'treeitem' }, l));
+                append(this.container, $("a.label-name", {
+                    id,
+                    "data-icon-label-count": label.length,
+                    "data-icon-label-index": i,
+                    "role": "treeitem"
+                }, l));
                 if (i < label.length - 1) {
-                    append(this.container, $('span.label-separator', undefined, options?.separator || '/'));
+                    append(
+                        this.container,
+                        $("span.label-separator", undefined, options?.separator || "/")
+                    );
                 }
             }
         }
@@ -234,11 +245,19 @@ function splitMatches(labels, separator, matches) {
     }
     let labelStart = 0;
     return ( labels.map(label => {
-        const labelRange = { start: labelStart, end: labelStart + label.length };
-        const result = ( ( matches
-            .map(match => Range.intersect(labelRange, match)))
-            .filter(range => !Range.isEmpty(range))
-            .map(({ start, end }) => ({ start: start - labelStart, end: end - labelStart })));
+        const labelRange = {
+            start: labelStart,
+            end: labelStart + label.length
+        };
+        const result = ( ( matches.map(match => Range.intersect(labelRange, match))).filter(range => !Range.isEmpty(range)).map((
+            {
+                start,
+                end
+            }
+        ) => ({
+            start: start - labelStart,
+            end: end - labelStart
+        })));
         labelStart = labelRange.end + separator.length;
         return result;
     }));
@@ -258,29 +277,41 @@ class LabelWithHighlights extends Disposable {
         this.label = label;
         this.options = options;
         const supportIcons = options?.supportIcons ?? this.supportIcons;
-        if (typeof label === 'string') {
+        if (typeof label === "string") {
             if (!this.singleLabel) {
-                this.container.textContent = '';
-                this.container.classList.remove('multiple');
-                this.singleLabel = this._register(( new HighlightedLabel(append(this.container, $('a.label-name', { id: options?.domId })))));
+                this.container.textContent = "";
+                this.container.classList.remove("multiple");
+                this.singleLabel = this._register(( new HighlightedLabel(append(this.container, $("a.label-name", {
+                    id: options?.domId
+                })))));
             }
-            this.singleLabel.set(label, options?.matches, undefined, options?.labelEscapeNewLines, supportIcons);
-        }
-        else {
-            this.container.textContent = '';
-            this.container.classList.add('multiple');
+            this.singleLabel.set(
+                label,
+                options?.matches,
+                undefined,
+                options?.labelEscapeNewLines,
+                supportIcons
+            );
+        } else {
+            this.container.textContent = "";
+            this.container.classList.add("multiple");
             this.singleLabel = undefined;
-            const separator = options?.separator || '/';
+            const separator = options?.separator || "/";
             const matches = splitMatches(label, separator, options?.matches);
             for (let i = 0; i < label.length; i++) {
                 const l = label[i];
                 const m = matches ? matches[i] : undefined;
                 const id = options?.domId && `${options?.domId}_${i}`;
-                const name = $('a.label-name', { id, 'data-icon-label-count': label.length, 'data-icon-label-index': i, 'role': 'treeitem' });
+                const name = $("a.label-name", {
+                    id,
+                    "data-icon-label-count": label.length,
+                    "data-icon-label-index": i,
+                    "role": "treeitem"
+                });
                 const highlightedLabel = this._register(( new HighlightedLabel(append(this.container, name))));
                 highlightedLabel.set(l, m, undefined, options?.labelEscapeNewLines, supportIcons);
                 if (i < label.length - 1) {
-                    append(name, $('span.label-separator', undefined, separator));
+                    append(name, $("span.label-separator", undefined, separator));
                 }
             }
         }

package/vscode/src/vs/base/browser/ui/iconLabel/iconLabels.js

@@ -4,7 +4,7 @@ import { ThemeIcon } from '../../../common/themables.js';
 
 const labelWithIconsRegex = ( new RegExp(
     `(\\\\)?\\$\\((${ThemeIcon.iconNameExpression}(?:${ThemeIcon.iconModifierExpression})?)\\)`,
-    'g'
+    "g"
 ));
 function renderLabelWithIcons(text) {
     const elements = ( new Array());
@@ -17,7 +17,9 @@ function renderLabelWithIcons(text) {
         }
         textStart = (match.index || 0) + match[0].length;
         const [, escaped, codicon] = match;
-        elements.push(escaped ? `$(${codicon})` : renderIcon({ id: codicon }));
+        elements.push(escaped ? `$(${codicon})` : renderIcon({
+            id: codicon
+        }));
     }
     if (textStart < text.length) {
         elements.push(text.substring(textStart));