@codingame/monaco-vscode-api 1.85.4 → 2.0.0-rework-ci.1

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

@@ -0,0 +1,676 @@
+import { onDidRegisterWindow, onWillUnregisterWindow, getWindow, EventType, addDisposableListener, append, createStyleSheet, addStandardDisposableListener, reset, isAncestorOfActiveElement, $ as $$1, trackFocus, isAncestor, EventHelper } from '../../../base/browser/dom.js';
+import { ActionBar } from '../../../base/browser/ui/actionbar/actionbar.js';
+import { Button } from '../../../base/browser/ui/button/button.js';
+import { CountBadge } from '../../../base/browser/ui/countBadge/countBadge.js';
+import { ProgressBar } from '../../../base/browser/ui/progressbar/progressbar.js';
+import { CancellationToken } from '../../../base/common/cancellation.js';
+import { Emitter, Event } from '../../../base/common/event.js';
+import { Disposable, dispose } from '../../../base/common/lifecycle.js';
+import Severity from '../../../base/common/severity.js';
+import { isString } from '../../../base/common/types.js';
+import { localizeWithPath } from '../../../nls.js';
+import { QuickInputHideReason } from '../common/quickInput.js';
+import { QuickInputBox } from './quickInputBox.js';
+import { QuickInputList, QuickInputListFocus } from './quickInputList.js';
+import { backButton, QuickPick, InputBox, QuickWidget } from './quickInput.js';
+import { mainWindow } from '../../../base/browser/window.js';
+const $ = $$1;
+class QuickInputController extends Disposable {
+    static { this.MAX_WIDTH = 600; }
+    constructor(options, themeService, layoutService) {
+        super();
+        this.options = options;
+        this.themeService = themeService;
+        this.layoutService = layoutService;
+        this.enabled = true;
+        this.onDidAcceptEmitter = this._register(( new Emitter()));
+        this.onDidCustomEmitter = this._register(( new Emitter()));
+        this.onDidTriggerButtonEmitter = this._register(( new Emitter()));
+        this.keyMods = { ctrlCmd: false, alt: false };
+        this.controller = null;
+        this.onShowEmitter = this._register(( new Emitter()));
+        this.onShow = this.onShowEmitter.event;
+        this.onHideEmitter = this._register(( new Emitter()));
+        this.onHide = this.onHideEmitter.event;
+        this.backButton = backButton;
+        this.idPrefix = options.idPrefix;
+        this.parentElement = options.container;
+        this.styles = options.styles;
+        this._register(Event.runAndSubscribe(onDidRegisterWindow, ({ window, disposables }) => this.registerKeyModsListeners(window, disposables), { window: mainWindow, disposables: this._store }));
+        this._register(onWillUnregisterWindow(window => {
+            if (this.ui && getWindow(this.ui.container) === window) {
+                this.reparentUI(this.layoutService.mainContainer);
+            }
+        }));
+    }
+    registerKeyModsListeners(window, disposables) {
+        const listener = (e) => {
+            this.keyMods.ctrlCmd = e.ctrlKey || e.metaKey;
+            this.keyMods.alt = e.altKey;
+        };
+        for (const event of [EventType.KEY_DOWN, EventType.KEY_UP, EventType.MOUSE_DOWN]) {
+            disposables.add(addDisposableListener(window, event, listener, true));
+        }
+    }
+    getUI(showInActiveContainer) {
+        if (this.ui) {
+            if (showInActiveContainer) {
+                if (this.parentElement.ownerDocument !== this.layoutService.activeContainer.ownerDocument) {
+                    this.reparentUI(this.layoutService.activeContainer);
+                }
+            }
+            return this.ui;
+        }
+        const container = append(this.parentElement, $('.quick-input-widget.show-file-icons'));
+        container.tabIndex = -1;
+        container.style.display = 'none';
+        const styleSheet = createStyleSheet(container);
+        const titleBar = append(container, $('.quick-input-titlebar'));
+        const actionBarOption = this.options.hoverDelegate ? { hoverDelegate: this.options.hoverDelegate } : undefined;
+        const leftActionBar = this._register(( new ActionBar(titleBar, actionBarOption)));
+        leftActionBar.domNode.classList.add('quick-input-left-action-bar');
+        const title = append(titleBar, $('.quick-input-title'));
+        const rightActionBar = this._register(( new ActionBar(titleBar, actionBarOption)));
+        rightActionBar.domNode.classList.add('quick-input-right-action-bar');
+        const headerContainer = append(container, $('.quick-input-header'));
+        const checkAll = append(headerContainer, $('input.quick-input-check-all'));
+        checkAll.type = 'checkbox';
+        checkAll.setAttribute('aria-label', ( localizeWithPath(
+            'vs/platform/quickinput/browser/quickInputController',
+            'quickInput.checkAll',
+            "Toggle all checkboxes"
+        )));
+        this._register(addStandardDisposableListener(checkAll, EventType.CHANGE, e => {
+            const checked = checkAll.checked;
+            list.setAllVisibleChecked(checked);
+        }));
+        this._register(addDisposableListener(checkAll, EventType.CLICK, e => {
+            if (e.x || e.y) {
+                inputBox.setFocus();
+            }
+        }));
+        const description2 = append(headerContainer, $('.quick-input-description'));
+        const inputContainer = append(headerContainer, $('.quick-input-and-message'));
+        const filterContainer = append(inputContainer, $('.quick-input-filter'));
+        const inputBox = this._register(( new QuickInputBox(filterContainer, this.styles.inputBox, this.styles.toggle)));
+        inputBox.setAttribute('aria-describedby', `${this.idPrefix}message`);
+        const visibleCountContainer = append(filterContainer, $('.quick-input-visible-count'));
+        visibleCountContainer.setAttribute('aria-live', 'polite');
+        visibleCountContainer.setAttribute('aria-atomic', 'true');
+        const visibleCount = ( new CountBadge(visibleCountContainer, { countFormat: ( localizeWithPath(
+            'vs/platform/quickinput/browser/quickInputController',
+            { key: 'quickInput.visibleCount', comment: ['This tells the user how many items are shown in a list of items to select from. The items can be anything. Currently not visible, but read by screen readers.'] },
+            "{0} Results"
+        )) }, this.styles.countBadge));
+        const countContainer = append(filterContainer, $('.quick-input-count'));
+        countContainer.setAttribute('aria-live', 'polite');
+        const count = ( new CountBadge(countContainer, { countFormat: ( localizeWithPath(
+            'vs/platform/quickinput/browser/quickInputController',
+            { key: 'quickInput.countSelected', comment: ['This tells the user how many items are selected in a list of items to select from. The items can be anything.'] },
+            "{0} Selected"
+        )) }, this.styles.countBadge));
+        const okContainer = append(headerContainer, $('.quick-input-action'));
+        const ok = this._register(( new Button(okContainer, this.styles.button)));
+        ok.label = ( localizeWithPath('vs/platform/quickinput/browser/quickInputController', 'ok', "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)));
+        customButton.label = ( localizeWithPath('vs/platform/quickinput/browser/quickInputController', 'custom', "Custom"));
+        this._register(customButton.onDidClick(e => {
+            this.onDidCustomEmitter.fire();
+        }));
+        const message = append(inputContainer, $(`#${this.idPrefix}message.quick-input-message`));
+        const progressBar = this._register(( new ProgressBar(container, this.styles.progressBar)));
+        progressBar.getContainer().classList.add('quick-input-progress');
+        const widget = append(container, $('.quick-input-html-widget'));
+        widget.tabIndex = -1;
+        const description1 = append(container, $('.quick-input-description'));
+        const listId = this.idPrefix + 'list';
+        const list = this._register(( new QuickInputList(container, listId, this.options, this.themeService)));
+        inputBox.setAttribute('aria-controls', listId);
+        this._register(list.onDidChangeFocus(() => {
+            inputBox.setAttribute('aria-activedescendant', list.getActiveDescendant() ?? '');
+        }));
+        this._register(list.onChangedAllVisibleChecked(checked => {
+            checkAll.checked = checked;
+        }));
+        this._register(list.onChangedVisibleCount(c => {
+            visibleCount.setCount(c);
+        }));
+        this._register(list.onChangedCheckedCount(c => {
+            count.setCount(c);
+        }));
+        this._register(list.onLeave(() => {
+            setTimeout(() => {
+                inputBox.setFocus();
+                if (this.controller instanceof QuickPick && this.controller.canSelectMany) {
+                    list.clearFocus();
+                }
+            }, 0);
+        }));
+        const focusTracker = trackFocus(container);
+        this._register(focusTracker);
+        this._register(addDisposableListener(container, EventType.FOCUS, e => {
+            if (isAncestor(e.relatedTarget, container)) {
+                return;
+            }
+            this.previousFocusElement = e.relatedTarget instanceof HTMLElement ? e.relatedTarget : undefined;
+        }, true));
+        this._register(focusTracker.onDidBlur(() => {
+            if (!this.getUI().ignoreFocusOut && !this.options.ignoreFocusOut()) {
+                this.hide(QuickInputHideReason.Blur);
+            }
+            this.previousFocusElement = undefined;
+        }));
+        this._register(addDisposableListener(container, EventType.FOCUS, (e) => {
+            inputBox.setFocus();
+        }));
+        this._register(addStandardDisposableListener(container, EventType.KEY_DOWN, (event) => {
+            if (isAncestor(event.target, widget)) {
+                return;
+            }
+            switch (event.keyCode) {
+                case 3 :
+                    EventHelper.stop(event, true);
+                    if (this.enabled) {
+                        this.onDidAcceptEmitter.fire();
+                    }
+                    break;
+                case 9 :
+                    EventHelper.stop(event, true);
+                    this.hide(QuickInputHideReason.Gesture);
+                    break;
+                case 2 :
+                    if (!event.altKey && !event.ctrlKey && !event.metaKey) {
+                        const selectors = [
+                            '.quick-input-list .monaco-action-bar .always-visible',
+                            '.quick-input-list-entry:hover .monaco-action-bar',
+                            '.monaco-list-row.focused .monaco-action-bar'
+                        ];
+                        if (container.classList.contains('show-checkboxes')) {
+                            selectors.push('input');
+                        }
+                        else {
+                            selectors.push('input[type=text]');
+                        }
+                        if (this.getUI().list.isDisplayed()) {
+                            selectors.push('.monaco-list');
+                        }
+                        if (this.getUI().message) {
+                            selectors.push('.quick-input-message a');
+                        }
+                        if (this.getUI().widget) {
+                            if (isAncestor(event.target, this.getUI().widget)) {
+                                break;
+                            }
+                            selectors.push('.quick-input-html-widget');
+                        }
+                        const stops = container.querySelectorAll(selectors.join(', '));
+                        if (event.shiftKey && event.target === stops[0]) {
+                            EventHelper.stop(event, true);
+                            list.clearFocus();
+                        }
+                        else if (!event.shiftKey && isAncestor(event.target, stops[stops.length - 1])) {
+                            EventHelper.stop(event, true);
+                            stops[0].focus();
+                        }
+                    }
+                    break;
+                case 10 :
+                    if (event.ctrlKey) {
+                        EventHelper.stop(event, true);
+                        this.getUI().list.toggleHover();
+                    }
+                    break;
+            }
+        }));
+        this.ui = {
+            container,
+            styleSheet,
+            leftActionBar,
+            titleBar,
+            title,
+            description1,
+            description2,
+            widget,
+            rightActionBar,
+            checkAll,
+            inputContainer,
+            filterContainer,
+            inputBox,
+            visibleCountContainer,
+            visibleCount,
+            countContainer,
+            count,
+            okContainer,
+            ok,
+            message,
+            customButtonContainer,
+            customButton,
+            list,
+            progressBar,
+            onDidAccept: this.onDidAcceptEmitter.event,
+            onDidCustom: this.onDidCustomEmitter.event,
+            onDidTriggerButton: this.onDidTriggerButtonEmitter.event,
+            ignoreFocusOut: false,
+            keyMods: this.keyMods,
+            show: controller => this.show(controller),
+            hide: () => this.hide(),
+            setVisibilities: visibilities => this.setVisibilities(visibilities),
+            setEnabled: enabled => this.setEnabled(enabled),
+            setContextKey: contextKey => this.options.setContextKey(contextKey),
+            linkOpenerDelegate: content => this.options.linkOpenerDelegate(content)
+        };
+        this.updateStyles();
+        return this.ui;
+    }
+    reparentUI(container) {
+        if (this.ui) {
+            this.parentElement = container;
+            append(this.parentElement, this.ui.container);
+        }
+    }
+    pick(picks, options = {}, token = CancellationToken.None) {
+        return ( new Promise((doResolve, reject) => {
+            let resolve = (result) => {
+                resolve = doResolve;
+                options.onKeyMods?.(input.keyMods);
+                doResolve(result);
+            };
+            if (token.isCancellationRequested) {
+                resolve(undefined);
+                return;
+            }
+            const input = this.createQuickPick();
+            let activeItem;
+            const disposables = [
+                input,
+                input.onDidAccept(() => {
+                    if (input.canSelectMany) {
+                        resolve(input.selectedItems.slice());
+                        input.hide();
+                    }
+                    else {
+                        const result = input.activeItems[0];
+                        if (result) {
+                            resolve(result);
+                            input.hide();
+                        }
+                    }
+                }),
+                input.onDidChangeActive(items => {
+                    const focused = items[0];
+                    if (focused && options.onDidFocus) {
+                        options.onDidFocus(focused);
+                    }
+                }),
+                input.onDidChangeSelection(items => {
+                    if (!input.canSelectMany) {
+                        const result = items[0];
+                        if (result) {
+                            resolve(result);
+                            input.hide();
+                        }
+                    }
+                }),
+                input.onDidTriggerItemButton(event => options.onDidTriggerItemButton && options.onDidTriggerItemButton({
+                    ...event,
+                    removeItem: () => {
+                        const index = input.items.indexOf(event.item);
+                        if (index !== -1) {
+                            const items = input.items.slice();
+                            const removed = items.splice(index, 1);
+                            const activeItems = input.activeItems.filter(activeItem => activeItem !== removed[0]);
+                            const keepScrollPositionBefore = input.keepScrollPosition;
+                            input.keepScrollPosition = true;
+                            input.items = items;
+                            if (activeItems) {
+                                input.activeItems = activeItems;
+                            }
+                            input.keepScrollPosition = keepScrollPositionBefore;
+                        }
+                    }
+                })),
+                input.onDidTriggerSeparatorButton(event => options.onDidTriggerSeparatorButton?.(event)),
+                input.onDidChangeValue(value => {
+                    if (activeItem && !value && (input.activeItems.length !== 1 || input.activeItems[0] !== activeItem)) {
+                        input.activeItems = [activeItem];
+                    }
+                }),
+                token.onCancellationRequested(() => {
+                    input.hide();
+                }),
+                input.onDidHide(() => {
+                    dispose(disposables);
+                    resolve(undefined);
+                }),
+            ];
+            input.title = options.title;
+            input.canSelectMany = !!options.canPickMany;
+            input.placeholder = options.placeHolder;
+            input.ignoreFocusOut = !!options.ignoreFocusLost;
+            input.matchOnDescription = !!options.matchOnDescription;
+            input.matchOnDetail = !!options.matchOnDetail;
+            input.matchOnLabel = (options.matchOnLabel === undefined) || options.matchOnLabel;
+            input.autoFocusOnList = (options.autoFocusOnList === undefined) || options.autoFocusOnList;
+            input.quickNavigate = options.quickNavigate;
+            input.hideInput = !!options.hideInput;
+            input.contextKey = options.contextKey;
+            input.busy = true;
+            Promise.all([picks, options.activeItem])
+                .then(([items, _activeItem]) => {
+                activeItem = _activeItem;
+                input.busy = false;
+                input.items = items;
+                if (input.canSelectMany) {
+                    input.selectedItems = items.filter(item => item.type !== 'separator' && item.picked);
+                }
+                if (activeItem) {
+                    input.activeItems = [activeItem];
+                }
+            });
+            input.show();
+            Promise.resolve(picks).then(undefined, err => {
+                reject(err);
+                input.hide();
+            });
+        }));
+    }
+    setValidationOnInput(input, validationResult) {
+        if (validationResult && isString(validationResult)) {
+            input.severity = Severity.Error;
+            input.validationMessage = validationResult;
+        }
+        else if (validationResult && !isString(validationResult)) {
+            input.severity = validationResult.severity;
+            input.validationMessage = validationResult.content;
+        }
+        else {
+            input.severity = Severity.Ignore;
+            input.validationMessage = undefined;
+        }
+    }
+    input(options = {}, token = CancellationToken.None) {
+        return ( new Promise((resolve) => {
+            if (token.isCancellationRequested) {
+                resolve(undefined);
+                return;
+            }
+            const input = this.createInputBox();
+            const validateInput = options.validateInput || (() => Promise.resolve(undefined));
+            const onDidValueChange = Event.debounce(input.onDidChangeValue, (last, cur) => cur, 100);
+            let validationValue = options.value || '';
+            let validation = Promise.resolve(validateInput(validationValue));
+            const disposables = [
+                input,
+                onDidValueChange(value => {
+                    if (value !== validationValue) {
+                        validation = Promise.resolve(validateInput(value));
+                        validationValue = value;
+                    }
+                    validation.then(result => {
+                        if (value === validationValue) {
+                            this.setValidationOnInput(input, result);
+                        }
+                    });
+                }),
+                input.onDidAccept(() => {
+                    const value = input.value;
+                    if (value !== validationValue) {
+                        validation = Promise.resolve(validateInput(value));
+                        validationValue = value;
+                    }
+                    validation.then(result => {
+                        if (!result || (!isString(result) && result.severity !== Severity.Error)) {
+                            resolve(value);
+                            input.hide();
+                        }
+                        else if (value === validationValue) {
+                            this.setValidationOnInput(input, result);
+                        }
+                    });
+                }),
+                token.onCancellationRequested(() => {
+                    input.hide();
+                }),
+                input.onDidHide(() => {
+                    dispose(disposables);
+                    resolve(undefined);
+                }),
+            ];
+            input.title = options.title;
+            input.value = options.value || '';
+            input.valueSelection = options.valueSelection;
+            input.prompt = options.prompt;
+            input.placeholder = options.placeHolder;
+            input.password = !!options.password;
+            input.ignoreFocusOut = !!options.ignoreFocusLost;
+            input.show();
+        }));
+    }
+    createQuickPick() {
+        const ui = this.getUI(true);
+        return ( new QuickPick(ui));
+    }
+    createInputBox() {
+        const ui = this.getUI(true);
+        return ( new InputBox(ui));
+    }
+    createQuickWidget() {
+        const ui = this.getUI(true);
+        return ( new QuickWidget(ui));
+    }
+    show(controller) {
+        const ui = this.getUI(true);
+        this.onShowEmitter.fire();
+        const oldController = this.controller;
+        this.controller = controller;
+        oldController?.didHide();
+        this.setEnabled(true);
+        ui.leftActionBar.clear();
+        ui.title.textContent = '';
+        ui.description1.textContent = '';
+        ui.description2.textContent = '';
+        reset(ui.widget);
+        ui.rightActionBar.clear();
+        ui.checkAll.checked = false;
+        ui.inputBox.placeholder = '';
+        ui.inputBox.password = false;
+        ui.inputBox.showDecoration(Severity.Ignore);
+        ui.visibleCount.setCount(0);
+        ui.count.setCount(0);
+        reset(ui.message);
+        ui.progressBar.stop();
+        ui.list.setElements([]);
+        ui.list.matchOnDescription = false;
+        ui.list.matchOnDetail = false;
+        ui.list.matchOnLabel = true;
+        ui.list.sortByLabel = true;
+        ui.ignoreFocusOut = false;
+        ui.inputBox.toggles = undefined;
+        const backKeybindingLabel = this.options.backKeybindingLabel();
+        backButton.tooltip = backKeybindingLabel ? ( localizeWithPath(
+            'vs/platform/quickinput/browser/quickInputController',
+            'quickInput.backWithKeybinding',
+            "Back ({0})",
+            backKeybindingLabel
+        )) : ( localizeWithPath(
+            'vs/platform/quickinput/browser/quickInputController',
+            'quickInput.back',
+            "Back"
+        ));
+        ui.container.style.display = '';
+        this.updateLayout();
+        ui.inputBox.setFocus();
+    }
+    isVisible() {
+        return !!this.ui && this.ui.container.style.display !== 'none';
+    }
+    setVisibilities(visibilities) {
+        const ui = this.getUI();
+        ui.title.style.display = visibilities.title ? '' : 'none';
+        ui.description1.style.display = visibilities.description && (visibilities.inputBox || visibilities.checkAll) ? '' : 'none';
+        ui.description2.style.display = visibilities.description && !(visibilities.inputBox || visibilities.checkAll) ? '' : 'none';
+        ui.checkAll.style.display = visibilities.checkAll ? '' : 'none';
+        ui.inputContainer.style.display = visibilities.inputBox ? '' : 'none';
+        ui.filterContainer.style.display = visibilities.inputBox ? '' : 'none';
+        ui.visibleCountContainer.style.display = visibilities.visibleCount ? '' : 'none';
+        ui.countContainer.style.display = visibilities.count ? '' : 'none';
+        ui.okContainer.style.display = visibilities.ok ? '' : 'none';
+        ui.customButtonContainer.style.display = visibilities.customButton ? '' : 'none';
+        ui.message.style.display = visibilities.message ? '' : 'none';
+        ui.progressBar.getContainer().style.display = visibilities.progressBar ? '' : 'none';
+        ui.list.display(!!visibilities.list);
+        ui.container.classList.toggle('show-checkboxes', !!visibilities.checkBox);
+        ui.container.classList.toggle('hidden-input', !visibilities.inputBox && !visibilities.description);
+        this.updateLayout();
+    }
+    setEnabled(enabled) {
+        if (enabled !== this.enabled) {
+            this.enabled = enabled;
+            for (const item of this.getUI().leftActionBar.viewItems) {
+                item.action.enabled = enabled;
+            }
+            for (const item of this.getUI().rightActionBar.viewItems) {
+                item.action.enabled = enabled;
+            }
+            this.getUI().checkAll.disabled = !enabled;
+            this.getUI().inputBox.enabled = enabled;
+            this.getUI().ok.enabled = enabled;
+            this.getUI().list.enabled = enabled;
+        }
+    }
+    hide(reason) {
+        const controller = this.controller;
+        if (!controller) {
+            return;
+        }
+        const container = this.ui?.container;
+        const focusChanged = container && !isAncestorOfActiveElement(container);
+        this.controller = null;
+        this.onHideEmitter.fire();
+        if (container) {
+            container.style.display = 'none';
+        }
+        if (!focusChanged) {
+            let currentElement = this.previousFocusElement;
+            while (currentElement && !currentElement.offsetParent) {
+                currentElement = currentElement.parentElement ?? undefined;
+            }
+            if (currentElement?.offsetParent) {
+                currentElement.focus();
+                this.previousFocusElement = undefined;
+            }
+            else {
+                this.options.returnFocus();
+            }
+        }
+        controller.didHide(reason);
+    }
+    focus() {
+        if (this.isVisible()) {
+            const ui = this.getUI();
+            if (ui.inputBox.enabled) {
+                ui.inputBox.setFocus();
+            }
+            else {
+                ui.list.domFocus();
+            }
+        }
+    }
+    toggle() {
+        if (this.isVisible() && this.controller instanceof QuickPick && this.controller.canSelectMany) {
+            this.getUI().list.toggleCheckbox();
+        }
+    }
+    navigate(next, quickNavigate) {
+        if (this.isVisible() && this.getUI().list.isDisplayed()) {
+            this.getUI().list.focus(next ? QuickInputListFocus.Next : QuickInputListFocus.Previous);
+            if (quickNavigate && this.controller instanceof QuickPick) {
+                this.controller.quickNavigate = quickNavigate;
+            }
+        }
+    }
+    async accept(keyMods = { alt: false, ctrlCmd: false }) {
+        this.keyMods.alt = keyMods.alt;
+        this.keyMods.ctrlCmd = keyMods.ctrlCmd;
+        this.onDidAcceptEmitter.fire();
+    }
+    async back() {
+        this.onDidTriggerButtonEmitter.fire(this.backButton);
+    }
+    async cancel() {
+        this.hide();
+    }
+    layout(dimension, titleBarOffset) {
+        this.dimension = dimension;
+        this.titleBarOffset = titleBarOffset;
+        this.updateLayout();
+    }
+    updateLayout() {
+        if (this.ui && this.isVisible()) {
+            this.ui.container.style.top = `${this.titleBarOffset}px`;
+            const style = this.ui.container.style;
+            const width = Math.min(this.dimension.width * 0.62 , QuickInputController.MAX_WIDTH);
+            style.width = width + 'px';
+            style.marginLeft = '-' + (width / 2) + 'px';
+            this.ui.inputBox.layout();
+            this.ui.list.layout(this.dimension && this.dimension.height * 0.4);
+        }
+    }
+    applyStyles(styles) {
+        this.styles = styles;
+        this.updateStyles();
+    }
+    updateStyles() {
+        if (this.ui) {
+            const { quickInputTitleBackground, quickInputBackground, quickInputForeground, widgetBorder, widgetShadow, } = this.styles.widget;
+            this.ui.titleBar.style.backgroundColor = quickInputTitleBackground ?? '';
+            this.ui.container.style.backgroundColor = quickInputBackground ?? '';
+            this.ui.container.style.color = quickInputForeground ?? '';
+            this.ui.container.style.border = widgetBorder ? `1px solid ${widgetBorder}` : '';
+            this.ui.container.style.boxShadow = widgetShadow ? `0 0 8px 2px ${widgetShadow}` : '';
+            this.ui.list.style(this.styles.list);
+            const content = [];
+            if (this.styles.pickerGroup.pickerGroupBorder) {
+                content.push(`.quick-input-list .quick-input-list-entry { border-top-color:  ${this.styles.pickerGroup.pickerGroupBorder}; }`);
+            }
+            if (this.styles.pickerGroup.pickerGroupForeground) {
+                content.push(`.quick-input-list .quick-input-list-separator { color:  ${this.styles.pickerGroup.pickerGroupForeground}; }`);
+            }
+            if (this.styles.pickerGroup.pickerGroupForeground) {
+                content.push(`.quick-input-list .quick-input-list-separator-as-item { color: var(--vscode-descriptionForeground); }`);
+            }
+            if (this.styles.keybindingLabel.keybindingLabelBackground ||
+                this.styles.keybindingLabel.keybindingLabelBorder ||
+                this.styles.keybindingLabel.keybindingLabelBottomBorder ||
+                this.styles.keybindingLabel.keybindingLabelShadow ||
+                this.styles.keybindingLabel.keybindingLabelForeground) {
+                content.push('.quick-input-list .monaco-keybinding > .monaco-keybinding-key {');
+                if (this.styles.keybindingLabel.keybindingLabelBackground) {
+                    content.push(`background-color: ${this.styles.keybindingLabel.keybindingLabelBackground};`);
+                }
+                if (this.styles.keybindingLabel.keybindingLabelBorder) {
+                    content.push(`border-color: ${this.styles.keybindingLabel.keybindingLabelBorder};`);
+                }
+                if (this.styles.keybindingLabel.keybindingLabelBottomBorder) {
+                    content.push(`border-bottom-color: ${this.styles.keybindingLabel.keybindingLabelBottomBorder};`);
+                }
+                if (this.styles.keybindingLabel.keybindingLabelShadow) {
+                    content.push(`box-shadow: inset 0 -1px 0 ${this.styles.keybindingLabel.keybindingLabelShadow};`);
+                }
+                if (this.styles.keybindingLabel.keybindingLabelForeground) {
+                    content.push(`color: ${this.styles.keybindingLabel.keybindingLabelForeground};`);
+                }
+                content.push('}');
+            }
+            const newStyles = content.join('\n');
+            if (newStyles !== this.ui.styleSheet.textContent) {
+                this.ui.styleSheet.textContent = newStyles;
+            }
+        }
+    }
+}
+export { QuickInputController };