@codingame/monaco-vscode-api 23.2.2 → 24.1.0

package/vscode/src/vs/platform/quickinput/browser/quickInputController.js

@@ -11,6 +11,7 @@ import { Emitter, Event } from '../../../base/common/event.js';
 import { Disposable, dispose } from '../../../base/common/lifecycle.js';
 import Severity$1 from '../../../base/common/severity.js';
 import { isString } from '../../../base/common/types.js';
+import { isModifierKey } from '../../../base/common/keyCodes.js';
 import { localize } from '../../../nls.js';
 import { QuickInputHideReason, QuickPickFocus } from '../common/quickInput.js';
 import { QuickInputBox } from './quickInputBox.js';
@@ -109,7 +110,7 @@ let QuickInputController = class QuickInputController extends Disposable {
         const rightActionBar = this._register(( new ActionBar(titleBar, { hoverDelegate: this.options.hoverDelegate })));
         rightActionBar.domNode.classList.add('quick-input-right-action-bar');
         const headerContainer = append(container, $('.quick-input-header'));
-        const checkAll = this._register(( new TriStateCheckbox(( localize(2010, "Toggle all checkboxes")), false, { ...defaultCheckboxStyles, size: 15 })));
+        const checkAll = this._register(( new TriStateCheckbox(( localize(2023, "Toggle all checkboxes")), false, { ...defaultCheckboxStyles, size: 15 })));
         append(headerContainer, checkAll.domNode);
         this._register(checkAll.onChange(() => {
             const checked = checkAll.checked;
@@ -128,21 +129,21 @@ let QuickInputController = class QuickInputController extends Disposable {
         const visibleCountContainer = append(filterContainer, $('.quick-input-visible-count'));
         visibleCountContainer.setAttribute('aria-live', 'polite');
         visibleCountContainer.setAttribute('aria-atomic', 'true');
-        const visibleCount = this._register(( new CountBadge(visibleCountContainer, { countFormat: ( localize(2011, "{0} Results")) }, this.styles.countBadge)));
+        const visibleCount = this._register(( new CountBadge(visibleCountContainer, { countFormat: ( localize(2024, "{0} Results")) }, this.styles.countBadge)));
         const countContainer = append(filterContainer, $('.quick-input-count'));
         countContainer.setAttribute('aria-live', 'polite');
-        const count = this._register(( new CountBadge(countContainer, { countFormat: ( localize(2012, "{0} Selected")) }, this.styles.countBadge)));
+        const count = this._register(( new CountBadge(countContainer, { countFormat: ( localize(2025, "{0} Selected")) }, this.styles.countBadge)));
         const inlineActionBar = this._register(( new ActionBar(headerContainer, { hoverDelegate: this.options.hoverDelegate })));
         inlineActionBar.domNode.classList.add('quick-input-inline-action-bar');
         const okContainer = append(headerContainer, $('.quick-input-action'));
         const ok = this._register(( new Button(okContainer, this.styles.button)));
-        ok.label = ( localize(2013, "OK"));
+        ok.label = ( localize(2026, "OK"));
         this._register(ok.onDidClick(e => {
             this.onDidAcceptEmitter.fire();
         }));
         const customButtonContainer = append(headerContainer, $('.quick-input-action'));
         const customButton = this._register(( new Button(customButtonContainer, { ...this.styles.button, supportIcons: true })));
-        customButton.label = ( localize(2014, "Custom"));
+        customButton.label = ( localize(2027, "Custom"));
         this._register(customButton.onDidClick(e => {
             this.onDidCustomEmitter.fire();
         }));
@@ -157,7 +158,13 @@ let QuickInputController = class QuickInputController extends Disposable {
         inputBox.setAttribute('aria-controls', listId);
         this._register(list.onDidChangeFocus(() => {
             if (inputBox.hasFocus()) {
-                inputBox.setAttribute('aria-activedescendant', list.getActiveDescendant() ?? '');
+                const activeDescendant = list.getActiveDescendant();
+                if (activeDescendant) {
+                    inputBox.setAttribute('aria-activedescendant', activeDescendant);
+                }
+                else {
+                    inputBox.removeAttribute('aria-activedescendant');
+                }
             }
         }));
         this._register(list.onChangedAllVisibleChecked(checked => {
@@ -183,7 +190,13 @@ let QuickInputController = class QuickInputController extends Disposable {
         const tree = this._register(this.instantiationService.createInstance(QuickInputTreeController, container, this.options.hoverDelegate));
         this._register(tree.tree.onDidChangeFocus(() => {
             if (inputBox.hasFocus()) {
-                inputBox.setAttribute('aria-activedescendant', tree.getActiveDescendant() ?? '');
+                const activeDescendant = tree.getActiveDescendant();
+                if (activeDescendant) {
+                    inputBox.setAttribute('aria-activedescendant', activeDescendant);
+                }
+                else {
+                    inputBox.removeAttribute('aria-activedescendant');
+                }
             }
         }));
         this._register(tree.onLeave(() => {
@@ -223,12 +236,14 @@ let QuickInputController = class QuickInputController extends Disposable {
             this.endOfQuickInputBoxContext.set(false);
             this.previousFocusElement = undefined;
         }));
-        this._register(inputBox.onKeyDown(_ => {
+        this._register(inputBox.onKeyDown(e => {
             const value = this.getUI().inputBox.isSelectionAtEnd();
             if (this.endOfQuickInputBoxContext.get() !== value) {
                 this.endOfQuickInputBoxContext.set(value);
             }
-            inputBox.removeAttribute('aria-activedescendant');
+            if (!isModifierKey(e.keyCode)) {
+                inputBox.removeAttribute('aria-activedescendant');
+            }
         }));
         this._register(addDisposableListener(container, EventType.FOCUS, (e) => {
             inputBox.setFocus();
@@ -236,7 +251,8 @@ let QuickInputController = class QuickInputController extends Disposable {
         this.dndController = this._register(this.instantiationService.createInstance(QuickInputDragAndDropController, this._container, container, [
             {
                 node: titleBar,
-                includeChildren: true
+                includeChildren: true,
+                excludeNodes: [leftActionBar.domNode, rightActionBar.domNode]
             },
             {
                 node: headerContainer,
@@ -551,7 +567,7 @@ let QuickInputController = class QuickInputController extends Disposable {
         ui.ignoreFocusOut = false;
         ui.inputBox.toggles = undefined;
         const backKeybindingLabel = this.options.backKeybindingLabel();
-        backButton.tooltip = backKeybindingLabel ? ( localize(2015, "Back ({0})", backKeybindingLabel)) : ( localize(2016, "Back"));
+        backButton.tooltip = backKeybindingLabel ? ( localize(2028, "Back ({0})", backKeybindingLabel)) : ( localize(2029, "Back"));
         ui.container.style.display = '';
         this.updateLayout();
         this.dndController?.layoutContainer();
@@ -667,8 +683,8 @@ let QuickInputController = class QuickInputController extends Disposable {
     async back() {
         this.onDidTriggerButtonEmitter.fire(this.backButton);
     }
-    async cancel() {
-        this.hide();
+    async cancel(reason) {
+        this.hide(reason);
     }
     layout(dimension, titleBarOffset) {
         this.dimension = dimension;
@@ -835,9 +851,8 @@ let QuickInputDragAndDropController = class QuickInputDragAndDropController exte
             if (originEvent.detail !== 2) {
                 return;
             }
-            if (!( this._quickInputDragAreas.some(
-                ({ node, includeChildren }) => includeChildren ? isAncestor(originEvent.target, node) : originEvent.target === node
-            ))) {
+            const area = this._quickInputDragAreas.find(({ node, includeChildren }) => includeChildren ? isAncestor(originEvent.target, node) : originEvent.target === node);
+            if (!area || area.excludeNodes?.some(node => isAncestor(originEvent.target, node))) {
                 return;
             }
             this.dndViewState.set({ top: undefined, left: undefined, done: true }, undefined);
@@ -845,9 +860,8 @@ let QuickInputDragAndDropController = class QuickInputDragAndDropController exte
         this._register(addDisposableGenericMouseDownListener(dragArea, (e) => {
             const activeWindow = getWindow(this._layoutService.activeContainer);
             const originEvent = ( new StandardMouseEvent(activeWindow, e));
-            if (!( this._quickInputDragAreas.some(
-                ({ node, includeChildren }) => includeChildren ? isAncestor(originEvent.target, node) : originEvent.target === node
-            ))) {
+            const area = this._quickInputDragAreas.find(({ node, includeChildren }) => includeChildren ? isAncestor(originEvent.target, node) : originEvent.target === node);
+            if (!area || area.excludeNodes?.some(node => isAncestor(originEvent.target, node))) {
                 return;
             }
             const dragAreaRect = this._quickInputContainer.getBoundingClientRect();

package/vscode/src/vs/platform/quickinput/browser/quickInputList.js

@@ -190,7 +190,7 @@ class QuickInputItemDelegate {
 }
 class QuickInputAccessibilityProvider {
     getWidgetAriaLabel() {
-        return localize(2017, "Quick Input");
+        return localize(2030, "Quick Input");
     }
     getAriaLabel(element) {
         return element.separator?.label
@@ -290,6 +290,7 @@ let QuickPickItemElementRenderer = class QuickPickItemElementRenderer extends Ba
             checkbox = ( new Checkbox(element.saneLabel, element.checked, { ...defaultCheckboxStyles, size: 15 }));
             data.checkbox.value = checkbox;
             data.outerLabel.prepend(checkbox.domNode);
+            checkbox.domNode.tabIndex = -1;
         }
         else {
             checkbox.setTitle(element.saneLabel);

package/vscode/src/vs/platform/quickinput/browser/quickInputService.d.ts

@@ -3,7 +3,7 @@ import { IContextKeyService } from "../../contextkey/common/contextkey.service.j
 import { IInstantiationService } from "../../instantiation/common/instantiation.js";
 import { ILayoutService } from "../../layout/browser/layoutService.service.js";
 import { IQuickAccessController } from "../common/quickAccess.js";
-import { IInputBox, IInputOptions, IKeyMods, IPickOptions, IQuickInputButton, IQuickNavigateConfiguration, IQuickPick, IQuickPickItem, IQuickTree, IQuickTreeItem, IQuickWidget, QuickPickInput } from "../common/quickInput.js";
+import { IInputBox, IInputOptions, IKeyMods, IPickOptions, IQuickInputButton, IQuickNavigateConfiguration, IQuickPick, IQuickPickItem, IQuickTree, IQuickTreeItem, IQuickWidget, QuickInputHideReason, QuickPickInput } from "../common/quickInput.js";
 import { IQuickInputService } from "../common/quickInput.service.js";
 import { Themable } from "../../theme/common/themeService.js";
 import { IThemeService } from "../../theme/common/themeService.service.js";
@@ -54,7 +54,7 @@ export declare class QuickInputService extends Themable implements IQuickInputSe
     navigate(next: boolean, quickNavigate?: IQuickNavigateConfiguration): void;
     accept(keyMods?: IKeyMods): Promise<void>;
     back(): Promise<void>;
-    cancel(): Promise<void>;
+    cancel(reason?: QuickInputHideReason): Promise<void>;
     setAlignment(alignment: "top" | "center" | {
         top: number;
         left: number;

package/vscode/src/vs/platform/quickinput/browser/quickInputService.js

@@ -154,8 +154,8 @@ let QuickInputService = class QuickInputService extends Themable {
     back() {
         return this.controller.back();
     }
-    cancel() {
-        return this.controller.cancel();
+    cancel(reason) {
+        return this.controller.cancel(reason);
     }
     setAlignment(alignment) {
         this.controller.setAlignment(alignment);

package/vscode/src/vs/platform/quickinput/browser/quickInputUtils.js

@@ -1,5 +1,5 @@
 
-import { registerCss } from '@codingame/monaco-vscode-api/css';
+import { registerCss } from '../../../../../../css.js';
 import { reset, $, isEventLike, EventHelper, EventType } from '../../../base/browser/dom.js';
 import { createCSSRule } from '../../../base/browser/domStylesheets.js';
 import { asCSSUrl } from '../../../base/browser/cssValue.js';
@@ -60,7 +60,7 @@ function renderQuickInputDescription(description, container, actionHandler) {
             let title = node.title;
             if (!title && node.href.startsWith('command:')) {
                 title = ( localize(
-                    2018,
+                    2031,
                     "Click to execute command '{0}'",
                     node.href.substring('command:'.length)
                 ));

package/vscode/src/vs/platform/quickinput/browser/quickPickPin.d.ts

@@ -0,0 +1,12 @@
+import { IQuickPick, IQuickPickItem } from "../common/quickInput.js";
+import { IStorageService } from "../../storage/common/storage.service.js";
+import { IDisposable } from "../../../base/common/lifecycle.js";
+/**
+ * Initially, adds pin buttons to all @param quickPick items.
+ * When pinned, a copy of the item will be moved to the end of the pinned list and any duplicate within the pinned list will
+ * be removed if @param filterDupliates has been provided. Pin and pinned button events trigger updates to the underlying storage.
+ * Shows the quickpick once formatted.
+ */
+export declare function showWithPinnedItems(storageService: IStorageService, storageKey: string, quickPick: IQuickPick<IQuickPickItem, {
+    useSeparators: true;
+}>, filterDuplicates?: boolean): IDisposable;

package/vscode/src/vs/platform/quickinput/browser/quickPickPin.js

@@ -0,0 +1,108 @@
+
+import { Codicon } from '../../../base/common/codicons.js';
+import { localize } from '../../../nls.js';
+import { StorageScope, StorageTarget } from '../../storage/common/storage.js';
+import { ThemeIcon } from '../../../base/common/themables.js';
+import { DisposableStore } from '../../../base/common/lifecycle.js';
+
+const pinButtonClass = ThemeIcon.asClassName(Codicon.pin);
+const pinnedButtonClass = ThemeIcon.asClassName(Codicon.pinned);
+const buttonClasses = [pinButtonClass, pinnedButtonClass];
+function showWithPinnedItems(storageService, storageKey, quickPick, filterDuplicates) {
+    const itemsWithoutPinned = quickPick.items;
+    let itemsWithPinned = _formatPinnedItems(storageKey, quickPick, storageService, undefined);
+    const disposables = ( new DisposableStore());
+    disposables.add(quickPick.onDidTriggerItemButton(async (buttonEvent) => {
+        const expectedButton = buttonEvent.button.iconClass && buttonClasses.includes(buttonEvent.button.iconClass);
+        if (expectedButton) {
+            quickPick.items = itemsWithoutPinned;
+            itemsWithPinned = _formatPinnedItems(storageKey, quickPick, storageService, buttonEvent.item);
+            quickPick.items = quickPick.value ? itemsWithoutPinned : itemsWithPinned;
+        }
+    }));
+    disposables.add(quickPick.onDidChangeValue(async (value) => {
+        if (quickPick.items === itemsWithPinned && value) {
+            quickPick.items = itemsWithoutPinned;
+        }
+        else if (quickPick.items === itemsWithoutPinned && !value) {
+            quickPick.items = itemsWithPinned;
+        }
+    }));
+    quickPick.items = quickPick.value ? itemsWithoutPinned : itemsWithPinned;
+    quickPick.show();
+    return disposables;
+}
+function _formatPinnedItems(storageKey, quickPick, storageService, changedItem, filterDuplicates) {
+    const formattedItems = [];
+    let pinnedItems;
+    if (changedItem) {
+        pinnedItems = updatePinnedItems(storageKey, changedItem, storageService);
+    }
+    else {
+        pinnedItems = getPinnedItems(storageKey, storageService);
+    }
+    if (pinnedItems.length) {
+        formattedItems.push({ type: 'separator', label: ( localize(2032, 'pinned')) });
+    }
+    const pinnedIds = ( new Set());
+    for (const itemToFind of pinnedItems) {
+        const itemToPin = quickPick.items.find(item => itemsMatch(item, itemToFind));
+        if (itemToPin) {
+            const pinnedItemId = getItemIdentifier(itemToPin);
+            const pinnedItem = { ...itemToPin };
+            if (!( pinnedIds.has(pinnedItemId))) {
+                pinnedIds.add(pinnedItemId);
+                updateButtons(pinnedItem, false);
+                formattedItems.push(pinnedItem);
+            }
+        }
+    }
+    for (const item of quickPick.items) {
+        updateButtons(item, true);
+        formattedItems.push(item);
+    }
+    return formattedItems;
+}
+function getItemIdentifier(item) {
+    return item.type === 'separator' ? '' : item.id || `${item.label}${item.description}${item.detail}`;
+}
+function updateButtons(item, removePin) {
+    if (item.type === 'separator') {
+        return;
+    }
+    const newButtons = item.buttons?.filter(button => button.iconClass && !buttonClasses.includes(button.iconClass)) ?? [];
+    newButtons.unshift({
+        iconClass: removePin ? pinButtonClass : pinnedButtonClass,
+        tooltip: removePin ? ( localize(2033, "Pin command")) : ( localize(2034, "Pinned command")),
+        alwaysVisible: false
+    });
+    item.buttons = newButtons;
+}
+function itemsMatch(itemA, itemB) {
+    return getItemIdentifier(itemA) === getItemIdentifier(itemB);
+}
+function updatePinnedItems(storageKey, changedItem, storageService) {
+    const removePin = changedItem.buttons?.find(b => b.iconClass === pinnedButtonClass);
+    let items = getPinnedItems(storageKey, storageService);
+    if (removePin) {
+        items = items.filter(item => getItemIdentifier(item) !== getItemIdentifier(changedItem));
+    }
+    else {
+        items.push(changedItem);
+    }
+    storageService.store(storageKey, JSON.stringify(( items.map(formatPinnedItemForStorage))), StorageScope.WORKSPACE, StorageTarget.MACHINE);
+    return items;
+}
+function getPinnedItems(storageKey, storageService) {
+    const items = storageService.get(storageKey, StorageScope.WORKSPACE);
+    return items ? JSON.parse(items) : [];
+}
+function formatPinnedItemForStorage(item) {
+    return {
+        label: item.label,
+        description: item.description,
+        detail: item.detail,
+    };
+}
+
+export { showWithPinnedItems };

package/vscode/src/vs/platform/quickinput/browser/tree/quickInputTreeAccessibilityProvider.js

@@ -8,7 +8,7 @@ class QuickTreeAccessibilityProvider {
         this.onCheckedEvent = onCheckedEvent;
     }
     getWidgetAriaLabel() {
-        return localize(2022, "Quick Tree");
+        return localize(2035, "Quick Tree");
     }
     getAriaLabel(element) {
         return element.ariaLabel || ( [element.label, element.description]

package/vscode/src/vs/platform/quickinput/browser/tree/quickInputTreeController.d.ts

@@ -9,6 +9,7 @@ import { QuickInputTreeRenderer } from "./quickInputTreeRenderer.js";
 export declare class QuickInputTreeController extends Disposable {
     private readonly instantiationService;
     private readonly _renderer;
+    private readonly _checkboxStateHandler;
     private readonly _filter;
     private readonly _sorter;
     private readonly _tree;
@@ -45,7 +46,9 @@ export declare class QuickInputTreeController extends Disposable {
     setTreeData(treeData: readonly IQuickTreeItem[]): void;
     layout(maxHeight?: number): void;
     focus(what: QuickPickFocus): void;
-    registerOnOpenListener(): void;
+    registerCheckboxStateListeners(): void;
+    private updateCheckboxState;
+    registerOnDidChangeFocus(): void;
     getCheckedLeafItems(): IQuickTreeItem[];
     getActiveItems(): readonly IQuickTreeItem[];
     check(element: IQuickTreeItem, checked: boolean | "mixed"): void;

package/vscode/src/vs/platform/quickinput/browser/tree/quickInputTreeController.js

@@ -12,10 +12,31 @@ import { QuickInputTreeDelegate } from './quickInputDelegate.js';
 import { getParentNodeState } from './quickInputTree.js';
 import { QuickTreeAccessibilityProvider } from './quickInputTreeAccessibilityProvider.js';
 import { QuickInputTreeFilter } from './quickInputTreeFilter.js';
-import { QuickInputTreeRenderer } from './quickInputTreeRenderer.js';
+import { QuickInputCheckboxStateHandler, QuickInputTreeRenderer } from './quickInputTreeRenderer.js';
 import { QuickInputTreeSorter } from './quickInputTreeSorter.js';
+import { Checkbox } from '../../../../base/browser/ui/toggle/toggle.js';
 
 const $ = $$1;
+const flatHierarchyClass = 'quick-input-tree-flat';
+class QuickInputTreeIdentityProvider {
+    constructor() {
+        this._elementIds = ( new WeakMap());
+        this._counter = 0;
+    }
+    getId(element) {
+        let id = element.id;
+        if (id !== undefined) {
+            return id;
+        }
+        id = this._elementIds.get(element);
+        if (id !== undefined) {
+            return id;
+        }
+        id = `__generated_${this._counter++}`;
+        this._elementIds.set(element, id);
+        return id;
+    }
+}
 let QuickInputTreeController = class QuickInputTreeController extends Disposable {
     constructor(container, hoverDelegate, instantiationService) {
         super();
@@ -31,7 +52,8 @@ let QuickInputTreeController = class QuickInputTreeController extends Disposable
         this._onDidAccept = this._register(( new Emitter()));
         this.onDidAccept = this._onDidAccept.event;
         this._container = append(container, $('.quick-input-tree'));
-        this._renderer = this._register(this.instantiationService.createInstance(QuickInputTreeRenderer, hoverDelegate, this._onDidTriggerButton, this.onDidChangeCheckboxState));
+        this._checkboxStateHandler = this._register(( new QuickInputCheckboxStateHandler()));
+        this._renderer = this._register(this.instantiationService.createInstance(QuickInputTreeRenderer, hoverDelegate, this._onDidTriggerButton, this.onDidChangeCheckboxState, this._checkboxStateHandler));
         this._filter = this.instantiationService.createInstance(QuickInputTreeFilter);
         this._sorter = this._register(( new QuickInputTreeSorter()));
         this._tree = this._register(this.instantiationService.createInstance((WorkbenchObjectTree), 'QuickInputTree', this._container, ( new QuickInputTreeDelegate()), [this._renderer], {
@@ -46,9 +68,11 @@ let QuickInputTreeController = class QuickInputTreeController extends Disposable
             expandOnlyOnTwistieClick: true,
             disableExpandOnSpacebar: true,
             sorter: this._sorter,
-            filter: this._filter
+            filter: this._filter,
+            identityProvider: ( new QuickInputTreeIdentityProvider())
         }));
-        this.registerOnOpenListener();
+        this.registerCheckboxStateListeners();
+        this.registerOnDidChangeFocus();
     }
     get tree() {
         return this._tree;
@@ -86,9 +110,11 @@ let QuickInputTreeController = class QuickInputTreeController extends Disposable
         this._tree.refilter();
     }
     setTreeData(treeData) {
+        let hasNestedItems = false;
         const createTreeElement = (item) => {
             let children;
-            if (item.children) {
+            if (item.children && item.children.length > 0) {
+                hasNestedItems = true;
                 children = ( item.children.map(child => createTreeElement(child)));
                 item.checked = getParentNodeState(children);
             }
@@ -96,11 +122,14 @@ let QuickInputTreeController = class QuickInputTreeController extends Disposable
                 element: item,
                 children,
                 collapsible: !!children,
-                collapsed: item.collapsed ?? ObjectTreeElementCollapseState.PreserveOrExpanded
+                collapsed: item.collapsed ?
+                    ObjectTreeElementCollapseState.PreserveOrCollapsed :
+                    ObjectTreeElementCollapseState.PreserveOrExpanded
             };
         };
         const treeElements = ( treeData.map(item => createTreeElement(item)));
         this._tree.setChildren(null, treeElements);
+        this._container.classList.toggle(flatHierarchyClass, !hasNestedItems);
     }
     layout(maxHeight) {
         this._tree.getHTMLElement().style.maxHeight = maxHeight ? `${
@@ -171,7 +200,7 @@ let QuickInputTreeController = class QuickInputTreeController extends Disposable
                 return;
         }
     }
-    registerOnOpenListener() {
+    registerCheckboxStateListeners() {
         this._register(this._tree.onDidOpen(e => {
             const item = e.element;
             if (!item) {
@@ -185,40 +214,55 @@ let QuickInputTreeController = class QuickInputTreeController extends Disposable
                 this._onDidAccept.fire();
                 return;
             }
-            const newState = item.checked !== true;
-            if ((item.checked ?? false) === newState) {
+            const target = e.browserEvent?.target;
+            if (target && target.classList.contains(Checkbox.CLASS_NAME)) {
                 return;
             }
-            item.checked = newState;
-            this._tree.rerender(item);
-            const updateSet = ( new Set());
-            const toUpdate = [...this._tree.getNode(item).children];
-            while (toUpdate.length) {
-                const pop = toUpdate.shift();
-                if (pop?.element && !( updateSet.has(pop.element))) {
-                    updateSet.add(pop.element);
-                    if ((pop.element.checked ?? false) !== item.checked) {
-                        pop.element.checked = item.checked;
-                        this._tree.rerender(pop.element);
-                    }
-                    toUpdate.push(...pop.children);
+            this.updateCheckboxState(item, item.checked === true);
+        }));
+        this._register(this._checkboxStateHandler.onDidChangeCheckboxState(e => {
+            this.updateCheckboxState(e.item, e.checked === true);
+        }));
+    }
+    updateCheckboxState(item, newState) {
+        if ((item.checked ?? false) === newState) {
+            return;
+        }
+        item.checked = newState;
+        this._tree.rerender(item);
+        const updateSet = ( new Set());
+        const toUpdate = [...this._tree.getNode(item).children];
+        while (toUpdate.length) {
+            const pop = toUpdate.shift();
+            if (pop?.element && !( updateSet.has(pop.element))) {
+                updateSet.add(pop.element);
+                if ((pop.element.checked ?? false) !== item.checked) {
+                    pop.element.checked = item.checked;
+                    this._tree.rerender(pop.element);
                 }
+                toUpdate.push(...pop.children);
             }
-            let parent = this._tree.getParentElement(item);
-            while (parent) {
-                const parentChildren = [...this._tree.getNode(parent).children];
-                const newState = getParentNodeState(parentChildren);
-                if ((parent.checked ?? false) !== newState) {
-                    parent.checked = newState;
-                    this._tree.rerender(parent);
-                }
-                parent = this._tree.getParentElement(parent);
+        }
+        let parent = this._tree.getParentElement(item);
+        while (parent) {
+            const parentChildren = [...this._tree.getNode(parent).children];
+            const newState = getParentNodeState(parentChildren);
+            if ((parent.checked ?? false) !== newState) {
+                parent.checked = newState;
+                this._tree.rerender(parent);
             }
-            this._onDidChangeCheckboxState.fire({
-                item,
-                checked: item.checked ?? false
-            });
-            this._onDidCheckedLeafItemsChange.fire(this.getCheckedLeafItems());
+            parent = this._tree.getParentElement(parent);
+        }
+        this._onDidChangeCheckboxState.fire({
+            item,
+            checked: item.checked ?? false
+        });
+        this._onDidCheckedLeafItemsChange.fire(this.getCheckedLeafItems());
+    }
+    registerOnDidChangeFocus() {
+        this._register(this._tree.onDidChangeFocus(e => {
+            const item = this._tree.getFocus().findLast(item => item !== null);
+            this._tree.setSelection(item ? [item] : [], e.browserEvent);
         }));
     }
     getCheckedLeafItems() {

package/vscode/src/vs/platform/quickinput/browser/tree/quickInputTreeRenderer.d.ts

@@ -17,16 +17,25 @@ export interface IQuickTreeTemplateData {
     toDisposeElement: DisposableStore;
     toDisposeTemplate: DisposableStore;
 }
+export declare class QuickInputCheckboxStateHandler<T> extends Disposable {
+    private readonly _onDidChangeCheckboxState;
+    readonly onDidChangeCheckboxState: Event<{
+        item: T;
+        checked: boolean | "mixed";
+    }>;
+    setCheckboxState(node: T, checked: boolean | "mixed"): void;
+}
 export declare class QuickInputTreeRenderer<T extends IQuickTreeItem> extends Disposable implements ITreeRenderer<T, IQuickTreeFilterData, IQuickTreeTemplateData> {
     private readonly _hoverDelegate;
     private readonly _buttonTriggeredEmitter;
     private readonly onCheckedEvent;
+    private readonly _checkboxStateHandler;
     private readonly _themeService;
     static readonly ID = "quickInputTreeElement";
     templateId: string;
-    constructor(_hoverDelegate: IHoverDelegate | undefined, _buttonTriggeredEmitter: Emitter<IQuickTreeItemButtonEvent<T>>, onCheckedEvent: Event<IQuickTreeCheckboxEvent<T>>, _themeService: IThemeService);
+    constructor(_hoverDelegate: IHoverDelegate | undefined, _buttonTriggeredEmitter: Emitter<IQuickTreeItemButtonEvent<T>>, onCheckedEvent: Event<IQuickTreeCheckboxEvent<T>>, _checkboxStateHandler: QuickInputCheckboxStateHandler<T>, _themeService: IThemeService);
     renderTemplate(container: HTMLElement): IQuickTreeTemplateData;
-    renderElement(node: ITreeNode<T, IQuickTreeFilterData>, index: number, templateData: IQuickTreeTemplateData, _details?: ITreeElementRenderDetails): void;
+    renderElement(node: ITreeNode<T, IQuickTreeFilterData>, _index: number, templateData: IQuickTreeTemplateData, _details?: ITreeElementRenderDetails): void;
     disposeElement(_element: ITreeNode<T, IQuickTreeFilterData>, _index: number, templateData: IQuickTreeTemplateData, _details?: ITreeElementRenderDetails): void;
     disposeTemplate(templateData: IQuickTreeTemplateData): void;
 }

package/vscode/src/vs/platform/quickinput/browser/tree/quickInputTreeRenderer.js

@@ -5,7 +5,7 @@ import { $ as $$1, append, prepend } from '../../../../base/browser/dom.js';
 import { ActionBar } from '../../../../base/browser/ui/actionbar/actionbar.js';
 import { IconLabel } from '../../../../base/browser/ui/iconLabel/iconLabel.js';
 import { TriStateCheckbox } from '../../../../base/browser/ui/toggle/toggle.js';
-import { Event } from '../../../../base/common/event.js';
+import { Emitter, Event } from '../../../../base/common/event.js';
 import { Disposable, DisposableStore } from '../../../../base/common/lifecycle.js';
 import { URI } from '../../../../base/common/uri.js';
 import { defaultCheckboxStyles } from '../../../theme/browser/defaultStyles.js';
@@ -16,14 +16,25 @@ import { quickInputButtonToAction } from '../quickInputUtils.js';
 
 var QuickInputTreeRenderer_1;
 const $ = $$1;
+class QuickInputCheckboxStateHandler extends Disposable {
+    constructor() {
+        super(...arguments);
+        this._onDidChangeCheckboxState = this._register(( new Emitter()));
+        this.onDidChangeCheckboxState = this._onDidChangeCheckboxState.event;
+    }
+    setCheckboxState(node, checked) {
+        this._onDidChangeCheckboxState.fire({ item: node, checked });
+    }
+}
 let QuickInputTreeRenderer = class QuickInputTreeRenderer extends Disposable {
     static { QuickInputTreeRenderer_1 = this; }
     static { this.ID = 'quickInputTreeElement'; }
-    constructor(_hoverDelegate, _buttonTriggeredEmitter, onCheckedEvent, _themeService) {
+    constructor(_hoverDelegate, _buttonTriggeredEmitter, onCheckedEvent, _checkboxStateHandler, _themeService) {
         super();
         this._hoverDelegate = _hoverDelegate;
         this._buttonTriggeredEmitter = _buttonTriggeredEmitter;
         this.onCheckedEvent = onCheckedEvent;
+        this._checkboxStateHandler = _checkboxStateHandler;
         this._themeService = _themeService;
         this.templateId = QuickInputTreeRenderer_1.ID;
     }
@@ -57,19 +68,21 @@ let QuickInputTreeRenderer = class QuickInputTreeRenderer extends Disposable {
             toDisposeElement: ( new DisposableStore()),
         };
     }
-    renderElement(node, index, templateData, _details) {
+    renderElement(node, _index, templateData, _details) {
         const store = templateData.toDisposeElement;
         const quickTreeItem = node.element;
         if (quickTreeItem.pickable === false) {
             templateData.checkbox.domNode.style.display = 'none';
         }
         else {
-            templateData.checkbox.domNode.style.display = '';
-            templateData.checkbox.checked = quickTreeItem.checked ?? false;
-            store.add(Event.filter(this.onCheckedEvent, e => e.item === quickTreeItem)(e => templateData.checkbox.checked = e.checked));
+            const checkbox = templateData.checkbox;
+            checkbox.domNode.style.display = '';
+            checkbox.checked = quickTreeItem.checked ?? false;
+            store.add(Event.filter(this.onCheckedEvent, e => e.item === quickTreeItem)(e => checkbox.checked = e.checked));
             if (quickTreeItem.disabled) {
-                templateData.checkbox.disable();
+                checkbox.disable();
             }
+            store.add(checkbox.onChange((e) => this._checkboxStateHandler.setCheckboxState(quickTreeItem, checkbox.checked)));
         }
         if (quickTreeItem.iconPath) {
             const icon = isDark(this._themeService.getColorTheme().type) ? quickTreeItem.iconPath.dark : (quickTreeItem.iconPath.light ?? quickTreeItem.iconPath.dark);
@@ -122,7 +135,7 @@ let QuickInputTreeRenderer = class QuickInputTreeRenderer extends Disposable {
     }
 };
 QuickInputTreeRenderer = QuickInputTreeRenderer_1 = ( __decorate([
-    ( __param(3, IThemeService))
+    ( __param(4, IThemeService))
 ], QuickInputTreeRenderer));
 
-export { QuickInputTreeRenderer };
+export { QuickInputCheckboxStateHandler, QuickInputTreeRenderer };