@progress/kendo-angular-scheduler 19.1.2-develop.4 → 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 (161) hide show
  1. package/data-binding.directive.d.ts +12 -3
  2. package/directives.d.ts +42 -2
  3. package/editing/edit-dialog-template.directive.d.ts +15 -2
  4. package/editing/recurrence/recurrence-editor.component.d.ts +29 -10
  5. package/editing/timezone-editor.component.d.ts +13 -3
  6. package/editing-directives/base-edit.service.d.ts +8 -11
  7. package/editing-directives/edit-service.interface.d.ts +22 -24
  8. package/editing-directives/reactive-editing.directive.d.ts +15 -2
  9. package/esm2022/data-binding.directive.mjs +12 -3
  10. package/esm2022/directives.mjs +42 -2
  11. package/esm2022/editing/edit-dialog-template.directive.mjs +15 -2
  12. package/esm2022/editing/recurrence/recurrence-editor.component.mjs +29 -10
  13. package/esm2022/editing/timezone-editor.component.mjs +13 -3
  14. package/esm2022/editing-directives/base-edit.service.mjs +8 -11
  15. package/esm2022/editing-directives/reactive-editing.directive.mjs +15 -2
  16. package/esm2022/events/add-event.mjs +3 -3
  17. package/esm2022/events/cancel-event.mjs +2 -2
  18. package/esm2022/events/create-event.mjs +6 -6
  19. package/esm2022/events/date-change-event.mjs +4 -4
  20. package/esm2022/events/drag-end-event.mjs +8 -8
  21. package/esm2022/events/drag-event.mjs +8 -8
  22. package/esm2022/events/drag-start-event.mjs +4 -4
  23. package/esm2022/events/edit-event.mjs +4 -4
  24. package/esm2022/events/event-click-event.mjs +5 -5
  25. package/esm2022/events/event-keydown-event.mjs +4 -4
  26. package/esm2022/events/navigate-event.mjs +3 -3
  27. package/esm2022/events/remove-event.mjs +4 -4
  28. package/esm2022/events/resize-end-event.mjs +6 -6
  29. package/esm2022/events/resize-event.mjs +8 -8
  30. package/esm2022/events/resize-start-event.mjs +4 -4
  31. package/esm2022/events/save-event.mjs +3 -3
  32. package/esm2022/events/slot-click-event.mjs +7 -7
  33. package/esm2022/events/slot-drag-end-event.mjs +1 -1
  34. package/esm2022/events/slot-drag-event.mjs +7 -7
  35. package/esm2022/events/slot-drag-start-event.mjs +8 -7
  36. package/esm2022/localization/custom-messages.component.mjs +14 -1
  37. package/esm2022/localization/messages.mjs +98 -98
  38. package/esm2022/package-metadata.mjs +2 -2
  39. package/esm2022/pdf/pdf-command.directive.mjs +11 -11
  40. package/esm2022/pdf/pdf-export-event.mjs +1 -1
  41. package/esm2022/pdf/pdf.component.mjs +19 -8
  42. package/esm2022/pdf/pdf.module.mjs +7 -8
  43. package/esm2022/scheduler.component.mjs +62 -62
  44. package/esm2022/scheduler.module.mjs +6 -7
  45. package/esm2022/toolbar/navigation.component.mjs +16 -7
  46. package/esm2022/toolbar/toolbar-template.directive.mjs +18 -10
  47. package/esm2022/toolbar/toolbar.service.mjs +3 -4
  48. package/esm2022/toolbar/view-selector.component.mjs +14 -8
  49. package/esm2022/types/crud-operation.enum.mjs +3 -3
  50. package/esm2022/types/edit-mode.enum.mjs +2 -2
  51. package/esm2022/types/scheduler-view.mjs +1 -1
  52. package/esm2022/views/agenda/agenda-view.component.mjs +15 -11
  53. package/esm2022/views/common/slot-selectable.directive.mjs +16 -4
  54. package/esm2022/views/month/month-view.component.mjs +17 -16
  55. package/esm2022/views/month/multi-week-view.component.mjs +20 -18
  56. package/esm2022/views/multi-day/day-view.component.mjs +12 -7
  57. package/esm2022/views/multi-day/multi-day-view.component.mjs +16 -11
  58. package/esm2022/views/multi-day/week-view.component.mjs +14 -11
  59. package/esm2022/views/multi-day/work-week-view.component.mjs +8 -1
  60. package/esm2022/views/scheduler-view.directive.mjs +13 -3
  61. package/esm2022/views/templates/agenda-date-template.directive.mjs +13 -3
  62. package/esm2022/views/templates/agenda-time-template.directive.mjs +13 -3
  63. package/esm2022/views/templates/all-day-event-template.directive.mjs +13 -3
  64. package/esm2022/views/templates/all-day-slot-template.directive.mjs +13 -3
  65. package/esm2022/views/templates/date-header-template.directive.mjs +14 -4
  66. package/esm2022/views/templates/event-template.directive.mjs +13 -3
  67. package/esm2022/views/templates/group-header-template.directive.mjs +14 -4
  68. package/esm2022/views/templates/major-time-header-template.directive.mjs +13 -3
  69. package/esm2022/views/templates/minor-time-header-template.directive.mjs +13 -3
  70. package/esm2022/views/templates/month-day-slot-template.directive.mjs +13 -3
  71. package/esm2022/views/templates/multi-week-day-slot-template.directive.mjs +12 -3
  72. package/esm2022/views/templates/time-slot-template.directive.mjs +14 -4
  73. package/esm2022/views/timeline/timeline-month-view.component.mjs +16 -11
  74. package/esm2022/views/timeline/timeline-view.component.mjs +16 -11
  75. package/esm2022/views/timeline/timeline-week-view.component.mjs +18 -14
  76. package/esm2022/views/view-context.service.mjs +6 -6
  77. package/esm2022/views/view-state.service.mjs +9 -9
  78. package/esm2022/views/year/year-view.component.mjs +12 -7
  79. package/events/add-event.d.ts +3 -3
  80. package/events/cancel-event.d.ts +2 -2
  81. package/events/create-event.d.ts +6 -6
  82. package/events/date-change-event.d.ts +4 -4
  83. package/events/drag-end-event.d.ts +8 -8
  84. package/events/drag-event.d.ts +8 -8
  85. package/events/drag-start-event.d.ts +4 -4
  86. package/events/edit-event.d.ts +4 -4
  87. package/events/event-click-event.d.ts +5 -5
  88. package/events/event-keydown-event.d.ts +4 -4
  89. package/events/navigate-event.d.ts +3 -3
  90. package/events/remove-event.d.ts +4 -4
  91. package/events/resize-end-event.d.ts +6 -6
  92. package/events/resize-event.d.ts +8 -8
  93. package/events/resize-start-event.d.ts +4 -4
  94. package/events/save-event.d.ts +3 -3
  95. package/events/slot-click-event.d.ts +7 -7
  96. package/events/slot-drag-end-event.d.ts +1 -1
  97. package/events/slot-drag-event.d.ts +7 -7
  98. package/events/slot-drag-start-event.d.ts +8 -7
  99. package/fesm2022/progress-kendo-angular-scheduler.mjs +876 -543
  100. package/localization/custom-messages.component.d.ts +14 -1
  101. package/localization/messages.d.ts +98 -98
  102. package/navigation/focus-position.interface.d.ts +2 -3
  103. package/package.json +15 -15
  104. package/pdf/pdf-command.directive.d.ts +11 -11
  105. package/pdf/pdf-export-event.d.ts +1 -1
  106. package/pdf/pdf.component.d.ts +19 -8
  107. package/pdf/pdf.module.d.ts +7 -8
  108. package/scheduler.component.d.ts +62 -62
  109. package/scheduler.module.d.ts +6 -7
  110. package/schematics/ngAdd/index.js +3 -3
  111. package/toolbar/navigation.component.d.ts +16 -7
  112. package/toolbar/toolbar-template.directive.d.ts +18 -10
  113. package/toolbar/toolbar.service.d.ts +3 -4
  114. package/toolbar/view-selector.component.d.ts +14 -8
  115. package/types/actions.d.ts +51 -45
  116. package/types/create-form-group-args.interface.d.ts +1 -1
  117. package/types/crud-operation.enum.d.ts +3 -3
  118. package/types/current-time-settings.interface.d.ts +10 -8
  119. package/types/date-range.interface.d.ts +7 -11
  120. package/types/datepicker-options.interface.d.ts +33 -38
  121. package/types/edit-event-args.interface.d.ts +3 -4
  122. package/types/edit-mode.enum.d.ts +2 -2
  123. package/types/editable-settings.interface.d.ts +6 -6
  124. package/types/event-style-args.interface.d.ts +4 -4
  125. package/types/group.interface.d.ts +2 -2
  126. package/types/numeric-options.interface.d.ts +20 -16
  127. package/types/ongoing-events-settings.interface.d.ts +8 -6
  128. package/types/resource.interface.d.ts +8 -8
  129. package/types/scheduler-event.d.ts +13 -15
  130. package/types/scheduler-model-fields.interface.d.ts +34 -23
  131. package/types/scheduler-slot.interface.d.ts +7 -7
  132. package/types/scheduler-view.d.ts +3 -5
  133. package/types/slot-class-args.interface.d.ts +6 -6
  134. package/types/view-item.interface.d.ts +1 -1
  135. package/views/agenda/agenda-view.component.d.ts +15 -11
  136. package/views/common/slot-selectable.directive.d.ts +16 -4
  137. package/views/month/month-view.component.d.ts +17 -16
  138. package/views/month/multi-week-view.component.d.ts +20 -18
  139. package/views/multi-day/day-view.component.d.ts +12 -7
  140. package/views/multi-day/multi-day-view.component.d.ts +16 -11
  141. package/views/multi-day/week-view.component.d.ts +14 -11
  142. package/views/multi-day/work-week-view.component.d.ts +8 -1
  143. package/views/scheduler-view.directive.d.ts +13 -3
  144. package/views/templates/agenda-date-template.directive.d.ts +13 -3
  145. package/views/templates/agenda-time-template.directive.d.ts +13 -3
  146. package/views/templates/all-day-event-template.directive.d.ts +13 -3
  147. package/views/templates/all-day-slot-template.directive.d.ts +13 -3
  148. package/views/templates/date-header-template.directive.d.ts +14 -4
  149. package/views/templates/event-template.directive.d.ts +13 -3
  150. package/views/templates/group-header-template.directive.d.ts +14 -4
  151. package/views/templates/major-time-header-template.directive.d.ts +13 -3
  152. package/views/templates/minor-time-header-template.directive.d.ts +13 -3
  153. package/views/templates/month-day-slot-template.directive.d.ts +13 -3
  154. package/views/templates/multi-week-day-slot-template.directive.d.ts +12 -3
  155. package/views/templates/time-slot-template.directive.d.ts +14 -4
  156. package/views/timeline/timeline-month-view.component.d.ts +16 -11
  157. package/views/timeline/timeline-view.component.d.ts +16 -11
  158. package/views/timeline/timeline-week-view.component.d.ts +18 -14
  159. package/views/view-context.service.d.ts +6 -6
  160. package/views/view-state.service.d.ts +9 -9
  161. package/views/year/year-view.component.d.ts +12 -7
@@ -11,18 +11,30 @@ import { isChanged } from '@progress/kendo-angular-common';
11
11
  import * as i0 from "@angular/core";
12
12
  import * as i1 from "../../scheduler.component";
13
13
  /**
14
- * A directive which manages the in-memory selection state of the Scheduler slots
15
- * ([see example]({% slug slotselection_scheduler %}#toc-built-in-directive)).
14
+ * Represents a directive that manages the built-in slot selection in the Scheduler.
15
+ *
16
+ * Add the `kendoSchedulerSlotSelectable` directive to a `<kendo-scheduler>` instance to allow users to select time slots by clicking or dragging.
17
+ *
18
+ * The directive keeps track of the selected slot range and emits changes when the selection is updated by user interaction.
19
+ *
20
+ * @example
21
+ * ```html
22
+ * <kendo-scheduler kendoSchedulerSlotSelectable [(slotSelection)]="selectedSlot">
23
+ * </kendo-scheduler>
24
+ * ```
25
+ *
26
+ * @remarks
27
+ * Applied to: {@link SchedulerComponent}
16
28
  */
17
29
  export class SlotSelectableDirective {
18
30
  scheduler;
19
31
  cdr;
20
32
  /**
21
- * The currently selected slot range.
33
+ * Represents the currently selected slot range.
22
34
  */
23
35
  slotSelection;
24
36
  /**
25
- * Fires when the currently selected slot range has changed through user interaction.
37
+ * Fires when the user changes the currently selected slot range.
26
38
  */
27
39
  slotSelectionChange = new EventEmitter();
28
40
  /**
@@ -20,7 +20,14 @@ import * as i2 from "../view-context.service";
20
20
  import * as i3 from "../view-state.service";
21
21
  import * as i4 from "@progress/kendo-angular-intl";
22
22
  /**
23
- * The component for rendering the **Month** view.
23
+ * Represents the component that renders the **Month** view in the Scheduler.
24
+ *
25
+ * @example
26
+ * ```html
27
+ * <kendo-scheduler>
28
+ * <kendo-scheduler-month-view></kendo-scheduler-month-view>
29
+ * </kendo-scheduler>
30
+ * ```
24
31
  */
25
32
  export class MonthViewComponent extends ConfigurationViewBase {
26
33
  intl;
@@ -31,11 +38,9 @@ export class MonthViewComponent extends ConfigurationViewBase {
31
38
  return this.localization.get('monthViewTitle');
32
39
  }
33
40
  /**
34
- * The number of events to be rendered per day. Setting this property to 'auto'
35
- * will display all events in the respective slot
41
+ * Sets the number of events to render per day. If set to `'auto'`, all events display in the slot. If set to `0`, it normalizes to `1`
36
42
  * ([see example](slug:month_views_scheduler#setting-the-number-of-events-per-day)).
37
- * > When set to `'auto'` it will automatically set the `adaptiveSlotHeight` property to `true`.
38
- * > If set to `0` it will be normalized internally to `1`.
43
+ * > When set to `'auto'`, it automatically sets the `adaptiveSlotHeight` property to `true`.
39
44
  * @default 2
40
45
  */
41
46
  set eventsPerDay(events) {
@@ -46,30 +51,26 @@ export class MonthViewComponent extends ConfigurationViewBase {
46
51
  }
47
52
  _eventsPerDay;
48
53
  /**
49
- * The height of the rendered events. Setting this property to 'auto' will
50
- * set the height of each event automatically based on its content
54
+ * Sets the height of the rendered events. If set to `'auto'`, the height is based on the event content
51
55
  * ([see example](slug:month_views_scheduler#configuring-the-height-of-the-scheduler-events)).
52
- * > When set to `'auto'` it will automatically set the `adaptiveSlotHeight` property to `true`.
56
+ * > When set to `'auto'`, it automatically sets the `adaptiveSlotHeight` property to `true`.
53
57
  */
54
58
  eventHeight;
55
59
  /**
56
- * Increases the slot group (row) height when containing events up to the number of displayed events
57
- * and reduces its height if there are less events for that specific slot group (row)
60
+ * Enables adaptive slot height in the Scheduler. Increases the slot group (row) height when containing events up to the number of displayed events and reduces its height if there are fewer events for that slot group (row)
58
61
  * ([see example](slug:month_views_scheduler#enabling-the-adaptive-slot-height-of-the-scheduler)).
59
62
  * @default false
60
63
  */
61
64
  adaptiveSlotHeight;
62
65
  /**
63
- * The long-date format for displaying the
64
- * selected date in the Scheduler toolbar.
65
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting)).
66
+ * Sets the long-date format for the selected date in the Scheduler toolbar.
67
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
66
68
  * @default '{0:Y}'
67
69
  */
68
70
  selectedDateFormat = '{0:Y}';
69
71
  /**
70
- * The short-date format for displaying the
71
- * selected date in the Scheduler toolbar.
72
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting)).
72
+ * Sets the short-date format for the selected date in the Scheduler toolbar.
73
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
73
74
  * @default '{0:y}'
74
75
  */
75
76
  selectedShortDateFormat = '{0:y}';
@@ -20,7 +20,14 @@ import * as i2 from "../view-context.service";
20
20
  import * as i3 from "../view-state.service";
21
21
  import * as i4 from "@progress/kendo-angular-intl";
22
22
  /**
23
- * The component for rendering the **Multi-Week** view.
23
+ * Represents the component that renders the **Multi-Week** view in the Scheduler.
24
+ *
25
+ * @example
26
+ * ```html
27
+ * <kendo-scheduler>
28
+ * <kendo-scheduler-multi-week-view></kendo-scheduler-multi-week-view>
29
+ * </kendo-scheduler>
30
+ * ```
24
31
  */
25
32
  export class MultiWeekViewComponent extends ConfigurationViewBase {
26
33
  intl;
@@ -31,18 +38,15 @@ export class MultiWeekViewComponent extends ConfigurationViewBase {
31
38
  return this.localization.get('multiWeekViewTitle');
32
39
  }
33
40
  /**
34
- * The height of the rendered events. Setting this property to `'auto'` will
35
- * set the height of each event automatically based on its content
41
+ * Sets the height of the rendered events. If set to `'auto'`, the height is based on the event content
36
42
  * ([see example](slug:multiweek_views_scheduler#configuring-the-height-of-the-scheduler-events)).
37
- * > When set to `'auto'` it will automatically set the `adaptiveSlotHeight` property to `true`.
43
+ * > When set to `'auto'`, it automatically sets the `adaptiveSlotHeight` property to `true`.
38
44
  */
39
45
  eventHeight;
40
46
  /**
41
- * The number of events to be rendered per day. Setting this property to 'auto'
42
- * will display all events in the respective slot
47
+ * Sets the number of events to render per day. If set to `'auto'`, all events display in the slot. If set to `0`, it normalizes to `1`
43
48
  * ([see example](slug:multiweek_views_scheduler#setting-the-number-of-events-per-day)).
44
- * > When set to `'auto'` it will automatically set the `adaptiveSlotHeight` property to `true`.
45
- * > If set to `0` it will be normalized internally to `1`.
49
+ * > When set to `'auto'`, it automatically sets the `adaptiveSlotHeight` property to `true`.
46
50
  * @default 2
47
51
  */
48
52
  set eventsPerDay(events) {
@@ -53,34 +57,32 @@ export class MultiWeekViewComponent extends ConfigurationViewBase {
53
57
  }
54
58
  _eventsPerDay;
55
59
  /**
56
- * Increases the slot group (row) height when containing events up to the number of displayed events
57
- * and reduces its height if there are less events for that specific slot group (row)
60
+ * Enables adaptive slot height. Increases the slot group (row) height when containing events up to the number of displayed events and reduces its height if there are fewer events for that slot group (row)
58
61
  * ([see example](slug:multiweek_views_scheduler#enabling-the-adaptive-slot-height-of-the-scheduler)).
59
62
  * @default false
60
63
  */
61
64
  adaptiveSlotHeight;
62
65
  /**
63
- * The number of weeks to be rendered.
66
+ * Sets the number of weeks to render in the view.
64
67
  * @default 6
65
68
  */
66
69
  numberOfWeeks = WEEKS_COUNT;
67
70
  /**
68
- * The long-date format for displaying the
69
- * selected date in the Scheduler toolbar.
70
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting)).
71
+ * Sets the long-date format for the selected date in the Scheduler toolbar.
72
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
71
73
  * @default '{0:D} - {1:D}'
72
74
  */
73
75
  selectedDateFormat = '{0:D} - {1:D}';
74
76
  /**
75
- * The short-date format for displaying the
76
- * selected date in the Scheduler toolbar.
77
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting)).
77
+ * Sets the short-date format for the selected date in the Scheduler toolbar.
78
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
78
79
  * @default '{0:d} - {1:d}'
79
80
  */
80
81
  selectedShortDateFormat = '{0:d} - {1:d}';
81
82
  multiWeekDaySlotTemplate;
82
83
  /**
83
- * The invariant name for this view (`multiWeek`).
84
+ * The invariant name for this view.
85
+ * @default 'multiWeek'
84
86
  */
85
87
  name = 'multiWeek';
86
88
  get viewEventHeight() {
@@ -18,7 +18,14 @@ import * as i1 from "@progress/kendo-angular-l10n";
18
18
  import * as i2 from "../view-context.service";
19
19
  import * as i3 from "../view-state.service";
20
20
  /**
21
- * The component for rendering the **Day** view.
21
+ * Represents the component that renders the **Day** view in the Scheduler.
22
+ *
23
+ * @example
24
+ * ```html
25
+ * <kendo-scheduler>
26
+ * <kendo-scheduler-day-view></kendo-scheduler-day-view>
27
+ * </kendo-scheduler>
28
+ * ```
22
29
  */
23
30
  export class DayViewComponent extends MultiDayViewBase {
24
31
  /**
@@ -28,9 +35,8 @@ export class DayViewComponent extends MultiDayViewBase {
28
35
  return this.localization.get('dayViewTitle');
29
36
  }
30
37
  /**
31
- * The long-date format for displaying the
32
- * selected date in the Scheduler toolbar.
33
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting)).
38
+ * Sets the long-date format for the selected date in the Scheduler toolbar.
39
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
34
40
  * @default '{0:D}'
35
41
  */
36
42
  set selectedDateFormat(value) {
@@ -40,9 +46,8 @@ export class DayViewComponent extends MultiDayViewBase {
40
46
  return this._selectedDateFormat;
41
47
  }
42
48
  /**
43
- * The short-date format for displaying the
44
- * selected date in the Scheduler toolbar.
45
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting)).
49
+ * Sets the short-date format for the selected date in the Scheduler toolbar.
50
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
46
51
  * @default '{0:d}'
47
52
  */
48
53
  set selectedShortDateFormat(value) {
@@ -17,14 +17,20 @@ import * as i1 from "@progress/kendo-angular-l10n";
17
17
  import * as i2 from "../view-context.service";
18
18
  import * as i3 from "../view-state.service";
19
19
  /**
20
- * The component for rendering the **Multi-Day** view.
20
+ * Represents the component that renders the **Multi-Day** view in the Scheduler.
21
+ *
22
+ * @example
23
+ * ```html
24
+ * <kendo-scheduler>
25
+ * <kendo-scheduler-multi-day-view></kendo-scheduler-multi-day-view>
26
+ * </kendo-scheduler>
27
+ * ```
21
28
  */
22
29
  export class MultiDayViewComponent extends DayViewComponent {
23
30
  /**
24
- * The long-date format for displaying the
25
- * selected date in the Scheduler toolbar.
26
- * Defaults to `{0:D} - {1:D}` for multiple days and `{0:D}` for a single day
27
- * ([more information](slug:parsingandformatting_intl#toc-date-formatting)).
31
+ * Sets the long-date format for the selected date in the Scheduler toolbar.
32
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
33
+ * The default value is `'{0:D} - {1:D}'` for multiple days and `'{0:D}'` for a single day.
28
34
  * @default '{0:D} - {1:D}'
29
35
  */
30
36
  set selectedDateFormat(value) {
@@ -34,10 +40,9 @@ export class MultiDayViewComponent extends DayViewComponent {
34
40
  return this.dateFormat || this.defaultDateFormat;
35
41
  }
36
42
  /**
37
- * The short date format for displaying the
38
- * selected date in the Scheduler toolbar.
39
- * Defaults to `{0:d} - {1:d}` for multiple days and `{0:d}` for a single day
40
- * ([more information](slug:parsingandformatting_intl#toc-date-formatting)).
43
+ * Sets the short-date format for the selected date in the Scheduler toolbar.
44
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
45
+ * The default value is `'{0:d} - {1:d}'` for multiple days and `'{0:d}'` for a single day.
41
46
  * @default '{0:d} - {1:d}'
42
47
  */
43
48
  set selectedShortDateFormat(value) {
@@ -47,7 +52,7 @@ export class MultiDayViewComponent extends DayViewComponent {
47
52
  return this.shortDateFormat || this.defaultShortDateFormat;
48
53
  }
49
54
  /**
50
- * Specifies the number of days that the view will render.
55
+ * Sets the number of days to render in the view.
51
56
  * @default 1
52
57
  */
53
58
  numberOfDays = 1;
@@ -59,7 +64,7 @@ export class MultiDayViewComponent extends DayViewComponent {
59
64
  }
60
65
  /**
61
66
  * The invariant name for this view.
62
- * @default 'multi-day'
67
+ * @default 'multiDay'
63
68
  */
64
69
  name = 'multiDay';
65
70
  get defaultDateFormat() {
@@ -21,7 +21,14 @@ import * as i2 from "@progress/kendo-angular-l10n";
21
21
  import * as i3 from "../view-context.service";
22
22
  import * as i4 from "../view-state.service";
23
23
  /**
24
- * The component for rendering the **Week** view.
24
+ * Represents the component that renders the **Week** view in the Scheduler.
25
+ *
26
+ * @example
27
+ * ```html
28
+ * <kendo-scheduler>
29
+ * <kendo-scheduler-week-view></kendo-scheduler-week-view>
30
+ * </kendo-scheduler>
31
+ * ```
25
32
  */
26
33
  export class WeekViewComponent extends MultiDayViewBase {
27
34
  intl;
@@ -32,20 +39,16 @@ export class WeekViewComponent extends MultiDayViewBase {
32
39
  return this.localization.get('weekViewTitle');
33
40
  }
34
41
  /**
35
- * The long-date format for displaying the
36
- * selected date in the Scheduler toolbar.
37
- * Defaults to `{0:D} - {1:D}`,
38
- * where `0` is the start and `1` is the end date
39
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting).
42
+ * Sets the long-date format for the selected date in the Scheduler toolbar.
43
+ * Defaults to `'{0:D} - {1:D}'`, where `0` is the start and `1` is the end date.
44
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
40
45
  * @default '{0:D} - {1:D}'
41
46
  */
42
47
  selectedDateFormat = '{0:D} - {1:D}';
43
48
  /**
44
- * The short date format for displaying the
45
- * selected date in the Scheduler toolbar.
46
- * Defaults to `{0:d} - {1:d}`,
47
- * where `0` is the start and `1` is the end date
48
- * ([more information]({% slug parsingandformatting_intl %}#toc-date-formatting).
49
+ * Sets the short-date format for the selected date in the Scheduler toolbar.
50
+ * Defaults to `'{0:d} - {1:d}'`, where `0` is the start and `1` is the end date.
51
+ * For more information, see [Parsing and Formatting Dates and Numbers](slug:parsingandformatting_intl#date-formatting).
49
52
  * @default '{0:d} - {1:d}'
50
53
  */
51
54
  selectedShortDateFormat = '{0:d} - {1:d}';
@@ -21,7 +21,14 @@ import * as i3 from "../view-context.service";
21
21
  import * as i4 from "../view-state.service";
22
22
  const DAYS_IN_WEEK = 7;
23
23
  /**
24
- * The component for rendering the **Work Week** view.
24
+ * Represents the component that renders the **Work Week** view in the Scheduler.
25
+ *
26
+ * @example
27
+ * ```html
28
+ * <kendo-scheduler>
29
+ * <kendo-scheduler-work-week-view></kendo-scheduler-work-week-view>
30
+ * </kendo-scheduler>
31
+ * ```
25
32
  */
26
33
  export class WorkWeekViewComponent extends WeekViewComponent {
27
34
  /**
@@ -8,16 +8,26 @@ import * as i0 from "@angular/core";
8
8
  // eslint-disable no-input-rename
9
9
  /**
10
10
  * A directive selector for a custom Scheduler view.
11
+ *
12
+ * @example
13
+ * ```html
14
+ * <kendo-scheduler [kendoSchedulerBinding]="events">
15
+ * <kendo-scheduler-day-view></kendo-scheduler-day-view>
16
+ * <kendo-scheduler-week-view></kendo-scheduler-week-view>
17
+ * <ng-template kendoSchedulerView="My Scheduler View">
18
+ * <app-custom-view></app-custom-view>
19
+ * </ng-template>
20
+ * </kendo-scheduler>
21
+ * ```
11
22
  */
12
23
  export class SchedulerViewDirective extends SchedulerView {
13
24
  template;
14
25
  /**
15
- * The user-friendly name of this view.
26
+ * Sets the user-friendly name for this view.
16
27
  */
17
28
  title;
18
29
  /**
19
- * The invariant name for this view. For example, `day`.
20
- * If not set, the name will be the same as the title.
30
+ * Sets the invariant name for this view. If not set, uses the defined user-friendly name.
21
31
  */
22
32
  get name() {
23
33
  return this._name || this.title;
@@ -5,12 +5,22 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template which renders the date header in the **Agenda** view.
9
- * To define the date template, nest an `<ng-template>` tag with the `kendoSchedulerAgendaDateTemplate`
10
- * directive inside the `<kendo-scheduler-agenda-view>` or `<kendo-scheduler>` components ([see example](slug:templates_scheduler#toc-agenda-dates)).
8
+ * Use this directive to customize the date header in the **Agenda** view of the Scheduler.
9
+ *
10
+ * To define a date template, nest an `<ng-template>` tag with the `kendoSchedulerAgendaDateTemplate` directive inside the
11
+ * `<kendo-scheduler-agenda-view>` or `<kendo-scheduler>` component ([see example](slug:templates_scheduler#toc-agenda-dates).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `date`&mdash;The header date.
15
+ *
16
+ * @example
17
+ * ```html
18
+ * <kendo-scheduler-agenda-view>
19
+ * <ng-template kendoSchedulerAgendaDateTemplate let-date="date">
20
+ * <!-- custom date header -->
21
+ * </ng-template>
22
+ * </kendo-scheduler-agenda-view>
23
+ * ```
14
24
  */
15
25
  export class AgendaDateTemplateDirective {
16
26
  templateRef;
@@ -5,9 +5,10 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template which renders the time header in the **Agenda** view.
9
- * To define the time template, nest an `<ng-template>` tag with the `kendoSchedulerAgendaTimeTemplate`
10
- * directive inside the `<kendo-scheduler>` or in the `<kendo-scheduler-agenda-view>` component ([see example](slug:templates_scheduler#toc-agenda-times)).
8
+ * Use this directive to customize the time header in the **Agenda** view of the Scheduler.
9
+ *
10
+ * To define a time template, nest an `<ng-template>` tag with the `kendoSchedulerAgendaTimeTemplate` directive inside the
11
+ * `<kendo-scheduler>` or `<kendo-scheduler-agenda-view>` component ([see example](slug:templates_scheduler#toc-agenda-times)).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `start`&mdash;The start date of the event.
@@ -16,6 +17,15 @@ import * as i0 from "@angular/core";
16
17
  * - `description`&mdash;The description of the event.
17
18
  * - `isAllDay`&mdash;A Boolean value which indicates if the event is all-day.
18
19
  * - `resources`&mdash;The resources of the event.
20
+ *
21
+ * @example
22
+ * ```html
23
+ * <kendo-scheduler-agenda-view>
24
+ * <ng-template kendoSchedulerAgendaTimeTemplate let-start="start" let-end="end" let-title="title" let-description="description" let-isAllDay="isAllDay" let-resources="resources">
25
+ * <!-- custom time header -->
26
+ * </ng-template>
27
+ * </kendo-scheduler-agenda-view>
28
+ * ```
19
29
  */
20
30
  export class AgendaTimeTemplateDirective {
21
31
  templateRef;
@@ -5,13 +5,23 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template for and assists the content customization of all-day events.
9
- * To define the all-day event template, nest an `<ng-template>` tag with the `kendoSchedulerAllDayEventTemplate`
10
- * directive inside the `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, or `<kendo-scheduler-week-view>` component ([see example](slug:templates_scheduler#toc-all-day-events)).
8
+ * Use this directive to customize the content of all-day events in the Scheduler.
9
+ *
10
+ * To define an all-day event template, nest an `<ng-template>` tag with the `kendoSchedulerAllDayEventTemplate` directive inside the
11
+ * `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, or `<kendo-scheduler-week-view>` component ([see example](slug:templates_scheduler#toc-all-day-events)).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `event`&mdash;The event that is associated with the item.
14
15
  * - `resources`&mdash;The resources of the event.
16
+ *
17
+ * @example
18
+ * ```html
19
+ * <kendo-scheduler-day-view>
20
+ * <ng-template kendoSchedulerAllDayEventTemplate let-event="event" let-resources="resources">
21
+ * <!-- custom all-day event -->
22
+ * </ng-template>
23
+ * </kendo-scheduler-day-view>
24
+ * ```
15
25
  */
16
26
  export class AllDayEventTemplateDirective {
17
27
  templateRef;
@@ -5,13 +5,23 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template for and assists the content customization of all-day slots.
9
- * To define the all-day slot template, nest an `<ng-template>` tag with the `kendoSchedulerAllDaySlotTemplate`
10
- * directive inside the `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, or `<kendo-scheduler-week-view>` component ([see example](slug:templates_scheduler#toc-all-day-slots)).
8
+ * Use this directive to customize the content of all-day slots in the Scheduler.
9
+ *
10
+ * To define an all-dat slot template, nest an `<ng-template>` tag with the `kendoSchedulerAllDaySlotTemplate` directive inside the
11
+ * `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, or `<kendo-scheduler-week-view>` components ([see example](slug:templates_scheduler#toc-all-day-slots)).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `date`&mdash;The date of the slot.
14
15
  * - `resources`&mdash;The resources of the slot.
16
+ *
17
+ * @example
18
+ * ```html
19
+ * <kendo-scheduler-week-view>
20
+ * <ng-template kendoSchedulerAllDaySlotTemplate let-date="date" let-resources="resources">
21
+ * <!-- custom all-day slot -->
22
+ * </ng-template>
23
+ * </kendo-scheduler-week-view>
24
+ * ```
15
25
  */
16
26
  export class AllDaySlotTemplateDirective {
17
27
  templateRef;
@@ -5,13 +5,23 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template which renders the date header in the **Day**, **Week**, and **Timeline** views.
9
- * To define the day template, nest an `<ng-template>` tag with the `kendoSchedulerDateHeaderTemplate`
10
- * directive inside the `<kendo-scheduler>`, or in the `<kendo-scheduler-day-view>`, `<kendo-scheduler-week-view>`,
11
- * `<kendo-scheduler-timeline-view>`, `<kendo-scheduler-timeline-week-view>`, and `<kendo-scheduler-timeline-month-view>` components ([see example](slug:templates_scheduler#toc-date-headers)).
8
+ * Use this directive to customize the date header in **Day**, **Week**, and **Timeline** views of the Scheduler.
9
+ *
10
+ * To define a date header template, nest an `<ng-template>` tag with the `kendoSchedulerDateHeaderTemplate` directive inside the
11
+ * `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, `<kendo-scheduler-week-view>`,
12
+ * `<kendo-scheduler-timeline-view>`, `<kendo-scheduler-timeline-week-view>`, or `<kendo-scheduler-timeline-month-view>` component ([see example](slug:templates_scheduler#toc-date-headers)).
12
13
  *
13
14
  * The available fields in the template context are:
14
15
  * - `date`&mdash;The header date.
16
+ *
17
+ * @example
18
+ * ```html
19
+ * <kendo-scheduler-week-view>
20
+ * <ng-template kendoSchedulerDateHeaderTemplate let-date="date">
21
+ * <!-- custom date header -->
22
+ * </ng-template>
23
+ * </kendo-scheduler-week-view>
24
+ * ```
15
25
  */
16
26
  export class DateHeaderTemplateDirective {
17
27
  templateRef;
@@ -5,13 +5,23 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template for and assists the content customization of the Scheduler events.
9
- * To define the event template, nest an `<ng-template>` tag with the `kendoSchedulerEventTemplate`
10
- * directive inside the `<kendo-scheduler>`, or in the view components ([see example](slug:templates_scheduler#toc-event-rendering)).
8
+ * Use this directive to customize the rendering of Scheduler events.
9
+ *
10
+ * To define an event template, nest an `<ng-template>` tag with the `kendoSchedulerEventTemplate` directive inside the
11
+ * `<kendo-scheduler>` or any view component ([see example](slug:templates_scheduler#toc-event-rendering)).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `event`&mdash;The event that is associated with the item.
14
15
  * - `resources`&mdash;The resources of the event.
16
+ *
17
+ * @example
18
+ * ```html
19
+ * <kendo-scheduler>
20
+ * <ng-template kendoSchedulerEventTemplate let-event="event" let-resources="resources">
21
+ * <!-- custom event rendering -->
22
+ * </ng-template>
23
+ * </kendo-scheduler>
24
+ * ```
15
25
  */
16
26
  export class EventTemplateDirective {
17
27
  templateRef;
@@ -5,13 +5,23 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template which renders the resource group header in the **Day**, **Week**, and **Timeline** views.
9
- * To define the template, nest an `<ng-template>` tag with the `kendoSchedulerGroupHeaderTemplate`
10
- * directive inside the `<kendo-scheduler>`, or in the `<kendo-scheduler-day-view>`, `<kendo-scheduler-week-view>`,
11
- * `<kendo-scheduler-timeline-view>`, `<kendo-scheduler-timeline-week-view>`, and `<kendo-scheduler-timeline-month-view>` components ([see example](slug:templates_scheduler#toc-group-headers)).
8
+ * Use this directive to customize the resource group header in **Day**, **Week**, and **Timeline** views of the Scheduler.
9
+ *
10
+ * To defina a group header template, nest an `<ng-template>` tag with the `kendoSchedulerGroupHeaderTemplate` directive inside the
11
+ * `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, `<kendo-scheduler-week-view>`,
12
+ * `<kendo-scheduler-timeline-view>`, `<kendo-scheduler-timeline-week-view>`, or `<kendo-scheduler-timeline-month-view>` component ([see example](slug:templates_scheduler#toc-group-headers)).
12
13
  *
13
14
  * The available fields in the template context are:
14
15
  * - `resource`&mdash;The resource item.
16
+ *
17
+ * @example
18
+ * ```html
19
+ * <kendo-scheduler-timeline-view>
20
+ * <ng-template kendoSchedulerGroupHeaderTemplate let-resource="resource">
21
+ * <!-- custom group header -->
22
+ * </ng-template>
23
+ * </kendo-scheduler-timeline-view>
24
+ * ```
15
25
  */
16
26
  export class GroupHeaderTemplateDirective {
17
27
  templateRef;
@@ -5,12 +5,22 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template for the major-time headers in the **Day** and **Week** views.
9
- * To define the major-time header template, nest an `<ng-template>` tag with the `kendoSchedulerMajorTimeHeaderTemplate`
10
- * directive inside the `<kendo-scheduler>`, or in the `<kendo-scheduler-day-view>` and `<kendo-scheduler-week-view>` components ([see example](slug:templates_scheduler#toc-major-time-headers)).
8
+ * Use this directive to customize the major-time headers in **Day** and **Week** views of the Scheduler.
9
+ *
10
+ * To define a major-time header template, nest an `<ng-template>` tag with the `kendoSchedulerMajorTimeHeaderTemplate` directive inside the
11
+ * `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, or `<kendo-scheduler-week-view>` component ([see example](slug:templates_scheduler#toc-major-time-headers)).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `date`&mdash;The date of the header.
15
+ *
16
+ * @example
17
+ * ```html
18
+ * <kendo-scheduler-day-view>
19
+ * <ng-template kendoSchedulerMajorTimeHeaderTemplate let-date="date">
20
+ * <!-- custom major time header -->
21
+ * </ng-template>
22
+ * </kendo-scheduler-day-view>
23
+ * ```
14
24
  */
15
25
  export class MajorTimeHeaderTemplateDirective {
16
26
  templateRef;
@@ -5,12 +5,22 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * Represents the template for the minor-time headers in the **Day** and **Week** views.
9
- * To define the minor-time header template, nest an `<ng-template>` tag with the `kendoSchedulerMinorTimeHeaderTemplate`
10
- * directive inside the `<kendo-scheduler>`, or in the `<kendo-scheduler-day-view>` and `<kendo-scheduler-week-view>` components ([see example](slug:templates_scheduler#toc-minor-time-headers)).
8
+ * Use this directive to customize the minor-time headers in the **Day** and **Week** views of the Scheduler.
9
+ *
10
+ * To define a minor-time header template, nest an `<ng-template>` tag with the `kendoSchedulerMinorTimeHeaderTemplate` directive inside the
11
+ * `<kendo-scheduler>`, `<kendo-scheduler-day-view>`, or `<kendo-scheduler-week-view>` component ([see example](slug:templates_scheduler#toc-minor-time-headers)).
11
12
  *
12
13
  * The available fields in the template context are:
13
14
  * - `date`&mdash;The date of the header.
15
+ *
16
+ * @example
17
+ * ```html
18
+ * <kendo-scheduler-week-view>
19
+ * <ng-template kendoSchedulerMinorTimeHeaderTemplate let-date="date">
20
+ * <!-- custom minor time header -->
21
+ * </ng-template>
22
+ * </kendo-scheduler-week-view>
23
+ * ```
14
24
  */
15
25
  export class MinorTimeHeaderTemplateDirective {
16
26
  templateRef;