@progress/kendo-angular-dateinputs 11.4.0-develop.7 → 11.4.0-develop.9

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 (42) hide show
  1. package/calendar/calendar.component.d.ts +18 -1
  2. package/common/adaptive.module.d.ts +18 -0
  3. package/datepicker/datepicker.component.d.ts +57 -6
  4. package/datepicker/datepicker.module.d.ts +2 -1
  5. package/daterange/date-range-popup.component.d.ts +58 -7
  6. package/daterange/date-range-selection.directive.d.ts +12 -2
  7. package/daterange/date-range.module.d.ts +9 -6
  8. package/daterange/localization/daterange-popup-custom-messages.component.d.ts +17 -0
  9. package/daterange/localization/daterange-popup-localized-messages.directive.d.ts +16 -0
  10. package/daterange/localization/messages.d.ts +29 -0
  11. package/datetimepicker/datetimepicker.component.d.ts +58 -5
  12. package/datetimepicker/datetimepicker.module.d.ts +2 -1
  13. package/esm2020/calendar/calendar.component.mjs +34 -2
  14. package/esm2020/calendar/multiview-calendar.component.mjs +2 -1
  15. package/esm2020/common/adaptive.module.mjs +41 -0
  16. package/esm2020/datepicker/datepicker.component.mjs +271 -48
  17. package/esm2020/datepicker/datepicker.module.mjs +7 -3
  18. package/esm2020/daterange/date-range-popup.component.mjs +320 -17
  19. package/esm2020/daterange/date-range-selection.directive.mjs +27 -12
  20. package/esm2020/daterange/date-range.component.mjs +1 -1
  21. package/esm2020/daterange/date-range.module.mjs +16 -5
  22. package/esm2020/daterange/localization/daterange-popup-custom-messages.component.mjs +41 -0
  23. package/esm2020/daterange/localization/daterange-popup-localized-messages.directive.mjs +37 -0
  24. package/esm2020/daterange/localization/messages.mjs +29 -0
  25. package/esm2020/datetimepicker/datetimepicker.component.mjs +306 -49
  26. package/esm2020/datetimepicker/datetimepicker.module.mjs +7 -3
  27. package/esm2020/index.mjs +3 -0
  28. package/esm2020/package-metadata.mjs +2 -2
  29. package/esm2020/timepicker/services/dom.service.mjs +33 -7
  30. package/esm2020/timepicker/timepicker.component.mjs +279 -33
  31. package/esm2020/timepicker/timepicker.module.mjs +5 -2
  32. package/esm2020/timepicker/timeselector.component.mjs +7 -1
  33. package/esm2020/util.mjs +18 -0
  34. package/fesm2015/progress-kendo-angular-dateinputs.mjs +1417 -175
  35. package/fesm2020/progress-kendo-angular-dateinputs.mjs +1417 -175
  36. package/index.d.ts +4 -0
  37. package/package.json +11 -9
  38. package/timepicker/services/dom.service.d.ts +3 -0
  39. package/timepicker/timepicker.component.d.ts +52 -5
  40. package/timepicker/timepicker.module.d.ts +2 -1
  41. package/timepicker/timeselector.component.d.ts +7 -2
  42. package/util.d.ts +12 -0
package/index.d.ts CHANGED
@@ -68,6 +68,10 @@ export { TimePickerCustomMessagesComponent } from './timepicker/localization/tim
68
68
  export { TimeSelectorCustomMessagesComponent } from './timepicker/localization/timeselector-custom-messages.component';
69
69
  export { LocalizedMessagesDirective } from './datetimepicker/localization/localized-messages.directive';
70
70
  export { DateTimePickerCustomMessagesComponent } from './datetimepicker/localization/datetimepicker-custom-messages.component';
71
+ export { DateRangePopupCustomMessagesComponent } from './daterange/localization/daterange-popup-custom-messages.component';
72
+ export { DateRangePopupLocalizedMessagesDirective } from './daterange/localization/daterange-popup-localized-messages.directive';
71
73
  export { DateInputSize } from './common/models/size';
72
74
  export { DateInputRounded } from './common/models/rounded';
73
75
  export { DateInputFillMode } from './common/models/fillmode';
76
+ export { AdaptiveMode } from './util';
77
+ export { AdaptiveModule } from './common/adaptive.module';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@progress/kendo-angular-dateinputs",
3
- "version": "11.4.0-develop.7",
3
+ "version": "11.4.0-develop.9",
4
4
  "description": "Kendo UI for Angular Date Inputs Package - Everything you need to add date selection functionality to apps (DatePicker, TimePicker, DateInput, DateRangePicker, DateTimePicker, Calendar, and MultiViewCalendar).",
5
5
  "license": "SEE LICENSE IN LICENSE.md",
6
6
  "author": "Progress",
@@ -33,18 +33,20 @@
33
33
  "@angular/core": "13 - 15",
34
34
  "@angular/platform-browser": "13 - 15",
35
35
  "@progress/kendo-licensing": "^1.0.2",
36
- "@progress/kendo-angular-common": "11.4.0-develop.7",
37
- "@progress/kendo-angular-intl": "11.4.0-develop.7",
38
- "@progress/kendo-angular-l10n": "11.4.0-develop.7",
39
- "@progress/kendo-angular-icons": "11.4.0-develop.7",
40
- "@progress/kendo-angular-popup": "11.4.0-develop.7",
36
+ "@progress/kendo-angular-common": "11.4.0-develop.9",
37
+ "@progress/kendo-angular-intl": "11.4.0-develop.9",
38
+ "@progress/kendo-angular-l10n": "11.4.0-develop.9",
39
+ "@progress/kendo-angular-icons": "11.4.0-develop.9",
40
+ "@progress/kendo-angular-popup": "11.4.0-develop.9",
41
+ "@progress/kendo-angular-navigation": "11.4.0-develop.9",
41
42
  "rxjs": "^6.5.3 || ^7.0.0",
42
- "@progress/kendo-angular-buttons": "11.4.0-develop.7",
43
- "@progress/kendo-angular-label": "11.4.0-develop.7"
43
+ "@progress/kendo-angular-buttons": "11.4.0-develop.9",
44
+ "@progress/kendo-angular-inputs": "11.4.0-develop.9",
45
+ "@progress/kendo-angular-label": "11.4.0-develop.9"
44
46
  },
45
47
  "dependencies": {
46
48
  "tslib": "^2.3.1",
47
- "@progress/kendo-angular-schematics": "11.4.0-develop.7",
49
+ "@progress/kendo-angular-schematics": "11.4.0-develop.9",
48
50
  "@progress/kendo-common": "^0.2.0",
49
51
  "@progress/kendo-date-math": "^1.1.0"
50
52
  },
@@ -10,6 +10,9 @@ import * as i0 from "@angular/core";
10
10
  export declare class TimePickerDOMService {
11
11
  itemHeight: number;
12
12
  timeListHeight: number;
13
+ isAdaptiveEnabled: boolean;
14
+ isDateTimePicker: boolean;
15
+ get windowSize(): 'large' | 'medium' | 'small';
13
16
  ensureHeights(): void;
14
17
  calculateHeights(container?: HTMLElement): void;
15
18
  isActive(element: ElementRef): boolean;
@@ -14,11 +14,13 @@ import { TimeSelectorComponent } from './timeselector.component';
14
14
  import { DateInputComponent } from '../dateinput/dateinput.component';
15
15
  import { PopupSettings } from '../popup-settings.model';
16
16
  import { PreventableEvent } from '../preventable-event';
17
+ import { AdaptiveMode } from '../util';
17
18
  import { DateInputSize } from '../common/models/size';
18
19
  import { DateInputRounded } from '../common/models/rounded';
19
20
  import { DateInputFillMode } from '../common/models/fillmode';
20
21
  import { BusViewService } from '../calendar/services/bus-view.service';
21
22
  import { SVGIcon } from '@progress/kendo-svg-icons';
23
+ import { ActionSheetComponent } from '@progress/kendo-angular-navigation';
22
24
  import * as i0 from "@angular/core";
23
25
  /**
24
26
  * Represents the [Kendo UI TimePicker component for Angular]({% slug overview_timepicker %}#toc-basic-usage).
@@ -42,6 +44,7 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
42
44
  container: ViewContainerRef;
43
45
  popupTemplate: TemplateRef<any>;
44
46
  toggleButton: ElementRef;
47
+ actionSheet: ActionSheetComponent;
45
48
  /**
46
49
  * @hidden
47
50
  */
@@ -200,13 +203,25 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
200
203
  set tabIndex(tabIndex: number);
201
204
  get tabIndex(): number;
202
205
  /**
203
- * Sets the title of the input element of the TimePicker.
206
+ * Sets the title of the input element of the TimePicker and the title text rendered
207
+ * in the header of the popup(action sheet). Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
204
208
  */
205
209
  title: string;
210
+ /**
211
+ * Sets the subtitle text rendered in the header of the popup(action sheet).
212
+ * Applicable only when [`AdaptiveMode` is set to `auto`](slug:api_dateinputs_adaptivemode).
213
+ */
214
+ set subtitle(subtitle: string);
215
+ get subtitle(): string;
216
+ private _subtitle;
206
217
  /**
207
218
  * Determines whether the built-in min or max validators are enforced when a form is being validated.
208
219
  */
209
220
  rangeValidation: boolean;
221
+ /**
222
+ * Enables or disables the adaptive mode. By default the adaptive rendering is disabled.
223
+ */
224
+ adaptiveMode: AdaptiveMode;
210
225
  /**
211
226
  * Specifies the value of the TimePicker component.
212
227
  */
@@ -325,6 +340,10 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
325
340
  get disabledClass(): boolean;
326
341
  get popupUID(): string;
327
342
  popupRef: PopupRef;
343
+ /**
344
+ * @hidden
345
+ */
346
+ xIcon: SVGIcon;
328
347
  get isActive(): boolean;
329
348
  set isActive(value: boolean);
330
349
  get show(): boolean;
@@ -352,6 +371,7 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
352
371
  private _size;
353
372
  private _rounded;
354
373
  private _fillMode;
374
+ private windowSize;
355
375
  constructor(bus: BusViewService, zone: NgZone, localization: LocalizationService, cdr: ChangeDetectorRef, popupService: PopupService, wrapper: ElementRef, renderer: Renderer2, injector: Injector, pickerService: PickerService, intl: IntlService, touchEnabled: boolean);
356
376
  /**
357
377
  * @hidden
@@ -425,14 +445,15 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
425
445
  */
426
446
  blur(): void;
427
447
  /**
428
- * Toggles the visibility of the popup. If you use the `toggle` method to show or hide the popup,
448
+ * Toggles the visibility of the popup or actionSheet.
449
+ * If you use the `toggle` method to show or hide the popup or actionSheet,
429
450
  * the `open` and `close` events do not fire.
430
451
  *
431
452
  * @param show - The state of the popup.
432
453
  */
433
454
  toggle(show?: boolean): void;
434
455
  /**
435
- * Returns the current open state of the popup.
456
+ * Indicates whether the component is currently open. That is when the popup or actionSheet is open.
436
457
  */
437
458
  get isOpen(): boolean;
438
459
  /**
@@ -443,6 +464,14 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
443
464
  * @hidden
444
465
  */
445
466
  handleChange(value: Date): void;
467
+ /**
468
+ * @hidden
469
+ */
470
+ handleActionSheetAccept(): void;
471
+ /**
472
+ * @hidden
473
+ */
474
+ handleActionSheetCollapse(): void;
446
475
  /**
447
476
  * @hidden
448
477
  */
@@ -451,6 +480,10 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
451
480
  * @hidden
452
481
  */
453
482
  handleInputChange(value: Date): void;
483
+ /**
484
+ * @hidden
485
+ */
486
+ handleDateInputClick(): void;
454
487
  /**
455
488
  * @hidden
456
489
  */
@@ -463,6 +496,14 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
463
496
  * @hidden
464
497
  */
465
498
  get popupClasses(): string[];
499
+ /**
500
+ * @hidden
501
+ */
502
+ get isAdaptiveModeEnabled(): boolean;
503
+ /**
504
+ * @hidden
505
+ */
506
+ get isAdaptive(): boolean;
466
507
  /**
467
508
  * @hidden
468
509
  */
@@ -471,8 +512,14 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
471
512
  * @hidden
472
513
  */
473
514
  mergeTime(value: Date): Date;
515
+ /**
516
+ * @hidden
517
+ */
518
+ onResize(): void;
519
+ private toggleTimeSelector;
520
+ private toggleActionSheet;
474
521
  private togglePopup;
475
- private _toggle;
522
+ private updateActionSheetAdaptiveAppearance;
476
523
  private focusInput;
477
524
  private toggleFocus;
478
525
  private verifyValue;
@@ -485,5 +532,5 @@ export declare class TimePickerComponent implements ControlValueAccessor, OnInit
485
532
  private handleDateCompletenessChange;
486
533
  private setComponentClasses;
487
534
  static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerComponent, [null, null, null, null, null, null, null, null, null, null, { optional: true; }]>;
488
- static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "kendo-timepicker", ["kendo-timepicker"], { "focusableId": "focusableId"; "disabled": "disabled"; "readonly": "readonly"; "readOnlyInput": "readOnlyInput"; "format": "format"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "min": "min"; "max": "max"; "incompleteDateValidation": "incompleteDateValidation"; "cancelButton": "cancelButton"; "nowButton": "nowButton"; "steps": "steps"; "popupSettings": "popupSettings"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "title": "title"; "rangeValidation": "rangeValidation"; "value": "value"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; }, { "valueChange": "valueChange"; "onFocus": "focus"; "onBlur": "blur"; "open": "open"; "close": "close"; }, never, never>;
535
+ static ɵcmp: i0.ɵɵComponentDeclaration<TimePickerComponent, "kendo-timepicker", ["kendo-timepicker"], { "focusableId": "focusableId"; "disabled": "disabled"; "readonly": "readonly"; "readOnlyInput": "readOnlyInput"; "format": "format"; "formatPlaceholder": "formatPlaceholder"; "placeholder": "placeholder"; "min": "min"; "max": "max"; "incompleteDateValidation": "incompleteDateValidation"; "cancelButton": "cancelButton"; "nowButton": "nowButton"; "steps": "steps"; "popupSettings": "popupSettings"; "tabindex": "tabindex"; "tabIndex": "tabIndex"; "title": "title"; "subtitle": "subtitle"; "rangeValidation": "rangeValidation"; "adaptiveMode": "adaptiveMode"; "value": "value"; "size": "size"; "rounded": "rounded"; "fillMode": "fillMode"; }, { "valueChange": "valueChange"; "onFocus": "focus"; "onBlur": "blur"; "open": "open"; "close": "close"; }, never, never>;
489
536
  }
@@ -17,12 +17,13 @@ import * as i11 from "@progress/kendo-angular-popup";
17
17
  import * as i12 from "../virtualization/virtualization.module";
18
18
  import * as i13 from "@progress/kendo-angular-common";
19
19
  import * as i14 from "@progress/kendo-angular-icons";
20
+ import * as i15 from "../common/adaptive.module";
20
21
  /**
21
22
  * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
22
23
  * definition for the TimePicker component.
23
24
  */
24
25
  export declare class TimePickerModule {
25
26
  static ɵfac: i0.ɵɵFactoryDeclaration<TimePickerModule, never>;
26
- static ɵmod: i0.ɵɵNgModuleDeclaration<TimePickerModule, [typeof i1.TimePickerLocalizedMessagesDirective, typeof i2.TimeListComponent, typeof i3.TimePickerCustomMessagesComponent, typeof i4.TimePickerComponent, typeof i5.TimeSelectorLocalizedMessagesDirective, typeof i6.TimeSelectorCustomMessagesComponent, typeof i7.TimeSelectorComponent], [typeof i8.CommonModule, typeof i9.DateInputModule, typeof i10.IntlModule, typeof i11.PopupModule, typeof i12.VirtualizationModule, typeof i13.EventsModule, typeof i14.IconsModule], [typeof i1.TimePickerLocalizedMessagesDirective, typeof i2.TimeListComponent, typeof i3.TimePickerCustomMessagesComponent, typeof i4.TimePickerComponent, typeof i5.TimeSelectorLocalizedMessagesDirective, typeof i6.TimeSelectorCustomMessagesComponent, typeof i7.TimeSelectorComponent]>;
27
+ static ɵmod: i0.ɵɵNgModuleDeclaration<TimePickerModule, [typeof i1.TimePickerLocalizedMessagesDirective, typeof i2.TimeListComponent, typeof i3.TimePickerCustomMessagesComponent, typeof i4.TimePickerComponent, typeof i5.TimeSelectorLocalizedMessagesDirective, typeof i6.TimeSelectorCustomMessagesComponent, typeof i7.TimeSelectorComponent], [typeof i8.CommonModule, typeof i9.DateInputModule, typeof i10.IntlModule, typeof i11.PopupModule, typeof i12.VirtualizationModule, typeof i13.EventsModule, typeof i14.IconsModule, typeof i15.AdaptiveModule], [typeof i1.TimePickerLocalizedMessagesDirective, typeof i2.TimeListComponent, typeof i3.TimePickerCustomMessagesComponent, typeof i4.TimePickerComponent, typeof i5.TimeSelectorLocalizedMessagesDirective, typeof i6.TimeSelectorCustomMessagesComponent, typeof i7.TimeSelectorComponent]>;
27
28
  static ɵinj: i0.ɵɵInjectorDeclaration<TimePickerModule>;
28
29
  }
@@ -18,7 +18,7 @@ import * as i0 from "@angular/core";
18
18
  export declare class TimeSelectorComponent implements OnChanges, OnInit, OnDestroy {
19
19
  localization: LocalizationService;
20
20
  private cdr;
21
- private element;
21
+ element: ElementRef;
22
22
  intl: IntlService;
23
23
  dom: TimePickerDOMService;
24
24
  private zone;
@@ -63,6 +63,11 @@ export declare class TimeSelectorComponent implements OnChanges, OnInit, OnDestr
63
63
  * Sets or gets the `disabled` property of the TimeSelector and determines whether the component is active.
64
64
  */
65
65
  disabled: boolean;
66
+ /**
67
+ * Needed in order to set it in the dom service so that timeselector height can be properly calculated
68
+ */
69
+ isAdaptiveEnabled: boolean;
70
+ isDateTimePicker: boolean;
66
71
  /**
67
72
  * Configures the incremental steps of the TimeSelector.
68
73
  *
@@ -185,5 +190,5 @@ export declare class TimeSelectorComponent implements OnChanges, OnInit, OnDestr
185
190
  private emitFocus;
186
191
  private listIndex;
187
192
  static ɵfac: i0.ɵɵFactoryDeclaration<TimeSelectorComponent, [null, null, null, null, null, null, null, { optional: true; }]>;
188
- static ɵcmp: i0.ɵɵComponentDeclaration<TimeSelectorComponent, "kendo-timeselector", ["kendo-timeselector"], { "format": "format"; "min": "min"; "max": "max"; "cancelButton": "cancelButton"; "setButton": "setButton"; "nowButton": "nowButton"; "disabled": "disabled"; "steps": "steps"; "value": "value"; }, { "valueChange": "valueChange"; "valueReject": "valueReject"; }, never, never>;
193
+ static ɵcmp: i0.ɵɵComponentDeclaration<TimeSelectorComponent, "kendo-timeselector", ["kendo-timeselector"], { "format": "format"; "min": "min"; "max": "max"; "cancelButton": "cancelButton"; "setButton": "setButton"; "nowButton": "nowButton"; "disabled": "disabled"; "isAdaptiveEnabled": "isAdaptiveEnabled"; "isDateTimePicker": "isDateTimePicker"; "steps": "steps"; "value": "value"; }, { "valueChange": "valueChange"; "valueReject": "valueReject"; }, never, never>;
189
194
  }
package/util.d.ts CHANGED
@@ -197,3 +197,15 @@ export declare const DEFAULT_SIZE: DateInputSize;
197
197
  * @hidden
198
198
  */
199
199
  export declare const DEFAULT_FILL_MODE: DateInputFillMode;
200
+ /**
201
+ * @hidden
202
+ */
203
+ export declare const windowSize: () => 'large' | 'medium' | 'small';
204
+ /**
205
+ * Specifies the adaptive rendering of the component.
206
+ *
207
+ * The supported values are:
208
+ * * `none`&mdash;(default)
209
+ * * `auto`
210
+ */
211
+ export declare type AdaptiveMode = 'none' | 'auto';