@codingame/monaco-vscode-api 36.2.6 → 37.0.0

package/vscode/src/vs/platform/actionWidget/browser/actionList.js

@@ -1,21 +1,25 @@
 
 import { registerCss } from '../../../../../../css.js';
 import { __decorate, __param } from '../../../../../../external/tslib/tslib.es6.js';
-import { createElement, setVisibility, clearNode, addDisposableListener, EventType, isHTMLElement, append, $, addDisposableGenericMouseUpListener, EventHelper, isActiveElement, isMouseEvent, getWindow, getActiveElement } from '../../../base/browser/dom.js';
+import { createElement, setVisibility, clearNode, addDisposableListener, EventType, EventHelper, isHTMLElement, append, $, addStandardDisposableListener, addDisposableGenericMouseUpListener, isEditableElement, isActiveElement, isAncestorOfActiveElement, getWindow, getDomNodeZoomLevel, getComputedStyle, isMouseEvent, DisposableResizeObserver, getActiveElement, SafeTriangle } from '../../../base/browser/dom.js';
+import { StandardKeyboardEvent } from '../../../base/browser/keyboardEvent.js';
 import { renderMarkdown } from '../../../base/browser/markdownRenderer.js';
 import { ActionBar } from '../../../base/browser/ui/actionbar/actionbar.js';
 import { getAnchorRect } from '../../../base/browser/ui/contextview/contextview.js';
 import { KeybindingLabel } from '../../../base/browser/ui/keybindingLabel/keybindingLabel.js';
-import { Toggle } from '../../../base/browser/ui/toggle/toggle.js';
+import { DomScrollableElement } from '../../../base/browser/ui/scrollbar/scrollableElement.js';
+import { Switch } from '../../../base/browser/ui/toggle/switch.js';
 import { List } from '../../../base/browser/ui/list/listWidget.js';
 import { toAction, SubmenuAction } from '../../../base/common/actions.js';
 import { CancellationTokenSource } from '../../../base/common/cancellation.js';
 import { Codicon } from '../../../base/common/codicons.js';
 import { Emitter } from '../../../base/common/event.js';
 import { isMarkdownString, MarkdownString } from '../../../base/common/htmlContent.js';
+import { KeyCode } from '../../../base/common/keyCodes.js';
 import { AnchorPosition } from '../../../base/common/layout.js';
 import { DisposableStore, Disposable, MutableDisposable, toDisposable } from '../../../base/common/lifecycle.js';
 import { OS } from '../../../base/common/platform.js';
+import { ScrollbarVisibility } from '../../../base/common/scrollable.js';
 import { ThemeIcon } from '../../../base/common/themables.js';
 import { URI } from '../../../base/common/uri.js';
 import * as actionWidget from './actionWidget.css';
@@ -81,10 +85,17 @@ class SeparatorRenderer {
         };
     }
     renderElement(element, _index, templateData) {
+        templateData.container.classList.toggle("has-label", !!element.label);
         templateData.text.textContent = element.label ?? "";
     }
     disposeTemplate(_templateData) {}
 }
+function hasExpandablePanel(item) {
+    return (!!item.submenuActions?.length && !item.hover?.content) || !!item.hover?.expandable;
+}
+function hasSubmenuIndicator(item) {
+    return hasExpandablePanel(item) && item.hover?.showIndicator !== false;
+}
 let ActionItemRenderer = class ActionItemRenderer {
     get templateId() {
         return ActionListItemKind.Action;
@@ -93,20 +104,22 @@ let ActionItemRenderer = class ActionItemRenderer {
         _supportsPreview,
         _onRemoveItem,
         _onShowSubmenu,
-        _hasAnySubmenuActions,
+        _reservesSubmenuSpace,
         _groupTitleByIndex,
         _linkHandler,
         _hideDefaultKeybindingTooltip,
+        _registerStandaloneToggle,
         _keybindingService,
         _openerService
     ) {
         this._supportsPreview = _supportsPreview;
         this._onRemoveItem = _onRemoveItem;
         this._onShowSubmenu = _onShowSubmenu;
-        this._hasAnySubmenuActions = _hasAnySubmenuActions;
+        this._reservesSubmenuSpace = _reservesSubmenuSpace;
         this._groupTitleByIndex = _groupTitleByIndex;
         this._linkHandler = _linkHandler;
         this._hideDefaultKeybindingTooltip = _hideDefaultKeybindingTooltip;
+        this._registerStandaloneToggle = _registerStandaloneToggle;
         this._keybindingService = _keybindingService;
         this._openerService = _openerService;
     }
@@ -158,16 +171,17 @@ let ActionItemRenderer = class ActionItemRenderer {
     }
     renderElement(element, _index, data) {
         data.elementDisposables.clear();
-        if (element.group?.icon) {
+        if (element.iconClasses?.length) {
+            data.icon.className = ["icon", ...element.iconClasses].join(" ");
+            data.icon.style.color = "";
+        } else if (element.group?.icon) {
             data.icon.className = ThemeIcon.asClassName(element.group.icon);
-            if (element.group.icon.color) {
-                data.icon.style.color = asCssVariable(element.group.icon.color.id);
-            }
+            data.icon.style.color = element.group.icon.color ? asCssVariable(element.group.icon.color.id) : "";
         } else {
             data.icon.className = ThemeIcon.asClassName(Codicon.lightBulb);
             data.icon.style.color = "var(--vscode-editorLightBulb-foreground)";
         }
-        if (!element.item || !element.label) {
+        if ((!element.item && !element.standaloneToggle) || !element.label) {
             return;
         }
         setVisibility(!element.hideIcon, data.icon);
@@ -177,14 +191,15 @@ let ActionItemRenderer = class ActionItemRenderer {
         } else {
             data.container.removeAttribute("aria-expanded");
         }
-        if (data.previousClassName) {
-            data.container.classList.remove(data.previousClassName);
+        if (data.previousClassNames?.length) {
+            data.container.classList.remove(...data.previousClassNames);
         }
-        data.container.classList.toggle("action-list-custom", !!element.className);
-        if (element.className) {
-            data.container.classList.add(element.className);
+        const classNames = element.className?.split(/\s+/).filter(name => name.length > 0) ?? [];
+        data.container.classList.toggle("action-list-custom", classNames.length > 0);
+        if (classNames.length) {
+            data.container.classList.add(...classNames);
         }
-        data.previousClassName = element.className;
+        data.previousClassNames = classNames;
         data.text.textContent = stripNewlines(element.label);
         if (element.badge) {
             data.badge.textContent = element.badge;
@@ -237,32 +252,36 @@ let ActionItemRenderer = class ActionItemRenderer {
             data.detail.textContent = "";
             data.detail.style.display = "none";
         }
+        data.container.classList.toggle("has-detail", !!element.detail);
         clearNode(data.inlineToggleContainer);
-        if (element.inlineToggle) {
-            const inlineToggle = element.inlineToggle;
+        const toggleConfig = element.standaloneToggle ?? element.inlineToggle;
+        if (toggleConfig) {
             const toggleLabel = createElement("span");
             toggleLabel.className = "action-list-item-inline-toggle-label";
-            toggleLabel.textContent = stripNewlines(inlineToggle.label);
-            data.inlineToggleContainer.append(toggleLabel);
+            toggleLabel.textContent = stripNewlines(toggleConfig.label);
+            if (!element.standaloneToggle) {
+                data.inlineToggleContainer.append(toggleLabel);
+            }
             data.inlineToggleContainer.style.display = "";
-            data.container.classList.add("has-inline-toggle");
-            const toggle = data.elementDisposables.add(( new Toggle({
-                title: inlineToggle.title ?? inlineToggle.label,
-                isChecked: inlineToggle.checked,
-                actionClassName: "action-list-inline-switch",
-                notFocusable: false,
-                inputActiveOptionBorder: undefined,
-                inputActiveOptionForeground: undefined,
-                inputActiveOptionBackground: undefined
+            data.container.classList.toggle("has-inline-toggle", !!element.inlineToggle);
+            data.container.classList.toggle("has-standalone-toggle", !!element.standaloneToggle);
+            const toggle = data.elementDisposables.add(( new Switch({
+                ariaLabel: toggleConfig.title ?? toggleConfig.label,
+                checked: toggleConfig.checked,
+                disabled: toggleConfig.disabled
             })));
             data.inlineToggleContainer.append(toggle.domNode);
-            data.elementDisposables.add(toggle.onChange(() => inlineToggle.onChange(toggle.checked)));
+            if (element.standaloneToggle) {
+                data.elementDisposables.add(this._registerStandaloneToggle(element, toggle));
+            }
+            data.elementDisposables.add(toggle.onChange(() => toggleConfig.onChange(toggle.checked)));
             data.elementDisposables.add(
                 addDisposableListener(data.inlineToggleContainer, EventType.CLICK, e => e.stopPropagation())
             );
         } else {
             data.inlineToggleContainer.style.display = "none";
             data.container.classList.remove("has-inline-toggle");
+            data.container.classList.remove("has-standalone-toggle");
         }
         const actionTitle = this._keybindingService.lookupKeybinding(acceptSelectedActionCommand)?.getLabel();
         const previewTitle = this._keybindingService.lookupKeybinding(previewSelectedActionCommand)?.getLabel();
@@ -273,13 +292,15 @@ let ActionItemRenderer = class ActionItemRenderer {
             data.container.title = element.tooltip;
         } else if (element.disabled) {
             data.container.title = element.label;
+        } else if (element.standaloneToggle) {
+            data.container.title = "";
         } else if (this._hideDefaultKeybindingTooltip) {
             data.container.title = "";
         } else if (actionTitle && previewTitle) {
             if (this._supportsPreview && element.canPreview) {
-                data.container.title = ( localize(1793, "{0} to Apply, {1} to Preview", actionTitle, previewTitle));
+                data.container.title = ( localize(1812, "{0} to Apply, {1} to Preview", actionTitle, previewTitle));
             } else {
-                data.container.title = ( localize(1794, "{0} to Apply", actionTitle));
+                data.container.title = ( localize(1813, "{0} to Apply", actionTitle));
             }
         } else {
             data.container.title = "";
@@ -289,7 +310,7 @@ let ActionItemRenderer = class ActionItemRenderer {
         if (element.onRemove) {
             toolbarActions.push(toAction({
                 id: "actionList.remove",
-                label: ( localize(1795, "Remove")),
+                label: ( localize(1814, "Remove")),
                 class: ThemeIcon.asClassName(Codicon.close),
                 run: async () => {
                     await element.onRemove();
@@ -306,7 +327,7 @@ let ActionItemRenderer = class ActionItemRenderer {
                 label: false
             });
         }
-        if (element.submenuActions?.length && !element.hover?.content) {
+        if (hasSubmenuIndicator(element)) {
             data.submenuIndicator.className = "action-list-submenu-indicator has-submenu " + ThemeIcon.asClassName(Codicon.chevronRight);
             data.submenuIndicator.style.display = "";
             data.submenuIndicator.style.visibility = "";
@@ -316,7 +337,7 @@ let ActionItemRenderer = class ActionItemRenderer {
                     this._onShowSubmenu?.(element);
                 })
             );
-        } else if (this._hasAnySubmenuActions) {
+        } else if (this._reservesSubmenuSpace()) {
             data.submenuIndicator.className = "action-list-submenu-indicator";
             data.submenuIndicator.style.display = "";
             data.submenuIndicator.style.visibility = "hidden";
@@ -324,13 +345,22 @@ let ActionItemRenderer = class ActionItemRenderer {
             data.submenuIndicator.className = "action-list-submenu-indicator";
             data.submenuIndicator.style.display = "none";
         }
+        if (hasExpandablePanel(element)) {
+            data.container.setAttribute("aria-haspopup", element.hover?.expandable ? "dialog" : "menu");
+            data.container.setAttribute("aria-expanded", "false");
+        } else {
+            data.container.removeAttribute("aria-haspopup");
+            if (!element.isSectionToggle) {
+                data.container.removeAttribute("aria-expanded");
+            }
+        }
     }
     disposeTemplate(templateData) {
         templateData.keybinding.dispose();
         templateData.elementDisposables.dispose();
     }
 };
-ActionItemRenderer = ( __decorate([( __param(7, IKeybindingService)), ( __param(8, IOpenerService))], ActionItemRenderer));
+ActionItemRenderer = ( __decorate([( __param(8, IKeybindingService)), ( __param(9, IOpenerService))], ActionItemRenderer));
 class AcceptSelectedEvent extends UIEvent {
     constructor() {
         super("acceptSelectedAction");
@@ -370,14 +400,21 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         this._separatorLineHeight = 8;
         this.cts = this._register(( new CancellationTokenSource()));
         this._submenuDisposables = this._register(( new DisposableStore()));
+        this._itemMoveAnimation = this._register(( new MutableDisposable()));
         this._collapsedSections = ( new Set());
         this._filterText = "";
+        this._imeSessionInProgress = false;
         this._suppressHover = false;
+        this._ignoreInitialHover = true;
         this._hasLaidOut = false;
         this._filterCts = this._register(( new MutableDisposable()));
         this._groupTitleByIndex = ( new Map());
+        this._standaloneToggles = ( new Map());
         this._onDidRequestLayout = this._register(( new Emitter()));
         this.onDidRequestLayout = this._onDidRequestLayout.event;
+        this._visibleMenuItems = items;
+        this._initialFocusItemId = this._options?.initialFocusItemId;
+        this._filterText = this._options?.showFilter ? this._options.initialFilterValue ?? "" : "";
         this.domNode = createElement("div");
         this.domNode.classList.add("actionList");
         if (this._options?.inlineDescription) {
@@ -393,14 +430,42 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         this._submenuContainer = createElement("div");
         this._submenuContainer.className = "action-list-submenu-panel action-widget";
         this._submenuContainer.style.display = "none";
+        if (this._options?.persistentHover) {
+            this._submenuContainer.style.boxSizing = "border-box";
+        }
         this._submenuContainer.tabIndex = -1;
         this.domNode.append(this._submenuContainer);
+        this._register(addDisposableListener(this._submenuContainer, "keydown", e => {
+            if (e.key !== "ArrowLeft" && e.key !== "Escape") {
+                return;
+            }
+            EventHelper.stop(e, true);
+            this._hideSubmenu();
+            this._list.domFocus();
+        }));
         this._register(addDisposableListener(this._submenuContainer, "mouseenter", () => {
             this._cancelSubmenuHide();
+            if (this._options?.persistentHover) {
+                this._cancelSubmenuShow();
+                this._resetSubmenuPointer();
+            }
         }));
         this._register(addDisposableListener(this._submenuContainer, "mouseleave", () => {
             this._scheduleSubmenuHide();
         }));
+        this._register(addDisposableListener(this.domNode, EventType.MOUSE_LEAVE, () => {
+            this._cancelSubmenuShow();
+            this._resetSubmenuPointer();
+        }));
+        if (this._options?.persistentHover) {
+            this._register(
+                addDisposableListener(this.domNode, EventType.MOUSE_MOVE, event => {
+                    if (isHTMLElement(event.target) && this._expandedTrigger?.contains(event.target)) {
+                        this._updateSubmenuPointer(event);
+                    }
+                })
+            );
+        }
         this._register(toDisposable(() => {
             this._cancelSubmenuHide();
             this._cancelSubmenuShow();
@@ -416,21 +481,31 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             },
             getTemplateId: element => element.kind
         };
-        const reserveSubmenuSpace = this._options?.reserveSubmenuSpace ?? true;
-        const hasAnySubmenuActions = reserveSubmenuSpace && ( items.some(item => !!item.submenuActions?.length && !item.hover?.content));
+        const reservesSubmenuSpace = () => {
+            const reserve = this._options?.reserveSubmenuSpace ?? true;
+            return reserve === "always" || (reserve && ( this._allMenuItems.some(hasSubmenuIndicator)));
+        };
         this._list = this._register(( new List(user, this.domNode, virtualDelegate, [( new ActionItemRenderer(
             this._supportsPreview,
             item => this._removeItem(item),
             item => this._showSubmenuForItem(item),
-            hasAnySubmenuActions,
+            reservesSubmenuSpace,
             this._groupTitleByIndex,
             this._options?.linkHandler,
             this._options?.hideDefaultKeybindingTooltip ?? false,
+            (item, toggle) => {
+                this._standaloneToggles.set(item, toggle);
+                return toDisposable(() => {
+                    if (this._standaloneToggles.get(item) === toggle) {
+                        this._standaloneToggles.delete(item);
+                    }
+                });
+            },
             this._keybindingService,
             this._openerService
         )), ( new HeaderRenderer()), ( new SeparatorRenderer())], {
             keyboardSupport: false,
-            typeNavigationEnabled: !this._options?.showFilter,
+            typeNavigationEnabled: !this._options?.showFilter && !this._options?.onType,
             keyboardNavigationLabelProvider: {
                 getKeyboardNavigationLabel
             },
@@ -457,20 +532,26 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                         if (element.group?.title) {
                             label = label + ", " + element.group.title;
                         }
-                        if (element.inlineToggle) {
-                            label = label + ", " + (element.inlineToggle.checked ? ( localize(1796, "{0}, on", element.inlineToggle.label)) : ( localize(1797, "{0}, off", element.inlineToggle.label)));
+                        const toggleConfig = element.standaloneToggle ?? element.inlineToggle;
+                        if (toggleConfig) {
+                            label = element.standaloneToggle ? (toggleConfig.checked ? ( localize(1815, "{0}, on", toggleConfig.label)) : ( localize(1816, "{0}, off", toggleConfig.label))) : label + ", " + (toggleConfig.checked ? ( localize(1817, "{0}, on", toggleConfig.label)) : ( localize(1818, "{0}, off", toggleConfig.label)));
                         }
                         if (element.disabled) {
-                            label = ( localize(1798, "{0}, Disabled Reason: {1}", label, element.disabled));
+                            label = ( localize(1819, "{0}, Disabled Reason: {1}", label, element.disabled));
                         }
                         if (element.submenuActions?.length) {
-                            label = ( localize(1799, "{0}, use right arrow to access options", label));
+                            label = ( localize(1820, "{0}, use right arrow to access options", label));
                         }
                         return label;
                     }
                     return null;
                 },
-                getWidgetAriaLabel: () => ( localize(1800, "Action Widget")),
+                getWidgetAriaLabel: () => ( localize(1821, "Action Widget")),
+                getSetSize: () => this._visibleMenuItems.filter(item => item.kind === ActionListItemKind.Action).length,
+                getPosInSet: (_element, index) => Math.max(
+                    this._visibleMenuItems.slice(0, index + 1).filter(item => item.kind === ActionListItemKind.Action).length,
+                    1
+                ),
                 getRole: e => {
                     switch (e.kind) {
                     case ActionListItemKind.Action:
@@ -487,9 +568,28 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         })));
         this._list.style(defaultListStyles);
         this._register(this._list.onMouseClick(e => this.onListClick(e)));
-        this._register(this._list.onMouseOver(e => this.onListHover(e)));
+        this._register(this._list.onMouseOver(e => {
+            if (!this._ignoreInitialHover) {
+                this.onListHover(e);
+            }
+        }));
+        const initialMouseMove = this._register(( new MutableDisposable()));
+        initialMouseMove.value = this._list.onMouseMove(e => {
+            if (e.browserEvent.movementX !== 0 || e.browserEvent.movementY !== 0) {
+                initialMouseMove.clear();
+                this._ignoreInitialHover = false;
+                this.onListHover(e);
+            }
+        });
+        this._register(this._list.onMouseDown(() => {
+            initialMouseMove.clear();
+            this._ignoreInitialHover = false;
+        }));
         this._register(this._list.onDidChangeFocus(() => this.onFocus()));
         this._register(this._list.onDidChangeSelection(e => this.onListSelection(e)));
+        if (this._options?.persistentHover) {
+            this._register(this._list.onDidScroll(() => this._layoutSubmenu?.()));
+        }
         this._allMenuItems = [...items];
         if (this._options?.showFilter || this._options?.secondaryHeading) {
             this._filterContainer = createElement("div");
@@ -499,9 +599,51 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 this._filterInput = createElement("input");
                 this._filterInput.type = "text";
                 this._filterInput.className = "action-list-filter-input";
-                this._filterInput.placeholder = this._options?.filterPlaceholder ?? ( localize(1801, "Search..."));
-                this._filterInput.setAttribute("aria-label", ( localize(1802, "Filter items")));
+                this._filterInput.placeholder = this._options?.filterPlaceholder ?? ( localize(1822, "Search..."));
+                this._filterInput.value = this._filterText;
+                this._filterInput.setAttribute("aria-label", ( localize(1823, "Filter items")));
                 filterRow.appendChild(this._filterInput);
+                if (this._options.filterAsCombobox) {
+                    const listElement = this._list.getHTMLElement();
+                    listElement.id = this._list.domId;
+                    this._filterInput.setAttribute("role", "combobox");
+                    this._filterInput.setAttribute("aria-label", this._filterInput.placeholder);
+                    this._filterInput.setAttribute("aria-autocomplete", "list");
+                    this._filterInput.setAttribute("aria-expanded", "true");
+                    this._filterInput.setAttribute("aria-controls", listElement.id);
+                    this._register(this._list.onDidChangeFocus(() => this._updateFilterActiveDescendant()));
+                    this._register(
+                        addDisposableListener(this._filterInput, "focus", () => this._updateFilterActiveDescendant())
+                    );
+                    this._register(
+                        addDisposableListener(this._filterInput, "blur", () => this._updateFilterActiveDescendant())
+                    );
+                    this._register(addStandardDisposableListener(this._filterInput, "keydown", e => {
+                        const isComposing = this._imeSessionInProgress || e.browserEvent.isComposing || e.keyCode === KeyCode.KEY_IN_COMPOSITION;
+                        if (isComposing || e.keyCode === KeyCode.LeftArrow || e.keyCode === KeyCode.RightArrow || e.keyCode === KeyCode.Home || e.keyCode === KeyCode.End) {
+                            e.stopPropagation();
+                            return;
+                        }
+                        const isNavigation = e.keyCode === KeyCode.UpArrow || e.keyCode === KeyCode.DownArrow;
+                        if (!isNavigation && e.keyCode !== KeyCode.Enter) {
+                            return;
+                        }
+                        if (e.ctrlKey || e.metaKey || e.altKey || e.shiftKey) {
+                            if (isNavigation) {
+                                e.stopPropagation();
+                            }
+                            return;
+                        }
+                        EventHelper.stop(e, true);
+                        if (e.keyCode === KeyCode.UpArrow) {
+                            this.focusPrevious();
+                        } else if (e.keyCode === KeyCode.DownArrow) {
+                            this.focusNext();
+                        } else {
+                            this.acceptSelected();
+                        }
+                    }));
+                }
                 const filterActions = this._options?.filterActions ?? [];
                 if (filterActions.length > 0) {
                     const filterActionsContainer = append(filterRow, $(".action-list-filter-actions"));
@@ -511,10 +653,25 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                         label: false
                     });
                 }
-                this._register(addDisposableListener(this._filterInput, "input", () => {
-                    this._filterText = this._filterInput.value;
+                const onFilterValueChanged = () => {
+                    const value = this._filterInput.value;
+                    if (this._imeSessionInProgress || value === this._filterText) {
+                        return;
+                    }
+                    this._filterText = value;
                     this._applyOrUpdateFilter();
+                };
+                this._register(addDisposableListener(this._filterInput, "compositionstart", () => {
+                    this._imeSessionInProgress = true;
+                    this._filterCts.value?.cancel();
+                }));
+                this._register(addDisposableListener(this._filterInput, "compositionend", () => {
+                    this._imeSessionInProgress = false;
+                    onFilterValueChanged();
                 }));
+                this._register(
+                    addDisposableListener(this._filterInput, "input", onFilterValueChanged)
+                );
             }
             if (this._options?.secondaryHeading) {
                 const filterLabelEl = append(filterRow, $(".action-list-filter-label"));
@@ -536,6 +693,16 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             }
             const text = append(this._headerContainer, $("span.action-list-header-text"));
             text.textContent = this._options.headerText;
+            this._register(
+                addDisposableListener(this._headerContainer, EventType.MOUSE_ENTER, () => {
+                    if (this._options?.persistentHover) {
+                        this._cancelSubmenuShow();
+                        this._resetSubmenuPointer();
+                    } else {
+                        this._hideSubmenu();
+                    }
+                })
+            );
             if (this._options.headerLink) {
                 const {
                     label,
@@ -553,7 +720,7 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 dismissButton.appendChild($(ThemeIcon.asCSSSelector(Codicon.close)));
                 dismissButton.tabIndex = 0;
                 dismissButton.setAttribute("role", "button");
-                dismissButton.setAttribute("aria-label", ( localize(1803, "Dismiss")));
+                dismissButton.setAttribute("aria-label", ( localize(1824, "Dismiss")));
                 const dismiss = () => {
                     onDismiss();
                     this.focus();
@@ -575,42 +742,74 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             this._focusCheckedOrFirst();
         }
         this._register(addDisposableListener(this.domNode, "keydown", e => {
-            if (e.key === "ArrowRight") {
+            if (e.key === "ArrowRight" && !e.isComposing) {
                 const focused = this._list.getFocus();
                 if (focused.length > 0) {
                     const element = this._list.element(focused[0]);
-                    if (element?.submenuActions?.length) {
+                    if (element?.submenuActions?.length || element?.hover?.expandable) {
                         EventHelper.stop(e, true);
                         const rowElement = this._getRowElement(focused[0]);
                         if (rowElement) {
                             this._showSubmenuForElement(element, rowElement);
-                            this._currentSubmenuWidget?.focus();
+                            if (this._currentSubmenuWidget) {
+                                this._currentSubmenuWidget.focus();
+                            } else {
+                                this._submenuContainer.focus();
+                            }
                         }
                     }
                 }
             }
         }));
-        if (this._filterInput) {
+        if (this._filterInput || this._options?.onType) {
             this._register(addDisposableListener(this.domNode, "keydown", e => {
-                if (this._filterInput && !isActiveElement(this._filterInput) && e.key.length === 1 && e.key !== " " && !e.ctrlKey && !e.metaKey && !e.altKey) {
-                    this._filterInput.focus();
-                    this._filterInput.value = e.key;
-                    this._filterText = e.key;
-                    this._applyOrUpdateFilter();
+                const target = e.target;
+                if ((this._options?.onType || this._options?.filterAsCombobox) && isHTMLElement(target) && (isEditableElement(target) || target.closest("button, a, [contenteditable=\"true\"], .action-list-submenu-panel"))) {
+                    return;
+                }
+                if ((!this._filterInput || !isActiveElement(this._filterInput)) && !e.isComposing && e.key.length === 1 && e.key !== " " && !e.ctrlKey && !e.metaKey && !e.altKey) {
                     e.preventDefault();
                     e.stopPropagation();
+                    if (this._filterInput) {
+                        this._filterInput.focus();
+                        this._filterInput.value = e.key;
+                        this._filterText = e.key;
+                        this._applyOrUpdateFilter();
+                    } else {
+                        this._options?.onType?.(e.key);
+                    }
                 }
             }));
         }
     }
     _toggleSection(section) {
-        if (( this._collapsedSections.has(section))) {
+        const expanding = ( this._collapsedSections.has(section));
+        if (expanding) {
             this._collapsedSections.delete(section);
         } else {
             this._collapsedSections.add(section);
+            const focusedItem = this.getFocusedElement();
+            if (focusedItem?.section === section && !focusedItem.isSectionToggle) {
+                const toggleIndex = this._visibleMenuItems.findIndex(item => item.section === section && item.isSectionToggle);
+                if (toggleIndex >= 0) {
+                    this._list.setFocus([toggleIndex]);
+                }
+            }
         }
         this._options?.onDidToggleSection?.(section, ( this._collapsedSections.has(section)));
         this._applyFilter();
+        if (expanding) {
+            this._revealFirstItemOfSection(section);
+        }
+    }
+    _revealFirstItemOfSection(section) {
+        for (let index = 0; index < this._list.length; index++) {
+            const item = this._list.element(index);
+            if (item.section === section && !item.isSectionToggle) {
+                this._list.reveal(index);
+                return;
+            }
+        }
     }
     _applyOrUpdateFilter() {
         if (!this._delegate.onFilter) {
@@ -629,7 +828,8 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             this._applyFilter(true);
         }).catch(() => {});
     }
-    _applyFilter(skipTextFilter = false, fireLayout = true) {
+    _applyFilter(skipTextFilter = false, fireLayout = true, focusItemId) {
+        this._itemMoveAnimation.clear();
         const filterLower = skipTextFilter ? "" : this._filterText.toLowerCase();
         const isFiltering = !skipTextFilter && filterLower.length > 0;
         const visible = [];
@@ -744,6 +944,8 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             this._recomputeGroupTitles(visible);
         }
         const filterInputHasFocus = this._filterInput && isActiveElement(this._filterInput);
+        const listHasFocus = isAncestorOfActiveElement(this._list.getHTMLElement());
+        this._visibleMenuItems = visible;
         this._list.splice(0, this._list.length, visible);
         if (fireLayout) {
             this._onDidRequestLayout.fire();
@@ -752,18 +954,21 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             this._filterInput?.focus();
             this._focusCheckedOrFirst();
         } else if (this._hasLaidOut) {
-            if (focusedItem) {
-                const focusedItemId = focusedItem.item?.id;
+            if (focusedItem || focusItemId) {
+                const focusedItemId = focusItemId ?? focusedItem?.item?.id;
                 if (focusedItemId) {
                     for (let i = 0; i < this._list.length; i++) {
                         const el = this._list.element(i);
                         if (el.item?.id === focusedItemId) {
                             this._list.setFocus([i]);
                             this._list.reveal(i);
-                            this._list.domFocus();
                             break;
                         }
                     }
+                    if (listHasFocus) {
+                        this._focusCheckedOrFirst();
+                        this._list.domFocus();
+                    }
                 }
             }
         }
@@ -780,9 +985,23 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
     get filterInput() {
         return this._filterInput;
     }
+    get closeAnimation() {
+        return this._options?.closeAnimation;
+    }
     focusCondition(element) {
         return !element.disabled && element.kind === ActionListItemKind.Action;
     }
+    _updateFilterActiveDescendant() {
+        if (!this._filterInput) {
+            return;
+        }
+        const [focused] = this._list.getFocus();
+        if (isActiveElement(this._filterInput) && focused !== undefined) {
+            this._filterInput.setAttribute("aria-activedescendant", this._list.getElementID(focused));
+        } else {
+            this._filterInput.removeAttribute("aria-activedescendant");
+        }
+    }
     focus() {
         if (this._filterInput && this._options?.focusFilterOnOpen) {
             this._filterInput.focus();
@@ -802,13 +1021,92 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         }
         return undefined;
     }
-    updateItems(items, focusItemId) {
+    showHoverForCheckedItem() {
+        const element = this._allMenuItems.find(item => item.kind === ActionListItemKind.Action && item.item?.checked) ?? (this._options?.persistentHover ? this.getFocusedElement() : undefined);
+        if (!element) {
+            return;
+        }
+        if (element.section && ( this._collapsedSections.has(element.section))) {
+            this._toggleSection(element.section);
+        }
+        const index = this._list.indexOf(element);
+        if (index >= 0) {
+            this._list.setFocus([index]);
+            this._list.reveal(index);
+            this._showHoverForElement(element, index);
+        }
+    }
+    updateItems(items, focusItemId, options) {
+        const expandedItemId = this._currentSubmenuElement?.item?.id;
+        const preservedItem = options?.preserveHover && expandedItemId ? items.find(item => item.item?.id === (focusItemId ?? expandedItemId)) : undefined;
+        const content = preservedItem?.hover?.content;
+        const preservedContent = typeof content === "function" ? content() : content;
+        const preserveHover = !this._currentSubmenuWidget && isHTMLElement(preservedContent) && this._submenuContainer.contains(preservedContent);
+        const previousRow = options?.animateItemMove && preserveHover && this._currentSubmenuElement ? this._getRowElement(this._list.indexOf(this._currentSubmenuElement))?.getBoundingClientRect() : undefined;
         this._allMenuItems = [...items];
-        this._applyFilter(false, false);
-        if (focusItemId !== undefined) {
+        if (preserveHover && preservedItem) {
+            this._currentSubmenuElement = preservedItem;
+            if (preservedItem.label && preservedItem.hover?.expandable) {
+                this._submenuContainer.setAttribute("aria-label", preservedItem.label);
+            }
+            if (preservedItem.section) {
+                this._collapsedSections.delete(preservedItem.section);
+            }
+        } else if ((options?.preserveHover || this._options?.persistentHover) && this._currentSubmenuElement && !this._allMenuItems.includes(this._currentSubmenuElement)) {
+            this._hideSubmenu();
+        }
+        const previousVisibleCount = this._visibleMenuItems.length;
+        const suppressHover = this._suppressHover;
+        this._suppressHover ||= preserveHover || (!this._currentSubmenuElement && !this._options?.persistentHover);
+        try {
+            this._applyFilter(false, false, preserveHover ? focusItemId ?? expandedItemId : undefined);
+        } finally {
+            this._suppressHover = suppressHover;
+        }
+        if (this._visibleMenuItems.length !== previousVisibleCount) {
+            this._onDidRequestLayout.fire();
+        }
+        if (preserveHover) {
+            this._layoutSubmenu?.();
+            if (previousRow && preservedItem) {
+                this._animateItemMove(preservedItem, previousRow);
+            }
+        } else if (focusItemId !== undefined) {
             this.focusItemById(focusItemId);
         }
     }
+    _animateItemMove(item, previous) {
+        if (this.domNode.closest(".monaco-reduce-motion") || getWindow(this.domNode).matchMedia("(prefers-reduced-motion: reduce)").matches) {
+            return;
+        }
+        const row = this._getRowElement(this._list.indexOf(item));
+        if (!row) {
+            return;
+        }
+        const current = row.getBoundingClientRect();
+        const bounds = this._list.getHTMLElement().getBoundingClientRect();
+        if (previous.top < bounds.top || previous.bottom > bounds.bottom || current.top < bounds.top || current.bottom > bounds.bottom || Math.abs(previous.top - current.top) < 1) {
+            return;
+        }
+        const zoom = getDomNodeZoomLevel(row);
+        const background = getComputedStyle(row).backgroundColor;
+        const frame = {
+            zIndex: 1,
+            backgroundColor: asCssVariable("menu.background"),
+            backgroundImage: `linear-gradient(${background}, ${background})`
+        };
+        const animation = row.animate([{
+            ...frame,
+            transform: `translateY(${(previous.top - current.top) / zoom}px)`
+        }, {
+            ...frame,
+            transform: "translateY(0)"
+        }], {
+            duration: 160,
+            easing: "cubic-bezier(0.2, 0.8, 0.2, 1)"
+        });
+        this._itemMoveAnimation.value = toDisposable(() => animation.cancel());
+    }
     focusItemById(itemId) {
         const focusItem = () => {
             for (let i = 0; i < this._list.length; i++) {
@@ -829,11 +1127,32 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         });
     }
     _focusCheckedOrFirst() {
+        const suppressHover = this._suppressHover;
         this._suppressHover = true;
         try {
+            const initialFocusItemId = this._initialFocusItemId;
+            this._initialFocusItemId = undefined;
+            if (initialFocusItemId) {
+                for (let i = 0; i < this._list.length; i++) {
+                    const element = this._list.element(i);
+                    if (this.focusCondition(element) && element.item?.id === initialFocusItemId) {
+                        this._list.setFocus([i]);
+                        this._list.reveal(i);
+                        return;
+                    }
+                }
+            }
+            const [focusedIndex] = this._list.getFocus();
+            if (focusedIndex !== undefined) {
+                const focusedElement = this._list.element(focusedIndex);
+                if (focusedElement && this.focusCondition(focusedElement)) {
+                    this._list.reveal(focusedIndex);
+                    return;
+                }
+            }
             for (let i = 0; i < this._list.length; i++) {
                 const element = this._list.element(i);
-                if (element.kind === ActionListItemKind.Action && element.item?.checked) {
+                if (this.focusCondition(element) && element.item?.checked) {
                     this._list.setFocus([i]);
                     this._list.reveal(i);
                     return;
@@ -845,7 +1164,10 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 this._list.reveal(focused[0]);
             }
         } finally {
-            this._suppressHover = false;
+            this._suppressHover = suppressHover;
+            if (this._options?.filterAsCombobox) {
+                this._updateFilterActiveDescendant();
+            }
         }
     }
     hide(didCancel) {
@@ -874,6 +1196,9 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         return this._actionLineHeight;
     }
     _getItemHeight(item) {
+        return this._itemHeightWith(item, this._options);
+    }
+    _itemHeightWith(item, options) {
         switch (item.kind) {
         case ActionListItemKind.Header:
             return this._headerLineHeight;
@@ -881,17 +1206,23 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             return item.label ? this._actionLineHeight : this._separatorLineHeight;
         default:
             if (item.inlineToggle) {
-                return this._options?.inlineToggleItemHeight ?? 70;
+                return options?.inlineToggleItemHeight ?? 70;
             }
-            return item.detail ? (this._options?.detailItemHeight ?? 48) : this._actionLineHeight;
+            return item.detail ? (options?.detailItemHeight ?? 48) : this._actionLineHeight;
         }
     }
     computeFullHeight() {
-        let fullHeight = 0;
-        for (const item of this._allMenuItems) {
-            fullHeight += this._getItemHeight(item);
+        return this.computeHeightForItems(this._allMenuItems, undefined, this._options);
+    }
+    computeHeightForItems(items, collapsedSections, options) {
+        let height = 0;
+        for (const item of items) {
+            if (collapsedSections && item.section && !item.isSectionToggle && ( collapsedSections.has(item.section))) {
+                continue;
+            }
+            height += this._itemHeightWith(item, options);
         }
-        return fullHeight;
+        return height;
     }
     computeListHeight() {
         const visibleCount = this._list.length;
@@ -906,9 +1237,11 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         this._hasLaidOut = true;
         this._list.layout(height, width);
         this.domNode.style.height = `${height}px`;
-        if (this._filterContainer && this._filterContainer.parentElement) {
-            this._filterContainer.parentElement.insertBefore(this._filterContainer, this.domNode);
+        const listParent = this.domNode.parentElement;
+        if (listParent && this._filterContainer?.parentElement === listParent) {
+            listParent.insertBefore(this._filterContainer, this.domNode);
         }
+        this._layoutSubmenu?.();
     }
     computeMaxWidth(minWidth) {
         const visibleCount = this._list.length;
@@ -916,7 +1249,6 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         const rawMaxWidthCap = this._options?.maxWidth ?? Number.POSITIVE_INFINITY;
         const maxWidthCap = Math.max(rawMaxWidthCap, effectiveMinWidth);
         const clamp = w => Math.min(Math.max(w, effectiveMinWidth), maxWidthCap);
-        let maxWidth = effectiveMinWidth;
         const totalItemCount = this._allMenuItems.length;
         if (totalItemCount >= 50) {
             return clamp(380);
@@ -926,40 +1258,43 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             for (let i = 0; i < visibleCount; i++) {
                 visibleItems.push(this._list.element(i));
             }
-            const allItems = [...this._allMenuItems];
-            this._list.splice(0, visibleCount, allItems);
-            let allItemsHeight = 0;
-            for (const item of allItems) {
-                allItemsHeight += this._getItemHeight(item);
-            }
-            this._list.layout(allItemsHeight);
-            const itemWidths = [];
-            for (let i = 0; i < allItems.length; i++) {
-                const element = this._getRowElement(i);
-                if (element) {
-                    element.style.width = "auto";
-                    const width = element.getBoundingClientRect().width;
-                    element.style.width = "";
-                    itemWidths.push(width + this._computeToolbarWidth(allItems[i]));
+            const height = this._list.renderHeight;
+            const scrollTop = this._list.scrollTop;
+            const focus = this._list.getFocus();
+            try {
+                const allItems = [...this._allMenuItems];
+                this._list.splice(0, visibleCount, allItems);
+                let allItemsHeight = 0;
+                for (const item of allItems) {
+                    allItemsHeight += this._getItemHeight(item);
+                }
+                this._list.layout(allItemsHeight);
+                const itemWidths = this._measureItemWidths(allItems);
+                return clamp(Math.max(...itemWidths));
+            } finally {
+                this._list.splice(0, this._list.length, visibleItems);
+                this._list.layout(height);
+                this._list.scrollTop = scrollTop;
+                const suppressHover = this._suppressHover;
+                this._suppressHover = true;
+                try {
+                    this._list.setFocus(focus);
+                } finally {
+                    this._suppressHover = suppressHover;
                 }
             }
-            maxWidth = clamp(Math.max(...itemWidths));
-            this._list.splice(0, allItems.length, visibleItems);
-            return maxWidth;
         }
-        const itemWidths = [];
+        const visibleItems = [];
         for (let i = 0; i < visibleCount; i++) {
-            const element = this._getRowElement(i);
-            if (element) {
-                element.style.width = "auto";
-                const width = element.getBoundingClientRect().width;
-                element.style.width = "";
-                itemWidths.push(width + this._computeToolbarWidth(this._list.element(i)));
-            }
+            visibleItems.push(this._list.element(i));
         }
+        const itemWidths = this._measureItemWidths(visibleItems);
         return clamp(Math.max(...itemWidths));
     }
     focusPrevious() {
+        if (this._focusFilterResult("previous")) {
+            return;
+        }
         if (this._filterInput && isActiveElement(this._filterInput)) {
             this._list.domFocus();
             const current = this._list.getFocus();
@@ -993,6 +1328,9 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         }
     }
     focusNext() {
+        if (this._focusFilterResult("next")) {
+            return;
+        }
         if (this._filterInput && isActiveElement(this._filterInput)) {
             this._list.domFocus();
             const current = this._list.getFocus();
@@ -1023,6 +1361,21 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             this._list.reveal(focused[0]);
         }
     }
+    _focusFilterResult(direction) {
+        if (!this._options?.filterAsCombobox || !this._filterInput || !isActiveElement(this._filterInput)) {
+            return false;
+        }
+        if (direction === "previous") {
+            this._list.focusPrevious(1, true, undefined, this.focusCondition);
+        } else {
+            this._list.focusNext(1, true, undefined, this.focusCondition);
+        }
+        const [focused] = this._list.getFocus();
+        if (focused !== undefined) {
+            this._list.reveal(focused);
+        }
+        return true;
+    }
     collapseFocusedSection() {
         const section = this._getFocusedSection();
         if (section && !( this._collapsedSections.has(section))) {
@@ -1076,6 +1429,15 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             return;
         }
         const element = e.elements[0];
+        if (element.standaloneToggle) {
+            this._list.setSelection([]);
+            const toggle = this._standaloneToggles.get(element);
+            if (toggle && !toggle.disabled) {
+                toggle.checked = !toggle.checked;
+                element.standaloneToggle.onChange(toggle.checked);
+            }
+            return;
+        }
         if (element.isSectionToggle && element.section) {
             this._list.setSelection([]);
             const section = element.section;
@@ -1107,6 +1469,11 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         const element = this._list.element(focusIndex);
         this._delegate.onFocus?.(element.item);
         if (!this._suppressHover) {
+            if (this._options?.persistentHover) {
+                this._cancelSubmenuShow();
+                this._resetSubmenuPointer();
+                this._list.reveal(focusIndex);
+            }
             this._showHoverForElement(element, focusIndex);
         }
     }
@@ -1128,6 +1495,33 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             }
         }
     }
+    _measureItemWidths(items) {
+        const rows = [];
+        for (let i = 0; i < items.length; i++) {
+            const element = this._getRowElement(i);
+            if (element) {
+                element.style.width = "auto";
+                rows.push({
+                    element,
+                    item: items[i]
+                });
+            }
+        }
+        try {
+            return ( rows.map((
+                {
+                    element,
+                    item
+                }
+            ) => element.getBoundingClientRect().width + (item.detail ? 0 : this._computeToolbarWidth(item))));
+        } finally {
+            for (const {
+                element
+            } of rows) {
+                element.style.width = "";
+            }
+        }
+    }
     _computeToolbarWidth(item) {
         let actionCount = item.toolbarActions?.length ?? 0;
         if (item.onRemove) {
@@ -1137,10 +1531,10 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             return 0;
         }
         const actionButtonWidth = 22;
-        return actionCount * actionButtonWidth + 6;
+        return actionCount * actionButtonWidth + 6 + 10;
     }
     _getRowElement(index) {
-        if (!this.domNode.isConnected) {
+        if (index < 0 || !this.domNode.isConnected) {
             return null;
         }
         return this.domNode.getRootNode().getElementById(this._list.getElementID(index));
@@ -1158,7 +1552,9 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             }
             return;
         }
-        this._hideSubmenu();
+        if (!this._options?.persistentHover) {
+            this._hideSubmenu();
+        }
     }
     _showSubmenuForItem(item) {
         const index = this._list.indexOf(item);
@@ -1173,11 +1569,42 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
         if (this._currentSubmenuElement === element) {
             return;
         }
-        this._submenuDisposables.clear();
         this._currentSubmenuElement = element;
         this._clearSubmenuContainer();
+        anchor.setAttribute("aria-expanded", "true");
+        this._expandedTrigger = anchor;
+        this._submenuPanelClassName = element.hover?.panelClassName;
+        if (this._submenuPanelClassName) {
+            this._submenuContainer.classList.add(this._submenuPanelClassName);
+        }
+        const preserveVerticalPosition = element.hover?.preserveVerticalPosition;
+        const content = preserveVerticalPosition ? $(".action-list-submenu-content") : this._submenuContainer;
+        const viewport = preserveVerticalPosition ? $(".action-list-submenu-viewport", undefined, content) : undefined;
+        const scrollbar = viewport ? this._submenuDisposables.add(( new DomScrollableElement(viewport, {
+            horizontal: ScrollbarVisibility.Hidden,
+            vertical: ScrollbarVisibility.Auto,
+            consumeMouseWheelIfScrollbarIsNeeded: true,
+            useShadows: false
+        }))) : undefined;
+        if (scrollbar && viewport) {
+            this._submenuContainer.appendChild(scrollbar.getDomNode());
+            this._submenuDisposables.add(
+                addDisposableListener(viewport, EventType.SCROLL, () => scrollbar.scanDomNode())
+            );
+            this._submenuDisposables.add(
+                addDisposableListener(this._submenuContainer, EventType.KEY_DOWN, e => {
+                    const event = ( new StandardKeyboardEvent(e));
+                    if (event.equals(KeyCode.PageDown) || event.equals(KeyCode.PageUp)) {
+                        EventHelper.stop(e, true);
+                        scrollbar.setScrollPosition({
+                            scrollTop: scrollbar.getScrollPosition().scrollTop + (event.equals(KeyCode.PageDown) ? 1 : -1) * viewport.clientHeight
+                        });
+                    }
+                })
+            );
+        }
         let hoverHeader;
-        const hoverContent = element.hover?.content;
+        const hoverContent = typeof element.hover?.content === "function" ? element.hover.content() : element.hover?.content;
         if (hoverContent) {
             if (isHTMLElement(hoverContent)) {
                 hoverHeader = hoverContent;
@@ -1206,20 +1633,26 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             if (element.submenuActions?.length) {
                 hoverHeader.classList.add("has-submenu");
             }
-            this._submenuContainer.appendChild(hoverHeader);
+            content.appendChild(hoverHeader);
         }
         const hasSubmenuActions = !!element.submenuActions?.length;
         this._submenuContainer.style.display = "";
         this._submenuContainer.style.position = "absolute";
-        this._submenuContainer.removeAttribute("role");
-        const anchorRect = anchor.getBoundingClientRect();
-        const parentRect = this.domNode.getBoundingClientRect();
+        if (element.hover?.expandable) {
+            this._submenuContainer.setAttribute("role", "dialog");
+            if (element.label) {
+                this._submenuContainer.setAttribute("aria-label", element.label);
+            }
+        } else {
+            this._submenuContainer.removeAttribute("role");
+        }
         const targetWindow = getWindow(this.domNode);
         let totalHeight = 0;
         let maxWidth = hoverHeader ? hoverHeader.offsetWidth : 0;
         if (hasSubmenuActions) {
             const submenuItems = [];
-            const submenuGroups = element.submenuActions.filter(a => a instanceof SubmenuAction);
+            const submenuActions = element.submenuActions;
+            const submenuGroups = submenuActions.filter(a => a instanceof SubmenuAction);
             const groupsWithActions = submenuGroups.filter(g => g.actions.length > 0);
             for (let gi = 0; gi < groupsWithActions.length; gi++) {
                 const group = groupsWithActions[gi];
@@ -1260,7 +1693,7 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                     });
                 }
             }
-            for (const action of element.submenuActions) {
+            for (const action of submenuActions) {
                 if (!(action instanceof SubmenuAction)) {
                     const extendedAction = action;
                     submenuItems.push({
@@ -1298,7 +1731,7 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 undefined,
                 undefined
             ));
-            this._submenuContainer.appendChild(submenuWidget.domNode);
+            content.appendChild(submenuWidget.domNode);
             this._currentSubmenuWidget = submenuWidget;
             submenuWidget.clearFocus();
             totalHeight = submenuWidget.computeListHeight();
@@ -1308,22 +1741,17 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             submenuWidget.layout(totalHeight, maxWidth);
             submenuWidget.domNode.style.width = `${maxWidth}px`;
             this._submenuDisposables.add(addDisposableListener(submenuWidget.domNode, "keydown", e => {
-                if (e.key === "ArrowLeft" || e.key === "Escape") {
+                if (e.key === "Escape") {
+                    EventHelper.stop(e, true);
+                    this._hideSubmenu();
+                    this.hide();
+                } else if (e.key === "ArrowLeft") {
                     EventHelper.stop(e, true);
                     this._hideSubmenu();
                     this._list.domFocus();
-                } else if (e.key === "Enter") {
+                } else if (e.key === "Enter" || e.key === " ") {
                     EventHelper.stop(e, true);
-                    const focused = submenuWidget.getFocusedElement();
-                    if (focused?.item) {
-                        focused.item.run();
-                        const parentItem = this._currentSubmenuElement?.item;
-                        this._hideSubmenu();
-                        if (parentItem) {
-                            this._delegate.onSelect(parentItem);
-                        }
-                        this.hide();
-                    }
+                    submenuWidget.acceptSelected();
                 } else if (e.key === "ArrowDown") {
                     EventHelper.stop(e, true);
                     submenuWidget.focusNext();
@@ -1333,47 +1761,129 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 }
             }));
         }
-        const viewportWidth = targetWindow.innerWidth;
-        const spaceRight = viewportWidth - anchorRect.right;
-        const spaceLeft = parentRect.left;
-        const panelWidth = maxWidth + 10;
-        const gap = 4;
-        if (spaceRight >= panelWidth || spaceRight >= spaceLeft) {
-            this._submenuContainer.style.left = `${parentRect.right - parentRect.left + gap}px`;
-        } else {
-            this._submenuContainer.style.left = `${-panelWidth - gap}px`;
-        }
-        const hoverHeaderHeight = hoverHeader ? hoverHeader.offsetHeight : 0;
-        const totalPanelHeight = totalHeight + hoverHeaderHeight;
-        const viewportHeight = targetWindow.innerHeight;
-        const anchorHeight = anchorRect.height;
-        let top = anchorRect.top - parentRect.top + (anchorHeight - totalPanelHeight) / 2;
-        const panelBottom = parentRect.top + top + totalPanelHeight;
-        if (panelBottom > viewportHeight) {
-            top -= (panelBottom - viewportHeight + 8);
-        }
-        if (parentRect.top + top < 0) {
-            top = -parentRect.top;
+        let openingPanelHeight;
+        let openingPanelTop;
+        const layout = () => {
+            const currentElement = this._currentSubmenuElement;
+            if (!currentElement || this._layoutSubmenu !== layout) {
+                return;
+            }
+            const index = this._list.indexOf(currentElement);
+            const row = index >= 0 ? this._getRowElement(index) : null;
+            const persistent = this._options?.persistentHover;
+            if (!row && (!persistent || !this._allMenuItems.includes(currentElement))) {
+                this._hideSubmenu();
+                return;
+            }
+            if (this._expandedTrigger !== row) {
+                if (this._expandedTrigger?.hasAttribute("aria-expanded")) {
+                    this._expandedTrigger.setAttribute("aria-expanded", "false");
+                }
+                this._expandedTrigger = row ?? undefined;
+            }
+            row?.setAttribute("aria-expanded", "true");
+            const parentRect = this.domNode.getBoundingClientRect();
+            const alignToParent = persistent || currentElement.hover?.alignToParent;
+            const edgeRect = alignToParent ? this.domNode.parentElement?.closest(".action-widget")?.getBoundingClientRect() ?? parentRect : parentRect;
+            const anchorRect = row?.getBoundingClientRect() ?? edgeRect;
+            const zoom = alignToParent || preserveVerticalPosition ? getDomNodeZoomLevel(this.domNode) : 1;
+            if (persistent) {
+                this._submenuContainer.style.width = `${edgeRect.width / zoom}px`;
+            }
+            const panelRect = this._submenuContainer.getBoundingClientRect();
+            const panelWidth = alignToParent ? panelRect.width : maxWidth + 10;
+            const spaceRight = targetWindow.innerWidth - (alignToParent ? edgeRect.right : anchorRect.right);
+            const spaceLeft = edgeRect.left;
+            const gap = alignToParent ? 0 : 4;
+            let showRight = spaceRight >= panelWidth || spaceRight >= spaceLeft;
+            if (persistent && this._submenuSide && (this._submenuSide === "right" ? spaceRight : spaceLeft) >= panelWidth) {
+                showRight = this._submenuSide === "right";
+            }
+            if (persistent) {
+                this._submenuSide = showRight ? "right" : "left";
+            }
+            const left = showRight ? edgeRect.right - parentRect.left + gap : edgeRect.left - parentRect.left - panelWidth - gap;
+            this._submenuContainer.style.left = `${left / zoom}px`;
+            const panelHeight = alignToParent || preserveVerticalPosition ? panelRect.height : totalHeight + (hoverHeader?.offsetHeight ?? 0);
+            if (preserveVerticalPosition) {
+                openingPanelHeight ??= panelHeight / zoom;
+            }
+            const anchorHeight = openingPanelHeight !== undefined ? openingPanelHeight * zoom : panelHeight;
+            let top = openingPanelTop !== undefined ? openingPanelTop * zoom : row ? anchorRect.top - parentRect.top + (anchorRect.height - anchorHeight) / 2 : panelRect.top - parentRect.top;
+            const panelBottom = parentRect.top + top + anchorHeight;
+            if (panelBottom > targetWindow.innerHeight) {
+                top -= panelBottom - targetWindow.innerHeight + 8;
+            }
+            if (parentRect.top + top < 0) {
+                top = -parentRect.top;
+            }
+            if (preserveVerticalPosition) {
+                openingPanelTop ??= top / zoom;
+            }
+            if (viewport && scrollbar) {
+                const chromeHeight = (panelRect.height - scrollbar.getDomNode().getBoundingClientRect().height) / zoom;
+                const availableHeight = Math.max(
+                    0,
+                    (targetWindow.innerHeight - parentRect.top - top - 8) / zoom - chromeHeight
+                );
+                viewport.style.height = `${Math.min(content.getBoundingClientRect().height / zoom, availableHeight)}px`;
+                scrollbar.scanDomNode();
+            }
+            this._submenuContainer.style.top = `${top / zoom}px`;
+        };
+        this._layoutSubmenu = layout;
+        layout();
+        if ((this._options?.persistentHover || element.hover?.alignToParent || preserveVerticalPosition) && this._currentSubmenuElement === element) {
+            const observer = this._submenuDisposables.add(
+                new DisposableResizeObserver("ActionListWidget.hoverPanel", layout, targetWindow)
+            );
+            this._submenuDisposables.add(
+                observer.observe(preserveVerticalPosition ? content : this._submenuContainer, {
+                    box: "border-box"
+                })
+            );
+            if (this._options?.persistentHover || preserveVerticalPosition) {
+                this._submenuDisposables.add(addDisposableListener(targetWindow, EventType.RESIZE, () => {
+                    this._cancelSubmenuShow();
+                    this._resetSubmenuPointer();
+                    layout();
+                }));
+            }
         }
-        this._submenuContainer.style.top = `${top}px`;
     }
     _hideSubmenu() {
         this._cancelSubmenuHide();
         this._cancelSubmenuShow();
-        this._submenuDisposables.clear();
-        this._currentSubmenuWidget = undefined;
         this._currentSubmenuElement = undefined;
+        this._submenuSide = undefined;
         this._clearSubmenuContainer();
         this._submenuContainer.style.display = "none";
     }
     _clearSubmenuContainer() {
+        this._layoutSubmenu = undefined;
+        this._resetSubmenuPointer();
         if (this._submenuContainer.contains(getActiveElement())) {
             this._list.domFocus();
         }
+        this._submenuDisposables.clear();
+        this._currentSubmenuWidget = undefined;
+        if (this._submenuPanelClassName) {
+            this._submenuContainer.classList.remove(this._submenuPanelClassName);
+            this._submenuPanelClassName = undefined;
+        }
+        this._submenuContainer.removeAttribute("role");
+        this._submenuContainer.removeAttribute("aria-label");
+        if (this._expandedTrigger?.hasAttribute("aria-expanded")) {
+            this._expandedTrigger.setAttribute("aria-expanded", "false");
+        }
+        this._expandedTrigger = undefined;
         clearNode(this._submenuContainer);
     }
     _scheduleSubmenuHide() {
         this._cancelSubmenuHide();
+        if (this._options?.persistentHover) {
+            return;
+        }
         this._submenuHideTimeout = setTimeout(() => {
             this._hideSubmenu();
         }, 300);
@@ -1384,15 +1894,45 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
             this._submenuHideTimeout = undefined;
         }
     }
-    _scheduleSubmenuShow(element, index) {
+    _scheduleSubmenuShow(element, pointer) {
         this._cancelSubmenuShow();
-        this._submenuShowTimeout = setTimeout(() => {
+        let delay = 500;
+        if (this._options?.persistentHover) {
+            delay = 0;
+            const origin = this._submenuPointerOrigin;
+            if (origin && pointer.clientX !== origin.x && this._currentSubmenuElement && new SafeTriangle(origin.x, origin.y, this._submenuContainer).contains(pointer.clientX, pointer.clientY)) {
+                const now = Date.now();
+                this._submenuPointerGraceDeadline ??= now + 200;
+                delay = Math.max(0, this._submenuPointerGraceDeadline - now);
+            }
+        }
+        const show = () => {
             this._submenuShowTimeout = undefined;
-            const rowElement = typeof index === "number" ? this._getRowElement(index) : null;
+            const index = this._list.indexOf(element);
+            const rowElement = index >= 0 ? this._getRowElement(index) : null;
             if (rowElement) {
                 this._showSubmenuForElement(element, rowElement);
+                if (this._options?.persistentHover) {
+                    this._updateSubmenuPointer(pointer);
+                }
             }
-        }, 500);
+        };
+        if (delay === 0) {
+            show();
+        } else {
+            this._submenuShowTimeout = setTimeout(show, delay);
+        }
+    }
+    _updateSubmenuPointer(event) {
+        this._submenuPointerOrigin = {
+            x: event.clientX,
+            y: event.clientY
+        };
+        this._submenuPointerGraceDeadline = undefined;
+    }
+    _resetSubmenuPointer() {
+        this._submenuPointerOrigin = undefined;
+        this._submenuPointerGraceDeadline = undefined;
     }
     _cancelSubmenuShow() {
         if (this._submenuShowTimeout !== undefined) {
@@ -1412,20 +1952,27 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 return;
             }
             const hasPanel = !!(element.submenuActions?.length || element.hover?.content);
-            if (hasPanel) {
+            const suppressHover = this._suppressHover;
+            if (hasPanel || this._options?.persistentHover) {
                 this._suppressHover = true;
             }
-            this._list.setFocus(typeof e.index === "number" ? [e.index] : []);
-            if (hasPanel) {
-                this._suppressHover = false;
+            try {
+                this._list.setFocus(typeof e.index === "number" ? [e.index] : []);
+            } finally {
+                this._suppressHover = suppressHover;
             }
             if (hasPanel) {
                 if (this._currentSubmenuElement === element) {
                     this._cancelSubmenuHide();
                     this._cancelSubmenuShow();
+                    if (this._options?.persistentHover) {
+                        this._updateSubmenuPointer(e.browserEvent);
+                    }
                 } else {
-                    this._hideSubmenu();
-                    this._scheduleSubmenuShow(element, e.index);
+                    if (!this._options?.persistentHover) {
+                        this._hideSubmenu();
+                    }
+                    this._scheduleSubmenuShow(element, e.browserEvent);
                 }
                 return;
             }
@@ -1433,7 +1980,9 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 this._cancelSubmenuHide();
             } else {
                 this._cancelSubmenuShow();
-                this._hideSubmenu();
+                if (!this._options?.persistentHover) {
+                    this._hideSubmenu();
+                }
             }
             if (this._delegate.onHover && !element.disabled && element.kind === ActionListItemKind.Action && this._currentSubmenuElement !== element) {
                 const result = await this._delegate.onHover(element.item, this.cts.token);
@@ -1451,8 +2000,10 @@ let ActionListWidget = ActionListWidget_1 = class ActionListWidget extends Dispo
                 this._cancelSubmenuHide();
                 this._cancelSubmenuShow();
             } else {
-                this._hideSubmenu();
-                this._scheduleSubmenuShow(element, e.index);
+                if (!this._options?.persistentHover) {
+                    this._hideSubmenu();
+                }
+                this._scheduleSubmenuShow(element, e.browserEvent);
             }
         }
     }
@@ -1479,7 +2030,16 @@ let ActionList = class ActionList extends Disposable {
     get filterInput() {
         return this._widget.filterInput;
     }
+    get closeAnimation() {
+        return this._widget.closeAnimation;
+    }
+    get widgetClassName() {
+        return this._widgetClassName;
+    }
     get anchorPosition() {
+        if (this._preferredAnchorPosition !== undefined) {
+            return this._preferredAnchorPosition;
+        }
         if (this._showAbove === undefined) {
             return undefined;
         }
@@ -1503,6 +2063,9 @@ let ActionList = class ActionList extends Disposable {
         this._lastMinWidth = 0;
         this._hasLaidOut = false;
         this._anchor = anchor;
+        this._preferredAnchorPosition = options?.anchorPosition;
+        this._useFullHeight = options?.useFullHeight ?? false;
+        this._widgetClassName = options?.widgetClassName;
         this._widget = this._register(instantiationService.createInstance(
             ActionListWidget,
             user,
@@ -1522,9 +2085,14 @@ let ActionList = class ActionList extends Disposable {
     focus() {
         this._widget.focus();
     }
-    hide(didCancel) {
+    showHoverForCheckedItem() {
+        this._widget.showHoverForCheckedItem();
+    }
+    hide(didCancel, hideContextView = true) {
         this._widget.hide(didCancel);
-        this._contextViewService.hideContextView();
+        if (hideContextView) {
+            this._contextViewService.hideContextView();
+        }
     }
     clearFilter() {
         return this._widget.clearFilter();
@@ -1547,8 +2115,11 @@ let ActionList = class ActionList extends Disposable {
     acceptSelected(preview) {
         this._widget.acceptSelected(preview);
     }
-    updateItems(items, focusItemId) {
-        this._widget.updateItems(items, focusItemId);
+    updateItems(items, focusItemId, options) {
+        this._widget.updateItems(items, focusItemId, options);
+    }
+    computeHeightForItems(items, collapsedSections, options) {
+        return this._widget.computeHeightForItems(items, collapsedSections, options);
     }
     focusItemById(itemId) {
         this._widget.focusItemById(itemId);
@@ -1566,14 +2137,14 @@ let ActionList = class ActionList extends Disposable {
         return toPixels(style.paddingTop) + toPixels(style.paddingBottom) + toPixels(style.borderTopWidth) + toPixels(style.borderBottomWidth);
     }
     computeHeight() {
-        const listHeight = this._widget.computeListHeight();
+        const listHeight = this._fixedContentHeight ?? this._widget.computeListHeight();
         const filterHeight = this._widget.filterContainer ? 36 : 0;
         const footerHeight = this._widget.footerContainer ? 32 : 0;
         const headerHeight = this._widget.headerContainer ? this._widget.headerContainer.offsetHeight || 36 : 0;
         const chromeHeight = filterHeight + footerHeight + headerHeight;
         const targetWindow = getWindow(this.domNode);
         let availableHeight;
-        if (this.hasDynamicHeight()) {
+        if (this.hasDynamicHeight() || this._preferredAnchorPosition !== undefined) {
             const viewportHeight = targetWindow.innerHeight;
             const anchorRect = getAnchorRect(this._anchor);
             const anchorTopInViewport = anchorRect.top - targetWindow.pageYOffset;
@@ -1581,8 +2152,8 @@ let ActionList = class ActionList extends Disposable {
             const spaceBelow = viewportHeight - anchorTopInViewport - anchorRect.height - bottomGap;
             const spaceAbove = anchorTopInViewport;
             if (this._showAbove === undefined) {
-                const fullHeight = chromeHeight + this._widget.computeFullHeight();
-                this._showAbove = fullHeight > spaceBelow && spaceAbove > spaceBelow;
+                const fullHeight = this._fixedContentHeight ?? this._widget.computeFullHeight();
+                this._showAbove = this._preferredAnchorPosition !== undefined ? this._preferredAnchorPosition === AnchorPosition.ABOVE : (chromeHeight + fullHeight > spaceBelow && spaceAbove > spaceBelow);
             }
             availableHeight = Math.max(
                 0,
@@ -1594,8 +2165,13 @@ let ActionList = class ActionList extends Disposable {
             const widgetTop = this.domNode.getBoundingClientRect().top;
             availableHeight = widgetTop > 0 ? windowHeight - widgetTop - padding : windowHeight * 0.7;
         }
-        const viewportMaxHeight = Math.floor(targetWindow.innerHeight * 0.6);
+        const viewportMaxHeight = this._useFullHeight ? targetWindow.innerHeight : Math.floor(targetWindow.innerHeight * 0.6);
         const actionLineHeight = this._widget.lineHeight;
+        if (this._preferredAnchorPosition !== undefined) {
+            const maxHeight = Math.min(availableHeight, viewportMaxHeight);
+            const height = Math.min(listHeight + chromeHeight, Math.max(0, maxHeight));
+            return Math.max(0, height - chromeHeight);
+        }
         const maxHeight = Math.min(
             Math.max(availableHeight, actionLineHeight * 3 + chromeHeight),
             viewportMaxHeight
@@ -1603,9 +2179,12 @@ let ActionList = class ActionList extends Disposable {
         const height = Math.min(listHeight + chromeHeight, maxHeight);
         return height - chromeHeight;
     }
-    layout(minWidth) {
+    layout(minWidth, fixedContentHeight) {
         this._hasLaidOut = true;
         this._lastMinWidth = minWidth;
+        if (fixedContentHeight !== undefined) {
+            this._fixedContentHeight = fixedContentHeight;
+        }
         const listHeight = this.computeHeight();
         this._widget.layout(listHeight);
         const computedWidth = this._widget.computeMaxWidth(minWidth);