@progress/kendo-angular-dateinputs 16.0.0-develop.9 → 16.0.1-develop.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (115) hide show
  1. package/calendar/calendar.component.d.ts +43 -8
  2. package/calendar/header.component.d.ts +3 -2
  3. package/calendar/horizontal-view-list.component.d.ts +4 -3
  4. package/calendar/models/cell-context.interface.d.ts +4 -0
  5. package/calendar/models/selection-range.interface.d.ts +2 -2
  6. package/calendar/models/selection.d.ts +11 -1
  7. package/calendar/multiview-calendar.component.d.ts +58 -8
  8. package/calendar/view-list.component.d.ts +9 -1
  9. package/calendar/view.component.d.ts +2 -1
  10. package/common/utils.d.ts +4 -0
  11. package/dateinput/dateinput.component.d.ts +13 -1
  12. package/dateinput/localization/messages.d.ts +5 -1
  13. package/datepicker/datepicker.component.d.ts +7 -2
  14. package/datepicker/localization/messages.d.ts +5 -1
  15. package/daterange/date-range-popup.component.d.ts +30 -2
  16. package/daterange/date-range.component.d.ts +16 -1
  17. package/datetimepicker/datetimepicker.component.d.ts +12 -1
  18. package/datetimepicker/localization/messages.d.ts +5 -1
  19. package/esm2020/calendar/calendar-common.module.mjs +4 -4
  20. package/esm2020/calendar/calendar.component.mjs +258 -60
  21. package/esm2020/calendar/calendar.module.mjs +4 -4
  22. package/esm2020/calendar/calendars.module.mjs +4 -4
  23. package/esm2020/calendar/footer.component.mjs +3 -3
  24. package/esm2020/calendar/for.directive.mjs +3 -3
  25. package/esm2020/calendar/header.component.mjs +41 -23
  26. package/esm2020/calendar/horizontal-view-list.component.mjs +13 -9
  27. package/esm2020/calendar/localization/calendar-custom-messages.component.mjs +3 -3
  28. package/esm2020/calendar/localization/calendar-localized-messages.directive.mjs +3 -3
  29. package/esm2020/calendar/localization/calendar-messages.mjs +3 -3
  30. package/esm2020/calendar/localization/multiview-calendar-custom-messages.component.mjs +3 -3
  31. package/esm2020/calendar/localization/multiview-calendar-localized-messages.directive.mjs +3 -3
  32. package/esm2020/calendar/localization/multiview-calendar-messages.mjs +3 -3
  33. package/esm2020/calendar/models/selection.mjs +35 -1
  34. package/esm2020/calendar/multiview-calendar.component.mjs +276 -52
  35. package/esm2020/calendar/multiview-calendar.module.mjs +4 -4
  36. package/esm2020/calendar/navigation.component.mjs +3 -3
  37. package/esm2020/calendar/services/bus-view.service.mjs +3 -3
  38. package/esm2020/calendar/services/century-view.service.mjs +29 -8
  39. package/esm2020/calendar/services/decade-view.service.mjs +29 -8
  40. package/esm2020/calendar/services/disabled-dates.service.mjs +3 -3
  41. package/esm2020/calendar/services/dom.service.mjs +5 -5
  42. package/esm2020/calendar/services/month-view.service.mjs +29 -8
  43. package/esm2020/calendar/services/navigation.service.mjs +3 -3
  44. package/esm2020/calendar/services/scroll-sync.service.mjs +3 -3
  45. package/esm2020/calendar/services/selection.service.mjs +3 -3
  46. package/esm2020/calendar/services/weeknames.service.mjs +3 -3
  47. package/esm2020/calendar/services/year-view.service.mjs +29 -8
  48. package/esm2020/calendar/templates/cell-template.directive.mjs +3 -3
  49. package/esm2020/calendar/templates/century-cell-template.directive.mjs +3 -3
  50. package/esm2020/calendar/templates/decade-cell-template.directive.mjs +3 -3
  51. package/esm2020/calendar/templates/footer-template.directiv/320/265.mjs +3 -3
  52. package/esm2020/calendar/templates/header-template.directive.mjs +3 -3
  53. package/esm2020/calendar/templates/header-title-template.directive.mjs +3 -3
  54. package/esm2020/calendar/templates/month-cell-template.directive.mjs +3 -3
  55. package/esm2020/calendar/templates/navigation-item-template.directive.mjs +3 -3
  56. package/esm2020/calendar/templates/weeknumber-cell-template.directive.mjs +3 -3
  57. package/esm2020/calendar/templates/year-cell-template.directive.mjs +3 -3
  58. package/esm2020/calendar/templates.module.mjs +4 -4
  59. package/esm2020/calendar/view-list.component.mjs +26 -5
  60. package/esm2020/calendar/view.component.mjs +8 -5
  61. package/esm2020/common/adaptive.module.mjs +4 -4
  62. package/esm2020/common/utils.mjs +5 -1
  63. package/esm2020/dateinput/dateinput.component.mjs +65 -4
  64. package/esm2020/dateinput/dateinput.module.mjs +4 -4
  65. package/esm2020/dateinput/localization/dateinput-custom-messages.component.mjs +3 -3
  66. package/esm2020/dateinput/localization/dateinput-localized-messages.directive.mjs +3 -3
  67. package/esm2020/dateinput/localization/messages.mjs +5 -3
  68. package/esm2020/dateinputs.module.mjs +4 -4
  69. package/esm2020/datepicker/datepicker.component.mjs +43 -18
  70. package/esm2020/datepicker/datepicker.module.mjs +4 -4
  71. package/esm2020/datepicker/localization/datepicker-custom-messages.component.mjs +3 -3
  72. package/esm2020/datepicker/localization/datepicker-localized-messages.directive.mjs +3 -3
  73. package/esm2020/datepicker/localization/messages.mjs +5 -3
  74. package/esm2020/daterange/date-range-end-input.directive.mjs +3 -3
  75. package/esm2020/daterange/date-range-input.mjs +3 -3
  76. package/esm2020/daterange/date-range-popup-template.directive.mjs +3 -3
  77. package/esm2020/daterange/date-range-popup.component.mjs +70 -13
  78. package/esm2020/daterange/date-range-selection.directive.mjs +3 -3
  79. package/esm2020/daterange/date-range-start-input.directive.mjs +3 -3
  80. package/esm2020/daterange/date-range.component.mjs +10 -8
  81. package/esm2020/daterange/date-range.module.mjs +4 -4
  82. package/esm2020/daterange/date-range.service.mjs +3 -3
  83. package/esm2020/daterange/localization/daterange-popup-custom-messages.component.mjs +3 -3
  84. package/esm2020/daterange/localization/daterange-popup-localized-messages.directive.mjs +3 -3
  85. package/esm2020/daterange/localization/messages.mjs +3 -3
  86. package/esm2020/datetimepicker/datetimepicker.component.mjs +54 -16
  87. package/esm2020/datetimepicker/datetimepicker.module.mjs +4 -4
  88. package/esm2020/datetimepicker/localization/datetimepicker-custom-messages.component.mjs +3 -3
  89. package/esm2020/datetimepicker/localization/localized-messages.directive.mjs +3 -3
  90. package/esm2020/datetimepicker/localization/messages.mjs +5 -3
  91. package/esm2020/package-metadata.mjs +2 -2
  92. package/esm2020/timepicker/localization/messages.mjs +5 -3
  93. package/esm2020/timepicker/localization/timepicker-custom-messages.component.mjs +3 -3
  94. package/esm2020/timepicker/localization/timepicker-localized-messages.directive.mjs +3 -3
  95. package/esm2020/timepicker/localization/timeselector-custom-messages.component.mjs +3 -3
  96. package/esm2020/timepicker/localization/timeselector-localized-messages.directive.mjs +3 -3
  97. package/esm2020/timepicker/services/dayperiod.service.mjs +3 -3
  98. package/esm2020/timepicker/services/dom.service.mjs +3 -3
  99. package/esm2020/timepicker/services/hours.service.mjs +3 -3
  100. package/esm2020/timepicker/services/milliseconds.service.mjs +3 -3
  101. package/esm2020/timepicker/services/minutes.service.mjs +3 -3
  102. package/esm2020/timepicker/services/seconds.service.mjs +3 -3
  103. package/esm2020/timepicker/timelist.component.mjs +3 -3
  104. package/esm2020/timepicker/timepicker.component.mjs +41 -13
  105. package/esm2020/timepicker/timepicker.module.mjs +4 -4
  106. package/esm2020/timepicker/timeselector.component.mjs +24 -9
  107. package/esm2020/virtualization/virtualization.component.mjs +3 -3
  108. package/esm2020/virtualization/virtualization.module.mjs +4 -4
  109. package/fesm2015/progress-kendo-angular-dateinputs.mjs +1344 -508
  110. package/fesm2020/progress-kendo-angular-dateinputs.mjs +1329 -507
  111. package/package.json +9 -9
  112. package/schematics/ngAdd/index.js +1 -1
  113. package/timepicker/localization/messages.d.ts +5 -1
  114. package/timepicker/timepicker.component.d.ts +7 -1
  115. package/timepicker/timeselector.component.d.ts +2 -1
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { ChangeDetectorRef, EventEmitter, ElementRef, Renderer2, AfterViewChecked, OnChanges, OnDestroy, NgZone, Injector, AfterViewInit } from '@angular/core';
5
+ import { ChangeDetectorRef, EventEmitter, ElementRef, Renderer2, AfterViewChecked, OnChanges, OnDestroy, NgZone, Injector, AfterViewInit, DoCheck } from '@angular/core';
6
6
  import { AbstractControl, ControlValueAccessor, Validator } from '@angular/forms';
7
7
  import { LocalizationService } from '@progress/kendo-angular-l10n';
8
8
  import { Day } from '@progress/kendo-date-math';
@@ -32,6 +32,8 @@ import { DateInputSize } from '../common/models/size';
32
32
  import { HeaderTemplateDirective } from './templates/header-template.directive';
33
33
  import { FooterTemplateDirective } from './templates/footer-template.directivе';
34
34
  import { WeekDaysFormat } from '../common/models/week-days-format';
35
+ import { SelectionRangeEnd } from './models/selection-range-end.type';
36
+ import { SelectionRange } from './models/selection-range.interface';
35
37
  import * as i0 from "@angular/core";
36
38
  /**
37
39
  * @hidden
@@ -59,7 +61,7 @@ export declare const KENDO_INPUT_PROVIDER: any;
59
61
  * export class AppComponent { }
60
62
  * ```
61
63
  */
62
- export declare class CalendarComponent implements ControlValueAccessor, OnChanges, OnDestroy, AfterViewChecked, AfterViewInit, Validator {
64
+ export declare class CalendarComponent implements ControlValueAccessor, OnChanges, DoCheck, OnDestroy, AfterViewChecked, AfterViewInit, Validator {
63
65
  private bus;
64
66
  dom: CalendarDOMService;
65
67
  private element;
@@ -140,17 +142,28 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
140
142
  * The available values are:
141
143
  * * `single` (default)
142
144
  * * `multiple`
145
+ * * `range`
143
146
  */
144
- selection: CalendarSelection;
147
+ set selection(_selection: CalendarSelection);
148
+ get selection(): CalendarSelection;
149
+ private _selection;
150
+ /**
151
+ * Allows reverse selection when using `range` selection.
152
+ * If `allowReverse` is set to `true`, the component skips the validation of whether the start date is after the end date.
153
+ *
154
+ * @default false
155
+ */
156
+ allowReverse: boolean;
145
157
  /**
146
158
  * Sets or gets the `value` property of the Calendar and defines the selected value of the component.
147
159
  *
148
160
  * > The `value` has to be a valid
149
161
  * [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date)
150
- * instance when in `single` selection mode or an array of valid JavaScript Date instances when in `multiple` selection mode.
162
+ * instance when in `single` selection mode, an array of valid JavaScript Date instances when in `multiple` selection mode, or
163
+ * an object of type `SelectionRange` when in `range` selection mode.
151
164
  */
152
- get value(): any;
153
- set value(candidate: any);
165
+ set value(candidate: Date | Date[] | SelectionRange | null);
166
+ get value(): Date | Date[] | SelectionRange | null;
154
167
  /**
155
168
  * Sets or gets the `disabled` property of the Calendar and
156
169
  * determines whether the component is active
@@ -423,11 +436,21 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
423
436
  set size(size: DateInputSize);
424
437
  get size(): DateInputSize;
425
438
  private _size;
439
+ /**
440
+ * Specify, which end of the defined selection range should be marked as active.
441
+ *
442
+ * > Value will be ignored if the selection range is undefined.
443
+ * > If range selection is used then the default value is 'start'.
444
+ */
445
+ set activeRangeEnd(_activeRangeEnd: SelectionRangeEnd);
446
+ get activeRangeEnd(): SelectionRangeEnd;
447
+ private _activeRangeEnd;
426
448
  navigationView: NavigationComponent;
427
449
  monthView: ViewListComponent;
428
450
  multiViewCalendar: MultiViewCalendarComponent;
429
451
  isActive: boolean;
430
452
  cellUID: string;
453
+ selectionRange: SelectionRange;
431
454
  selectedDates: Date[];
432
455
  rangePivot: Date;
433
456
  private _disabledDates;
@@ -440,6 +463,9 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
440
463
  private onValidatorChange;
441
464
  private minValidateFn;
442
465
  private maxValidateFn;
466
+ private changes;
467
+ private valueSetter;
468
+ private selectionSetter;
443
469
  private syncNavigation;
444
470
  private viewChangeSubscription;
445
471
  private _type;
@@ -466,12 +492,18 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
466
492
  private localizationChangeSubscription;
467
493
  private activeViewDate;
468
494
  private currentlyFocusedElement;
495
+ private canHover;
469
496
  constructor(bus: BusViewService, dom: CalendarDOMService, element: ElementRef, navigator: NavigationService, renderer: Renderer2, cdr: ChangeDetectorRef, ngZone: NgZone, injector: Injector, scrollSyncService: ScrollSyncService, disabledDatesService: DisabledDatesService, localization: LocalizationService, selectionService: SelectionService, pickerService?: PickerService);
470
497
  ngOnInit(): void;
471
498
  ngOnChanges(changes: any): void;
499
+ ngDoCheck(): void;
472
500
  ngAfterViewInit(): void;
473
501
  ngAfterViewChecked(): void;
474
502
  ngOnDestroy(): void;
503
+ /**
504
+ * @hidden
505
+ */
506
+ onCellEnter(date: Date): void;
475
507
  /**
476
508
  * @hidden
477
509
  */
@@ -511,7 +543,7 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
511
543
  /**
512
544
  * @hidden
513
545
  */
514
- handleMultiViewCalendarValueChange(date: Date | Date[], focusedDate: Date): void;
546
+ handleMultiViewCalendarValueChange(value: Date | Date[] | SelectionRange, focusedDate: Date): void;
515
547
  /**
516
548
  * @hidden
517
549
  */
@@ -596,6 +628,7 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
596
628
  private verifyChanges;
597
629
  private verifyValue;
598
630
  private bindEvents;
631
+ private setRangeSelectionToValue;
599
632
  private emitBlur;
600
633
  private emitFocus;
601
634
  private handleComponentClick;
@@ -605,7 +638,9 @@ export declare class CalendarComponent implements ControlValueAccessor, OnChange
605
638
  private emitSameDate;
606
639
  private setAriaActivedescendant;
607
640
  private parseSelectionToValue;
641
+ private setValue;
642
+ private performRangeSelection;
608
643
  private performSelection;
609
644
  static ɵfac: i0.ɵɵFactoryDeclaration<CalendarComponent, [null, null, null, null, null, null, null, null, null, null, null, null, { optional: true; }]>;
610
- static ɵcmp: i0.ɵɵComponentDeclaration<CalendarComponent, "kendo-calendar", ["kendo-calendar"], { "showOtherMonthDays": "showOtherMonthDays"; "id": "id"; "focusedDate": "focusedDate"; "min": "min"; "max": "max"; "rangeValidation": "rangeValidation"; "weekDaysFormat": "weekDaysFormat"; "footer": "footer"; "selection": "selection"; "value": "value"; "disabled": "disabled"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "disabledDates": "disabledDates"; "navigation": "navigation"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "type": "type"; "animateNavigation": "animateNavigation"; "weekNumber": "weekNumber"; "cellTemplateRef": "cellTemplate"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "headerTemplateRef": "headerTemplate"; "footerTemplateRef": "footerTemplate"; "navigationItemTemplateRef": "navigationItemTemplate"; "size": "size"; }, { "activeViewChange": "activeViewChange"; "navigate": "navigate"; "activeViewDateChange": "activeViewDateChange"; "onBlur": "blur"; "onFocus": "focus"; "valueChange": "valueChange"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "navigationItemTemplate"], never, false, never>;
645
+ static ɵcmp: i0.ɵɵComponentDeclaration<CalendarComponent, "kendo-calendar", ["kendo-calendar"], { "showOtherMonthDays": "showOtherMonthDays"; "id": "id"; "focusedDate": "focusedDate"; "min": "min"; "max": "max"; "rangeValidation": "rangeValidation"; "weekDaysFormat": "weekDaysFormat"; "footer": "footer"; "selection": "selection"; "allowReverse": "allowReverse"; "value": "value"; "disabled": "disabled"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "disabledDates": "disabledDates"; "navigation": "navigation"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "type": "type"; "animateNavigation": "animateNavigation"; "weekNumber": "weekNumber"; "cellTemplateRef": "cellTemplate"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "headerTemplateRef": "headerTemplate"; "footerTemplateRef": "footerTemplate"; "navigationItemTemplateRef": "navigationItemTemplate"; "size": "size"; "activeRangeEnd": "activeRangeEnd"; }, { "activeViewChange": "activeViewChange"; "navigate": "navigate"; "activeViewDateChange": "activeViewDateChange"; "onBlur": "blur"; "onFocus": "focus"; "valueChange": "valueChange"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate", "navigationItemTemplate"], never, false, never>;
611
646
  }
@@ -11,6 +11,7 @@ import { CalendarOrientation } from './models/orientation';
11
11
  import { BusViewService } from './services/bus-view.service';
12
12
  import { DisabledDatesService } from './services/disabled-dates.service';
13
13
  import { SVGIcon } from '@progress/kendo-svg-icons';
14
+ import { DateInputSize } from '../common/models/size';
14
15
  import * as i0 from "@angular/core";
15
16
  /**
16
17
  * @hidden
@@ -49,11 +50,11 @@ export declare class HeaderComponent implements OnChanges, OnInit, OnDestroy {
49
50
  showNavigationButtons: boolean;
50
51
  orientation: CalendarOrientation;
51
52
  id: string;
53
+ size: DateInputSize;
52
54
  todayButtonClick: EventEmitter<Date>;
53
55
  prevButtonClick: EventEmitter<any>;
54
56
  nextButtonClick: EventEmitter<any>;
55
57
  getComponentClass: boolean;
56
- get horizontalHostClass(): boolean;
57
58
  get verticalHostClass(): boolean;
58
59
  private subscriptions;
59
60
  constructor(bus: BusViewService, cdr: ChangeDetectorRef, localization: LocalizationService, intl: IntlService, disabledDatesService: DisabledDatesService);
@@ -68,5 +69,5 @@ export declare class HeaderComponent implements OnChanges, OnInit, OnDestroy {
68
69
  private getTitle;
69
70
  private setTodayAvailability;
70
71
  static ɵfac: i0.ɵɵFactoryDeclaration<HeaderComponent, never>;
71
- static ɵcmp: i0.ɵɵComponentDeclaration<HeaderComponent, "kendo-calendar-header", never, { "activeView": "activeView"; "currentDate": "currentDate"; "min": "min"; "max": "max"; "rangeLength": "rangeLength"; "titleTemplateRef": "titleTemplateRef"; "headerTemplateRef": "headerTemplateRef"; "isPrevDisabled": "isPrevDisabled"; "isNextDisabled": "isNextDisabled"; "showNavigationButtons": "showNavigationButtons"; "orientation": "orientation"; "id": "id"; }, { "todayButtonClick": "todayButtonClick"; "prevButtonClick": "prevButtonClick"; "nextButtonClick": "nextButtonClick"; }, never, never, false, never>;
72
+ static ɵcmp: i0.ɵɵComponentDeclaration<HeaderComponent, "kendo-calendar-header", never, { "activeView": "activeView"; "currentDate": "currentDate"; "min": "min"; "max": "max"; "rangeLength": "rangeLength"; "titleTemplateRef": "titleTemplateRef"; "headerTemplateRef": "headerTemplateRef"; "isPrevDisabled": "isPrevDisabled"; "isNextDisabled": "isNextDisabled"; "showNavigationButtons": "showNavigationButtons"; "orientation": "orientation"; "id": "id"; "size": "size"; }, { "todayButtonClick": "todayButtonClick"; "prevButtonClick": "prevButtonClick"; "nextButtonClick": "nextButtonClick"; }, never, never, false, never>;
72
73
  }
@@ -24,14 +24,15 @@ export declare class HorizontalViewListComponent implements OnChanges, AfterView
24
24
  private cdr;
25
25
  private element;
26
26
  private renderer;
27
+ handleMultiViewCalendarFocus(): void;
28
+ handleMultiViewCalendarBlur(event: any): void;
27
29
  /**
28
30
  * Needed for the MultiViewCalendar used in the Scheduler Year view
29
31
  */
30
32
  showOtherMonthDays: boolean;
31
- handleMultiViewCalendarFocus(): void;
32
- handleMultiViewCalendarBlur(event: any): void;
33
33
  cellTemplateRef: TemplateRef<any>;
34
34
  weekNumberTemplateRef: TemplateRef<any>;
35
+ allowReverse: boolean;
35
36
  activeRangeEnd: SelectionRangeEnd;
36
37
  activeView: CalendarViewEnum;
37
38
  cellUID: string;
@@ -106,5 +107,5 @@ export declare class HorizontalViewListComponent implements OnChanges, AfterView
106
107
  private getTake;
107
108
  private setAriaActivedescendant;
108
109
  static ɵfac: i0.ɵɵFactoryDeclaration<HorizontalViewListComponent, never>;
109
- static ɵcmp: i0.ɵɵComponentDeclaration<HorizontalViewListComponent, "kendo-calendar-horizontal", never, { "showOtherMonthDays": "showOtherMonthDays"; "cellTemplateRef": "cellTemplateRef"; "weekNumberTemplateRef": "weekNumberTemplateRef"; "activeRangeEnd": "activeRangeEnd"; "activeView": "activeView"; "cellUID": "cellUID"; "focusedDate": "focusedDate"; "isActive": "isActive"; "min": "min"; "max": "max"; "selectionRange": "selectionRange"; "selectedDates": "selectedDates"; "views": "views"; "showViewHeader": "showViewHeader"; "animateNavigation": "animateNavigation"; "orientation": "orientation"; "activeDescendant": "activeDescendant"; "tabIndex": "tabIndex"; "disabled": "disabled"; "id": "id"; "weekDaysFormat": "weekDaysFormat"; "weekNumber": "weekNumber"; }, { "cellClick": "cellClick"; "weekNumberCellClick": "weekNumberCellClick"; "cellEnter": "cellEnter"; "cellLeave": "cellLeave"; "activeDateChange": "activeDateChange"; "focusCalendar": "focusCalendar"; "blurCalendar": "blurCalendar"; "focusedCellChange": "focusedCellChange"; }, never, never, false, never>;
110
+ static ɵcmp: i0.ɵɵComponentDeclaration<HorizontalViewListComponent, "kendo-calendar-horizontal", never, { "showOtherMonthDays": "showOtherMonthDays"; "cellTemplateRef": "cellTemplateRef"; "weekNumberTemplateRef": "weekNumberTemplateRef"; "allowReverse": "allowReverse"; "activeRangeEnd": "activeRangeEnd"; "activeView": "activeView"; "cellUID": "cellUID"; "focusedDate": "focusedDate"; "isActive": "isActive"; "min": "min"; "max": "max"; "selectionRange": "selectionRange"; "selectedDates": "selectedDates"; "views": "views"; "showViewHeader": "showViewHeader"; "animateNavigation": "animateNavigation"; "orientation": "orientation"; "activeDescendant": "activeDescendant"; "tabIndex": "tabIndex"; "disabled": "disabled"; "id": "id"; "weekDaysFormat": "weekDaysFormat"; "weekNumber": "weekNumber"; }, { "cellClick": "cellClick"; "weekNumberCellClick": "weekNumberCellClick"; "cellEnter": "cellEnter"; "cellLeave": "cellLeave"; "activeDateChange": "activeDateChange"; "focusCalendar": "focusCalendar"; "blurCalendar": "blurCalendar"; "focusedCellChange": "focusedCellChange"; }, never, never, false, never>;
110
111
  }
@@ -70,4 +70,8 @@ export interface CellContext {
70
70
  * @hidden
71
71
  */
72
72
  showOtherMonthDays?: boolean;
73
+ /**
74
+ * @hidden
75
+ */
76
+ allowReverse?: boolean;
73
77
  }
@@ -9,11 +9,11 @@ export interface SelectionRange {
9
9
  /**
10
10
  * The beginning of the selection range.
11
11
  */
12
- start: Date;
12
+ start: Date | null;
13
13
  /**
14
14
  * The end of the selection range.
15
15
  */
16
- end: Date;
16
+ end: Date | null;
17
17
  }
18
18
  /**
19
19
  * @hidden
@@ -2,12 +2,22 @@
2
2
  * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
+ import { SelectionRangeEnd } from "./selection-range-end.type";
6
+ import { SelectionRange } from "./selection-range.interface";
5
7
  /**
6
8
  * Sets the Calendar selection mode.
7
9
  *
8
10
  * The available values are:
9
11
  * * `single` (default)
10
12
  * * `multiple`
13
+ * * `range`
11
14
  *
12
15
  */
13
- export declare type CalendarSelection = 'single' | 'multiple';
16
+ export declare type CalendarSelection = 'single' | 'multiple' | 'range';
17
+ /**
18
+ * @hidden
19
+ */
20
+ export declare function handleRangeSelection(date: Date, selectionRange: SelectionRange, activeRangeEnd: SelectionRangeEnd, allowReverse?: boolean): {
21
+ activeRangeEnd: SelectionRangeEnd;
22
+ selectionRange: SelectionRange;
23
+ };
@@ -2,7 +2,7 @@
2
2
  * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
- import { ChangeDetectorRef, EventEmitter, ElementRef, Renderer2, AfterViewInit, OnChanges, OnDestroy, NgZone } from '@angular/core';
5
+ import { ChangeDetectorRef, EventEmitter, ElementRef, Renderer2, AfterViewInit, OnChanges, OnDestroy, NgZone, DoCheck } from '@angular/core';
6
6
  import { AbstractControl, ControlValueAccessor, Validator } from '@angular/forms';
7
7
  import { Day } from '@progress/kendo-date-math';
8
8
  import { HorizontalViewListComponent } from './horizontal-view-list.component';
@@ -28,6 +28,7 @@ import { NavigationService } from './services/navigation.service';
28
28
  import { HeaderTemplateDirective } from './templates/header-template.directive';
29
29
  import { FooterTemplateDirective } from './templates/footer-template.directivе';
30
30
  import { WeekDaysFormat } from '../common/models/week-days-format';
31
+ import { DateInputSize } from '../common/models/size';
31
32
  import * as i0 from "@angular/core";
32
33
  /**
33
34
  * @hidden
@@ -51,7 +52,7 @@ export declare const RANGE_CALENDAR_RANGE_VALIDATORS: any;
51
52
  * export class AppComponent { }
52
53
  * ```
53
54
  */
54
- export declare class MultiViewCalendarComponent implements AfterViewInit, ControlValueAccessor, OnChanges, OnDestroy, Validator {
55
+ export declare class MultiViewCalendarComponent implements AfterViewInit, ControlValueAccessor, OnChanges, DoCheck, OnDestroy, Validator {
55
56
  bus: BusViewService;
56
57
  element: ElementRef;
57
58
  private navigator;
@@ -71,6 +72,22 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
71
72
  * Determines whether to display the calendar header.
72
73
  */
73
74
  showCalendarHeader: boolean;
75
+ /**
76
+ * @hidden
77
+ *
78
+ * TODO: Make visible when the Infinite Calendar is fixed to set properly the size option.
79
+ * Sets the size of the component.
80
+ *
81
+ * The possible values are:
82
+ * * `small`
83
+ * * `medium` (Default)
84
+ * * `large`
85
+ * * `none`
86
+ *
87
+ */
88
+ set size(size: DateInputSize);
89
+ get size(): DateInputSize;
90
+ private _size;
74
91
  /**
75
92
  * @hidden
76
93
  */
@@ -132,17 +149,28 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
132
149
  * The available values are:
133
150
  * * `single` (default)
134
151
  * * `multiple`
152
+ * * `range`
153
+ */
154
+ set selection(_selection: CalendarSelection);
155
+ get selection(): CalendarSelection;
156
+ private _selection;
157
+ /**
158
+ * Allows reverse selection when using `range` selection.
159
+ * If `allowReverse` is set to `true`, the component skips the validation of whether the start date is after the end date.
160
+ *
161
+ * @default false
135
162
  */
136
- selection: CalendarSelection;
163
+ allowReverse: boolean;
137
164
  /**
138
165
  * Sets or gets the `value` property of the Calendar and defines the selected value of the component.
139
166
  *
140
167
  * > The `value` has to be a valid
141
168
  * [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date)
142
- * instance when in `single` selection mode or an array of valid JavaScript Date instances when in `multiple` selection mode.
169
+ * instance when in `single` selection mode, an array of valid JavaScript Date instances when in `multiple` selection mode, or
170
+ * an object of type `SelectionRange` when in `range` selection mode.
143
171
  */
144
- get value(): any;
145
- set value(candidate: any);
172
+ set value(candidate: Date | Date[] | SelectionRange | null);
173
+ get value(): Date | Date[] | SelectionRange | null;
146
174
  /**
147
175
  * Sets or gets the `disabled` property of the Calendar and
148
176
  * determines whether the component is active
@@ -213,12 +241,15 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
213
241
  * Specify, which end of the defined selection range should be marked as active.
214
242
  *
215
243
  * > Value will be ignored if the selection range is undefined.
244
+ * > If range selection is used then the default value is 'start'.
216
245
  */
217
- activeRangeEnd: SelectionRangeEnd;
246
+ set activeRangeEnd(_activeRangeEnd: SelectionRangeEnd);
247
+ get activeRangeEnd(): SelectionRangeEnd;
218
248
  /**
219
249
  * Sets or gets the `selectionRange` property of the Calendar and
220
250
  * defines the selection range of the component
221
251
  * ([see example]({% slug dates_multiviewcalendar %}#toc-selection-range)).
252
+ * > We recommend using the `value` property as it now supports `range` selection.
222
253
  */
223
254
  set selectionRange(range: SelectionRange);
224
255
  get selectionRange(): SelectionRange;
@@ -263,6 +294,11 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
263
294
  * ([see example](slug:events_multiviewcalendar)).
264
295
  */
265
296
  valueChange: EventEmitter<any>;
297
+ /**
298
+ * @hidden
299
+ * Fires when the range selection changes.
300
+ */
301
+ rangeSelectionChange: EventEmitter<any>;
266
302
  /**
267
303
  * Fires each time the MultiViewCalendar gets blurred
268
304
  * ([see example](slug:events_multiviewcalendar)).
@@ -433,11 +469,17 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
433
469
  nextView: Action;
434
470
  selectedDates: Date[];
435
471
  rangePivot: Date;
472
+ shouldHoverWhenNoStart: boolean;
473
+ private canHover;
474
+ private changes;
475
+ private valueSetter;
476
+ private selectionSetter;
436
477
  private _min;
437
478
  private _max;
438
479
  private _focusedDate;
439
480
  private _value;
440
481
  private _selectionRange;
482
+ private _activeRangeEnd;
441
483
  private resolvedPromise;
442
484
  private onControlChange;
443
485
  private onControlTouched;
@@ -495,6 +537,7 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
495
537
  constructor(bus: BusViewService, element: ElementRef, navigator: NavigationService, renderer: Renderer2, cdr: ChangeDetectorRef, zone: NgZone, disabledDatesService: DisabledDatesService, selectionService: SelectionService);
496
538
  ngOnInit(): void;
497
539
  ngOnChanges(changes: any): void;
540
+ ngDoCheck(): void;
498
541
  ngOnDestroy(): void;
499
542
  ngAfterViewInit(): void;
500
543
  /**
@@ -524,6 +567,10 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
524
567
  selectedDates: Date[];
525
568
  focusedDate: Date;
526
569
  }): void;
570
+ /**
571
+ * @hidden
572
+ */
573
+ onCellEnter(cellEnter: any, date: Date): void;
527
574
  /**
528
575
  * @hidden
529
576
  */
@@ -590,7 +637,10 @@ export declare class MultiViewCalendarComponent implements AfterViewInit, Contro
590
637
  private verifyValue;
591
638
  private updateButtonState;
592
639
  private parseSelectionToValue;
640
+ private setValue;
641
+ private setRangeSelectionToValue;
642
+ private performRangeSelection;
593
643
  private performSelection;
594
644
  static ɵfac: i0.ɵɵFactoryDeclaration<MultiViewCalendarComponent, never>;
595
- static ɵcmp: i0.ɵɵComponentDeclaration<MultiViewCalendarComponent, "kendo-multiviewcalendar", ["kendo-multiviewcalendar"], { "showOtherMonthDays": "showOtherMonthDays"; "showCalendarHeader": "showCalendarHeader"; "id": "id"; "focusedDate": "focusedDate"; "footer": "footer"; "min": "min"; "max": "max"; "rangeValidation": "rangeValidation"; "disabledDatesRangeValidation": "disabledDatesRangeValidation"; "selection": "selection"; "value": "value"; "disabled": "disabled"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "weekDaysFormat": "weekDaysFormat"; "isActive": "isActive"; "disabledDates": "disabledDates"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "showViewHeader": "showViewHeader"; "animateNavigation": "animateNavigation"; "weekNumber": "weekNumber"; "activeRangeEnd": "activeRangeEnd"; "selectionRange": "selectionRange"; "views": "views"; "orientation": "orientation"; "cellTemplateRef": "cellTemplate"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "footerTemplateRef": "footerTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "headerTemplateRef": "headerTemplate"; }, { "activeViewChange": "activeViewChange"; "navigate": "navigate"; "cellEnter": "cellEnter"; "cellLeave": "cellLeave"; "valueChange": "valueChange"; "blurEvent": "blur"; "focusEvent": "focus"; "focusCalendar": "focusCalendar"; "onClosePopup": "onClosePopup"; "onTabPress": "onTabPress"; "onShiftTabPress": "onShiftTabPress"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate"], never, false, never>;
645
+ static ɵcmp: i0.ɵɵComponentDeclaration<MultiViewCalendarComponent, "kendo-multiviewcalendar", ["kendo-multiviewcalendar"], { "showOtherMonthDays": "showOtherMonthDays"; "showCalendarHeader": "showCalendarHeader"; "size": "size"; "id": "id"; "focusedDate": "focusedDate"; "footer": "footer"; "min": "min"; "max": "max"; "rangeValidation": "rangeValidation"; "disabledDatesRangeValidation": "disabledDatesRangeValidation"; "selection": "selection"; "allowReverse": "allowReverse"; "value": "value"; "disabled": "disabled"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "weekDaysFormat": "weekDaysFormat"; "isActive": "isActive"; "disabledDates": "disabledDates"; "activeView": "activeView"; "bottomView": "bottomView"; "topView": "topView"; "showViewHeader": "showViewHeader"; "animateNavigation": "animateNavigation"; "weekNumber": "weekNumber"; "activeRangeEnd": "activeRangeEnd"; "selectionRange": "selectionRange"; "views": "views"; "orientation": "orientation"; "cellTemplateRef": "cellTemplate"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "footerTemplateRef": "footerTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "headerTemplateRef": "headerTemplate"; }, { "activeViewChange": "activeViewChange"; "navigate": "navigate"; "cellEnter": "cellEnter"; "cellLeave": "cellLeave"; "valueChange": "valueChange"; "rangeSelectionChange": "rangeSelectionChange"; "blurEvent": "blur"; "focusEvent": "focus"; "focusCalendar": "focusCalendar"; "onClosePopup": "onClosePopup"; "onTabPress": "onTabPress"; "onShiftTabPress": "onShiftTabPress"; }, ["cellTemplate", "monthCellTemplate", "yearCellTemplate", "decadeCellTemplate", "centuryCellTemplate", "weekNumberTemplate", "headerTitleTemplate", "headerTemplate", "footerTemplate"], never, false, never>;
596
646
  }
@@ -13,6 +13,9 @@ import { CalendarViewEnum } from './models/view.enum';
13
13
  import { HeaderComponent } from './header.component';
14
14
  import { WeekDaysFormat } from '../common/models/week-days-format';
15
15
  import { CalendarView } from './models/view.type';
16
+ import { SelectionRangeEnd } from './models/selection-range-end.type';
17
+ import { SelectionRange } from './models/selection-range.interface';
18
+ import { DateInputSize } from '../common/models/size';
16
19
  import * as i0 from "@angular/core";
17
20
  /**
18
21
  * @hidden
@@ -23,6 +26,7 @@ export declare class ViewListComponent implements OnChanges, OnDestroy, AfterVie
23
26
  private intl;
24
27
  private dom;
25
28
  private renderer;
29
+ allowReverse: boolean;
26
30
  cellTemplateRef: TemplateRef<any>;
27
31
  weekNumberTemplateRef: TemplateRef<any>;
28
32
  headerTitleTemplateRef: TemplateRef<any>;
@@ -41,8 +45,12 @@ export declare class ViewListComponent implements OnChanges, OnDestroy, AfterVie
41
45
  id: string;
42
46
  showFooter: boolean;
43
47
  weekDaysFormat: WeekDaysFormat;
48
+ activeRangeEnd: SelectionRangeEnd;
49
+ selectionRange: SelectionRange;
50
+ size: DateInputSize;
44
51
  get weekNumber(): boolean;
45
52
  set weekNumber(showWeekNumbers: boolean);
53
+ cellEnter: EventEmitter<Date>;
46
54
  cellClick: EventEmitter<any>;
47
55
  weekNumberCellClick: EventEmitter<Date[]>;
48
56
  activeDateChange: EventEmitter<Date>;
@@ -96,5 +104,5 @@ export declare class ViewListComponent implements OnChanges, OnDestroy, AfterVie
96
104
  private getWeekNames;
97
105
  private intlChange;
98
106
  static ɵfac: i0.ɵɵFactoryDeclaration<ViewListComponent, never>;
99
- static ɵcmp: i0.ɵɵComponentDeclaration<ViewListComponent, "kendo-calendar-viewlist", never, { "cellTemplateRef": "cellTemplateRef"; "weekNumberTemplateRef": "weekNumberTemplateRef"; "headerTitleTemplateRef": "headerTitleTemplateRef"; "headerTemplateRef": "headerTemplateRef"; "footerTemplateRef": "footerTemplateRef"; "showOtherMonthDays": "showOtherMonthDays"; "activeView": "activeView"; "cellUID": "cellUID"; "focusedDate": "focusedDate"; "isActive": "isActive"; "min": "min"; "max": "max"; "selectedDates": "selectedDates"; "tabIndex": "tabIndex"; "disabled": "disabled"; "id": "id"; "showFooter": "showFooter"; "weekDaysFormat": "weekDaysFormat"; "weekNumber": "weekNumber"; }, { "cellClick": "cellClick"; "weekNumberCellClick": "weekNumberCellClick"; "activeDateChange": "activeDateChange"; "todayButtonClick": "todayButtonClick"; "pageChange": "pageChange"; "focusCalendar": "focusCalendar"; "blurCalendar": "blurCalendar"; "focusedCellChange": "focusedCellChange"; }, never, never, false, never>;
107
+ static ɵcmp: i0.ɵɵComponentDeclaration<ViewListComponent, "kendo-calendar-viewlist", never, { "allowReverse": "allowReverse"; "cellTemplateRef": "cellTemplateRef"; "weekNumberTemplateRef": "weekNumberTemplateRef"; "headerTitleTemplateRef": "headerTitleTemplateRef"; "headerTemplateRef": "headerTemplateRef"; "footerTemplateRef": "footerTemplateRef"; "showOtherMonthDays": "showOtherMonthDays"; "activeView": "activeView"; "cellUID": "cellUID"; "focusedDate": "focusedDate"; "isActive": "isActive"; "min": "min"; "max": "max"; "selectedDates": "selectedDates"; "tabIndex": "tabIndex"; "disabled": "disabled"; "id": "id"; "showFooter": "showFooter"; "weekDaysFormat": "weekDaysFormat"; "activeRangeEnd": "activeRangeEnd"; "selectionRange": "selectionRange"; "size": "size"; "weekNumber": "weekNumber"; }, { "cellEnter": "cellEnter"; "cellClick": "cellClick"; "weekNumberCellClick": "weekNumberCellClick"; "activeDateChange": "activeDateChange"; "todayButtonClick": "todayButtonClick"; "pageChange": "pageChange"; "focusCalendar": "focusCalendar"; "blurCalendar": "blurCalendar"; "focusedCellChange": "focusedCellChange"; }, never, never, false, never>;
100
108
  }
@@ -23,6 +23,7 @@ export declare class ViewComponent implements OnChanges, OnDestroy {
23
23
  private zone;
24
24
  private renderer;
25
25
  private disabledDatesService;
26
+ allowReverse: boolean;
26
27
  showOtherMonthDays: boolean;
27
28
  direction: 'horizontal' | 'vertical';
28
29
  isActive: boolean;
@@ -81,5 +82,5 @@ export declare class ViewComponent implements OnChanges, OnDestroy {
81
82
  private emitCellLeave;
82
83
  private cellByIndex;
83
84
  static ɵfac: i0.ɵɵFactoryDeclaration<ViewComponent, never>;
84
- static ɵcmp: i0.ɵɵComponentDeclaration<ViewComponent, "[kendoCalendarView]", never, { "showOtherMonthDays": "showOtherMonthDays"; "direction": "direction"; "isActive": "isActive"; "activeView": "activeView"; "cellUID": "cellUID"; "focusedDate": "focusedDate"; "viewDate": "viewDate"; "activeRangeEnd": "activeRangeEnd"; "selectionRange": "selectionRange"; "min": "min"; "max": "max"; "selectedDates": "selectedDates"; "weekNumber": "weekNumber"; "viewIndex": "viewIndex"; "templateRef": "templateRef"; "weekNumberTemplateRef": "weekNumberTemplateRef"; "headerTitle": "headerTitle"; }, { "cellClick": "cellClick"; "weekNumberCellClick": "weekNumberCellClick"; "cellEnter": "cellEnter"; "cellLeave": "cellLeave"; "focusedCellId": "focusedCellId"; }, never, never, false, never>;
85
+ static ɵcmp: i0.ɵɵComponentDeclaration<ViewComponent, "[kendoCalendarView]", never, { "allowReverse": "allowReverse"; "showOtherMonthDays": "showOtherMonthDays"; "direction": "direction"; "isActive": "isActive"; "activeView": "activeView"; "cellUID": "cellUID"; "focusedDate": "focusedDate"; "viewDate": "viewDate"; "activeRangeEnd": "activeRangeEnd"; "selectionRange": "selectionRange"; "min": "min"; "max": "max"; "selectedDates": "selectedDates"; "weekNumber": "weekNumber"; "viewIndex": "viewIndex"; "templateRef": "templateRef"; "weekNumberTemplateRef": "weekNumberTemplateRef"; "headerTitle": "headerTitle"; }, { "cellClick": "cellClick"; "weekNumberCellClick": "weekNumberCellClick"; "cellEnter": "cellEnter"; "cellLeave": "cellLeave"; "focusedCellId": "focusedCellId"; }, never, never, false, never>;
85
86
  }
package/common/utils.d.ts CHANGED
@@ -18,6 +18,10 @@ export declare const currentFocusTarget: (blurArgs: any) => any;
18
18
  * @hidden
19
19
  */
20
20
  export declare const isPresent: (value: any) => boolean;
21
+ /**
22
+ * @hidden
23
+ */
24
+ export declare const isNullOrDate: (value: any) => boolean;
21
25
  /**
22
26
  * @hidden
23
27
  */
@@ -57,6 +57,10 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
57
57
  * @hidden
58
58
  */
59
59
  caretAltUpIcon: SVGIcon;
60
+ /**
61
+ * @hidden
62
+ */
63
+ xIcon: SVGIcon;
60
64
  /**
61
65
  * @hidden
62
66
  */
@@ -70,6 +74,12 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
70
74
  * @hidden
71
75
  */
72
76
  set pickerType(_pickerType: DatePickerType);
77
+ /**
78
+ * If set to `true`, renders a clear button after the input text or DateInput value has been changed.
79
+ * Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
80
+ * @default false
81
+ */
82
+ clearButton: boolean;
73
83
  /**
74
84
  * Sets or gets the `disabled` property of the DateInput and
75
85
  * determines whether the component is active
@@ -394,6 +404,7 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
394
404
  };
395
405
  hasMousedown: boolean;
396
406
  focusedPriorToMousedown: boolean;
407
+ showClearButton: boolean;
397
408
  /**
398
409
  * @hidden
399
410
  */
@@ -476,6 +487,7 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
476
487
  * @hidden
477
488
  */
478
489
  writeValue(value: Date): void;
490
+ resetInput(): void;
479
491
  /**
480
492
  * @hidden
481
493
  */
@@ -531,6 +543,6 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
531
543
  private setComponentClasses;
532
544
  private setInputAttributes;
533
545
  static ɵfac: i0.ɵɵFactoryDeclaration<DateInputComponent, [null, null, null, null, null, null, null, { optional: true; }]>;
534
- 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"; "isRequired": "isRequired"; "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"; "inputAttributes": "inputAttributes"; }, { "valueChange": "valueChange"; "valueUpdate": "valueUpdate"; "onFocus": "focus"; "onBlur": "blur"; }, never, never, false, never>;
546
+ static ɵcmp: i0.ɵɵComponentDeclaration<DateInputComponent, "kendo-dateinput", ["kendo-dateinput"], { "focusableId": "focusableId"; "pickerType": "pickerType"; "clearButton": "clearButton"; "disabled": "disabled"; "readonly": "readonly"; "title": "title"; "tabindex": "tabindex"; "role": "role"; "ariaReadOnly": "ariaReadOnly"; "tabIndex": "tabIndex"; "isRequired": "isRequired"; "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"; "inputAttributes": "inputAttributes"; }, { "valueChange": "valueChange"; "valueUpdate": "valueUpdate"; "onFocus": "focus"; "onBlur": "blur"; }, never, never, false, never>;
535
547
  }
536
548
  export {};
@@ -16,6 +16,10 @@ export declare class DateInputMessages extends ComponentMessages {
16
16
  * The title of the **Increment** button of the DateInput.
17
17
  */
18
18
  increment: string;
19
+ /**
20
+ * The title of the **Clear** button of the DateInput.
21
+ */
22
+ clearTitle: string;
19
23
  static ɵfac: i0.ɵɵFactoryDeclaration<DateInputMessages, never>;
20
- static ɵdir: i0.ɵɵDirectiveDeclaration<DateInputMessages, "kendo-dateinput-messages-base", never, { "decrement": "decrement"; "increment": "increment"; }, {}, never, never, false, never>;
24
+ static ɵdir: i0.ɵɵDirectiveDeclaration<DateInputMessages, "kendo-dateinput-messages-base", never, { "decrement": "decrement"; "increment": "increment"; "clearTitle": "clearTitle"; }, {}, never, never, false, never>;
21
25
  }
@@ -68,6 +68,12 @@ export declare class DatePickerComponent implements ControlValueAccessor, OnInit
68
68
  * @hidden
69
69
  */
70
70
  set cellTemplateRef(template: CellTemplateDirective);
71
+ /**
72
+ * If set to `true`, renders a clear button after the input text or DatePicker value has been changed.
73
+ * Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
74
+ * @default false
75
+ */
76
+ clearButton: boolean;
71
77
  /**
72
78
  * Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
73
79
  */
@@ -508,7 +514,6 @@ export declare class DatePickerComponent implements ControlValueAccessor, OnInit
508
514
  * @hidden
509
515
  */
510
516
  xIcon: SVGIcon;
511
- private get inputElement();
512
517
  /**
513
518
  * @hidden
514
519
  */
@@ -690,5 +695,5 @@ export declare class DatePickerComponent implements ControlValueAccessor, OnInit
690
695
  private handleDateCompletenessChange;
691
696
  private setComponentClasses;
692
697
  static ɵfac: i0.ɵɵFactoryDeclaration<DatePickerComponent, [null, null, null, null, null, null, null, null, null, { optional: true; }]>;
693
- static ɵcmp: i0.ɵɵComponentDeclaration<DatePickerComponent, "kendo-datepicker", ["kendo-datepicker"], { "focusableId": "focusableId"; "cellTemplateRef": "cellTemplate"; "inputAttributes": "inputAttributes"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "headerTemplateRef": "headerTemplate"; "footerTemplateRef": "footerTemplate"; "footer": "footer"; "navigationItemTemplateRef": "navigationItemTemplate"; "weekDaysFormat": "weekDaysFormat"; "showOtherMonthDays": "showOtherMonthDays"; "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", "headerTemplate", "footerTemplate", "navigationItemTemplate"], never, false, never>;
698
+ static ɵcmp: i0.ɵɵComponentDeclaration<DatePickerComponent, "kendo-datepicker", ["kendo-datepicker"], { "focusableId": "focusableId"; "cellTemplateRef": "cellTemplate"; "clearButton": "clearButton"; "inputAttributes": "inputAttributes"; "monthCellTemplateRef": "monthCellTemplate"; "yearCellTemplateRef": "yearCellTemplate"; "decadeCellTemplateRef": "decadeCellTemplate"; "centuryCellTemplateRef": "centuryCellTemplate"; "weekNumberTemplateRef": "weekNumberTemplate"; "headerTitleTemplateRef": "headerTitleTemplate"; "headerTemplateRef": "headerTemplate"; "footerTemplateRef": "footerTemplate"; "footer": "footer"; "navigationItemTemplateRef": "navigationItemTemplate"; "weekDaysFormat": "weekDaysFormat"; "showOtherMonthDays": "showOtherMonthDays"; "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", "headerTemplate", "footerTemplate", "navigationItemTemplate"], never, false, never>;
694
699
  }
@@ -28,6 +28,10 @@ export declare class DatePickerMessages extends ComponentMessages {
28
28
  * The title of the **Parent View** button in the header of the Calendar.
29
29
  */
30
30
  parentViewButtonTitle: string;
31
+ /**
32
+ * The title of the **Clear** button of the DatePicker.
33
+ */
34
+ clearTitle: string;
31
35
  static ɵfac: i0.ɵɵFactoryDeclaration<DatePickerMessages, never>;
32
- static ɵdir: i0.ɵɵDirectiveDeclaration<DatePickerMessages, "kendo-datepicker-messages-base", never, { "today": "today"; "toggle": "toggle"; "prevButtonTitle": "prevButtonTitle"; "nextButtonTitle": "nextButtonTitle"; "parentViewButtonTitle": "parentViewButtonTitle"; }, {}, never, never, false, never>;
36
+ static ɵdir: i0.ɵɵDirectiveDeclaration<DatePickerMessages, "kendo-datepicker-messages-base", never, { "today": "today"; "toggle": "toggle"; "prevButtonTitle": "prevButtonTitle"; "nextButtonTitle": "nextButtonTitle"; "parentViewButtonTitle": "parentViewButtonTitle"; "clearTitle": "clearTitle"; }, {}, never, never, false, never>;
33
37
  }