wip (#14530)

src/sql/workbench/contrib/notebook/browser/cellViews/codeCell.component.html

@@ -4,7 +4,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 -->
-<div style="width: 100%; height: 100%; display: flex; flex-flow: column" (keydown)="onKey($event)">
+<div style="width: 100%; height: 100%; display: flex; flex-flow: column">
 	<div style="flex: 0 0 auto;">
 		<code-component [cellModel]="cellModel" [model]="model" [activeCellId]="activeCellId"></code-component>
 	</div>

src/sql/workbench/contrib/notebook/browser/cellViews/codeCell.component.ts

@@ -4,7 +4,7 @@
  *--------------------------------------------------------------------------------------------*/
 
 import { nb } from 'azdata';
-import { OnInit, Component, Input, Inject, forwardRef, ChangeDetectorRef, SimpleChange, OnChanges, ViewChildren, QueryList } from '@angular/core';
+import { OnInit, Component, Input, Inject, forwardRef, ChangeDetectorRef, SimpleChange, OnChanges, HostListener, ViewChildren, QueryList } from '@angular/core';
 import { CellView } from 'sql/workbench/contrib/notebook/browser/cellViews/interfaces';
 import { ICellModel } from 'sql/workbench/services/notebook/browser/models/modelInterfaces';
 import { NotebookModel } from 'sql/workbench/services/notebook/browser/models/notebookModel';
@@ -12,8 +12,6 @@ import { Deferred } from 'sql/base/common/promise';
 import { ICellEditorProvider } from 'sql/workbench/services/notebook/browser/notebookService';
 import { CodeComponent } from 'sql/workbench/contrib/notebook/browser/cellViews/code.component';
 import { OutputComponent } from 'sql/workbench/contrib/notebook/browser/cellViews/output.component';
-import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
-import { KeyCode } from 'vs/base/common/keyCodes';
 
 
 export const CODE_SELECTOR: string = 'code-cell-component';
@@ -34,6 +32,12 @@ export class CodeCellComponent extends CellView implements OnInit, OnChanges {
 		this._activeCellId = value;
 	}
 
+	@HostListener('document:keydown.escape', ['$event'])
+	handleKeyboardEvent() {
+		this.cellModel.active = false;
+		this._model.updateActiveCell(undefined);
+	}
+
 	private _model: NotebookModel;
 	private _activeCellId: string;
 
@@ -129,12 +133,4 @@ export class CodeCellComponent extends CellView implements OnInit, OnChanges {
 	public cellGuid(): string {
 		return this.cellModel.cellGuid;
 	}
-
-	public onKey(e: KeyboardEvent) {
-		let event = new StandardKeyboardEvent(e);
-		if (event.equals(KeyCode.Escape)) {
-			this.cellModel.active = false;
-			this._model.updateActiveCell(undefined);
-		}
-	}
 }

src/sql/workbench/contrib/notebook/browser/cellViews/textCell.component.html

@@ -4,7 +4,7 @@
  *  Licensed under the Source EULA. See License.txt in the project root for license information.
  *--------------------------------------------------------------------------------------------*/
 -->
-<div style="width: 100%; height: 100%; display: flex; flex-flow: column" (keydown)="onKey($event)" (mouseover)="hover=true" (mouseleave)="hover=false">
+<div style="width: 100%; height: 100%; display: flex; flex-flow: column" (mouseover)="hover=true" (mouseleave)="hover=false">
 	<markdown-toolbar-component #markdownToolbar *ngIf="isEditMode" [cellModel]="cellModel"></markdown-toolbar-component>
 	<div class="notebook-text" [class.show-markdown]="markdownMode" [class.show-preview]="previewMode">
 		<code-component *ngIf="markdownMode" [cellModel]="cellModel" (onContentChanged)="handleContentChanged()" [model]="model" [activeCellId]="activeCellId">

src/sql/workbench/contrib/notebook/browser/cellViews/textCell.component.ts

@@ -29,8 +29,6 @@ import { CodeComponent } from 'sql/workbench/contrib/notebook/browser/cellViews/
 import { NotebookRange, ICellEditorProvider, INotebookService } from 'sql/workbench/services/notebook/browser/notebookService';
 import { HTMLMarkdownConverter } from 'sql/workbench/contrib/notebook/browser/htmlMarkdownConverter';
 import { NotebookInput } from 'sql/workbench/contrib/notebook/browser/models/notebookInput';
-import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
-import { KeyCode } from 'vs/base/common/keyCodes';
 
 export const TEXT_SELECTOR: string = 'text-cell-component';
 const USER_SELECT_CLASS = 'actionselect';
@@ -54,6 +52,15 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
 		this._activeCellId = value;
 	}
 
+	@HostListener('document:keydown.escape', ['$event'])
+	handleKeyboardEvent() {
+		if (this.isEditMode) {
+			this.toggleEditMode(false);
+		}
+		this.cellModel.active = false;
+		this._model.updateActiveCell(undefined);
+	}
+
 	// Double click to edit text cell in notebook
 	@HostListener('dblclick', ['$event']) onDblClick() {
 		this.enableActiveCellEditOnDoubleClick();
@@ -456,17 +463,6 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
 		this.cellModel.active = true;
 		this._model.updateActiveCell(this.cellModel);
 	}
-
-	public onKey(e: KeyboardEvent) {
-		let event = new StandardKeyboardEvent(e);
-		if (event.equals(KeyCode.Escape)) {
-			if (this.isEditMode) {
-				this.toggleEditMode(false);
-			}
-			this.cellModel.active = false;
-			this._model.updateActiveCell(undefined);
-		}
-	}
 }
 
 function preventDefaultAndExecCommand(e: KeyboardEvent, commandId: string) {