@codingame/monaco-vscode-api 15.0.3 → 16.0.1

package/vscode/src/vs/amdX.js

@@ -0,0 +1,188 @@
+
+import { Schemas, VSCODE_AUTHORITY, nodeModulesPath, FileAccess } from './base/common/network.js';
+import './base/common/platform.js';
+import { URI } from './base/common/uri.js';
+import { generateUuid } from './base/common/uuid.js';
+
+class DefineCall {
+    constructor(id, dependencies, callback) {
+        this.id = id;
+        this.dependencies = dependencies;
+        this.callback = callback;
+    }
+}
+var AMDModuleImporterState;
+(function (AMDModuleImporterState) {
+    AMDModuleImporterState[AMDModuleImporterState["Uninitialized"] = 1] = "Uninitialized";
+    AMDModuleImporterState[AMDModuleImporterState["InitializedInternal"] = 2] = "InitializedInternal";
+    AMDModuleImporterState[AMDModuleImporterState["InitializedExternal"] = 3] = "InitializedExternal";
+})(AMDModuleImporterState || (AMDModuleImporterState = {}));
+class AMDModuleImporter {
+    static { this.INSTANCE = ( new AMDModuleImporter()); }
+    constructor() {
+        this._isWebWorker = (typeof self === 'object' && self.constructor && self.constructor.name === 'DedicatedWorkerGlobalScope');
+        this._isRenderer = typeof document === 'object';
+        this._defineCalls = [];
+        this._state = AMDModuleImporterState.Uninitialized;
+    }
+    _initialize() {
+        if (this._state === AMDModuleImporterState.Uninitialized) {
+            if (globalThis.define) {
+                this._state = AMDModuleImporterState.InitializedExternal;
+                return;
+            }
+        }
+        else {
+            return;
+        }
+        this._state = AMDModuleImporterState.InitializedInternal;
+        globalThis.define = (id, dependencies, callback) => {
+            if (typeof id !== 'string') {
+                callback = dependencies;
+                dependencies = id;
+                id = null;
+            }
+            if (typeof dependencies !== 'object' || !Array.isArray(dependencies)) {
+                callback = dependencies;
+                dependencies = null;
+            }
+            this._defineCalls.push(( new DefineCall(id, dependencies, callback)));
+        };
+        globalThis.define.amd = true;
+        if (this._isRenderer) {
+            this._amdPolicy = globalThis._VSCODE_WEB_PACKAGE_TTP ?? window.trustedTypes?.createPolicy('amdLoader', {
+                createScriptURL(value) {
+                    if (value.startsWith(window.location.origin)) {
+                        return value;
+                    }
+                    if (value.startsWith(`${Schemas.vscodeFileResource}://${VSCODE_AUTHORITY}`)) {
+                        return value;
+                    }
+                    throw ( new Error(`[trusted_script_src] Invalid script url: ${value}`));
+                }
+            });
+        }
+        else if (this._isWebWorker) {
+            this._amdPolicy = globalThis._VSCODE_WEB_PACKAGE_TTP ?? globalThis.trustedTypes?.createPolicy('amdLoader', {
+                createScriptURL(value) {
+                    return value;
+                }
+            });
+        }
+    }
+    async load(scriptSrc) {
+        this._initialize();
+        if (this._state === AMDModuleImporterState.InitializedExternal) {
+            return ( new Promise(resolve => {
+                const tmpModuleId = generateUuid();
+                globalThis.define(tmpModuleId, [scriptSrc], function (moduleResult) {
+                    resolve(moduleResult);
+                });
+            }));
+        }
+        const defineCall = await (this._isWebWorker ? this._workerLoadScript(scriptSrc) : this._isRenderer ? this._rendererLoadScript(scriptSrc) : this._nodeJSLoadScript(scriptSrc));
+        if (!defineCall) {
+            console.warn(`Did not receive a define call from script ${scriptSrc}`);
+            return undefined;
+        }
+        const exports = {};
+        const dependencyObjs = [];
+        const dependencyModules = [];
+        if (Array.isArray(defineCall.dependencies)) {
+            for (const mod of defineCall.dependencies) {
+                if (mod === 'exports') {
+                    dependencyObjs.push(exports);
+                }
+                else {
+                    dependencyModules.push(mod);
+                }
+            }
+        }
+        if (dependencyModules.length > 0) {
+            throw ( new Error(
+                `Cannot resolve dependencies for script ${scriptSrc}. The dependencies are: ${dependencyModules.join(', ')}`
+            ));
+        }
+        if (typeof defineCall.callback === 'function') {
+            return defineCall.callback(...dependencyObjs) ?? exports;
+        }
+        else {
+            return defineCall.callback;
+        }
+    }
+    _rendererLoadScript(scriptSrc) {
+        return ( new Promise((resolve, reject) => {
+            const scriptElement = document.createElement('script');
+            scriptElement.setAttribute('async', 'async');
+            scriptElement.setAttribute('type', 'text/javascript');
+            const unbind = () => {
+                scriptElement.removeEventListener('load', loadEventListener);
+                scriptElement.removeEventListener('error', errorEventListener);
+            };
+            const loadEventListener = (e) => {
+                unbind();
+                resolve(this._defineCalls.pop());
+            };
+            const errorEventListener = (e) => {
+                unbind();
+                reject(e);
+            };
+            scriptElement.addEventListener('load', loadEventListener);
+            scriptElement.addEventListener('error', errorEventListener);
+            if (this._amdPolicy) {
+                scriptSrc = this._amdPolicy.createScriptURL(scriptSrc);
+            }
+            scriptElement.setAttribute('src', scriptSrc);
+            window.document.getElementsByTagName('head')[0].appendChild(scriptElement);
+        }));
+    }
+    async _workerLoadScript(scriptSrc) {
+        if (this._amdPolicy) {
+            scriptSrc = this._amdPolicy.createScriptURL(scriptSrc);
+        }
+        await import(scriptSrc).then(module => module.default ?? module);
+        return this._defineCalls.pop();
+    }
+    async _nodeJSLoadScript(scriptSrc) {
+        try {
+            const fs = (await import(`${'fs'}`).then(module => module.default ?? module)).default;
+            const vm = (await import(`${'vm'}`).then(module => module.default ?? module)).default;
+            const module = (await import(`${'module'}`).then(module => module.default ?? module)).default;
+            const filePath = ( URI.parse(scriptSrc)).fsPath;
+            const content = ( fs.readFileSync(filePath).toString());
+            const scriptSource = module.wrap(content.replace(/^#!.*/, ''));
+            const script = new vm.Script(scriptSource);
+            const compileWrapper = script.runInThisContext();
+            compileWrapper.apply();
+            return this._defineCalls.pop();
+        }
+        catch (error) {
+            throw error;
+        }
+    }
+}
+const cache = ( new Map());
+async function importAMDNodeModule(nodeModuleName, pathInsideNodeModule, isBuilt) {
+    if (isBuilt === undefined) {
+        const product = globalThis._VSCODE_PRODUCT_JSON;
+        isBuilt = Boolean((product ?? globalThis.vscode?.context?.configuration()?.product)?.commit);
+    }
+    const nodeModulePath = `${nodeModuleName}/${pathInsideNodeModule}` ;
+    if (( cache.has(nodeModulePath))) {
+        return cache.get(nodeModulePath);
+    }
+    let scriptSrc;
+    if (/^\w[\w\d+.-]*:\/\//.test(nodeModulePath)) {
+        scriptSrc = nodeModulePath;
+    }
+    else {
+        const actualNodeModulesPath = (nodeModulesPath);
+        const resourcePath = `${actualNodeModulesPath}/${nodeModulePath}`;
+        scriptSrc = ( ( FileAccess.asBrowserUri(resourcePath)).toString(true));
+    }
+    const result = AMDModuleImporter.INSTANCE.load(scriptSrc);
+    cache.set(nodeModulePath, result);
+    return result;
+}
+
+export { importAMDNodeModule };

package/vscode/src/vs/base/browser/contextmenu.d.ts

@@ -29,6 +29,7 @@ export interface IContextMenuDelegate {
     anchorAlignment?: AnchorAlignment;
     anchorAxisAlignment?: AnchorAxisAlignment;
     domForShadowRoot?: HTMLElement;
+    layer?: number;
 }
 export interface IContextMenuProvider {
     showContextMenu(delegate: IContextMenuDelegate): void;

package/vscode/src/vs/base/browser/dnd.d.ts

@@ -12,7 +12,6 @@ export declare const DataTransfers: {
     TEXT: "text/plain";
     INTERNAL_URI_LIST: string;
 };
-export declare function applyDragImage(event: DragEvent, label: string | null, clazz: string, backgroundColor?: string | null, foregroundColor?: string | null): void;
 export interface IDragAndDropData {
     update(dataTransfer: DataTransfer): void;
     getData(): unknown;

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

@@ -1,5 +1,5 @@
 
-import { addDisposableListener, getWindow } from './dom.js';
+import { addDisposableListener } from './dom.js';
 import { Disposable } from '../common/lifecycle.js';
 import { Mimes } from '../common/mime.js';
 
@@ -39,22 +39,5 @@ const DataTransfers = {
     TEXT: Mimes.text,
     INTERNAL_URI_LIST: 'application/vnd.code.uri-list',
 };
-function applyDragImage(event, label, clazz, backgroundColor, foregroundColor) {
-    const dragImage = document.createElement('div');
-    dragImage.className = clazz;
-    dragImage.textContent = label;
-    if (foregroundColor) {
-        dragImage.style.color = foregroundColor;
-    }
-    if (backgroundColor) {
-        dragImage.style.background = backgroundColor;
-    }
-    if (event.dataTransfer) {
-        const ownerDocument = getWindow(event).document;
-        ownerDocument.body.appendChild(dragImage);
-        event.dataTransfer.setDragImage(dragImage, -10, -10);
-        setTimeout(() => dragImage.remove(), 0);
-    }
-}
 
-export { DataTransfers, DelayedDragHandler, applyDragImage };
+export { DataTransfers, DelayedDragHandler };

package/vscode/src/vs/base/browser/fonts.d.ts

@@ -1 +1,4 @@
+import type { IJSONSchemaSnippet } from "../common/jsonSchema.js";
 export declare const DEFAULT_FONT_FAMILY: string;
+export declare const getFonts: () => Promise<string[]>;
+export declare const getFontSnippets: () => Promise<IJSONSchemaSnippet[]>;

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

@@ -1,6 +1,31 @@
 
-import { isWindows, isMacintosh } from '../common/platform.js';
+import { mainWindow } from './window.js';
+import { isWindows, isMacintosh, isElectron } from '../common/platform.js';
 
 const DEFAULT_FONT_FAMILY = isWindows ? '"Segoe WPC", "Segoe UI", sans-serif' : isMacintosh ? '-apple-system, BlinkMacSystemFont, sans-serif' : 'system-ui, "Ubuntu", "Droid Sans", sans-serif';
+const getFonts = async () => {
+    try {
+        const fonts = await mainWindow.queryLocalFonts();
+        const fontsArray = [...fonts];
+        const families = ( fontsArray.map(font => font.family));
+        return families;
+    }
+    catch (error) {
+        console.error(`Failed to query fonts: ${error}`);
+        return [];
+    }
+};
+const getFontSnippets = async () => {
+    if (!isElectron) {
+        return [];
+    }
+    const fonts = await getFonts();
+    const snippets = ( fonts.map(font => {
+        return {
+            body: `${font}`
+        };
+    }));
+    return snippets;
+};
 
-export { DEFAULT_FONT_FAMILY };
+export { DEFAULT_FONT_FAMILY, getFontSnippets, getFonts };

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

@@ -1,7 +1,7 @@
 
 import { onUnexpectedError } from '../common/errors.js';
 import { Event } from '../common/event.js';
-import { removeMarkdownEscapes, escapeDoubleQuotes, parseHrefAndDimensions } from '../common/htmlContent.js';
+import { removeMarkdownEscapes, escapeDoubleQuotes, parseHrefAndDimensions, isMarkdownString } from '../common/htmlContent.js';
 import { markdownEscapeEscapedIcons } from '../common/iconLabels.js';
 import { defaultGenerator } from '../common/idGenerator.js';
 import { KeyCode } from '../common/keyCodes.js';
@@ -451,7 +451,7 @@ function getSanitizerOptions(options) {
     };
 }
 function renderStringAsPlaintext(string) {
-    return typeof string === 'string' ? string : renderMarkdownAsPlaintext(string);
+    return isMarkdownString(string) ? renderMarkdownAsPlaintext(string) : string;
 }
 function renderMarkdownAsPlaintext(markdown, withCodeBlocks) {
     let value = markdown.value ?? '';

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

@@ -9,7 +9,7 @@ import { Action, ActionRunner, Separator } from '../../../common/actions.js';
 import { Disposable } from '../../../common/lifecycle.js';
 import { isMacintosh } from '../../../common/platform.js';
 import { isUndefinedOrNull, assertType } from '../../../common/types.js';
-import './actionbar.css.js';
+import './actionbar.css';
 import { localize } from '../../../../nls.js';
 import { getBaseLayerHoverDelegate } from '../hover/hoverDelegate2.js';
 

package/vscode/src/vs/base/browser/ui/actionbar/actionbar.css

@@ -0,0 +1,97 @@
+.monaco-action-bar {
+	white-space: nowrap;
+	height: 100%;
+}
+.monaco-action-bar .actions-container {
+	display: flex;
+	margin: 0 auto;
+	padding: 0;
+	height: 100%;
+	width: 100%;
+	align-items: center;
+}
+.monaco-action-bar.vertical .actions-container {
+	display: inline-block;
+}
+.monaco-action-bar .action-item {
+	display: block;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	position: relative;
+}
+.monaco-action-bar .action-item.disabled {
+	cursor: default;
+}
+.monaco-action-bar .action-item .icon,
+.monaco-action-bar .action-item .codicon {
+	display: block;
+}
+.monaco-action-bar .action-item .codicon {
+	display: flex;
+	align-items: center;
+	width: 16px;
+	height: 16px;
+}
+.monaco-action-bar .action-label {
+	display: flex;
+	font-size: 11px;
+	padding: 3px;
+	border-radius: 5px;
+}
+.monaco-action-bar .action-item.disabled .action-label:not(.icon) ,
+.monaco-action-bar .action-item.disabled .action-label:not(.icon)::before,
+.monaco-action-bar .action-item.disabled .action-label:not(.icon):hover {
+	color: var(--vscode-disabledForeground);
+}
+.monaco-action-bar .action-item.disabled .action-label.icon ,
+.monaco-action-bar .action-item.disabled .action-label.icon::before,
+.monaco-action-bar .action-item.disabled .action-label.icon:hover {
+	opacity: 0.6;
+}
+.monaco-action-bar.vertical {
+	text-align: left;
+}
+.monaco-action-bar.vertical .action-item {
+	display: block;
+}
+.monaco-action-bar.vertical .action-label.separator {
+	display: block;
+	border-bottom: 1px solid #bbb;
+	padding-top: 1px;
+	margin-left: .8em;
+	margin-right: .8em;
+}
+.monaco-action-bar .action-item .action-label.separator {
+	width: 1px;
+	height: 16px;
+	margin: 5px 4px !important;
+	cursor: default;
+	min-width: 1px;
+	padding: 0;
+	background-color: #bbb;
+}
+.secondary-actions .monaco-action-bar .action-label {
+	margin-left: 6px;
+}
+.monaco-action-bar .action-item.select-container {
+	overflow: hidden;
+	flex: 1;
+	max-width: 170px;
+	min-width: 60px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	margin-right: 10px;
+}
+.monaco-action-bar .action-item.action-dropdown-item {
+	display: flex;
+}
+.monaco-action-bar .action-item.action-dropdown-item > .action-dropdown-item-separator {
+	display: flex;
+	align-items: center;
+	cursor: default;
+}
+.monaco-action-bar .action-item.action-dropdown-item > .action-dropdown-item-separator > div {
+	width: 1px;
+}

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

@@ -8,7 +8,7 @@ import { Emitter } from '../../../common/event.js';
 import { KeyCode, KeyMod as KeyMod$1 } from '../../../common/keyCodes.js';
 import { Disposable, DisposableStore, DisposableMap, dispose } from '../../../common/lifecycle.js';
 import { isNumber, isFunction } from '../../../common/types.js';
-import './actionbar.css.js';
+import './actionbar.css';
 
 var ActionsOrientation;
 (function (ActionsOrientation) {

package/vscode/src/vs/base/browser/ui/aria/aria.css

@@ -0,0 +1,4 @@
+.monaco-aria-container {
+	position: absolute;
+	left:-999em;
+}

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

@@ -1,6 +1,6 @@
 
 import { clearNode } from '../../dom.js';
-import './aria.css.js';
+import './aria.css';
 
 const MAX_MESSAGE_LENGTH = 20000;
 let ariaContainer;

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

@@ -0,0 +1,139 @@
+.monaco-text-button {
+	box-sizing: border-box;
+	display: flex;
+	width: 100%;
+	padding: 4px;
+	border-radius: 2px;
+	text-align: center;
+	cursor: pointer;
+	justify-content: center;
+	align-items: center;
+	border: 1px solid var(--vscode-button-border, transparent);
+	line-height: 18px;
+}
+.monaco-text-button:focus {
+	outline-offset: 2px !important;
+}
+.monaco-text-button:hover {
+	text-decoration: none !important;
+}
+.monaco-button.disabled:focus,
+.monaco-button.disabled {
+	opacity: 0.4 !important;
+	cursor: default;
+}
+.monaco-text-button .codicon {
+	margin: 0 0.2em;
+	color: inherit !important;
+}
+.monaco-text-button.monaco-text-button-with-short-label {
+	flex-direction: row;
+	flex-wrap: wrap;
+	padding: 0 4px;
+	overflow: hidden;
+	height: 28px;
+}
+.monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label {
+	flex-basis: 100%;
+}
+.monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label-short {
+	flex-grow: 1;
+	width: 0;
+	overflow: hidden;
+}
+.monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label,
+.monaco-text-button.monaco-text-button-with-short-label > .monaco-button-label-short {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	font-weight: normal;
+	font-style: inherit;
+	padding: 4px 0;
+}
+.monaco-button-dropdown {
+	display: flex;
+	cursor: pointer;
+}
+.monaco-button-dropdown.disabled {
+	cursor: default;
+}
+.monaco-button-dropdown > .monaco-button:focus {
+	outline-offset: -1px !important;
+}
+.monaco-button-dropdown.disabled > .monaco-button.disabled,
+.monaco-button-dropdown.disabled > .monaco-button.disabled:focus,
+.monaco-button-dropdown.disabled > .monaco-button-dropdown-separator {
+	opacity: 0.4 !important;
+}
+.monaco-button-dropdown > .monaco-button.monaco-text-button {
+	border-right-width: 0 !important;
+}
+.monaco-button-dropdown .monaco-button-dropdown-separator {
+	padding: 4px 0;
+	cursor: default;
+}
+.monaco-button-dropdown .monaco-button-dropdown-separator > div {
+	height: 100%;
+	width: 1px;
+}
+.monaco-button-dropdown > .monaco-button.monaco-dropdown-button {
+	border: 1px solid var(--vscode-button-border, transparent);
+	border-left-width: 0 !important;
+	border-radius: 0 2px 2px 0;
+	display: flex;
+	align-items: center;
+}
+.monaco-button-dropdown > .monaco-button.monaco-text-button {
+	border-radius: 2px 0 0 2px;
+}
+.monaco-description-button {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+	margin: 4px 5px;
+}
+.monaco-description-button .monaco-button-description {
+	font-style: italic;
+	font-size: 11px;
+	padding: 4px 20px;
+}
+.monaco-description-button .monaco-button-label,
+.monaco-description-button .monaco-button-description {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+}
+.monaco-description-button .monaco-button-label > .codicon,
+.monaco-description-button .monaco-button-description > .codicon {
+	margin: 0 0.2em;
+	color: inherit !important;
+}
+.monaco-button.default-colors,
+.monaco-button-dropdown.default-colors > .monaco-button{
+	color: var(--vscode-button-foreground);
+	background-color: var(--vscode-button-background);
+}
+.monaco-button.default-colors:hover,
+.monaco-button-dropdown.default-colors > .monaco-button:hover {
+	background-color: var(--vscode-button-hoverBackground);
+}
+.monaco-button.default-colors.secondary,
+.monaco-button-dropdown.default-colors > .monaco-button.secondary {
+	color: var(--vscode-button-secondaryForeground);
+	background-color: var(--vscode-button-secondaryBackground);
+}
+.monaco-button.default-colors.secondary:hover,
+.monaco-button-dropdown.default-colors > .monaco-button.secondary:hover {
+	background-color: var(--vscode-button-secondaryHoverBackground);
+}
+.monaco-button-dropdown.default-colors .monaco-button-dropdown-separator {
+	background-color: var(--vscode-button-background);
+	border-top: 1px solid var(--vscode-button-border);
+	border-bottom: 1px solid var(--vscode-button-border);
+}
+.monaco-button-dropdown.default-colors .monaco-button.secondary + .monaco-button-dropdown-separator {
+	background-color: var(--vscode-button-secondaryBackground);
+}
+.monaco-button-dropdown.default-colors .monaco-button-dropdown-separator > div {
+	background-color: var(--vscode-button-separator);
+}

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

@@ -73,11 +73,12 @@ export interface IButtonWithDropdownOptions extends IButtonOptions {
     readonly actions: readonly IAction[] | IActionProvider;
     readonly actionRunner?: IActionRunner;
     readonly addPrimaryActionToDropdown?: boolean;
+    readonly dropdownLayer?: number;
 }
 export declare class ButtonWithDropdown extends Disposable implements IButton {
-    private readonly button;
+    readonly primaryButton: Button;
     private readonly action;
-    private readonly dropdownButton;
+    readonly dropdownButton: Button;
     private readonly separatorContainer;
     private readonly separator;
     readonly element: HTMLElement;

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

@@ -14,7 +14,7 @@ import { isMarkdownString, markdownStringEqual } from '../../../common/htmlConte
 import { KeyCode } from '../../../common/keyCodes.js';
 import { Disposable, DisposableStore } from '../../../common/lifecycle.js';
 import { ThemeIcon } from '../../../common/themables.js';
-import './button.css.js';
+import './button.css';
 import { localize } from '../../../../nls.js';
 import { getBaseLayerHoverDelegate } from '../hover/hoverDelegate2.js';
 
@@ -205,6 +205,8 @@ class Button extends Disposable {
     }
     set icon(icon) {
         this._setAriaLabel();
+        const oldIcons = Array.from(this._element.classList).filter(item => item.startsWith('codicon-'));
+        this._element.classList.remove(...oldIcons);
         this._element.classList.add(...ThemeIcon.asClassNameArray(icon));
     }
     set enabled(value) {
@@ -260,11 +262,11 @@ class ButtonWithDropdown extends Disposable {
         if (!options.hoverDelegate) {
             options = { ...options, hoverDelegate: this._register(createInstantHoverDelegate()) };
         }
-        this.button = this._register(( new Button(this.element, options)));
-        this._register(this.button.onDidClick(e => this._onDidClick.fire(e)));
+        this.primaryButton = this._register(( new Button(this.element, options)));
+        this._register(this.primaryButton.onDidClick(e => this._onDidClick.fire(e)));
         this.action = this._register(( new Action(
             'primaryAction',
-            renderStringAsPlaintext(this.button.label),
+            renderStringAsPlaintext(this.primaryButton.label),
             undefined,
             true,
             async () => this._onDidClick.fire(undefined)
@@ -293,7 +295,8 @@ class ButtonWithDropdown extends Disposable {
                 getAnchor: () => this.dropdownButton.element,
                 getActions: () => options.addPrimaryActionToDropdown === false ? [...actions] : [this.action, ...actions],
                 actionRunner: options.actionRunner,
-                onHide: () => this.dropdownButton.element.setAttribute('aria-expanded', 'false')
+                onHide: () => this.dropdownButton.element.setAttribute('aria-expanded', 'false'),
+                layer: options.dropdownLayer
             });
             this.dropdownButton.element.setAttribute('aria-expanded', 'true');
         }));
@@ -303,31 +306,31 @@ class ButtonWithDropdown extends Disposable {
         this.element.remove();
     }
     set label(value) {
-        this.button.label = value;
+        this.primaryButton.label = value;
         this.action.label = value;
     }
     set icon(icon) {
-        this.button.icon = icon;
+        this.primaryButton.icon = icon;
     }
     set enabled(enabled) {
-        this.button.enabled = enabled;
+        this.primaryButton.enabled = enabled;
         this.dropdownButton.enabled = enabled;
         this.element.classList.toggle('disabled', !enabled);
     }
     get enabled() {
-        return this.button.enabled;
+        return this.primaryButton.enabled;
     }
     set checked(value) {
-        this.button.checked = value;
+        this.primaryButton.checked = value;
     }
     get checked() {
-        return this.button.checked;
+        return this.primaryButton.checked;
     }
     focus() {
-        this.button.focus();
+        this.primaryButton.focus();
     }
     hasFocus() {
-        return this.button.hasFocus() || this.dropdownButton.hasFocus();
+        return this.primaryButton.hasFocus() || this.dropdownButton.hasFocus();
     }
 }
 class ButtonWithDescription {