@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).
743 lines (742 loc) • 28.4 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 { ElementRef, OnDestroy, ChangeDetectorRef, EventEmitter, NgZone, OnInit, SimpleChanges, OnChanges, Renderer2, AfterViewInit, Injector } from '@angular/core';
import { ControlValueAccessor, Validator, AbstractControl, ValidationErrors, FormControl } from '@angular/forms';
import { Day } from '@progress/kendo-date-math';
import { PopupService } from '@progress/kendo-angular-popup';
import { IntlService } from '@progress/kendo-angular-intl';
import { MultiTabStop } from '@progress/kendo-angular-common';
import { AdaptiveSize, AdaptiveService } from '@progress/kendo-angular-utils';
import { LocalizationService } from '@progress/kendo-angular-l10n';
import { PickerService } from '../common/picker.service';
import { DisabledDatesService } from '../calendar/services/disabled-dates.service';
import { AdaptiveMode } from '../util';
import { CalendarComponent } from '../calendar/calendar.component';
import { TimeSelectorComponent } from '../timepicker/timeselector.component';
import { DateInputComponent } from '../dateinput/dateinput.component';
import { PreventableEvent } from '../preventable-event';
import { PopupSettings } from '../popup-settings.model';
import { DateInputFormatPlaceholder } from '../dateinput/models/format-placeholder.model';
import { DateInputIncrementalSteps } from '../dateinput/models/incremental-steps.model';
import { DateTimePickerActiveTab } from './models/active-tab.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 { FormatSettings } from '../dateinput/models/format-settings.model';
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 * as i0 from "@angular/core";
/**
* Represents the [Kendo UI DateTimePicker component for Angular]({% slug overview_datetimepicker %}).
*/
export declare class DateTimePickerComponent extends MultiTabStop implements OnInit, OnChanges, AfterViewInit, OnDestroy, ControlValueAccessor, Validator {
private popupService;
private intl;
private cdr;
private pickerService;
private ngZone;
wrapper: ElementRef<HTMLElement>;
localization: LocalizationService;
private disabledDatesService;
private renderer;
private injector;
private adaptiveService;
/**
* @hidden
*/
calendarIcon: SVGIcon;
/**
* @hidden
*/
clockIcon: SVGIcon;
/**
* @hidden
*/
hostClasses: boolean;
/**
* @hidden
*/
get disabledClass(): boolean;
/**
* @hidden
*/
toggleButton: ElementRef<HTMLSpanElement>;
/**
* @hidden
*/
get dateInput(): DateInputComponent;
/**
* @hidden
*/
get calendar(): CalendarComponent;
/**
* @hidden
*/
get timeSelector(): TimeSelectorComponent;
/**
* @hidden
*/
focusableId: string;
/**
* 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 datetimepicker_calendar_options %}#toc-displaying-other-month-days)).
* The default values per Calendar type are:
* - `infinite` - false
* - `classic` - true
*/
showOtherMonthDays: boolean;
/**
* Specifies the value of the DateTimePicker 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 for displaying the input value
* ([see example]({% slug formats_datetimepicker %}))
*
* 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.
*
* > If a [`FormatSettings`]({% slug api_dateinputs_formatsettings %}) object is provided, the `displayFormat` value will be used for the popup TimePicker.
*/
set format(format: string | FormatSettings);
get format(): string | FormatSettings;
/**
* The maximum year to assume to be from the current century when typing two-digit year value
* ([see example]({% slug formats_datetimepicker %}#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;
/**
* Specifies the [`tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) of the DateTimePicker.
*/
set tabindex(value: number);
get tabindex(): number;
/**
* Sets the dates of the DateTimePicker that will be disabled
* ([see example]({% slug disabled_dates_datetimepicker %})).
*/
set disabledDates(value: ((date: Date) => boolean) | Date[] | Day[]);
get disabledDates(): ((date: Date) => boolean) | Date[] | Day[];
/**
* Configures the popup settings of the DateTimePicker
* ([see example]({% slug datetimepicker_popup_options %}#toc-customizing-the-popup)).
*
* 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 the title of the input element of the DateTimePicker 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).
*/
adaptiveTitle: 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).
*/
adaptiveSubtitle: string;
/**
* Sets or gets the `disabled` property of the DateTimePicker and determines whether the component is active
* ([see example]({% slug disabled_datetimepicker %})).
* To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_datetimepicker#toc-managing-the-datetimepicker-disabled-state-in-reactive-forms).
*/
disabled: boolean;
/**
* Sets the read-only state of the DateTimePicker
* ([see example]({% slug readonly_datetimepicker %}#toc-read-only-datetimepicker)).
*
* @default false
*/
readonly: boolean;
/**
* Sets the read-only state of the DateTimePicker input field
* ([see example]({% slug readonly_datetimepicker %}#toc-read-only-input)).
*
* > Note that if you set the [`readonly`]({% slug api_dateinputs_datetimepickercomponent %}#toc-readonly) property value to `true`,
* the input will be rendered in a read-only state regardless of the `readOnlyInput` value.
*/
readOnlyInput: boolean;
/**
* Determines whether to display the **Cancel** button in the popup
* ([see example]({% slug datetimepicker_popup_options %}#toc-toggling-the-cancel-button)).
*/
cancelButton: boolean;
/**
* Defines the descriptions of the format sections in the input field
* ([see example]({% slug placeholders_datetimepicker %}#toc-format-sections-description)).
*/
formatPlaceholder: DateInputFormatPlaceholder;
/**
* Specifies the hint which is displayed by the DateTimePicker when its value is `null`
* ([see example]({% slug placeholders_datetimepicker %}#toc-text-hints)).
*/
placeholder: string;
/**
* Configures the incremental steps of the DateInput and the popup component of the TimePicker
* ([see example]({% slug incrementalsteps_datetimepicker %})).
*/
steps: DateInputIncrementalSteps;
/**
* Specifies the focused date of the popup Calendar
* ([see example]({% slug datetimepicker_calendar_options %}#toc-focused-dates)).
*/
focusedDate: Date;
/**
* 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_datetimepickercomponent %}#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;
/**
* Determines whether to display a week number column in the `month` view of the popup Calendar
* ([see example]({% slug datetimepicker_calendar_options %}#toc-week-number-column)).
*/
weekNumber: boolean;
/**
* Specifies the smallest valid date.
* The Calendar will not display dates before this value.
* If the `min` value of the Calendar is selected, the TimePicker will not display
* time entries before the specified time portion of this value
* ([see example]({% slug dateranges_datetimepicker %})).
*/
set min(value: Date | null);
get min(): Date;
/**
* Specifies the biggest valid date.
* The Calendar will not display dates after this value.
* If the `max` value of the Calendar is selected, the TimePicker will not display
* time entries after the specified time portion of this value
* ([see example]({% slug dateranges_datetimepicker %})).
*/
set max(value: Date | null);
get max(): Date;
/**
* Determines whether the built-in min or max validators are enforced when validating a form
* ([see example](slug:dateranges_datetimepicker)).
*
* @default true
*/
rangeValidation: boolean;
/**
* Determines whether the built-in validator for disabled
* date ranges is enforced when validating a form
* ([see example](slug:disabled_dates_datetimepicker)).
*/
disabledDatesValidation: boolean;
/**
* 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;
/**
* If set to `true`, renders a clear button after the input text or DateTimePicker value has been changed.
* Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
* @default false
*/
clearButton: boolean;
/**
* When enabled, the DateTimePicker will autofill the rest of the date to the current date when the component loses focus.
*
* @default false
*/
autoFill: boolean;
/**
* Enables or disables the adaptive mode. By default the adaptive rendering is disabled.
*/
adaptiveMode: AdaptiveMode;
/**
* 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;
};
/**
* Fires each time the user selects a new value
* ([see example](slug:events_datetimepicker)).
*/
valueChange: EventEmitter<Date>;
/**
* Fires each time the popup is about to open
* ([see example](slug:events_datetimepicker)).
* This event is preventable. If you cancel the event by setting `event.preventDefault()`, the popup will remain closed.
*/
open: EventEmitter<PreventableEvent>;
/**
* Fires each time the popup is about to close
* ([see example](slug:events_datetimepicker)).
* This event is preventable. If you cancel the event by setting `event.preventDefault()`, the popup will remain open.
*/
close: EventEmitter<PreventableEvent>;
/**
* Fires each time the user focuses the component
* ([see example](slug:events_datetimepicker)).
*/
onFocus: EventEmitter<any>;
/**
* Fires each time the user blurs the component
* ([see example](slug:events_datetimepicker)).
*/
onBlur: EventEmitter<any>;
/**
* @hidden
*/
escape: EventEmitter<any>;
/**
* Indicates whether the component is currently open. That is when the popup or actionSheet is open.
*/
get isOpen(): boolean;
/**
* Indicates whether the component or its popup content is focused.
*/
get isActive(): boolean;
set isActive(value: boolean);
/**
* Sets the active tab on opening the popup
* ([see example]({% slug datetimepicker_popup_options %}#toc-setting-the-default-tab)).
*/
set defaultTab(tab: DateTimePickerActiveTab);
get defaultTab(): DateTimePickerActiveTab;
/**
* 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;
/**
* @hidden
*/
get tabSwitchTransition(): string;
/**
* @hidden
*
* Indicates whether the Calendar will be disabled.
* The inactive tab component gets disabled and becomes inaccessible on tab click.
*/
get disableCalendar(): boolean;
/**
* @hidden
*
* Indicates whether the TimeSelector will be disabled.
* The inactive tab component gets disabled and becomes inaccessible on tab click.
*/
get disableTimeSelector(): boolean;
/**
* @hidden
*/
get isAdaptiveModeEnabled(): boolean;
/**
* @hidden
*/
get isAdaptive(): boolean;
/**
* @hidden
*/
onResize(): void;
/**
* @hidden
*
* Controls whether the Calendar or the TimeSelector will be displayed.
*/
activeTab: DateTimePickerActiveTab;
/**
* @hidden
*
* Specifies the stripped time-related format that is used in the TimeSelector.
* Updates each time the `format` property value changes.
*/
timeSelectorFormat: string;
/**
* @hidden
*/
timeSelectorMin: Date;
/**
* @hidden
*/
timeSelectorMax: Date;
/**
* @hidden
*/
calendarValue: Date;
/**
* @hidden
*/
calendarMin: Date;
/**
* @hidden
*/
calendarMax: Date;
/**
* @hidden
*/
checkIcon: SVGIcon;
/**
* @hidden
*/
windowSize: AdaptiveSize;
/**
* @hidden
*/
cellTemplate: CellTemplateDirective;
/**
* @hidden
*/
monthCellTemplate: MonthCellTemplateDirective;
/**
* @hidden
*/
yearCellTemplate: YearCellTemplateDirective;
/**
* @hidden
*/
decadeCellTemplate: DecadeCellTemplateDirective;
/**
* @hidden
*/
centuryCellTemplate: CenturyCellTemplateDirective;
/**
* @hidden
*/
weekNumberTemplate: WeekNumberCellTemplateDirective;
/**
* @hidden
*/
headerTitleTemplate: 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;
private get activeTabComponent();
private get appendTo();
private container;
private popupTemplate;
actionSheet: ActionSheetComponent;
private get popupUID();
private get acceptButton();
private get cancelButtonElement();
private get dateTabButton();
private get timeTabButton();
private get todayButton();
/**
* @hidden
*/
get formControl(): FormControl;
/**
* @hidden
*/
get isControlRequired(): boolean;
private popupRef;
private _popupSettings;
private _value;
private _format;
private _tabindex;
private _defaultTab;
private _min;
private _max;
private _disabledDates;
private _isActive;
private onControlTouched;
private onControlChange;
private onValidatorChange;
private minValidateFn;
private maxValidateFn;
private disabledDatesValidateFn;
private incompleteValidator;
private subscriptions;
private ariaActiveDescendantSubscription;
private _size;
private _rounded;
private _fillMode;
constructor(popupService: PopupService, intl: IntlService, cdr: ChangeDetectorRef, pickerService: PickerService, ngZone: NgZone, wrapper: ElementRef<HTMLElement>, localization: LocalizationService, disabledDatesService: DisabledDatesService, renderer: Renderer2, injector: Injector, adaptiveService: AdaptiveService);
ngOnInit(): void;
ngAfterViewInit(): void;
ngOnChanges(changes: SimpleChanges): void;
ngOnDestroy(): void;
/**
* * If the popup is closed, focuses the DateTimePicker input.
* * If the popup is open, the focus is moved to its content.
*/
focus(): void;
/**
* Blurs the DateTimePicker.
*/
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
*/
writeValue(value: Date): void;
/**
* @hidden
*/
registerOnChange(fn: any): void;
/**
* @hidden
*/
registerOnTouched(fn: any): void;
/**
* @hidden
*/
setDisabledState(disabled: boolean): void;
/**
* @hidden
*/
validate(control: AbstractControl): ValidationErrors;
/**
* @hidden
*/
registerOnValidatorChange(fn: Function): void;
/**
* @hidden
*
* Used by the TextBoxContainer to determine if the floating label will render in the input.
*/
isEmpty(): boolean;
/**
* @hidden
*/
handleIconClick(event: MouseEvent): void;
/**
* @hidden
*/
handleFocus(): void;
/**
* @hidden
*/
handleBlur(event?: FocusEvent): void;
/**
* @hidden
*/
changeActiveTab(tab: DateTimePickerActiveTab): void;
/**
* @hidden
*/
handleTabChangeTransitionEnd(dateTimeSelector: HTMLElement, event: TransitionEvent): void;
/**
* @hidden
*/
onTabOutLastPart(): void;
/**
* @hidden
*/
onTabOutFirstPart(): void;
/**
* @hidden
*/
onTabOutNow(): void;
/**
* @hidden
*/
handleAccept(): void;
/**
* @hidden
*/
handleCancel(): void;
/**
* @hidden
*/
handleInputValueChange(value: Date): void;
/**
* @hidden
*/
handleDateInputClick(): void;
/**
* @hidden
*/
handleCalendarValueChange(): void;
/**
* @hidden
*/
handleKeyDown(event: KeyboardEvent): void;
/**
* @hidden
*/
handleTab(event: KeyboardEvent): void;
/**
* @hidden
*/
handleActionSheetCollapse(): void;
/**
* @hidden
*
* Prevents the diversion of the focus from the currently active element in the component.
*/
preventMouseDown(event: MouseEvent): void;
/**
* @hidden
*/
toggleActionSheet(show: boolean): void;
private _togglePopup;
/**
* Changes the tab and the calendar or clock icon to the designated default.
*/
private resetActiveTab;
private verifyValue;
private verifyMinMaxRange;
/**
* Extracts the time slots and the literals that are not preceded by date parts
* and concatenates the resulting parts into a string.
* If the provided format value does not contain any time parts,
* returns the designated format of the default popup component of the TimePicker.
*/
private getTimeSelectorFormat;
/**
* Extracts the `displayFormat` from the provided `string | FormatSettings` value.
* Fallbacks to the default input value, if a falsy value param is passed.
*/
private getDisplayFormat;
/**
* The filter expression that filters out all format parts
* except for `hour`, `minute`, `second`, `dayperiod`, and specific literals.
* Literals will be left only if they are not preceded by date parts.
*/
private timeFormatPartFilter;
/**
* @hidden
*/
toggleDateTime(open: boolean): void;
private switchFocus;
private openPopup;
private setAriaActiveDescendant;
private closePopup;
private handleValueChange;
/**
* Indicates whether the focus target is part of this component,
* that is, whether the focus target is inside the component or in the popup.
*/
private focusTargetInComponent;
private setTimeSelectorMinMax;
private setCalendarValue;
/**
* If the popup is available, runs a popup change detection.
*/
private detectPopupChanges;
/**
* Depending on the predicate `runInZone` value that is passed,
* runs the provided function either in the Angular or in the current zone.
*/
private run;
private handleDateCompletenessChange;
private setComponentClasses;
static ɵfac: i0.ɵɵFactoryDeclaration<DateTimePickerComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DateTimePickerComponent, "kendo-datetimepicker", ["kendo-datetimepicker"], { "focusableId": { "alias": "focusableId"; "required": false; }; "weekDaysFormat": { "alias": "weekDaysFormat"; "required": false; }; "showOtherMonthDays": { "alias": "showOtherMonthDays"; "required": false; }; "value": { "alias": "value"; "required": false; }; "format": { "alias": "format"; "required": false; }; "twoDigitYearMax": { "alias": "twoDigitYearMax"; "required": false; }; "tabindex": { "alias": "tabindex"; "required": false; }; "disabledDates": { "alias": "disabledDates"; "required": false; }; "popupSettings": { "alias": "popupSettings"; "required": false; }; "adaptiveTitle": { "alias": "adaptiveTitle"; "required": false; }; "adaptiveSubtitle": { "alias": "adaptiveSubtitle"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "readonly": { "alias": "readonly"; "required": false; }; "readOnlyInput": { "alias": "readOnlyInput"; "required": false; }; "cancelButton": { "alias": "cancelButton"; "required": false; }; "formatPlaceholder": { "alias": "formatPlaceholder"; "required": false; }; "placeholder": { "alias": "placeholder"; "required": false; }; "steps": { "alias": "steps"; "required": false; }; "focusedDate": { "alias": "focusedDate"; "required": false; }; "calendarType": { "alias": "calendarType"; "required": false; }; "animateCalendarNavigation": { "alias": "animateCalendarNavigation"; "required": false; }; "weekNumber": { "alias": "weekNumber"; "required": false; }; "min": { "alias": "min"; "required": false; }; "max": { "alias": "max"; "required": false; }; "rangeValidation": { "alias": "rangeValidation"; "required": false; }; "disabledDatesValidation": { "alias": "disabledDatesValidation"; "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; }; "clearButton": { "alias": "clearButton"; "required": false; }; "autoFill": { "alias": "autoFill"; "required": false; }; "adaptiveMode": { "alias": "adaptiveMode"; "required": false; }; "inputAttributes": { "alias": "inputAttributes"; "required": false; }; "defaultTab": { "alias": "defaultTab"; "required": false; }; "size": { "alias": "size"; "required": false; }; "rounded": { "alias": "rounded"; "required": false; }; "fillMode": { "alias": "fillMode"; "required": false; }; "headerTemplateRef": { "alias": "headerTemplate"; "required": false; }; "footerTemplateRef": { "alias": "footerTemplate"; "required": false; }; "footer": { "alias": "footer"; "required": false; }; }, { "valueChange": "valueChange"; "open": "open"; "close": "close"; "onFocus": "focus"; "onBlur": "blur"; "escape": "escape"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate"], never, true, never>;
}