Merge pull request #65706 from usernamehw/find_widget_hiding

Add option to opt-out of extra lines added by Find Widget

src/vs/editor/common/config/commonEditorConfig.ts

@@ -371,6 +371,11 @@ const editorConfiguration: IConfigurationNode = {
 			'description': nls.localize('find.globalFindClipboard', "Controls whether the Find Widget should read or modify the shared find clipboard on macOS."),
 			'included': platform.isMacintosh
 		},
+		'editor.find.addExtraSpaceOnTop': {
+			'type': 'boolean',
+			'default': true,
+			'description': nls.localize('find.addExtraSpaceOnTop', "Controls whether the Find Widget should add extra lines on top of the editor. When true, you can scroll beyond the first line when the Find Widget is visible.")
+		},
 		'editor.wordWrap': {
 			'type': 'string',
 			'enum': ['off', 'on', 'wordWrapColumn', 'bounded'],

src/vs/editor/common/config/editorOptions.ts

@@ -85,6 +85,10 @@ export interface IEditorFindOptions {
 	 * Controls if Find in Selection flag is turned on when multiple lines of text are selected in the editor.
 	 */
 	autoFindInSelection: boolean;
+	/*
+	 * Controls whether the Find Widget should add extra lines on top of the editor.
+	 */
+	addExtraSpaceOnTop?: boolean;
 	/**
 	 * @internal
 	 * Controls if the Find Widget should read or modify the shared find clipboard on macOS
@@ -894,6 +898,7 @@ export interface InternalEditorMinimapOptions {
 export interface InternalEditorFindOptions {
 	readonly seedSearchStringFromSelection: boolean;
 	readonly autoFindInSelection: boolean;
+	readonly addExtraSpaceOnTop: boolean;
 	/**
 	 * @internal
 	 */
@@ -1323,6 +1328,7 @@ export class InternalEditorOptions {
 			a.seedSearchStringFromSelection === b.seedSearchStringFromSelection
 			&& a.autoFindInSelection === b.autoFindInSelection
 			&& a.globalFindClipboard === b.globalFindClipboard
+			&& a.addExtraSpaceOnTop === b.addExtraSpaceOnTop
 		);
 	}
 
@@ -1851,7 +1857,8 @@ export class EditorOptionsValidator {
 		return {
 			seedSearchStringFromSelection: _boolean(opts.seedSearchStringFromSelection, defaults.seedSearchStringFromSelection),
 			autoFindInSelection: _boolean(opts.autoFindInSelection, defaults.autoFindInSelection),
-			globalFindClipboard: _boolean(opts.globalFindClipboard, defaults.globalFindClipboard)
+			globalFindClipboard: _boolean(opts.globalFindClipboard, defaults.globalFindClipboard),
+			addExtraSpaceOnTop: _boolean(opts.addExtraSpaceOnTop, defaults.addExtraSpaceOnTop)
 		};
 	}
 
@@ -2660,7 +2667,8 @@ export const EDITOR_DEFAULTS: IValidatedEditorOptions = {
 		find: {
 			seedSearchStringFromSelection: true,
 			autoFindInSelection: false,
-			globalFindClipboard: false
+			globalFindClipboard: false,
+			addExtraSpaceOnTop: true
 		},
 		colorDecorators: true,
 		lightbulbEnabled: true,

src/vs/editor/contrib/find/findWidget.ts

@@ -110,7 +110,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 	private _findInputFocused: IContextKey<boolean>;
 	private _replaceFocusTracker: dom.IFocusTracker;
 	private _replaceInputFocused: IContextKey<boolean>;
-	private _viewZone: FindWidgetViewZone;
+	private _viewZone?: FindWidgetViewZone;
 	private _viewZoneId?: number;
 
 	private _resizeSash: Sash;
@@ -160,6 +160,17 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 			if (e.accessibilitySupport) {
 				this.updateAccessibilitySupport();
 			}
+
+			if (e.contribInfo) {
+				const addExtraSpaceOnTop = this._codeEditor.getConfiguration().contribInfo.find.addExtraSpaceOnTop;
+				if (addExtraSpaceOnTop && !this._viewZone) {
+					this._viewZone = new FindWidgetViewZone(0);
+					this._showViewZone();
+				}
+				if (!addExtraSpaceOnTop && this._viewZone) {
+					this._removeViewZone();
+				}
+			}
 		}));
 		this.updateAccessibilitySupport();
 		this._register(this._codeEditor.onDidChangeCursorSelection(() => {
@@ -197,7 +208,9 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 		}));
 
 		this._codeEditor.addOverlayWidget(this);
-		this._viewZone = new FindWidgetViewZone(0); // Put it before the first line then users can scroll beyond the first line.
+		if (this._codeEditor.getConfiguration().contribInfo.find.addExtraSpaceOnTop) {
+			this._viewZone = new FindWidgetViewZone(0); // Put it before the first line then users can scroll beyond the first line.
+		}
 
 		this._applyTheme(themeService.getTheme());
 		this._register(themeService.onThemeChange(this._applyTheme.bind(this)));
@@ -434,7 +447,7 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 					const startLeft = editorCoords.left + (startCoords ? startCoords.left : 0);
 					const startTop = startCoords ? startCoords.top : 0;
 
-					if (startTop < this._viewZone.heightInPx) {
+					if (this._viewZone && startTop < this._viewZone.heightInPx) {
 						if (selection.endLineNumber > selection.startLineNumber) {
 							adjustEditorScrollTop = false;
 						}
@@ -468,40 +481,42 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 				this._codeEditor.focus();
 			}
 			this._codeEditor.layoutOverlayWidget(this);
-			this._codeEditor.changeViewZones((accessor) => {
-				if (this._viewZoneId !== undefined) {
-					accessor.removeZone(this._viewZoneId);
-					this._viewZoneId = undefined;
-					this._codeEditor.setScrollTop(this._codeEditor.getScrollTop() - this._viewZone.heightInPx);
-				}
-			});
+			this._removeViewZone();
 		}
 	}
 
 	private _layoutViewZone() {
-		if (!this._isVisible) {
+		const addExtraSpaceOnTop = this._codeEditor.getConfiguration().contribInfo.find.addExtraSpaceOnTop;
+
+		if (!addExtraSpaceOnTop) {
+			this._removeViewZone();
 			return;
 		}
 
-		if (this._viewZoneId !== undefined) {
+		if (!this._isVisible) {
+			return;
+		}
+		const viewZone = this._viewZone;
+		if (this._viewZoneId !== undefined || !viewZone) {
 			return;
 		}
 
 		this._codeEditor.changeViewZones((accessor) => {
 			if (this._state.isReplaceRevealed) {
-				this._viewZone.heightInPx = FIND_REPLACE_AREA_HEIGHT;
+				viewZone.heightInPx = FIND_REPLACE_AREA_HEIGHT;
 			} else {
-				this._viewZone.heightInPx = FIND_INPUT_AREA_HEIGHT;
+				viewZone.heightInPx = FIND_INPUT_AREA_HEIGHT;
 			}
 
-			this._viewZoneId = accessor.addZone(this._viewZone);
+			this._viewZoneId = accessor.addZone(viewZone);
 			// scroll top adjust to make sure the editor doesn't scroll when adding viewzone at the beginning.
-			this._codeEditor.setScrollTop(this._codeEditor.getScrollTop() + this._viewZone.heightInPx);
+			this._codeEditor.setScrollTop(this._codeEditor.getScrollTop() + viewZone.heightInPx);
 		});
 	}
 
 	private _showViewZone(adjustScroll: boolean = true) {
-		if (!this._isVisible) {
+		const viewZone = this._viewZone;
+		if (!this._isVisible || !viewZone) {
 			return;
 		}
 
@@ -510,17 +525,17 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 
 			if (this._viewZoneId !== undefined) {
 				if (this._state.isReplaceRevealed) {
-					this._viewZone.heightInPx = FIND_REPLACE_AREA_HEIGHT;
+					viewZone.heightInPx = FIND_REPLACE_AREA_HEIGHT;
 					scrollAdjustment = FIND_REPLACE_AREA_HEIGHT - FIND_INPUT_AREA_HEIGHT;
 				} else {
-					this._viewZone.heightInPx = FIND_INPUT_AREA_HEIGHT;
+					viewZone.heightInPx = FIND_INPUT_AREA_HEIGHT;
 					scrollAdjustment = FIND_INPUT_AREA_HEIGHT - FIND_REPLACE_AREA_HEIGHT;
 				}
 				accessor.removeZone(this._viewZoneId);
 			} else {
-				this._viewZone.heightInPx = FIND_INPUT_AREA_HEIGHT;
+				viewZone.heightInPx = FIND_INPUT_AREA_HEIGHT;
 			}
-			this._viewZoneId = accessor.addZone(this._viewZone);
+			this._viewZoneId = accessor.addZone(viewZone);
 
 			if (adjustScroll) {
 				this._codeEditor.setScrollTop(this._codeEditor.getScrollTop() + scrollAdjustment);
@@ -528,6 +543,19 @@ export class FindWidget extends Widget implements IOverlayWidget, IHorizontalSas
 		});
 	}
 
+	private _removeViewZone() {
+		this._codeEditor.changeViewZones((accessor) => {
+			if (this._viewZoneId !== undefined) {
+				accessor.removeZone(this._viewZoneId);
+				this._viewZoneId = undefined;
+				if (this._viewZone) {
+					this._codeEditor.setScrollTop(this._codeEditor.getScrollTop() - this._viewZone.heightInPx);
+					this._viewZone = undefined;
+				}
+			}
+		});
+	}
+
 	private _applyTheme(theme: ITheme) {
 		let inputStyles: IFindInputStyles = {
 			inputActiveOptionBorder: theme.getColor(inputActiveOptionBorder),

src/vs/monaco.d.ts

@@ -2433,6 +2433,7 @@ declare namespace monaco.editor {
 		 * Controls if Find in Selection flag is turned on when multiple lines of text are selected in the editor.
 		 */
 		autoFindInSelection: boolean;
+		addExtraSpaceOnTop?: boolean;
 	}
 
 	/**
@@ -3169,6 +3170,7 @@ declare namespace monaco.editor {
 	export interface InternalEditorFindOptions {
 		readonly seedSearchStringFromSelection: boolean;
 		readonly autoFindInSelection: boolean;
+		readonly addExtraSpaceOnTop: boolean;
 	}
 
 	export interface InternalEditorHoverOptions {