@progress/kendo-angular-dateinputs 19.1.2-develop.3 → 19.1.2-develop.5

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 (93) hide show
  1. package/calendar/calendar.component.d.ts +40 -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 +49 -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/codemods/utils.js +0 -3
  25. package/dateinput/dateinput.component.d.ts +50 -119
  26. package/dateinput/dateinput.module.d.ts +15 -2
  27. package/dateinput/localization/dateinput-custom-messages.component.d.ts +18 -1
  28. package/dateinput/models/format-placeholder.model.d.ts +15 -20
  29. package/dateinput/models/format-settings.model.d.ts +14 -4
  30. package/dateinput/models/incremental-steps.model.d.ts +16 -1
  31. package/datepicker/datepicker.component.d.ts +68 -127
  32. package/datepicker/datepicker.module.d.ts +11 -2
  33. package/datepicker/localization/datepicker-custom-messages.component.d.ts +11 -1
  34. package/daterange/auto-correct-on.type.d.ts +2 -1
  35. package/daterange/date-range-end-input.directive.d.ts +25 -24
  36. package/daterange/date-range-popup-template.directive.d.ts +13 -2
  37. package/daterange/date-range-popup.component.d.ts +83 -73
  38. package/daterange/date-range-selection.directive.d.ts +10 -9
  39. package/daterange/date-range-start-input.directive.d.ts +29 -27
  40. package/daterange/date-range.component.d.ts +4 -6
  41. package/daterange/date-range.service.d.ts +27 -27
  42. package/datetimepicker/datetimepicker.component.d.ts +91 -79
  43. package/datetimepicker/datetimepicker.module.d.ts +16 -2
  44. package/datetimepicker/localization/datetimepicker-custom-messages.component.d.ts +10 -1
  45. package/esm2022/calendar/calendar.component.mjs +40 -56
  46. package/esm2022/calendar/calendar.module.mjs +10 -21
  47. package/esm2022/calendar/calendars.module.mjs +10 -21
  48. package/esm2022/calendar/localization/calendar-custom-messages.component.mjs +9 -1
  49. package/esm2022/calendar/localization/multiview-calendar-custom-messages.component.mjs +9 -1
  50. package/esm2022/calendar/models/selection-range.interface.mjs +2 -0
  51. package/esm2022/calendar/models/selection.mjs +11 -0
  52. package/esm2022/calendar/multiview-calendar.component.mjs +49 -40
  53. package/esm2022/calendar/multiview-calendar.module.mjs +1 -0
  54. package/esm2022/calendar/templates/cell-template.directive.mjs +16 -19
  55. package/esm2022/calendar/templates/century-cell-template.directive.mjs +15 -19
  56. package/esm2022/calendar/templates/decade-cell-template.directive.mjs +15 -19
  57. package/esm2022/calendar/templates/footer-template.directive.mjs +16 -17
  58. package/esm2022/calendar/templates/header-template.directive.mjs +19 -18
  59. package/esm2022/calendar/templates/header-title-template.directive.mjs +15 -18
  60. package/esm2022/calendar/templates/month-cell-template.directive.mjs +15 -17
  61. package/esm2022/calendar/templates/navigation-item-template.directive.mjs +15 -18
  62. package/esm2022/calendar/templates/weeknumber-cell-template.directive.mjs +15 -17
  63. package/esm2022/calendar/templates/year-cell-template.directive.mjs +15 -20
  64. package/esm2022/dateinput/dateinput.component.mjs +57 -126
  65. package/esm2022/dateinput/dateinput.module.mjs +15 -2
  66. package/esm2022/dateinput/localization/dateinput-custom-messages.component.mjs +18 -1
  67. package/esm2022/datepicker/datepicker.component.mjs +71 -130
  68. package/esm2022/datepicker/datepicker.module.mjs +11 -2
  69. package/esm2022/datepicker/localization/datepicker-custom-messages.component.mjs +11 -1
  70. package/esm2022/daterange/date-range-end-input.directive.mjs +25 -24
  71. package/esm2022/daterange/date-range-popup-template.directive.mjs +13 -2
  72. package/esm2022/daterange/date-range-popup.component.mjs +83 -73
  73. package/esm2022/daterange/date-range-selection.directive.mjs +10 -9
  74. package/esm2022/daterange/date-range-start-input.directive.mjs +29 -27
  75. package/esm2022/daterange/date-range.component.mjs +4 -6
  76. package/esm2022/daterange/date-range.service.mjs +27 -27
  77. package/esm2022/datetimepicker/datetimepicker.component.mjs +94 -82
  78. package/esm2022/datetimepicker/datetimepicker.module.mjs +16 -2
  79. package/esm2022/datetimepicker/localization/datetimepicker-custom-messages.component.mjs +10 -1
  80. package/esm2022/package-metadata.mjs +2 -2
  81. package/esm2022/timepicker/localization/messages.mjs +14 -14
  82. package/esm2022/timepicker/localization/timepicker-custom-messages.component.mjs +12 -1
  83. package/esm2022/timepicker/timepicker.component.mjs +57 -119
  84. package/esm2022/timepicker/timepicker.module.mjs +13 -2
  85. package/esm2022/timepicker/timeselector.component.mjs +24 -40
  86. package/fesm2022/progress-kendo-angular-dateinputs.mjs +913 -1015
  87. package/package.json +13 -12
  88. package/popup-settings.model.d.ts +3 -10
  89. package/timepicker/localization/messages.d.ts +14 -14
  90. package/timepicker/localization/timepicker-custom-messages.component.d.ts +12 -1
  91. package/timepicker/timepicker.component.d.ts +53 -115
  92. package/timepicker/timepicker.module.d.ts +13 -2
  93. package/timepicker/timeselector.component.d.ts +24 -40
@@ -5,30 +5,25 @@
5
5
  import { TemplateRef } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Used for rendering the year cell content of the Calendar. To define the year cell template, nest an
9
- * `<ng-template>` tag with the `kendoCalendarYearCellTemplate` directive inside the component tag.
10
- * The template context is set to the current component. To get a reference to the current date, use
11
- * the `let-date` directive. To provide more details about the current year cell, get a reference to the
12
- * current `cellContext` by using the `let-cellContext` directive.
8
+ * A directive for customizing the year cells in the Calendar component.
9
+ *
10
+ * This directive allows you to define a custom template for rendering the content of year cells
11
+ * when the Calendar is in year view. The template context provides access to the current date
12
+ * and cell context information.
13
+ *
14
+ * Template Context Variables:
15
+ * - `date` - The Date object representing the current cell's date
16
+ * - `cellContext` - Additional context information about the current year cell
13
17
  *
14
18
  * For more examples, refer to the article on [templates]({% slug templates_calendar %}).
15
19
  *
16
20
  * @example
17
- * ```ts
18
- * _@Component({
19
- * selector: 'my-app',
20
- * styles: ['.custom { color: red; }'],
21
- * template: `
22
- * <kendo-calendar [activeView]="activeView">
23
- * <ng-template kendoCalendarYearCellTemplate let-context="cellContext">
24
- * <span class="custom">{{context.formattedValue}}</span>
25
- * </ng-template>
26
- * </kendo-calendar>
27
- * `
28
- * })
29
- * export class AppComponent {
30
- * public activeView: CalendarView = 'year';
31
- * }
21
+ * ```html
22
+ * <kendo-calendar [activeView]="'year'">
23
+ * <ng-template kendoCalendarYearCellTemplate let-context="cellContext">
24
+ * <span class="custom">{{context.formattedValue}}</span>
25
+ * </ng-template>
26
+ * </kendo-calendar>
32
27
  * ```
33
28
  */
34
29
  export declare class YearCellTemplateDirective {
package/codemods/utils.js CHANGED
@@ -207,8 +207,6 @@ const tsPropertyValueTransformer = (root, j, typeName, oldValue, newValue) => {
207
207
  path.node.value.value = newValue;
208
208
  }
209
209
  });
210
- // 2. Find all assignments to variables of the specified type
211
- const variablesOfType = new Set();
212
210
  // First, collect all variables with the specified type
213
211
  root
214
212
  .find(j.VariableDeclarator)
@@ -224,7 +222,6 @@ const tsPropertyValueTransformer = (root, j, typeName, oldValue, newValue) => {
224
222
  })
225
223
  .forEach(path => {
226
224
  if (path.node.id.type === 'Identifier') {
227
- variablesOfType.add(path.node.id.name);
228
225
  // Also update the initial value if it matches
229
226
  if (path.node.init &&
230
227
  path.node.init.type === 'StringLiteral' &&
@@ -43,6 +43,13 @@ export declare class DateInputIntl {
43
43
  }
44
44
  /**
45
45
  * Represents the [Kendo UI DateInput component for Angular](slug:overview_dateinput).
46
+ *
47
+ * ```html
48
+ * <kendo-dateinput/>
49
+ * ```
50
+ *
51
+ * @remarks
52
+ * Supported children components are: {@link DateInputCustomMessagesComponent}.
46
53
  */
47
54
  export declare class DateInputComponent implements OnInit, AfterViewInit, ControlValueAccessor, OnChanges, OnDestroy, Validator {
48
55
  private cdr;
@@ -75,31 +82,36 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
75
82
  */
76
83
  set pickerType(_pickerType: DatePickerType);
77
84
  /**
78
- * If set to `true`, renders a clear button after the input text or DateInput value has been changed.
85
+ * Specifies whether to render a clear button after the input text or DateInput value has been changed.
79
86
  * Clicking this button resets the value of the component to `null` and triggers the `valueChange` event.
80
87
  * @default false
81
88
  */
82
89
  clearButton: boolean;
83
90
  /**
84
- * Sets or gets the `disabled` property of the DateInput and
85
- * determines whether the component is active
91
+ * Specifies whether the component is disabled
86
92
  * ([see example]({% slug disabled_dateinput %})).
87
93
  * To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_dateinput#toc-managing-the-dateinput-disabled-state-in-reactive-forms).
94
+ *
95
+ * @default false
88
96
  */
89
97
  disabled: boolean;
90
98
  /**
91
- * Sets or gets the read-only state of the DateInput
99
+ * Specifies the read-only state of the DateInput
92
100
  * ([see example]({% slug readonly_dateinput %})).
93
101
  *
94
102
  * @default false
95
103
  */
96
104
  readonly: boolean;
97
105
  /**
98
- * Sets the title of the input element of the DateInput.
106
+ * Specifies the title of the input element of the DateInput.
107
+ *
108
+ * @default ""
99
109
  */
100
110
  title: string;
101
111
  /**
102
- * Sets or gets the `tabIndex` property of the DateInput.
112
+ * Specifies the `tabIndex` property of the DateInput.
113
+ *
114
+ * @default 0
103
115
  */
104
116
  tabindex: number;
105
117
  /**
@@ -123,56 +135,14 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
123
135
  * Specifies the date format that is used to display the input value
124
136
  * ([see example]({% slug formats_dateinput %})).
125
137
  *
126
- * Format value options:
127
- * - `string` - Provide a `string` if a single format is going to be used regardless whether the input is focused or blurred.
128
- * - [`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
+ * You can provide a string if a single format is going to be used regardless whether the input is focused or blurred.
139
+ * Alternatively, you can provide a FormatSettings object to display different formats when the component is focused or blurred by specifying inputFormat and displayFormat values.
129
140
  */
130
141
  format: string | FormatSettings;
131
142
  /**
132
143
  * Defines the descriptions of the format sections in the input field.
133
144
  * For more information, refer to the article on
134
145
  * [placeholders]({% slug placeholders_dateinput %}).
135
- *
136
- * @example
137
- * ```ts
138
- * _@Component({
139
- * selector: 'my-app',
140
- * template: `
141
- * <div class="row example-wrapper" [style.min-height.px]="450">
142
- * <div class="col-xs-12 col-md-6 example-col">
143
- * <p>Full-length format description:</p>
144
- * <kendo-dateinput formatPlaceholder="wide"></kendo-dateinput>
145
- * </div>
146
- *
147
- * <div class="col-xs-12 col-md-6 example-col">
148
- * <p>Narrow-length format description:</p>
149
- * <kendo-dateinput formatPlaceholder="narrow"></kendo-dateinput>
150
- * </div>
151
- *
152
- * <div class="col-xs-12 col-md-6 example-col">
153
- * <p>Short-length format description:</p>
154
- * <kendo-dateinput formatPlaceholder="short"></kendo-dateinput>
155
- * </div>
156
- *
157
- * <div class="col-xs-12 col-md-6 example-col">
158
- * <p>Display defined format:</p>
159
- * <kendo-dateinput format="MM/dd/yyyy" formatPlaceholder="formatPattern"></kendo-dateinput>
160
- * </div>
161
- *
162
- * <div class="col-xs-12 col-md-6 example-col">
163
- * <p>Custom defined format descriptions</p>
164
- * <kendo-dateinput format="G"
165
- * [formatPlaceholder]="{
166
- * year: 'y', month: 'M', day: 'd',
167
- * hour: 'h', minute: 'm', second: 's'
168
- * }"
169
- * ></kendo-dateinput>
170
- * </div>
171
- * </div>
172
- * `
173
- * })
174
- * export class AppComponent { }
175
- * ```
176
146
  */
177
147
  set formatPlaceholder(format: DateInputFormatPlaceholder);
178
148
  get formatPlaceholder(): DateInputFormatPlaceholder;
@@ -180,86 +150,72 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
180
150
  * Specifies the hint the DateInput displays when its value is `null`.
181
151
  * For more information, refer to the article on
182
152
  * [placeholders]({% slug placeholders_dateinput %}).
183
- *
184
- * @example
185
- * ```ts
186
- * _@Component({
187
- * selector: 'my-app',
188
- * template: `
189
- * <kendo-dateinput placeholder="Enter birth date..."></kendo-dateinput>
190
- * `
191
- * })
192
- * export class AppComponent { }
193
- * ```
153
+ * @default null
194
154
  */
195
155
  placeholder: string;
196
156
  /**
197
157
  * Configures the incremental steps of the DateInput.
198
158
  * For more information, refer to the article on
199
159
  * [incremental steps]({% slug incrementalsteps_dateinput %}).
200
- *
201
- * @example
202
- * ```ts
203
- * _@Component({
204
- * selector: 'my-app',
205
- * template: `
206
- * <kendo-dateinput [steps]="steps"></kendo-dateinput>
207
- * `
208
- * })
209
- * export class AppComponent {
210
- * public steps = { year: 10, month: 1, day: 5 };
211
- * }
212
- * ```
213
160
  */
214
161
  steps: DateInputIncrementalSteps;
215
162
  /**
216
163
  * Specifies the biggest date that is valid
217
164
  * ([see example]({% slug dateranges_dateinput %})).
218
- * By default, the `max` value is `2099-12-31`.
165
+ *
166
+ * @default 2099-12-31
219
167
  */
220
168
  max: Date;
221
169
  /**
222
170
  * Specifies the smallest date that is valid
223
171
  * ([see example]({% slug dateranges_dateinput %})).
224
- * By default, the `min` value is `1900-1-1`.
172
+ *
173
+ * @default 1900-1-1
225
174
  */
226
175
  min: Date;
227
176
  /**
228
- * Determines whether the built-in min or max validators are to be enforced when a form is being validated.
177
+ * Specifies whether to enforce the built-in min and max validators when validating a form.
178
+ * Set to `true` to enable validation for the `min` and `max` values.
229
179
  *
230
180
  * @default true
231
181
  */
232
182
  rangeValidation: boolean;
233
183
  /**
234
- * Determines whether to autocorrect invalid segments automatically.
184
+ * Specifies if the component automatically corrects invalid date segments.
185
+ * When set to `true`, the component fixes invalid segments as you type.
235
186
  *
236
187
  * @default true
237
188
  */
238
189
  autoCorrectParts: boolean;
239
190
  /**
240
- * Determines whether to automatically move to the next segment after the user completes the current one.
191
+ * Specifies if the component automatically moves to the next segment after you complete the current one.
192
+ * When set to `true`, focus moves to the next segment as soon as you finish typing the current segment.
241
193
  *
242
194
  * @default true
243
195
  */
244
196
  autoSwitchParts: boolean;
245
197
  /**
246
- * A string array representing custom keys, which will move the focus to the next date format segment.
198
+ * Specifies custom keys that move focus to the next date format segment.
199
+ * Provide an array of strings to define which keys trigger the focus change.
247
200
  */
248
201
  autoSwitchKeys: string[];
249
202
  /**
250
- * Determines if the users should see a blinking caret inside the Date Input when possible.
203
+ * Specifies if the component displays a blinking caret inside the DateInput when possible.
204
+ * Set to `true` to show a blinking caret for better visual feedback.
251
205
  *
252
206
  * @default false
253
207
  */
254
208
  allowCaretMode: boolean;
255
209
  /**
256
- * When enabled, the DateInput will autofill the rest of the date to the current date when the component loses focus.
210
+ * Specifies whether to autofill the rest of the date to the current date when the component loses focus.
257
211
  *
258
212
  * @default false
259
213
  */
260
214
  autoFill: boolean;
261
215
  /**
262
- * Determines whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
216
+ * Specifies whether the built-in validation for incomplete dates is to be enforced when a form is being validated.
217
+ *
218
+ * @default false
263
219
  */
264
220
  incompleteDateValidation: boolean;
265
221
  /**
@@ -268,6 +224,7 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
268
224
  *
269
225
  * The default value is 68, indicating that typing any value less than 69
270
226
  * will be assumed to be 20xx, while 69 and larger will be assumed to be 19xx.
227
+ * @default 68
271
228
  */
272
229
  twoDigitYearMax: number;
273
230
  /**
@@ -279,7 +236,7 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
279
236
  /**
280
237
  * Specifies the value of the DateInput component.
281
238
  *
282
- * > The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
239
+ * The `value` has to be a valid [JavaScript `Date`](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Date) instance or `null`.
283
240
  */
284
241
  set value(value: Date | null);
285
242
  get value(): Date | null;
@@ -287,6 +244,8 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
287
244
  * Specifies whether the **Up** and **Down** spin buttons will be rendered.
288
245
  * For more information, refer to the article on
289
246
  * [spinner buttons]({% slug spinbuttons_dateinput %}).
247
+ *
248
+ * @default false
290
249
  */
291
250
  spinners: boolean;
292
251
  /**
@@ -298,44 +257,27 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
298
257
  */
299
258
  hasPopup: string;
300
259
  /**
301
- * Sets the size of the component.
260
+ * Specifies the size of the component.
302
261
  *
303
- * The possible values are:
304
- * * `small`
305
- * * `medium` (Default)
306
- * * `large`
307
- * * `none`
262
+ * @default medium
308
263
  *
309
264
  */
310
265
  set size(size: DateInputSize);
311
266
  get size(): DateInputSize;
312
267
  /**
313
- * Sets the border radius of the component.
314
- *
315
- * The possible values are:
316
- * * `small`
317
- * * `medium` (Default)
318
- * * `large`
319
- * * `full`
320
- * * `none`
321
- *
268
+ * Specifies the border radius of the component.
269
+ * @default 'medium'
322
270
  */
323
271
  set rounded(rounded: DateInputRounded);
324
272
  get rounded(): DateInputRounded;
325
273
  /**
326
- * Sets the fillMode of the component.
327
- *
328
- * The possible values are:
329
- * * `solid` (Default)
330
- * * `flat`
331
- * * `outline`
332
- * * `none`
333
- *
274
+ * Specifies the fillMode of the component.
275
+ * @default 'solid'
334
276
  */
335
277
  set fillMode(fillMode: DateInputFillMode);
336
278
  get fillMode(): DateInputFillMode;
337
279
  /**
338
- * Sets the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
280
+ * Specifies the HTML attributes of the inner focusable input element. Attributes which are essential for certain component functionalities cannot be changed.
339
281
  */
340
282
  set inputAttributes(attributes: {
341
283
  [key: string]: string;
@@ -506,17 +448,6 @@ export declare class DateInputComponent implements OnInit, AfterViewInit, Contro
506
448
  /**
507
449
  * Focuses the DateInput component.
508
450
  *
509
- * @example
510
- * ```ts
511
- * _@Component({
512
- * selector: 'my-app',
513
- * template: `
514
- * <button (click)="dateinput.focus()">Focus date input</button>
515
- * <kendo-dateinput #dateinput></kendo-dateinput>
516
- * `
517
- * })
518
- * export class AppComponent { }
519
- * ```
520
451
  */
521
452
  focus(): void;
522
453
  /**
@@ -6,8 +6,21 @@ import * as i0 from "@angular/core";
6
6
  import * as i1 from "./localization/dateinput-custom-messages.component";
7
7
  import * as i2 from "./dateinput.component";
8
8
  /**
9
- * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
10
- * definition for the DateInput component.
9
+ * Required for adding all DateInput features in NgModule-based Angular applications.
10
+ *
11
+ * The package exports:
12
+ * - `DateInputComponent`&mdash;The DateInput component.
13
+ * - `DateInputMessagesComponent`&mdash;The DateInput custom messages component.
14
+ *
15
+ * @example
16
+ * ```ts
17
+ * import { DateInputModule } from '@progress/kendo-angular-dateinputs';
18
+ *
19
+ * @NgModule({
20
+ * imports: [DateInputModule]
21
+ * })
22
+ * export class AppModule { }
23
+ * ```
11
24
  */
12
25
  export declare class DateInputModule {
13
26
  static ɵfac: i0.ɵɵFactoryDeclaration<DateInputModule, never>;
@@ -6,7 +6,24 @@ import { LocalizationService } from '@progress/kendo-angular-l10n';
6
6
  import { DateInputMessages } 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
+ * Represents the Kendo UI DateInput custom messages component.
10
+ * Overrides the default component messages with custom messages ([see example]({% slug globalization_dateinputs %}#toc-custom-messages)).
11
+ *
12
+ * @example
13
+ * ```ts
14
+ * @Component({
15
+ * selector: 'my-app',
16
+ * template: `
17
+ * <kendo-dateinput>
18
+ * <kendo-dateinput-messages
19
+ * increment="Increase value"
20
+ * decrement="Decrease value">
21
+ * </kendo-dateinput-messages>
22
+ * </kendo-dateinput>
23
+ * `
24
+ * })
25
+ * export class AppComponent { }
26
+ * ```
10
27
  */
11
28
  export declare class DateInputCustomMessagesComponent extends DateInputMessages {
12
29
  protected service: LocalizationService;
@@ -3,51 +3,46 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  /**
6
- * The interface which defines a custom-format placeholder structure in the DateInput component.
6
+ * Represents the Kendo UI DateInput custom format placeholder interface.
7
+ * Defines a custom-format placeholder structure in the `DateInput` component.
7
8
  *
8
9
  * @example
9
10
  * ```ts
10
- * _@Component({
11
- * selector: 'my-app',
12
- * template: `
13
- * <kendo-dateinput format="G"
14
- * [formatPlaceholder]="{
15
- * year: 'y', month: 'M', day: 'd',
16
- * hour: 'h', minute: 'm', second: 's'
17
- * }"
18
- * ></kendo-dateinput>
19
- * `
20
- * })
21
- * export class AppComponent { }
11
+ * <kendo-dateinput format="G"
12
+ * [formatPlaceholder]="{
13
+ * year: 'y', month: 'M', day: 'd',
14
+ * hour: 'h', minute: 'm', second: 's'
15
+ * }"
16
+ * ></kendo-dateinput>
22
17
  * ```
23
18
  */
24
19
  export interface DateInputCustomFormatPlaceholder {
25
20
  /**
26
- * Defines the description for the `year` format section.
21
+ * Specifies the description for the `year` format section.
27
22
  */
28
23
  year?: string;
29
24
  /**
30
- * Defines the description for the `month` format section.
25
+ * Specifies the description for the `month` format section.
31
26
  */
32
27
  month?: string;
33
28
  /**
34
- * Defines the description for the `day` format section.
29
+ * Specifies the description for the `day` format section.
35
30
  */
36
31
  day?: string;
37
32
  /**
38
- * Defines the description for the `hour` format section.
33
+ * Specifies the description for the `hour` format section.
39
34
  */
40
35
  hour?: string;
41
36
  /**
42
- * Defines the description for the `minute` format section.
37
+ * Specifies the description for the `minute` format section.
43
38
  */
44
39
  minute?: string;
45
40
  /**
46
- * Defines the description for the `second` format section.
41
+ * Specifies the description for the `second` format section.
47
42
  */
48
43
  second?: string;
49
44
  /**
50
- * Defines the description for the `millisecond` format section.
45
+ * Specifies the description for the `millisecond` format section.
51
46
  */
52
47
  millisecond?: string;
53
48
  }
@@ -4,16 +4,26 @@
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import { DateFormatOptions } from "@progress/kendo-intl";
6
6
  /**
7
- * Specifies the formats used by the DateInput mask when the input is focused or blurred
8
- * ([see example]({% slug formats_datepicker %}#toc-display-and-input-formats)).
7
+ * Represents the Kendo UI DateInput format settings interface.
8
+ * Specifies the formats used by the `DateInput` mask when the input is focused or blurred ([see example]({% slug formats_datepicker %}#toc-display-and-input-formats)).
9
+ *
10
+ * @example
11
+ * ```html
12
+ * <kendo-dateinput
13
+ * [formatSettings]="{
14
+ * inputFormat: 'MM/dd/yyyy',
15
+ * displayFormat: 'MMMM dd, yyyy'
16
+ * }">
17
+ * </kendo-dateinput>
18
+ * ```
9
19
  */
10
20
  export interface FormatSettings {
11
21
  /**
12
- * Used when the input is focused.
22
+ * Specifies the format used when the input is focused.
13
23
  */
14
24
  inputFormat: string | DateFormatOptions;
15
25
  /**
16
- * Used when the input is blurred.
26
+ * Specifies the format used when the input is blurred.
17
27
  */
18
28
  displayFormat: string | DateFormatOptions;
19
29
  }
@@ -3,7 +3,22 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  /**
6
- * The interface which defines all possible incremental steps in the DateInput component.
6
+ * Represents the Kendo UI DateInput incremental steps interface.
7
+ * Defines all possible incremental steps in the `DateInput` component.
8
+ *
9
+ * @example
10
+ * ```html
11
+ * <kendo-dateinput
12
+ * [steps]="{
13
+ * year: 1,
14
+ * month: 1,
15
+ * day: 1,
16
+ * hour: 1,
17
+ * minute: 15,
18
+ * second: 10
19
+ * }">
20
+ * </kendo-dateinput>
21
+ * ```
7
22
  */
8
23
  export interface DateInputIncrementalSteps {
9
24
  year?: number;