@codingame/monaco-vscode-api 19.1.3 → 20.0.0

package/vscode/src/vs/base/browser/markdownRenderer.js

@@ -1,23 +1,22 @@
 
 import { onUnexpectedError } from '../common/errors.js';
 import { Event } from '../common/event.js';
-import { removeMarkdownEscapes, escapeDoubleQuotes, parseHrefAndDimensions, isMarkdownString } from '../common/htmlContent.js';
+import { removeMarkdownEscapes, escapeDoubleQuotes, parseHrefAndDimensions } from '../common/htmlContent.js';
 import { markdownEscapeEscapedIcons } from '../common/iconLabels.js';
 import { defaultGenerator } from '../common/idGenerator.js';
 import { KeyCode } from '../common/keyCodes.js';
 import { Lazy } from '../common/lazy.js';
-import { DisposableStore, toDisposable } from '../common/lifecycle.js';
-import { Marked, defaults, parse as parse$1, Renderer, lexer } from 'marked';
+import { DisposableStore } from '../common/lifecycle.js';
+import { Marked, parse as parse$1, Renderer, lexer } from 'marked';
 import { parse } from '../common/marshalling.js';
 import { Schemas, FileAccess } from '../common/network.js';
 import { cloneAndChange } from '../common/objects.js';
 import { resolvePath, dirname } from '../common/resources.js';
 import { escape } from '../common/strings.js';
 import { URI } from '../common/uri.js';
-import { reset, addDisposableListener, getWindow, $, isHTMLElement, hookDomPurifyHrefAndSrcSanitizer, basicMarkupHtmlTags } from './dom.js';
-import dompurify from 'dompurify';
+import { createElement, reset, addDisposableListener, getWindow, $, isHTMLElement } from './dom.js';
+import { sanitizeHtml, basicMarkupHtmlTags } from './domSanitize.js';
 import { DomEmitter } from './event.js';
-import { createElement } from './formattedTextRenderer.js';
 import { StandardKeyboardEvent } from './keyboardEvent.js';
 import { StandardMouseEvent } from './mouseEvent.js';
 import { renderLabelWithIcons } from './ui/iconLabel/iconLabels.js';
@@ -62,18 +61,17 @@ const defaultMarkedRenderers = ( Object.freeze({
         return `<a href="${href}" title="${title || href}" draggable="false">${text}</a>`;
     },
 }));
-function renderMarkdown(markdown, options = {}, markedOptions = {}) {
+function renderMarkdown(markdown, options = {}, target) {
     const disposables = ( new DisposableStore());
     let isDisposed = false;
-    const element = createElement(options);
-    const markedInstance = new Marked(...(markedOptions.markedExtensions ?? []));
+    const markedInstance = new Marked(...(options.markedExtensions ?? []));
     const { renderer, codeBlocks, syncCodeBlocks } = createMarkdownRenderer(markedInstance, options, markdown);
     const value = preprocessMarkdownString(markdown);
     let renderedMarkdown;
     if (options.fillInIncompleteTokens) {
         const opts = {
-            ...defaults,
-            ...markedOptions,
+            ...markedInstance.defaults,
+            ...options.markedOptions,
             renderer
         };
         const tokens = markedInstance.lexer(value, opts);
@@ -81,16 +79,17 @@ function renderMarkdown(markdown, options = {}, markedOptions = {}) {
         renderedMarkdown = markedInstance.parser(newTokens, opts);
     }
     else {
-        renderedMarkdown = markedInstance.parse(value, { ...markedOptions, renderer, async: false });
+        renderedMarkdown = markedInstance.parse(value, { ...options?.markedOptions, renderer, async: false });
     }
     if (markdown.supportThemeIcons) {
         const elements = renderLabelWithIcons(renderedMarkdown);
         renderedMarkdown = ( elements.map(e => typeof e === 'string' ? e : e.outerHTML)).join('');
     }
     const htmlParser = ( new DOMParser());
-    const markdownHtmlDoc = htmlParser.parseFromString(sanitizeRenderedMarkdown({ isTrusted: markdown.isTrusted, ...options.sanitizerOptions }, renderedMarkdown), 'text/html');
+    const markdownHtmlDoc = htmlParser.parseFromString(sanitizeRenderedMarkdown(renderedMarkdown, markdown.isTrusted ?? false, options.sanitizerConfig), 'text/html');
     rewriteRenderedLinks(markdown, options, markdownHtmlDoc.body);
-    element.innerHTML = sanitizeRenderedMarkdown({ isTrusted: markdown.isTrusted, ...options.sanitizerOptions }, markdownHtmlDoc.body.innerHTML);
+    const element = target ?? createElement('div');
+    element.innerHTML = sanitizeRenderedMarkdown(markdownHtmlDoc.body.innerHTML, markdown.isTrusted ?? false, options.sanitizerConfig);
     if (codeBlocks.length > 0) {
         Promise.all(codeBlocks).then((tuples) => {
             if (isDisposed) {
@@ -163,9 +162,9 @@ function rewriteRenderedLinks(markdown, options, root) {
             }
             catch (err) { }
             el.setAttribute('src', massageHref(markdown, href, true));
-            if (options.remoteImageIsAllowed) {
+            if (options.sanitizerConfig?.remoteImageIsAllowed) {
                 const uri = ( URI.parse(href));
-                if (uri.scheme !== Schemas.file && uri.scheme !== Schemas.data && !options.remoteImageIsAllowed(uri)) {
+                if (uri.scheme !== Schemas.file && uri.scheme !== Schemas.data && !options.sanitizerConfig.remoteImageIsAllowed(uri)) {
                     el.replaceWith($('', undefined, el.outerHTML));
                 }
             }
@@ -190,7 +189,7 @@ function rewriteRenderedLinks(markdown, options, root) {
     }
 }
 function createMarkdownRenderer(marked, options, markdown) {
-    const renderer = new marked.Renderer();
+    const renderer = new marked.Renderer(options.markedOptions);
     renderer.image = defaultMarkedRenderers.image;
     renderer.link = defaultMarkedRenderers.link;
     renderer.paragraph = defaultMarkedRenderers.paragraph;
@@ -214,7 +213,7 @@ function createMarkdownRenderer(marked, options, markdown) {
     }
     if (!markdown.supportHtml) {
         renderer.html = ({ text }) => {
-            if (options.sanitizerOptions?.replaceWithPlaintext) {
+            if (options.sanitizerConfig?.replaceWithPlaintext) {
                 return escape(text);
             }
             const match = markdown.isTrusted ? text.match(/^(<span[^>]+>)|(<\/\s*span>)$/) : undefined;
@@ -320,88 +319,15 @@ function resolveWithBaseUri(baseUri, href) {
     }
 }
 const selfClosingTags = ['area', 'base', 'br', 'col', 'command', 'embed', 'hr', 'img', 'input', 'keygen', 'link', 'meta', 'param', 'source', 'track', 'wbr'];
-function sanitizeRenderedMarkdown(options, renderedMarkdown) {
-    const { config, allowedSchemes } = getSanitizerOptions(options);
-    const store = ( new DisposableStore());
-    store.add(addDompurifyHook('uponSanitizeAttribute', (element, e) => {
-        if (e.attrName === 'style' || e.attrName === 'class') {
-            if (element.tagName === 'SPAN') {
-                if (e.attrName === 'style') {
-                    e.keepAttr = /^(color\:(#[0-9a-fA-F]+|var\(--vscode(-[a-zA-Z0-9]+)+\));)?(background-color\:(#[0-9a-fA-F]+|var\(--vscode(-[a-zA-Z0-9]+)+\));)?(border-radius:[0-9]+px;)?$/.test(e.attrValue);
-                    return;
-                }
-                else if (e.attrName === 'class') {
-                    e.keepAttr = /^codicon codicon-[a-z\-]+( codicon-modifier-[a-z\-]+)?$/.test(e.attrValue);
-                    return;
-                }
-            }
-            e.keepAttr = false;
-            return;
-        }
-        else if (element.tagName === 'INPUT' && element.attributes.getNamedItem('type')?.value === 'checkbox') {
-            if ((e.attrName === 'type' && e.attrValue === 'checkbox') || e.attrName === 'disabled' || e.attrName === 'checked') {
-                e.keepAttr = true;
-                return;
-            }
-            e.keepAttr = false;
-        }
-    }));
-    store.add(addDompurifyHook('uponSanitizeElement', (element, e) => {
-        if (e.tagName === 'input') {
-            if (element.attributes.getNamedItem('type')?.value === 'checkbox') {
-                element.setAttribute('disabled', '');
-            }
-            else if (!options.replaceWithPlaintext) {
-                element.remove();
-            }
-        }
-        if (options.replaceWithPlaintext && !e.allowedTags[e.tagName] && e.tagName !== 'body') {
-            if (element.parentElement) {
-                let startTagText;
-                let endTagText;
-                if (e.tagName === '#comment') {
-                    startTagText = `<!--${element.textContent}-->`;
-                }
-                else {
-                    const isSelfClosing = selfClosingTags.includes(e.tagName);
-                    const attrString = element.attributes.length ?
-                        ' ' + ( Array.from(element.attributes)
-                            .map(attr => `${attr.name}="${attr.value}"`))
-                            .join(' ')
-                        : '';
-                    startTagText = `<${e.tagName}${attrString}>`;
-                    if (!isSelfClosing) {
-                        endTagText = `</${e.tagName}>`;
-                    }
-                }
-                const fragment = document.createDocumentFragment();
-                const textNode = element.parentElement.ownerDocument.createTextNode(startTagText);
-                fragment.appendChild(textNode);
-                const endTagTextNode = endTagText ? element.parentElement.ownerDocument.createTextNode(endTagText) : undefined;
-                while (element.firstChild) {
-                    fragment.appendChild(element.firstChild);
-                }
-                if (endTagTextNode) {
-                    fragment.appendChild(endTagTextNode);
-                }
-                if (element.nodeType === Node.COMMENT_NODE) {
-                    element.parentElement.insertBefore(fragment, element);
-                }
-                else {
-                    element.parentElement.replaceChild(fragment, element);
-                }
-            }
-        }
-    }));
-    store.add(hookDomPurifyHrefAndSrcSanitizer(allowedSchemes));
-    try {
-        return dompurify.sanitize(renderedMarkdown, { ...config, RETURN_TRUSTED_TYPE: true });
-    }
-    finally {
-        store.dispose();
-    }
+function sanitizeRenderedMarkdown(renderedMarkdown, isTrusted, options = {}) {
+    const sanitizerConfig = getSanitizerOptions(isTrusted, options);
+    return sanitizeHtml(renderedMarkdown, sanitizerConfig);
 }
-const allowedMarkdownAttr = [
+const allowedMarkdownHtmlTags = ( Object.freeze([
+    ...basicMarkupHtmlTags,
+    'input',
+]));
+const allowedMarkdownHtmlAttributes = [
     'align',
     'autoplay',
     'alt',
@@ -409,8 +335,6 @@ const allowedMarkdownAttr = [
     'class',
     'colspan',
     'controls',
-    'data-code',
-    'data-href',
     'disabled',
     'draggable',
     'height',
@@ -421,50 +345,159 @@ const allowedMarkdownAttr = [
     'poster',
     'rowspan',
     'src',
-    'style',
     'target',
     'title',
     'type',
     'width',
     'start',
+    'data-code',
+    'data-href',
+    'style',
+    'class',
 ];
-function getSanitizerOptions(options) {
-    const allowedSchemes = [
+function getSanitizerOptions(isTrusted, options) {
+    const allowedLinkSchemes = [
         Schemas.http,
         Schemas.https,
         Schemas.mailto,
-        Schemas.data,
         Schemas.file,
         Schemas.vscodeFileResource,
         Schemas.vscodeRemote,
         Schemas.vscodeRemoteResource,
         Schemas.vscodeNotebookCell
     ];
-    if (options.isTrusted) {
-        allowedSchemes.push(Schemas.command);
+    if (isTrusted) {
+        allowedLinkSchemes.push(Schemas.command);
     }
-    if (options.allowedProductProtocols) {
-        allowedSchemes.push(...options.allowedProductProtocols);
+    if (options.allowedLinkSchemes?.augment) {
+        allowedLinkSchemes.push(...options.allowedLinkSchemes.augment);
     }
     return {
-        config: {
-            ALLOWED_TAGS: options.allowedTags ?? [...basicMarkupHtmlTags],
-            ALLOWED_ATTR: allowedMarkdownAttr,
-            ALLOW_UNKNOWN_PROTOCOLS: true,
+        allowedTags: {
+            override: options.allowedTags?.override ?? allowedMarkdownHtmlTags
+        },
+        allowedAttributes: {
+            override: allowedMarkdownHtmlAttributes,
+        },
+        allowedLinkProtocols: {
+            override: allowedLinkSchemes,
         },
-        allowedSchemes
+        allowedMediaProtocols: {
+            override: [
+                Schemas.http,
+                Schemas.https,
+                Schemas.data,
+                Schemas.file,
+                Schemas.vscodeFileResource,
+                Schemas.vscodeRemote,
+                Schemas.vscodeRemoteResource,
+            ]
+        },
+        _do_not_use_hooks: {
+            uponSanitizeAttribute: (element, e) => {
+                if (options.customAttrSanitizer) {
+                    const result = options.customAttrSanitizer(e.attrName, e.attrValue);
+                    if (typeof result === 'string') {
+                        if (result) {
+                            e.attrValue = result;
+                            e.keepAttr = true;
+                        }
+                        else {
+                            e.keepAttr = false;
+                        }
+                    }
+                    else {
+                        e.keepAttr = result;
+                    }
+                    return;
+                }
+                if (e.attrName === 'style' || e.attrName === 'class') {
+                    if (element.tagName === 'SPAN') {
+                        if (e.attrName === 'style') {
+                            e.keepAttr = /^(color\:(#[0-9a-fA-F]+|var\(--vscode(-[a-zA-Z0-9]+)+\));)?(background-color\:(#[0-9a-fA-F]+|var\(--vscode(-[a-zA-Z0-9]+)+\));)?(border-radius:[0-9]+px;)?$/.test(e.attrValue);
+                            return;
+                        }
+                        else if (e.attrName === 'class') {
+                            e.keepAttr = /^codicon codicon-[a-z\-]+( codicon-modifier-[a-z\-]+)?$/.test(e.attrValue);
+                            return;
+                        }
+                    }
+                    e.keepAttr = false;
+                    return;
+                }
+                else if (element.tagName === 'INPUT' && element.attributes.getNamedItem('type')?.value === 'checkbox') {
+                    if ((e.attrName === 'type' && e.attrValue === 'checkbox') || e.attrName === 'disabled' || e.attrName === 'checked') {
+                        e.keepAttr = true;
+                        return;
+                    }
+                    e.keepAttr = false;
+                }
+            },
+            uponSanitizeElement: (element, e) => {
+                let wantsReplaceWithPlaintext = false;
+                if (e.tagName === 'input') {
+                    if (element.attributes.getNamedItem('type')?.value === 'checkbox') {
+                        element.setAttribute('disabled', '');
+                    }
+                    else if (options.replaceWithPlaintext) {
+                        wantsReplaceWithPlaintext = true;
+                    }
+                    else {
+                        element.remove();
+                        return;
+                    }
+                }
+                if (options.replaceWithPlaintext && (wantsReplaceWithPlaintext || (!e.allowedTags[e.tagName] && e.tagName !== 'body'))) {
+                    if (element.parentElement) {
+                        let startTagText;
+                        let endTagText;
+                        if (e.tagName === '#comment') {
+                            startTagText = `<!--${element.textContent}-->`;
+                        }
+                        else {
+                            const isSelfClosing = selfClosingTags.includes(e.tagName);
+                            const attrString = element.attributes.length ?
+                                ' ' + ( Array.from(element.attributes)
+                                    .map(attr => `${attr.name}="${attr.value}"`))
+                                    .join(' ')
+                                : '';
+                            startTagText = `<${e.tagName}${attrString}>`;
+                            if (!isSelfClosing) {
+                                endTagText = `</${e.tagName}>`;
+                            }
+                        }
+                        const fragment = document.createDocumentFragment();
+                        const textNode = element.parentElement.ownerDocument.createTextNode(startTagText);
+                        fragment.appendChild(textNode);
+                        const endTagTextNode = endTagText ? element.parentElement.ownerDocument.createTextNode(endTagText) : undefined;
+                        while (element.firstChild) {
+                            fragment.appendChild(element.firstChild);
+                        }
+                        if (endTagTextNode) {
+                            fragment.appendChild(endTagTextNode);
+                        }
+                        if (element.nodeType === Node.COMMENT_NODE) {
+                            element.parentElement.insertBefore(fragment, element);
+                        }
+                        else {
+                            element.parentElement.replaceChild(fragment, element);
+                        }
+                    }
+                }
+            }
+        }
     };
 }
-function renderStringAsPlaintext(string) {
-    return isMarkdownString(string) ? renderMarkdownAsPlaintext(string) : string;
-}
-function renderMarkdownAsPlaintext(markdown, withCodeBlocks) {
-    let value = markdown.value ?? '';
+function renderAsPlaintext(str, options) {
+    if (typeof str === 'string') {
+        return str;
+    }
+    let value = str.value ?? '';
     if (value.length > 100_000) {
         value = `${value.substr(0, 100_000)}…`;
     }
-    const html = parse$1(value, { async: false, renderer: withCodeBlocks ? plainTextWithCodeBlocksRenderer.value : plainTextRenderer.value });
-    return ( sanitizeRenderedMarkdown({ isTrusted: false }, html)
+    const html = parse$1(value, { async: false, renderer: options?.includeCodeBlocksFences ? plainTextWithCodeBlocksRenderer.value : plainTextRenderer.value });
+    return ( sanitizeRenderedMarkdown(html,  false, {})
         .toString())
         .replace(/&(#\d+|[a-zA-Z]+);/g, m => unescapeInfo.get(m) ?? m)
         .trim();
@@ -758,9 +791,5 @@ function completeTable(tokens) {
     }
     return undefined;
 }
-function addDompurifyHook(hook, cb) {
-    dompurify.addHook(hook, cb);
-    return toDisposable(() => dompurify.removeHook(hook));
-}
 
-export { allowedMarkdownAttr, fillInIncompleteTokens, renderMarkdown, renderMarkdownAsPlaintext, renderStringAsPlaintext };
+export { allowedMarkdownHtmlAttributes, allowedMarkdownHtmlTags, fillInIncompleteTokens, renderAsPlaintext, renderMarkdown };

package/vscode/src/vs/base/browser/ui/actionbar/actionViewItems.d.ts

@@ -6,6 +6,7 @@ import { ISelectBoxOptions, ISelectBoxStyles, ISelectOptionItem, SelectBox } fro
 import { IToggleStyles } from "../toggle/toggle.js";
 import { IAction, IActionRunner } from "../../../common/actions.js";
 import { Disposable } from "../../../common/lifecycle.js";
+import type { IManagedHoverContent } from "../hover/hover.js";
 export interface IBaseActionViewItemOptions {
     draggable?: boolean;
     isMenu?: boolean;
@@ -38,6 +39,7 @@ export declare class BaseActionViewItem extends Disposable implements IActionVie
     protected updateLabel(): void;
     protected getClass(): string | undefined;
     protected getTooltip(): string | undefined;
+    protected getHoverContents(): IManagedHoverContent | undefined;
     protected updateTooltip(): void;
     protected updateAriaLabel(): void;
     protected updateClass(): void;

package/vscode/src/vs/base/browser/ui/actionbar/actionViewItems.js

@@ -148,23 +148,21 @@ class BaseActionViewItem extends Disposable {
     getTooltip() {
         return this.action.tooltip;
     }
+    getHoverContents() {
+        return this.getTooltip();
+    }
     updateTooltip() {
         if (!this.element) {
             return;
         }
-        const title = this.getTooltip() ?? '';
+        const title = this.getHoverContents() ?? '';
         this.updateAriaLabel();
-        if (this.options.hoverDelegate?.showNativeHover) {
-            this.element.title = title;
+        if (!this.customHover && title !== '') {
+            const hoverDelegate = this.options.hoverDelegate ?? getDefaultHoverDelegate('element');
+            this.customHover = this._store.add(getBaseLayerHoverDelegate().setupManagedHover(hoverDelegate, this.element, title));
         }
-        else {
-            if (!this.customHover && title !== '') {
-                const hoverDelegate = this.options.hoverDelegate ?? getDefaultHoverDelegate('element');
-                this.customHover = this._store.add(getBaseLayerHoverDelegate().setupManagedHover(hoverDelegate, this.element, title));
-            }
-            else if (this.customHover) {
-                this.customHover.update(title);
-            }
+        else if (this.customHover) {
+            this.customHover.update(title);
         }
     }
     updateAriaLabel() {

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

@@ -140,6 +140,8 @@ export declare class ButtonWithIcon extends Button {
     private _mdlabelElement;
     get labelElement(): HTMLElement;
     constructor(container: HTMLElement, options: IButtonOptions);
+    get label(): IMarkdownString | string;
     set label(value: IMarkdownString | string);
+    get icon(): ThemeIcon;
     set icon(icon: ThemeIcon);
 }

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

@@ -1,9 +1,8 @@
 
 import { registerCss } from '@codingame/monaco-vscode-api/css';
 import { createElement, EventType, addDisposableListener, EventHelper, trackFocus, reset, isActiveElement, $ } from '../../dom.js';
-import dompurify from 'dompurify';
 import { StandardKeyboardEvent } from '../../keyboardEvent.js';
-import { renderMarkdown, renderStringAsPlaintext } from '../../markdownRenderer.js';
+import { renderMarkdown, renderAsPlaintext } from '../../markdownRenderer.js';
 import { Gesture, EventType as EventType$1 } from '../../touch.js';
 import { getDefaultHoverDelegate, createInstantHoverDelegate } from '../hover/hoverDelegateFactory.js';
 import { renderLabelWithIcons } from '../iconLabel/iconLabels.js';
@@ -18,6 +17,7 @@ import { ThemeIcon } from '../../../common/themables.js';
 import * as button from './button.css';
 import { localize } from '../../../../nls.js';
 import { getBaseLayerHoverDelegate } from '../hover/hoverDelegate2.js';
+import { safeSetInnerHtml } from '../../domSanitize.js';
 
 registerCss(button);
 const unthemedButtonStyles = {
@@ -30,6 +30,14 @@ const unthemedButtonStyles = {
     buttonSecondaryForeground: undefined,
     buttonSecondaryHoverBackground: undefined
 };
+const buttonSanitizerConfig = ( Object.freeze({
+    allowedTags: {
+        override: ['b', 'i', 'u', 'code', 'span'],
+    },
+    allowedAttributes: {
+        override: ['class'],
+    },
+}));
 class Button extends Disposable {
     get onDidClick() { return this._onDidClick.event; }
     get onDidEscape() { return this._onDidEscape.event; }
@@ -154,12 +162,11 @@ class Button extends Disposable {
         this._element.classList.add('monaco-text-button');
         const labelElement = this.options.supportShortLabel ? this._labelElement : this._element;
         if (isMarkdownString(value)) {
-            const rendered = renderMarkdown(value, { inline: true });
+            const rendered = renderMarkdown(value, undefined, createElement('span'));
             rendered.dispose();
             const root = rendered.element.querySelector('p')?.innerHTML;
             if (root) {
-                const sanitized = dompurify.sanitize(root, { ADD_TAGS: ['b', 'i', 'u', 'code', 'span'], ALLOWED_ATTR: ['class'], RETURN_TRUSTED_TYPE: true });
-                labelElement.innerHTML = sanitized;
+                safeSetInnerHtml(labelElement, root, buttonSanitizerConfig);
             }
             else {
                 reset(labelElement);
@@ -178,7 +185,7 @@ class Button extends Disposable {
             title = this.options.title;
         }
         else if (this.options.title) {
-            title = renderStringAsPlaintext(value);
+            title = renderAsPlaintext(value);
         }
         this.setTitle(title);
         this._setAriaLabel();
@@ -240,10 +247,7 @@ class Button extends Disposable {
         return this._element.classList.contains('checked');
     }
     setTitle(title) {
-        if (this.options.hoverDelegate?.showNativeHover) {
-            this._element.title = title;
-        }
-        else if (!this._hover && title !== '') {
+        if (!this._hover && title !== '') {
             this._hover = this._register(getBaseLayerHoverDelegate().setupManagedHover(this.options.hoverDelegate ?? getDefaultHoverDelegate('element'), this._element, title));
         }
         else if (this._hover) {
@@ -272,7 +276,7 @@ class ButtonWithDropdown extends Disposable {
         this._register(this.primaryButton.onDidClick(e => this._onDidClick.fire(e)));
         this.action = this._register(( new Action(
             'primaryAction',
-            renderStringAsPlaintext(this.primaryButton.label),
+            renderAsPlaintext(this.primaryButton.label),
             undefined,
             true,
             async () => this._onDidClick.fire(undefined)
@@ -464,6 +468,9 @@ class ButtonWithIcon extends Button {
         this._mdlabelElement = $('.monaco-button-mdlabel');
         this._element.append(this._iconElement, this._mdlabelElement);
     }
+    get label() {
+        return super.label;
+    }
     set label(value) {
         if (this._label === value) {
             return;
@@ -473,12 +480,11 @@ class ButtonWithIcon extends Button {
         }
         this._element.classList.add('monaco-text-button');
         if (isMarkdownString(value)) {
-            const rendered = renderMarkdown(value, { inline: true });
+            const rendered = renderMarkdown(value, undefined, createElement('span'));
             rendered.dispose();
             const root = rendered.element.querySelector('p')?.innerHTML;
             if (root) {
-                const sanitized = dompurify.sanitize(root, { ADD_TAGS: ['b', 'i', 'u', 'code', 'span'], ALLOWED_ATTR: ['class'], RETURN_TRUSTED_TYPE: true });
-                this._mdlabelElement.innerHTML = sanitized;
+                safeSetInnerHtml(this._mdlabelElement, root, buttonSanitizerConfig);
             }
             else {
                 reset(this._mdlabelElement);
@@ -497,12 +503,15 @@ class ButtonWithIcon extends Button {
             title = this.options.title;
         }
         else if (this.options.title) {
-            title = renderStringAsPlaintext(value);
+            title = renderAsPlaintext(value);
         }
         this.setTitle(title);
         this._setAriaLabel();
         this._label = value;
     }
+    get icon() {
+        return super.icon;
+    }
     set icon(icon) {
         this._iconElement.classList.value = '';
         this._iconElement.classList.add(...ThemeIcon.asClassNameArray(icon));

package/vscode/src/vs/base/browser/ui/highlightedlabel/highlightedLabel.js

@@ -70,17 +70,12 @@ class HighlightedLabel extends Disposable {
             }
         }
         reset(this.domNode, ...children);
-        if (this.options?.hoverDelegate?.showNativeHover) {
-            this.domNode.title = this.title;
+        if (!this.customHover && this.title !== '') {
+            const hoverDelegate = this.options?.hoverDelegate ?? getDefaultHoverDelegate('mouse');
+            this.customHover = this._register(getBaseLayerHoverDelegate().setupManagedHover(hoverDelegate, this.domNode, this.title));
         }
-        else {
-            if (!this.customHover && this.title !== '') {
-                const hoverDelegate = this.options?.hoverDelegate ?? getDefaultHoverDelegate('mouse');
-                this.customHover = this._register(getBaseLayerHoverDelegate().setupManagedHover(hoverDelegate, this.domNode, this.title));
-            }
-            else if (this.customHover) {
-                this.customHover.update(this.title);
-            }
+        else if (this.customHover) {
+            this.customHover.update(this.title);
         }
         this.didEverRender = true;
     }

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

@@ -155,3 +155,12 @@
 	opacity: 0.4;
 	cursor: default;
 }
+.monaco-hover .action-container,
+.monaco-hover .action,
+.monaco-hover button,
+.monaco-hover .monaco-button,
+.monaco-hover .monaco-text-button,
+.monaco-hover [role="button"] {
+	-webkit-user-select: none;
+	user-select: none;
+}

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

@@ -9,8 +9,6 @@ import { equals } from '../../../common/objects.js';
 import { Range } from '../../../common/range.js';
 import { getDefaultHoverDelegate } from '../hover/hoverDelegateFactory.js';
 import { getBaseLayerHoverDelegate } from '../hover/hoverDelegate2.js';
-import { isString } from '../../../common/types.js';
-import { stripIcons } from '../../../common/iconLabels.js';
 
 registerCss(iconlabel);
 class FastLabelNode {
@@ -149,25 +147,9 @@ class IconLabel extends Disposable {
             }
             hoverTarget = this.creationOptions.hoverTargetOverride;
         }
-        if (this.hoverDelegate.showNativeHover) {
-            function setupNativeHover(htmlElement, tooltip) {
-                if (isString(tooltip)) {
-                    htmlElement.title = stripIcons(tooltip);
-                }
-                else if (tooltip?.markdownNotSupportedFallback) {
-                    htmlElement.title = tooltip.markdownNotSupportedFallback;
-                }
-                else {
-                    htmlElement.removeAttribute('title');
-                }
-            }
-            setupNativeHover(hoverTarget, tooltip);
-        }
-        else {
-            const hoverDisposable = getBaseLayerHoverDelegate().setupManagedHover(this.hoverDelegate, hoverTarget, tooltip);
-            if (hoverDisposable) {
-                this.customHovers.set(htmlElement, hoverDisposable);
-            }
+        const hoverDisposable = getBaseLayerHoverDelegate().setupManagedHover(this.hoverDelegate, hoverTarget, tooltip);
+        if (hoverDisposable) {
+            this.customHovers.set(htmlElement, hoverDisposable);
         }
     }
     dispose() {