Add ability to handle enter key propagation for input model components (#7524)

* Add ability to stop enter key propagation for input model components

* Fix spacing

* onInputEntered -> onEnterKeyPressed

src/sql/workbench/api/common/extHostModelView.ts

@@ -769,6 +769,7 @@ class InputBoxWrapper extends ComponentWrapper implements azdata.InputBoxCompone
 		super(proxy, handle, ModelComponentTypes.InputBox, id);
 		this.properties = {};
 		this._emitterMap.set(ComponentEventType.onDidChange, new Emitter<any>());
+		this._emitterMap.set(ComponentEventType.onEnterKeyPressed, new Emitter<string>());
 	}
 
 	public get value(): string {
@@ -841,10 +842,22 @@ class InputBoxWrapper extends ComponentWrapper implements azdata.InputBoxCompone
 		this.setProperty('inputType', v);
 	}
 
+	public get stopEnterPropagation(): boolean {
+		return this.properties['stopEnterPropagation'];
+	}
+	public set stopEnterPropagation(v: boolean) {
+		this.setProperty('stopEnterPropagation', v);
+	}
+
 	public get onTextChanged(): vscode.Event<any> {
 		let emitter = this._emitterMap.get(ComponentEventType.onDidChange);
 		return emitter && emitter.event;
 	}
+
+	public get onEnterKeyPressed(): vscode.Event<string> {
+		const emitter = this._emitterMap.get(ComponentEventType.onEnterKeyPressed);
+		return emitter && emitter.event;
+	}
 }
 
 class CheckBoxWrapper extends ComponentWrapper implements azdata.CheckBoxComponent {

src/sql/workbench/api/common/sqlExtHostTypes.ts

@@ -225,6 +225,7 @@ export enum ComponentEventType {
 	onSelectedRowChanged,
 	onComponentCreated,
 	onCellAction,
+	onEnterKeyPressed
 }
 
 export interface IComponentEventArgs {

src/sql/workbench/browser/modelComponents/inputbox.component.ts

@@ -72,6 +72,17 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
 		};
 		if (this._inputContainer) {
 			this._input = new InputBox(this._inputContainer.nativeElement, this.contextViewService, inputOptions);
+			this.onkeydown(this._input.inputElement, (e: StandardKeyboardEvent) => {
+				if (e.keyCode === KeyCode.Enter) {
+					this.fireEvent({
+						eventType: ComponentEventType.onEnterKeyPressed,
+						args: this._input.value
+					});
+					if (this.stopEnterPropagation) {
+						e.stopPropagation();
+					}
+				}
+			});
 			this.registerInput(this._input, () => !this.multiline);
 		}
 		if (this._textareaContainer) {
@@ -81,6 +92,15 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
 				if (this.tryHandleKeyEvent(e)) {
 					e.stopPropagation();
 				}
+				if (e.keyCode === KeyCode.Enter) {
+					this.fireEvent({
+						eventType: ComponentEventType.onEnterKeyPressed,
+						args: this._textAreaInput.value
+					});
+					if (this.stopEnterPropagation) {
+						e.stopPropagation();
+					}
+				}
 				// Else assume that keybinding service handles routing this to a command
 			});
 
@@ -308,4 +328,12 @@ export default class InputBoxComponent extends ComponentBase implements ICompone
 	public set required(newValue: boolean) {
 		this.setPropertyFromUI<azdata.InputBoxProperties, boolean>((props, value) => props.required = value, newValue);
 	}
+
+	public get stopEnterPropagation(): boolean {
+		return this.getPropertyOrDefault<azdata.InputBoxProperties, boolean>((props) => props.stopEnterPropagation, false);
+	}
+
+	public set stopEnterPropagation(newValue: boolean) {
+		this.setPropertyFromUI<azdata.InputBoxProperties, boolean>((props, value) => props.stopEnterPropagation = value, newValue);
+	}
 }

src/sql/workbench/browser/modelComponents/interfaces.ts

@@ -69,6 +69,7 @@ export enum ComponentEventType {
 	onSelectedRowChanged,
 	onComponentCreated,
 	onCellAction,
+	onEnterKeyPressed
 }
 
 export interface IModelStore {