@progress/kendo-angular-dateinputs 14.0.0-develop.1 → 14.0.0-develop.11

package/dateinput/dateinput.component.d.ts

@@ -15,8 +15,32 @@ 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 { DateFieldNameOptions, DateFormatOptions, DateFormatPart, DayRange, NumberFormatOptions } from '@progress/kendo-intl';
 import * as i0 from "@angular/core";
 declare type DatePickerType = 'daterangestart' | 'daterangeend' | 'datepicker' | 'datetimepicker' | 'timepicker';
+/**
+ * @hidden
+ * Need to overrite `dateFormatNames` parameters order and provide `cldr` object
+ * required by the kendo-dateinputs-common package
+ */
+export declare class DateInputIntl {
+    private service;
+    format: (format: string, ...values: any[]) => string;
+    toString: (value: any, format: any, localeId?: string) => string;
+    formatDate: (value: Date, format?: string | DateFormatOptions, localeId?: string) => string;
+    parseDate: (value: string, format?: string | DateFormatOptions | string[] | DateFormatOptions[], localeId?: string) => Date;
+    parseNumber: (value: string, format?: string | NumberFormatOptions, localeId?: string) => number;
+    formatNumber: (value: number, format: string | NumberFormatOptions, localeId?: string) => string;
+    splitDateFormat: (format: string | DateFormatOptions, localeId?: string) => DateFormatPart[];
+    numberSymbols: (localeId?: string) => void;
+    firstDay: (localeId?: string) => number;
+    weekendRange: (localeId?: string) => DayRange;
+    dateFieldName: (options: DateFieldNameOptions, localeId?: string) => string;
+    dateFormatNames: (localeId: any, options: any) => any;
+    cldr: {};
+    localeId: string;
+    constructor(service: IntlService);
+}
 /**
  * Represents the [Kendo UI DateInput component for Angular]({% slug overview_dateinput %}#toc-basic-usage).
  */
@@ -134,7 +158,8 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * export class AppComponent { }
      * ```
      */
-    formatPlaceholder: DateInputFormatPlaceholder;
+    set formatPlaceholder(format: DateInputFormatPlaceholder);
+    get formatPlaceholder(): DateInputFormatPlaceholder;
     /**
      * Specifies the hint the DateInput displays when its value is `null`.
      * For more information, refer to the article on
@@ -189,9 +214,35 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
     rangeValidation: boolean;
     /**
      * @hidden
-     * Based on the min and max values, specifies whether the value will be auto-corrected while typing.
+     *
+     * Determines whether to auto correct invalid segments automatically.
+     * TODO: To be fixed in common package before enabling: https://github.com/telerik/kendo-dateinputs-common/issues/24
+     *
+     * @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.
      */
-    autoCorrect: boolean;
+    autoSwitchKeys: string[];
+    /**
+     * Determines if the users should see a blinking caret inside the Date Input when possible.
+     *
+     * @default false
+     */
+    allowCaretMode: boolean;
+    /**
+     * When enabled, the DateInput will autofill the rest of the date to the current date when the component loses focus.
+     *
+     * @default false
+     */
+    autoFill: boolean;
     /**
      * Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
      */
@@ -204,6 +255,12 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * will be assumed to be 20xx, while 69 and larger will be assumed to be 19xx.
      */
     twoDigitYearMax: number;
+    /**
+     * Indicates whether the mouse scroll can be used to increase/decrease the time segments values.
+     *
+     * @default true
+     */
+    enableMouseWheel: boolean;
     /**
      * Specifies the value of the DateInput component.
      *
@@ -337,6 +394,24 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * @hidden
      */
     get formControl(): FormControl;
+    get options(): {
+        format: string | FormatSettings;
+        steps: DateInputIncrementalSteps;
+        readonly: boolean;
+        formatPlaceholder: DateInputFormatPlaceholder;
+        placeholder: string;
+        autoCorrectParts: boolean;
+        autoSwitchParts: boolean;
+        selectPreviousSegmentOnBackspace: boolean;
+        autoSwitchKeys: string[];
+        twoDigitYearMax: number;
+        enableMouseWheel: boolean;
+        selectNearestSegmentOnFocus: boolean;
+        allowCaretMode: boolean;
+        autoFill: boolean;
+        value: Date;
+        intlService: DateInputIntl;
+    };
     arrow: any;
     arrowDirection: Arrow;
     formatSections: {
@@ -348,23 +423,18 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * @hidden
      */
     isDateIncomplete: boolean;
-    protected currentValue: string;
     protected currentFormat: string;
     private spinup;
     private spindown;
-    private backspace;
-    private resetSegmentValue;
-    private symbolsMap;
-    private get inputFormat();
-    private get displayFormat();
     private minValidator;
     private maxValidator;
     private incompleteValidator;
     private _value;
     private _active;
     private _focusableId;
+    private _formatPlaceholder;
     private kendoDate;
-    private paste;
+    private kendoDateObject;
     private domEvents;
     private ngControl;
     private onControlChange;
@@ -381,6 +451,10 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * Used by the TextBoxContainer to determine if the component is empty
      */
     isEmpty(): boolean;
+    /**
+     * @hidden
+     */
+    handleDragAndDrop(args: any): void;
     /**
      * @hidden
      */
@@ -393,6 +467,8 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * @hidden
      */
     ngOnChanges(changes: SimpleChanges): void;
+    private updateFormatSections;
+    private updateIncompleteValidationStatus;
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     /**
@@ -457,60 +533,20 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
      * @hidden
      */
     handleButtonClick(offset: number): void;
-    /**
-     * @hidden
-     */
-    modifyDateSegmentValue(offset: number): void;
-    /**
-     * @hidden
-     */
-    protected switchDateSegment(offset: number): boolean;
-    /**
-     * @hidden
-     */
-    protected selectDateSegment(symbol: string): void;
-    /**
-     * @hidden
-     */
-    handleClick(): void;
-    /**
-     * @hidden
-     */
-    handleDragAndDrop(args: any): void;
-    /**
-     * @hidden
-     */
-    handleMousedown(): void;
-    /**
-     * @hidden
-     */
-    handleFocus(args: any): void;
-    /**
-     * @hidden
-     */
-    handleBlur(args: any): void;
-    private getKendoDate;
-    private dateSymbolMap;
-    private updateElementValue;
-    private caret;
-    private selectNearestSegment;
+    private initKendoDate;
+    private onWidgetValueChange;
+    private onWidgetKeyDown;
+    private onWidgetInputEnd;
+    private onWidgetFocus;
+    private onWidgetBlur;
     private verifyRange;
     private verifyValue;
-    private putDateInRange;
-    private updateFormatSections;
     private intlChange;
-    private updateOnPaste;
-    private bindEvents;
-    private handleMouseWheel;
-    private handlePaste;
-    private handleKeydown;
-    private handleInput;
     private emitFocus;
     private emitBlur;
-    private updateIncompleteValidationStatus;
     private setSpinnerFill;
     private setComponentClasses;
     static ɵfac: i0.ɵɵFactoryDeclaration<DateInputComponent, [null, null, null, null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DateInputComponent, "kendo-dateinput", ["kendo-dateinput"], { "focusableId": "focusableId"; "pickerType": "pickerType"; "disabled": "disabled"; "readonly": "readonly"; "title": "title"; "tabindex": "tabindex"; "role": "role"; "ariaReadOnly": "ariaReadOnly"; "tabIndex": "tabIndex"; "format": "format"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "steps": "steps"; "max": "max"; "min": "min"; "rangeValidation": "rangeValidation"; "autoCorrect": "autoCorrect"; "incompleteDateValidation": "incompleteDateValidation"; "twoDigitYearMax": "twoDigitYearMax"; "value": "value"; "spinners": "spinners"; "isPopupOpen": "isPopupOpen"; "hasPopup": "hasPopup"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; }, { "valueChange": "valueChange"; "valueUpdate": "valueUpdate"; "onFocus": "focus"; "onBlur": "blur"; }, never, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DateInputComponent, "kendo-dateinput", ["kendo-dateinput"], { "focusableId": "focusableId"; "pickerType": "pickerType"; "disabled": "disabled"; "readonly": "readonly"; "title": "title"; "tabindex": "tabindex"; "role": "role"; "ariaReadOnly": "ariaReadOnly"; "tabIndex": "tabIndex"; "format": "format"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "steps": "steps"; "max": "max"; "min": "min"; "rangeValidation": "rangeValidation"; "autoCorrectParts": "autoCorrectParts"; "autoSwitchParts": "autoSwitchParts"; "autoSwitchKeys": "autoSwitchKeys"; "allowCaretMode": "allowCaretMode"; "autoFill": "autoFill"; "incompleteDateValidation": "incompleteDateValidation"; "twoDigitYearMax": "twoDigitYearMax"; "enableMouseWheel": "enableMouseWheel"; "value": "value"; "spinners": "spinners"; "isPopupOpen": "isPopupOpen"; "hasPopup": "hasPopup"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; }, { "valueChange": "valueChange"; "valueUpdate": "valueUpdate"; "onFocus": "focus"; "onBlur": "blur"; }, never, never>;
 }
 export {};

package/datepicker/datepicker.component.d.ts

@@ -209,6 +209,43 @@ export declare class DatePickerComponent implements ControlValueAccessor, OnInit
      * Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
      */
     incompleteDateValidation: boolean;
+    /**
+     * @hidden
+     *
+     * Determines whether to auto correct invalid segments automatically.
+     * TODO: To be fixed in common package before enabling: https://github.com/telerik/kendo-dateinputs-common/issues/24
+     *
+     * @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 calendar_type_datepicker %}#toc-focused-dates)).
@@ -638,5 +675,5 @@ export declare class DatePickerComponent implements ControlValueAccessor, OnInit
     private handleDateCompletenessChange;
     private setComponentClasses;
     static ɵfac: i0.ɵɵFactoryDeclaration<DatePickerComponent, [null, null, null, null, null, null, null, null, null, { optional: true; }]>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DatePickerComponent, "kendo-datepicker", ["kendo-datepicker"], { "focusableId": "focusableId"; "cellTemplateRef": "cellTemplate"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "navigationItemTemplateRef": "navigationItemTemplate"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "calendarType": "calendarType"; "animateCalendarNavigation": "animateCalendarNavigation"; "disabled": "disabled"; "readonly": "readonly"; "readOnlyInput": "readOnlyInput"; "popupSettings": "popupSettings"; "navigation": "navigation"; "min": "min"; "max": "max"; "incompleteDateValidation": "incompleteDateValidation"; "focusedDate": "focusedDate"; "value": "value"; "format": "format"; "twoDigitYearMax": "twoDigitYearMax"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "disabledDates": "disabledDates"; "title": "title"; "subtitle": "subtitle"; "rangeValidation": "rangeValidation"; "disabledDatesValidation": "disabledDatesValidation"; "weekNumber": "weekNumber"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; "adaptiveMode": "adaptiveMode"; }, { "valueChange": "valueChange"; "onFocus": "focus"; "onBlur": "blur"; "open": "open"; "close": "close"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate"], never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DatePickerComponent, "kendo-datepicker", ["kendo-datepicker"], { "focusableId": "focusableId"; "cellTemplateRef": "cellTemplate"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "navigationItemTemplateRef": "navigationItemTemplate"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "calendarType": "calendarType"; "animateCalendarNavigation": "animateCalendarNavigation"; "disabled": "disabled"; "readonly": "readonly"; "readOnlyInput": "readOnlyInput"; "popupSettings": "popupSettings"; "navigation": "navigation"; "min": "min"; "max": "max"; "incompleteDateValidation": "incompleteDateValidation"; "autoCorrectParts": "autoCorrectParts"; "autoSwitchParts": "autoSwitchParts"; "autoSwitchKeys": "autoSwitchKeys"; "enableMouseWheel": "enableMouseWheel"; "allowCaretMode": "allowCaretMode"; "autoFill": "autoFill"; "focusedDate": "focusedDate"; "value": "value"; "format": "format"; "twoDigitYearMax": "twoDigitYearMax"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "disabledDates": "disabledDates"; "title": "title"; "subtitle": "subtitle"; "rangeValidation": "rangeValidation"; "disabledDatesValidation": "disabledDatesValidation"; "weekNumber": "weekNumber"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; "adaptiveMode": "adaptiveMode"; }, { "valueChange": "valueChange"; "onFocus": "focus"; "onBlur": "blur"; "open": "open"; "close": "close"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "navigationItemTemplate"], never>;
 }

package/datetimepicker/datetimepicker.component.d.ts

@@ -244,6 +244,43 @@ export declare class DateTimePickerComponent implements OnInit, OnChanges, After
      * Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
      */
     incompleteDateValidation: boolean;
+    /**
+     * @hidden
+     *
+     * Determines whether to auto correct invalid segments automatically.
+     * TODO: To be fixed in common package before enabling: https://github.com/telerik/kendo-dateinputs-common/issues/24
+     *
+     * @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 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.
      */
@@ -628,5 +665,5 @@ export declare class DateTimePickerComponent implements OnInit, OnChanges, After
     private handleDateCompletenessChange;
     private setComponentClasses;
     static ɵfac: i0.ɵɵFactoryDeclaration<DateTimePickerComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<DateTimePickerComponent, "kendo-datetimepicker", ["kendo-datetimepicker"], { "focusableId": "focusableId"; "value": "value"; "format": "format"; "twoDigitYearMax": "twoDigitYearMax"; "tabindex": "tabindex"; "disabledDates": "disabledDates"; "popupSettings": "popupSettings"; "title": "title"; "subtitle": "subtitle"; "disabled": "disabled"; "readonly": "readonly"; "readOnlyInput": "readOnlyInput"; "cancelButton": "cancelButton"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "steps": "steps"; "focusedDate": "focusedDate"; "calendarType": "calendarType"; "animateCalendarNavigation": "animateCalendarNavigation"; "weekNumber": "weekNumber"; "min": "min"; "max": "max"; "rangeValidation": "rangeValidation"; "disabledDatesValidation": "disabledDatesValidation"; "incompleteDateValidation": "incompleteDateValidation"; "adaptiveMode": "adaptiveMode"; "defaultTab": "defaultTab"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; }, { "valueChange": "valueChange"; "open": "open"; "close": "close"; "onFocus": "focus"; "onBlur": "blur"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate"], never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<DateTimePickerComponent, "kendo-datetimepicker", ["kendo-datetimepicker"], { "focusableId": "focusableId"; "value": "value"; "format": "format"; "twoDigitYearMax": "twoDigitYearMax"; "tabindex": "tabindex"; "disabledDates": "disabledDates"; "popupSettings": "popupSettings"; "title": "title"; "subtitle": "subtitle"; "disabled": "disabled"; "readonly": "readonly"; "readOnlyInput": "readOnlyInput"; "cancelButton": "cancelButton"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "steps": "steps"; "focusedDate": "focusedDate"; "calendarType": "calendarType"; "animateCalendarNavigation": "animateCalendarNavigation"; "weekNumber": "weekNumber"; "min": "min"; "max": "max"; "rangeValidation": "rangeValidation"; "disabledDatesValidation": "disabledDatesValidation"; "incompleteDateValidation": "incompleteDateValidation"; "autoCorrectParts": "autoCorrectParts"; "autoSwitchParts": "autoSwitchParts"; "autoSwitchKeys": "autoSwitchKeys"; "enableMouseWheel": "enableMouseWheel"; "allowCaretMode": "allowCaretMode"; "autoFill": "autoFill"; "adaptiveMode": "adaptiveMode"; "defaultTab": "defaultTab"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; }, { "valueChange": "valueChange"; "open": "open"; "close": "close"; "onFocus": "focus"; "onBlur": "blur"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate"], never>;
 }