Merge branch 'master' into fea-skeleton

CHANGELOG.md

@@ -1,3 +1,40 @@
+<a name="1.4.1"></a>
+## [1.4.1](https://github.com/NG-ZORRO/ng-zorro-antd/compare/1.4.0...1.4.1) (2018-09-02)
+
+
+### Bug Fixes
+
+* **auto-complete:** can't select option when touch ([#2054](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2054)) ([2e8e63d](https://github.com/NG-ZORRO/ng-zorro-antd/commit/2e8e63d)), closes [#2053](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2053)
+* **modal:** close modal itself before destructing by the angular's lifecycle ([#1769](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1769)) ([075c7a4](https://github.com/NG-ZORRO/ng-zorro-antd/commit/075c7a4)), closes [#1663](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1663)
+* **pagination:** take minimum of page range and total ([#2046](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2046)) ([30bccd1](https://github.com/NG-ZORRO/ng-zorro-antd/commit/30bccd1)), closes [#2036](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2036)
+* **table:** fix row spaces ([#2061](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2061)) ([cb34983](https://github.com/NG-ZORRO/ng-zorro-antd/commit/cb34983)), closes [#2059](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2059)
+* **tree-select:** unable close when used OnPush ([#2028](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2028)) ([fb83354](https://github.com/NG-ZORRO/ng-zorro-antd/commit/fb83354)), closes [#2012](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2012)
+
+
+
+<a name="1.4.0"></a>
+# [1.4.0](https://github.com/NG-ZORRO/ng-zorro-antd/compare/1.3.0...1.4.0) (2018-08-19)
+
+
+### Bug Fixes
+
+* **avatar:** tolerate error src ([#2008](https://github.com/NG-ZORRO/ng-zorro-antd/issues/2008)) ([d55cdf2](https://github.com/NG-ZORRO/ng-zorro-antd/commit/d55cdf2))
+* **carousel:** carousel on desktop can't slide images ([#1970](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1970)) ([02a84a9](https://github.com/NG-ZORRO/ng-zorro-antd/commit/02a84a9))
+* **cascader:** fix dynamic loading error ([#1931](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1931)) ([d4d24fb](https://github.com/NG-ZORRO/ng-zorro-antd/commit/d4d24fb)), closes [#1927](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1927)
+* **cascader:** should not change on hover work ([#1991](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1991)) ([577ae47](https://github.com/NG-ZORRO/ng-zorro-antd/commit/577ae47)), closes [#1966](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1966)
+* **select:** fix input not blur after user hits enter key ([#1943](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1943)) ([a64d04c](https://github.com/NG-ZORRO/ng-zorro-antd/commit/a64d04c)), closes [#1940](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1940)
+* **tooltip,popconfirm,popover:** not create element when use directive ([#1968](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1968)) ([fa40145](https://github.com/NG-ZORRO/ng-zorro-antd/commit/fa40145)), closes [#1967](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1967)
+* **tree-select:** update selected nodes when after set nodes ([#1946](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1946)) ([cd928e1](https://github.com/NG-ZORRO/ng-zorro-antd/commit/cd928e1)), closes [#1934](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1934)
+* **tree:** fix loading style ([#1942](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1942)) ([19fc2ee](https://github.com/NG-ZORRO/ng-zorro-antd/commit/19fc2ee))
+
+
+### Features
+
+* **modal:** smart to determine whether to add padding-right ([#1877](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1877)) ([a5d631d](https://github.com/NG-ZORRO/ng-zorro-antd/commit/a5d631d)), closes [#1422](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1422)
+* **timeline:** custom circle color ([#1959](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1959)) ([fb3daa1](https://github.com/NG-ZORRO/ng-zorro-antd/commit/fb3daa1)), closes [#1956](https://github.com/NG-ZORRO/ng-zorro-antd/issues/1956)
+
+
+
 <a name="1.3.0"></a>
 # [1.3.0](https://github.com/NG-ZORRO/ng-zorro-antd/compare/1.2.0...1.3.0) (2018-08-03)
 

README-zh_CN.md

@@ -10,6 +10,8 @@
 [![GitHub Release Date](https://img.shields.io/github/release-date/NG-ZORRO/ng-zorro-antd.svg?style=flat-square)](https://github.com/NG-ZORRO/ng-zorro-antd/releases)
 [![NPM downloads](http://img.shields.io/npm/dm/ng-zorro-antd.svg?style=flat-square)](https://npmjs.org/package/ng-zorro-antd)
 [![Gitter](https://img.shields.io/gitter/room/ng-zorro/ng-zorro-antd.svg?style=flat-square)](https://gitter.im/ng-zorro/ng-zorro-antd)
+[![GitHub license](https://img.shields.io/github/license/mashape/apistatus.svg?style=flat-square)](https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE)
+[![extension-for-VSCode](https://img.shields.io/badge/extension%20for-VSCode-blue.svg?style=flat-square)](https://marketplace.visualstudio.com/items?itemName=cipchk.ng-zorro-vscode)
 
 这里是 Ant Design 的 Angular 实现，开发和服务于企业级后台产品。
 
@@ -80,3 +82,6 @@ $ ng add ng-zorro-antd
 1. [<img alt="Stack Overflow" src="https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-logo.svg?v=2bb144720a66" width="140" />](https://stackoverflow.com/questions/tagged/ng-zorro)（English）
 2. [<img alt="Segment Fault" src="http://static.segmentfault.com/global/img/logo.svg" width="100" />](https://segmentfault.com/t/ng-zorro)（中文）
 3. [![Gitter](https://img.shields.io/gitter/room/ng-zorro/ng-zorro-antd.svg?style=flat-square)](https://gitter.im/ng-zorro/ng-zorro-antd)
+4. 加入钉钉 NG-ZORRO 自助服务群（中文）
+
+<img src="https://img.alicdn.com/tfs/TB17P11r_qWBKNjSZFxXXcpLpXa-750-990.jpg" width="300">

README.md

@@ -10,6 +10,8 @@
 [![GitHub Release Date](https://img.shields.io/github/release-date/NG-ZORRO/ng-zorro-antd.svg?style=flat-square)](https://github.com/NG-ZORRO/ng-zorro-antd/releases)
 [![NPM downloads](http://img.shields.io/npm/dm/ng-zorro-antd.svg?style=flat-square)](https://npmjs.org/package/ng-zorro-antd)
 [![Gitter](https://img.shields.io/gitter/room/ng-zorro/ng-zorro-antd.svg?style=flat-square)](https://gitter.im/ng-zorro/ng-zorro-antd)
+[![GitHub license](https://img.shields.io/github/license/mashape/apistatus.svg?style=flat-square)](https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE)
+[![extension-for-VSCode](https://img.shields.io/badge/extension%20for-VSCode-blue.svg?style=flat-square)](https://marketplace.visualstudio.com/items?itemName=cipchk.ng-zorro-vscode)
 
 An enterprise-class UI components based on Ant Design and Angular.
 

components/auto-complete/nz-autocomplete-trigger.directive.ts

@@ -141,7 +141,7 @@ export class NzAutocompleteTriggerDirective implements ControlValueAccessor, OnD
       const clickTarget = event.target as HTMLElement;
 
       // 确保不是点击组件自身
-      if (clickTarget !== this._element.nativeElement && this.panelOpen) {
+      if (clickTarget !== this._element.nativeElement && !this.overlayRef.overlayElement.contains(clickTarget) && this.panelOpen) {
         this.closePanel();
       }
     });

components/auto-complete/nz-autocomplete.spec.ts

@@ -213,6 +213,23 @@ describe('auto-complete', () => {
       .toEqual('');
     }));
 
+    it('should close the panel when an option is tap', fakeAsync(() => {
+      dispatchFakeEvent(input, 'focusin');
+      fixture.detectChanges();
+      flush();
+
+      const option = overlayContainerElement.querySelector('nz-auto-option') as HTMLElement;
+      dispatchFakeEvent(option, 'touchend');
+      dispatchFakeEvent(option, 'click');
+      fixture.detectChanges();
+
+      tick(500);
+      expect(fixture.componentInstance.trigger.panelOpen)
+      .toBe(false);
+      expect(overlayContainerElement.textContent)
+      .toEqual('');
+    }));
+
     it('should hide the panel when the options list is empty', fakeAsync(() => {
       dispatchFakeEvent(input, 'focusin');
       fixture.detectChanges();
@@ -371,7 +388,7 @@ describe('auto-complete', () => {
       flush();
       fixture.detectChanges();
 
-      expect(fixture.componentInstance.inputValue)
+      expect(fixture.componentInstance.inputControl.value)
       .toEqual('Downing Street');
     }));
 
@@ -402,7 +419,7 @@ describe('auto-complete', () => {
       fixture.detectChanges();
       flush();
 
-      expect(fixture.componentInstance.inputValue).toBe(200);
+      expect(fixture.componentInstance.inputControl.value).toBe(200);
     }));
 
     it('should mark the autocomplete control as touched on blur', fakeAsync(() => {
@@ -720,7 +737,7 @@ describe('auto-complete', () => {
       fixture.detectChanges();
       flush();
 
-      expect(componentInstance.inputValue)
+      expect(componentInstance.inputControl.value)
       .toContain('Downing Street');
 
       expect(input.value)
@@ -879,7 +896,6 @@ describe('auto-complete', () => {
   <div>
       <input class="input"
              nz-input
-             [(ngModel)]="inputValue"
              [formControl]="inputControl"
              [nzAutocomplete]="auto"
              (input)="onInput($event.target?.value)">

components/avatar/avatar.spec.ts

@@ -27,8 +27,27 @@ describe('avatar', () => {
     fixture.detectChanges();
   });
 
-  it('#nzSrc', () => {
-    expect(context).not.toBeNull();
+  describe('#nzSrc', () => {
+    it('#nzSrc', () => {
+      expect(context).not.toBeNull();
+    });
+    it('should tolerate error src', fakeAsync(() => {
+      expect(getType(dl)).toBe('image');
+      expect(context.comp.hasSrc).toBe(true);
+      // Manually dispatch error.
+      context.nzSrc = '';
+      context.comp.imgError();
+      tick();
+      fixture.detectChanges();
+      expect(getType(dl)).toBe('icon');
+      expect(context.comp.hasSrc).toBe(false);
+      context.nzSrc = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+P+/HgAFhAJ/wlseKgAAAABJRU5ErkJggg==';
+      tick();
+      fixture.detectChanges();
+      expect(context.comp.hasSrc).toBe(true);
+      expect(getType(dl)).toBe('image');
+      tick();
+    }));
   });
 
   it('#nzIcon', () => {

components/avatar/nz-avatar.component.ts

@@ -103,6 +103,7 @@ export class NzAvatarComponent implements OnChanges {
   ngOnChanges(changes: SimpleChanges): void {
     this.hasText = !this.nzSrc && !!this.nzText;
     this.hasIcon = !this.nzSrc && !!this.nzIcon;
+    this.hasSrc = !!this.nzSrc;
 
     this.setClass().notifyCalc();
   }

components/badge/style/index.less

@@ -10,11 +10,13 @@
   display: inline-block;
   line-height: 1;
   vertical-align: middle;
+  color: unset;
 
   &-count {
     position: absolute;
-    transform: translateX(-50%);
-    top: -@badge-height / 2;
+    transform: translate(50%, -50%);
+    top: 0;
+    right: 0;
     height: @badge-height;
     border-radius: @badge-height / 2;
     min-width: @badge-height;
@@ -26,7 +28,7 @@
     font-size: @badge-font-size;
     font-weight: @badge-font-weight;
     white-space: nowrap;
-    transform-origin: -10% center;
+    transform-origin: 0 center;
     box-shadow: 0 0 0 1px #fff;
     a,
     a:hover {
@@ -40,9 +42,10 @@
 
   &-dot {
     position: absolute;
-    transform: translateX(-50%);
+    transform: translate(50%, -50%);
     transform-origin: 0 center;
-    top: -@badge-dot-size / 2;
+    top: 0;
+    right: 0;
     height: @badge-dot-size;
     width: @badge-dot-size;
     border-radius: 100%;

components/button/nz-button.component.ts

@@ -3,15 +3,16 @@ import {
   ChangeDetectorRef,
   Component,
   ElementRef,
-  HostListener,
-  Input,
+  HostBinding,
+  Input, NgZone, OnDestroy, OnInit,
   Renderer2,
   ViewChild
 } from '@angular/core';
 
 import { NzUpdateHostClassService } from '../core/services/update-host-class.service';
 import { isEmpty } from '../core/util/check';
 import { toBoolean } from '../core/util/convert';
+import { NzWaveDirective } from '../core/wave/nz-wave.directive';
 
 export type NzButtonType = 'primary' | 'dashed' | 'danger';
 export type NzButtonShape = 'circle' | null ;
@@ -23,7 +24,7 @@ export type NzButtonSize = 'small' | 'large' | 'default' ;
   preserveWhitespaces: false,
   templateUrl        : './nz-button.component.html'
 })
-export class NzButtonComponent implements AfterContentInit {
+export class NzButtonComponent implements AfterContentInit, OnInit, OnDestroy {
   private _ghost = false;
   private _search = false;
   private _type: NzButtonType;
@@ -33,7 +34,6 @@ export class NzButtonComponent implements AfterContentInit {
   private el: HTMLElement;
   private iconElement: HTMLElement;
   private iconOnly = false;
-  private clicked = false;
   private prefixCls = 'ant-btn';
   private sizeMap = { large: 'lg', small: 'sm' };
   @ViewChild('contentElement') contentElement: ElementRef;
@@ -99,16 +99,7 @@ export class NzButtonComponent implements AfterContentInit {
     return this._loading;
   }
 
-  /** toggle button clicked animation */
-  @HostListener('click')
-  onClick(): void {
-    this.clicked = true;
-    this.setClassMap();
-    setTimeout(() => {
-      this.clicked = false;
-      this.setClassMap();
-    }, 300);
-  }
+  @HostBinding('attr.nz-wave') nzWave = new NzWaveDirective(this.ngZone, this.elementRef);
 
   updateIconDisplay(value: boolean): void {
     if (this.iconElement) {
@@ -123,7 +114,6 @@ export class NzButtonComponent implements AfterContentInit {
       [ `${this.prefixCls}-${this.nzShape}` ]               : this.nzShape,
       [ `${this.prefixCls}-${this.sizeMap[ this.nzSize ]}` ]: this.sizeMap[ this.nzSize ],
       [ `${this.prefixCls}-loading` ]                       : this.nzLoading,
-      [ `${this.prefixCls}-clicked` ]                       : this.clicked,
       [ `${this.prefixCls}-icon-only` ]                     : this.iconOnly,
       [ `${this.prefixCls}-background-ghost` ]              : this.nzGhost,
       [ `ant-input-search-button` ]                         : this.nzSearch
@@ -187,12 +177,20 @@ export class NzButtonComponent implements AfterContentInit {
     return null;
   }
 
-  constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef, private renderer: Renderer2, private nzUpdateHostClassService: NzUpdateHostClassService) {
+  constructor(private elementRef: ElementRef, private cdr: ChangeDetectorRef, private renderer: Renderer2, private nzUpdateHostClassService: NzUpdateHostClassService, private ngZone: NgZone) {
     this.el = this.elementRef.nativeElement;
     this.renderer.addClass(this.el, this.prefixCls);
   }
 
   ngAfterContentInit(): void {
     this.checkContent();
   }
+
+  ngOnInit(): void {
+    this.nzWave.ngOnInit();
+  }
+
+  ngOnDestroy(): void {
+    this.nzWave.ngOnDestroy();
+  }
 }

components/button/nz-button.module.ts

@@ -1,14 +1,15 @@
 import { ObserversModule } from '@angular/cdk/observers';
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
+import { NzWaveModule } from '../core/wave/nz-wave.module';
 
 import { NzButtonGroupComponent } from './nz-button-group.component';
 import { NzButtonComponent } from './nz-button.component';
 
 @NgModule({
-  declarations: [ NzButtonComponent, NzButtonGroupComponent ],
-  exports     : [ NzButtonComponent, NzButtonGroupComponent ],
-  imports     : [ CommonModule, ObserversModule ]
+  declarations   : [ NzButtonComponent, NzButtonGroupComponent ],
+  exports        : [ NzButtonComponent, NzButtonGroupComponent ],
+  imports        : [ CommonModule, ObserversModule, NzWaveModule ]
 })
 export class NzButtonModule {
 }

components/button/style/index.less

@@ -131,24 +131,6 @@
     margin-left: 8px;
   }
 
-  &-clicked:after {
-    content: '';
-    position: absolute;
-    top: -1px;
-    left: -1px;
-    bottom: -1px;
-    right: -1px;
-    border-radius: inherit;
-    border: 0 solid @primary-color;
-    opacity: 0.4;
-    animation: buttonEffect .4s;
-    display: block;
-  }
-
-  &-danger&-clicked:after {
-    border-color: @btn-danger-color;
-  }
-
   &-background-ghost {
     background: transparent !important;
     border-color: #fff;
@@ -171,16 +153,9 @@
     letter-spacing: .34em;
     margin-right: -.34em;
   }
-}
 
-@keyframes buttonEffect {
-  to {
-    opacity: 0;
-    top: -6px;
-    left: -6px;
-    bottom: -6px;
-    right: -6px;
-    border-width: 6px;
+  &-block {
+    width: 100%;
   }
 }
 

components/carousel/nz-carousel.component.html

@@ -1,7 +1,7 @@
 <div class="slick-initialized slick-slider" [class.slick-vertical]="nzVertical">
   <div class="slick-list" #slickList tabindex="-1" (keydown)="onKeyDown($event)" 
     (swipeleft)="swipe('swipeleft')" (swiperight)="swipe('swiperight')" (pan)="swipeInProgress($event);">
-    <div class="slick-track" [style.transform]="transform" #slickTrack>
+    <div class="slick-track" [style.transform]="transform" #slickTrack (mousedown)="$event.preventDefault()">
       <ng-content></ng-content>
     </div>
   </div>

components/cascader/doc/index.en-US.md

@@ -39,7 +39,7 @@ Cascade selection box.
 | `[nzPlaceHolder]` | input placeholder | string | 'Please select' |
 | `[nzShowArrow]` | Whether show arrow | boolean | true |
 | `[nzShowInput]` | Whether show input | boolean | true |
-| `[nzShowSearch]` | Whether support search | `boolean` `NzShowSearchOptions` | `false` |
+| `[nzShowSearch]` | Whether support search. Cannot be used with `[nzLoadData]` at the same time | `boolean` `NzShowSearchOptions` | `false` |
 | `[nzSize]` | input size, one of `large` `default` `small` | string | `default` |
 | `[nzValueProperty]` | the value property name of options | string | 'value' |
 | `(ngModelChange)` | Emit on values change | `EventEmitter<any[]>` | - |

components/cascader/doc/index.zh-CN.md

@@ -40,7 +40,7 @@ subtitle: 级联选择
 | `[nzPlaceHolder]` | 输入框占位文本 | string | '请选择' |
 | `[nzShowArrow]` | 是否显示箭头 | boolean | true |
 | `[nzShowInput]` | 显示输入框 | boolean | true |
-| `[nzShowSearch]` | 是否支持搜索，默认情况下对 `label` 进行全匹配搜索 | `boolean` `NzShowSearchOptions` | `false` |
+| `[nzShowSearch]` | 是否支持搜索，默认情况下对 `label` 进行全匹配搜索，不能和 `[nzLoadData]` 同时使用 | `boolean` `NzShowSearchOptions` | `false` |
 | `[nzSize]` | 输入框大小，可选 `large` `default` `small` | string | `default` |
 | `[nzValueProperty]` | 选项的实际值的属性名 | string | 'value' |
 | `(ngModelChange)` | 值发生变化时触发 | `EventEmitter<any[]>` | - |