chore: sync style with antd

components/badge/nz-badge.component.html

@@ -1,4 +1,4 @@
-<span (cdkObserveContent)="checkContent()" #contentElement><ng-content></ng-content></span>
+<span #contentElement><ng-content></ng-content></span>
 <span class="ant-badge-status-dot ant-badge-status-{{nzStatus || presetColor}}"
       [style.background]="!presetColor && nzColor"
       *ngIf="nzStatus || nzColor"
@@ -16,7 +16,7 @@
       <span class="ant-scroll-number-only"
             *ngIf="count <= nzOverflowCount"
             [style.transform]="'translateY(' + (-countArray[i] * 100) + '%)'">
-          <ng-container *ngIf="(!nzDot)&&(countArray[i]!=null)">
+          <ng-container *ngIf="!nzDot && countArray[i] !== undefined">
             <p *ngFor="let p of countSingleArray" [class.current]="p === countArray[i]">{{ p }}</p>
           </ng-container>
       </span>

components/badge/nz-badge.component.ts

@@ -6,13 +6,15 @@
  * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  */
 
+import { ContentObserver } from '@angular/cdk/observers';
 import {
   AfterViewInit,
   ChangeDetectionStrategy,
   Component,
   ElementRef,
   Input,
   OnChanges,
+  OnDestroy,
   OnInit,
   Renderer2,
   SimpleChanges,
@@ -21,6 +23,8 @@ import {
   ViewEncapsulation
 } from '@angular/core';
 import { isEmpty, zoomBadgeMotion, InputBoolean } from 'ng-zorro-antd/core';
+import { Subject } from 'rxjs';
+import { startWith, takeUntil } from 'rxjs/operators';
 
 export type NzBadgeStatusType = 'success' | 'processing' | 'default' | 'error' | 'warning';
 
@@ -36,7 +40,8 @@ export type NzBadgeStatusType = 'success' | 'processing' | 'default' | 'error' |
     '[class.ant-badge-status]': 'nzStatus'
   }
 })
-export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
+export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
+  private destroy$ = new Subject();
   maxNumberArray: string[] = [];
   countArray: number[] = [];
   countSingleArray = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
@@ -84,7 +89,7 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
     this.maxNumberArray = this.nzOverflowCount.toString().split('');
   }
 
-  constructor(private renderer: Renderer2, private elementRef: ElementRef) {
+  constructor(private renderer: Renderer2, private elementRef: ElementRef, private contentObserver: ContentObserver) {
     renderer.addClass(elementRef.nativeElement, 'ant-badge');
   }
 
@@ -93,7 +98,15 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
   }
 
   ngAfterViewInit(): void {
-    this.checkContent();
+    this.contentObserver
+      .observe(this.contentElement)
+      .pipe(
+        startWith(true),
+        takeUntil(this.destroy$)
+      )
+      .subscribe(() => {
+        this.checkContent();
+      });
   }
 
   ngOnChanges(changes: SimpleChanges): void {
@@ -112,4 +125,9 @@ export class NzBadgeComponent implements OnInit, AfterViewInit, OnChanges {
       this.presetColor = this.colorArray.indexOf(this.nzColor) !== -1 ? this.nzColor : null;
     }
   }
+
+  ngOnDestroy(): void {
+    this.destroy$.next();
+    this.destroy$.complete();
+  }
 }

components/badge/nz-badge.spec.ts

@@ -121,7 +121,6 @@ describe('badge', () => {
 });
 
 @Component({
-  selector: 'nz-test-badge-basic',
   template: `
     <nz-badge
       [nzCount]="count"

components/button/nz-button-group.component.ts

@@ -7,7 +7,6 @@
  */
 
 import { ChangeDetectionStrategy, Component, ElementRef, Input, OnInit, ViewEncapsulation } from '@angular/core';
-
 import { NzSizeLDSType, NzUpdateHostClassService } from 'ng-zorro-antd/core';
 
 @Component({
@@ -20,6 +19,8 @@ import { NzSizeLDSType, NzUpdateHostClassService } from 'ng-zorro-antd/core';
   templateUrl: './nz-button-group.component.html'
 })
 export class NzButtonGroupComponent implements OnInit {
+  private _size: NzSizeLDSType;
+
   @Input()
   get nzSize(): NzSizeLDSType {
     return this._size;
@@ -32,14 +33,12 @@ export class NzButtonGroupComponent implements OnInit {
 
   constructor(private nzUpdateHostClassService: NzUpdateHostClassService, private elementRef: ElementRef) {}
 
-  private _size: NzSizeLDSType;
-  private prefixCls = 'ant-btn-group';
-
   setClassMap(): void {
+    const prefixCls = 'ant-btn-group';
     const classMap = {
-      [this.prefixCls]: true,
-      [`${this.prefixCls}-lg`]: this.nzSize === 'large',
-      [`${this.prefixCls}-sm`]: this.nzSize === 'small'
+      [prefixCls]: true,
+      [`${prefixCls}-lg`]: this.nzSize === 'large',
+      [`${prefixCls}-sm`]: this.nzSize === 'small'
     };
     this.nzUpdateHostClassService.updateHostClass(this.elementRef.nativeElement, classMap);
   }

components/core/responsive/index.ts

@@ -1 +1,9 @@
+/**
+ * @license
+ * Copyright Alibaba.com All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
+ */
+
 export * from './public-api';

components/core/responsive/public-api.ts

@@ -1 +1,9 @@
+/**
+ * @license
+ * Copyright Alibaba.com All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
+ */
+
 export * from './break-point';

components/grid/nz-col.directive.ts

@@ -18,11 +18,9 @@ import {
   Optional,
   Renderer2
 } from '@angular/core';
+import { isNotNil, NgClassInterface, NzUpdateHostClassService } from 'ng-zorro-antd/core';
 import { Subject } from 'rxjs';
 import { startWith, takeUntil } from 'rxjs/operators';
-
-import { isNotNil, NgClassInterface, NzUpdateHostClassService } from 'ng-zorro-antd/core';
-
 import { NzRowDirective } from './nz-row.directive';
 
 export interface EmbeddedProperty {
@@ -55,8 +53,6 @@ export class NzColDirective implements OnInit, OnChanges, AfterViewInit, OnDestr
   @Input() nzXl: number | EmbeddedProperty;
   @Input() nzXXl: number | EmbeddedProperty;
 
-  [property: string]: any; // tslint:disable-line:no-any
-
   /** temp solution since no method add classMap to host https://github.com/angular/angular/issues/7289*/
   setClassMap(): void {
     const classMap = {
@@ -71,23 +67,21 @@ export class NzColDirective implements OnInit, OnChanges, AfterViewInit, OnDestr
   }
 
   generateClass(): object {
-    const listOfSizeInputName = ['nzXs', 'nzSm', 'nzMd', 'nzLg', 'nzXl', 'nzXXl'];
+    const listOfSizeInputName: Array<keyof NzColDirective> = ['nzXs', 'nzSm', 'nzMd', 'nzLg', 'nzXl', 'nzXXl'];
     const listClassMap: NgClassInterface = {};
     listOfSizeInputName.forEach(name => {
       const sizeName = name.replace('nz', '').toLowerCase();
       if (isNotNil(this[name])) {
         if (typeof this[name] === 'number' || typeof this[name] === 'string') {
           listClassMap[`${this.prefixCls}-${sizeName}-${this[name]}`] = true;
         } else {
-          listClassMap[`${this.prefixCls}-${sizeName}-${this[name].span}`] = this[name] && isNotNil(this[name].span);
-          listClassMap[`${this.prefixCls}-${sizeName}-pull-${this[name].pull}`] =
-            this[name] && isNotNil(this[name].pull);
-          listClassMap[`${this.prefixCls}-${sizeName}-push-${this[name].push}`] =
-            this[name] && isNotNil(this[name].push);
-          listClassMap[`${this.prefixCls}-${sizeName}-offset-${this[name].offset}`] =
-            this[name] && isNotNil(this[name].offset);
-          listClassMap[`${this.prefixCls}-${sizeName}-order-${this[name].order}`] =
-            this[name] && isNotNil(this[name].order);
+          const embedded = this[name] as EmbeddedProperty;
+          const prefixArray: Array<keyof EmbeddedProperty> = ['span', 'pull', 'push', 'offset', 'order'];
+          prefixArray.forEach(prefix => {
+            const prefixClass = prefix === 'span' ? '-' : `-${prefix}-`;
+            listClassMap[`${this.prefixCls}-${sizeName}${prefixClass}${embedded[prefix]}`] =
+              embedded && isNotNil(embedded[prefix]);
+          });
         }
       }
     });

components/grid/nz-row.directive.ts

@@ -21,11 +21,10 @@ import {
 
 import { MediaMatcher } from '@angular/cdk/layout';
 import { Platform } from '@angular/cdk/platform';
+import { responsiveMap, Breakpoint, IndexableObject, NzUpdateHostClassService } from 'ng-zorro-antd/core';
 import { fromEvent, Subject } from 'rxjs';
 import { auditTime, takeUntil } from 'rxjs/operators';
 
-import { responsiveMap, Breakpoint, IndexableObject, NzUpdateHostClassService } from 'ng-zorro-antd/core';
-
 export type NzJustify = 'start' | 'end' | 'center' | 'space-around' | 'space-between';
 export type NzAlign = 'top' | 'middle' | 'bottom';
 export type NzType = 'flex' | null;