ng-zorro-antd
Version:
An enterprise-class UI components based on Ant Design and Angular
3,645 lines • 143 kB
JavaScript
import addMonths from 'date-fns/add_months';
import addYears from 'date-fns/add_years';
import endOfMonth from 'date-fns/end_of_month';
import setDay from 'date-fns/set_day';
import setMonth from 'date-fns/set_month';
import { NzIconModule } from 'ng-zorro-antd/icon';
import { CommonModule } from '@angular/common';
import { NzTimePickerModule } from 'ng-zorro-antd/time-picker';
import { __decorate, __metadata } from 'tslib';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { CdkConnectedOverlay, OverlayModule } from '@angular/cdk/overlay';
import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, ViewEncapsulation, NgModule, ChangeDetectorRef, ElementRef, ViewChild, forwardRef, Host, Optional, Renderer2 } from '@angular/core';
import { FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
import { isNonEmptyString, isTemplateRef, valueFunctionProp, slideMotion, InputBoolean, toBoolean, NzNoAnimationDirective, NzNoAnimationModule, NzOverlayModule } from 'ng-zorro-antd/core';
import { DateHelperService, NzI18nService, NzI18nModule } from 'ng-zorro-antd/i18n';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* Wrapping kind APIs for date operating and unify
* NOTE: every new API return new CandyDate object without side effects to the former Date object
* NOTE: most APIs are based on local time other than customized locale id (this needs tobe support in future)
* TODO: support format() against to angular's core API
*/
class CandyDate {
// locale: string; // Custom specified locale ID
/**
* @param {?=} date
*/
constructor(date) {
// if (!(this instanceof CandyDate)) {
// return new CandyDate(date);
// }
if (date) {
if (date instanceof Date) {
this.nativeDate = date;
}
else if (typeof date === 'string') {
this.nativeDate = new Date(date);
}
else {
throw new Error('The input date type is not supported ("Date" and "string" is now recommended)');
}
}
else {
this.nativeDate = new Date();
}
}
// getLocale(): string {
// return this.locale;
// }
// setLocale(locale: string): CandyDate {
// this.locale = locale;
// return this;
// }
// ---------------------------------------------------------------------
// | Native shortcuts
// ---------------------------------------------------------------------
/**
* @return {?}
*/
getYear() {
return this.nativeDate.getFullYear();
}
/**
* @return {?}
*/
getMonth() {
return this.nativeDate.getMonth();
}
/**
* @return {?}
*/
getDay() {
return this.nativeDate.getDay();
}
/**
* @return {?}
*/
getTime() {
return this.nativeDate.getTime();
}
/**
* @return {?}
*/
getDate() {
return this.nativeDate.getDate();
}
/**
* @return {?}
*/
getHours() {
return this.nativeDate.getHours();
}
/**
* @return {?}
*/
getMinutes() {
return this.nativeDate.getMinutes();
}
/**
* @return {?}
*/
getSeconds() {
return this.nativeDate.getSeconds();
}
/**
* @return {?}
*/
getMilliseconds() {
return this.nativeDate.getMilliseconds();
}
// ---------------------------------------------------------------------
// | New implementing APIs
// ---------------------------------------------------------------------
/**
* @return {?}
*/
clone() {
return new CandyDate(new Date(this.nativeDate));
}
/**
* @param {?} hour
* @param {?} minute
* @param {?} second
* @return {?}
*/
setHms(hour, minute, second) {
/** @type {?} */
const date = new Date(this.nativeDate);
date.setHours(hour, minute, second);
return new CandyDate(date);
}
/**
* @param {?} year
* @return {?}
*/
setYear(year) {
// return new CandyDate(setYear(this.date, year));
/** @type {?} */
const date = new Date(this.nativeDate);
date.setFullYear(year);
return new CandyDate(date);
}
/**
* @param {?} amount
* @return {?}
*/
addYears(amount) {
return new CandyDate(addYears(this.nativeDate, amount));
}
// NOTE: month starts from 0
// NOTE: Don't use the native API for month manipulation as it not restrict the date when it overflows, eg. (new Date('2018-7-31')).setMonth(1) will be date of 2018-3-03 instead of 2018-2-28
/**
* @param {?} month
* @return {?}
*/
setMonth(month) {
// const date = new Date(this.nativeDate);
// date.setMonth(month);
// return new CandyDate(date);
return new CandyDate(setMonth(this.nativeDate, month));
}
/**
* @param {?} amount
* @return {?}
*/
addMonths(amount) {
return new CandyDate(addMonths(this.nativeDate, amount));
}
/**
* @param {?} day
* @param {?=} options
* @return {?}
*/
setDay(day, options) {
return new CandyDate(setDay(this.nativeDate, day, options));
}
/**
* @param {?} amount
* @return {?}
*/
setDate(amount) {
/** @type {?} */
const date = new Date(this.nativeDate);
date.setDate(amount);
return new CandyDate(date);
}
/**
* @param {?} amount
* @return {?}
*/
addDays(amount) {
return this.setDate(this.getDate() + amount);
}
/**
* @param {?} grain
* @return {?}
*/
endOf(grain) {
switch (grain) {
case 'month':
return new CandyDate(endOfMonth(this.nativeDate));
}
return null;
}
/**
* @param {?} date
* @param {?} grain
* @return {?}
*/
isSame(date, grain) {
// TODO: Precipitate into a function "compare()"
if (date) {
/** @type {?} */
const left = this.toNativeDate();
/** @type {?} */
const right = this.toNativeDate(date);
switch (grain) {
case 'year':
return left.getFullYear() === right.getFullYear();
case 'month':
return left.getFullYear() === right.getFullYear() && left.getMonth() === right.getMonth();
case 'day':
return (left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate());
case 'hour':
return (left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours());
case 'minute':
return (left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() === right.getMinutes());
case 'second':
return (left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() === right.getMinutes() &&
left.getSeconds() === right.getSeconds());
}
}
return false;
}
/**
* @param {?} date
* @param {?} grain
* @return {?}
*/
isAfter(date, grain) {
// TODO: Precipitate into a function "compare()"
if (date) {
/** @type {?} */
const left = this.toNativeDate();
/** @type {?} */
const right = this.toNativeDate(date);
switch (grain) {
case 'year':
return left.getFullYear() > right.getFullYear();
case 'month':
return (left.getFullYear() > right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() > right.getMonth()));
case 'day':
return (left.getFullYear() > right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() > right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() > right.getDate()));
case 'hour':
return (left.getFullYear() > right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() > right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() > right.getDate()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() > right.getHours()));
case 'minute':
return (left.getFullYear() > right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() > right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() > right.getDate()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() > right.getHours()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() > right.getMinutes()));
case 'second':
return (left.getFullYear() > right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() > right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() > right.getDate()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() > right.getHours()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() > right.getMinutes()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() === right.getMinutes() &&
left.getSeconds() > right.getSeconds()));
}
}
return false;
}
// TODO: Precipitate into a function "compare()"
/**
* @param {?} date
* @param {?} grain
* @return {?}
*/
isBefore(date, grain) {
if (date) {
/** @type {?} */
const left = this.toNativeDate();
/** @type {?} */
const right = this.toNativeDate(date);
switch (grain) {
case 'year':
return left.getFullYear() < right.getFullYear();
case 'month':
return (left.getFullYear() < right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() < right.getMonth()));
case 'day':
return (left.getFullYear() < right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() < right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() < right.getDate()));
case 'hour':
return (left.getFullYear() < right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() < right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() < right.getDate()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() < right.getHours()));
case 'minute':
return (left.getFullYear() < right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() < right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() < right.getDate()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() < right.getHours()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() < right.getMinutes()));
case 'second':
return (left.getFullYear() < right.getFullYear() ||
(left.getFullYear() === right.getFullYear() && left.getMonth() < right.getMonth()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() < right.getDate()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() < right.getHours()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() < right.getMinutes()) ||
(left.getFullYear() === right.getFullYear() &&
left.getMonth() === right.getMonth() &&
left.getDate() === right.getDate() &&
left.getHours() === right.getHours() &&
left.getMinutes() === right.getMinutes() &&
left.getSeconds() < right.getSeconds()));
}
}
return false;
}
// Equal to today accurate to "day"
/**
* @return {?}
*/
isToday() {
return this.isSame(new Date(), 'day');
}
/**
* @return {?}
*/
isInvalid() {
return isNaN(this.nativeDate.valueOf());
}
/**
* @private
* @param {?=} date
* @return {?}
*/
toNativeDate(date = this) {
return date instanceof CandyDate ? date.nativeDate : date;
}
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class CalendarFooterComponent {
constructor() {
this.showToday = false;
this.hasTimePicker = false;
this.isRange = false;
this.showTimePicker = false;
this.showTimePickerChange = new EventEmitter();
this.timePickerDisabled = false;
this.okDisabled = false;
this.clickOk = new EventEmitter();
this.clickToday = new EventEmitter();
this.prefixCls = 'ant-calendar';
this.isTemplateRef = isTemplateRef;
this.isNonEmptyString = isNonEmptyString;
}
}
CalendarFooterComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'calendar-footer',
exportAs: 'calendarFooter',
template: "<div class=\"{{ prefixCls }}-footer {{ isRange ? prefixCls + '-range-bottom' : '' }} {{ hasTimePicker ? prefixCls + '-footer-show-ok' : '' }}\">\n <div *ngIf=\"rangeQuickSelector\" class=\"{{ prefixCls }}-footer-extra {{ prefixCls }}-range-quick-selector\">\n <ng-container *ngTemplateOutlet=\"rangeQuickSelector\"></ng-container>\n </div>\n <div *ngIf=\"extraFooter\" class=\"{{ prefixCls }}-footer-extra {{ isRange ? prefixCls + '-range-quick-selector' : '' }}\">\n <ng-container [ngSwitch]=\"true\">\n <ng-container *ngSwitchCase=\"isTemplateRef(extraFooter)\">\n <ng-container *ngTemplateOutlet=\"extraFooter\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"isNonEmptyString(extraFooter)\">\n <span [innerHTML]=\"extraFooter\"></span>\n </ng-container>\n </ng-container>\n </div>\n <span *ngIf=\"showToday || hasTimePicker\" class=\"{{ prefixCls }}-footer-btn\">\n <today-button\n *ngIf=\"showToday\"\n [locale]=\"locale\"\n [disabledDate]=\"disabledDate\"\n [hasTimePicker]=\"hasTimePicker\"\n (clickToday)=\"clickToday.emit($event)\"\n ></today-button>\n <time-picker-button\n *ngIf=\"hasTimePicker\"\n [locale]=\"locale\"\n [timePickerDisabled]=\"timePickerDisabled\"\n [showTimePicker]=\"showTimePicker\"\n (showTimePickerChange)=\"showTimePickerChange.emit($event)\"\n ></time-picker-button>\n <ok-button\n *ngIf=\"hasTimePicker\"\n [okDisabled]=\"okDisabled\"\n [locale]=\"locale\"\n (clickOk)=\"clickOk.emit()\"\n ></ok-button>\n </span>\n</div>"
}] }
];
CalendarFooterComponent.propDecorators = {
locale: [{ type: Input }],
showToday: [{ type: Input }],
hasTimePicker: [{ type: Input }],
isRange: [{ type: Input }],
showTimePicker: [{ type: Input }],
showTimePickerChange: [{ type: Output }],
timePickerDisabled: [{ type: Input }],
okDisabled: [{ type: Input }],
disabledDate: [{ type: Input }],
extraFooter: [{ type: Input }],
rangeQuickSelector: [{ type: Input }],
clickOk: [{ type: Output }],
clickToday: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class CalendarHeaderComponent {
// Indicate whether should change to month panel when current is year panel (if referer=month, it should show month panel when choosed a year)
/**
* @param {?} dateHelper
*/
constructor(dateHelper) {
this.dateHelper = dateHelper;
this.enablePrev = true;
this.enableNext = true;
this.showTimePicker = false;
this.valueChange = new EventEmitter();
this.panelModeChange = new EventEmitter();
this.chooseDecade = new EventEmitter();
this.chooseYear = new EventEmitter();
this.chooseMonth = new EventEmitter();
this.prefixCls = 'ant-calendar';
this.yearToMonth = false; // Indicate whether should change to month panel when current is year panel (if referer=month, it should show month panel when choosed a year)
}
/**
* @return {?}
*/
ngOnInit() {
if (!this.value) {
this.value = new CandyDate(); // Show today by default
}
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.value || changes.showTimePicker || changes.panelMode) {
this.render();
}
}
/**
* @return {?}
*/
previousYear() {
this.gotoYear(-1);
}
/**
* @return {?}
*/
nextYear() {
this.gotoYear(1);
}
/**
* @return {?}
*/
previousMonth() {
this.gotoMonth(-1);
}
/**
* @return {?}
*/
nextMonth() {
this.gotoMonth(1);
}
/**
* @param {?} mode
* @param {?=} value
* @return {?}
*/
changePanel(mode, value) {
this.panelModeChange.emit(mode);
if (value) {
this.changeValueFromInside(value);
}
}
/**
* @param {?} value
* @return {?}
*/
onChooseDecade(value) {
this.changePanel('year', value);
this.chooseDecade.emit(value);
}
/**
* @param {?} value
* @return {?}
*/
onChooseYear(value) {
this.changePanel(this.yearToMonth ? 'month' : 'date', value);
this.yearToMonth = false; // Clear
this.chooseYear.emit(value);
}
/**
* @param {?} value
* @return {?}
*/
onChooseMonth(value) {
this.changePanel('date', value);
this.yearToMonth = false; // Clear
this.chooseMonth.emit(value);
}
/**
* @return {?}
*/
changeToMonthPanel() {
this.changePanel('month');
this.yearToMonth = true;
}
/**
* @private
* @return {?}
*/
render() {
if (this.value) {
this.yearMonthDaySelectors = this.createYearMonthDaySelectors();
}
}
/**
* @private
* @param {?} amount
* @return {?}
*/
gotoMonth(amount) {
this.changeValueFromInside(this.value.addMonths(amount));
}
/**
* @private
* @param {?} amount
* @return {?}
*/
gotoYear(amount) {
this.changeValueFromInside(this.value.addYears(amount));
}
/**
* @private
* @param {?} value
* @return {?}
*/
changeValueFromInside(value) {
if (this.value !== value) {
this.value = value;
this.valueChange.emit(this.value);
this.render();
}
}
/**
* @private
* @param {?} localeFormat
* @return {?}
*/
formatDateTime(localeFormat) {
return this.dateHelper.format(this.value.nativeDate, localeFormat);
}
/**
* @private
* @return {?}
*/
createYearMonthDaySelectors() {
/** @type {?} */
let year;
/** @type {?} */
let month;
/** @type {?} */
let day;
// NOTE: Compat for DatePipe formatting rules
/** @type {?} */
let yearFormat = this.locale.yearFormat;
if (this.dateHelper.relyOnDatePipe) {
yearFormat = ((/** @type {?} */ (this.dateHelper))).transCompatFormat(yearFormat);
}
year = {
className: `${this.prefixCls}-year-select`,
title: this.locale.yearSelect,
onClick: (/**
* @return {?}
*/
() => (this.showTimePicker ? null : this.changePanel('year'))),
label: this.formatDateTime(yearFormat)
};
month = {
className: `${this.prefixCls}-month-select`,
title: this.locale.monthSelect,
onClick: (/**
* @return {?}
*/
() => (this.showTimePicker ? null : this.changeToMonthPanel())),
label: this.formatDateTime(this.locale.monthFormat || 'MMM')
};
// NOTE: Compat for DatePipe formatting rules
/** @type {?} */
let dayFormat = this.locale.dayFormat;
if (this.dateHelper.relyOnDatePipe) {
dayFormat = ((/** @type {?} */ (this.dateHelper))).transCompatFormat(dayFormat);
}
if (this.showTimePicker) {
day = {
className: `${this.prefixCls}-day-select`,
label: this.formatDateTime(dayFormat)
};
}
/** @type {?} */
let result;
if (this.locale.monthBeforeYear) {
result = [month, (/** @type {?} */ (day)), year];
}
else {
result = [year, month, (/** @type {?} */ (day))];
}
return result.filter((/**
* @param {?} selector
* @return {?}
*/
selector => !!selector));
}
}
CalendarHeaderComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'calendar-header',
exportAs: 'calendarHeader',
template: "<div class=\"{{ prefixCls }}-header\">\n <div style=\"position: relative;\">\n <a *ngIf=\"enablePrev && !showTimePicker\"\n class=\"{{ prefixCls }}-prev-year-btn\"\n role=\"button\"\n (click)=\"previousYear()\"\n title=\"{{ locale.previousYear }}\"\n ></a>\n <a *ngIf=\"enablePrev && !showTimePicker\"\n class=\"{{ prefixCls }}-prev-month-btn\"\n role=\"button\"\n (click)=\"previousMonth()\"\n title=\"{{ locale.previousMonth }}\"\n ></a>\n\n <span class=\"{{ prefixCls }}-{{ locale.monthBeforeYear ? 'my-select' : 'ym-select' }}\">\n <ng-container *ngFor=\"let selector of yearMonthDaySelectors\">\n <a class=\"{{ selector.className }}\"\n role=\"button\"\n (click)=\"selector.onClick ? selector.onClick() : null\"\n title=\"{{ selector.title || null }}\"\n >\n {{ selector.label }}\n </a>\n </ng-container>\n </span>\n\n <a *ngIf=\"enableNext && !showTimePicker\"\n class=\"{{ prefixCls }}-next-month-btn\"\n role=\"button\"\n (click)=\"nextMonth()\"\n title=\"{{ locale.nextMonth }}\"\n ></a>\n <a *ngIf=\"enableNext && !showTimePicker\"\n class=\"{{ prefixCls }}-next-year-btn\"\n role=\"button\"\n (click)=\"nextYear()\"\n title=\"{{ locale.nextYear }}\"\n ></a>\n </div>\n\n <ng-container [ngSwitch]=\"panelMode\">\n <ng-container *ngSwitchCase=\"'decade'\">\n <decade-panel\n [locale]=\"locale\"\n [value]=\"value\"\n (valueChange)=\"onChooseDecade($event)\"\n ></decade-panel>\n </ng-container>\n <ng-container *ngSwitchCase=\"'year'\">\n <year-panel\n [locale]=\"locale\"\n [value]=\"value\"\n [disabledDate]=\"disabledYear\"\n (valueChange)=\"onChooseYear($event)\"\n (decadePanelShow)=\"changePanel('decade')\"\n ></year-panel>\n </ng-container>\n <ng-container *ngSwitchCase=\"'month'\">\n <month-panel\n [locale]=\"locale\"\n [value]=\"value\"\n [disabledDate]=\"disabledMonth\"\n (valueChange)=\"onChooseMonth($event)\"\n (yearPanelShow)=\"changePanel('year')\"\n ></month-panel>\n </ng-container>\n </ng-container>\n</div>"
}] }
];
/** @nocollapse */
CalendarHeaderComponent.ctorParameters = () => [
{ type: DateHelperService }
];
CalendarHeaderComponent.propDecorators = {
locale: [{ type: Input }],
enablePrev: [{ type: Input }],
enableNext: [{ type: Input }],
disabledMonth: [{ type: Input }],
disabledYear: [{ type: Input }],
showTimePicker: [{ type: Input }],
value: [{ type: Input }],
valueChange: [{ type: Output }],
panelMode: [{ type: Input }],
panelModeChange: [{ type: Output }],
chooseDecade: [{ type: Output }],
chooseYear: [{ type: Output }],
chooseMonth: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class CalendarInputComponent {
/**
* @param {?} dateHelper
*/
constructor(dateHelper) {
this.dateHelper = dateHelper;
this.valueChange = new EventEmitter();
this.prefixCls = 'ant-calendar';
this.invalidInputClass = '';
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @param {?} event
* @return {?}
*/
onInputKeyup(event) {
/** @type {?} */
const date = this.checkValidInputDate(event);
if (!date || (this.disabledDate && this.disabledDate(date.nativeDate))) {
return;
}
if (!date.isSame(this.value, 'second')) {
// Not same with original value
this.value = date;
this.valueChange.emit(this.value);
}
}
/**
* @param {?} value
* @return {?}
*/
toReadableInput(value) {
return value ? this.dateHelper.format(value.nativeDate, this.format) : '';
}
/**
* @private
* @param {?} event
* @return {?}
*/
checkValidInputDate(event) {
/** @type {?} */
const input = ((/** @type {?} */ (event.target))).value;
/** @type {?} */
const date = new CandyDate(input);
this.invalidInputClass = '';
if (date.isInvalid() || input !== this.toReadableInput(date)) {
// Should also match the input format exactly
this.invalidInputClass = `${this.prefixCls}-input-invalid`;
return null;
}
return date;
}
}
CalendarInputComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'calendar-input',
exportAs: 'calendarInput',
template: "<div class=\"{{ prefixCls }}-input-wrap\">\n <div class=\"{{ prefixCls }}-date-input-wrap\">\n <input\n class=\"{{ prefixCls }}-input {{ invalidInputClass }}\"\n placeholder=\"{{ placeholder || locale.dateSelect }}\"\n value=\"{{ toReadableInput(value) }}\"\n (keyup)=\"onInputKeyup($event)\"\n />\n </div>\n <a class=\"{{ prefixCls }}-clear-btn\" role=\"button\" title=\"{{ locale.clear }}\">\n <!--<i nz-icon type=\"close\"></i>-->\n </a>\n</div>"
}] }
];
/** @nocollapse */
CalendarInputComponent.ctorParameters = () => [
{ type: DateHelperService }
];
CalendarInputComponent.propDecorators = {
locale: [{ type: Input }],
format: [{ type: Input }],
placeholder: [{ type: Input }],
disabledDate: [{ type: Input }],
value: [{ type: Input }],
valueChange: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class OkButtonComponent {
constructor() {
this.okDisabled = false;
this.clickOk = new EventEmitter();
this.prefixCls = 'ant-calendar';
}
}
OkButtonComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'ok-button',
exportAs: 'okButton',
template: "<a\n class=\"{{ prefixCls }}-ok-btn {{ okDisabled ? prefixCls + '-ok-btn-disabled' : '' }}\"\n role=\"button\"\n (click)=\"okDisabled ? null : clickOk.emit()\"\n >\n {{ locale.ok }}\n </a>"
}] }
];
OkButtonComponent.propDecorators = {
locale: [{ type: Input }],
okDisabled: [{ type: Input }],
clickOk: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class TimePickerButtonComponent {
constructor() {
this.timePickerDisabled = false;
this.showTimePicker = false;
this.showTimePickerChange = new EventEmitter();
this.prefixCls = 'ant-calendar';
}
/**
* @return {?}
*/
onClick() {
this.showTimePicker = !this.showTimePicker;
this.showTimePickerChange.emit(this.showTimePicker);
}
}
TimePickerButtonComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'time-picker-button',
exportAs: 'timePickerButton',
template: "<a\n class=\"{{ prefixCls }}-time-picker-btn {{ timePickerDisabled ? prefixCls + '-time-picker-btn-disabled' : '' }}\"\n role=\"button\"\n (click)=\"timePickerDisabled ? null : onClick()\"\n>\n {{ showTimePicker ? locale.dateSelect : locale.timeSelect }}\n</a>"
}] }
];
TimePickerButtonComponent.propDecorators = {
locale: [{ type: Input }],
timePickerDisabled: [{ type: Input }],
showTimePicker: [{ type: Input }],
showTimePickerChange: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class TodayButtonComponent {
/**
* @param {?} dateHelper
*/
constructor(dateHelper) {
this.dateHelper = dateHelper;
this.hasTimePicker = false;
this.clickToday = new EventEmitter();
this.prefixCls = 'ant-calendar';
this.isDisabled = false;
this.now = new CandyDate();
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.disabledDate) {
this.isDisabled = this.disabledDate && this.disabledDate(this.now.nativeDate);
}
if (changes.locale) {
// NOTE: Compat for DatePipe formatting rules
/** @type {?} */
let dateFormat = this.locale.dateFormat;
if (this.dateHelper.relyOnDatePipe) {
dateFormat = ((/** @type {?} */ (this.dateHelper))).transCompatFormat(dateFormat);
}
this.title = this.dateHelper.format(this.now.nativeDate, dateFormat);
}
}
/**
* @return {?}
*/
onClickToday() {
this.clickToday.emit(this.now.clone()); // To prevent the "now" being modified from outside, we use clone
}
}
TodayButtonComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'today-button',
exportAs: 'todayButton',
template: "<a\n class=\"{{ prefixCls }}-today-btn {{ isDisabled ? prefixCls + '-today-btn-disabled' : '' }}\"\n role=\"button\"\n (click)=\"isDisabled ? null : onClickToday()\"\n title=\"{{ title }}\"\n>\n {{ hasTimePicker ? locale.now : locale.today }}\n</a>"
}] }
];
/** @nocollapse */
TodayButtonComponent.ctorParameters = () => [
{ type: DateHelperService }
];
TodayButtonComponent.propDecorators = {
locale: [{ type: Input }],
hasTimePicker: [{ type: Input }],
disabledDate: [{ type: Input }],
clickToday: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const DATE_ROW_NUM = 6;
/** @type {?} */
const DATE_COL_NUM = 7;
class DateTableComponent {
/**
* @param {?} i18n
* @param {?} dateHelper
*/
constructor(i18n, dateHelper) {
this.i18n = i18n;
this.dateHelper = dateHelper;
this.valueChange = new EventEmitter();
// Customize date content while rendering
this.dayHover = new EventEmitter(); // Emitted when hover on a day by mouse enter
// Emitted when hover on a day by mouse enter
this.prefixCls = 'ant-calendar';
this.isTemplateRef = isTemplateRef;
this.isNonEmptyString = isNonEmptyString;
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (this.isDateRealChange(changes.value) ||
this.isDateRealChange(changes.selectedValue) ||
this.isDateRealChange(changes.hoverValue)) {
this.render();
}
}
/**
* @private
* @param {?} change
* @return {?}
*/
isDateRealChange(change) {
if (change) {
/** @type {?} */
const previousValue = change.previousValue;
/** @type {?} */
const currentValue = change.currentValue;
if (Array.isArray(currentValue)) {
return (!Array.isArray(previousValue) ||
currentValue.length !== previousValue.length ||
currentValue.some((/**
* @param {?} value
* @param {?} index
* @return {?}
*/
(value, index) => !this.isSameDate(previousValue[index], value))));
}
else {
return !this.isSameDate((/** @type {?} */ (previousValue)), currentValue);
}
}
return false;
}
/**
* @private
* @param {?} left
* @param {?} right
* @return {?}
*/
isSameDate(left, right) {
return (!left && !right) || (left && right && right.isSame(left, 'day'));
}
/**
* @private
* @return {?}
*/
render() {
if (this.value) {
this.headWeekDays = this.makeHeadWeekDays();
this.weekRows = this.makeWeekRows();
}
}
/**
* @private
* @param {?} value
* @return {?}
*/
changeValueFromInside(value) {
if (this.value !== value) {
this.valueChange.emit(value);
}
}
/**
* @private
* @return {?}
*/
makeHeadWeekDays() {
/** @type {?} */
const weekDays = [];
/** @type {?} */
const firstDayOfWeek = this.dateHelper.getFirstDayOfWeek();
for (let colIndex = 0; colIndex < DATE_COL_NUM; colIndex++) {
/** @type {?} */
const day = (firstDayOfWeek + colIndex) % DATE_COL_NUM;
/** @type {?} */
const tempDate = this.value.setDay(day);
weekDays[colIndex] = {
short: this.dateHelper.format(tempDate.nativeDate, this.dateHelper.relyOnDatePipe ? 'E' : 'ddd'),
// eg. Tue
veryShort: this.dateHelper.format(tempDate.nativeDate, this.getVeryShortWeekFormat()) // eg. Tu
};
}
return weekDays;
}
/**
* @private
* @return {?}
*/
getVeryShortWeekFormat() {
if (this.dateHelper.relyOnDatePipe) {
return this.i18n
.getLocaleId()
.toLowerCase()
.indexOf('zh') === 0
? 'EEEEE'
: 'EEEEEE'; // Use extreme short for chinese
}
return 'dd';
}
/**
* @private
* @return {?}
*/
makeWeekRows() {
/** @type {?} */
const weekRows = [];
/** @type {?} */
const firstDayOfWeek = this.dateHelper.getFirstDayOfWeek();
/** @type {?} */
const firstDateOfMonth = this.value.setDate(1);
/** @type {?} */
const firstDateOffset = (firstDateOfMonth.getDay() + 7 - firstDayOfWeek) % 7;
/** @type {?} */
const firstDateToShow = firstDateOfMonth.addDays(0 - firstDateOffset);
/** @type {?} */
let increased = 0;
for (let rowIndex = 0; rowIndex < DATE_ROW_NUM; rowIndex++) {
/** @type {?} */
const week = (weekRows[rowIndex] = {
isActive: false,
isCurrent: false,
dateCells: []
});
for (let colIndex = 0; colIndex < DATE_COL_NUM; colIndex++) {
/** @type {?} */
const current = firstDateToShow.addDays(increased++);
/** @type {?} */
const isBeforeMonthYear = this.isBeforeMonthYear(current, this.value);
/** @type {?} */
const isAfterMonthYear = this.isAfterMonthYear(current, this.value);
/** @type {?} */
const cell = {
value: current,
isSelected: false,
isDisabled: false,
isToday: false,
title: this.getDateTitle(current),
customContent: valueFunctionProp(this.dateRender, current),
// Customized content
content: `${current.getDate()}`,
onClick: (/**
* @return {?}
*/
() => this.changeValueFromInside(current)),
onMouseEnter: (/**
* @return {?}
*/
() => this.dayHover.emit(cell.value))
};
if (this.showWeek && !week.weekNum) {
week.weekNum = this.getWeekNum(current);
}
if (current.isToday()) {
cell.isToday = true;
week.isCurrent = true;
}
if (Array.isArray(this.selectedValue) && !isBeforeMonthYear && !isAfterMonthYear) {
// Range selections
/** @type {?} */
const rangeValue = this.hoverValue && this.hoverValue.length ? this.hoverValue : this.selectedValue;
/** @type {?} */
const start = rangeValue[0];
/** @type {?} */
const end = rangeValue[1];
if (start) {
if (current.isSame(start, 'day')) {
cell.isSelectedStartDate = true;
cell.isSelected = true;
week.isActive = true;
}
if (end) {
if (current.isSame(end, 'day')) {
cell.isSelectedEndDate = true;
cell.isSelected = true;
week.isActive = true;
}
else if (current.isAfter(start, 'day') && current.isBefore(end, 'day')) {
cell.isInRange = true;
}
}
}
}
else if (current.isSame(this.value, 'day')) {
cell.isSelected = true;
week.isActive = true;
}
if (this.disabledDate && this.disabledDate(current.nativeDate)) {
cell.isDisabled = true;
}
cell.classMap = {
[`${this.prefixCls}-cell`]: true,
// [`${this.prefixCls}-selected-date`]: false,
[`${this.prefixCls}-today`]: cell.isToday,
[`${this.prefixCls}-last-month-cell`]: isBeforeMonthYear,
[`${this.prefixCls}-next-month-btn-day`]: isAfterMonthYear,
[`${this.prefixCls}-selected-day`]: cell.isSelected,
[`${this.prefixCls}-disabled-cell`]: cell.isDisabled,
[`${this.prefixCls}-selected-start-date`]: !!cell.isSelectedStartDate,
[`${this.prefixCls}-selected-end-date`]: !!cell.isSelectedEndDate,
[`${this.prefixCls}-in-range-cell`]: !!cell.isInRange
};
week.dateCells.push(cell);
}
week.classMap = {
[`${this.prefixCls}-current-week`]: week.isCurrent,
[`${this.prefixCls}-active-week`]: week.isActive
};
}
return weekRows;
}
/**
* @private
* @param {?} date
* @return {?}
*/
getDateTitle(date) {
// NOTE: Compat for DatePipe formatting rules
/** @type {?} */
let dateFormat = (this.locale && this.locale.dateFormat) || 'YYYY-MM-DD';
if (this.dateHelper.relyOnDatePipe) {
dateFormat = ((/** @type {?} */ (this.dateHelper))).transCompatFormat(dateFormat);
}
return this.dateHelper.format(date.nativeDate, dateFormat);
}
/**
* @private
* @param {?} date
* @return {?}
*/
getWeekNum(date) {
return this.dateHelper.getISOWeek(date.nativeDate);
}
/**
* @private
* @param {?} current
* @param {?} target
* @return {?}
*/
isBeforeMonthYear(current, target) {
if (current.getYear() < target.getYear()) {
return true;
}
return current.getYear() === target.getYear() && current.getMonth() < target.getMonth();
}
/**
* @private
* @param {?} current
* @param {?} target
* @return {?}
*/
isAfterMonthYear(current, target) {
if (current.getYear() > target.getYear()) {
return true;
}
return current.getYear() === target.getYear() && current.getMonth() > target.getMonth();
}
}
DateTableComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'date-table',
exportAs: 'dateTable',
template: "<table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n <thead>\n <tr role=\"row\">\n <th *ngIf=\"showWeek\" role=\"columnheader\" class=\"{{ prefixCls }}-column-header {{ prefixCls }}-week-number-header\">\n <span class=\"{{ prefixCls }}-column-header-inner\">x</span>\n </th>\n <th *ngFor=\"let cell of headWeekDays\"\n role=\"columnheader\"\n title=\"{{ cell.short }}\"\n class=\"{{ prefixCls }}-column-header\"\n >\n <span class=\"{{ prefixCls }}-column-header-inner\">{{ cell.veryShort }}</span>\n </th>\n </tr>\n </thead>\n <tbody class=\"{{ prefixCls }}-tbody\">\n <tr *ngFor=\"let row of weekRows\" [ngClass]=\"row.classMap\" role=\"row\">\n <td *ngIf=\"row.weekNum\" role=\"gridcell\" class=\"{{ prefixCls }}-week-number-cell\">\n {{ row.weekNum }}\n </td>\n <td\n *ngFor=\"let cell of row.dateCells\"\n (click)=\"cell.isDisabled ? null : cell.onClick()\"\n (mouseenter)=\"cell.isDisabled ? null : cell.onMouseEnter()\"\n title=\"{{ cell.title }}\"\n [ngClass]=\"cell.classMap\"\n role=\"gridcell\"\n >\n\n <ng-container [ngSwitch]=\"true\">\n <ng-container *ngSwitchCase=\"isTemplateRef(cell.customContent)\">\n <ng-container *ngTemplateOutlet=\"cell.customContent; context: { $implicit: cell.value }\"></ng-container>\n </ng-container>\n <ng-container *ngSwitchCase=\"isNonEmptyString(cell.customContent)\">\n <span [innerHTML]=\"cell.customContent\"></span>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <div\n class=\"{{ prefixCls }}-date\"\n [attr.aria-selected]=\"cell.isSelected\"\n [attr.aria-disabled]=\"cell.isDisabled\"\n >\n {{ cell.content }}\n </div>\n </ng-container>\n </ng-container>\n\n </td>\n </tr>\n </tbody>\n</table>"
}] }
];
/** @nocollapse */
DateTableComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: DateHelperService }
];
DateTableComponent.propDecorators = {
locale: [{ type: Input }],
selectedValue: [{ type: Input }],
hoverValue: [{ type: Input }],
value: [{ type: Input }],
valueChange: [{ type: Output }],
showWeek: [{ type: Input }],
disabledDate: [{ type: Input }],
dateRender: [{ type: Input }],
dayHover: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const MAX_ROW = 4;
/** @type {?} */
const MAX_COL = 3;
class DecadePanelComponent {
constructor() {
this.valueChange = new EventEmitter();
this.prefixCls = 'ant-calendar-decade-panel';
}
/**
* @return {?}
*/
get startYear() {
return parseInt(`${this.value.getYear() / 100}`, 10) * 100;
}
/**
* @return {?}
*/
get endYear() {
return this.startYear + 99;
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.value) {
this.render();
}
}
/**
* @return {?}
*/
previousCentury() {
this.gotoYear(-100);
}
/**
* @return {?}
*/
nextCentury() {
this.gotoYear(100);
}
/**
* @param {?} _index
* @param {?} decadeData
* @return {?}
*/
trackPanelDecade(_index, decadeData) {
return decadeData.content;
}
/**
* @private
* @return {?}
*/
render() {
if (this.value) {
this.panelDecades = this.makePanelDecades();
}
}
// Re-render panel content by the header's buttons (NOTE: Do not try to trigger final value change)
/**
* @private
* @param {?} amount
* @return {?}
*/
gotoYear(amount) {
this.value = this.value.addYears(amount);
// this.valueChange.emit(this.value); // Do not try to trigger final value change
this.render();
}
/**
* @private
* @param {?} startYear
* @return {?}
*/
chooseDecade(startYear) {
this.value = this.value.setYear(startYear);
this.valueChange.emit(this.value);
}
/**
* @private
* @return {?}
*/
makePanelDecades() {
/** @type {?} */
const decades = [];
/** @type {?} */
const currentYear = this.value.getYear();
/** @type {?} */
const startYear = this.startYear;
/** @type {?} */
const endYear = this.endYear;
/** @type {?} */
const previousYear = startYear - 10;
/** @type {?} */
let index = 0;
for (let rowIndex = 0; rowIndex < MAX_ROW; rowIndex++) {
decades[rowIndex] = [];
for (let colIndex = 0; colIndex < MAX_COL; colIndex++) {
/** @type {?} */
const start = previousYear + index * 10;
/** @type {?} */
const end = previousYear + index * 10 + 9;
/** @type {?} */
const content = `${start}-${end}`;
/** @type {?} */
const cell = (decades[rowIndex][colIndex] = {
content,
title: content,
isCurrent: currentYear >= start && currentYear <= end,
isLowerThanStart: end < startYear,
isBiggerThanEnd: start > endYear,
classMap: null,
onClick: null
});
cell.classMap = {
[`${this.prefixCls}-cell`]: true,
[`${this.prefixCls}-selected-cell`]: cell.isCurrent,
[`${this.prefixCls}-last-century-cell`]: cell.isLowerThanStart,
[`${this.prefixCls}-next-century-cell`]: cell.isBiggerThanEnd
};
if (cell.isLowerThanStart) {
cell.onClick = (/**
* @return {?}
*/
() => this.previousCentury());
}
else if (cell.isBiggerThanEnd) {
cell.onClick = (/**
* @return {?}
*/
() => this.nextCentury());
}
else {
cell.onClick = (/**
* @return {?}
*/
() => this.chooseDecade(start));
}
index++;
}
}
return decades;
}
}
DecadePanelComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'decade-panel',
exportAs: 'decadePanel',
template: "<div class=\"{{ prefixCls }}\">\n <div class=\"{{ prefixCls }}-header\">\n <a\n class=\"{{ prefixCls }}-prev-century-btn\"\n role=\"button\"\n (click)=\"previousCentury()\"\n title=\"{{ locale.previousCentury }}\"\n ></a>\n\n <div class=\"{{ prefixCls }}-century\">\n {{ startYear }}-{{ endYear }}\n </div>\n <a\n class=\"{{ prefixCls }}-next-century-btn\"\n role=\"button\"\n (click)=\"nextCentury()\"\n title=\"{{ locale.nextCentury }}\"\n ></a>\n </div>\n <div class=\"{{ prefixCls }}-body\">\n <table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n <tbody class=\"{{ prefixCls }}-tbody\">\n <tr *ngFor=\"let row of panelDecades\" role=\"row\">\n <td *ngFor=\"let cell of row; trackBy: trackPanelDecade\"\n role=\"gridcell\"\n title=\"{{ cell.title }}\"\n (click)=\"cell.onClick()\"\n [ngClass]=\"cell.classMap\"\n >\n <a class=\"{{ prefixCls }}-decade\">{{ cell.content }}</a>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n</div>"
}] }
];
/** @nocollapse */
DecadePanelComponent.ctorParameters = () => [];
DecadePanelComponent.propDecorators = {
locale: [{ type: Input }],
value: [{ type: Input }],
valueChange: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class MonthPanelComponent {
constructor() {
this.valueChange = new EventEmitter();
this.yearPanelShow = new EventEmitter();
this.prefixCls = 'ant-calendar-month-panel';
}
/**
* @return {?}
*/
previousYear() {
this.gotoYear(-1);
}
/**
* @return {?}
*/
nextYear() {
this.gotoYear(1);
}
// Re-render panel content by the header's buttons (NOTE: Do not try to trigger final value change)
/**
* @private
* @param {?} amount
* @return {?}
*/
gotoYear(amount) {
this.value = this.value.addYears(amount);
// this.valueChange.emit(this.value); // Do not try to trigger final value change
}
}
MonthPanelComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'month-panel',
// tslint:disable-line:component-selector
exportAs: 'monthPanel',
template: "<div class=\"{{ prefixCls }}\">\n <div>\n <div class=\"{{ prefixCls }}-header\">\n <a\n class=\"{{ prefixCls }}-prev-year-btn\"\n role=\"button\"\n (click)=\"previousYear()\"\n title=\"{{ locale.previousYear }}\"\n ></a>\n\n <a\n class=\"{{ prefixCls }}-year-select\"\n role=\"button\"\n (click)=\"yearPanelShow.emit()\"\n title=\"{{ locale.yearSelect }}\"\n >\n <span class=\"{{ prefixCls }}-year-select-content\">{{ value.getYear() }}</span>\n <span class=\"{{ prefixCls }}-year-select-arrow\">x</span>\n </a>\n\n <a\n class=\"{{ prefixCls }}-next-year-btn\"\n role=\"button\"\n (click)=\"nextYear()\"\n title=\"{{ locale.nextYear }}\"\n ></a>\n </div>\n <div class=\"{{ prefixCls }}-body\">\n <month-table [disabledDate]=\"disabledDate\" [value]=\"value\" (valueChange)=\"valueChange.emit($event)\"></month-table>\n </div>\n </div>\n</div>"
}] }
];
MonthPanelComponent.propDecorators = {
locale: [{ type: Input }],
value: [{ type: Input }],
disabledDate: [{ type: Input }],
valueChange: [{ type: Output }],
yearPanelShow: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const MAX_ROW$1 = 4;
/** @type {?} */
const MAX_COL$1 = 3;
class MonthTableComponent {
/**
* @param {?} dateHelper
*/
constructor(dateHelper) {
this.dateHelper = dateHelper;
this.valueChange = new EventEmitter();
this.prefixCls = 'ant-calendar-month-panel';
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.value || changes.disabledDate) {
this.render();
}
}
/**
* @param {?} _index
* @param {?} monthData
* @return {?}
*/
trackPanelMonth(_index, monthData) {
return monthData.month;
}
/**
* @private
* @return {?}
*/
render() {
if (this.value) {
this.panelMonths = this.makePanelMonths();
}
}
/**
* @private
* @return {?}
*/
makePanelMonths() {
/** @type {?} */
const months = [];
/** @type {?} */
const currentMonth = this.value.getMonth();
/** @type {?} */
const today = new CandyDate();
/** @type {?} */
let monthValue = 0;
for (let rowIndex = 0; rowIndex < MAX_ROW$1; rowIndex++) {
months[rowIndex] = [];
for (let colIndex = 0; colIndex < MAX_COL$1; colIndex++) {
/** @type {?} */
const month = this.value.setMonth(monthValue);
/** @type {?} */
const disabled = this.disabledDate ? this.disabledDate(this.value.setMonth(monthValue).nativeDate) : false;
/** @type {?} */
const content = this.dateHelper.format(month.nativeDate, 'MMM');
/** @type {?} */
const cell = (months[rowIndex][colIndex] = {
disabled,
content,
month: monthValue,
title: content,
classMap: null,
onClick: (/**
* @return {?}
*/
() => this.chooseMonth(cell.month))
});
cell.classMap = {
[`${this.prefixCls}-cell`]: true,
[`${this.prefixCls}-cell-disabled`]: disabled,
[`${this.prefixCls}-selected-cell`]: cell.month === currentMonth,
[`${this.prefixCls}-current-cell`]: today.getYear() === this.value.getYear() && cell.month === today.getMonth()
};
monthValue++;
}
}
return months;
}
/**
* @private
* @param {?} month
* @return {?}
*/
chooseMonth(month) {
this.value = this.value.setMonth(month);
this.valueChange.emit(this.value);
this.render();
}
}
MonthTableComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'month-table',
exportAs: 'monthTable',
template: "<table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n <tbody class=\"{{ prefixCls }}-tbody\">\n <tr *ngFor=\"let row of panelMonths\" role=\"row\">\n <td *ngFor=\"let monthCell of row; trackBy: trackPanelMonth\"\n role=\"gridcell\"\n title=\"{{ monthCell.title }}\"\n (click)=\"monthCell.disabled ? null : monthCell.onClick()\"\n [ngClass]=\"monthCell.classMap\"\n >\n <a class=\"{{ prefixCls }}-month\">{{ monthCell.content }}</a>\n </td>\n </tr>\n </tbody>\n</table>"
}] }
];
/** @nocollapse */
MonthTableComponent.ctorParameters = () => [
{ type: DateHelperService }
];
MonthTableComponent.propDecorators = {
value: [{ type: Input }],
valueChange: [{ type: Output }],
disabledDate: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @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
*/
/** @type {?} */
const defaultDisabledTime = {
/**
* @return {?}
*/
nzDisabledHours() {
return [];
},
/**
* @return {?}
*/
nzDisabledMinutes() {
return [];
},
/**
* @return {?}
*/
nzDisabledSeconds() {
return [];
}
};
/**
* @param {?} value
* @param {?} disabledTime
* @return {?}
*/
function getTimeConfig(value, disabledTime) {
/** @type {?} */
let disabledTimeConfig = disabledTime ? disabledTime(value && value.nativeDate) : ((/** @type {?} */ ({})));
disabledTimeConfig = Object.assign({}, defaultDisabledTime, disabledTimeConfig);
return disabledTimeConfig;
}
/**
* @param {?} value
* @param {?} disabledTimeConfig
* @return {?}
*/
function isTimeValidByConfig(value, disabledTimeConfig) {
/** @type {?} */
let invalidTime = false;
if (value) {
/** @type {?} */
const hour = value.getHours();
/** @type {?} */
const minutes = value.getMinutes();
/** @type {?} */
const seconds = value.getSeconds();
/** @type {?} */
const disabledHours = disabledTimeConfig.nzDisabledHours();
if (disabledHours.indexOf(hour) === -1) {
/** @type {?} */
const disabledMinutes = disabledTimeConfig.nzDisabledMinutes(hour);
if (disabledMinutes.indexOf(minutes) === -1) {
/** @type {?} */
const disabledSeconds = disabledTimeConfig.nzDisabledSeconds(hour, minutes);
invalidTime = disabledSeconds.indexOf(seconds) !== -1;
}
else {
invalidTime = true;
}
}
else {
invalidTime = true;
}
}
return !invalidTime;
}
/**
* @param {?} value
* @param {?} disabledTime
* @return {?}
*/
function isTimeValid(value, disabledTime) {
/** @type {?} */
const disabledTimeConfig = getTimeConfig(value, disabledTime);
return isTimeValidByConfig(value, disabledTimeConfig);
}
/**
* @param {?} value
* @param {?=} disabledDate
* @param {?=} disabledTime
* @return {?}
*/
function isAllowedDate(value, disabledDate, disabledTime) {
if (disabledDate) {
if (disabledDate(value.nativeDate)) {
return false;
}
}
if (disabledTime) {
if (!isTimeValid(value, disabledTime)) {
return false;
}
}
return true;
}
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class DateRangePopupComponent {
constructor() {
this.panelModeChange = new EventEmitter();
this.calendarChange = new EventEmitter();
this.valueChange = new EventEmitter();
this.resultOk = new EventEmitter(); // Emitted when done with date selecting
// Emitted when done with date selecting
this.closePicker = new EventEmitter(); // Notify outside to close the picker panel
// Notify outside to close the picker panel
this.prefixCls = 'ant-calendar';
this.showTimePicker = false;
this.partTypeMap = { left: 0, right: 1 };
this.disabledStartTime = (/**
* @param {?} value
* @return {?}
*/
(value) => {
return this.disabledTime && this.disabledTime(value, 'start');
});
this.disabledEndTime = (/**
* @param {?} value
* @return {?}
*/
(value) => {
return this.disabledTime && this.disabledTime(value, 'end');
});
}
// Range ONLY
/**
* @return {?}
*/
get hasTimePicker() {
return !!this.showTime;
}
/**
* @return {?}
*/
get hasFooter() {
return this.showToday || this.hasTimePicker || !!this.extraFooter || !!this.ranges;
}
// tslint:disable-line:no-any
/**
* @return {?}
*/
ngOnInit() {
// Initialization for range properties to prevent errors while later assignment
if (this.isRange) {
['placeholder', 'panelMode', 'selectedValue', 'hoverValue'].forEach((/**
* @param {?} prop
* @return {?}
*/
prop => this.initialArray(prop)));
}
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (this.isRange) {
if (changes.value) {
// Re-initialize all related values
this.clearHoverValue();
this.selectedValue = (/** @type {?} */ (this.value));
this.valueForRangeShow = this.normalizeRangeValue((/** @type {?} */ (this.value)));
}
}
// Parse showTime options
if (changes.showTime || changes.disabledTime) {
if (this.showTime) {
this.buildTimeOptions();
}
}
// Show time picker when assigned panel mode as "time"
if (changes.panelMode && this.hasTimePicker) {
this.showTimePicker = this.panelMode === 'time';
}
}
/**
* @param {?} show
* @return {?}
*/
onShowTimePickerChange(show) {
// this.panelMode = show ? 'time' : 'date';
// this.panelModeChange.emit(this.panelMode);
this.panelModeChange.emit(show ? 'time' : 'date');
}
/**
* @param {?} value
* @return {?}
*/
onClickToday(value) {
// if (this.isRange) { // Show today is not support by range
// throw new Error('"nzShowToday" is not support for "RangePicker"!');
// } else {
if (!this.isRange) {
this.value = null; // Clear current value to not sync time by next step
this.changeValue(value);
}
this.closePickerPanel();
}
/**
* @param {?} value
* @return {?}
*/
onDayHover(value) {
if (this.isRange && this.selectedValue[0] && !this.selectedValue[1]) {
// When right value is selected, don't do hover
/** @type {?} */
const base = this.selectedValue[0];
if (base.isBefore(value, 'day')) {
this.hoverValue = [base, value];
}
else {
this.hoverValue = [value, base];
}
}
}
/**
* @param {?} mode
* @param {?=} partType
* @return {?}
*/
onPanelModeChange(mode, partType) {
if (this.isRange) {
((/** @type {?} */ (this.panelMode)))[this.getPartTypeIndex(partType)] = mode;
}
else {
this.panelMode = mode;
}
this.panelModeChange.emit(this.panelMode);
}
/**
* @param {?} value
* @param {?=} partType
* @return {?}
*/
onHeaderChange(value, partType) {
if (this.isRange) {
this.valueForRangeShow[this.getPartTypeIndex(partType)] = value;
this.valueForRangeShow = this.normalizeRangeValue(this.valueForRangeShow); // Should always take care of start/end
}
}
/**
* @param {?} value
* @param {?=} partType
* @return {?}
*/
onSelectTime(value, partType) {
if (this.isRange) {
/** @type {?} */
const newValue = this.cloneRangeDate((/** @type {?} */ (this.value)));
/** @type {?} */
const index = this.getPartTypeIndex(partType);
newValue[index] = (/** @type {?} */ (this.overrideHms(value, newValue[index])));
this.setValue(newValue);
}
else {
this.setValue((/** @type {?} */ (this.overrideHms(value, ((/** @type {?} */ (this.value))) || new CandyDate())))); // If not select a date currently, use today
}
}
/**
* @param {?} value
* @param {?=} partType
* @return {?}
*/
changeValue(value, partType) {
if (this.isRange) {
/** @type {?} */
const index = this.getPartTypeIndex(partType);
this.selectedValue[index] = value;
if (this.isValidRange(this.selectedValue)) {
this.valueForRangeShow = this.normalizeRangeValue(this.selectedValue);
this.setValue(this.cloneRangeDate(this.selectedValue));
}
}
else {
this.setValue(value);
}
}
/**
* @param {?} value
* @return {?}
*/
changeValueFromSelect(value) {
if (this.isRange) {
const [left, right] = (/** @type {?} */ (this.selectedValue));
if ((!left && !right) || (left && right)) {
// If totally full or empty, clean up && re-assign left first
this.hoverValue = this.selectedValue = [value];
this.calendarChange.emit([value.clone()]);
}
else if (left && !right) {
// If one of them is empty, assign the other one and sort, then set the final values
this.clearHoverValue(); // Clean up
this.setRangeValue('selectedValue', 'right', value);
this.sortRangeValue('selectedValue'); // Sort
this.valueForRangeShow = this.normalizeRangeValue(this.selectedValue);
this.setValue(this.cloneRangeDate(this.selectedValue));
this.calendarChange.emit(this.cloneRangeDate(this.selectedValue));
}
}
else {
this.setValue(value);
}
// this.selectDate.emit(value);
}
/**
* @param {?} direction
* @param {?=} partType
* @return {?}
*/
enablePrevNext(direction, partType) {
if (this.isRange) {
const [start, end] = this.valueForRangeShow;
/** @type {?} */
const showMiddle = !start.addMonths(1).isSame(end, 'month');
if ((partType === 'left' && direction === 'next') || (partType === 'right' && direction === 'prev')) {
return showMiddle;
}
return true;
}
else {
return true;
}
}
/**
* @param {?=} partType
* @return {?}
*/
getPanelMode(partType) {
if (this.isRange) {
return (/** @type {?} */ (this.panelMode[this.getPartTypeIndex(partType)]));
}
else {
return (/** @type {?} */ (this.panelMode));
}
}
// Get single value or part value of a range
/**
* @param {?=} partType
* @return {?}
*/
getValue(partType) {
if (this.isRange) {
return ((/** @type {?} */ (this.value)))[this.getPartTypeIndex(partType)];
}
else {
return (/** @type {?} */ (this.value));
}
}
/**
* @param {?=} partType
* @return {?}
*/
getValueBySelector(partType) {
if (this.isRange) {
/** @type {?} */
const valueShow = this.showTimePicker ? this.value : this.valueForRangeShow;
return ((/** @type {?} */ (valueShow)))[this.getPartTypeIndex(partType)];
}
else {
return (/** @type {?} */ (this.value));
}
}
/**
* @param {?=} partType
* @return {?}
*/
getPartTypeIndex(partType) {
return this.partTypeMap[(/** @type {?} */ (partType))];
}
/**
* @param {?=} partType
* @return {?}
*/
getPlaceholder(partType) {
return this.isRange ? this.placeholder[this.getPartTypeIndex(partType)] : ((/** @type {?} */ (this.placeholder)));
}
/**
* @return {?}
*/
hasSelectedValue() {
return this.selectedValue && !!this.selectedValue[1] && !!this.selectedValue[0];
}
/**
* @return {?}
*/
isAllowedSelectedValue() {
/** @type {?} */
const selectedValue = this.selectedValue;
if (selectedValue && selectedValue[0] && selectedValue[1]) {
return (isAllowedDate(selectedValue[0], this.disabledDate, this.disabledStartTime) &&
isAllowedDate(selectedValue[1], this.disabledDate, this.disabledEndTime));
}
return false;
}
/**
* @return {?}
*/
timePickerDisabled() {
if (!this.hasTimePicker) {
return true;
}
if (this.isRange) {
return !this.hasSelectedValue() || !!this.hoverValue.length;
}
else {
return false;
}
}
/**
* @return {?}
*/
okDisabled() {
if (!this.hasTimePicker) {
return true;
}
if (this.isRange) {
return !this.isAllowedSelectedValue() || !this.hasSelectedValue() || !!this.hoverValue.length;
}
else {
return this.value ? !isAllowedDate((/** @type {?} */ (this.value)), this.disabledDate, this.disabledTime) : false;
}
}
/**
* @param {?=} partType
* @return {?}
*/
getTimeOptions(partType) {
if (this.showTime && this.timeOptions) {
return this.timeOptions instanceof Array ? this.timeOptions[this.getPartTypeIndex(partType)] : this.timeOptions;
}
return null;
}
/**
* @param {?} val
* @return {?}
*/
onClickPresetRange(val) {
/** @type {?} */
const value = typeof val === 'function' ? val() : val;
this.setValue([new CandyDate(value[0]), new CandyDate(value[1])]);
this.resultOk.emit();
}
/**
* @return {?}
*/
onPresetRangeMouseLeave() {
this.clearHoverValue();
}
/**
* @param {?} val
* @return {?}
*/
onHoverPresetRange(val) {
if (typeof val !== 'function') {
this.hoverValue = [new CandyDate(val[0]), new CandyDate(val[1])];
}
}
/**
* @param {?} obj
* @return {?}
*/
getObjectKeys(obj) {
return obj ? Object.keys(obj) : [];
}
/**
* @private
* @return {?}
*/
closePickerPanel() {
this.closePicker.emit();
}
/**
* @private
* @return {?}
*/
clearHoverValue() {
this.hoverValue = [];
}
/**
* @private
* @return {?}
*/
buildTimeOptions() {
if (this.showTime) {
/** @type {?} */
const showTime = typeof this.showTime === 'object' ? this.showTime : {};
if (this.isRange) {
/** @type {?} */
const value = (/** @type {?} */ (this.value));
this.timeOptions = [
this.overrideTimeOptions(showTime, value[0], 'start'),
this.overrideTimeOptions(showTime, value[1], 'end')
];
}
else {
this.timeOptions = this.overrideTimeOptions(showTime, (/** @type {?} */ (this.value)));
}
}
else {
this.timeOptions = null;
}
}
/**
* @private
* @param {?} origin
* @param {?} value
* @param {?=} partial
* @return {?}
*/
overrideTimeOptions(origin, value, partial) {
/** @type {?} */
let disabledTimeFn;
if (partial) {
disabledTimeFn = partial === 'start' ? this.disabledStartTime : this.disabledEndTime;
}
else {
disabledTimeFn = this.disabledTime;
}
return Object.assign({}, origin, getTimeConfig(value, disabledTimeFn));
}
// Set value and trigger change event
/**
* @private
* @param {?} value
* @return {?}
*/
setValue(value) {
/** @type {?} */
const newValue = value;
// TODO: Sync original time (NOTE: this should take more care of beacuse it may depend on many change sources)
// if (this.isRange) {
// // TODO: Sync time
// } else {
// if (this.value) { // Sync time from the original one if it's available
// newValue = this.overrideHms(this.value as CandyDate, newValue as CandyDate);
// }
// }
this.value = newValue;
this.valueChange.emit(this.value);
this.buildTimeOptions();
}
/**
* @private
* @param {?} from
* @param {?} to
* @return {?}
*/
overrideHms(from, to) {
if (!from || !to) {
return null;
}
return to.setHms(from.getHours(), from.getMinutes(), from.getSeconds());
}
// Check if it's a valid range value
/**
* @private
* @param {?} value
* @return {?}
*/
isValidRange(value) {
if (Array.isArray(value)) {
const [start, end] = value;
/** @type {?} */
const grain = this.hasTimePicker ? 'second' : 'day';
return start && end && (start.isBefore(end, grain) || start.isSame(end, grain));
}
return false;
}
/**
* @private
* @param {?} value
* @return {?}
*/
normalizeRangeValue(value) {
const [start, end] = value;
/** @type {?} */
const newStart = start || new CandyDate();
/** @type {?} */
const newEnd = end && end.isSame(newStart, 'month') ? end.addMonths(1) : end || newStart.addMonths(1);
return [newStart, newEnd];
}
// private isEmptyRangeValue(value: CandyDate[]): boolean {
// return !value || !Array.isArray(value) || value.every((val) => !val);
// }
// Sort a range value (accurate to second)
/**
* @private
* @param {?} key
* @return {?}
*/
sortRangeValue(key) {
if (Array.isArray(this[key])) {
const [start, end] = this[key];
if (start && end && start.isAfter(end, 'day')) {
this[key] = [end, start];
}
}
}
// Renew and set a range value to trigger sub-component's change detection
/**
* @private
* @param {?} key
* @param {?} partType
* @param {?} value
* @return {?}
*/
setRangeValue(key, partType, value) {
/** @type {?} */
const ref = (this[key] = this.cloneRangeDate((/** @type {?} */ (this[key]))));
ref[this.getPartTypeIndex(partType)] = value;
}
/**
* @private
* @param {?} value
* @return {?}
*/
cloneRangeDate(value) {
return (/** @type {?} */ ([value[0] && value[0].clone(), value[1] && value[1].clone()]));
}
/**
* @private
* @param {?} key
* @return {?}
*/
initialArray(key) {
if (!this[key] || !Array.isArray(this[key])) {
this[key] = [];
}
}
}
DateRangePopupComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'date-range-popup',
exportAs: 'dateRangePopup',
template: "<div\n class=\"{{ prefixCls }}-picker-container {{ dropdownClassName }} {{ prefixCls }}-picker-container-placement-bottomLeft\"\n [ngStyle]=\"popupStyle\">\n\n <div class=\"{{ prefixCls }} {{ showWeek ? prefixCls + '-week-number': '' }} {{ hasTimePicker ? prefixCls + '-time' : '' }} {{ isRange ? prefixCls + '-range' : '' }}\" tabindex=\"0\">\n <div class=\"{{ prefixCls }}-panel\">\n <ng-container *ngIf=\"!isRange\"> <!-- Single ONLY -->\n <ng-container *ngTemplateOutlet=\"tplCalendarInput\"></ng-container>\n </ng-container>\n <div class=\"{{ prefixCls }}-date-panel\">\n <ng-container *ngIf=\"isRange; else tplSinglePart\">\n <!-- Range Selectors -->\n <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'left' }\"></ng-container>\n <div class=\"ant-calendar-range-middle\">~</div>\n <ng-container *ngTemplateOutlet=\"tplRangePart; context: { partType: 'right' }\"></ng-container>\n </ng-container>\n\n <ng-container *ngIf=\"!isRange\"> <!-- Single ONLY -->\n <ng-container *ngTemplateOutlet=\"tplFooter\"></ng-container>\n </ng-container>\n </div>\n <ng-container *ngIf=\"isRange\"> <!-- Range ONLY -->\n <ng-container *ngTemplateOutlet=\"tplFooter\"></ng-container>\n </ng-container>\n </div>\n </div>\n</div>\n\n<ng-template #tplCalendarInput let-partType=\"partType\">\n <calendar-input\n [value]=\"getValue(partType)\"\n (valueChange)=\"changeValue($event, partType)\"\n [locale]=\"locale\"\n [disabledDate]=\"disabledDate\"\n [format]=\"format\"\n [placeholder]=\"getPlaceholder(partType)\"\n ></calendar-input>\n</ng-template>\n\n<ng-template #tplInnerPopup let-partType=\"partType\">\n <inner-popup\n [showWeek]=\"showWeek\"\n [locale]=\"locale\"\n [showTimePicker]=\"hasTimePicker && showTimePicker\"\n [timeOptions]=\"getTimeOptions(partType)\"\n [panelMode]=\"getPanelMode(partType)\"\n (panelModeChange)=\"onPanelModeChange($event, partType)\"\n [value]=\"getValueBySelector(partType)\"\n [disabledDate]=\"disabledDate\"\n [dateRender]=\"dateRender\"\n [selectedValue]=\"selectedValue\"\n [hoverValue]=\"hoverValue\"\n [enablePrev]=\"enablePrevNext('prev', partType)\"\n [enableNext]=\"enablePrevNext('next', partType)\"\n (dayHover)=\"onDayHover($event)\"\n (selectDate)=\"changeValueFromSelect($event)\"\n (selectTime)=\"onSelectTime($event, partType)\"\n (headerChange)=\"onHeaderChange($event, partType)\"\n ></inner-popup>\n</ng-template>\n\n<ng-template #tplFooter>\n <calendar-footer\n *ngIf=\"hasFooter\"\n [locale]=\"locale\"\n [showToday]=\"showToday\"\n [hasTimePicker]=\"hasTimePicker\"\n [timePickerDisabled]=\"timePickerDisabled()\"\n [okDisabled]=\"okDisabled()\"\n [extraFooter]=\"extraFooter\"\n [rangeQuickSelector]=\"ranges ? tplRangeQuickSelector : null\"\n [(showTimePicker)]=\"showTimePicker\"\n (showTimePickerChange)=\"onShowTimePickerChange($event)\"\n (clickOk)=\"resultOk.emit()\"\n (clickToday)=\"onClickToday($event)\"\n ></calendar-footer>\n</ng-template>\n\n<!-- Single ONLY -->\n<ng-template #tplSinglePart>\n <ng-container *ngTemplateOutlet=\"tplInnerPopup\"></ng-container>\n</ng-template>\n\n<!-- Range ONLY -->\n<ng-template #tplRangePart let-partType=\"partType\">\n <div class=\"{{ prefixCls }}-range-part {{ prefixCls }}-range-{{ partType }}\">\n <ng-container *ngTemplateOutlet=\"tplCalendarInput; context: { partType: partType }\"></ng-container>\n <div style=\"outline: none;\">\n <ng-container *ngTemplateOutlet=\"tplInnerPopup; context: { partType: partType }\"></ng-container>\n </div>\n </div>\n</ng-template>\n\n<!-- Range ONLY: Range Quick Selector -->\n<ng-template #tplRangeQuickSelector>\n <a *ngFor=\"let name of getObjectKeys(ranges)\"\n (click)=\"onClickPresetRange(ranges[name])\"\n (mouseenter)=\"onHoverPresetRange(ranges[name])\"\n (mouseleave)=\"onPresetRangeMouseLeave()\"\n >{{ name }}</a>\n</ng-template>"
}] }
];
DateRangePopupComponent.propDecorators = {
isRange: [{ type: Input }],
showWeek: [{ type: Input }],
locale: [{ type: Input }],
format: [{ type: Input }],
placeholder: [{ type: Input }],
disabledDate: [{ type: Input }],
disabledTime: [{ type: Input }],
showToday: [{ type: Input }],
showTime: [{ type: Input }],
extraFooter: [{ type: Input }],
ranges: [{ type: Input }],
dateRender: [{ type: Input }],
popupStyle: [{ type: Input }],
dropdownClassName: [{ type: Input }],
panelMode: [{ type: Input }],
panelModeChange: [{ type: Output }],
calendarChange: [{ type: Output }],
value: [{ type: Input }],
valueChange: [{ type: Output }],
resultOk: [{ type: Output }],
closePicker: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class InnerPopupComponent {
constructor() {
this.panelModeChange = new EventEmitter();
this.headerChange = new EventEmitter(); // Emitted when user changed the header's value
// Emitted when user changed the header's value
this.selectDate = new EventEmitter(); // Emitted when the date is selected by click the date panel
// Emitted when the date is selected by click the date panel
this.selectTime = new EventEmitter();
this.dayHover = new EventEmitter(); // Emitted when hover on a day by mouse enter
// Emitted when hover on a day by mouse enter
this.prefixCls = 'ant-calendar';
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.value && !this.value) {
this.value = new CandyDate();
}
}
/**
* @param {?} date
* @return {?}
*/
onSelectTime(date) {
this.selectTime.emit(new CandyDate(date));
}
// The value real changed to outside
/**
* @param {?} date
* @return {?}
*/
onSelectDate(date) {
/** @type {?} */
const value = date instanceof CandyDate ? date : new CandyDate(date);
this.selectDate.emit(value);
}
}
InnerPopupComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'inner-popup',
exportAs: 'innerPopup',
template: "<calendar-header\n [(panelMode)]=\"panelMode\"\n (panelModeChange)=\"panelModeChange.emit($event)\"\n [(value)]=\"value\"\n (valueChange)=\"headerChange.emit($event)\"\n [locale]=\"locale\"\n [showTimePicker]=\"showTimePicker\"\n [enablePrev]=\"enablePrev\"\n [enableNext]=\"enableNext\"\n></calendar-header>\n\n<ng-container *ngIf=\"showTimePicker && timeOptions\">\n <nz-time-picker-panel\n [nzInDatePicker]=\"true\"\n [ngModel]=\"value.nativeDate\"\n (ngModelChange)=\"onSelectTime($event)\"\n [format]=\"timeOptions.nzFormat\"\n [nzHourStep]=\"timeOptions.nzHourStep\"\n [nzMinuteStep]=\"timeOptions.nzMinuteStep\"\n [nzSecondStep]=\"timeOptions.nzSecondStep\"\n [nzDisabledHours]=\"timeOptions.nzDisabledHours\"\n [nzDisabledMinutes]=\"timeOptions.nzDisabledMinutes\"\n [nzDisabledSeconds]=\"timeOptions.nzDisabledSeconds\"\n [nzHideDisabledOptions]=\"timeOptions.nzHideDisabledOptions\"\n [nzDefaultOpenValue]=\"timeOptions.nzDefaultOpenValue\"\n [nzAddOn]=\"timeOptions.nzAddOn\"\n ></nz-time-picker-panel>\n</ng-container>\n\n<div class=\"{{ prefixCls }}-body\">\n <date-table\n [locale]=\"locale\"\n [showWeek]=\"showWeek\"\n [value]=\"value\"\n (valueChange)=\"onSelectDate($event)\"\n showWeekNumber=\"false\"\n [disabledDate]=\"disabledDate\"\n [dateRender]=\"dateRender\"\n [selectedValue]=\"selectedValue\"\n [hoverValue]=\"hoverValue\"\n (dayHover)=\"dayHover.emit($event)\"\n ></date-table>\n</div>"
}] }
];
/** @nocollapse */
InnerPopupComponent.ctorParameters = () => [];
InnerPopupComponent.propDecorators = {
showWeek: [{ type: Input }],
locale: [{ type: Input }],
showTimePicker: [{ type: Input }],
timeOptions: [{ type: Input }],
enablePrev: [{ type: Input }],
enableNext: [{ type: Input }],
disabledDate: [{ type: Input }],
dateRender: [{ type: Input }],
selectedValue: [{ type: Input }],
hoverValue: [{ type: Input }],
panelMode: [{ type: Input }],
panelModeChange: [{ type: Output }],
value: [{ type: Input }],
headerChange: [{ type: Output }],
selectDate: [{ type: Output }],
selectTime: [{ type: Output }],
dayHover: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
const MAX_ROW$2 = 4;
/** @type {?} */
const MAX_COL$2 = 3;
class YearPanelComponent {
constructor() {
this.valueChange = new EventEmitter();
this.decadePanelShow = new EventEmitter();
this.prefixCls = 'ant-calendar-year-panel';
}
/**
* @return {?}
*/
get currentYear() {
return this.value.getYear();
}
/**
* @return {?}
*/
get startYear() {
return parseInt(`${this.currentYear / 10}`, 10) * 10;
}
/**
* @return {?}
*/
get endYear() {
return this.startYear + 9;
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.value || changes.disabledDate) {
this.render();
}
}
/**
* @return {?}
*/
previousDecade() {
this.gotoYear(-10);
}
/**
* @return {?}
*/
nextDecade() {
this.gotoYear(10);
}
/**
* @param {?} _index
* @param {?} yearData
* @return {?}
*/
trackPanelYear(_index, yearData) {
return yearData.content;
}
/**
* @private
* @return {?}
*/
render() {
if (this.value) {
this.panelYears = this.makePanelYears();
}
}
// Re-render panel content by the header's buttons (NOTE: Do not try to trigger final value change)
/**
* @private
* @param {?} amount
* @return {?}
*/
gotoYear(amount) {
this.value = this.value.addYears(amount);
// this.valueChange.emit(this.value); // Do not trigger final value change
this.render();
}
/**
* @private
* @param {?} year
* @return {?}
*/
chooseYear(year) {
this.value = this.value.setYear(year);
this.valueChange.emit(this.value);
this.render();
}
/**
* @private
* @return {?}
*/
makePanelYears() {
/** @type {?} */
const years = [];
/** @type {?} */
const currentYear = this.currentYear;
/** @type {?} */
const startYear = this.startYear;
/** @type {?} */
const endYear = this.endYear;
/** @type {?} */
const previousYear = startYear - 1;
/** @type {?} */
let index = 0;
for (let rowIndex = 0; rowIndex < MAX_ROW$2; rowIndex++) {
years[rowIndex] = [];
for (let colIndex = 0; colIndex < MAX_COL$2; colIndex++) {
/** @type {?} */
const year = previousYear + index;
/** @type {?} */
const content = String(year);
/** @type {?} */
const disabled = this.disabledDate ? this.disabledDate(this.value.setYear(year).nativeDate) : false;
/** @type {?} */
const cell = (years[rowIndex][colIndex] = {
disabled,
content,
year,
title: content,
isCurrent: year === currentYear,
isLowerThanStart: year < startYear,
isBiggerThanEnd: year > endYear,
classMap: null,
onClick: null
});
cell.classMap = {
[`${this.prefixCls}-cell`]: true,
[`${this.prefixCls}-selected-cell`]: cell.isCurrent,
[`${this.prefixCls}-cell-disabled`]: disabled,
[`${this.prefixCls}-last-decade-cell`]: cell.isLowerThanStart,
[`${this.prefixCls}-next-decade-cell`]: cell.isBiggerThanEnd
};
if (cell.isLowerThanStart) {
cell.onClick = (/**
* @return {?}
*/
() => this.previousDecade());
}
else if (cell.isBiggerThanEnd) {
cell.onClick = (/**
* @return {?}
*/
() => this.nextDecade());
}
else {
cell.onClick = (/**
* @return {?}
*/
() => this.chooseYear(cell.year));
}
index++;
}
}
return years;
}
}
YearPanelComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
// tslint:disable-next-line:component-selector
selector: 'year-panel',
exportAs: 'yearPanel',
template: "<div class=\"{{ prefixCls }}\">\n <div>\n <div class=\"{{ prefixCls }}-header\">\n <a\n class=\"{{ prefixCls }}-prev-decade-btn\"\n role=\"button\"\n (click)=\"previousDecade()\"\n title=\"{{ locale.previousDecade }}\"\n ></a>\n <a\n class=\"{{ prefixCls }}-decade-select\"\n role=\"button\"\n (click)=\"decadePanelShow.emit()\"\n title=\"{{ locale.decadeSelect }}\"\n >\n <span class=\"{{ prefixCls }}-decade-select-content\">\n {{ startYear }}-{{ endYear }}\n </span>\n <span class=\"{{ prefixCls }}-decade-select-arrow\">x</span>\n </a>\n\n <a class=\"{{ prefixCls }}-next-decade-btn\" (click)=\"nextDecade()\" title=\"{{ locale.nextDecade }}\" role=\"button\"></a>\n </div>\n <div class=\"{{ prefixCls }}-body\">\n <table class=\"{{ prefixCls }}-table\" cellSpacing=\"0\" role=\"grid\">\n <tbody class=\"{{ prefixCls }}-tbody\">\n <tr *ngFor=\"let row of panelYears\" role=\"row\">\n <td *ngFor=\"let yearCell of row; trackBy: trackPanelYear\"\n role=\"gridcell\"\n title=\"{{ yearCell.title }}\"\n (click)=\"yearCell.disabled ? null : yearCell.onClick()\"\n [ngClass]=\"yearCell.classMap\"\n >\n <a class=\"{{ prefixCls }}-year\">{{ yearCell.content }}</a>\n </td>\n </tr>\n </tbody>\n </table>\n </div>\n </div>\n</div>",
styles: [
// Support disabledDate
`
.ant-calendar-year-panel-cell-disabled .ant-calendar-year-panel-year,
.ant-calendar-year-panel-cell-disabled .ant-calendar-year-panel-year:hover {
color: rgba(0, 0, 0, 0.25);
background: #f5f5f5;
cursor: not-allowed;
}
`]
}] }
];
/** @nocollapse */
YearPanelComponent.ctorParameters = () => [];
YearPanelComponent.propDecorators = {
locale: [{ type: Input }],
value: [{ type: Input }],
valueChange: [{ type: Output }],
disabledDate: [{ type: Input }],
decadePanelShow: [{ type: Output }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class LibPackerModule {
}
LibPackerModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule, FormsModule, NzI18nModule, NzTimePickerModule],
exports: [
CalendarHeaderComponent,
CalendarInputComponent,
CalendarFooterComponent,
OkButtonComponent,
TimePickerButtonComponent,
TodayButtonComponent,
DateTableComponent,
YearPanelComponent,
MonthPanelComponent,
MonthTableComponent,
DecadePanelComponent,
InnerPopupComponent,
DateRangePopupComponent
],
declarations: [
CalendarHeaderComponent,
CalendarInputComponent,
CalendarFooterComponent,
OkButtonComponent,
TimePickerButtonComponent,
TodayButtonComponent,
DateTableComponent,
YearPanelComponent,
MonthPanelComponent,
MonthTableComponent,
DecadePanelComponent,
InnerPopupComponent,
DateRangePopupComponent
]
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzPickerComponent {
/**
* @param {?} dateHelper
* @param {?} changeDetector
*/
constructor(dateHelper, changeDetector) {
this.dateHelper = dateHelper;
this.changeDetector = changeDetector;
this.noAnimation = false;
this.isRange = false;
this.open = undefined;
this.valueChange = new EventEmitter();
this.openChange = new EventEmitter(); // Emitted when overlay's open state change
this.prefixCls = 'ant-calendar';
this.animationOpenState = false;
this.overlayOpen = false; // Available when "open"=undefined
// Available when "open"=undefined
this.overlayOffsetY = 0;
this.overlayOffsetX = -2;
this.overlayPositions = (/** @type {?} */ ([
{
// offsetX: -10, // TODO: What a pity, cdk/overlay current not support offset configs even though it already provide these properties
// offsetY: -10,
originX: 'start',
originY: 'top',
overlayX: 'start',
overlayY: 'top'
},
{
originX: 'start',
originY: 'bottom',
overlayX: 'start',
overlayY: 'bottom'
},
{
originX: 'end',
originY: 'top',
overlayX: 'end',
overlayY: 'top'
},
{
originX: 'end',
originY: 'bottom',
overlayX: 'end',
overlayY: 'bottom'
}
]));
this.dropdownAnimation = 'bottom';
this.currentPositionX = 'start';
this.currentPositionY = 'top';
}
/**
* @return {?}
*/
get realOpenState() {
// The value that really decide the open state of overlay
return this.isOpenHandledByUser() ? !!this.open : this.overlayOpen;
}
/**
* @return {?}
*/
ngOnInit() { }
/**
* @return {?}
*/
ngAfterViewInit() {
if (this.autoFocus) {
if (this.isRange) {
/** @type {?} */
const firstInput = (/** @type {?} */ (((/** @type {?} */ (this.pickerInput.nativeElement))).querySelector('input:first-child')));
firstInput.focus(); // Focus on the first input
}
else {
this.pickerInput.nativeElement.focus();
}
}
}
// Show overlay content
/**
* @return {?}
*/
showOverlay() {
if (!this.realOpenState) {
this.overlayOpen = true;
this.openChange.emit(this.overlayOpen);
setTimeout((/**
* @return {?}
*/
() => {
if (this.cdkConnectedOverlay && this.cdkConnectedOverlay.overlayRef) {
this.cdkConnectedOverlay.overlayRef.updatePosition();
}
}));
}
}
/**
* @return {?}
*/
hideOverlay() {
if (this.realOpenState) {
this.overlayOpen = false;
this.openChange.emit(this.overlayOpen);
}
}
/**
* @return {?}
*/
onClickInputBox() {
if (!this.disabled && !this.isOpenHandledByUser()) {
this.showOverlay();
}
}
/**
* @return {?}
*/
onClickBackdrop() {
this.hideOverlay();
}
/**
* @return {?}
*/
onOverlayDetach() {
this.hideOverlay();
}
// NOTE: A issue here, the first time position change, the animation will not be triggered.
// Because the overlay's "positionChange" event is emitted after the content's full shown up.
// All other components like "nz-dropdown" which depends on overlay also has the same issue.
// See: https://github.com/NG-ZORRO/ng-zorro-antd/issues/1429
/**
* @param {?} position
* @return {?}
*/
onPositionChange(position) {
this.dropdownAnimation = position.connectionPair.originY === 'top' ? 'bottom' : 'top';
this.currentPositionX = (/** @type {?} */ (position.connectionPair.originX));
this.currentPositionY = (/** @type {?} */ (position.connectionPair.originY));
this.changeDetector.detectChanges(); // Take side-effects to position styles
}
/**
* @param {?} event
* @return {?}
*/
onClickClear(event) {
event.preventDefault();
event.stopPropagation();
this.value = this.isRange ? [] : null;
this.valueChange.emit(this.value);
}
/**
* @param {?=} partType
* @return {?}
*/
getReadableValue(partType) {
/** @type {?} */
let value;
if (this.isRange) {
value = ((/** @type {?} */ (this.value)))[this.getPartTypeIndex((/** @type {?} */ (partType)))];
}
else {
value = (/** @type {?} */ (this.value));
}
return value ? this.dateHelper.format(value.nativeDate, this.format) : null;
}
/**
* @param {?} partType
* @return {?}
*/
getPartTypeIndex(partType) {
return { left: 0, right: 1 }[partType];
}
/**
* @param {?=} partType
* @return {?}
*/
getPlaceholder(partType) {
return this.isRange ? this.placeholder[this.getPartTypeIndex((/** @type {?} */ (partType)))] : ((/** @type {?} */ (this.placeholder)));
}
/**
* @param {?} value
* @return {?}
*/
isEmptyValue(value) {
if (value === null) {
return true;
}
else if (this.isRange) {
return !value || !Array.isArray(value) || value.every((/**
* @param {?} val
* @return {?}
*/
val => !val));
}
else {
return !value;
}
}
// Whether open state is permanently controlled by user himself
/**
* @return {?}
*/
isOpenHandledByUser() {
return this.open !== undefined;
}
/**
* @return {?}
*/
animationStart() {
if (this.realOpenState) {
this.animationOpenState = true;
}
}
/**
* @return {?}
*/
animationDone() {
this.animationOpenState = this.realOpenState;
}
}
NzPickerComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
selector: 'nz-picker',
exportAs: 'nzPicker',
template: "<span\n cdkOverlayOrigin\n #origin=\"cdkOverlayOrigin\"\n class=\"{{ prefixCls }}-picker {{ size ? prefixCls + '-picker-' + size : '' }} {{ className }}\"\n [ngStyle]=\"style\"\n tabindex=\"0\"\n (click)=\"onClickInputBox()\"\n>\n <!-- Content of single picker -->\n <ng-container *ngIf=\"!isRange\">\n <input\n #pickerInput\n class=\"{{ prefixCls }}-picker-input ant-input\"\n [class.ant-input-lg]=\"size === 'large'\"\n [class.ant-input-sm]=\"size === 'small'\"\n [class.ant-input-disabled]=\"disabled\"\n\n [disabled]=\"disabled\"\n readonly\n value=\"{{ getReadableValue() }}\"\n placeholder=\"{{ getPlaceholder() }}\"\n />\n <ng-container *ngTemplateOutlet=\"tplRightRest\"></ng-container>\n </ng-container>\n\n <!-- Content of range picker -->\n <ng-container *ngIf=\"isRange\">\n <span\n #pickerInput\n class=\"{{ prefixCls }}-picker-input ant-input\"\n [class.ant-input-lg]=\"size === 'large'\"\n [class.ant-input-sm]=\"size === 'small'\"\n [class.ant-input-disabled]=\"disabled\"\n >\n <ng-container *ngTemplateOutlet=\"tplRangeInput; context: { partType: 'left' }\"></ng-container>\n <span class=\"{{ prefixCls }}-range-picker-separator\"> ~ </span>\n <ng-container *ngTemplateOutlet=\"tplRangeInput; context: { partType: 'right' }\"></ng-container>\n <ng-container *ngTemplateOutlet=\"tplRightRest\"></ng-container>\n </span>\n </ng-container>\n</span>\n\n<!-- Input for Range ONLY -->\n<ng-template #tplRangeInput let-partType=\"partType\">\n <input\n class=\"{{ prefixCls }}-range-picker-input\"\n [disabled]=\"disabled\"\n readonly\n value=\"{{ getReadableValue(partType) }}\"\n placeholder=\"{{ getPlaceholder(partType) }}\"\n />\n</ng-template>\n\n<!-- Right operator icons -->\n<ng-template #tplRightRest>\n <i\n nz-icon\n type=\"close-circle\"\n theme=\"fill\"\n *ngIf=\"!disabled && !isEmptyValue(value) && allowClear\"\n class=\"{{ prefixCls }}-picker-clear\"\n (click)=\"onClickClear($event)\"\n ></i>\n <span class=\"{{ prefixCls }}-picker-icon\">\n <i nz-icon type=\"calendar\"></i>\n </span>\n</ng-template>\n\n<!-- Overlay -->\n<ng-template\n cdkConnectedOverlay\n nzConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"origin\"\n [cdkConnectedOverlayOpen]=\"realOpenState\"\n [cdkConnectedOverlayHasBackdrop]=\"!isOpenHandledByUser()\"\n [cdkConnectedOverlayPositions]=\"overlayPositions\"\n (positionChange)=\"onPositionChange($event)\"\n (backdropClick)=\"onClickBackdrop()\"\n (detach)=\"onOverlayDetach()\"\n>\n <div\n [nzNoAnimation]=\"noAnimation\"\n [@slideMotion]=\"dropdownAnimation\"\n (@slideMotion.start)=\"animationStart()\"\n (@slideMotion.done)=\"animationDone()\"\n style=\"position: relative;\"\n [style.left]=\"currentPositionX === 'start' ? '-2px' : '2px'\"\n [style.top]=\"currentPositionY === 'top' ? '-2px' : '2px'\"\n > <!-- Compatible for overlay that not support offset dynamically and immediately -->\n <ng-content></ng-content>\n </div>\n</ng-template>",
animations: [slideMotion],
changeDetection: ChangeDetectionStrategy.OnPush
}] }
];
/** @nocollapse */
NzPickerComponent.ctorParameters = () => [
{ type: DateHelperService },
{ type: ChangeDetectorRef }
];
NzPickerComponent.propDecorators = {
noAnimation: [{ type: Input }],
isRange: [{ type: Input }],
open: [{ type: Input }],
disabled: [{ type: Input }],
placeholder: [{ type: Input }],
allowClear: [{ type: Input }],
autoFocus: [{ type: Input }],
className: [{ type: Input }],
format: [{ type: Input }],
size: [{ type: Input }],
style: [{ type: Input }],
value: [{ type: Input }],
valueChange: [{ type: Output }],
openChange: [{ type: Output }],
origin: [{ type: ViewChild, args: ['origin',] }],
cdkConnectedOverlay: [{ type: ViewChild, args: [CdkConnectedOverlay,] }],
pickerInput: [{ type: ViewChild, args: ['pickerInput',] }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
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)
/**
* The base picker for all common APIs
* @abstract
*/
class AbstractPickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, noAnimation) {
this.i18n = i18n;
this.cdr = cdr;
this.dateHelper = dateHelper;
this.noAnimation = noAnimation;
// --- Common API
this.nzAllowClear = true;
this.nzAutoFocus = false;
this.nzDisabled = false;
this.nzPopupStyle = POPUP_STYLE_PATCH;
this.nzOnOpenChange = new EventEmitter();
this.isRange = false; // Indicate whether the value is a range value
this.destroyed$ = new Subject();
this.isCustomPlaceHolder = false;
// ------------------------------------------------------------------------
// | Control value accessor implements
// ------------------------------------------------------------------------
// NOTE: onChangeFn/onTouchedFn will not be assigned if user not use as ngModel
this.onChangeFn = (/**
* @return {?}
*/
() => void 0);
this.onTouchedFn = (/**
* @return {?}
*/
() => void 0);
}
// Indicate whether the value is a range value
/**
* @return {?}
*/
get realOpenState() {
return this.picker.animationOpenState;
} // Use picker's real open state to let re-render the picker's content when shown up
// Use picker's real open state to let re-render the picker's content when shown up
/**
* @return {?}
*/
initValue() {
this.nzValue = this.isRange ? [] : null;
}
/**
* @return {?}
*/
ngOnInit() {
// Subscribe the every locale change if the nzLocale is not handled by user
if (!this.nzLocale) {
this.i18n.localeChange.pipe(takeUntil(this.destroyed$)).subscribe((/**
* @return {?}
*/
() => this.setLocale()));
}
// Default value
this.initValue();
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
if (changes.nzPopupStyle) {
// Always assign the popup style patch
this.nzPopupStyle = this.nzPopupStyle ? Object.assign({}, this.nzPopupStyle, POPUP_STYLE_PATCH) : POPUP_STYLE_PATCH;
}
// Mark as customized placeholder by user once nzPlaceHolder assigned at the first time
if (changes.nzPlaceHolder && changes.nzPlaceHolder.firstChange && typeof this.nzPlaceHolder !== 'undefined') {
this.isCustomPlaceHolder = true;
}
if (changes.nzLocale) {
// The nzLocale is currently handled by user
this.setDefaultPlaceHolder();
}
}
/**
* @return {?}
*/
ngOnDestroy() {
this.destroyed$.next();
this.destroyed$.complete();
}
/**
* @return {?}
*/
closeOverlay() {
this.picker.hideOverlay();
}
/**
* Common handle for value changes
* @param {?} value changed value
* @return {?}
*/
onValueChange(value) {
this.nzValue = value;
if (this.isRange) {
/** @type {?} */
const vAsRange = (/** @type {?} */ (this.nzValue));
if (vAsRange.length) {
this.onChangeFn([vAsRange[0].nativeDate, vAsRange[1].nativeDate]);
}
else {
this.onChangeFn([]);
}
}
else {
if (this.nzValue) {
this.onChangeFn(((/** @type {?} */ (this.nzValue))).nativeDate);
}
else {
this.onChangeFn(null);
}
}
this.onTouchedFn();
}
/**
* Triggered when overlayOpen changes (different with realOpenState)
* @param {?} open The overlayOpen in picker component
* @return {?}
*/
onOpenChange(open) {
this.nzOnOpenChange.emit(open);
}
/**
* @param {?} value
* @return {?}
*/
writeValue(value) {
this.setValue(value);
this.cdr.markForCheck();
}
// tslint:disable-next-line:no-any
/**
* @param {?} fn
* @return {?}
*/
registerOnChange(fn) {
this.onChangeFn = fn;
}
// tslint:disable-next-line:no-any
/**
* @param {?} fn
* @return {?}
*/
registerOnTouched(fn) {
this.onTouchedFn = fn;
}
/**
* @param {?} disabled
* @return {?}
*/
setDisabledState(disabled) {
this.nzDisabled = disabled;
this.cdr.markForCheck();
}
// ------------------------------------------------------------------------
// | Internal methods
// ------------------------------------------------------------------------
// Reload locale from i18n with side effects
/**
* @private
* @return {?}
*/
setLocale() {
this.nzLocale = this.i18n.getLocaleData('DatePicker', {});
this.setDefaultPlaceHolder();
this.cdr.markForCheck();
}
/**
* @private
* @return {?}
*/
setDefaultPlaceHolder() {
if (!this.isCustomPlaceHolder && this.nzLocale) {
this.nzPlaceHolder = this.isRange ? this.nzLocale.lang.rangePlaceholder : this.nzLocale.lang.placeholder;
}
}
// Safe way of setting value with default
/**
* @private
* @param {?} value
* @return {?}
*/
setValue(value) {
if (this.isRange) {
this.nzValue = value ? ((/** @type {?} */ (value))).map((/**
* @param {?} val
* @return {?}
*/
val => new CandyDate(val))) : [];
}
else {
this.nzValue = value ? new CandyDate((/** @type {?} */ (value))) : null;
}
}
}
AbstractPickerComponent.propDecorators = {
nzAllowClear: [{ type: Input }],
nzAutoFocus: [{ type: Input }],
nzDisabled: [{ type: Input }],
nzOpen: [{ type: Input }],
nzClassName: [{ type: Input }],
nzDisabledDate: [{ type: Input }],
nzLocale: [{ type: Input }],
nzPlaceHolder: [{ type: Input }],
nzPopupStyle: [{ type: Input }],
nzDropdownClassName: [{ type: Input }],
nzSize: [{ type: Input }],
nzStyle: [{ type: Input }],
nzFormat: [{ type: Input }],
nzValue: [{ type: Input }],
nzOnOpenChange: [{ type: Output }],
picker: [{ type: ViewChild, args: [NzPickerComponent,] }]
};
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], AbstractPickerComponent.prototype, "nzAllowClear", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], AbstractPickerComponent.prototype, "nzAutoFocus", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], AbstractPickerComponent.prototype, "nzDisabled", void 0);
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], AbstractPickerComponent.prototype, "nzOpen", void 0);
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class DateRangePickerComponent extends AbstractPickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
this.showWeek = false; // Should show as week picker
this.nzShowToday = true;
this.nzOnPanelChange = new EventEmitter();
this.nzOnCalendarChange = new EventEmitter();
this.nzOnOk = new EventEmitter();
}
/**
* @return {?}
*/
get nzShowTime() {
return this._showTime;
}
/**
* @param {?} value
* @return {?}
*/
set nzShowTime(value) {
this._showTime = typeof value === 'object' ? value : toBoolean(value);
}
/**
* @return {?}
*/
get realShowToday() {
// Range not support nzShowToday currently
return !this.isRange && this.nzShowToday;
}
/**
* @return {?}
*/
ngOnInit() {
super.ngOnInit();
// Default format when it's empty
if (!this.nzFormat) {
if (this.showWeek) {
this.nzFormat = this.dateHelper.relyOnDatePipe ? 'yyyy-ww' : 'YYYY-WW'; // Format for week
}
else {
if (this.dateHelper.relyOnDatePipe) {
this.nzFormat = this.nzShowTime ? 'yyyy-MM-dd HH:mm:ss' : 'yyyy-MM-dd';
}
else {
this.nzFormat = this.nzShowTime ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD';
}
}
}
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
super.ngOnChanges(changes);
if (changes.nzRenderExtraFooter) {
this.extraFooter = valueFunctionProp(this.nzRenderExtraFooter);
}
if (changes.nzShowTime || changes.nzStyle) {
this.setFixedPickerStyle();
}
}
// If has no timepicker and the user select a date by date panel, then close picker
/**
* @param {?} value
* @return {?}
*/
onValueChange(value) {
super.onValueChange(value);
if (!this.nzShowTime) {
this.closeOverlay();
}
}
// Emit nzOnCalendarChange when select date by nz-range-picker
/**
* @param {?} value
* @return {?}
*/
onCalendarChange(value) {
if (this.isRange) {
/** @type {?} */
const rangeValue = value.map((/**
* @param {?} x
* @return {?}
*/
x => x.nativeDate));
this.nzOnCalendarChange.emit(rangeValue);
}
}
// Emitted when done with date selecting
/**
* @return {?}
*/
onResultOk() {
if (this.isRange) {
/** @type {?} */
const value = (/** @type {?} */ (this.nzValue));
if (value.length) {
this.nzOnOk.emit([value[0].nativeDate, value[1].nativeDate]);
}
else {
this.nzOnOk.emit([]);
}
}
else {
if (this.nzValue) {
this.nzOnOk.emit(((/** @type {?} */ (this.nzValue))).nativeDate);
}
else {
this.nzOnOk.emit(null);
}
}
this.closeOverlay();
}
/**
* @param {?} open
* @return {?}
*/
onOpenChange(open) {
this.nzOnOpenChange.emit(open);
}
// Setup fixed style for picker
/**
* @private
* @return {?}
*/
setFixedPickerStyle() {
/** @type {?} */
const showTimeFixes = {};
if (this.nzShowTime) {
showTimeFixes.width = this.isRange ? '350px' : '195px';
}
this.pickerStyle = Object.assign({}, showTimeFixes, this.nzStyle);
}
}
DateRangePickerComponent.decorators = [
{ type: Component, args: [{
template: `` // Just for rollup
}] }
];
/** @nocollapse */
DateRangePickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: NzNoAnimationDirective }
];
DateRangePickerComponent.propDecorators = {
nzDateRender: [{ type: Input }],
nzDisabledTime: [{ type: Input }],
nzRenderExtraFooter: [{ type: Input }],
nzShowToday: [{ type: Input }],
nzMode: [{ type: Input }],
nzRanges: [{ type: Input }],
nzOnPanelChange: [{ type: Output }],
nzOnCalendarChange: [{ type: Output }],
nzShowTime: [{ type: Input }],
nzOnOk: [{ type: Output }]
};
__decorate([
InputBoolean(),
__metadata("design:type", Boolean)
], DateRangePickerComponent.prototype, "nzShowToday", void 0);
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzDatePickerComponent extends DateRangePickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?} renderer
* @param {?} elementRef
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, renderer, elementRef, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
this.noAnimation = noAnimation;
this.isRange = false;
renderer.addClass(elementRef.nativeElement, 'ant-calendar-picker');
}
}
NzDatePickerComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'nz-date-picker',
exportAs: 'nzDatePicker',
template: "<nz-picker\n [isRange]=\"isRange\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n [open]=\"nzOpen\"\n [disabled]=\"nzDisabled\"\n [format]=\"nzFormat\"\n [allowClear]=\"nzAllowClear\"\n [autoFocus]=\"nzAutoFocus\"\n [className]=\"nzClassName\"\n [placeholder]=\"nzPlaceHolder\"\n [size]=\"nzSize\"\n [style]=\"pickerStyle\"\n [noAnimation]=\"noAnimation?.nzNoAnimation\"\n (openChange)=\"onOpenChange($event)\"\n>\n <date-range-popup *ngIf=\"realOpenState\"\n [isRange]=\"isRange\"\n [showWeek]=\"showWeek\"\n [panelMode]=\"nzMode\"\n (panelModeChange)=\"nzOnPanelChange.emit($event)\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n (calendarChange)=\"onCalendarChange($event)\"\n [locale]=\"nzLocale?.lang\"\n [showToday]=\"realShowToday\"\n [showTime]=\"nzShowTime\"\n [format]=\"nzFormat\"\n [dateRender]=\"nzDateRender\"\n [disabledDate]=\"nzDisabledDate\"\n [disabledTime]=\"nzDisabledTime\"\n [placeholder]=\"nzPlaceHolder\"\n [dropdownClassName]=\"nzDropdownClassName\"\n [popupStyle]=\"nzPopupStyle\"\n [extraFooter]=\"extraFooter\"\n [ranges]=\"nzRanges\"\n (resultOk)=\"onResultOk()\"\n (closePicker)=\"closeOverlay()\"\n ></date-range-popup>\n</nz-picker>",
providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef((/**
* @return {?}
*/
() => NzDatePickerComponent))
}
]
}] }
];
/** @nocollapse */
NzDatePickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: Renderer2 },
{ type: ElementRef },
{ type: NzNoAnimationDirective, decorators: [{ type: Host }, { type: Optional }] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* The base picker for header panels, current support: Year/Month
*/
class HeaderPickerComponent extends AbstractPickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
}
/**
* @return {?}
*/
ngOnInit() {
super.ngOnInit();
this.panelMode = this.endPanelMode;
/** @type {?} */
const allHeaderPanels = ['decade', 'year', 'month'];
this.supportPanels = allHeaderPanels.slice(0, allHeaderPanels.indexOf(this.endPanelMode) + 1);
}
/**
* @param {?} changes
* @return {?}
*/
ngOnChanges(changes) {
super.ngOnChanges(changes);
if (changes.nzRenderExtraFooter) {
this.extraFooter = valueFunctionProp(this.nzRenderExtraFooter);
}
}
/**
* @param {?} mode
* @return {?}
*/
onPanelModeChange(mode) {
if (this.supportPanels.indexOf(mode) > -1) {
this.panelMode = mode;
}
else {
// Since the default "click year" logic can be "year panel" -> "date panel", we need force to the end panel otherwise
this.panelMode = this.endPanelMode;
}
}
/**
* @param {?} mode
* @param {?} value
* @return {?}
*/
onChooseValue(mode, value) {
if (this.endPanelMode === mode) {
super.onValueChange(value);
this.closeOverlay();
}
}
/**
* @param {?} open
* @return {?}
*/
onOpenChange(open) {
if (!open) {
this.cleanUp();
}
this.nzOnOpenChange.emit(open);
}
// Restore some initial props to let open as new in next time
/**
* @private
* @return {?}
*/
cleanUp() {
this.panelMode = this.endPanelMode;
}
}
HeaderPickerComponent.decorators = [
{ type: Component, args: [{
template: ``
}] }
];
/** @nocollapse */
HeaderPickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: NzNoAnimationDirective }
];
HeaderPickerComponent.propDecorators = {
nzPlaceHolder: [{ type: Input }],
nzRenderExtraFooter: [{ type: Input }],
nzDefaultValue: [{ type: Input }],
nzFormat: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzMonthPickerComponent extends HeaderPickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?} renderer
* @param {?} elementRef
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, renderer, elementRef, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
this.noAnimation = noAnimation;
this.nzFormat = 'yyyy-MM';
this.endPanelMode = 'month';
renderer.addClass(elementRef.nativeElement, 'ant-calendar-picker');
}
}
NzMonthPickerComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'nz-month-picker',
exportAs: 'nzMonthPicker',
template: "<nz-picker\n [isRange]=\"false\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n [open]=\"nzOpen\"\n [disabled]=\"nzDisabled\"\n [format]=\"nzFormat\"\n [allowClear]=\"nzAllowClear\"\n [autoFocus]=\"nzAutoFocus\"\n [className]=\"nzClassName\"\n [placeholder]=\"nzPlaceHolder\"\n [size]=\"nzSize\"\n [style]=\"nzStyle\"\n [noAnimation]=\"noAnimation?.nzNoAnimation\"\n (openChange)=\"onOpenChange($event)\"\n>\n <div *ngIf=\"realOpenState\">\n <div class=\"ant-calendar-picker-container {{ nzDropdownClassName }} ant-calendar-picker-container-placement-bottomLeft\" [ngStyle]=\"nzPopupStyle\">\n <div class=\"ant-calendar ant-calendar-month ant-calendar-month-calendar\" tabindex=\"0\">\n <div class=\"ant-calendar-month-calendar-content\">\n <div class=\"ant-calendar-month-header-wrap\">\n <calendar-header\n [disabledMonth]=\"nzDisabledDate\"\n [disabledYear]=\"nzDisabledDate\"\n [panelMode]=\"panelMode\"\n (panelModeChange)=\"onPanelModeChange($event)\"\n [value]=\"nzValue\"\n (chooseYear)=\"onChooseValue('year', $event)\"\n (chooseMonth)=\"onChooseValue('month', $event)\"\n [locale]=\"nzLocale.lang\"\n [enablePrev]=\"true\"\n [enableNext]=\"true\"\n ></calendar-header>\n </div>\n <calendar-footer *ngIf=\"extraFooter\" [extraFooter]=\"extraFooter\"></calendar-footer>\n </div>\n </div>\n </div>\n </div>\n</nz-picker>",
providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef((/**
* @return {?}
*/
() => NzMonthPickerComponent))
}
]
}] }
];
/** @nocollapse */
NzMonthPickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: Renderer2 },
{ type: ElementRef },
{ type: NzNoAnimationDirective, decorators: [{ type: Host }, { type: Optional }] }
];
NzMonthPickerComponent.propDecorators = {
nzFormat: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzRangePickerComponent extends DateRangePickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?} renderer
* @param {?} elementRef
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, renderer, elementRef, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
this.noAnimation = noAnimation;
this.isRange = true;
renderer.addClass(elementRef.nativeElement, 'ant-calendar-picker');
}
}
NzRangePickerComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'nz-range-picker',
exportAs: 'nzRangePicker',
template: "<nz-picker\n [isRange]=\"isRange\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n [open]=\"nzOpen\"\n [disabled]=\"nzDisabled\"\n [format]=\"nzFormat\"\n [allowClear]=\"nzAllowClear\"\n [autoFocus]=\"nzAutoFocus\"\n [className]=\"nzClassName\"\n [placeholder]=\"nzPlaceHolder\"\n [size]=\"nzSize\"\n [style]=\"pickerStyle\"\n [noAnimation]=\"noAnimation?.nzNoAnimation\"\n (openChange)=\"onOpenChange($event)\"\n>\n <date-range-popup *ngIf=\"realOpenState\"\n [isRange]=\"isRange\"\n [showWeek]=\"showWeek\"\n [panelMode]=\"nzMode\"\n (panelModeChange)=\"nzOnPanelChange.emit($event)\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n (calendarChange)=\"onCalendarChange($event)\"\n [locale]=\"nzLocale?.lang\"\n [showToday]=\"realShowToday\"\n [showTime]=\"nzShowTime\"\n [format]=\"nzFormat\"\n [dateRender]=\"nzDateRender\"\n [disabledDate]=\"nzDisabledDate\"\n [disabledTime]=\"nzDisabledTime\"\n [placeholder]=\"nzPlaceHolder\"\n [dropdownClassName]=\"nzDropdownClassName\"\n [popupStyle]=\"nzPopupStyle\"\n [extraFooter]=\"extraFooter\"\n [ranges]=\"nzRanges\"\n (resultOk)=\"onResultOk()\"\n (closePicker)=\"closeOverlay()\"\n ></date-range-popup>\n</nz-picker>",
providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef((/**
* @return {?}
*/
() => NzRangePickerComponent))
}
]
}] }
];
/** @nocollapse */
NzRangePickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: Renderer2 },
{ type: ElementRef },
{ type: NzNoAnimationDirective, decorators: [{ type: Host }, { type: Optional }] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzWeekPickerComponent extends DateRangePickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?} renderer
* @param {?} elementRef
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, renderer, elementRef, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
this.noAnimation = noAnimation;
this.showWeek = true;
renderer.addClass(elementRef.nativeElement, 'ant-calendar-picker');
}
}
NzWeekPickerComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'nz-week-picker',
exportAs: 'nzWeekPicker',
template: "<nz-picker\n [isRange]=\"isRange\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n [open]=\"nzOpen\"\n [disabled]=\"nzDisabled\"\n [format]=\"nzFormat\"\n [allowClear]=\"nzAllowClear\"\n [autoFocus]=\"nzAutoFocus\"\n [className]=\"nzClassName\"\n [placeholder]=\"nzPlaceHolder\"\n [size]=\"nzSize\"\n [style]=\"pickerStyle\"\n [noAnimation]=\"noAnimation?.nzNoAnimation\"\n (openChange)=\"onOpenChange($event)\"\n>\n <date-range-popup *ngIf=\"realOpenState\"\n [isRange]=\"isRange\"\n [showWeek]=\"showWeek\"\n [panelMode]=\"nzMode\"\n (panelModeChange)=\"nzOnPanelChange.emit($event)\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n (calendarChange)=\"onCalendarChange($event)\"\n [locale]=\"nzLocale?.lang\"\n [showToday]=\"realShowToday\"\n [showTime]=\"nzShowTime\"\n [format]=\"nzFormat\"\n [dateRender]=\"nzDateRender\"\n [disabledDate]=\"nzDisabledDate\"\n [disabledTime]=\"nzDisabledTime\"\n [placeholder]=\"nzPlaceHolder\"\n [dropdownClassName]=\"nzDropdownClassName\"\n [popupStyle]=\"nzPopupStyle\"\n [extraFooter]=\"extraFooter\"\n [ranges]=\"nzRanges\"\n (resultOk)=\"onResultOk()\"\n (closePicker)=\"closeOverlay()\"\n ></date-range-popup>\n</nz-picker>",
providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef((/**
* @return {?}
*/
() => NzWeekPickerComponent))
}
]
}] }
];
/** @nocollapse */
NzWeekPickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: Renderer2 },
{ type: ElementRef },
{ type: NzNoAnimationDirective, decorators: [{ type: Host }, { type: Optional }] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzYearPickerComponent extends HeaderPickerComponent {
/**
* @param {?} i18n
* @param {?} cdr
* @param {?} dateHelper
* @param {?} renderer
* @param {?} elementRef
* @param {?=} noAnimation
*/
constructor(i18n, cdr, dateHelper, renderer, elementRef, noAnimation) {
super(i18n, cdr, dateHelper, noAnimation);
this.noAnimation = noAnimation;
this.nzFormat = 'yyyy';
this.endPanelMode = 'year';
renderer.addClass(elementRef.nativeElement, 'ant-calendar-picker');
}
}
NzYearPickerComponent.decorators = [
{ type: Component, args: [{
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
selector: 'nz-year-picker',
exportAs: 'nzYearPicker',
template: "<nz-picker\n [isRange]=\"false\"\n [value]=\"nzValue\"\n (valueChange)=\"onValueChange($event)\"\n [open]=\"nzOpen\"\n [disabled]=\"nzDisabled\"\n [format]=\"nzFormat\"\n [allowClear]=\"nzAllowClear\"\n [autoFocus]=\"nzAutoFocus\"\n [className]=\"nzClassName\"\n [placeholder]=\"nzPlaceHolder\"\n [size]=\"nzSize\"\n [style]=\"nzStyle\"\n [noAnimation]=\"noAnimation?.nzNoAnimation\"\n (openChange)=\"onOpenChange($event)\"\n>\n <div *ngIf=\"realOpenState\">\n <div class=\"ant-calendar-picker-container {{ nzDropdownClassName }} ant-calendar-picker-container-placement-bottomLeft\" [ngStyle]=\"nzPopupStyle\">\n <div class=\"ant-calendar ant-calendar-month ant-calendar-month-calendar\" tabindex=\"0\">\n <div class=\"ant-calendar-month-calendar-content\">\n <div class=\"ant-calendar-month-header-wrap\">\n <calendar-header\n [disabledMonth]=\"nzDisabledDate\"\n [disabledYear]=\"nzDisabledDate\"\n [panelMode]=\"panelMode\"\n (panelModeChange)=\"onPanelModeChange($event)\"\n [value]=\"nzValue\"\n (chooseYear)=\"onChooseValue('year', $event)\"\n (chooseMonth)=\"onChooseValue('month', $event)\"\n [locale]=\"nzLocale.lang\"\n [enablePrev]=\"true\"\n [enableNext]=\"true\"\n ></calendar-header>\n </div>\n <calendar-footer *ngIf=\"extraFooter\" [extraFooter]=\"extraFooter\"></calendar-footer>\n </div>\n </div>\n </div>\n </div>\n</nz-picker>",
providers: [
{
provide: NG_VALUE_ACCESSOR,
multi: true,
useExisting: forwardRef((/**
* @return {?}
*/
() => NzYearPickerComponent))
}
]
}] }
];
/** @nocollapse */
NzYearPickerComponent.ctorParameters = () => [
{ type: NzI18nService },
{ type: ChangeDetectorRef },
{ type: DateHelperService },
{ type: Renderer2 },
{ type: ElementRef },
{ type: NzNoAnimationDirective, decorators: [{ type: Host }, { type: Optional }] }
];
NzYearPickerComponent.propDecorators = {
nzFormat: [{ type: Input }]
};
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
class NzDatePickerModule {
}
NzDatePickerModule.decorators = [
{ type: NgModule, args: [{
imports: [CommonModule, OverlayModule, LibPackerModule, NzIconModule, NzOverlayModule, NzNoAnimationModule],
exports: [
NzDatePickerComponent,
NzRangePickerComponent,
NzMonthPickerComponent,
NzYearPickerComponent,
NzWeekPickerComponent
],
declarations: [
HeaderPickerComponent,
DateRangePickerComponent,
NzPickerComponent,
NzDatePickerComponent,
NzMonthPickerComponent,
NzYearPickerComponent,
NzWeekPickerComponent,
NzRangePickerComponent
]
},] }
];
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { CandyDate, NzDatePickerModule, NzDatePickerComponent, NzRangePickerComponent, NzMonthPickerComponent, NzWeekPickerComponent, NzYearPickerComponent, AbstractPickerComponent as ɵp, DateRangePickerComponent as ɵo, HeaderPickerComponent as ɵr, CalendarFooterComponent as ɵd, CalendarHeaderComponent as ɵb, CalendarInputComponent as ɵc, OkButtonComponent as ɵe, TimePickerButtonComponent as ɵf, TodayButtonComponent as ɵg, DateTableComponent as ɵh, DecadePanelComponent as ɵl, LibPackerModule as ɵa, MonthPanelComponent as ɵj, MonthTableComponent as ɵk, DateRangePopupComponent as ɵn, InnerPopupComponent as ɵm, YearPanelComponent as ɵi, NzPickerComponent as ɵq };
//# sourceMappingURL=ng-zorro-antd-date-picker.js.map