From ab832d9524cf996dcba1f01b282f0dc9274b8c3a Mon Sep 17 00:00:00 2001
From: Wendell <wendzhue@gmail.com>
Date: Mon, 26 Aug 2019 15:57:51 +0800
Subject: [PATCH] fix(module:code-editor): remove overflow styles (#4016)

* fix(module:code-editor): remove overflow styles

* docs: add tooltip to the complex demo

* refactor: use types imported from monaco editor for better intellisense
---
 components/code-editor/demo/complex.ts        |  5 ++++
 components/code-editor/demo/module            |  3 ++-
 .../code-editor/nz-code-editor.component.ts   | 26 +++++++------------
 .../code-editor/nz-code-editor.definitions.ts |  1 -
 components/code-editor/package.json           |  3 +++
 components/code-editor/style/index.less       |  1 -
 6 files changed, 19 insertions(+), 20 deletions(-)

diff --git a/components/code-editor/demo/complex.ts b/components/code-editor/demo/complex.ts
index 8dea0d1b031..72d2c75cb68 100644
--- a/components/code-editor/demo/complex.ts
+++ b/components/code-editor/demo/complex.ts
@@ -1,6 +1,7 @@
 import { DOCUMENT } from '@angular/common';
 import { Component, Inject, Renderer2, ViewChild } from '@angular/core';
 import { NzCodeEditorComponent } from 'ng-zorro-antd/code-editor';
+import { NzTooltipDirective } from 'ng-zorro-antd/tooltip';
 
 @Component({
   selector: 'nz-demo-code-editor-complex',
@@ -21,6 +22,8 @@ import { NzCodeEditorComponent } from 'ng-zorro-antd/code-editor';
       <i
         nz-icon
         [class.active]="fullScreen"
+        nz-tooltip
+        nzTooltipTitle="Toggle Fullscreen"
         [nzType]="fullScreen ? 'fullscreen-exit' : 'fullscreen'"
         (click)="toggleFullScreen()"
       ></i>
@@ -46,6 +49,7 @@ import { NzCodeEditorComponent } from 'ng-zorro-antd/code-editor';
 })
 export class NzDemoCodeEditorComplexComponent {
   @ViewChild(NzCodeEditorComponent, { static: false }) editorComponent: NzCodeEditorComponent;
+  @ViewChild(NzTooltipDirective, { static: false }) tooltip: NzTooltipDirective;
 
   loading = true;
   fullScreen = false;
@@ -78,5 +82,6 @@ console.log(flatten(['1', 2, [[3]]]))`;
     this.fullScreen = !this.fullScreen;
     this.renderer.setStyle((this.document as Document).body, 'overflow-y', this.fullScreen ? 'hidden' : null);
     this.editorComponent.layout();
+    this.tooltip.hide();
   }
 }
diff --git a/components/code-editor/demo/module b/components/code-editor/demo/module
index 51b2a8a877f..fa527ebb5c4 100644
--- a/components/code-editor/demo/module
+++ b/components/code-editor/demo/module
@@ -3,5 +3,6 @@ import { NzIconModule } from 'ng-zorro-antd/icon';
 import { NzTypographyModule } from 'ng-zorro-antd/typography'
 import { NzSpinModule } from 'ng-zorro-antd/spin';
 import { NzSwitchModule } from 'ng-zorro-antd/switch'
+import { NzToolTipModule } from 'ng-zorro-antd/tooltip';
 
-export const moduleList = [ NzCodeEditorModule, NzSpinModule, NzIconModule, NzSwitchModule, NzTypographyModule ];
+export const moduleList = [ NzCodeEditorModule, NzSpinModule, NzIconModule, NzSwitchModule, NzTypographyModule, NzToolTipModule ];
diff --git a/components/code-editor/nz-code-editor.component.ts b/components/code-editor/nz-code-editor.component.ts
index 7a1d67fb86c..77a0c6b53e9 100644
--- a/components/code-editor/nz-code-editor.component.ts
+++ b/components/code-editor/nz-code-editor.component.ts
@@ -29,24 +29,16 @@ import { inNextTick, warn, InputBoolean } from 'ng-zorro-antd/core';
 import { JoinedEditorOption, NzEditorMode } from './nz-code-editor.definitions';
 import { NzCodeEditorService } from './nz-code-editor.service';
 
-// Avoid import monaco-editor. Otherwise importing `NgZorroAntdModule` would lead to force installation of monaco editor.
-
-// import { editor } from 'monaco-editor';
-// import IEditor = editor.IEditor;
-// import IDiffEditor = editor.IDiffEditor;
-// import ITextModel = editor.ITextModel;
-// import IEditorConstructionOptions = editor.IEditorConstructionOptions;
-// import IDiffEditorConstructionOptions = editor.IDiffEditorConstructionOptions;
-
-// tslint:disable no-any
-type IEditor = any;
-type IDiffEditor = any;
-type ITextModel = any;
-type IEditorConstructionOptions = any;
-type IDiffEditorConstructionOptions = any;
-
+// Import types from monaco editor.
+import { editor } from 'monaco-editor';
+import IEditor = editor.IEditor;
+import IDiffEditor = editor.IDiffEditor;
+import ITextModel = editor.ITextModel;
+import IEditorConstructionOptions = editor.IEditorConstructionOptions;
+import IDiffEditorConstructionOptions = editor.IDiffEditorConstructionOptions;
+
+// tslint:disable-next-line no-any
 declare const monaco: any;
-// tslint:enable no-any
 
 @Component({
   changeDetection: ChangeDetectionStrategy.OnPush,
diff --git a/components/code-editor/nz-code-editor.definitions.ts b/components/code-editor/nz-code-editor.definitions.ts
index 0916caa85f3..12b9dcb05df 100644
--- a/components/code-editor/nz-code-editor.definitions.ts
+++ b/components/code-editor/nz-code-editor.definitions.ts
@@ -21,7 +21,6 @@ export enum NzCodeEditorLoadingStatus {
   LOADED = 'LOADED'
 }
 
-// TODO: move to config service in the future
 export interface NzCodeEditorConfig {
   assetsRoot?: string | SafeUrl;
   defaultEditorOption?: JoinedEditorOption;
diff --git a/components/code-editor/package.json b/components/code-editor/package.json
index ded1e7a9fdf..dfa1ba4eee9 100644
--- a/components/code-editor/package.json
+++ b/components/code-editor/package.json
@@ -3,5 +3,8 @@
     "lib": {
       "entryFile": "public-api.ts"
     }
+  },
+  "peerDependencies": {
+    "monaco-editor": "^0.14.0"
   }
 }
diff --git a/components/code-editor/style/index.less b/components/code-editor/style/index.less
index 57b0c6d4bec..a9af2b5e9fa 100644
--- a/components/code-editor/style/index.less
+++ b/components/code-editor/style/index.less
@@ -6,7 +6,6 @@
 .@{code-editor-prefix-cls} {
   display: block;
   position: relative;
-  overflow: hidden;
   height: 100%;
   width: 100%;
   background-color: @component-background;