From e1e4a7d5a534d356b0564845728180bb8af580ac Mon Sep 17 00:00:00 2001 From: Hsuan Lee Date: Wed, 13 May 2020 22:15:22 +0800 Subject: [PATCH] fix: type errors with strictTemplates (#5265) close #5171 --- components/auto-complete/demo/basic.ts | 5 ++- components/auto-complete/demo/custom.ts | 5 ++- components/button/demo/size.ts | 3 +- components/calendar/calendar.component.ts | 2 +- components/calendar/demo/basic.ts | 7 ++- components/cascader/cascader.component.ts | 2 +- .../demo/default-value-and-lazyload.ts | 4 +- components/cascader/typings.ts | 2 +- components/code-editor/demo/full-control.ts | 8 ++-- components/collapse/demo/custom.ts | 2 +- components/collapse/demo/noarrow.ts | 8 +--- components/core/util/convert.ts | 4 +- .../date-picker/date-picker.component.ts | 20 +++++---- .../date-picker/date-range-popup.component.ts | 22 +++++----- components/date-picker/demo/mode.ts | 5 ++- components/date-picker/demo/size.ts | 2 +- components/date-picker/demo/time.ts | 2 +- .../date-picker/inner-popup.component.ts | 12 +++--- .../date-picker/lib/abstract-panel-header.ts | 6 +-- components/date-picker/lib/abstract-table.ts | 4 +- components/date-picker/standard-types.ts | 15 +------ components/descriptions/demo/custom-size.ts | 3 +- .../descriptions-item.component.ts | 4 +- components/drawer/demo/from-drawer.ts | 8 ++-- components/drawer/demo/placement.ts | 3 +- components/dropdown/demo/placement.ts | 3 +- components/form/demo/advanced-search.ts | 2 +- components/form/form-control.component.ts | 20 ++++----- components/grid/col.directive.ts | 22 +++++----- components/grid/demo/playground.ts | 43 ++++++++++--------- components/icon/page/index.ts | 6 +-- components/input-number/demo/precision.ts | 4 +- components/input/demo/group.ts | 2 +- components/list/demo/grid.ts | 2 +- components/list/demo/resposive.ts | 2 +- components/mention/demo/controlled.ts | 4 +- components/mention/mention.component.ts | 4 +- components/modal/demo/confirm-promise.ts | 4 +- components/modal/demo/confirm.ts | 2 +- components/modal/demo/locale.ts | 2 +- components/modal/demo/service.ts | 2 +- components/modal/modal.component.ts | 7 ++- components/notification/demo/template.ts | 2 +- components/select/demo/size.ts | 3 +- components/skeleton/demo/element.ts | 17 +++++--- components/skeleton/demo/list.ts | 2 +- .../skeleton/skeleton-element.component.ts | 22 ++++++---- components/skeleton/skeleton.component.ts | 6 +-- components/skeleton/skeleton.spec.ts | 14 ++++-- components/skeleton/skeleton.type.ts | 18 ++++---- components/slider/demo/event.ts | 2 +- components/slider/handle.component.ts | 2 +- components/slider/slider.component.ts | 2 +- components/slider/typings.ts | 2 +- components/space/demo/size.ts | 2 +- components/statistic/demo/basic.ts | 4 +- components/statistic/demo/card.ts | 4 +- components/statistic/demo/unit.ts | 2 +- components/table/demo/dynamic-settings.ts | 9 ++-- components/table/demo/expand-children.ts | 2 +- .../table/src/cell/th-measure.directive.ts | 2 +- components/tabs/demo/position.ts | 3 +- components/tabs/demo/size.ts | 2 +- components/tabs/demo/slide.ts | 3 +- components/transfer/demo/table-transfer.ts | 4 +- components/transfer/demo/tree-transfer.ts | 22 +++++----- components/tree/demo/dynamic.ts | 2 +- components/tree/tree.component.ts | 2 +- components/upload/demo/avatar.ts | 4 +- components/upload/demo/default-file-list.ts | 3 +- components/upload/demo/picture-card.ts | 2 +- components/upload/demo/picture-style.ts | 7 +-- components/upload/demo/preview-file.ts | 4 +- components/upload/interface.ts | 2 +- scripts/site/_site/doc/app/app.component.html | 2 +- scripts/site/_site/doc/app/app.component.ts | 26 +++-------- .../_site/doc/app/header/header.component.ts | 4 +- .../doc/app/header/navigation.component.ts | 37 ++++++++-------- .../app/share/codebox/codebox.component.html | 2 +- .../app/share/codebox/codebox.component.ts | 2 +- .../share/nav-bottom/nav-bottom.component.ts | 23 +++++----- scripts/site/_site/tsconfig.app.json | 2 +- scripts/site/template/code-box.template.html | 2 +- 83 files changed, 283 insertions(+), 283 deletions(-) diff --git a/components/auto-complete/demo/basic.ts b/components/auto-complete/demo/basic.ts index bede10d1e68..80ead2af4e9 100644 --- a/components/auto-complete/demo/basic.ts +++ b/components/auto-complete/demo/basic.ts @@ -5,7 +5,7 @@ import { Component, ViewEncapsulation } from '@angular/core'; encapsulation: ViewEncapsulation.None, template: `
- +
` @@ -14,7 +14,8 @@ export class NzDemoAutoCompleteBasicComponent { inputValue?: string; options: string[] = []; - onInput(value: string): void { + onInput(event: Event): void { + const value = (event.target as HTMLInputElement).value; this.options = value ? [value, value + value, value + value + value] : []; } } diff --git a/components/auto-complete/demo/custom.ts b/components/auto-complete/demo/custom.ts index a51227de944..a564c208aee 100644 --- a/components/auto-complete/demo/custom.ts +++ b/components/auto-complete/demo/custom.ts @@ -10,7 +10,7 @@ import { Component, ViewEncapsulation } from '@angular/core'; nz-input row="4" [(ngModel)]="inputValue" - (input)="onInput($event.target?.value)" + (input)="onInput($event)" [nzAutocomplete]="auto" > @@ -23,7 +23,8 @@ export class NzDemoAutoCompleteCustomComponent { inputValue?: string; options: string[] = []; - onInput(value: string): void { + onInput(event: Event): void { + const value = (event.target as HTMLInputElement).value; this.options = value ? [value, value + value, value + value + value] : []; } } diff --git a/components/button/demo/size.ts b/components/button/demo/size.ts index 06abfd51f5d..5d11ed73c51 100644 --- a/components/button/demo/size.ts +++ b/components/button/demo/size.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { NzButtonSize } from 'ng-zorro-antd/button'; @Component({ selector: 'nz-demo-button-size', @@ -40,5 +41,5 @@ import { Component } from '@angular/core'; ] }) export class NzDemoButtonSizeComponent { - size = 'large'; + size: NzButtonSize = 'large'; } diff --git a/components/calendar/calendar.component.ts b/components/calendar/calendar.component.ts index a996467c995..ffff02f466e 100644 --- a/components/calendar/calendar.component.ts +++ b/components/calendar/calendar.component.ts @@ -32,7 +32,7 @@ import { NzMonthFullCellDirective as MonthFullCell } from './calendar-cells'; -type NzCalendarMode = 'month' | 'year'; +export type NzCalendarMode = 'month' | 'year'; type NzCalendarDateTemplate = TemplateRef<{ $implicit: Date }>; @Component({ diff --git a/components/calendar/demo/basic.ts b/components/calendar/demo/basic.ts index 7eb01ab8684..b2301872df6 100644 --- a/components/calendar/demo/basic.ts +++ b/components/calendar/demo/basic.ts @@ -1,14 +1,13 @@ import { Component } from '@angular/core'; +import { NzCalendarMode } from 'ng-zorro-antd/calendar'; @Component({ selector: 'nz-demo-calendar-basic', - template: ` - - ` + template: ` ` }) export class NzDemoCalendarBasicComponent { date = new Date(2012, 11, 21); - mode = 'month'; + mode: NzCalendarMode = 'month'; panelChange(change: { date: Date; mode: string }): void { console.log(change.date, change.mode); diff --git a/components/cascader/cascader.component.ts b/components/cascader/cascader.component.ts index 68ab353d138..0d6aaf4cb66 100644 --- a/components/cascader/cascader.component.ts +++ b/components/cascader/cascader.component.ts @@ -224,7 +224,7 @@ export class NzCascaderComponent implements NzCascaderComponentAsSource, OnInit, @Input() nzMouseLeaveDelay: number = 150; // ms @Input() nzTriggerAction: NzCascaderTriggerType | NzCascaderTriggerType[] = ['click'] as NzCascaderTriggerType[]; @Input() nzChangeOn?: (option: NzCascaderOption, level: number) => boolean; - @Input() nzLoadData?: (node: NzCascaderOption, index?: number) => PromiseLike; + @Input() nzLoadData?: (node: NzCascaderOption, index: number) => PromiseLike; @Input() get nzOptions(): NzCascaderOption[] | null { diff --git a/components/cascader/demo/default-value-and-lazyload.ts b/components/cascader/demo/default-value-and-lazyload.ts index c0e65b61996..48174df80d1 100644 --- a/components/cascader/demo/default-value-and-lazyload.ts +++ b/components/cascader/demo/default-value-and-lazyload.ts @@ -51,9 +51,7 @@ const scenicspots: { [key: string]: Array<{ value: string; label: string; isLeaf @Component({ selector: 'nz-demo-cascader-default-value-and-lazyload', - template: ` - - ` + template: ` ` }) export class NzDemoCascaderDefaultValueAndLazyloadComponent { values: string[] = ['zhejiang', 'hangzhou', 'xihu']; diff --git a/components/cascader/typings.ts b/components/cascader/typings.ts index 79d76edb5cf..ddf4da54792 100644 --- a/components/cascader/typings.ts +++ b/components/cascader/typings.ts @@ -63,5 +63,5 @@ export interface NzCascaderComponentAsSource { nzChangeOn?(option: NzCascaderOption, level: number): boolean; - nzLoadData?(node: NzCascaderOption, index?: number): PromiseLike; + nzLoadData?(node: NzCascaderOption, index: number): PromiseLike; } diff --git a/components/code-editor/demo/full-control.ts b/components/code-editor/demo/full-control.ts index ee0c0ef8411..9aae405efe2 100644 --- a/components/code-editor/demo/full-control.ts +++ b/components/code-editor/demo/full-control.ts @@ -6,9 +6,7 @@ declare const monaco: any; @Component({ selector: 'nz-demo-code-editor-full-control', - template: ` - - `, + template: ` `, styles: [ ` .editor { @@ -18,14 +16,14 @@ declare const monaco: any; ] }) export class NzDemoCodeEditorFullControlComponent { - editor?: editor.ICodeEditor; + editor?: editor.ICodeEditor | editor.IEditor; code = `import { NzCodeEditorModule } from 'ng-zorro-antd/code-editor' @Component({}) export class SomeComponent {}`; - onEditorInit(e: editor.ICodeEditor): void { + onEditorInit(e: editor.ICodeEditor | editor.IEditor): void { this.editor = e; this.editor.setModel(monaco.editor.createModel("console.log('Hello ng-zorro-antd')", 'typescript')); } diff --git a/components/collapse/demo/custom.ts b/components/collapse/demo/custom.ts index 6c17dd75dfc..5714384a105 100644 --- a/components/collapse/demo/custom.ts +++ b/components/collapse/demo/custom.ts @@ -10,7 +10,7 @@ import { Component } from '@angular/core'; [nzHeader]="panel.name" [nzActive]="panel.active" [ngStyle]="panel.customStyle" - [nzExpandedIcon]="!isFirst && (panel.icon || expandedIcon)" + [nzExpandedIcon]="!isFirst ? panel.icon || expandedIcon : undefined" >

{{ panel.name }} content

diff --git a/components/collapse/demo/noarrow.ts b/components/collapse/demo/noarrow.ts index e91b0550236..38d7f0eed59 100644 --- a/components/collapse/demo/noarrow.ts +++ b/components/collapse/demo/noarrow.ts @@ -4,13 +4,7 @@ import { Component } from '@angular/core'; selector: 'nz-demo-collapse-noarrow', template: ` - +

A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can be found as a welcome guest in many households across the world. diff --git a/components/core/util/convert.ts b/components/core/util/convert.ts index bb1e02d8345..67d48244269 100644 --- a/components/core/util/convert.ts +++ b/components/core/util/convert.ts @@ -30,8 +30,8 @@ export function toCssPixel(value: number | string): string { /** * Get the function-property type's value */ -export function valueFunctionProp(prop: FunctionProp, ...args: NzSafeAny[]): T { - return typeof prop === 'function' ? prop(...args) : prop; +export function valueFunctionProp(prop: FunctionProp | T, ...args: NzSafeAny[]): T { + return typeof prop === 'function' ? (prop as FunctionProp)(...args) : prop; } function propDecoratorFactory(name: string, fallback: (v: T) => D): (target: NzSafeAny, propName: string) => void { diff --git a/components/date-picker/date-picker.component.ts b/components/date-picker/date-picker.component.ts index 2afe528a1da..b949d4764df 100644 --- a/components/date-picker/date-picker.component.ts +++ b/components/date-picker/date-picker.component.ts @@ -39,7 +39,7 @@ import { DatePickerService } from './date-picker.service'; import { NzConfigService, WithConfig } from 'ng-zorro-antd/core/config'; import { NzPickerComponent } from './picker.component'; -import { CompatibleDate, DisabledTimeFn, PanelMode, PresetRanges, SupportTimeOptions } from './standard-types'; +import { CompatibleDate, DisabledTimeFn, NzDateMode, PresetRanges, SupportTimeOptions } from './standard-types'; const POPUP_STYLE_PATCH = { position: 'relative' }; // Aim to override antd's style to support overlay's position strategy (position:absolute will cause it not working beacuse the overlay can't get the height/width of it's content) const NZ_CONFIG_COMPONENT_NAME = 'datePicker'; @@ -118,12 +118,13 @@ export class NzDatePickerComponent implements OnInit, OnChanges, OnDestroy, Cont static ngAcceptInputType_nzDisabled: BooleanInput; static ngAcceptInputType_nzOpen: BooleanInput; static ngAcceptInputType_nzShowToday: BooleanInput; - static ngAcceptInputType_nzShowTime: BooleanInput; + static ngAcceptInputType_nzMode: NzDateMode | NzDateMode[] | string | string[] | null | undefined; + static ngAcceptInputType_nzShowTime: BooleanInput | SupportTimeOptions | null | undefined; isRange: boolean = false; // Indicate whether the value is a range value showWeek: boolean = false; // Should show as week picker focused: boolean = false; - extraFooter?: TemplateRef | string; + extraFooter?: TemplateRef | string; hostClassMap: NgClassInterface = {}; protected destroyed$: Subject = new Subject(); @@ -144,23 +145,24 @@ export class NzDatePickerComponent implements OnInit, OnChanges, OnDestroy, Cont @Input() nzPlaceHolder: string | [string, string] = ''; @Input() nzPopupStyle: object = POPUP_STYLE_PATCH; @Input() nzDropdownClassName?: string; - @Input() nzSize?: 'large' | 'small'; + @Input() nzSize: 'large' | 'small' | 'default' = 'default'; /** * @deprecated 10.0.0. This is deprecated and going to be removed in 10.0.0. */ @Input() nzStyle: object | null = null; @Input() nzFormat!: string; - @Input() nzDateRender?: FunctionProp | string>; + @Input() nzDateRender?: TemplateRef | string | FunctionProp | string>; @Input() nzDisabledTime?: DisabledTimeFn; - @Input() nzRenderExtraFooter?: FunctionProp | string>; + @Input() nzRenderExtraFooter?: TemplateRef | string | FunctionProp | string>; @Input() @InputBoolean() nzShowToday: boolean = true; - @Input() nzMode: PanelMode | PanelMode[] = 'date'; + @Input() nzMode: NzDateMode | NzDateMode[] = 'date'; @Input() nzRanges?: PresetRanges; @Input() nzDefaultPickerValue: CompatibleDate | null = null; @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME) nzSeparator?: string = undefined; @Input() @WithConfig(NZ_CONFIG_COMPONENT_NAME) nzSuffixIcon: string | TemplateRef = 'calendar'; - @Output() readonly nzOnPanelChange = new EventEmitter(); + // TODO(@wenqi73) The PanelMode need named for each pickers and export + @Output() readonly nzOnPanelChange = new EventEmitter(); @Output() readonly nzOnCalendarChange = new EventEmitter>(); @Output() readonly nzOnOk = new EventEmitter(); @Output() readonly nzOnOpenChange = new EventEmitter(); @@ -352,7 +354,7 @@ export class NzDatePickerComponent implements OnInit, OnChanges, OnDestroy, Cont } } - onPanelModeChange(panelMode: PanelMode | PanelMode[]): void { + onPanelModeChange(panelMode: NzDateMode | NzDateMode[]): void { // this.nzMode = panelMode; this.nzOnPanelChange.emit(panelMode); } diff --git a/components/date-picker/date-range-popup.component.ts b/components/date-picker/date-range-popup.component.ts index 5013d18e8f7..8448394492c 100644 --- a/components/date-picker/date-range-popup.component.ts +++ b/components/date-picker/date-range-popup.component.ts @@ -32,7 +32,7 @@ import { DisabledDateFn, DisabledTimeFn, DisabledTimePartial, - PanelMode, + NzDateMode, PresetRanges, RangePartType, SupportTimeOptions @@ -144,15 +144,15 @@ export class DateRangePopupComponent implements OnInit, OnChanges, OnDestroy { @Input() showTime!: SupportTimeOptions | boolean; @Input() extraFooter?: TemplateRef | string; @Input() ranges?: PresetRanges; - @Input() dateRender?: FunctionProp | string>; - @Input() panelMode!: PanelMode | PanelMode[]; + @Input() dateRender?: string | TemplateRef | FunctionProp | string>; + @Input() panelMode!: NzDateMode | NzDateMode[]; @Input() defaultPickerValue!: CompatibleDate | undefined | null; - @Output() readonly panelModeChange = new EventEmitter(); + @Output() readonly panelModeChange = new EventEmitter(); @Output() readonly calendarChange = new EventEmitter(); @Output() readonly resultOk = new EventEmitter(); // Emitted when done with date selecting prefixCls: string = PREFIX_CLASS; - endPanelMode: PanelMode | PanelMode[] = 'date'; + endPanelMode: NzDateMode | NzDateMode[] = 'date'; timeOptions: SupportTimeOptions | SupportTimeOptions[] | null = null; hoverValue: SingleValue[] = []; // Range ONLY destroy$ = new Subject(); @@ -231,13 +231,13 @@ export class DateRangePopupComponent implements OnInit, OnChanges, OnDestroy { } } - onPanelModeChange(mode: PanelMode, partType?: RangePartType): void { + onPanelModeChange(mode: NzDateMode, partType?: RangePartType): void { if (this.isRange) { const index = this.datePickerService.getActiveIndex(partType); if (index === 0) { - this.panelMode = [mode, this.panelMode[1]] as PanelMode[]; + this.panelMode = [mode, this.panelMode[1]] as NzDateMode[]; } else { - this.panelMode = [this.panelMode[0], mode] as PanelMode[]; + this.panelMode = [this.panelMode[0], mode] as NzDateMode[]; } } else { this.panelMode = mode; @@ -319,11 +319,11 @@ export class DateRangePopupComponent implements OnInit, OnChanges, OnDestroy { } } - getPanelMode(panelMode: PanelMode | PanelMode[], partType?: RangePartType): PanelMode { + getPanelMode(panelMode: NzDateMode | NzDateMode[], partType?: RangePartType): NzDateMode { if (this.isRange) { - return panelMode[this.datePickerService.getActiveIndex(partType)] as PanelMode; + return panelMode[this.datePickerService.getActiveIndex(partType)] as NzDateMode; } else { - return panelMode as PanelMode; + return panelMode as NzDateMode; } } diff --git a/components/date-picker/demo/mode.ts b/components/date-picker/demo/mode.ts index 23b9ef9cdc6..42bf334e4cb 100644 --- a/components/date-picker/demo/mode.ts +++ b/components/date-picker/demo/mode.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { NzDateMode } from 'ng-zorro-antd/date-picker'; @Component({ selector: 'nz-demo-date-picker-mode', @@ -23,7 +24,7 @@ import { Component } from '@angular/core'; ] }) export class NzDemoDatePickerModeComponent { - dateMode = 'time'; + dateMode: NzDateMode = 'time'; handleDateOpenChange(open: boolean): void { if (open) { @@ -31,7 +32,7 @@ export class NzDemoDatePickerModeComponent { } } - handleDatePanelChange(mode: string): void { + handleDatePanelChange(mode: string | NzDateMode[] | string[]): void { console.log('handleDatePanelChange: ', mode); } } diff --git a/components/date-picker/demo/size.ts b/components/date-picker/demo/size.ts index d517a766918..7c1555868da 100644 --- a/components/date-picker/demo/size.ts +++ b/components/date-picker/demo/size.ts @@ -29,5 +29,5 @@ import { Component } from '@angular/core'; ] }) export class NzDemoDatePickerSizeComponent { - size = 'default'; + size: 'large' | 'small' | 'default' = 'default'; } diff --git a/components/date-picker/demo/time.ts b/components/date-picker/demo/time.ts index d1a92458b65..1eec16eb257 100644 --- a/components/date-picker/demo/time.ts +++ b/components/date-picker/demo/time.ts @@ -37,7 +37,7 @@ export class NzDemoDatePickerTimeComponent { console.log('Selected Time: ', result); } - onOk(result: Date): void { + onOk(result: Date | Date[] | null): void { console.log('onOk', result); } } diff --git a/components/date-picker/inner-popup.component.ts b/components/date-picker/inner-popup.component.ts index eef2ba67200..e447227be6e 100644 --- a/components/date-picker/inner-popup.component.ts +++ b/components/date-picker/inner-popup.component.ts @@ -21,7 +21,7 @@ import { import { CandyDate } from 'ng-zorro-antd/core/time'; import { FunctionProp } from 'ng-zorro-antd/core/types'; import { NzCalendarI18nInterface } from 'ng-zorro-antd/i18n'; -import { DisabledDateFn, PanelMode, RangePartType, SupportTimeOptions } from './standard-types'; +import { DisabledDateFn, NzDateMode, RangePartType, SupportTimeOptions } from './standard-types'; import { PREFIX_CLASS } from './util'; @Component({ @@ -155,20 +155,20 @@ import { PREFIX_CLASS } from './util'; }) export class InnerPopupComponent implements OnChanges { @Input() activeDate!: CandyDate; - @Input() endPanelMode!: PanelMode; - @Input() panelMode!: PanelMode; + @Input() endPanelMode!: NzDateMode; + @Input() panelMode!: NzDateMode; @Input() showWeek!: boolean; @Input() locale!: NzCalendarI18nInterface; @Input() showTimePicker!: boolean; @Input() timeOptions!: SupportTimeOptions | null; @Input() disabledDate?: DisabledDateFn; - @Input() dateRender?: FunctionProp | string>; + @Input() dateRender?: string | TemplateRef | FunctionProp | string>; @Input() selectedValue!: CandyDate[]; // Range ONLY @Input() hoverValue!: CandyDate[]; // Range ONLY @Input() value!: CandyDate; @Input() partType!: RangePartType; - @Output() readonly panelModeChange = new EventEmitter(); + @Output() readonly panelModeChange = new EventEmitter(); // TODO: name is not proper @Output() readonly headerChange = new EventEmitter(); // Emitted when user changed the header's value @@ -184,7 +184,7 @@ export class InnerPopupComponent implements OnChanges { * @param direction * @param panelMode */ - enablePrevNext(direction: 'prev' | 'next', panelMode: PanelMode): boolean { + enablePrevNext(direction: 'prev' | 'next', panelMode: NzDateMode): boolean { if ( !this.showTimePicker && panelMode === this.endPanelMode && diff --git a/components/date-picker/lib/abstract-panel-header.ts b/components/date-picker/lib/abstract-panel-header.ts index a4f30fa7444..f077bb92f71 100644 --- a/components/date-picker/lib/abstract-panel-header.ts +++ b/components/date-picker/lib/abstract-panel-header.ts @@ -9,7 +9,7 @@ import { EventEmitter, Input, OnChanges, OnInit, Output, SimpleChanges } from '@angular/core'; import { CandyDate } from 'ng-zorro-antd/core/time'; import { NzCalendarI18nInterface } from 'ng-zorro-antd/i18n'; -import { PanelMode } from '../standard-types'; +import { NzDateMode } from '../standard-types'; import { PanelSelector } from './interface'; export abstract class AbstractPanelHeader implements OnInit, OnChanges { @@ -23,7 +23,7 @@ export abstract class AbstractPanelHeader implements OnInit, OnChanges { @Input() showPreBtn: boolean = true; @Input() showNextBtn: boolean = true; - @Output() readonly panelModeChange = new EventEmitter(); + @Output() readonly panelModeChange = new EventEmitter(); @Output() readonly valueChange = new EventEmitter(); abstract getSelectors(): PanelSelector[]; @@ -68,7 +68,7 @@ export abstract class AbstractPanelHeader implements OnInit, OnChanges { } } - changeMode(mode: PanelMode): void { + changeMode(mode: NzDateMode): void { this.panelModeChange.emit(mode); } diff --git a/components/date-picker/lib/abstract-table.ts b/components/date-picker/lib/abstract-table.ts index 7eb7401d07a..989da6e5f02 100644 --- a/components/date-picker/lib/abstract-table.ts +++ b/components/date-picker/lib/abstract-table.ts @@ -25,8 +25,8 @@ export abstract class AbstractTable implements OnInit, OnChanges { @Input() activeDate: CandyDate = new CandyDate(); @Input() showWeek: boolean = false; @Input() disabledDate?: (d: Date) => boolean; - @Input() cellRender?: FunctionProp | string>; - @Input() fullCellRender?: FunctionProp | string>; + @Input() cellRender?: string | TemplateRef | FunctionProp | string>; + @Input() fullCellRender?: string | TemplateRef | FunctionProp | string>; @Output() readonly valueChange = new EventEmitter(); diff --git a/components/date-picker/standard-types.ts b/components/date-picker/standard-types.ts index 4298f817c07..50fe7414f30 100644 --- a/components/date-picker/standard-types.ts +++ b/components/date-picker/standard-types.ts @@ -7,15 +7,12 @@ */ import { TemplateRef } from '@angular/core'; -import { CandyDate } from 'ng-zorro-antd/core/time'; - -export type PickerResult = PickerResultSingle | PickerResultRange; export type DisabledDateFn = (d: Date) => boolean; export type DisabledTimePartial = 'start' | 'end'; -export type PanelMode = 'decade' | 'year' | 'month' | 'week' | 'date' | 'time'; +export type NzDateMode = 'decade' | 'year' | 'month' | 'week' | 'date' | 'time'; export type RangePartType = 'left' | 'right'; @@ -23,16 +20,6 @@ export type CompatibleDate = Date | Date[]; export type DisabledTimeFn = (current: Date | Date[], partial?: DisabledTimePartial) => DisabledTimeConfig | undefined; -// The common result data format (the range-picker's props can be result as array) -export interface PickerResultSingle { - date: CandyDate; - dateString: string; -} -export interface PickerResultRange { - date: CandyDate[]; - dateString: string[]; -} - export interface DisabledTimeConfig { nzDisabledHours(): number[]; nzDisabledMinutes(hour: number): number[]; diff --git a/components/descriptions/demo/custom-size.ts b/components/descriptions/demo/custom-size.ts index 56ed159791f..66c3491ecad 100644 --- a/components/descriptions/demo/custom-size.ts +++ b/components/descriptions/demo/custom-size.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { NzDescriptionsSize } from 'ng-zorro-antd/descriptions'; @Component({ selector: 'nz-demo-descriptions-custom-size', @@ -37,5 +38,5 @@ import { Component } from '@angular/core'; ` }) export class NzDemoDescriptionsCustomSizeComponent { - size = 'default'; + size: NzDescriptionsSize = 'default'; } diff --git a/components/descriptions/descriptions-item.component.ts b/components/descriptions/descriptions-item.component.ts index c8496767551..836a5a545d1 100644 --- a/components/descriptions/descriptions-item.component.ts +++ b/components/descriptions/descriptions-item.component.ts @@ -7,7 +7,7 @@ */ import { ChangeDetectionStrategy, Component, Input, OnChanges, OnDestroy, TemplateRef, ViewChild, ViewEncapsulation } from '@angular/core'; -import { BooleanInput } from 'ng-zorro-antd/core/types'; +import { NumberInput } from 'ng-zorro-antd/core/types'; import { InputNumber } from 'ng-zorro-antd/core/util'; import { Subject } from 'rxjs'; @@ -25,7 +25,7 @@ import { Subject } from 'rxjs'; preserveWhitespaces: false }) export class NzDescriptionsItemComponent implements OnChanges, OnDestroy { - static ngAcceptInputType_nzSpan: BooleanInput; + static ngAcceptInputType_nzSpan: NumberInput; @ViewChild(TemplateRef, { static: true }) content!: TemplateRef; diff --git a/components/drawer/demo/from-drawer.ts b/components/drawer/demo/from-drawer.ts index 9da88fe5482..ff0a5c610a3 100755 --- a/components/drawer/demo/from-drawer.ts +++ b/components/drawer/demo/from-drawer.ts @@ -13,7 +13,7 @@ import { Component } from '@angular/core'; (nzOnClose)="close()" >

-
+
Name @@ -33,7 +33,7 @@ import { Component } from '@angular/core';
-
+
Owner @@ -51,7 +51,7 @@ import { Component } from '@angular/core';
-
+
Approver @@ -69,7 +69,7 @@ import { Component } from '@angular/core';
-
+
Description diff --git a/components/drawer/demo/placement.ts b/components/drawer/demo/placement.ts index 8cae6820758..bc3dd23c3f1 100755 --- a/components/drawer/demo/placement.ts +++ b/components/drawer/demo/placement.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { NzDrawerPlacement } from 'ng-zorro-antd/drawer'; @Component({ selector: 'nz-demo-drawer-placement', @@ -19,7 +20,7 @@ import { Component } from '@angular/core'; }) export class NzDemoDrawerPlacementComponent { visible = false; - placement = 'left'; + placement: NzDrawerPlacement = 'left'; open(): void { this.visible = true; } diff --git a/components/dropdown/demo/placement.ts b/components/dropdown/demo/placement.ts index f12ac9d587c..b3d952953c8 100644 --- a/components/dropdown/demo/placement.ts +++ b/components/dropdown/demo/placement.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { NzPlacementType } from 'ng-zorro-antd/dropdown'; @Component({ selector: 'nz-demo-dropdown-placement', @@ -26,5 +27,5 @@ import { Component } from '@angular/core'; ] }) export class NzDemoDropdownPlacementComponent { - listOfPosition: string[] = ['bottomLeft', 'bottomCenter', 'bottomRight', 'topLeft', 'topCenter', 'topRight']; + listOfPosition: NzPlacementType[] = ['bottomLeft', 'bottomCenter', 'bottomRight', 'topLeft', 'topCenter', 'topRight']; } diff --git a/components/form/demo/advanced-search.ts b/components/form/demo/advanced-search.ts index 4eb4aacea8e..2a14ac4550f 100644 --- a/components/form/demo/advanced-search.ts +++ b/components/form/demo/advanced-search.ts @@ -7,7 +7,7 @@ import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
- + Field {{ control.index }} diff --git a/components/form/form-control.component.ts b/components/form/form-control.component.ts index 6e3101f986b..6bba706e97d 100644 --- a/components/form/form-control.component.ts +++ b/components/form/form-control.component.ts @@ -24,7 +24,7 @@ import { TemplateRef, ViewEncapsulation } from '@angular/core'; -import { FormControl, FormControlDirective, FormControlName, NgControl, NgModel } from '@angular/forms'; +import { AbstractControl, FormControlDirective, FormControlName, NgControl, NgModel } from '@angular/forms'; import { helpMotion } from 'ng-zorro-antd/core/animation'; import { BooleanInput, NzSafeAny } from 'ng-zorro-antd/core/types'; @@ -87,15 +87,15 @@ export class NzFormControlComponent implements OnChanges, OnDestroy, OnInit, Aft return this.nzDisableAutoTips !== 'default' ? toBoolean(this.nzDisableAutoTips) : this.nzFormDirective?.nzDisableAutoTips; } - validateControl: FormControl | NgModel | null = null; + validateControl: AbstractControl | NgModel | null = null; iconType: typeof iconTypeMap[keyof typeof iconTypeMap] | null = null; - innerTip: string | TemplateRef<{ $implicit: FormControl | NgModel }> | null = null; + innerTip: string | TemplateRef<{ $implicit: AbstractControl | NgModel }> | null = null; @ContentChild(NgControl, { static: false }) defaultValidateControl?: FormControlName | FormControlDirective; - @Input() nzSuccessTip?: string | TemplateRef<{ $implicit: FormControl | NgModel }>; - @Input() nzWarningTip?: string | TemplateRef<{ $implicit: FormControl | NgModel }>; - @Input() nzErrorTip?: string | TemplateRef<{ $implicit: FormControl | NgModel }>; - @Input() nzValidatingTip?: string | TemplateRef<{ $implicit: FormControl | NgModel }>; + @Input() nzSuccessTip?: string | TemplateRef<{ $implicit: AbstractControl | NgModel }>; + @Input() nzWarningTip?: string | TemplateRef<{ $implicit: AbstractControl | NgModel }>; + @Input() nzErrorTip?: string | TemplateRef<{ $implicit: AbstractControl | NgModel }>; + @Input() nzValidatingTip?: string | TemplateRef<{ $implicit: AbstractControl | NgModel }>; @Input() nzExtra?: string | TemplateRef; @Input() nzAutoTips: Record> = {}; @Input() nzDisableAutoTips: boolean | 'default' = 'default'; @@ -113,8 +113,8 @@ export class NzFormControlComponent implements OnChanges, OnDestroy, OnInit, Aft } @Input() - set nzValidateStatus(value: string | FormControl | FormControlName | NgModel) { - if (value instanceof FormControl || value instanceof NgModel) { + set nzValidateStatus(value: string | AbstractControl | FormControlName | NgModel) { + if (value instanceof AbstractControl || value instanceof NgModel) { this.validateControl = value; this.validateString = null; this.watchControl(); @@ -180,7 +180,7 @@ export class NzFormControlComponent implements OnChanges, OnDestroy, OnInit, Aft } } - private getInnerTip(status: NzFormControlStatusType): string | TemplateRef<{ $implicit: FormControl | NgModel }> | null { + private getInnerTip(status: NzFormControlStatusType): string | TemplateRef<{ $implicit: AbstractControl | NgModel }> | null { switch (status) { case 'error': return (!this.disableAutoTips && this.autoErrorTip) || this.nzErrorTip || null; diff --git a/components/grid/col.directive.ts b/components/grid/col.directive.ts index cb93a315be0..75a1dbdf655 100644 --- a/components/grid/col.directive.ts +++ b/components/grid/col.directive.ts @@ -45,17 +45,17 @@ export class NzColDirective implements OnInit, OnChanges, AfterViewInit, OnDestr private destroy$ = new Subject(); hostFlexStyle: string | null = null; @Input() nzFlex: string | number | null = null; - @Input() nzSpan: number | null = null; - @Input() nzOrder: number | null = null; - @Input() nzOffset: number | null = null; - @Input() nzPush: number | null = null; - @Input() nzPull: number | null = null; - @Input() nzXs: number | EmbeddedProperty | null = null; - @Input() nzSm: number | EmbeddedProperty | null = null; - @Input() nzMd: number | EmbeddedProperty | null = null; - @Input() nzLg: number | EmbeddedProperty | null = null; - @Input() nzXl: number | EmbeddedProperty | null = null; - @Input() nzXXl: number | EmbeddedProperty | null = null; + @Input() nzSpan: string | number | null = null; + @Input() nzOrder: string | number | null = null; + @Input() nzOffset: string | number | null = null; + @Input() nzPush: string | number | null = null; + @Input() nzPull: string | number | null = null; + @Input() nzXs: string | number | EmbeddedProperty | null = null; + @Input() nzSm: string | number | EmbeddedProperty | null = null; + @Input() nzMd: string | number | EmbeddedProperty | null = null; + @Input() nzLg: string | number | EmbeddedProperty | null = null; + @Input() nzXl: string | number | EmbeddedProperty | null = null; + @Input() nzXXl: string | number | EmbeddedProperty | null = null; setHostClassMap(): void { const hostClassMap = { diff --git a/components/grid/demo/playground.ts b/components/grid/demo/playground.ts index 1f3d5504c70..0898e1291d0 100755 --- a/components/grid/demo/playground.ts +++ b/components/grid/demo/playground.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { NzMarks } from 'ng-zorro-antd/slider'; @Component({ selector: 'nz-demo-grid-playground', @@ -59,29 +60,29 @@ export class NzDemoGridPlaygroundComponent { vGutter = 16; count = 4; array = new Array(this.count); - marksHGutter = { - 8: 8, - 16: 16, - 24: 24, - 32: 32, - 40: 40, - 48: 48 + marksHGutter: NzMarks = { + '8': '8', + '16': '16', + '24': '24', + '32': '32', + '40': '40', + '48': '48' }; - marksVGutter = { - 8: 8, - 16: 16, - 24: 24, - 32: 32, - 40: 40, - 48: 48 + marksVGutter: NzMarks = { + '8': '8', + '16': '16', + '24': '24', + '32': '32', + '40': '40', + '48': '48' }; - marksCount = { - 2: 2, - 3: 3, - 4: 4, - 6: 6, - 8: 8, - 12: 12 + marksCount: NzMarks = { + '2': '2', + '3': '3', + '4': '4', + '6': '6', + '8': '8', + '12': '12' }; reGenerateArray(count: number): void { this.array = new Array(count); diff --git a/components/icon/page/index.ts b/components/icon/page/index.ts index 20d8febccb3..09163740b2c 100644 --- a/components/icon/page/index.ts +++ b/components/icon/page/index.ts @@ -1,6 +1,6 @@ import { DOCUMENT } from '@angular/common'; import { Component, Inject, OnInit } from '@angular/core'; -import { manifest } from '@ant-design/icons-angular'; +import { manifest, ThemeType } from '@ant-design/icons-angular'; import { AccountBookFill } from '@ant-design/icons-angular/icons'; import { NzIconService } from 'ng-zorro-antd/icon'; @@ -315,7 +315,7 @@ const newIconNames: string[] = [ export class NzPageDemoIconComponent implements OnInit { displayedNames: Array<{ name: string; icons: string[] }> = []; categoryNames: string[] = []; - currentTheme = 'outline'; + currentTheme: ThemeType = 'outline'; localeObj: { [key: string]: string } = locale; searchingString = ''; @@ -384,7 +384,7 @@ export class NzPageDemoIconComponent implements OnInit { this.categoryNames = notEmptyCategories.map(({ name }) => name); } - setIconsShouldBeDisplayed(theme: string): void { + setIconsShouldBeDisplayed(theme: ThemeType): void { this.currentTheme = theme; this.prepareIcons(); } diff --git a/components/input-number/demo/precision.ts b/components/input-number/demo/precision.ts index 6a2e1e7e992..2f503ce17fa 100644 --- a/components/input-number/demo/precision.ts +++ b/components/input-number/demo/precision.ts @@ -25,7 +25,7 @@ export class NzDemoInputNumberPrecisionComponent { cutValue = 2; customFnValue = 2; precision = 2; - customPrecisionFn(value: number, precision: number): number { - return +Number(value).toFixed(precision + 1); + customPrecisionFn(value: string | number, precision?: number): number { + return +Number(value).toFixed(precision! + 1); } } diff --git a/components/input/demo/group.ts b/components/input/demo/group.ts index e14ae84ef30..98acbdf1a74 100644 --- a/components/input/demo/group.ts +++ b/components/input/demo/group.ts @@ -4,7 +4,7 @@ import { Component } from '@angular/core'; selector: 'nz-demo-input-group', template: ` -
+
diff --git a/components/list/demo/grid.ts b/components/list/demo/grid.ts index 714c33f5bcb..17da54197ad 100644 --- a/components/list/demo/grid.ts +++ b/components/list/demo/grid.ts @@ -3,7 +3,7 @@ import { Component } from '@angular/core'; @Component({ selector: 'nz-demo-list-grid', template: ` - +
diff --git a/components/list/demo/resposive.ts b/components/list/demo/resposive.ts index 9b7d1d63fbf..65623e012d8 100644 --- a/components/list/demo/resposive.ts +++ b/components/list/demo/resposive.ts @@ -3,7 +3,7 @@ import { Component } from '@angular/core'; @Component({ selector: 'nz-demo-list-resposive', template: ` - +
diff --git a/components/mention/demo/controlled.ts b/components/mention/demo/controlled.ts index 27be01727c9..b38b76dff63 100644 --- a/components/mention/demo/controlled.ts +++ b/components/mention/demo/controlled.ts @@ -27,11 +27,11 @@ import { NzMentionComponent } from 'ng-zorro-antd/mention'; }) export class NzDemoMentionControlledComponent implements OnInit { suggestions = ['afc163', 'benjycui', 'yiminghe', 'RaoHai', '中文', 'にほんご']; - validateForm?: FormGroup; + validateForm!: FormGroup; @ViewChild('mentions', { static: true }) mentionChild!: NzMentionComponent; get mention(): AbstractControl { - return this.validateForm!.get('mention')!; + return this.validateForm.get('mention')!; } constructor(private fb: FormBuilder) {} diff --git a/components/mention/mention.component.ts b/components/mention/mention.component.ts index 318ba846177..ce54927cd1d 100644 --- a/components/mention/mention.component.ts +++ b/components/mention/mention.component.ts @@ -96,8 +96,8 @@ export class NzMentionComponent implements OnDestroy, OnInit, OnChanges { @Input() @InputBoolean() nzLoading = false; @Input() nzNotFoundContent: string = '无匹配结果,轻敲空格完成输入'; @Input() nzPlacement: MentionPlacement = 'bottom'; - @Input() nzSuggestions: string[] = []; - @Output() readonly nzOnSelect: EventEmitter = new EventEmitter(); + @Input() nzSuggestions: NzSafeAny[] = []; + @Output() readonly nzOnSelect: EventEmitter = new EventEmitter(); @Output() readonly nzOnSearchChange: EventEmitter = new EventEmitter(); trigger!: NzMentionTriggerDirective; diff --git a/components/modal/demo/confirm-promise.ts b/components/modal/demo/confirm-promise.ts index bf44b44444b..b697853cd2e 100644 --- a/components/modal/demo/confirm-promise.ts +++ b/components/modal/demo/confirm-promise.ts @@ -3,9 +3,7 @@ import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal'; @Component({ selector: 'nz-demo-modal-confirm-promise', - template: ` - - ` + template: ` ` }) export class NzDemoModalConfirmPromiseComponent { confirmModal?: NzModalRef; // For testing by now diff --git a/components/modal/demo/confirm.ts b/components/modal/demo/confirm.ts index a70ed64faff..cf9c3e9faa2 100644 --- a/components/modal/demo/confirm.ts +++ b/components/modal/demo/confirm.ts @@ -4,7 +4,7 @@ import { NzModalService } from 'ng-zorro-antd/modal'; @Component({ selector: 'nz-demo-modal-confirm', template: ` - + `, styles: [ diff --git a/components/modal/demo/locale.ts b/components/modal/demo/locale.ts index 1b1282b02f0..217c6497e6b 100644 --- a/components/modal/demo/locale.ts +++ b/components/modal/demo/locale.ts @@ -20,7 +20,7 @@ import { NzModalService } from 'ng-zorro-antd/modal';

- + ` }) export class NzDemoModalLocaleComponent { diff --git a/components/modal/demo/service.ts b/components/modal/demo/service.ts index de4a145eba1..ff7b1a279d0 100644 --- a/components/modal/demo/service.ts +++ b/components/modal/demo/service.ts @@ -39,7 +39,7 @@ import { NzModalRef, NzModalService } from 'ng-zorro-antd/modal';

- This is a non-service html modal `, diff --git a/components/modal/modal.component.ts b/components/modal/modal.component.ts index 8b199c54e88..806ab544851 100644 --- a/components/modal/modal.component.ts +++ b/components/modal/modal.component.ts @@ -84,12 +84,15 @@ export class NzModalComponent implements OnChanges @Input() nzIconType: string = 'question-circle'; // Confirm Modal ONLY @Input() nzModalType: ModalTypes = 'default'; + // TODO(@hsuanxyz) Input will not be supported @Input() @Output() - readonly nzOnOk: EventEmitter | OnClickCallback = new EventEmitter(); + readonly nzOnOk: EventEmitter | OnClickCallback | NzSafeAny = new EventEmitter(); + + // TODO(@hsuanxyz) Input will not be supported @Input() @Output() - readonly nzOnCancel: EventEmitter | OnClickCallback = new EventEmitter(); + readonly nzOnCancel: EventEmitter | OnClickCallback | NzSafeAny = new EventEmitter(); @Output() readonly nzAfterOpen = new EventEmitter(); @Output() readonly nzAfterClose = new EventEmitter(); diff --git a/components/notification/demo/template.ts b/components/notification/demo/template.ts index d7cf5b78772..9d7623c4521 100644 --- a/components/notification/demo/template.ts +++ b/components/notification/demo/template.ts @@ -7,7 +7,7 @@ import { NzNotificationService } from 'ng-zorro-antd/notification'; It's a {{ fruit.name }} - + `, styles: [ diff --git a/components/select/demo/size.ts b/components/select/demo/size.ts index 3ed9b0c2e70..b5d7536d8b4 100644 --- a/components/select/demo/size.ts +++ b/components/select/demo/size.ts @@ -1,4 +1,5 @@ import { Component, OnInit } from '@angular/core'; +import { NzSelectSizeType } from 'ng-zorro-antd/select'; @Component({ selector: 'nz-demo-select-size', @@ -35,7 +36,7 @@ import { Component, OnInit } from '@angular/core'; }) export class NzDemoSelectSizeComponent implements OnInit { listOfOption: Array<{ label: string; value: string }> = []; - size = 'default'; + size: NzSelectSizeType = 'default'; singleValue = 'a10'; multipleValue = ['a10', 'c12']; tagValue = ['a10', 'c12', 'tag']; diff --git a/components/skeleton/demo/element.ts b/components/skeleton/demo/element.ts index 237d1ff53f3..f637563c6c7 100644 --- a/components/skeleton/demo/element.ts +++ b/components/skeleton/demo/element.ts @@ -1,4 +1,11 @@ import { Component } from '@angular/core'; +import { + NzSkeletonAvatarShape, + NzSkeletonAvatarSize, + NzSkeletonButtonShape, + NzSkeletonButtonSize, + NzSkeletonInputSize +} from 'ng-zorro-antd/skeleton'; @Component({ selector: 'nz-demo-skeleton-element', @@ -76,9 +83,9 @@ export class NzDemoSkeletonElementComponent { buttonActive = false; avatarActive = false; inputActive = false; - buttonSize = 'default'; - avatarSize = 'default'; - inputSize = 'default'; - buttonShape = 'default'; - avatarShape = 'circle'; + buttonSize: NzSkeletonButtonSize = 'default'; + avatarSize: NzSkeletonAvatarSize = 'default'; + inputSize: NzSkeletonInputSize = 'default'; + buttonShape: NzSkeletonButtonShape = 'default'; + avatarShape: NzSkeletonAvatarShape = 'circle'; } diff --git a/components/skeleton/demo/list.ts b/components/skeleton/demo/list.ts index e7d648e472e..1d926ede17b 100644 --- a/components/skeleton/demo/list.ts +++ b/components/skeleton/demo/list.ts @@ -9,7 +9,7 @@ import { Component } from '@angular/core'; 156 diff --git a/components/skeleton/skeleton-element.component.ts b/components/skeleton/skeleton-element.component.ts index b8a30e81a17..6a0505a19ab 100644 --- a/components/skeleton/skeleton-element.component.ts +++ b/components/skeleton/skeleton-element.component.ts @@ -7,7 +7,13 @@ */ import { ChangeDetectionStrategy, Component, Directive, Input, OnChanges, SimpleChanges } from '@angular/core'; -import { AvatarShape, AvatarSize, ButtonShape, ButtonSize, InputSize } from './skeleton.type'; +import { + NzSkeletonAvatarShape, + NzSkeletonAvatarSize, + NzSkeletonButtonShape, + NzSkeletonButtonSize, + NzSkeletonInputSize +} from './skeleton.type'; @Directive({ selector: 'nz-skeleton-element', @@ -37,8 +43,8 @@ export class NzSkeletonElementDirective { ` }) export class NzSkeletonElementButtonComponent { - @Input() nzShape: ButtonShape = 'default'; - @Input() nzSize: ButtonSize = 'default'; + @Input() nzShape: NzSkeletonButtonShape = 'default'; + @Input() nzSize: NzSkeletonButtonSize = 'default'; } @Component({ @@ -57,11 +63,11 @@ export class NzSkeletonElementButtonComponent { ` }) export class NzSkeletonElementAvatarComponent implements OnChanges { - static ngAcceptInputType_nzShape: AvatarShape | undefined | null; - static ngAcceptInputType_AvatarSize: AvatarSize | undefined | null; + static ngAcceptInputType_nzShape: NzSkeletonAvatarShape | undefined | null; + static ngAcceptInputType_AvatarSize: NzSkeletonAvatarSize | undefined | null; - @Input() nzShape: AvatarShape = 'circle'; - @Input() nzSize: AvatarSize = 'default'; + @Input() nzShape: NzSkeletonAvatarShape = 'circle'; + @Input() nzSize: NzSkeletonAvatarSize = 'default'; styleMap = {}; @@ -88,5 +94,5 @@ export class NzSkeletonElementAvatarComponent implements OnChanges { ` }) export class NzSkeletonElementInputComponent { - @Input() nzSize: InputSize = 'default'; + @Input() nzSize: NzSkeletonInputSize = 'default'; } diff --git a/components/skeleton/skeleton.component.ts b/components/skeleton/skeleton.component.ts index 03dfa5056ba..b31f8d3f2b4 100644 --- a/components/skeleton/skeleton.component.ts +++ b/components/skeleton/skeleton.component.ts @@ -20,7 +20,7 @@ import { } from '@angular/core'; import { toCssPixel } from 'ng-zorro-antd/core/util'; -import { AvatarShape, AvatarSize, NzSkeletonAvatar, NzSkeletonParagraph, NzSkeletonTitle } from './skeleton.type'; +import { NzSkeletonAvatar, NzSkeletonAvatarShape, NzSkeletonAvatarSize, NzSkeletonParagraph, NzSkeletonTitle } from './skeleton.type'; @Component({ changeDetection: ChangeDetectionStrategy.OnPush, @@ -82,8 +82,8 @@ export class NzSkeletonComponent implements OnInit, OnChanges { } private getAvatarProps(): NzSkeletonAvatar { - const shape: AvatarShape = !!this.nzTitle && !this.nzParagraph ? 'square' : 'circle'; - const size: AvatarSize = 'large'; + const shape: NzSkeletonAvatarShape = !!this.nzTitle && !this.nzParagraph ? 'square' : 'circle'; + const size: NzSkeletonAvatarSize = 'large'; return { shape, size, ...this.getProps(this.nzAvatar) }; } diff --git a/components/skeleton/skeleton.spec.ts b/components/skeleton/skeleton.spec.ts index 73e475334d0..d58d3e940ec 100644 --- a/components/skeleton/skeleton.spec.ts +++ b/components/skeleton/skeleton.spec.ts @@ -2,7 +2,15 @@ import { Component, DebugElement } from '@angular/core'; import { ComponentFixture, TestBed } from '@angular/core/testing'; import { By } from '@angular/platform-browser'; import { NzSkeletonModule } from './skeleton.module'; -import { AvatarShape, AvatarSize, ButtonShape, ButtonSize, NzSkeletonAvatar, NzSkeletonParagraph, NzSkeletonTitle } from './skeleton.type'; +import { + NzSkeletonAvatar, + NzSkeletonAvatarShape, + NzSkeletonAvatarSize, + NzSkeletonButtonShape, + NzSkeletonButtonSize, + NzSkeletonParagraph, + NzSkeletonTitle +} from './skeleton.type'; describe('skeleton', () => { let fixture: ComponentFixture; @@ -214,6 +222,6 @@ export class NzTestSkeletonComponent { export class NzTestSkeletonElementComponent { useSuite = 1; nzActive: boolean = false; - nzSize: AvatarSize | ButtonSize = 'default'; - nzShape: AvatarShape | ButtonShape = 'default'; + nzSize: NzSkeletonAvatarSize | NzSkeletonButtonSize = 'default'; + nzShape: NzSkeletonAvatarShape | NzSkeletonButtonShape = 'default'; } diff --git a/components/skeleton/skeleton.type.ts b/components/skeleton/skeleton.type.ts index 3d8fc697717..4ddb4b4245f 100644 --- a/components/skeleton/skeleton.type.ts +++ b/components/skeleton/skeleton.type.ts @@ -6,16 +6,16 @@ * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE */ -export type ParagraphWidth = number | string | Array; -export type ButtonShape = 'circle' | 'round' | 'default'; -export type AvatarShape = 'square' | 'circle'; -export type InputSize = 'large' | 'small' | 'default'; -export type ButtonSize = InputSize; -export type AvatarSize = InputSize | number; +export type NzSkeletonParagraphWidth = number | string | Array; +export type NzSkeletonButtonShape = 'circle' | 'round' | 'default'; +export type NzSkeletonAvatarShape = 'square' | 'circle'; +export type NzSkeletonInputSize = 'large' | 'small' | 'default'; +export type NzSkeletonButtonSize = NzSkeletonInputSize; +export type NzSkeletonAvatarSize = NzSkeletonInputSize | number; export interface NzSkeletonAvatar { - size?: AvatarSize; - shape?: AvatarShape; + size?: NzSkeletonAvatarSize; + shape?: NzSkeletonAvatarShape; } export interface NzSkeletonTitle { @@ -24,5 +24,5 @@ export interface NzSkeletonTitle { export interface NzSkeletonParagraph { rows?: number; - width?: ParagraphWidth; + width?: NzSkeletonParagraphWidth; } diff --git a/components/slider/demo/event.ts b/components/slider/demo/event.ts index ec6132b0a61..31be1d084d9 100644 --- a/components/slider/demo/event.ts +++ b/components/slider/demo/event.ts @@ -21,7 +21,7 @@ export class NzDemoSliderEventComponent { console.log(`onChange: ${value}`); } - onAfterChange(value: number): void { + onAfterChange(value: number[] | number): void { console.log(`onAfterChange: ${value}`); } } diff --git a/components/slider/handle.component.ts b/components/slider/handle.component.ts index f5bbd5cf713..7818bdba1e9 100644 --- a/components/slider/handle.component.ts +++ b/components/slider/handle.component.ts @@ -58,7 +58,7 @@ export class NzSliderHandleComponent implements OnChanges { @Input() value?: number; @Input() tooltipVisible: NzSliderShowTooltip = 'default'; @Input() tooltipPlacement?: string; - @Input() tooltipFormatter?: (value: number) => string; + @Input() tooltipFormatter?: null | ((value: number) => string); @Input() @InputBoolean() active = false; tooltipTitle?: string; diff --git a/components/slider/slider.component.ts b/components/slider/slider.component.ts index 0d96f07f8c3..49012760dc0 100644 --- a/components/slider/slider.component.ts +++ b/components/slider/slider.component.ts @@ -130,7 +130,7 @@ export class NzSliderComponent implements ControlValueAccessor, OnInit, OnChange @Input() @InputNumber() nzStep = 1; @Input() nzTooltipVisible: NzSliderShowTooltip = 'default'; @Input() nzTooltipPlacement: string = 'top'; - @Input() nzTipFormatter?: (value: number) => string; + @Input() nzTipFormatter?: null | ((value: number) => string); @Output() readonly nzOnAfterChange = new EventEmitter(); diff --git a/components/slider/typings.ts b/components/slider/typings.ts index 9113e689a55..088e79d4c05 100644 --- a/components/slider/typings.ts +++ b/components/slider/typings.ts @@ -14,7 +14,7 @@ export interface NzMarkObj { } export class NzMarks { - [key: number]: NzMark; + [key: string]: NzMark; } /** diff --git a/components/space/demo/size.ts b/components/space/demo/size.ts index ed54003fff8..3f67c21c9d9 100644 --- a/components/space/demo/size.ts +++ b/components/space/demo/size.ts @@ -25,5 +25,5 @@ import { Component } from '@angular/core'; ` }) export class NzDemoSpaceSizeComponent { - size = 'small'; + size: 'small' | 'middle' | 'large' | number = 'small'; } diff --git a/components/statistic/demo/basic.ts b/components/statistic/demo/basic.ts index 3df60cf3ccb..37ca93dae95 100644 --- a/components/statistic/demo/basic.ts +++ b/components/statistic/demo/basic.ts @@ -5,10 +5,10 @@ import { Component } from '@angular/core'; template: ` - + - + ` diff --git a/components/statistic/demo/card.ts b/components/statistic/demo/card.ts index 789229030cf..556b8f22f4e 100644 --- a/components/statistic/demo/card.ts +++ b/components/statistic/demo/card.ts @@ -8,7 +8,7 @@ import { Component } from '@angular/core'; - + diff --git a/components/table/demo/dynamic-settings.ts b/components/table/demo/dynamic-settings.ts index 1b4fc90fb9b..7bf379d3873 100644 --- a/components/table/demo/dynamic-settings.ts +++ b/components/table/demo/dynamic-settings.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; import { FormBuilder, FormGroup } from '@angular/forms'; +import { NzTableLayout, NzTablePaginationPosition, NzTableSize } from 'ng-zorro-antd/table'; interface ItemData { name: string; @@ -25,17 +26,17 @@ interface Setting { noResult: boolean; ellipsis: boolean; simple: boolean; - size: string; + size: NzTableSize; tableScroll: string; - tableLayout: string; - position: string; + tableLayout: NzTableLayout; + position: NzTablePaginationPosition; } @Component({ selector: 'nz-demo-table-dynamic-settings', template: `
- + {{ switch.name }} diff --git a/components/table/demo/expand-children.ts b/components/table/demo/expand-children.ts index 0e5670175bf..ead77ae6cb0 100644 --- a/components/table/demo/expand-children.ts +++ b/components/table/demo/expand-children.ts @@ -27,7 +27,7 @@ export interface TreeNodeInterface { = []; - nzTabPosition = 'top'; + nzTabPosition: NzTabPosition = 'top'; selectedIndex = 0; /* tslint:disable-next-line:no-any */ diff --git a/components/transfer/demo/table-transfer.ts b/components/transfer/demo/table-transfer.ts index 12a658e7e0c..73517261da7 100644 --- a/components/transfer/demo/table-transfer.ts +++ b/components/transfer/demo/table-transfer.ts @@ -1,5 +1,5 @@ import { Component, OnInit } from '@angular/core'; -import { TransferChange, TransferItem } from 'ng-zorro-antd/transfer'; +import { TransferChange, TransferItem, TransferSelectChange } from 'ng-zorro-antd/transfer'; @Component({ selector: 'nz-demo-transfer-table-transfer', @@ -74,7 +74,7 @@ export class NzDemoTransferTableTransferComponent implements OnInit { [2, 3].forEach(idx => (this.list[idx].direction = 'right')); } - select(ret: TransferChange): void { + select(ret: TransferSelectChange): void { console.log('nzSelectChange', ret); } diff --git a/components/transfer/demo/tree-transfer.ts b/components/transfer/demo/tree-transfer.ts index e4410b30438..ed91f0453aa 100644 --- a/components/transfer/demo/tree-transfer.ts +++ b/components/transfer/demo/tree-transfer.ts @@ -1,6 +1,6 @@ import { ChangeDetectionStrategy, Component, ViewChild } from '@angular/core'; -import { NzTreeNode } from 'ng-zorro-antd/core/tree'; -import { TransferChange, TransferItem } from 'ng-zorro-antd/transfer'; +import { NzTreeNode, NzTreeNodeOptions } from 'ng-zorro-antd/core/tree'; +import { TransferChange } from 'ng-zorro-antd/transfer'; import { NzTreeComponent } from 'ng-zorro-antd/tree'; @Component({ @@ -30,20 +30,20 @@ import { NzTreeComponent } from 'ng-zorro-antd/tree'; }) export class NzDemoTransferTreeTransferComponent { @ViewChild('tree', { static: true }) tree!: NzTreeComponent; - list: TransferItem[] = [ - { id: 1, parentid: 0, title: 'parent 1' }, - { id: 2, parentid: 1, title: 'leaf 1-1', disabled: true, isLeaf: true }, - { id: 3, parentid: 1, title: 'leaf 1-2', isLeaf: true } + list: NzTreeNodeOptions[] = [ + { key: '1', id: 1, parentid: 0, title: 'parent 1' }, + { key: '2', id: 2, parentid: 1, title: 'leaf 1-1', disabled: true, isLeaf: true }, + { key: '3', id: 3, parentid: 1, title: 'leaf 1-2', isLeaf: true } ]; treeData = this.generateTree(this.list); checkedNodeList: NzTreeNode[] = []; - private generateTree(arr: TransferItem[]): TransferItem[] { - const tree: TransferItem[] = []; + private generateTree(arr: NzTreeNodeOptions[]): NzTreeNodeOptions[] { + const tree: NzTreeNodeOptions[] = []; // tslint:disable-next-line:no-any const mappedArr: any = {}; - let arrElem: TransferItem; - let mappedElem: TransferItem; + let arrElem: NzTreeNodeOptions; + let mappedElem: NzTreeNodeOptions; for (let i = 0, len = arr.length; i < len; i++) { arrElem = arr[i]; @@ -64,7 +64,7 @@ export class NzDemoTransferTreeTransferComponent { return tree; } - checkBoxChange(node: NzTreeNode, onItemSelect: (item: TransferItem) => void): void { + checkBoxChange(node: NzTreeNode, onItemSelect: (item: NzTreeNodeOptions) => void): void { if (node.isDisabled) { return; } diff --git a/components/tree/demo/dynamic.ts b/components/tree/demo/dynamic.ts index 485667781e4..065c1b17521 100644 --- a/components/tree/demo/dynamic.ts +++ b/components/tree/demo/dynamic.ts @@ -12,7 +12,7 @@ export class NzDemoTreeDynamicComponent { { title: 'Tree Node', key: '2', isLeaf: true } ]; - nzEvent(event: Required): void { + nzEvent(event: NzFormatEmitEvent): void { console.log(event); // load child async if (event.eventName === 'expand') { diff --git a/components/tree/tree.component.ts b/components/tree/tree.component.ts index 10ac0723d16..f1f0cd90f22 100644 --- a/components/tree/tree.component.ts +++ b/components/tree/tree.component.ts @@ -193,7 +193,7 @@ export class NzTreeComponent extends NzTreeBase implements OnInit, OnDestroy, Co @Input() nzVirtualItemSize = 28; @Input() nzVirtualMaxBufferPx = 500; @Input() nzVirtualMinBufferPx = 28; - @Input() nzVirtualHeight: number | boolean = false; + @Input() nzVirtualHeight: string | null = null; @Input() nzTreeTemplate?: TemplateRef<{ $implicit: NzTreeNode; origin: NzTreeNodeOptions }>; @Input() nzBeforeDrop?: (confirm: NzFormatBeforeDropEvent) => Observable; @Input() nzData: NzTreeNodeOptions[] | NzTreeNode[] = []; diff --git a/components/upload/demo/avatar.ts b/components/upload/demo/avatar.ts index c56590a93d2..98ef75d114e 100644 --- a/components/upload/demo/avatar.ts +++ b/components/upload/demo/avatar.ts @@ -37,7 +37,7 @@ export class NzDemoUploadAvatarComponent { constructor(private msg: NzMessageService) {} - beforeUpload = (file: File) => { + beforeUpload = (file: UploadFile, _fileList: UploadFile[]) => { return new Observable((observer: Observer) => { const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png'; if (!isJpgOrPng) { @@ -45,7 +45,7 @@ export class NzDemoUploadAvatarComponent { observer.complete(); return; } - const isLt2M = file.size / 1024 / 1024 < 2; + const isLt2M = file.size! / 1024 / 1024 < 2; if (!isLt2M) { this.msg.error('Image must smaller than 2MB!'); observer.complete(); diff --git a/components/upload/demo/default-file-list.ts b/components/upload/demo/default-file-list.ts index 9df575f9777..c0dcd68e0c1 100644 --- a/components/upload/demo/default-file-list.ts +++ b/components/upload/demo/default-file-list.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { UploadFile } from 'ng-zorro-antd/upload'; @Component({ selector: 'nz-demo-upload-default-file-list', @@ -9,7 +10,7 @@ import { Component } from '@angular/core'; ` }) export class NzDemoUploadDefaultFileListComponent { - fileList = [ + fileList: UploadFile[] = [ { uid: '1', name: 'xxx.png', diff --git a/components/upload/demo/picture-card.ts b/components/upload/demo/picture-card.ts index 016784ecb0d..b6ba04ec8ca 100644 --- a/components/upload/demo/picture-card.ts +++ b/components/upload/demo/picture-card.ts @@ -45,7 +45,7 @@ function getBase64(file: File): Promise { ] }) export class NzDemoUploadPictureCardComponent { - fileList = [ + fileList: UploadFile[] = [ { uid: '-1', name: 'image.png', diff --git a/components/upload/demo/picture-style.ts b/components/upload/demo/picture-style.ts index 1611790c413..9f75c5f6c8c 100644 --- a/components/upload/demo/picture-style.ts +++ b/components/upload/demo/picture-style.ts @@ -1,4 +1,5 @@ import { Component } from '@angular/core'; +import { UploadFile } from 'ng-zorro-antd/upload'; @Component({ selector: 'nz-demo-upload-picture-style', @@ -42,16 +43,16 @@ import { Component } from '@angular/core'; ] }) export class NzDemoUploadPictureStyleComponent { - defaultFileList = [ + defaultFileList: UploadFile[] = [ { - uid: -1, + uid: '-1', name: 'xxx.png', status: 'done', url: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png', thumbUrl: 'https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png' }, { - uid: -2, + uid: '-2', name: 'yyy.png', status: 'error' } diff --git a/components/upload/demo/preview-file.ts b/components/upload/demo/preview-file.ts index 8fe4840bf2e..1b320b39019 100644 --- a/components/upload/demo/preview-file.ts +++ b/components/upload/demo/preview-file.ts @@ -19,10 +19,10 @@ export class NzDemoUploadPreviewFileComponent { previewFile = (file: UploadFile) => { console.log('Your upload file:', file); return this.http - .post(`https://next.json-generator.com/api/json/get/4ytyBoLK8`, { + .post<{ thumbnail: string }>(`https://next.json-generator.com/api/json/get/4ytyBoLK8`, { method: 'POST', body: file }) - .pipe(map((res: { thumbnail?: string }) => res.thumbnail)); + .pipe(map(res => res.thumbnail)); }; } diff --git a/components/upload/interface.ts b/components/upload/interface.ts index 58b7215fdb8..c44ebd23cc5 100644 --- a/components/upload/interface.ts +++ b/components/upload/interface.ts @@ -54,7 +54,7 @@ export interface ShowUploadListInterface { showDownloadIcon?: boolean; } -export type UploadTransformFileType = string | Blob | File | Observable; +export type UploadTransformFileType = string | Blob | UploadFile | Observable; export interface ZipButtonOptions { disabled?: boolean; diff --git a/scripts/site/_site/doc/app/app.component.html b/scripts/site/_site/doc/app/app.component.html index 47c6ee7a7ef..05233901266 100644 --- a/scripts/site/_site/doc/app/app.component.html +++ b/scripts/site/_site/doc/app/app.component.html @@ -71,7 +71,7 @@
-