add maximumWidth and relativeWidth quickOpen settings

These preserve the existing behaviour and width of the quickOpen widget but allow for customization in situations where long filenames and paths can cause problems selecting the correct file to open.
microsoft · Nov 5, 2024 · 70f1cbd · 70f1cbd
1 parent 3fa1c26
commit 70f1cbd
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 1 deletion.
diff --git a/src/vs/platform/quickinput/browser/quickInput.ts b/src/vs/platform/quickinput/browser/quickInput.ts
@@ -49,6 +49,8 @@ export interface IQuickInputOptions {
 	idPrefix: string;
 	container: HTMLElement;
 	ignoreFocusOut(): boolean;
+	maximumWidth(): number;
+	relativeWidth(): number;
 	backKeybindingLabel(): string | undefined;
 	setContextKey(id?: string): void;
 	linkOpenerDelegate(content: string): void;

diff --git a/src/vs/platform/quickinput/browser/quickInputController.ts b/src/vs/platform/quickinput/browser/quickInputController.ts
@@ -729,7 +729,7 @@ export class QuickInputController extends Disposable {
 			this.ui.container.style.top = `${this.titleBarOffset}px`;
 
 			const style = this.ui.container.style;
-			const width = this.dimension!.width * 0.75;
+			const width = Math.min(this.dimension!.width * this.options.relativeWidth(), this.options.maximumWidth());
 			style.width = width + 'px';
 			style.marginLeft = '-' + (width / 2) + 'px';
 

diff --git a/src/vs/platform/quickinput/browser/quickInputService.ts b/src/vs/platform/quickinput/browser/quickInputService.ts
@@ -70,6 +70,8 @@ export class QuickInputService extends Themable implements IQuickInputService {
 			idPrefix: 'quickInput_',
 			container: host.activeContainer,
 			ignoreFocusOut: () => false,
+			maximumWidth: () => 600,
+			relativeWidth: () => 0.62,
 			backKeybindingLabel: () => undefined,
 			setContextKey: (id?: string) => this.setContextKey(id),
 			linkOpenerDelegate: (content) => {

diff --git a/src/vs/platform/quickinput/test/browser/quickinput.test.ts b/src/vs/platform/quickinput/test/browser/quickinput.test.ts
@@ -80,6 +80,8 @@ suite('QuickInput', () => { // https://github.com/microsoft/vscode/issues/147543
 				container: fixture,
 				idPrefix: 'testQuickInput',
 				ignoreFocusOut() { return true; },
+				maximumWidth() { return 600; },
+				relativeWidth() { return 0.62; },
 				returnFocus() { },
 				backKeybindingLabel() { return undefined; },
 				setContextKey() { return undefined; },

diff --git a/src/vs/workbench/browser/workbench.contribution.ts b/src/vs/workbench/browser/workbench.contribution.ts
@@ -490,6 +490,20 @@ const registry = Registry.as<IConfigurationRegistry>(ConfigurationExtensions.Con
 				'description': localize('workbench.quickOpen.preserveInput', "Controls whether the last typed input to Quick Open should be restored when opening it the next time."),
 				'default': false
 			},
+			'workbench.quickOpen.maximumWidth': {
+				'type': 'number',
+				'description': localize('workbench.quickOpen.maxWidth', "Limits the maximum width of Quick Open to the specified number of pixels."),
+				'default': 600,
+				'minimum': 200,
+				'maximum': 2000
+			},
+			'workbench.quickOpen.relativeWidth': {
+				'type': 'number',
+				'description': localize('workbench.quickOpen.relativeWidth', "Controls the width of Quick Open relative to the total window width."),
+				'default': 0.62,
+				'minimum': 0.1,
+				'maximum': 1.0
+			},
 			'workbench.settings.openDefaultSettings': {
 				'type': 'boolean',
 				'description': localize('openDefaultSettings', "Controls whether opening settings also opens an editor showing all default settings."),

diff --git a/src/vs/workbench/services/quickinput/browser/quickInputService.ts b/src/vs/workbench/services/quickinput/browser/quickInputService.ts
@@ -40,6 +40,8 @@ export class QuickInputService extends BaseQuickInputService {
 	protected override createController(): QuickInputController {
 		return super.createController(this.layoutService, {
 			ignoreFocusOut: () => !this.configurationService.getValue('workbench.quickOpen.closeOnFocusLost'),
+			maximumWidth: () => this.configurationService.getValue('workbench.quickOpen.maximumWidth'),
+			relativeWidth: () => this.configurationService.getValue('workbench.quickOpen.relativeWidth'),
 			backKeybindingLabel: () => this.keybindingService.lookupKeybinding('workbench.action.quickInputBack')?.getLabel() || undefined,
 		});
 	}