@codingame/monaco-vscode-api 36.2.7 → 37.0.0

package/vscode/src/vs/base/browser/ui/scrollbar/scrollableElement.js

@@ -17,6 +17,10 @@ import * as scrollbars from './media/scrollbars.css';
 registerCss(scrollbars);
 const HIDE_TIMEOUT = 500;
 const SCROLL_WHEEL_SENSITIVITY = 50;
+const DEFAULT_SCROLLBAR_SIZE = 10;
+let globalDefaultScrollbarSize = DEFAULT_SCROLLBAR_SIZE;
+const _onDidChangeDefaultScrollbarSizeEmitter = ( new Emitter());
+const onDidChangeDefaultScrollbarSize = _onDidChangeDefaultScrollbarSizeEmitter.event;
 class MouseWheelClassifierItem {
     constructor(timestamp, deltaX, deltaY) {
         this.timestamp = timestamp;
@@ -178,6 +182,20 @@ class AbstractScrollableElement extends Widget {
         this._mouseIsOver = false;
         this._shouldRender = true;
         this._revealOnScroll = true;
+        const hSizeExplicit = typeof options.horizontalScrollbarSize !== "undefined";
+        const vSizeExplicit = typeof options.verticalScrollbarSize !== "undefined";
+        if (!hSizeExplicit || !vSizeExplicit) {
+            this._register(onDidChangeDefaultScrollbarSize(newSize => {
+                this.updateOptions({
+                    ...(!hSizeExplicit ? {
+                        horizontalScrollbarSize: newSize
+                    } : {}),
+                    ...(!vSizeExplicit ? {
+                        verticalScrollbarSize: newSize
+                    } : {})
+                });
+            }));
+        }
     }
     dispose() {
         this._mouseWheelToDispose = dispose(this._mouseWheelToDispose);
@@ -540,11 +558,11 @@ function resolveOptions(opts) {
         arrowSize: (typeof opts.arrowSize !== "undefined" ? opts.arrowSize : 11),
         listenOnDomNode: (typeof opts.listenOnDomNode !== "undefined" ? opts.listenOnDomNode : null),
         horizontal: (typeof opts.horizontal !== "undefined" ? opts.horizontal : ScrollbarVisibility.Auto),
-        horizontalScrollbarSize: (typeof opts.horizontalScrollbarSize !== "undefined" ? opts.horizontalScrollbarSize : 10),
+        horizontalScrollbarSize: (typeof opts.horizontalScrollbarSize !== "undefined" ? opts.horizontalScrollbarSize : globalDefaultScrollbarSize),
         horizontalSliderSize: (typeof opts.horizontalSliderSize !== "undefined" ? opts.horizontalSliderSize : 0),
         horizontalHasArrows: (typeof opts.horizontalHasArrows !== "undefined" ? opts.horizontalHasArrows : false),
         vertical: (typeof opts.vertical !== "undefined" ? opts.vertical : ScrollbarVisibility.Auto),
-        verticalScrollbarSize: (typeof opts.verticalScrollbarSize !== "undefined" ? opts.verticalScrollbarSize : 10),
+        verticalScrollbarSize: (typeof opts.verticalScrollbarSize !== "undefined" ? opts.verticalScrollbarSize : globalDefaultScrollbarSize),
         verticalHasArrows: (typeof opts.verticalHasArrows !== "undefined" ? opts.verticalHasArrows : false),
         verticalSliderSize: (typeof opts.verticalSliderSize !== "undefined" ? opts.verticalSliderSize : 0),
         scrollByPage: (typeof opts.scrollByPage !== "undefined" ? opts.scrollByPage : false)
@@ -557,4 +575,4 @@ function resolveOptions(opts) {
     return result;
 }
 
-export { AbstractScrollableElement, DomScrollableElement, MouseWheelClassifier, ScrollableElement, SmoothScrollableElement };
+export { AbstractScrollableElement, DEFAULT_SCROLLBAR_SIZE, DomScrollableElement, MouseWheelClassifier, ScrollableElement, SmoothScrollableElement, onDidChangeDefaultScrollbarSize };

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

@@ -21,6 +21,10 @@ export interface ISelectBoxOptions {
     ariaDescription?: string;
     minBottomMargin?: number;
     optionsAsChildren?: boolean;
+    /** Hide disabled options from the custom-drawn dropdown. */
+    hideDisabledOptions?: boolean;
+    /** Show option descriptions in right-side hovers instead of the details pane. */
+    showOptionDescriptionHovers?: boolean;
 }
 export interface ISelectOptionItem {
     text: string;

package/vscode/src/vs/base/browser/ui/selectBox/selectBoxCustom.d.ts

@@ -22,18 +22,20 @@ export declare class SelectBoxList extends Disposable implements ISelectBoxDeleg
     private selectList;
     private selectDropDownListContainer;
     private widthControlElement;
+    private listOptionIndexes;
     private _currentSelection;
     private _dropDownPosition;
     private _hasDetails;
     private selectionDetailsPane;
     private readonly _selectionDetailsDisposables;
+    private readonly _optionDescriptionHover;
     private _skipLayout;
     private _cachedMaxDetailsHeight?;
     private _hover?;
     private _sticky;
     constructor(options: ISelectOptionItem[], selected: number, contextViewProvider: IContextViewProvider, styles: ISelectBoxStyles, selectBoxOptions?: ISelectBoxOptions);
     private setTitle;
-    getHeight(): number;
+    getHeight(_element: ISelectOptionItem): number;
     getTemplateId(): string;
     private constructSelectDropDown;
     private registerListeners;
@@ -41,6 +43,9 @@ export declare class SelectBoxList extends Disposable implements ISelectBoxDeleg
     setOptions(options: ISelectOptionItem[], selected?: number): void;
     setEnabled(enable: boolean): void;
     private setOptionsList;
+    private getListIndex;
+    private getOptionIndex;
+    private focusOption;
     select(index: number): void;
     setAriaLabel(label: string): void;
     focus(): void;
@@ -53,6 +58,7 @@ export declare class SelectBoxList extends Disposable implements ISelectBoxDeleg
     private createOption;
     private showSelectDropDown;
     private hideSelectDropDown;
+    private cancelSelectDropDown;
     private renderSelectDropDown;
     private measureMaxDetailsHeight;
     private layoutSelectDropDown;
@@ -62,6 +68,7 @@ export declare class SelectBoxList extends Disposable implements ISelectBoxDeleg
     private onListBlur;
     private renderDescriptionMarkdown;
     private onListFocus;
+    private showOptionDescriptionHover;
     private updateDetail;
     private onEscape;
     private onEnter;

package/vscode/src/vs/base/browser/ui/selectBox/selectBoxCustom.js

@@ -4,7 +4,7 @@ import { localize } from '../../../../nls.js';
 import { equals } from '../../../common/arrays.js';
 import { Emitter, Event } from '../../../common/event.js';
 import { KeyCode, KeyCodeUtils } from '../../../common/keyCodes.js';
-import { Disposable, DisposableStore } from '../../../common/lifecycle.js';
+import { Disposable, DisposableStore, MutableDisposable } from '../../../common/lifecycle.js';
 import { isMacintosh } from '../../../common/platform.js';
 import { ScrollbarVisibility } from '../../../common/scrollable.js';
 import { asCssValueWithDefault } from '../../cssValue.js';
@@ -13,6 +13,7 @@ import { createStyleSheet } from '../../domStylesheets.js';
 import { DomEmitter } from '../../event.js';
 import { StandardKeyboardEvent } from '../../keyboardEvent.js';
 import { renderMarkdown } from '../../markdownRenderer.js';
+import { HoverPosition } from '../hover/hoverWidget.js';
 import '../contextview/contextview.js';
 import { getBaseLayerHoverDelegate } from '../hover/hoverDelegate2.js';
 import { getDefaultHoverDelegate } from '../hover/hoverDelegateFactory.js';
@@ -23,7 +24,11 @@ import { AnchorPosition } from '../../../common/layout.js';
 registerCss(selectBoxCustom);
 const $ = $$1;
 const SELECT_OPTION_ENTRY_TEMPLATE_ID = "selectOption.entry.template";
+const SELECT_OPTION_HEIGHT = 22;
 class SelectListRenderer {
+    constructor() {
+        this.elements = ( new Map());
+    }
     get templateId() {
         return SELECT_OPTION_ENTRY_TEMPLATE_ID;
     }
@@ -37,6 +42,11 @@ class SelectListRenderer {
     }
     renderElement(element, index, templateData) {
         const data = templateData;
+        if (data.element) {
+            this.elements.delete(data.element);
+        }
+        data.element = element;
+        this.elements.set(element, data.root);
         const text = element.text;
         const detail = element.detail;
         const decoratorRight = element.decoratorRight;
@@ -56,7 +66,14 @@ class SelectListRenderer {
             data.root.classList.remove("option-separator");
         }
     }
-    disposeTemplate(_templateData) {}
+    disposeTemplate(templateData) {
+        if (templateData.element) {
+            this.elements.delete(templateData.element);
+        }
+    }
+    getElement(element) {
+        return this.elements.get(element);
+    }
 }
 class SelectBoxList extends Disposable {
     static {
@@ -71,9 +88,11 @@ class SelectBoxList extends Disposable {
     constructor(options, selected, contextViewProvider, styles, selectBoxOptions) {
         super();
         this.options = [];
+        this.listOptionIndexes = [];
         this._currentSelection = 0;
         this._hasDetails = false;
         this._selectionDetailsDisposables = this._register(( new DisposableStore()));
+        this._optionDescriptionHover = this._register(( new MutableDisposable()));
         this._skipLayout = false;
         this._sticky = false;
         this._isVisible = false;
@@ -111,8 +130,8 @@ class SelectBoxList extends Disposable {
             this._hover.update(title);
         }
     }
-    getHeight() {
-        return 22;
+    getHeight(_element) {
+        return SELECT_OPTION_HEIGHT;
     }
     getTemplateId() {
         return SELECT_OPTION_ENTRY_TEMPLATE_ID;
@@ -152,7 +171,7 @@ class SelectBoxList extends Disposable {
         this._register(addDisposableListener(this.selectElement, EventType.CLICK, e => {
             EventHelper.stop(e);
             if (this._isVisible) {
-                this.hideSelectDropDown(true);
+                this.cancelSelectDropDown(true);
             } else {
                 this.showSelectDropDown();
             }
@@ -169,7 +188,7 @@ class SelectBoxList extends Disposable {
         this._register(addDisposableListener(this.selectElement, "touchend", e => {
             EventHelper.stop(e);
             if (listIsVisibleOnTouchStart) {
-                this.hideSelectDropDown(true);
+                this.cancelSelectDropDown(true);
             } else {
                 this.showSelectDropDown();
             }
@@ -205,7 +224,7 @@ class SelectBoxList extends Disposable {
             this._cachedMaxDetailsHeight = undefined;
             this.options.forEach((option, index) => {
                 this.selectElement.add(this.createOption(option.text, index, option.isDisabled));
-                if (typeof option.description === "string") {
+                if (typeof option.description === "string" && !this.selectBoxOptions.showOptionDescriptionHovers) {
                     this._hasDetails = true;
                 }
             });
@@ -219,7 +238,26 @@ class SelectBoxList extends Disposable {
         this.selectElement.disabled = !enable;
     }
     setOptionsList() {
-        this.selectList?.splice(0, this.selectList.length, this.options);
+        this.listOptionIndexes = [];
+        for (let index = 0; index < this.options.length; index++) {
+            if (!this.selectBoxOptions.hideDisabledOptions || !this.options[index].isDisabled) {
+                this.listOptionIndexes.push(index);
+            }
+        }
+        this.selectList?.splice(0, this.selectList.length, ( this.listOptionIndexes.map(index => this.options[index])));
+    }
+    getListIndex(optionIndex) {
+        return this.listOptionIndexes.indexOf(optionIndex);
+    }
+    getOptionIndex(listIndex) {
+        return this.listOptionIndexes[listIndex];
+    }
+    focusOption(optionIndex) {
+        const listIndex = this.getListIndex(optionIndex);
+        if (listIndex >= 0) {
+            this.selectList.reveal(listIndex);
+            this.selectList.setFocus([listIndex]);
+        }
     }
     select(index) {
         if (index >= 0 && index < this.options.length) {
@@ -352,6 +390,7 @@ class SelectBoxList extends Disposable {
         }
         this.createSelectList(this.selectDropDownContainer);
         this.setOptionsList();
+        this._currentSelection = this.selected;
         this.contextViewProvider.showContextView({
             getAnchor: () => this.selectElement,
             render: container => this.renderSelectDropDown(container, true),
@@ -374,21 +413,29 @@ class SelectBoxList extends Disposable {
             },
             anchorPosition: this._dropDownPosition
         }, this.selectBoxOptions.optionsAsChildren ? this.container : undefined);
-        this._currentSelection = this.selected;
         this._isVisible = true;
         this.selectElement.setAttribute("aria-expanded", "true");
+        const focusedListIndex = this.selectList.getFocus()[0];
+        if (focusedListIndex !== undefined) {
+            this.showOptionDescriptionHover(focusedListIndex);
+        }
     }
     hideSelectDropDown(focusSelect) {
         if (!this.contextViewProvider || !this._isVisible) {
             return;
         }
         this._isVisible = false;
+        this._optionDescriptionHover.clear();
         this.selectElement.setAttribute("aria-expanded", "false");
         if (focusSelect) {
             this.selectElement.focus();
         }
         this.contextViewProvider.hideContextView();
     }
+    cancelSelectDropDown(focusSelect) {
+        this.select(this._currentSelection);
+        this.hideSelectDropDown(focusSelect);
+    }
     renderSelectDropDown(container, preLayoutPosition) {
         container.appendChild(this.selectDropDownContainer);
         const computedFontSize = getWindow(this.selectElement).getComputedStyle(this.selectElement).fontSize;
@@ -434,13 +481,17 @@ class SelectBoxList extends Disposable {
             }
             const maxDetailsPaneHeight = this._hasDetails ? this._cachedMaxDetailsHeight : 0;
             const minRequiredDropDownHeight = listHeight + maxDetailsPaneHeight;
-            const maxVisibleOptionsBelow = (Math.floor((maxSelectDropDownHeightBelow - maxDetailsPaneHeight) / this.getHeight()));
-            const maxVisibleOptionsAbove = (Math.floor((maxSelectDropDownHeightAbove - maxDetailsPaneHeight) / this.getHeight()));
+            const maxVisibleOptionsBelow = (Math.floor(
+                (maxSelectDropDownHeightBelow - maxDetailsPaneHeight) / SELECT_OPTION_HEIGHT
+            ));
+            const maxVisibleOptionsAbove = (Math.floor(
+                (maxSelectDropDownHeightAbove - maxDetailsPaneHeight) / SELECT_OPTION_HEIGHT
+            ));
             if (preLayoutPosition) {
                 if ((selectPosition.top + selectPosition.height) > (window.innerHeight - 22) || selectPosition.top < SelectBoxList.DEFAULT_DROPDOWN_MINIMUM_TOP_MARGIN || ((maxVisibleOptionsBelow < 1) && (maxVisibleOptionsAbove < 1))) {
                     return false;
                 }
-                if (maxVisibleOptionsBelow < SelectBoxList.DEFAULT_MINIMUM_VISIBLE_OPTIONS && maxVisibleOptionsAbove > maxVisibleOptionsBelow && this.options.length > maxVisibleOptionsBelow) {
+                if (maxVisibleOptionsBelow < SelectBoxList.DEFAULT_MINIMUM_VISIBLE_OPTIONS && maxVisibleOptionsAbove > maxVisibleOptionsBelow && this.selectList.length > maxVisibleOptionsBelow) {
                     this._dropDownPosition = AnchorPosition.ABOVE;
                     this.selectDropDownListContainer.remove();
                     this.selectionDetailsPane.remove();
@@ -469,18 +520,24 @@ class SelectBoxList extends Disposable {
                     return false;
                 }
                 if (minRequiredDropDownHeight > maxSelectDropDownHeightBelow) {
-                    listHeight = (maxVisibleOptionsBelow * this.getHeight());
+                    listHeight = (maxVisibleOptionsBelow * SELECT_OPTION_HEIGHT);
                 }
             } else {
                 if (minRequiredDropDownHeight > maxSelectDropDownHeightAbove) {
-                    listHeight = (maxVisibleOptionsAbove * this.getHeight());
+                    listHeight = (maxVisibleOptionsAbove * SELECT_OPTION_HEIGHT);
                 }
             }
             this.selectList.layout(listHeight);
             this.selectList.domFocus();
             if (this.selectList.length > 0) {
-                this.selectList.setFocus([this.selected || 0]);
-                this.selectList.reveal(this.selectList.getFocus()[0] || 0);
+                let selectedListIndex = this.getListIndex(this.selected);
+                if (selectedListIndex < 0) {
+                    selectedListIndex = 0;
+                    this.selected = this.getOptionIndex(selectedListIndex);
+                    this.select(this.selected);
+                }
+                this.selectList.reveal(selectedListIndex);
+                this.selectList.setFocus([selectedListIndex]);
             }
             if (this._hasDetails) {
                 this.selectList.getHTMLElement().style.height = `${listHeight}px`;
@@ -488,7 +545,11 @@ class SelectBoxList extends Disposable {
             } else {
                 this.selectDropDownContainer.style.height = `${listHeight}px`;
             }
-            this.updateDetail(this.selected);
+            if (this._hasDetails) {
+                this.updateDetail(this.selected);
+            } else {
+                this.selectionDetailsPane.style.display = "none";
+            }
             this.selectDropDownContainer.style.width = selectOptimalWidth;
             this.selectDropDownListContainer.setAttribute("tabindex", "0");
             return true;
@@ -597,7 +658,7 @@ class SelectBoxList extends Disposable {
             e => this.onPointerUp(e)
         ));
         this._register(this.selectList.onMouseOver(
-            e => typeof e.index !== "undefined" && !this.options[e.index]?.isDisabled && this.selectList.setFocus([e.index])
+            e => typeof e.index !== "undefined" && !e.element?.isDisabled && this.selectList.setFocus([e.index])
         ));
         this._register(this.selectList.onDidChangeFocus(e => this.onListFocus(e)));
         this._register(
@@ -628,13 +689,12 @@ class SelectBoxList extends Disposable {
         if (!listRowElement) {
             return;
         }
-        const index = Number(listRowElement.getAttribute("data-index"));
+        const index = this.getOptionIndex(Number(listRowElement.getAttribute("data-index")));
         const disabled = listRowElement.classList.contains("option-disabled");
         if (index >= 0 && index < this.options.length && !disabled) {
             this.selected = index;
             this.select(this.selected);
-            this.selectList.setFocus([this.selected]);
-            this.selectList.reveal(this.selectList.getFocus()[0]);
+            this.focusOption(this.selected);
             if (this.selected !== this._currentSelection) {
                 this._currentSelection = this.selected;
                 this._onDidSelect.fire({
@@ -652,10 +712,7 @@ class SelectBoxList extends Disposable {
         if (this._sticky) {
             return;
         }
-        if (this.selected !== this._currentSelection) {
-            this.select(this._currentSelection);
-        }
-        this.hideSelectDropDown(false);
+        this.cancelSelectDropDown(false);
     }
     renderDescriptionMarkdown(text, actionHandler) {
         const cleanRenderedMarkdown = element => {
@@ -680,10 +737,32 @@ class SelectBoxList extends Disposable {
         return rendered;
     }
     onListFocus(e) {
-        if (!this._isVisible || !this._hasDetails) {
+        if (!this._isVisible) {
             return;
         }
-        this.updateDetail(e.indexes[0]);
+        const listIndex = e.indexes[0];
+        const optionIndex = this.getOptionIndex(listIndex);
+        if (this._hasDetails) {
+            this.updateDetail(optionIndex);
+        }
+        this.showOptionDescriptionHover(listIndex);
+    }
+    showOptionDescriptionHover(listIndex) {
+        if (!this.selectBoxOptions.showOptionDescriptionHovers) {
+            return;
+        }
+        const option = this.options[this.getOptionIndex(listIndex)];
+        const description = option?.description;
+        const target = option ? this.listRenderer.getElement(option) : undefined;
+        this._optionDescriptionHover.value = description && target ? getBaseLayerHoverDelegate().showDelayedHover({
+            content: description,
+            target,
+            position: {
+                hoverPosition: HoverPosition.RIGHT
+            }
+        }, {
+            groupId: "select-box-option-description"
+        }) : undefined;
     }
     updateDetail(selectedIndex) {
         this._selectionDetailsDisposables.clear();
@@ -709,8 +788,7 @@ class SelectBoxList extends Disposable {
     }
     onEscape(e) {
         EventHelper.stop(e);
-        this.select(this._currentSelection);
-        this.hideSelectDropDown(true);
+        this.cancelSelectDropDown(true);
     }
     onEnter(e) {
         EventHelper.stop(e);
@@ -742,8 +820,7 @@ class SelectBoxList extends Disposable {
             }
             this.selected = next;
             this.select(this.selected);
-            this.selectList.setFocus([this.selected]);
-            this.selectList.reveal(this.selectList.getFocus()[0]);
+            this.focusOption(this.selected);
         }
     }
     onUpArrow(e) {
@@ -758,8 +835,7 @@ class SelectBoxList extends Disposable {
             }
             this.selected = prev;
             this.select(this.selected);
-            this.selectList.setFocus([this.selected]);
-            this.selectList.reveal(this.selectList.getFocus()[0]);
+            this.focusOption(this.selected);
         }
     }
     onPageUp(e) {
@@ -767,15 +843,16 @@ class SelectBoxList extends Disposable {
         this.selectList.focusPreviousPage();
         setTimeout(() => {
             let candidate = this.selectList.getFocus()[0];
-            while (candidate > 0 && this.options[candidate].isDisabled) {
+            while (candidate > 0 && this.options[this.getOptionIndex(candidate)].isDisabled) {
                 candidate--;
             }
-            if (this.options[candidate].isDisabled) {
+            const optionIndex = this.getOptionIndex(candidate);
+            if (this.options[optionIndex].isDisabled) {
                 return;
             }
-            this.selected = candidate;
-            this.selectList.setFocus([this.selected]);
-            this.selectList.reveal(this.selected);
+            this.selected = optionIndex;
+            this.selectList.reveal(candidate);
+            this.selectList.setFocus([candidate]);
             this.select(this.selected);
         }, 1);
     }
@@ -784,15 +861,16 @@ class SelectBoxList extends Disposable {
         this.selectList.focusNextPage();
         setTimeout(() => {
             let candidate = this.selectList.getFocus()[0];
-            while (candidate < this.options.length - 1 && this.options[candidate].isDisabled) {
+            while (candidate < this.selectList.length - 1 && this.options[this.getOptionIndex(candidate)].isDisabled) {
                 candidate++;
             }
-            if (this.options[candidate].isDisabled) {
+            const optionIndex = this.getOptionIndex(candidate);
+            if (this.options[optionIndex].isDisabled) {
                 return;
             }
-            this.selected = candidate;
-            this.selectList.setFocus([this.selected]);
-            this.selectList.reveal(this.selected);
+            this.selected = optionIndex;
+            this.selectList.reveal(candidate);
+            this.selectList.setFocus([candidate]);
             this.select(this.selected);
         }, 1);
     }
@@ -809,8 +887,7 @@ class SelectBoxList extends Disposable {
             return;
         }
         this.selected = candidate;
-        this.selectList.setFocus([this.selected]);
-        this.selectList.reveal(this.selected);
+        this.focusOption(this.selected);
         this.select(this.selected);
     }
     onEnd(e) {
@@ -826,8 +903,7 @@ class SelectBoxList extends Disposable {
             return;
         }
         this.selected = candidate;
-        this.selectList.setFocus([this.selected]);
-        this.selectList.reveal(this.selected);
+        this.focusOption(this.selected);
         this.select(this.selected);
     }
     onCharacter(e) {
@@ -837,8 +913,7 @@ class SelectBoxList extends Disposable {
             optionIndex = (i + this.selected + 1) % this.options.length;
             if (this.options[optionIndex].text.charAt(0).toUpperCase() === ch && !this.options[optionIndex].isDisabled) {
                 this.select(optionIndex);
-                this.selectList.setFocus([optionIndex]);
-                this.selectList.reveal(this.selectList.getFocus()[0]);
+                this.focusOption(optionIndex);
                 EventHelper.stop(e);
                 break;
             }

package/vscode/src/vs/base/browser/ui/splitview/paneview.css

@@ -6,6 +6,7 @@
 .monaco-pane-view {
 	width: 100%;
 	height: 100%;
+	/* KEEP IN SYNC WITH: paneview.ts DEFAULT_PANE_HEADER_SIZE */
 	--pane-header-size: 22px;
 }
 
@@ -23,6 +24,7 @@
 
 .monaco-pane-view .pane > .pane-header {
 	height: var(--pane-header-size);
+	line-height: var(--pane-header-size);
 	font-size: 11px;
 	font-weight: bold;
 	overflow: hidden;
@@ -50,6 +52,10 @@
 	margin: 0 2px;
 }
 
+.monaco-pane-view .pane > .pane-header.expanded > .codicon:first-of-type {
+	transform: translateY(1px);
+}
+
 .monaco-pane-view .pane.horizontal:not(.expanded) > .pane-header > .codicon:first-of-type {
 	margin: 2px;
 }

package/vscode/src/vs/base/browser/ui/splitview/paneview.d.ts

@@ -18,6 +18,11 @@ export interface IPaneStyles {
     readonly headerBorder: string | undefined;
     readonly leftBorder: string | undefined;
 }
+export declare const DEFAULT_PANE_HEADER_SIZE = 22;
+/**
+ * Updates the header size used by all panes.
+ */
+export declare function setGlobalPaneHeaderSize(size: number): void;
 /**
  * A Pane is a structured SplitView view.
  *
@@ -28,11 +33,6 @@ export interface IPaneStyles {
  * before the `render()` call, thus forbidding their use.
  */
 export declare abstract class Pane extends Disposable implements IView {
-    /**
-     * Fallback header size (in px) used when the `--pane-header-size` CSS variable
-     * is not resolvable (e.g. before the element is attached to the document).
-     */
-    private static readonly HEADER_SIZE;
     readonly element: HTMLElement;
     private header;
     private body;
@@ -47,21 +47,6 @@ export declare abstract class Pane extends Disposable implements IView {
     private _ariaHeaderLabel;
     private styles;
     private animationTimer;
-    /**
-     * Cached result of {@link Pane.resolveHeaderSize}. Resolving reads a computed
-     * style, which is comparatively expensive and runs on the layout hot path
-     * (`minimumSize` / `maximumSize` / `layout` can each read it), so the value is
-     * memoized and only re-read once per {@link Pane.layout} pass.
-     */
-    private _headerSize;
-    /**
-     * Deferred re-clamp scheduled when {@link Pane.layout} detects that the header
-     * size changed between passes (e.g. the `--pane-header-size` CSS variable was
-     * overridden at runtime). Fires {@link Pane.onDidChange} on the next frame so
-     * the split view re-clamps the size it reserves for this pane without
-     * reentering the current layout pass.
-     */
-    private readonly _headerSizeRelayout;
     private readonly _onDidChange;
     readonly onDidChange: Event<number | undefined>;
     private readonly _onDidChangeExpansionState;
@@ -75,14 +60,6 @@ export declare abstract class Pane extends Disposable implements IView {
     set minimumBodySize(size: number);
     get maximumBodySize(): number;
     set maximumBodySize(size: number);
-    /**
-     * Resolves the header size from the `--pane-header-size` CSS variable so it can
-     * be overridden via CSS (e.g. by the `paneHeaders` style-override) without a
-     * hard-coded constant. Falls back to {@link Pane.HEADER_SIZE} when the variable
-     * is absent or unparseable. The result is cached and refreshed once per
-     * {@link Pane.layout} pass.
-     */
-    private resolveHeaderSize;
     private get headerSize();
     get minimumSize(): number;
     get maximumSize(): number;