@codingame/monaco-vscode-api 1.85.6 → 2.0.0-v2.1

package/vscode/src/vs/base/browser/ui/table/table.css.js

@@ -0,0 +1,4 @@
+import n from '../../../../../../../external/rollup-plugin-styles/dist/runtime/inject-css.js';
+var css = ".monaco-table{display:flex;flex-direction:column;height:100%;overflow:hidden;position:relative;white-space:nowrap;width:100%}.monaco-table>.monaco-split-view2{border-bottom:1px solid transparent}.monaco-table>.monaco-list{flex:1}.monaco-table-tr{display:flex;height:100%}.monaco-table-th{font-weight:700;height:100%;overflow:hidden;text-overflow:ellipsis;width:100%}.monaco-table-td,.monaco-table-th{box-sizing:border-box;flex-shrink:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.monaco-table>.monaco-split-view2 .monaco-sash.vertical:before{border-left:1px solid transparent;content:\"\";left:calc(var(--vscode-sash-size)/2);position:absolute;width:0}.monaco-workbench:not(.reduce-motion) .monaco-table>.monaco-split-view2,.monaco-workbench:not(.reduce-motion) .monaco-table>.monaco-split-view2 .monaco-sash.vertical:before{transition:border-color .2s ease-out}";
+n(css,{});
+export { css, css as default };

package/vscode/src/vs/base/browser/ui/table/tableWidget.js

@@ -0,0 +1,253 @@
+import { append, $, clearNode, createStyleSheet, getContentHeight, getContentWidth } from '../../dom.js';
+import { List, unthemedListStyles } from '../list/listWidget.js';
+import { SplitView } from '../splitview/splitview.js';
+import { Event, Emitter } from '../../../common/event.js';
+import { DisposableStore } from '../../../common/lifecycle.js';
+import './table.css.js';
+class TableListRenderer {
+    static { this.TemplateId = 'row'; }
+    constructor(columns, renderers, getColumnSize) {
+        this.columns = columns;
+        this.getColumnSize = getColumnSize;
+        this.templateId = TableListRenderer.TemplateId;
+        this.renderedTemplates = ( new Set());
+        const rendererMap = ( new Map(( renderers.map(r => [r.templateId, r]))));
+        this.renderers = [];
+        for (const column of columns) {
+            const renderer = rendererMap.get(column.templateId);
+            if (!renderer) {
+                throw new Error(`Table cell renderer for template id ${column.templateId} not found.`);
+            }
+            this.renderers.push(renderer);
+        }
+    }
+    renderTemplate(container) {
+        const rowContainer = append(container, $('.monaco-table-tr'));
+        const cellContainers = [];
+        const cellTemplateData = [];
+        for (let i = 0; i < this.columns.length; i++) {
+            const renderer = this.renderers[i];
+            const cellContainer = append(rowContainer, $('.monaco-table-td', { 'data-col-index': i }));
+            cellContainer.style.width = `${this.getColumnSize(i)}px`;
+            cellContainers.push(cellContainer);
+            cellTemplateData.push(renderer.renderTemplate(cellContainer));
+        }
+        const result = { container, cellContainers, cellTemplateData };
+        this.renderedTemplates.add(result);
+        return result;
+    }
+    renderElement(element, index, templateData, height) {
+        for (let i = 0; i < this.columns.length; i++) {
+            const column = this.columns[i];
+            const cell = column.project(element);
+            const renderer = this.renderers[i];
+            renderer.renderElement(cell, index, templateData.cellTemplateData[i], height);
+        }
+    }
+    disposeElement(element, index, templateData, height) {
+        for (let i = 0; i < this.columns.length; i++) {
+            const renderer = this.renderers[i];
+            if (renderer.disposeElement) {
+                const column = this.columns[i];
+                const cell = column.project(element);
+                renderer.disposeElement(cell, index, templateData.cellTemplateData[i], height);
+            }
+        }
+    }
+    disposeTemplate(templateData) {
+        for (let i = 0; i < this.columns.length; i++) {
+            const renderer = this.renderers[i];
+            renderer.disposeTemplate(templateData.cellTemplateData[i]);
+        }
+        clearNode(templateData.container);
+        this.renderedTemplates.delete(templateData);
+    }
+    layoutColumn(index, size) {
+        for (const { cellContainers } of this.renderedTemplates) {
+            cellContainers[index].style.width = `${size}px`;
+        }
+    }
+}
+function asListVirtualDelegate(delegate) {
+    return {
+        getHeight(row) { return delegate.getHeight(row); },
+        getTemplateId() { return TableListRenderer.TemplateId; },
+    };
+}
+class ColumnHeader {
+    get minimumSize() { return this.column.minimumWidth ?? 120; }
+    get maximumSize() { return this.column.maximumWidth ?? Number.POSITIVE_INFINITY; }
+    get onDidChange() { return this.column.onDidChangeWidthConstraints ?? Event.None; }
+    constructor(column, index) {
+        this.column = column;
+        this.index = index;
+        this._onDidLayout = ( new Emitter());
+        this.onDidLayout = this._onDidLayout.event;
+        this.element = $('.monaco-table-th', { 'data-col-index': index, title: column.tooltip }, column.label);
+    }
+    layout(size) {
+        this._onDidLayout.fire([this.index, size]);
+    }
+}
+class Table {
+    static { this.InstanceCount = 0; }
+    get onDidChangeFocus() { return this.list.onDidChangeFocus; }
+    get onDidChangeSelection() { return this.list.onDidChangeSelection; }
+    get onDidScroll() { return this.list.onDidScroll; }
+    get onMouseClick() { return this.list.onMouseClick; }
+    get onMouseDblClick() { return this.list.onMouseDblClick; }
+    get onMouseMiddleClick() { return this.list.onMouseMiddleClick; }
+    get onPointer() { return this.list.onPointer; }
+    get onMouseUp() { return this.list.onMouseUp; }
+    get onMouseDown() { return this.list.onMouseDown; }
+    get onMouseOver() { return this.list.onMouseOver; }
+    get onMouseMove() { return this.list.onMouseMove; }
+    get onMouseOut() { return this.list.onMouseOut; }
+    get onTouchStart() { return this.list.onTouchStart; }
+    get onTap() { return this.list.onTap; }
+    get onContextMenu() { return this.list.onContextMenu; }
+    get onDidFocus() { return this.list.onDidFocus; }
+    get onDidBlur() { return this.list.onDidBlur; }
+    get scrollTop() { return this.list.scrollTop; }
+    set scrollTop(scrollTop) { this.list.scrollTop = scrollTop; }
+    get scrollLeft() { return this.list.scrollLeft; }
+    set scrollLeft(scrollLeft) { this.list.scrollLeft = scrollLeft; }
+    get scrollHeight() { return this.list.scrollHeight; }
+    get renderHeight() { return this.list.renderHeight; }
+    get onDidDispose() { return this.list.onDidDispose; }
+    constructor(user, container, virtualDelegate, columns, renderers, _options) {
+        this.virtualDelegate = virtualDelegate;
+        this.domId = `table_id_${++Table.InstanceCount}`;
+        this.disposables = ( new DisposableStore());
+        this.cachedWidth = 0;
+        this.cachedHeight = 0;
+        this.domNode = append(container, $(`.monaco-table.${this.domId}`));
+        const headers = ( columns.map((c, i) => ( new ColumnHeader(c, i))));
+        const descriptor = {
+            size: headers.reduce((a, b) => a + b.column.weight, 0),
+            views: ( headers.map(view => ({ size: view.column.weight, view })))
+        };
+        this.splitview = this.disposables.add(( new SplitView(this.domNode, {
+            orientation: 1 ,
+            scrollbarVisibility: 2 ,
+            getSashOrthogonalSize: () => this.cachedHeight,
+            descriptor
+        })));
+        this.splitview.el.style.height = `${virtualDelegate.headerRowHeight}px`;
+        this.splitview.el.style.lineHeight = `${virtualDelegate.headerRowHeight}px`;
+        const renderer = ( new TableListRenderer(columns, renderers, i => this.splitview.getViewSize(i)));
+        this.list = this.disposables.add(( new List(
+            user,
+            this.domNode,
+            asListVirtualDelegate(virtualDelegate),
+            [renderer],
+            _options
+        )));
+        Event.any(...( headers.map(h => h.onDidLayout)))(([index, size]) => renderer.layoutColumn(index, size), null, this.disposables);
+        this.splitview.onDidSashReset(index => {
+            const totalWeight = columns.reduce((r, c) => r + c.weight, 0);
+            const size = columns[index].weight / totalWeight * this.cachedWidth;
+            this.splitview.resizeView(index, size);
+        }, null, this.disposables);
+        this.styleElement = createStyleSheet(this.domNode);
+        this.style(unthemedListStyles);
+    }
+    updateOptions(options) {
+        this.list.updateOptions(options);
+    }
+    splice(start, deleteCount, elements = []) {
+        this.list.splice(start, deleteCount, elements);
+    }
+    rerender() {
+        this.list.rerender();
+    }
+    row(index) {
+        return this.list.element(index);
+    }
+    indexOf(element) {
+        return this.list.indexOf(element);
+    }
+    get length() {
+        return this.list.length;
+    }
+    getHTMLElement() {
+        return this.domNode;
+    }
+    layout(height, width) {
+        height = height ?? getContentHeight(this.domNode);
+        width = width ?? getContentWidth(this.domNode);
+        this.cachedWidth = width;
+        this.cachedHeight = height;
+        this.splitview.layout(width);
+        const listHeight = height - this.virtualDelegate.headerRowHeight;
+        this.list.getHTMLElement().style.height = `${listHeight}px`;
+        this.list.layout(listHeight, width);
+    }
+    triggerTypeNavigation() {
+        this.list.triggerTypeNavigation();
+    }
+    style(styles) {
+        const content = [];
+        content.push(`.monaco-table.${this.domId} > .monaco-split-view2 .monaco-sash.vertical::before {
+			top: ${this.virtualDelegate.headerRowHeight + 1}px;
+			height: calc(100% - ${this.virtualDelegate.headerRowHeight}px);
+		}`);
+        this.styleElement.textContent = content.join('\n');
+        this.list.style(styles);
+    }
+    domFocus() {
+        this.list.domFocus();
+    }
+    setAnchor(index) {
+        this.list.setAnchor(index);
+    }
+    getAnchor() {
+        return this.list.getAnchor();
+    }
+    getSelectedElements() {
+        return this.list.getSelectedElements();
+    }
+    setSelection(indexes, browserEvent) {
+        this.list.setSelection(indexes, browserEvent);
+    }
+    getSelection() {
+        return this.list.getSelection();
+    }
+    setFocus(indexes, browserEvent) {
+        this.list.setFocus(indexes, browserEvent);
+    }
+    focusNext(n = 1, loop = false, browserEvent) {
+        this.list.focusNext(n, loop, browserEvent);
+    }
+    focusPrevious(n = 1, loop = false, browserEvent) {
+        this.list.focusPrevious(n, loop, browserEvent);
+    }
+    focusNextPage(browserEvent) {
+        return this.list.focusNextPage(browserEvent);
+    }
+    focusPreviousPage(browserEvent) {
+        return this.list.focusPreviousPage(browserEvent);
+    }
+    focusFirst(browserEvent) {
+        this.list.focusFirst(browserEvent);
+    }
+    focusLast(browserEvent) {
+        this.list.focusLast(browserEvent);
+    }
+    getFocus() {
+        return this.list.getFocus();
+    }
+    getFocusedElements() {
+        return this.list.getFocusedElements();
+    }
+    getRelativeTop(index) {
+        return this.list.getRelativeTop(index);
+    }
+    reveal(index, relativeTop) {
+        this.list.reveal(index, relativeTop);
+    }
+    dispose() {
+        this.disposables.dispose();
+    }
+}
+export { Table };

package/vscode/src/vs/base/browser/ui/toggle/toggle.css.js

@@ -0,0 +1,4 @@
+import n from '../../../../../../../external/rollup-plugin-styles/dist/runtime/inject-css.js';
+var css = ".monaco-custom-toggle{border:1px solid transparent;border-radius:3px;box-sizing:border-box;cursor:pointer;float:left;height:20px;margin-left:2px;overflow:hidden;padding:1px;user-select:none;-webkit-user-select:none;width:20px}.monaco-custom-toggle:hover{background-color:var(--vscode-inputOption-hoverBackground)}.hc-black .monaco-custom-toggle:hover,.hc-light .monaco-custom-toggle:hover{border:1px dashed var(--vscode-focusBorder)}.hc-black .monaco-custom-toggle,.hc-black .monaco-custom-toggle:hover,.hc-light .monaco-custom-toggle,.hc-light .monaco-custom-toggle:hover{background:none}.monaco-custom-toggle.monaco-checkbox{background-size:16px!important;border:1px solid transparent;border-radius:3px;height:18px;margin-left:0;margin-right:9px;opacity:1;padding:0;width:18px}.monaco-action-bar .checkbox-action-item{align-items:center;display:flex}.monaco-action-bar .checkbox-action-item>.monaco-custom-toggle.monaco-checkbox{margin-right:4px}.monaco-action-bar .checkbox-action-item>.checkbox-label{font-size:12px}.monaco-custom-toggle.monaco-checkbox:not(.checked):before{visibility:hidden}";
+n(css,{});
+export { css, css as default };

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

@@ -0,0 +1,258 @@
+import { BaseActionViewItem } from '../actionbar/actionViewItems.js';
+import { Widget } from '../widget.js';
+import { Codicon } from '../../../common/codicons.js';
+import { ThemeIcon } from '../../../common/themables.js';
+import { Emitter } from '../../../common/event.js';
+import './toggle.css.js';
+import { $, addDisposableListener, EventType, isActiveElement } from '../../dom.js';
+const unthemedToggleStyles = {
+    inputActiveOptionBorder: '#007ACC00',
+    inputActiveOptionForeground: '#FFFFFF',
+    inputActiveOptionBackground: '#0E639C50'
+};
+class ToggleActionViewItem extends BaseActionViewItem {
+    constructor(context, action, options) {
+        super(context, action, options);
+        this.toggle = this._register(( new Toggle({
+            actionClassName: this._action.class,
+            isChecked: !!this._action.checked,
+            title: this.options.keybinding ? `${this._action.label} (${this.options.keybinding})` : this._action.label,
+            notFocusable: true,
+            inputActiveOptionBackground: options.toggleStyles?.inputActiveOptionBackground,
+            inputActiveOptionBorder: options.toggleStyles?.inputActiveOptionBorder,
+            inputActiveOptionForeground: options.toggleStyles?.inputActiveOptionForeground,
+        })));
+        this._register(this.toggle.onChange(() => this._action.checked = !!this.toggle && this.toggle.checked));
+    }
+    render(container) {
+        this.element = container;
+        this.element.appendChild(this.toggle.domNode);
+    }
+    updateEnabled() {
+        if (this.toggle) {
+            if (this.isEnabled()) {
+                this.toggle.enable();
+            }
+            else {
+                this.toggle.disable();
+            }
+        }
+    }
+    updateChecked() {
+        this.toggle.checked = !!this._action.checked;
+    }
+    focus() {
+        this.toggle.domNode.tabIndex = 0;
+        this.toggle.focus();
+    }
+    blur() {
+        this.toggle.domNode.tabIndex = -1;
+        this.toggle.domNode.blur();
+    }
+    setFocusable(focusable) {
+        this.toggle.domNode.tabIndex = focusable ? 0 : -1;
+    }
+}
+class Toggle extends Widget {
+    constructor(opts) {
+        super();
+        this._onChange = this._register(( new Emitter()));
+        this.onChange = this._onChange.event;
+        this._onKeyDown = this._register(( new Emitter()));
+        this.onKeyDown = this._onKeyDown.event;
+        this._opts = opts;
+        this._checked = this._opts.isChecked;
+        const classes = ['monaco-custom-toggle'];
+        if (this._opts.icon) {
+            this._icon = this._opts.icon;
+            classes.push(...ThemeIcon.asClassNameArray(this._icon));
+        }
+        if (this._opts.actionClassName) {
+            classes.push(...this._opts.actionClassName.split(' '));
+        }
+        if (this._checked) {
+            classes.push('checked');
+        }
+        this.domNode = document.createElement('div');
+        this.domNode.title = this._opts.title;
+        this.domNode.classList.add(...classes);
+        if (!this._opts.notFocusable) {
+            this.domNode.tabIndex = 0;
+        }
+        this.domNode.setAttribute('role', 'checkbox');
+        this.domNode.setAttribute('aria-checked', String(this._checked));
+        this.domNode.setAttribute('aria-label', this._opts.title);
+        this.applyStyles();
+        this.onclick(this.domNode, (ev) => {
+            if (this.enabled) {
+                this.checked = !this._checked;
+                this._onChange.fire(false);
+                ev.preventDefault();
+            }
+        });
+        this._register(this.ignoreGesture(this.domNode));
+        this.onkeydown(this.domNode, (keyboardEvent) => {
+            if (keyboardEvent.keyCode === 10  || keyboardEvent.keyCode === 3 ) {
+                this.checked = !this._checked;
+                this._onChange.fire(true);
+                keyboardEvent.preventDefault();
+                keyboardEvent.stopPropagation();
+                return;
+            }
+            this._onKeyDown.fire(keyboardEvent);
+        });
+    }
+    get enabled() {
+        return this.domNode.getAttribute('aria-disabled') !== 'true';
+    }
+    focus() {
+        this.domNode.focus();
+    }
+    get checked() {
+        return this._checked;
+    }
+    set checked(newIsChecked) {
+        this._checked = newIsChecked;
+        this.domNode.setAttribute('aria-checked', String(this._checked));
+        this.domNode.classList.toggle('checked', this._checked);
+        this.applyStyles();
+    }
+    setIcon(icon) {
+        if (this._icon) {
+            this.domNode.classList.remove(...ThemeIcon.asClassNameArray(this._icon));
+        }
+        this._icon = icon;
+        if (this._icon) {
+            this.domNode.classList.add(...ThemeIcon.asClassNameArray(this._icon));
+        }
+    }
+    width() {
+        return 2  + 2  + 2  + 16 ;
+    }
+    applyStyles() {
+        if (this.domNode) {
+            this.domNode.style.borderColor = (this._checked && this._opts.inputActiveOptionBorder) || '';
+            this.domNode.style.color = (this._checked && this._opts.inputActiveOptionForeground) || 'inherit';
+            this.domNode.style.backgroundColor = (this._checked && this._opts.inputActiveOptionBackground) || '';
+        }
+    }
+    enable() {
+        this.domNode.setAttribute('aria-disabled', String(false));
+    }
+    disable() {
+        this.domNode.setAttribute('aria-disabled', String(true));
+    }
+    setTitle(newTitle) {
+        this.domNode.title = newTitle;
+        this.domNode.setAttribute('aria-label', newTitle);
+    }
+}
+class Checkbox extends Widget {
+    constructor(title, isChecked, styles) {
+        super();
+        this.title = title;
+        this.isChecked = isChecked;
+        this._onChange = this._register(( new Emitter()));
+        this.onChange = this._onChange.event;
+        this.checkbox = ( new Toggle(
+            { title: this.title, isChecked: this.isChecked, icon: Codicon.check, actionClassName: 'monaco-checkbox', ...unthemedToggleStyles }
+        ));
+        this.domNode = this.checkbox.domNode;
+        this.styles = styles;
+        this.applyStyles();
+        this._register(this.checkbox.onChange(keyboard => {
+            this.applyStyles();
+            this._onChange.fire(keyboard);
+        }));
+    }
+    get checked() {
+        return this.checkbox.checked;
+    }
+    set checked(newIsChecked) {
+        this.checkbox.checked = newIsChecked;
+        this.applyStyles();
+    }
+    focus() {
+        this.domNode.focus();
+    }
+    hasFocus() {
+        return isActiveElement(this.domNode);
+    }
+    enable() {
+        this.checkbox.enable();
+    }
+    disable() {
+        this.checkbox.disable();
+    }
+    applyStyles() {
+        this.domNode.style.color = this.styles.checkboxForeground || '';
+        this.domNode.style.backgroundColor = this.styles.checkboxBackground || '';
+        this.domNode.style.borderColor = this.styles.checkboxBorder || '';
+    }
+}
+class CheckboxActionViewItem extends BaseActionViewItem {
+    constructor(context, action, options) {
+        super(context, action, options);
+        this.toggle = this._register(( new Checkbox(this._action.label, !!this._action.checked, options.checkboxStyles)));
+        this._register(this.toggle.onChange(() => this.onChange()));
+    }
+    render(container) {
+        this.element = container;
+        this.element.classList.add('checkbox-action-item');
+        this.element.appendChild(this.toggle.domNode);
+        if (this.options.label && this._action.label) {
+            const label = this.element.appendChild($('span.checkbox-label', undefined, this._action.label));
+            this._register(addDisposableListener(label, EventType.CLICK, (e) => {
+                this.toggle.checked = !this.toggle.checked;
+                e.stopPropagation();
+                e.preventDefault();
+                this.onChange();
+            }));
+        }
+        this.updateEnabled();
+        this.updateClass();
+        this.updateChecked();
+    }
+    onChange() {
+        this._action.checked = !!this.toggle && this.toggle.checked;
+        this.actionRunner.run(this._action, this._context);
+    }
+    updateEnabled() {
+        if (this.isEnabled()) {
+            this.toggle.enable();
+        }
+        else {
+            this.toggle.disable();
+        }
+        if (this.action.enabled) {
+            this.element?.classList.remove('disabled');
+        }
+        else {
+            this.element?.classList.add('disabled');
+        }
+    }
+    updateChecked() {
+        this.toggle.checked = !!this._action.checked;
+    }
+    updateClass() {
+        if (this.cssClass) {
+            this.toggle.domNode.classList.remove(...this.cssClass.split(' '));
+        }
+        this.cssClass = this.getClass();
+        if (this.cssClass) {
+            this.toggle.domNode.classList.add(...this.cssClass.split(' '));
+        }
+    }
+    focus() {
+        this.toggle.domNode.tabIndex = 0;
+        this.toggle.focus();
+    }
+    blur() {
+        this.toggle.domNode.tabIndex = -1;
+        this.toggle.domNode.blur();
+    }
+    setFocusable(focusable) {
+        this.toggle.domNode.tabIndex = focusable ? 0 : -1;
+    }
+}
+export { Checkbox, CheckboxActionViewItem, Toggle, ToggleActionViewItem, unthemedToggleStyles };

package/vscode/src/vs/base/browser/ui/toolbar/toolbar.css.js

@@ -0,0 +1,4 @@
+import n from '../../../../../../../external/rollup-plugin-styles/dist/runtime/inject-css.js';
+var css = ".monaco-toolbar{height:100%}.monaco-toolbar .toolbar-toggle-more{display:inline-block;padding:0}";
+n(css,{});
+export { css, css as default };

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

@@ -0,0 +1,157 @@
+import { ActionBar } from '../actionbar/actionbar.js';
+import { DropdownMenuActionViewItem } from '../dropdown/dropdownActionViewItem.js';
+import { Action, SubmenuAction } from '../../../common/actions.js';
+import { Codicon } from '../../../common/codicons.js';
+import { ThemeIcon } from '../../../common/themables.js';
+import { EventMultiplexer } from '../../../common/event.js';
+import { Disposable, DisposableStore } from '../../../common/lifecycle.js';
+import './toolbar.css.js';
+import { localizeWithPath } from '../../../../nls.js';
+class ToolBar extends Disposable {
+    constructor(container, contextMenuProvider, options = { orientation: 0  }) {
+        super();
+        this.submenuActionViewItems = [];
+        this.hasSecondaryActions = false;
+        this._onDidChangeDropdownVisibility = this._register(( new EventMultiplexer()));
+        this.onDidChangeDropdownVisibility = this._onDidChangeDropdownVisibility.event;
+        this.disposables = this._register(( new DisposableStore()));
+        this.options = options;
+        this.lookupKeybindings = typeof this.options.getKeyBinding === 'function';
+        this.toggleMenuAction = this._register(( new ToggleMenuAction(() => this.toggleMenuActionViewItem?.show(), options.toggleMenuTitle)));
+        this.element = document.createElement('div');
+        this.element.className = 'monaco-toolbar';
+        container.appendChild(this.element);
+        this.actionBar = this._register(( new ActionBar(this.element, {
+            orientation: options.orientation,
+            ariaLabel: options.ariaLabel,
+            actionRunner: options.actionRunner,
+            allowContextMenu: options.allowContextMenu,
+            highlightToggledItems: options.highlightToggledItems,
+            actionViewItemProvider: (action, viewItemOptions) => {
+                if (action.id === ToggleMenuAction.ID) {
+                    this.toggleMenuActionViewItem = ( new DropdownMenuActionViewItem(action, action.menuActions, contextMenuProvider, {
+                        actionViewItemProvider: this.options.actionViewItemProvider,
+                        actionRunner: this.actionRunner,
+                        keybindingProvider: this.options.getKeyBinding,
+                        classNames: ThemeIcon.asClassNameArray(options.moreIcon ?? Codicon.toolBarMore),
+                        anchorAlignmentProvider: this.options.anchorAlignmentProvider,
+                        menuAsChild: !!this.options.renderDropdownAsChildElement,
+                        skipTelemetry: this.options.skipTelemetry,
+                        isMenu: true
+                    }));
+                    this.toggleMenuActionViewItem.setActionContext(this.actionBar.context);
+                    this.disposables.add(this._onDidChangeDropdownVisibility.add(this.toggleMenuActionViewItem.onDidChangeVisibility));
+                    return this.toggleMenuActionViewItem;
+                }
+                if (options.actionViewItemProvider) {
+                    const result = options.actionViewItemProvider(action, viewItemOptions);
+                    if (result) {
+                        return result;
+                    }
+                }
+                if (action instanceof SubmenuAction) {
+                    const result = ( new DropdownMenuActionViewItem(action, action.actions, contextMenuProvider, {
+                        actionViewItemProvider: this.options.actionViewItemProvider,
+                        actionRunner: this.actionRunner,
+                        keybindingProvider: this.options.getKeyBinding,
+                        classNames: action.class,
+                        anchorAlignmentProvider: this.options.anchorAlignmentProvider,
+                        menuAsChild: !!this.options.renderDropdownAsChildElement,
+                        skipTelemetry: this.options.skipTelemetry
+                    }));
+                    result.setActionContext(this.actionBar.context);
+                    this.submenuActionViewItems.push(result);
+                    this.disposables.add(this._onDidChangeDropdownVisibility.add(result.onDidChangeVisibility));
+                    return result;
+                }
+                return undefined;
+            }
+        })));
+    }
+    set actionRunner(actionRunner) {
+        this.actionBar.actionRunner = actionRunner;
+    }
+    get actionRunner() {
+        return this.actionBar.actionRunner;
+    }
+    set context(context) {
+        this.actionBar.context = context;
+        this.toggleMenuActionViewItem?.setActionContext(context);
+        for (const actionViewItem of this.submenuActionViewItems) {
+            actionViewItem.setActionContext(context);
+        }
+    }
+    getElement() {
+        return this.element;
+    }
+    focus() {
+        this.actionBar.focus();
+    }
+    getItemsWidth() {
+        let itemsWidth = 0;
+        for (let i = 0; i < this.actionBar.length(); i++) {
+            itemsWidth += this.actionBar.getWidth(i);
+        }
+        return itemsWidth;
+    }
+    getItemAction(indexOrElement) {
+        return this.actionBar.getAction(indexOrElement);
+    }
+    getItemWidth(index) {
+        return this.actionBar.getWidth(index);
+    }
+    getItemsLength() {
+        return this.actionBar.length();
+    }
+    setAriaLabel(label) {
+        this.actionBar.setAriaLabel(label);
+    }
+    setActions(primaryActions, secondaryActions) {
+        this.clear();
+        const primaryActionsToSet = primaryActions ? primaryActions.slice(0) : [];
+        this.hasSecondaryActions = !!(secondaryActions && secondaryActions.length > 0);
+        if (this.hasSecondaryActions && secondaryActions) {
+            this.toggleMenuAction.menuActions = secondaryActions.slice(0);
+            primaryActionsToSet.push(this.toggleMenuAction);
+        }
+        primaryActionsToSet.forEach(action => {
+            this.actionBar.push(action, { icon: true, label: false, keybinding: this.getKeybindingLabel(action) });
+        });
+    }
+    isEmpty() {
+        return this.actionBar.isEmpty();
+    }
+    getKeybindingLabel(action) {
+        const key = this.lookupKeybindings ? this.options.getKeyBinding?.(action) : undefined;
+        return key?.getLabel() ?? undefined;
+    }
+    clear() {
+        this.submenuActionViewItems = [];
+        this.disposables.clear();
+        this.actionBar.clear();
+    }
+    dispose() {
+        this.clear();
+        this.disposables.dispose();
+        super.dispose();
+    }
+}
+class ToggleMenuAction extends Action {
+    static { this.ID = 'toolbar.toggle.more'; }
+    constructor(toggleDropdownMenu, title) {
+        title = title || ( localizeWithPath('vs/base/browser/ui/toolbar/toolbar', 'moreActions', "More Actions..."));
+        super(ToggleMenuAction.ID, title, undefined, true);
+        this._menuActions = [];
+        this.toggleDropdownMenu = toggleDropdownMenu;
+    }
+    async run() {
+        this.toggleDropdownMenu();
+    }
+    get menuActions() {
+        return this._menuActions;
+    }
+    set menuActions(actions) {
+        this._menuActions = actions;
+    }
+}
+export { ToggleMenuAction, ToolBar };