@progress/kendo-angular-dateinputs
Version:
Kendo UI for Angular Date Inputs Package - Everything you need to add date selection functionality to apps (DatePicker, TimePicker, DateInput, DateRangePicker, DateTimePicker, Calendar, and MultiViewCalendar).
703 lines (702 loc) • 27.3 kB
TypeScript
/**-----------------------------------------------------------------------------------------
* Copyright © 2025 Progress Software Corporation. All rights reserved.
* Licensed under commercial license. See LICENSE.md in the project root for more information
*-------------------------------------------------------------------------------------------*/
import { ChangeDetectorRef, ElementRef, TemplateRef, EventEmitter, Renderer2, ViewContainerRef, NgZone, OnInit, OnChanges, OnDestroy, Injector, AfterViewInit } from '@angular/core';
import { AbstractControl, ControlValueAccessor, Validator } from '@angular/forms';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { PopupService, PopupRef } from '@progress/kendo-angular-popup';
import { Day } from '@progress/kendo-date-math';
import { MultiTabStop } from '@progress/kendo-angular-common';
import { FormatSettings } from '../dateinput/models/format-settings.model';
import { PopupSettings } from '../popup-settings.model';
import { PreventableEvent } from '../preventable-event';
import { CalendarView } from '../calendar/models/view.type';
import { CalendarType } from '../calendar/models/type';
import { CellTemplateDirective } from '../calendar/templates/cell-template.directive';
import { MonthCellTemplateDirective } from '../calendar/templates/month-cell-template.directive';
import { YearCellTemplateDirective } from '../calendar/templates/year-cell-template.directive';
import { DecadeCellTemplateDirective } from '../calendar/templates/decade-cell-template.directive';
import { CenturyCellTemplateDirective } from '../calendar/templates/century-cell-template.directive';
import { WeekNumberCellTemplateDirective } from '../calendar/templates/weeknumber-cell-template.directive';
import { HeaderTitleTemplateDirective } from '../calendar/templates/header-title-template.directive';
import { NavigationItemTemplateDirective } from '../calendar/templates/navigation-item-template.directive';
import { PickerService } from '../common/picker.service';
import { DisabledDatesService } from '../calendar/services/disabled-dates.service';
import { DateInputFormatPlaceholder } from '../dateinput/models/format-placeholder.model';
import { AdaptiveMode } from '../util';
import { DateInputComponent } from '../dateinput/dateinput.component';
import { DateInputSize } from '../common/models/size';
import { DateInputRounded } from '../common/models/rounded';
import { DateInputFillMode } from '../common/models/fillmode';
import { SVGIcon } from '@progress/kendo-svg-icons';
import { ActionSheetComponent } from '@progress/kendo-angular-navigation';
import { HeaderTemplateDirective } from '../calendar/templates/header-template.directive';
import { FooterTemplateDirective } from '../calendar/templates/footer-template.directive';
import { WeekDaysFormat } from '../common/models/week-days-format';
import { AdaptiveService } from '@progress/kendo-angular-utils';
import * as i0 from "@angular/core";
/**
* Represents the [Kendo UI DatePicker component for Angular](slug:overview_datepicker).
*/
export declare class DatePickerComponent extends MultiTabStop implements ControlValueAccessor, OnInit, AfterViewInit, OnChanges, OnDestroy, Validator {
zone: NgZone;
localization: LocalizationService;
private cdr;
private popupService;
wrapper: ElementRef;
private renderer;
private injector;
private pickerService;
private disabledDatesService;
private adaptiveService;
/**
* @hidden
*/
calendarIcon: SVGIcon;
container: ViewContainerRef;
popupTemplate: TemplateRef<any>;
toggleButton: ElementRef;
actionSheet: ActionSheetComponent;
/**
* @hidden
*/
focusableId: string;
/**
* @hidden
*/
cellTemplate: CellTemplateDirective;
/**
* @hidden
*/
set cellTemplateRef(template: CellTemplateDirective);
/**
* If set to `true`, renders a clear button after the input text or DatePicker value has been changed.
* Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
* @default false
*/
clearButton: boolean;
/**
* Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
*/
inputAttributes: {
[key: string]: string;
};
/**
* @hidden
*/
monthCellTemplate: MonthCellTemplateDirective;
/**
* @hidden
*/
set monthCellTemplateRef(template: MonthCellTemplateDirective);
/**
* @hidden
*/
yearCellTemplate: YearCellTemplateDirective;
/**
* @hidden
*/
set yearCellTemplateRef(template: YearCellTemplateDirective);
/**
* @hidden
*/
decadeCellTemplate: DecadeCellTemplateDirective;
/**
* @hidden
*/
set decadeCellTemplateRef(template: DecadeCellTemplateDirective);
/**
* @hidden
*/
centuryCellTemplate: CenturyCellTemplateDirective;
/**
* @hidden
*/
set centuryCellTemplateRef(template: CenturyCellTemplateDirective);
/**
* @hidden
*/
weekNumberTemplate: WeekNumberCellTemplateDirective;
/**
* @hidden
*/
set weekNumberTemplateRef(template: WeekNumberCellTemplateDirective);
/**
* @hidden
*/
headerTitleTemplate: HeaderTitleTemplateDirective;
/**
* @hidden
*/
set headerTitleTemplateRef(template: HeaderTitleTemplateDirective);
/**
* @hidden
*/
headerTemplate: HeaderTemplateDirective;
/**
* @hidden
*/
set headerTemplateRef(template: HeaderTemplateDirective);
/**
* @hidden
*/
footerTemplate: FooterTemplateDirective;
/**
* @hidden
*/
set footerTemplateRef(template: FooterTemplateDirective);
/**
* Toggles the visibility of the Calendar footer.
* @default false
*/
footer: boolean;
/**
* @hidden
*/
navigationItemTemplate: NavigationItemTemplateDirective;
/**
* @hidden
*/
set navigationItemTemplateRef(template: NavigationItemTemplateDirective);
/**
* Sets the format of the displayed Calendar week days' names.
* @default 'short'
*/
weekDaysFormat?: WeekDaysFormat;
/**
* Displays the days that fall out of the current month in the Calendar ([see example]({% slug viewoptions_calendar %}#toc-displaying-other-month-days)).
* The default values per Calendar type are:
* - `infinite` - false
* - `classic` - true
*/
showOtherMonthDays: boolean;
/**
* Defines the active view that the Calendar initially renders
* ([see example]({% slug viewoptions_calendar %}#toc-active-view)).
* By default, the active view is `month`.
*
* > You have to set `activeView` within the `topView`-`bottomView` range.
*/
activeView: CalendarView;
/**
* Defines the bottommost Calendar view to which the user can navigate
* ([see example](slug:datepicker_calendar_options#toc-view-selection-depth)).
*/
bottomView: CalendarView;
/**
* Defines the topmost Calendar view to which the user can navigate
* ([see example](slug:datepicker_calendar_options#toc-view-selection-depth)).
*/
topView: CalendarView;
/**
* Specifies the Calendar type.
*
* The possible values are:
* - `infinite` (default)
* - `classic`
*
*/
calendarType: CalendarType;
/**
* Determines whether to enable animation when navigating to previous/next Calendar view.
* Applies to the [`classic`]({% slug api_dateinputs_datepickercomponent %}#toc-calendartype) Calendar only.
*
* > This feature uses the [Web Animations API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Animations_API). In order to run the animation in browsers that do not support it, you need the `web-animations-js` polyfill.
*
* @default false
*/
animateCalendarNavigation: boolean;
/**
* Sets or gets the `disabled` property of the DatePicker and determines whether the component is active
* ([see example]({% slug disabled_datepicker %})).
* To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_datepicker#toc-managing-the-datepicker-disabled-state-in-reactive-forms).
*/
disabled: boolean;
/**
* Sets the read-only state of the DatePicker
* ([see example]({% slug readonly_datepicker %}#toc-read-only-datepicker)).
*
* @default false
*/
readonly: boolean;
/**
* Sets the read-only state of the DatePicker input field
* ([see example]({% slug readonly_datepicker %}#toc-read-only-input)).
*
* > Note that if you set the [`readonly`]({% slug api_dateinputs_datepickercomponent %}#toc-readonly) property value to `true`,
* the input will be rendered in a read-only state regardless of the `readOnlyInput` value.
*/
readOnlyInput: boolean;
/**
* Configures the popup options of the DatePicker.
*
* The available options are:
* - `animate: Boolean`—Controls the popup animation. By default, the open and close animations are enabled.
* - `appendTo: 'root' | 'component' | ViewContainerRef`—Controls the popup container. By default, the popup will be appended to the root component.
* - `popupClass: String`—Specifies a list of CSS classes that are used to style the popup.
*/
set popupSettings(settings: PopupSettings);
get popupSettings(): PopupSettings;
/**
* Sets or gets the `navigation` property of the Calendar
* and determines whether the navigation side-bar is displayed.
* ([see example]({% slug sidebar_datepicker %})).
*/
set navigation(state: boolean);
get navigation(): boolean;
private _navigation;
/**
* Specifies the smallest valid date
* ([see example]({% slug dateranges_datepicker %})).
* By default, the `min` value is `1900-1-1`.
*/
min: Date;
/**
* Specifies the biggest valid date
* ([see example]({% slug dateranges_datepicker %})).
* By default, the `max` value is `2099-12-31`.
*/
max: Date;
/**
* Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
*/
incompleteDateValidation: boolean;
/**
* Determines whether to autocorrect invalid segments automatically.
*
* @default true
*/
autoCorrectParts: boolean;
/**
* Determines whether to automatically move to the next segment after the user completes the current one.
*
* @default true
*/
autoSwitchParts: boolean;
/**
* A string array representing custom keys, which will move the focus to the next date format segment.
*/
autoSwitchKeys: string[];
/**
* Indicates whether the mouse scroll can be used to increase/decrease the time segments values.
*
* @default true
*/
enableMouseWheel: boolean;
/**
* Determines if the users should see a blinking caret inside the Date Input when possible.
*
* @default false
*/
allowCaretMode: boolean;
/**
* When enabled, the DatePicker will autofill the rest of the date to the current date when the component loses focus.
*
* @default false
*/
autoFill: boolean;
/**
* Specifies the focused date of the Calendar component
* ([see example](slug:datepicker_calendar_options#toc-focused-dates)).
*/
focusedDate: Date;
/**
* Specifies the value of the DatePicker component.
*
* > The `value` has to be a valid
* [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
*/
set value(value: Date | null);
get value(): Date | null;
/**
* Specifies the date format that is used to display the input value
* ([see example]({% slug formats_datepicker %})).
*
* Format value options:
* - `string` - Provide a `string` if a single format is going to be used regardless whether the input is focused or blurred.
* - [`FormatSettings`]({% slug api_dateinputs_formatsettings %}) - To display different formats when the component is focused or blurred, provide a settings object with specified `inputFormat` and `displayFormat` values.
*/
format: string | FormatSettings;
/**
* The maximum year to assume to be from the current century when typing two-digit year value
* ([see example]({% slug formats_datepicker %}#toc-two-digit-year-format)).
*
* The default value is 68, indicating that typing any value less than 69
* will be assumed to be 20xx, while 69 and larger will be assumed to be 19xx.
*/
twoDigitYearMax: number;
/**
* Defines the descriptions of the format sections in the input field.
* ([more information and examples]({% slug placeholders_datepicker %})).
*
* @example
* ```ts
* _@Component({
* selector: 'my-app',
* template: `
* <div class="row example-wrapper" [style.min-height.px]="450">
* <div class="col-xs-12 col-md-6 example-col">
* <p>Full-length format description:</p>
* <kendo-datepicker formatPlaceholder="wide"></kendo-datepicker>
* </div>
*
* <div class="col-xs-12 col-md-6 example-col">
* <p>Narrow-length format description:</p>
* <kendo-datepicker formatPlaceholder="narrow"></kendo-datepicker>
* </div>
*
* <div class="col-xs-12 col-md-6 example-col">
* <p>Short-length format description:</p>
* <kendo-datepicker formatPlaceholder="short"></kendo-datepicker>
* </div>
*
* <div class="col-xs-12 col-md-6 example-col">
* <p>Display defined format:</p>
* <kendo-datepicker format="MM/dd/yyyy" formatPlaceholder="formatPattern"></kendo-datepicker>
* </div>
*
* <div class="col-xs-12 col-md-6 example-col">
* <p>Custom defined format descriptions</p>
* <kendo-datepicker format="MM/dd/yyyy"
* [formatPlaceholder]="{ year: 'y', month: 'M', day: 'd' }"
* ></kendo-datepicker>
* </div>
* </div>
* `
* })
* export class AppComponent { }
* ```
*/
formatPlaceholder: DateInputFormatPlaceholder;
/**
* Specifies the hint the DatePicker displays when its value is `null`.
* ([more information and exaples]({% slug placeholders_datepicker %})).
*
* @example
* ```ts
* _@Component({
* selector: 'my-app',
* template: `
* <kendo-datepicker placeholder="Enter birth date..."></kendo-datepicker>
* `
* })
* export class AppComponent { }
* ```
*/
placeholder: string;
/**
* Sets or gets the `tabindex` property of the DatePicker.
*/
tabindex: number;
/**
* @hidden
*/
set tabIndex(tabIndex: number);
get tabIndex(): number;
/**
* Sets the dates of the DatePicker that will be disabled
* ([see example]({% slug disabled_dates_datepicker %})).
*/
set disabledDates(value: ((date: Date) => boolean) | Date[] | Day[]);
get disabledDates(): ((date: Date) => boolean) | Date[] | Day[];
/**
* Sets the title of the input element of the DatePicker and the title text rendered
* in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
*/
title: string;
/**
* Sets the subtitle text rendered in the header of the popup(action sheet).
* Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
*/
set subtitle(subtitle: string);
get subtitle(): string;
private _subtitle;
/**
* Determines whether the built-in min or max validators are enforced when validating a form.
*/
rangeValidation: boolean;
/**
* Determines whether the built-in validator for disabled
* date ranges is enforced when validating a form
* ([see example]( slug:disabled_dates_datepicker#toc-using-a-function)).
*/
disabledDatesValidation: boolean;
/**
* Determines whether to display a week number column in the `month` view of the Calendar
* ([see example](slug:datepicker_calendar_options#toc-week-number-column)).
*/
weekNumber: boolean;
/**
* Sets the size of the component.
*
* The possible values are:
* * `small`
* * `medium` (Default)
* * `large`
* * `none`
*
*/
set size(size: DateInputSize);
get size(): DateInputSize;
/**
* Sets the border radius of the component.
*
* The possible values are:
* * `small`
* * `medium` (Default)
* * `large`
* * `full`
* * `none`
*
*/
set rounded(rounded: DateInputRounded);
get rounded(): DateInputRounded;
/**
* Sets the fillMode of the component.
*
* The possible values are:
* * `solid` (Default)
* * `flat`
* * `outline`
* * `none`
*
*/
set fillMode(fillMode: DateInputFillMode);
get fillMode(): DateInputFillMode;
/**
* Enables or disables the adaptive mode. By default the adaptive rendering is disabled.
*/
adaptiveMode: AdaptiveMode;
/**
* Fires each time the user selects a new value
* ([see example](slug:events_datepicker)).
*/
valueChange: EventEmitter<Date>;
/**
* Fires each time the user focuses the input element
* ([see example](slug:events_datepicker)).
*/
onFocus: EventEmitter<any>;
/**
* Fires each time the input element gets blurred
* ([see example](slug:events_datepicker)).
*/
onBlur: EventEmitter<any>;
/**
* Fires each time the popup is about to open
* ([see example](slug:events_datepicker)).
* This event is preventable. If you cancel the event, the popup will remain closed.
*/
open: EventEmitter<PreventableEvent>;
/**
* Fires each time the popup is about to close
* ([see example](slug:events_datepicker)).
* This event is preventable. If you cancel the event, the popup will remain open.
*/
close: EventEmitter<PreventableEvent>;
/**
* @hidden
*/
escape: EventEmitter<any>;
/**
* @hidden
*/
wrapperClasses: boolean;
/**
* @hidden
*/
get disabledClass(): boolean;
get popupUID(): string;
popupRef: PopupRef;
get isActive(): boolean;
set isActive(value: boolean);
get show(): boolean;
set show(show: boolean);
/**
* @hidden
*/
xIcon: SVGIcon;
/**
* @hidden
*/
get isControlRequired(): boolean;
private _popupSettings;
private _show;
private _value;
private _active;
private _disabledDates;
private onControlChange;
private onControlTouched;
private onValidatorChange;
private minValidateFn;
private maxValidateFn;
private disabledDatesValidateFn;
private incompleteValidator;
private resolvedPromise;
private subscription;
private pickerSubscriptions;
private localizationChangeSubscription;
private windowBlurSubscription;
private ariaActiveDescendantSubscription;
private control;
private domEvents;
private _size;
private _rounded;
private _fillMode;
private windowSize;
constructor(zone: NgZone, localization: LocalizationService, cdr: ChangeDetectorRef, popupService: PopupService, wrapper: ElementRef, renderer: Renderer2, injector: Injector, pickerService: PickerService, disabledDatesService: DisabledDatesService, adaptiveService: AdaptiveService);
/**
* @hidden
* Used by the TextBoxContainer to determine if the component is empty.
*/
isEmpty(): boolean;
/**
* @hidden
*/
ngOnInit(): void;
ngAfterViewInit(): void;
/**
* @hidden
*/
ngOnChanges(changes: any): void;
/**
* @hidden
*/
ngOnDestroy(): void;
/**
* Indicates whether the component is currently open. That is when the popup or actionSheet is open.
*/
get isOpen(): boolean;
/**
* @hidden
*/
writeValue(value: Date): void;
/**
* @hidden
*/
registerOnChange(fn: any): void;
/**
* @hidden
*/
registerOnTouched(fn: any): void;
/**
* @hidden
*/
setDisabledState(isDisabled: boolean): void;
/**
* @hidden
*/
validate(control: AbstractControl): {
[key: string]: any;
};
/**
* @hidden
*/
registerOnValidatorChange(fn: Function): void;
/**
* @hidden
*/
handleActionSheetCollapse(): void;
/**
* @hidden
*/
handleActionSheetClick(e: PointerEvent): void;
/**
* Focuses the DatePicker component.
*
* @example
* ```ts
* _@Component({
* selector: 'my-app',
* template: `
* <button (click)="datepicker.focus()">Focus date picker</button>
* <kendo-datepicker #datepicker></kendo-datepicker>
* `
* })
* export class AppComponent { }
* ```
*/
focus(): void;
/**
* Blurs the DatePicker component.
*/
blur(): void;
/**
* Toggles the visibility of the popup or actionSheet.
* If you use the `toggle` method to show or hide the popup or actionSheet,
* the `open` and `close` events do not fire.
*
* @param show - The state of the popup.
*/
toggle(show?: boolean): void;
/**
* @hidden
*/
handleIconClick(event: MouseEvent): void;
/**
* @hidden
*/
handleDateInputClick(): void;
/**
* @hidden
*/
handleMousedown(args: any): void;
/**
* @hidden
*/
handleChange(value: Date, isInputValueChange?: boolean): void;
/**
* @hidden
*/
handleInputChange(value: Date): void;
/**
* @hidden
*/
get popupClasses(): string[];
/**
* @hidden
*/
get appendTo(): ViewContainerRef;
get dateInput(): DateInputComponent;
get calendar(): any;
/**
* @hidden
*/
get isAdaptiveModeEnabled(): boolean;
/**
* @hidden
*/
get isAdaptive(): boolean;
/**
* @hidden
*/
onResize(): void;
/**
* @hidden
*/
mergeTime(value: Date): Date;
/**
* @hidden
*/
handleKeydown(e: any): void;
private toggleCalendar;
private togglePopup;
private toggleActionSheet;
private updateActionSheetAdaptiveAppearance;
private setAriaActiveDescendant;
private focusInput;
private toggleFocus;
private verifySettings;
private verifyValue;
private bindEvents;
private handleFocus;
private handleWindowBlur;
private handleBlur;
private blurComponent;
private handleSameSelection;
private handleDateCompletenessChange;
private setComponentClasses;
static ɵfac: i0.ɵɵFactoryDeclaration<DatePickerComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatePickerComponent, "kendo-datepicker", ["kendo-datepicker"], { "focusableId": { "alias": "focusableId"; "required": false; }; "cellTemplateRef": { "alias": "cellTemplate"; "required": false; }; "clearButton": { "alias": "clearButton"; "required": false; }; "inputAttributes": { "alias": "inputAttributes"; "required": false; }; "monthCellTemplateRef": { "alias": "monthCellTemplate"; "required": false; }; "yearCellTemplateRef": { "alias": "yearCellTemplate"; "required": false; }; "decadeCellTemplateRef": { "alias": "decadeCellTemplate"; "required": false; }; "centuryCellTemplateRef": { "alias": "centuryCellTemplate"; "required": false; }; "weekNumberTemplateRef": { "alias": "weekNumberTemplate"; "required": false; }; "headerTitleTemplateRef": { "alias": "headerTitleTemplate"; "required": false; }; "headerTemplateRef": { "alias": "headerTemplate"; "required": false; }; "footerTemplateRef": { "alias": "footerTemplate"; "required": false; }; "footer": { "alias": "footer"; "required": false; }; "navigationItemTemplateRef": { "alias": "navigationItemTemplate"; "required": false; }; "weekDaysFormat": { "alias": "weekDaysFormat"; "required": false; }; "showOtherMonthDays": { "alias": "showOtherMonthDays"; "required": false; }; "activeView": { "alias": "activeView"; "required": false; }; "bottomView": { "alias": "bottomView"; "required": false; }; "topView": { "alias": "topView"; "required": false; }; "calendarType": { "alias": "calendarType"; "required": false; }; "animateCalendarNavigation": { "alias": "animateCalendarNavigation"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "readOnlyInput": { "alias": "readOnlyInput"; "required": false; }; "popupSettings": { "alias": "popupSettings"; "required": false; }; "navigation": { "alias": "navigation"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "incompleteDateValidation": { "alias": "incompleteDateValidation"; "required": false; }; "autoCorrectParts": { "alias": "autoCorrectParts"; "required": false; }; "autoSwitchParts": { "alias": "autoSwitchParts"; "required": false; }; "autoSwitchKeys": { "alias": "autoSwitchKeys"; "required": false; }; "enableMouseWheel": { "alias": "enableMouseWheel"; "required": false; }; "allowCaretMode": { "alias": "allowCaretMode"; "required": false; }; "autoFill": { "alias": "autoFill"; "required": false; }; "focusedDate": { "alias": "focusedDate"; "required": false; }; "value": { "alias": "value"; "required": false; }; "format": { "alias": "format"; "required": false; }; "twoDigitYearMax": { "alias": "twoDigitYearMax"; "required": false; }; "formatPlaceholder": { "alias": "formatPlaceholder"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "tabIndex": { "alias": "tabIndex"; "required": false; }; "disabledDates": { "alias": "disabledDates"; "required": false; }; "title": { "alias": "title"; "required": false; }; "subtitle": { "alias": "subtitle"; "required": false; }; "rangeValidation": { "alias": "rangeValidation"; "required": false; }; "disabledDatesValidation": { "alias": "disabledDatesValidation"; "required": false; }; "weekNumber": { "alias": "weekNumber"; "required": false; }; "size": { "alias": "size"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "adaptiveMode": { "alias": "adaptiveMode"; "required": false; }; }, { "valueChange": "valueChange"; "onFocus": "focus"; "onBlur": "blur"; "open": "open"; "close": "close"; "escape": "escape"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "navigationItemTemplate"], never, true, never>;
}