@progress/kendo-angular-dateinputs 19.1.2-develop.2 → 19.1.2-develop.4

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 (91) hide show
  1. package/calendar/calendar.component.d.ts +37 -56
  2. package/calendar/calendar.module.d.ts +10 -21
  3. package/calendar/calendars.module.d.ts +10 -21
  4. package/calendar/localization/calendar-custom-messages.component.d.ts +9 -1
  5. package/calendar/localization/multiview-calendar-custom-messages.component.d.ts +9 -1
  6. package/calendar/models/orientation.d.ts +10 -1
  7. package/calendar/models/selection-range-end.type.d.ts +11 -1
  8. package/calendar/models/selection-range.interface.d.ts +18 -3
  9. package/calendar/models/selection.d.ts +19 -4
  10. package/calendar/models/type.d.ts +7 -3
  11. package/calendar/models/view.type.d.ts +12 -1
  12. package/calendar/multiview-calendar.component.d.ts +46 -40
  13. package/calendar/multiview-calendar.module.d.ts +1 -0
  14. package/calendar/templates/cell-template.directive.d.ts +16 -19
  15. package/calendar/templates/century-cell-template.directive.d.ts +15 -19
  16. package/calendar/templates/decade-cell-template.directive.d.ts +15 -19
  17. package/calendar/templates/footer-template.directive.d.ts +16 -17
  18. package/calendar/templates/header-template.directive.d.ts +19 -18
  19. package/calendar/templates/header-title-template.directive.d.ts +15 -18
  20. package/calendar/templates/month-cell-template.directive.d.ts +15 -17
  21. package/calendar/templates/navigation-item-template.directive.d.ts +15 -18
  22. package/calendar/templates/weeknumber-cell-template.directive.d.ts +15 -17
  23. package/calendar/templates/year-cell-template.directive.d.ts +15 -20
  24. package/dateinput/dateinput.component.d.ts +43 -119
  25. package/dateinput/dateinput.module.d.ts +15 -2
  26. package/dateinput/localization/dateinput-custom-messages.component.d.ts +18 -1
  27. package/dateinput/models/format-placeholder.model.d.ts +15 -20
  28. package/dateinput/models/format-settings.model.d.ts +14 -4
  29. package/dateinput/models/incremental-steps.model.d.ts +16 -1
  30. package/datepicker/datepicker.component.d.ts +65 -127
  31. package/datepicker/datepicker.module.d.ts +11 -2
  32. package/datepicker/localization/datepicker-custom-messages.component.d.ts +11 -1
  33. package/daterange/auto-correct-on.type.d.ts +2 -1
  34. package/daterange/date-range-end-input.directive.d.ts +22 -24
  35. package/daterange/date-range-popup-template.directive.d.ts +13 -2
  36. package/daterange/date-range-popup.component.d.ts +83 -73
  37. package/daterange/date-range-selection.directive.d.ts +10 -9
  38. package/daterange/date-range-start-input.directive.d.ts +26 -27
  39. package/daterange/date-range.component.d.ts +1 -6
  40. package/daterange/date-range.service.d.ts +27 -27
  41. package/datetimepicker/datetimepicker.component.d.ts +88 -79
  42. package/datetimepicker/datetimepicker.module.d.ts +16 -2
  43. package/datetimepicker/localization/datetimepicker-custom-messages.component.d.ts +10 -1
  44. package/esm2022/calendar/calendar.component.mjs +37 -56
  45. package/esm2022/calendar/calendar.module.mjs +10 -21
  46. package/esm2022/calendar/calendars.module.mjs +10 -21
  47. package/esm2022/calendar/localization/calendar-custom-messages.component.mjs +9 -1
  48. package/esm2022/calendar/localization/multiview-calendar-custom-messages.component.mjs +9 -1
  49. package/esm2022/calendar/models/selection-range.interface.mjs +2 -0
  50. package/esm2022/calendar/models/selection.mjs +11 -0
  51. package/esm2022/calendar/multiview-calendar.component.mjs +46 -40
  52. package/esm2022/calendar/multiview-calendar.module.mjs +1 -0
  53. package/esm2022/calendar/templates/cell-template.directive.mjs +16 -19
  54. package/esm2022/calendar/templates/century-cell-template.directive.mjs +15 -19
  55. package/esm2022/calendar/templates/decade-cell-template.directive.mjs +15 -19
  56. package/esm2022/calendar/templates/footer-template.directive.mjs +16 -17
  57. package/esm2022/calendar/templates/header-template.directive.mjs +19 -18
  58. package/esm2022/calendar/templates/header-title-template.directive.mjs +15 -18
  59. package/esm2022/calendar/templates/month-cell-template.directive.mjs +15 -17
  60. package/esm2022/calendar/templates/navigation-item-template.directive.mjs +15 -18
  61. package/esm2022/calendar/templates/weeknumber-cell-template.directive.mjs +15 -17
  62. package/esm2022/calendar/templates/year-cell-template.directive.mjs +15 -20
  63. package/esm2022/dateinput/dateinput.component.mjs +44 -120
  64. package/esm2022/dateinput/dateinput.module.mjs +15 -2
  65. package/esm2022/dateinput/localization/dateinput-custom-messages.component.mjs +18 -1
  66. package/esm2022/datepicker/datepicker.component.mjs +65 -127
  67. package/esm2022/datepicker/datepicker.module.mjs +11 -2
  68. package/esm2022/datepicker/localization/datepicker-custom-messages.component.mjs +11 -1
  69. package/esm2022/daterange/date-range-end-input.directive.mjs +22 -24
  70. package/esm2022/daterange/date-range-popup-template.directive.mjs +13 -2
  71. package/esm2022/daterange/date-range-popup.component.mjs +83 -73
  72. package/esm2022/daterange/date-range-selection.directive.mjs +10 -9
  73. package/esm2022/daterange/date-range-start-input.directive.mjs +26 -27
  74. package/esm2022/daterange/date-range.component.mjs +1 -6
  75. package/esm2022/daterange/date-range.service.mjs +27 -27
  76. package/esm2022/datetimepicker/datetimepicker.component.mjs +88 -79
  77. package/esm2022/datetimepicker/datetimepicker.module.mjs +16 -2
  78. package/esm2022/datetimepicker/localization/datetimepicker-custom-messages.component.mjs +10 -1
  79. package/esm2022/package-metadata.mjs +2 -2
  80. package/esm2022/timepicker/localization/messages.mjs +14 -14
  81. package/esm2022/timepicker/localization/timepicker-custom-messages.component.mjs +12 -1
  82. package/esm2022/timepicker/timepicker.component.mjs +54 -119
  83. package/esm2022/timepicker/timepicker.module.mjs +13 -2
  84. package/esm2022/timepicker/timeselector.component.mjs +24 -40
  85. package/fesm2022/progress-kendo-angular-dateinputs.mjs +870 -1003
  86. package/package.json +13 -12
  87. package/timepicker/localization/messages.d.ts +14 -14
  88. package/timepicker/localization/timepicker-custom-messages.component.d.ts +12 -1
  89. package/timepicker/timepicker.component.d.ts +50 -115
  90. package/timepicker/timepicker.module.d.ts +13 -2
  91. package/timepicker/timeselector.component.d.ts +24 -40
@@ -40,7 +40,28 @@ import { FooterTemplateDirective } from '../calendar/templates/footer-template.d
40
40
  import { WeekDaysFormat } from '../common/models/week-days-format';
41
41
  import * as i0 from "@angular/core";
42
42
  /**
43
- * Represents the [Kendo UI DateTimePicker component for Angular]({% slug overview_datetimepicker %}).
43
+ * Represents the Kendo UI DateTimePicker component for Angular.
44
+ * Allows users to select both date and time values from an interactive calendar and time selector.
45
+ *
46
+ * @example
47
+ * ```typescript
48
+ * @Component({
49
+ * selector: 'my-app',
50
+ * template: `
51
+ * <kendo-datetimepicker
52
+ * [(value)]="dateTimeValue"
53
+ * [format]="'g'"
54
+ * [min]="minDate"
55
+ * [max]="maxDate">
56
+ * </kendo-datetimepicker>
57
+ * `
58
+ * })
59
+ * export class AppComponent {
60
+ * public dateTimeValue: Date = new Date();
61
+ * public minDate: Date = new Date(2000, 0, 1);
62
+ * public maxDate: Date = new Date(2030, 11, 31);
63
+ * }
64
+ * ```
44
65
  */
45
66
  export declare class DateTimePickerComponent extends MultiTabStop implements OnInit, OnChanges, AfterViewInit, OnDestroy, ControlValueAccessor, Validator {
46
67
  private popupService;
@@ -97,27 +118,27 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
97
118
  weekDaysFormat?: WeekDaysFormat;
98
119
  /**
99
120
  * Displays the days that fall out of the current month in the Calendar ([see example]({% slug datetimepicker_calendar_options %}#toc-displaying-other-month-days)).
100
- * The default values per Calendar type are:
101
- * - `infinite` - false
102
- * - `classic` - true
121
+ * You can set this to show or hide days from other months.
122
+ *
123
+ * For infinite Calendar the default value is `false`, while for classic Calendar it is `true`.
103
124
  */
104
125
  showOtherMonthDays: boolean;
105
126
  /**
106
- * Specifies the value of the DateTimePicker component.
127
+ * Sets the value of the DateTimePicker component.
128
+ * You can set a specific date and time for the picker to display and use.
107
129
  *
108
- * > The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
130
+ * The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
109
131
  */
110
132
  set value(value: Date | null);
111
133
  get value(): Date | null;
112
134
  /**
113
135
  * Specifies the date format for displaying the input value
114
- * ([see example]({% slug formats_datetimepicker %}))
136
+ * ([see example]({% slug formats_datetimepicker %})).
115
137
  *
116
- * Format value options:
117
- * - `string` - Provide a `string` if a single format is going to be used regardless whether the input is focused or blurred.
118
- * - [`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.
138
+ * When using a string format, the same format is applied regardless of whether the input is focused or blurred.
139
+ * When using a FormatSettings object, you can specify different inputFormat and displayFormat values for focused and blurred states.
119
140
  *
120
- * > If a [`FormatSettings`]({% slug api_dateinputs_formatsettings %}) object is provided, the `displayFormat` value will be used for the popup TimePicker.
141
+ * If a FormatSettings object is provided, the displayFormat value will be used for the popup TimePicker.
121
142
  */
122
143
  set format(format: string | FormatSettings);
123
144
  get format(): string | FormatSettings;
@@ -127,6 +148,7 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
127
148
  *
128
149
  * The default value is 68, indicating that typing any value less than 69
129
150
  * will be assumed to be 20xx, while 69 and larger will be assumed to be 19xx.
151
+ * @default 68
130
152
  */
131
153
  twoDigitYearMax: number;
132
154
  /**
@@ -144,47 +166,53 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
144
166
  * Configures the popup settings of the DateTimePicker
145
167
  * ([see example]({% slug datetimepicker_popup_options %}#toc-customizing-the-popup)).
146
168
  *
147
- * The available options are:
148
- * - `animate: Boolean`&mdash;Controls the popup animation. By default, the open and close animations are enabled.
149
- * - `appendTo: 'root' | 'component' | ViewContainerRef`&mdash;Controls the popup container. By default, the popup will be appended to the root component.
150
- * - `popupClass: String`&mdash;Specifies a list of CSS classes that are used to style the popup.
169
+ * The available options are animate which controls the popup animation and by default, the open and close animations are enabled.
170
+ * The `appendTo` option controls the popup container and by default, the popup will be appended to the root component.
171
+ * The `popupClass` option specifies a list of CSS classes that are used to style the popup.
151
172
  */
152
173
  set popupSettings(settings: PopupSettings);
153
174
  get popupSettings(): PopupSettings;
154
175
  /**
155
- * Sets the title of the input element of the DateTimePicker and the title text rendered
156
- * in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
176
+ * Specifies the title of the input element of the DateTimePicker and the title text rendered
177
+ * in the header of the popup (action sheet). Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
178
+ * @default ''
157
179
  */
158
180
  adaptiveTitle: string;
159
181
  /**
160
- * Sets the subtitle text rendered in the header of the popup(action sheet).
182
+ * Specifies the subtitle text rendered in the header of the popup (action sheet).
161
183
  * Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
184
+ * @default ''
162
185
  */
163
186
  adaptiveSubtitle: string;
164
187
  /**
165
- * Sets or gets the `disabled` property of the DateTimePicker and determines whether the component is active
188
+ * Specifies the `disabled` property of the DateTimePicker and determines whether the component is active
166
189
  * ([see example]({% slug disabled_datetimepicker %})).
167
190
  * 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).
191
+ * @default false
168
192
  */
169
193
  disabled: boolean;
170
194
  /**
171
- * Sets the read-only state of the DateTimePicker
195
+ * Specifies the read-only state of the DateTimePicker
172
196
  * ([see example]({% slug readonly_datetimepicker %}#toc-read-only-datetimepicker)).
197
+ * @default false
173
198
  *
174
199
  * @default false
175
200
  */
176
201
  readonly: boolean;
177
202
  /**
178
- * Sets the read-only state of the DateTimePicker input field
203
+ * Determines whether the input field of the DateTimePicker is read-only
179
204
  * ([see example]({% slug readonly_datetimepicker %}#toc-read-only-input)).
180
205
  *
181
- * > Note that if you set the [`readonly`]({% slug api_dateinputs_datetimepickercomponent %}#toc-readonly) property value to `true`,
206
+ * If you set the [`readonly`]({% slug api_dateinputs_datetimepickercomponent %}#toc-readonly) property value to `true`,
182
207
  * the input will be rendered in a read-only state regardless of the `readOnlyInput` value.
208
+ *
209
+ * @default false
183
210
  */
184
211
  readOnlyInput: boolean;
185
212
  /**
186
213
  * Determines whether to display the **Cancel** button in the popup
187
214
  * ([see example]({% slug datetimepicker_popup_options %}#toc-toggling-the-cancel-button)).
215
+ * @default true
188
216
  */
189
217
  cancelButton: boolean;
190
218
  /**
@@ -210,17 +238,14 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
210
238
  /**
211
239
  * Specifies the Calendar type.
212
240
  *
213
- * The possible values are:
214
- * - `infinite` (default)
215
- * - `classic`
216
- *
241
+ * @default 'infinite'
217
242
  */
218
243
  calendarType: CalendarType;
219
244
  /**
220
245
  * Determines whether to enable animation when navigating to previous/next Calendar view.
221
246
  * Applies to the [`classic`]({% slug api_dateinputs_datetimepickercomponent %}#toc-calendartype) Calendar only.
222
247
  *
223
- * > 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.
248
+ * The 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.
224
249
  *
225
250
  * @default false
226
251
  */
@@ -228,6 +253,7 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
228
253
  /**
229
254
  * Determines whether to display a week number column in the `month` view of the popup Calendar
230
255
  * ([see example]({% slug datetimepicker_calendar_options %}#toc-week-number-column)).
256
+ * @default false
231
257
  */
232
258
  weekNumber: boolean;
233
259
  /**
@@ -249,24 +275,25 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
249
275
  set max(value: Date | null);
250
276
  get max(): Date;
251
277
  /**
252
- * Determines whether the built-in min or max validators are enforced when validating a form
278
+ * Determines whether the built-in `min` or `max` validators are enforced when validating a form
253
279
  * ([see example](slug:dateranges_datetimepicker)).
254
280
  *
255
281
  * @default true
256
282
  */
257
283
  rangeValidation: boolean;
258
284
  /**
259
- * Determines whether the built-in validator for disabled
260
- * date ranges is enforced when validating a form
285
+ * Determines whether the built-in validator for disabled date ranges is enforced when validating a form
261
286
  * ([see example](slug:disabled_dates_datetimepicker)).
287
+ * @default true
262
288
  */
263
289
  disabledDatesValidation: boolean;
264
290
  /**
265
- * Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
291
+ * Determines whether the built-in validation for incomplete dates is enforced when validating a form.
292
+ * @default false
266
293
  */
267
294
  incompleteDateValidation: boolean;
268
295
  /**
269
- * Determines whether to autocorrect invalid segments automatically.
296
+ * Determines whether to auto correct invalid segments automatically.
270
297
  *
271
298
  * @default true
272
299
  */
@@ -278,39 +305,40 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
278
305
  */
279
306
  autoSwitchParts: boolean;
280
307
  /**
281
- * A string array representing custom keys, which will move the focus to the next date format segment.
308
+ * Specifies custom keys that move the focus to the next date format segment.
282
309
  */
283
310
  autoSwitchKeys: string[];
284
311
  /**
285
- * Indicates whether the mouse scroll can be used to increase/decrease the time segments values.
312
+ * Determines whether you can use the mouse scroll to increase or decrease the time segment values.
286
313
  *
287
314
  * @default true
288
315
  */
289
316
  enableMouseWheel: boolean;
290
317
  /**
291
- * Determines if the users should see a blinking caret inside the Date Input when possible.
318
+ * Determines whether you can see a blinking caret inside the DateInput when possible.
292
319
  *
293
320
  * @default false
294
321
  */
295
322
  allowCaretMode: boolean;
296
323
  /**
297
- * If set to `true`, renders a clear button after the input text or DateTimePicker value has been changed.
324
+ * Renders a clear button when set to `true` after the input text or DateTimePicker value has been changed.
298
325
  * Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
299
326
  * @default false
300
327
  */
301
328
  clearButton: boolean;
302
329
  /**
303
- * When enabled, the DateTimePicker will autofill the rest of the date to the current date when the component loses focus.
330
+ * Auto fills the rest of the date to the current date when the component loses focus.
304
331
  *
305
332
  * @default false
306
333
  */
307
334
  autoFill: boolean;
308
335
  /**
309
- * Enables or disables the adaptive mode. By default the adaptive rendering is disabled.
336
+ * Enables or disables the adaptive mode. The adaptive rendering is disabled by default.
337
+ * @default 'none'
310
338
  */
311
339
  adaptiveMode: AdaptiveMode;
312
340
  /**
313
- * Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
341
+ * Specifies the HTML attributes of the inner focusable input element. You cannot change attributes that are essential for certain component functionalities.
314
342
  */
315
343
  inputAttributes: {
316
344
  [key: string]: string;
@@ -347,7 +375,7 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
347
375
  */
348
376
  escape: EventEmitter<any>;
349
377
  /**
350
- * Indicates whether the component is currently open. That is when the popup or actionSheet is open.
378
+ * Indicates whether the component is currently open. This is when the popup or action sheet is open.
351
379
  */
352
380
  get isOpen(): boolean;
353
381
  /**
@@ -356,44 +384,25 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
356
384
  get isActive(): boolean;
357
385
  set isActive(value: boolean);
358
386
  /**
359
- * Sets the active tab on opening the popup
387
+ * Specifies the active tab when opening the popup
360
388
  * ([see example]({% slug datetimepicker_popup_options %}#toc-setting-the-default-tab)).
361
389
  */
362
390
  set defaultTab(tab: DateTimePickerActiveTab);
363
391
  get defaultTab(): DateTimePickerActiveTab;
364
392
  /**
365
- * Sets the size of the component.
366
- *
367
- * The possible values are:
368
- * * `small`
369
- * * `medium` (Default)
370
- * * `large`
371
- * * `none`
393
+ * Specifies the size of the component.
372
394
  *
373
395
  */
374
396
  set size(size: DateInputSize);
375
397
  get size(): DateInputSize;
376
398
  /**
377
- * Sets the border radius of the component.
378
- *
379
- * The possible values are:
380
- * * `small`
381
- * * `medium` (Default)
382
- * * `large`
383
- * * `full`
384
- * * `none`
399
+ * Specifies the border radius of the component.
385
400
  *
386
401
  */
387
402
  set rounded(rounded: DateInputRounded);
388
403
  get rounded(): DateInputRounded;
389
404
  /**
390
- * Sets the fillMode of the component.
391
- *
392
- * The possible values are:
393
- * * `solid` (Default)
394
- * * `flat`
395
- * * `outline`
396
- * * `none`
405
+ * Specifies the fill mode of the component.
397
406
  *
398
407
  */
399
408
  set fillMode(fillMode: DateInputFillMode);
@@ -565,17 +574,17 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
565
574
  ngOnChanges(changes: SimpleChanges): void;
566
575
  ngOnDestroy(): void;
567
576
  /**
568
- * * If the popup is closed, focuses the DateTimePicker input.
569
- * * If the popup is open, the focus is moved to its content.
577
+ * Focuses the DateTimePicker input if the popup is closed.
578
+ * Moves the focus to the popup content if the popup is open.
570
579
  */
571
580
  focus(): void;
572
581
  /**
573
- * Blurs the DateTimePicker.
582
+ * Blurs the DateTimePicker component.
574
583
  */
575
584
  blur(): void;
576
585
  /**
577
- * Toggles the visibility of the popup or actionSheet.
578
- * If you use the `toggle` method to show or hide the popup or actionSheet,
586
+ * Toggles the visibility of the popup or action sheet.
587
+ * If you use the `toggle` method to show or hide the popup or action sheet,
579
588
  * the `open` and `close` events do not fire.
580
589
  *
581
590
  * @param show - The state of the popup.
@@ -693,21 +702,21 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
693
702
  private verifyValue;
694
703
  private verifyMinMaxRange;
695
704
  /**
696
- * Extracts the time slots and the literals that are not preceded by date parts
697
- * and concatenates the resulting parts into a string.
698
- * If the provided format value does not contain any time parts,
699
- * returns the designated format of the default popup component of the TimePicker.
705
+ * Extracts the time slots and literals that are not preceded by date parts
706
+ * and combines the resulting parts into a string.
707
+ * If the provided `format` value does not contain any time parts,
708
+ * returns the designated format of the default popup component of the `TimePicker`.
700
709
  */
701
710
  private getTimeSelectorFormat;
702
711
  /**
703
712
  * Extracts the `displayFormat` from the provided `string | FormatSettings` value.
704
- * Fallbacks to the default input value, if a falsy value param is passed.
713
+ * Falls back to the default input value if a falsy value parameter is passed.
705
714
  */
706
715
  private getDisplayFormat;
707
716
  /**
708
717
  * The filter expression that filters out all format parts
709
718
  * except for `hour`, `minute`, `second`, `dayperiod`, and specific literals.
710
- * Literals will be left only if they are not preceded by date parts.
719
+ * Literals remain only if they are not preceded by date parts.
711
720
  */
712
721
  private timeFormatPartFilter;
713
722
  /**
@@ -720,19 +729,19 @@ export declare class DateTimePickerComponent extends MultiTabStop implements OnI
720
729
  private closePopup;
721
730
  private handleValueChange;
722
731
  /**
723
- * Indicates whether the focus target is part of this component,
724
- * that is, whether the focus target is inside the component or in the popup.
732
+ * Indicates whether the focus target is part of this component.
733
+ * Checks whether the focus target is inside the component or in the popup.
725
734
  */
726
735
  private focusTargetInComponent;
727
736
  private setTimeSelectorMinMax;
728
737
  private setCalendarValue;
729
738
  /**
730
- * If the popup is available, runs a popup change detection.
739
+ * Runs a popup change detection if the popup is available.
731
740
  */
732
741
  private detectPopupChanges;
733
742
  /**
734
- * Depending on the predicate `runInZone` value that is passed,
735
- * runs the provided function either in the Angular or in the current zone.
743
+ * Runs the provided function either in the Angular zone or in the current zone.
744
+ * The execution zone depends on the predicate `runInZone` value that is passed.
736
745
  */
737
746
  private run;
738
747
  private handleDateCompletenessChange;
@@ -17,8 +17,22 @@ import * as i11 from "../calendar/templates/weeknumber-cell-template.directive";
17
17
  import * as i12 from "../calendar/templates/year-cell-template.directive";
18
18
  import * as i13 from "@progress/kendo-angular-common";
19
19
  /**
20
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
21
- * definition for the DateTimePicker component.
20
+ * Required for adding all DateTimePicker features in [NgModule-based](link:site.data.urls.angular['ngmoduleapi']) Angular applications.
21
+ *
22
+ * @example
23
+ * ```typescript
24
+ * import { NgModule } from '@angular/core';
25
+ * import { BrowserModule } from '@angular/platform-browser';
26
+ * import { DateTimePickerModule } from '@progress/kendo-angular-dateinputs';
27
+ *
28
+ * @NgModule({
29
+ * imports: [
30
+ * BrowserModule,
31
+ * DateTimePickerModule
32
+ * ]
33
+ * })
34
+ * export class AppModule { }
35
+ * ```
22
36
  */
23
37
  export declare class DateTimePickerModule {
24
38
  static ɵfac: i0.ɵɵFactoryDeclaration<DateTimePickerModule, never>;
@@ -6,7 +6,16 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
6
6
  import { DateTimePickerMessages } from './messages';
7
7
  import * as i0 from "@angular/core";
8
8
  /**
9
- * Custom component messages override default component messages ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
9
+ * Allows you to override the default messages of the DateTimePicker component ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
10
+ *
11
+ * @example
12
+ * ```html
13
+ * <kendo-datetimepicker>
14
+ * <kendo-datetimepicker-messages
15
+ * toggle="Open calendar">
16
+ * </kendo-datetimepicker-messages>
17
+ * </kendo-datetimepicker>
18
+ * ```
10
19
  */
11
20
  export declare class DateTimePickerCustomMessagesComponent extends DateTimePickerMessages {
12
21
  protected service: LocalizationService;
@@ -81,16 +81,9 @@ export const KENDO_INPUT_PROVIDER = {
81
81
  };
82
82
  /**
83
83
  * Represents the [Kendo UI Calendar component for Angular](slug:overview_calendar).
84
- *
85
84
  * @example
86
- * ```ts
87
- * _@Component({
88
- * selector: 'my-app',
89
- * template: `
90
- * <kendo-calendar></kendo-calendar>
91
- * `
92
- * })
93
- * export class AppComponent { }
85
+ * ```html
86
+ * <kendo-calendar></kendo-calendar>
94
87
  * ```
95
88
  */
96
89
  export class CalendarComponent {
@@ -108,10 +101,7 @@ export class CalendarComponent {
108
101
  selectionService;
109
102
  pickerService;
110
103
  /**
111
- * Displays the days that fall out of the current month ([see example]({% slug viewoptions_calendar %}#toc-displaying-other-month-days)).
112
- * The default values per Calendar type are:
113
- * - `infinite` - false
114
- * - `classic` - true
104
+ * Shows days that fall outside the current month and the default values per Calendar type are false for infinite and true for classic ([see example]({% slug viewoptions_calendar %}#toc-displaying-other-month-days)).
115
105
  */
116
106
  set showOtherMonthDays(_showOtherMonthDays) {
117
107
  this._showOtherMonthDays = _showOtherMonthDays;
@@ -134,11 +124,10 @@ export class CalendarComponent {
134
124
  return `kendo-popup-${this.bus.calendarId}`;
135
125
  }
136
126
  /**
137
- * Sets or gets the `focusedDate` property of the Calendar and
138
- * defines the focused date of the component
127
+ * Specifies the focused date of the Calendar
139
128
  * ([see example]({% slug dates_calendar %}#toc-focused-dates)).
140
129
  *
141
- * > If the Calendar is out of the min or max range, it normalizes the defined `focusedDate`.
130
+ * If the Calendar is outside the `min` or `max` range, the component normalizes the defined `focusedDate`.
142
131
  */
143
132
  set focusedDate(focusedDate) {
144
133
  if (this.activeViewDate && !isEqual(this._focusedDate, focusedDate)) {
@@ -168,10 +157,10 @@ export class CalendarComponent {
168
157
  return this.id + '-header';
169
158
  }
170
159
  /**
171
- * Sets or gets the `min` property of the Calendar and
172
- * defines the minimum allowed date value
160
+ * Specifies the minimum allowed date value
173
161
  * ([see example]({% slug dateranges_calendar %})).
174
- * By default, the `min` value is `1900-1-1`.
162
+ *
163
+ * @default 1900-1-1
175
164
  */
176
165
  set min(min) {
177
166
  this._min = min || new Date(MIN_DATE);
@@ -180,10 +169,10 @@ export class CalendarComponent {
180
169
  return this._min;
181
170
  }
182
171
  /**
183
- * Sets or gets the `max` property of the Calendar and
184
- * defines the maximum allowed date value
172
+ * Specifies the maximum allowed date value
185
173
  * ([see example]({% slug dateranges_calendar %})).
186
- * By default, the `max` value is `2099-12-31`.
174
+ *
175
+ * @default 2099-12-31
187
176
  */
188
177
  set max(max) {
189
178
  this._max = max || new Date(MAX_DATE);
@@ -192,29 +181,27 @@ export class CalendarComponent {
192
181
  return this._max;
193
182
  }
194
183
  /**
195
- * Determines whether the built-in min or max validators are enforced when validating a form.
184
+ * Determines whether the built-in `min` or `max` validators are enforced when validating a form.
196
185
  *
197
186
  * @default false
198
187
  */
199
188
  rangeValidation = false;
200
189
  /**
201
- * Sets the format of the displayed Calendar week days' names.
190
+ * Specifies the format of the displayed week day names.
191
+ *
202
192
  * @default 'short'
203
193
  */
204
194
  weekDaysFormat = "short";
205
195
  /**
206
196
  * Toggles the visibility of the footer.
197
+ *
207
198
  * @default false
208
199
  */
209
200
  footer = false;
210
201
  /**
211
202
  * Sets the Calendar selection mode
212
203
  * ([see example]({% slug selection_calendar %})).
213
- *
214
- * The available values are:
215
- * * `single` (default)
216
- * * `multiple`
217
- * * `range`
204
+ * @default 'single'
218
205
  */
219
206
  set selection(_selection) {
220
207
  this._selection = _selection;
@@ -234,7 +221,7 @@ export class CalendarComponent {
234
221
  /**
235
222
  * Sets or gets the `value` property of the Calendar and defines the selected value of the component.
236
223
  *
237
- * > The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance when in `single` selection mode, an array of valid JavaScript Date instances when in `multiple` selection mode, or an object of type `SelectionRange` when in `range` selection mode.
224
+ * The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance when in `single` selection mode, an array of valid JavaScript Date instances when in `multiple` selection mode, or an object of type `SelectionRange` when in `range` selection mode.
238
225
  */
239
226
  set value(candidate) {
240
227
  this.valueSetter = true;
@@ -251,9 +238,11 @@ export class CalendarComponent {
251
238
  */
252
239
  disabled = false;
253
240
  /**
254
- * Sets or gets the `tabindex` property of the Calendar. Based on the
241
+ * Specifies the `tabindex` property of the Calendar. Based on the
255
242
  * [HTML `tabindex`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) behavior,
256
243
  * it determines whether the component is focusable.
244
+ *
245
+ * @default 0
257
246
  */
258
247
  tabindex = 0;
259
248
  /**
@@ -266,7 +255,7 @@ export class CalendarComponent {
266
255
  return this.tabindex;
267
256
  }
268
257
  /**
269
- * Sets the dates of the Calendar that will be disabled
258
+ * Specifies the dates of the Calendar that will be disabled
270
259
  * ([see example]({% slug disabled_dates_calendar %})).
271
260
  */
272
261
  set disabledDates(value) {
@@ -277,37 +266,39 @@ export class CalendarComponent {
277
266
  return this._disabledDates;
278
267
  }
279
268
  /**
280
- * Sets or gets the `navigation` property of the Calendar
281
- * and determines whether the navigation side-bar will be displayed
269
+ * Determines whether the navigation side-bar will be displayed
282
270
  * ([see example]({% slug sidebar_calendar %})).
283
271
  * Applies to the [`infinite`]({% slug api_dateinputs_calendarcomponent %}#toc-type) Calendar only.
272
+ *
273
+ * @default true
284
274
  */
285
275
  navigation = true;
286
276
  /**
287
277
  * Defines the active view that the Calendar initially renders
288
278
  * ([see example]({% slug viewoptions_calendar %})).
289
- * By default, the active view is `month`.
279
+ * You have to set `activeView` within the `topView`-`bottomView` range.
290
280
  *
291
- * > You have to set `activeView` within the `topView`-`bottomView` range.
281
+ * @default 'month'
292
282
  */
293
283
  activeView = CalendarViewEnum[CalendarViewEnum.month];
294
284
  /**
295
285
  * Defines the bottommost view to which the user can navigate
296
286
  * ([see example](slug:viewdepth_calendar)).
287
+ *
288
+ * @default 'month'
297
289
  */
298
290
  bottomView = CalendarViewEnum[CalendarViewEnum.month];
299
291
  /**
300
292
  * Defines the topmost view to which the user can navigate
301
293
  * ([see example](slug:viewdepth_calendar)).
294
+ *
295
+ * @default 'century'
302
296
  */
303
297
  topView = CalendarViewEnum[CalendarViewEnum.century];
304
298
  /**
305
299
  * Specifies the Calendar type.
306
300
  *
307
- * The possible values are:
308
- * - `infinite` (default)
309
- * - `classic`
310
- *
301
+ * @default 'infinite'
311
302
  */
312
303
  set type(type) {
313
304
  this.renderer.removeClass(this.element.nativeElement, `k-calendar-${this.type}`);
@@ -323,7 +314,7 @@ export class CalendarComponent {
323
314
  * Determines whether to enable animation when navigating to previous/next view.
324
315
  * Applies to the [`classic`]({% slug api_dateinputs_calendarcomponent %}#toc-type) Calendar only.
325
316
  *
326
- * > 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.
317
+ * 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.
327
318
  *
328
319
  * @default false
329
320
  */
@@ -331,6 +322,8 @@ export class CalendarComponent {
331
322
  /**
332
323
  * Determines whether to display a week number column in the `month` view
333
324
  * ([see example]({% slug weeknumcolumn_calendar %})).
325
+ *
326
+ * @default false
334
327
  */
335
328
  weekNumber = false;
336
329
  /**
@@ -578,10 +571,10 @@ export class CalendarComponent {
578
571
  }
579
572
  _size = DEFAULT_SIZE;
580
573
  /**
581
- * Specify, which end of the defined selection range should be marked as active.
574
+ * Specifies which end of the defined selection range should be marked as active.
575
+ * Value will be ignored if the selection range is undefined. If range selection is used then the default value is 'start'.
582
576
  *
583
- * > Value will be ignored if the selection range is undefined.
584
- * > If range selection is used then the default value is 'start'.
577
+ * @default 'start'
585
578
  */
586
579
  set activeRangeEnd(_activeRangeEnd) {
587
580
  this._activeRangeEnd = _activeRangeEnd;
@@ -783,18 +776,6 @@ export class CalendarComponent {
783
776
  }
784
777
  /**
785
778
  * Focuses the Calendar by making the table.k-calendar-table element active.
786
- *
787
- * @example
788
- * ```ts
789
- * _@Component({
790
- * selector: 'my-app',
791
- * template: `
792
- * <button (click)="calendar.focus()">Focus calendar</button>
793
- * <kendo-calendar #calendar></kendo-calendar>
794
- * `
795
- * })
796
- * export class AppComponent { }
797
- * ```
798
779
  */
799
780
  focus() {
800
781
  this.currentlyFocusedElement = this.type === 'infinite' ?