@progress/kendo-angular-scheduler 16.0.0-develop.8 → 16.0.0

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 (120) hide show
  1. package/esm2020/data-binding.directive.mjs +3 -3
  2. package/esm2020/editing/date-time-picker.component.mjs +8 -4
  3. package/esm2020/editing/dialogs.service.mjs +3 -3
  4. package/esm2020/editing/edit-dialog-template.directive.mjs +3 -3
  5. package/esm2020/editing/edit-dialog.component.mjs +3 -3
  6. package/esm2020/editing/edit.service.mjs +3 -3
  7. package/esm2020/editing/local-data-changes.service.mjs +3 -3
  8. package/esm2020/editing/recurrence/end-rule-radio-button.directive.mjs +3 -3
  9. package/esm2020/editing/recurrence/localization/custom-messages.component.mjs +3 -3
  10. package/esm2020/editing/recurrence/localization/localized-messages.directive.mjs +3 -3
  11. package/esm2020/editing/recurrence/localization/messages.mjs +3 -3
  12. package/esm2020/editing/recurrence/localization/recurrence-localization.service.mjs +3 -3
  13. package/esm2020/editing/recurrence/recurrence-editor.component.mjs +3 -3
  14. package/esm2020/editing/recurrence/recurrence-end-rule-editor.component.mjs +6 -4
  15. package/esm2020/editing/recurrence/recurrence-frequency-editor.component.mjs +3 -3
  16. package/esm2020/editing/recurrence/recurrence-interval-editor.component.mjs +3 -3
  17. package/esm2020/editing/recurrence/recurrence-monthly-yearly-editor.component.mjs +3 -3
  18. package/esm2020/editing/recurrence/recurrence-weekday-rule-editor.component.mjs +3 -3
  19. package/esm2020/editing/recurrence/recurrence.service.mjs +3 -3
  20. package/esm2020/editing/recurrence/repeat-on-radio-button.directive.mjs +3 -3
  21. package/esm2020/editing/resource-editor-base.mjs +3 -3
  22. package/esm2020/editing/resource-multiple-editor.component.mjs +3 -3
  23. package/esm2020/editing/resource-single-editor.component.mjs +3 -3
  24. package/esm2020/editing/timezone-editor.component.mjs +3 -3
  25. package/esm2020/editing-directives/editing-directive-base.mjs +5 -4
  26. package/esm2020/editing-directives/reactive-editing.directive.mjs +7 -7
  27. package/esm2020/loading.component.mjs +3 -3
  28. package/esm2020/localization/custom-messages.component.mjs +3 -3
  29. package/esm2020/localization/localized-messages.directive.mjs +3 -3
  30. package/esm2020/localization/messages.mjs +3 -3
  31. package/esm2020/localization/scheduler-localization.service.mjs +3 -3
  32. package/esm2020/navigation/focus.service.mjs +3 -3
  33. package/esm2020/navigation/focusable.directive.mjs +3 -3
  34. package/esm2020/navigation/shortcuts.directive.mjs +3 -3
  35. package/esm2020/package-metadata.mjs +2 -2
  36. package/esm2020/pdf/pdf-command.directive.mjs +3 -3
  37. package/esm2020/pdf/pdf.component.mjs +4 -4
  38. package/esm2020/pdf/pdf.module.mjs +4 -4
  39. package/esm2020/pdf/pdf.service.mjs +3 -3
  40. package/esm2020/scheduler.component.mjs +3 -12
  41. package/esm2020/scheduler.module.mjs +4 -4
  42. package/esm2020/shared.module.mjs +4 -4
  43. package/esm2020/toolbar/navigation.component.mjs +4 -4
  44. package/esm2020/toolbar/toolbar-template.directive.mjs +3 -3
  45. package/esm2020/toolbar/toolbar.component.mjs +3 -3
  46. package/esm2020/toolbar/toolbar.module.mjs +4 -4
  47. package/esm2020/toolbar/toolbar.service.mjs +3 -3
  48. package/esm2020/toolbar/view-selector.component.mjs +3 -3
  49. package/esm2020/views/agenda/agenda-header-item.component.mjs +15 -3
  50. package/esm2020/views/agenda/agenda-header.component.mjs +13 -16
  51. package/esm2020/views/agenda/agenda-task-item.component.mjs +7 -3
  52. package/esm2020/views/agenda/agenda-view-internal.component.mjs +9 -9
  53. package/esm2020/views/agenda/agenda-view-list.component.mjs +10 -8
  54. package/esm2020/views/agenda/agenda-view.component.mjs +3 -3
  55. package/esm2020/views/agenda/agenda-view.module.mjs +4 -4
  56. package/esm2020/views/common/base-view.mjs +3 -3
  57. package/esm2020/views/common/configuration-view-base.mjs +3 -3
  58. package/esm2020/views/common/dom-events.service.mjs +3 -3
  59. package/esm2020/views/common/hint-container.component.mjs +3 -3
  60. package/esm2020/views/common/repeat.pipe.mjs +3 -3
  61. package/esm2020/views/common/resize-hint.component.mjs +3 -3
  62. package/esm2020/views/common/resource-iterator.pipe.mjs +3 -3
  63. package/esm2020/views/common/slot-selectable.directive.mjs +3 -3
  64. package/esm2020/views/common/view-footer.component.mjs +3 -3
  65. package/esm2020/views/common/views-shared.module.mjs +4 -4
  66. package/esm2020/views/common/work-hours-footer.directive.mjs +3 -3
  67. package/esm2020/views/day-time/day-time-view-base.mjs +3 -3
  68. package/esm2020/views/day-time/day-time-view-item.component.mjs +3 -3
  69. package/esm2020/views/day-time/day-time-view.component.mjs +3 -3
  70. package/esm2020/views/day-time/day-time.module.mjs +4 -4
  71. package/esm2020/views/day-time/event-slot.directive.mjs +6 -6
  72. package/esm2020/views/month/month-slot.component.mjs +3 -3
  73. package/esm2020/views/month/month-view-item.component.mjs +3 -3
  74. package/esm2020/views/month/month-view-renderer.component.mjs +297 -247
  75. package/esm2020/views/month/month-view.component.mjs +3 -3
  76. package/esm2020/views/month/month-view.module.mjs +4 -4
  77. package/esm2020/views/month/multi-week-view.component.mjs +3 -3
  78. package/esm2020/views/multi-day/day-view.component.mjs +3 -3
  79. package/esm2020/views/multi-day/multi-day-view-base.mjs +3 -3
  80. package/esm2020/views/multi-day/multi-day-view-renderer.component.mjs +505 -461
  81. package/esm2020/views/multi-day/multi-day-view.component.mjs +3 -3
  82. package/esm2020/views/multi-day/multi-day-view.module.mjs +4 -4
  83. package/esm2020/views/multi-day/week-view.component.mjs +3 -3
  84. package/esm2020/views/multi-day/work-week-view.component.mjs +3 -3
  85. package/esm2020/views/scheduler-view.directive.mjs +3 -3
  86. package/esm2020/views/templates/agenda-date-template.directive.mjs +3 -3
  87. package/esm2020/views/templates/agenda-time-template.directive.mjs +3 -3
  88. package/esm2020/views/templates/all-day-event-template.directive.mjs +3 -3
  89. package/esm2020/views/templates/all-day-slot-template.directive.mjs +3 -3
  90. package/esm2020/views/templates/date-header-template.directive.mjs +3 -3
  91. package/esm2020/views/templates/event-template.directive.mjs +3 -3
  92. package/esm2020/views/templates/group-header-template.directive.mjs +3 -3
  93. package/esm2020/views/templates/major-time-header-template.directive.mjs +3 -3
  94. package/esm2020/views/templates/minor-time-header-template.directive.mjs +3 -3
  95. package/esm2020/views/templates/month-day-slot-template.directive.mjs +3 -3
  96. package/esm2020/views/templates/multi-week-day-slot-template.directive.mjs +3 -3
  97. package/esm2020/views/templates/time-slot-template.directive.mjs +3 -3
  98. package/esm2020/views/timeline/timeline-base.mjs +3 -3
  99. package/esm2020/views/timeline/timeline-month-view.component.mjs +3 -3
  100. package/esm2020/views/timeline/timeline-multi-day-view.component.mjs +381 -330
  101. package/esm2020/views/timeline/timeline-view.component.mjs +3 -3
  102. package/esm2020/views/timeline/timeline-view.module.mjs +4 -4
  103. package/esm2020/views/timeline/timeline-week-view.component.mjs +3 -3
  104. package/esm2020/views/timeline/utils.mjs +3 -3
  105. package/esm2020/views/view-context.service.mjs +3 -3
  106. package/esm2020/views/view-items/base-slot.directive.mjs +3 -3
  107. package/esm2020/views/view-items/base-view-item.mjs +3 -3
  108. package/esm2020/views/view-state.service.mjs +3 -3
  109. package/esm2020/views/year/year-view-internal.component.mjs +4 -4
  110. package/esm2020/views/year/year-view.component.mjs +3 -3
  111. package/esm2020/views/year/year-view.module.mjs +4 -4
  112. package/events/edit-event-base.d.ts +4 -0
  113. package/fesm2015/progress-kendo-angular-scheduler.mjs +1572 -1413
  114. package/fesm2020/progress-kendo-angular-scheduler.mjs +1572 -1413
  115. package/package.json +13 -13
  116. package/schematics/ngAdd/index.js +3 -3
  117. package/views/agenda/agenda-header-item.component.d.ts +3 -1
  118. package/views/agenda/agenda-task-item.component.d.ts +1 -0
  119. package/views/month/month-view-renderer.component.d.ts +2 -0
  120. package/views/timeline/timeline-multi-day-view.component.d.ts +4 -0
package/esm2020/views/multi-day/multi-day-view-renderer.component.mjs CHANGED
@@ -241,77 +241,230 @@ export class MultiDayViewRendererComponent extends DayTimeViewComponent {
241
241
  return index + 1 < this.timeSlots.length && !this.timeSlots[index + 1].isMajor;
242
242
  }
243
243
  }
244
- MultiDayViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: MultiDayViewRendererComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ViewContextService }, { token: i3.ViewStateService }, { token: i4.IntlService }, { token: i5.DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i6.PDFService }, { token: i7.ScrollbarWidthService }], target: i0.ɵɵFactoryTarget.Component });
245
- MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: MultiDayViewRendererComponent, selector: "multi-day-view", inputs: { allDaySlot: "allDaySlot", name: "name", slotFill: "slotFill", allDaySlotTemplate: "allDaySlotTemplate", allDayEventTemplate: "allDayEventTemplate" }, providers: [
244
+ MultiDayViewRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MultiDayViewRendererComponent, deps: [{ token: i1.LocalizationService }, { token: i2.ViewContextService }, { token: i3.ViewStateService }, { token: i4.IntlService }, { token: i5.DayTimeSlotService }, { token: i0.NgZone }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i6.PDFService }, { token: i7.ScrollbarWidthService }], target: i0.ɵɵFactoryTarget.Component });
245
+ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: MultiDayViewRendererComponent, selector: "multi-day-view", inputs: { allDaySlot: "allDaySlot", name: "name", slotFill: "slotFill", allDaySlotTemplate: "allDaySlotTemplate", allDayEventTemplate: "allDayEventTemplate" }, providers: [
246
246
  DayTimeSlotService
247
247
  ], viewQueries: [{ propertyName: "headerHintContainer", first: true, predicate: ["headerHintContainer"], descendants: true }, { propertyName: "dayCells", predicate: ["allDayCell"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
248
- <div class="k-scheduler-layout k-scheduler-flex-layout" role="presentation" [ngClass]="classNames">
249
- <div class="k-scheduler-pane">
250
- <div class="k-scheduler-times" #timesHeader>
251
- <table class="k-scheduler-table" aria-hidden="true">
252
- <tr *ngFor="let resource of horizontalResources; trackBy: itemIndex;">
253
- <th></th>
254
- </tr>
255
- <tr>
256
- <th [style.height]="'auto'"></th>
257
- </tr>
258
- <tr *ngIf="allDaySlot && !verticalResources.length">
259
- <th class="k-scheduler-times-all-day" #allDayCell>{{ allDayMessage }}</th>
260
- </tr>
261
- </table>
262
- </div>
263
- <div class="k-scheduler-header k-state-default" #header>
264
- <div class="k-scheduler-header-wrap" #headerWrap>
265
- <table class="k-scheduler-table" aria-hidden="true">
266
- <tr *ngFor="let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;">
267
- <th *ngFor="let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;"
268
- class="k-slot-cell" [attr.colspan]="horizontalColspan(resourceIndex)">
269
- <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(item, resource.textField) }}</ng-container>
270
- <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef" [ngTemplateOutletContext]="{ resource: item }"></ng-container>
271
- </th>
272
- </tr>
273
- <tr>
274
- <ng-container *ngFor="let resource of horizontalResources | resourceIterator; trackBy: itemIndex;">
275
- <th *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex">
276
- <span *ngIf="!dateHeaderTemplateRef" class="k-link k-nav-day" [attr.data-dayslot-index]="index">{{ slot.start | kendoDate: dateFormat }}</span>
277
- <ng-container *ngIf="dateHeaderTemplateRef" [ngTemplateOutlet]="dateHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
278
- </th>
279
- </ng-container>
280
- </tr>
281
- </table>
282
- <div [style.position]="'relative'" *ngIf="allDaySlot && !verticalResources.length">
283
- <table class="k-scheduler-table k-scheduler-header-all-day k-user-select-none" aria-hidden="true">
284
- <tr>
285
- <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;">
286
- <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
287
- daySlot
288
- [start]="slot.start"
289
- [end]="slot.end"
290
- [id]="{ resourceIndex: resourceIndex, rangeIndex: 0, index: index }"
291
- [class.k-selected]="isSlotSelected({
292
- start: toPlainDate(slot.start),
293
- end: toPlainDate(slot.end),
294
- isAllDay: true,
295
- resources: resourcesByIndex(resourceIndex)
296
- })"
297
- [ngClass]="allDaySlotClass(slot, resourceIndex)">
298
- <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
299
- [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(resourceIndex) }"></ng-container>
300
- </td>
248
+ <table class="k-scheduler-layout" role="presentation" [ngClass]="classNames">
249
+ <tbody>
250
+ <tr class="k-scheduler-head">
251
+ <td>
252
+ <div class="k-scheduler-times" #timesHeader>
253
+ <table class="k-scheduler-table" aria-hidden="true">
254
+ <tbody>
255
+ <tr *ngFor="let resource of horizontalResources; trackBy: itemIndex;">
256
+ <th class="k-scheduler-cell k-heading-cell"></th>
257
+ </tr>
258
+ <tr [style.height]="'auto'">
259
+ <th class="k-scheduler-cell k-heading-cell"></th>
260
+ </tr>
261
+ <tr *ngIf="allDaySlot && !verticalResources.length">
262
+ <th class="k-scheduler-times-all-day k-scheduler-cell k-heading-cell" #allDayCell>{{ allDayMessage }}</th>
263
+ </tr>
264
+ </tbody>
265
+ </table>
266
+ </div>
267
+ </td>
268
+ <td>
269
+ <div class="k-scheduler-header" #header>
270
+ <div class="k-scheduler-header-wrap" #headerWrap>
271
+ <table class="k-scheduler-table" aria-hidden="true">
272
+ <tbody>
273
+ <tr *ngFor="let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;">
274
+ <th *ngFor="let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;"
275
+ class="k-scheduler-cell k-heading-cell" [attr.colspan]="horizontalColspan(resourceIndex)">
276
+ <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(item, resource.textField) }}</ng-container>
277
+ <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef" [ngTemplateOutletContext]="{ resource: item }"></ng-container>
278
+ </th>
279
+ </tr>
280
+ <tr class="k-scheduler-date-group">
281
+ <ng-container *ngFor="let resource of horizontalResources | resourceIterator; trackBy: itemIndex;">
282
+ <th *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex" class="k-scheduler-cell k-heading-cell">
283
+ <span *ngIf="!dateHeaderTemplateRef" class="k-link k-nav-day" [attr.data-dayslot-index]="index">{{ slot.start | kendoDate: dateFormat }}</span>
284
+ <ng-container *ngIf="dateHeaderTemplateRef" [ngTemplateOutlet]="dateHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
285
+ </th>
286
+ </ng-container>
287
+ </tr>
288
+ </tbody>
289
+ </table>
290
+ <div [style.position]="'relative'" *ngIf="allDaySlot && !verticalResources.length">
291
+ <table class="k-scheduler-table k-scheduler-header-all-day" aria-hidden="true">
292
+ <tbody>
293
+ <tr>
294
+ <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;">
295
+ <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
296
+ daySlot
297
+ [start]="slot.start"
298
+ [end]="slot.end"
299
+ [id]="{ resourceIndex: resourceIndex, rangeIndex: 0, index: index }"
300
+ [class.k-selected]="isSlotSelected({
301
+ start: toPlainDate(slot.start),
302
+ end: toPlainDate(slot.end),
303
+ isAllDay: true,
304
+ resources: resourcesByIndex(resourceIndex)
305
+ })"
306
+ [ngClass]="allDaySlotClass(slot, resourceIndex)"
307
+ class="k-scheduler-cell">
308
+ <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
309
+ [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(resourceIndex) }"></ng-container>
310
+ </td>
311
+ </ng-container>
312
+ </tr>
313
+ </tbody>
314
+ </table>
315
+ <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
316
+ <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
317
+ [ngClass]="getEventClasses(item, itemResource.resources, true)"
318
+ [ngStyle]="getEventStyles(item, itemResource, true)"
319
+ role="button"
320
+ [kendoSchedulerFocusIndex]="itemResource.leafIdx"
321
+ [id]="item.elementId + '_' + itemResource.leafIdx"
322
+ dayTimeViewItem
323
+ [isAllDay]="true"
324
+ [editable]="editable"
325
+ [eventTemplate]="allDayEventTemplateRef"
326
+ [item]="item"
327
+ [index]="item.index"
328
+ [rangeIndex]="item.rangeIndex"
329
+ [resources]="itemResource.resources"
330
+ [resourceIndex]="itemResource.leafIdx">
331
+ </div>
301
332
  </ng-container>
302
- </tr>
333
+ <kendo-hint-container #headerHintContainer>
334
+ <ng-template>
335
+ <div *ngIf="dragHints.length && allDayDragHint"
336
+ class="k-event-drag-hint"
337
+ dayTimeViewItem
338
+ [isAllDay]="true"
339
+ [ngStyle]="dragHints[0].style"
340
+ [ngClass]="dragHints[0].class"
341
+ [dragHint]="true"
342
+ [eventTemplate]="eventTemplateRef"
343
+ [item]="dragHints[0].item"
344
+ [resources]="dragHints[0].resources">
345
+ </div>
346
+
347
+ <div *ngIf="resizeHints.length && allDayResizeHint"
348
+ kendoResizeHint
349
+ [hint]="resizeHints[0]"
350
+ [ngClass]="resizeHints[0].class"
351
+ [format]="allDayResizeHintFormat">
352
+ </div>
353
+ </ng-template>
354
+ </kendo-hint-container>
355
+ </div>
356
+ </div>
357
+ </div>
358
+ </td>
359
+ </tr>
360
+ <tr class="k-scheduler-body">
361
+ <td>
362
+ <div class="k-scheduler-times" #times>
363
+ <ng-container *ngIf="showCurrentTime">
364
+ <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
365
+ #currentTimeArrow class="k-current-time k-current-time-arrow-right">
366
+ </div>
367
+ </ng-container>
368
+ <table class="k-scheduler-table" #timesTable aria-hidden="true">
369
+ <tbody>
370
+ <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;">
371
+ <tr *ngIf="verticalResources.length">
372
+ <ng-container *ngFor="let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;">
373
+ <th *ngIf="verticalItem(leafIndex, resourceIndex)" [attr.rowspan]="verticalRowspan(resourceIndex)" class="k-scheduler-cell k-slot-cell k-heading-cell">
374
+ <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>
375
+ <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef"
376
+ [ngTemplateOutletContext]="{ resource: verticalItem(leafIndex, resourceIndex) }"></ng-container>
377
+ </th>
378
+ </ng-container>
379
+ <th *ngIf="allDaySlot" class="k-scheduler-times-all-day k-scheduler-cell k-heading-cell" #allDayCell>{{ allDayMessage }}</th>
380
+ </tr>
381
+ <tr *ngFor="let slot of timeSlots; let timeSlotIndex = index;trackBy: itemIndex">
382
+ <th *ngIf="slot.isMajor" [ngClass]="{ 'k-slot-cell': slotDivisions === 1 }" class="k-scheduler-cell k-heading-cell">
383
+ <ng-container *ngIf="!majorTimeHeaderTemplateRef">{{ slot.start | kendoDate: 't' }}</ng-container>
384
+ <ng-container *ngIf="majorTimeHeaderTemplateRef" [ngTemplateOutlet]="majorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
385
+ </th>
386
+ <th *ngIf="!slot.isMajor" [ngClass]="{ 'k-slot-cell': timeSlotIndex % slotDivisions === slotDivisions - 1 }" class="k-scheduler-cell k-heading-cell">
387
+ <ng-container *ngIf="minorTimeHeaderTemplateRef" [ngTemplateOutlet]="minorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }">
388
+ </ng-container>
389
+ </th>
390
+ </tr>
391
+ </ng-container>
392
+ </tbody>
393
+ </table>
394
+ </div>
395
+ </td>
396
+ <td>
397
+ <div
398
+ class="k-scheduler-content"
399
+ #content
400
+ role="group"
401
+ tabindex="0"
402
+ [attr.aria-owns]="matchOwned(items | async)">
403
+ <ng-container *ngIf="showCurrentTime">
404
+ <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
405
+ #currentTimeMarker class="k-current-time">
406
+ </div>
407
+ </ng-container>
408
+ <table class="k-scheduler-table" #contentTable role="presentation">
409
+ <tbody>
410
+ <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;">
411
+ <tr class="k-scheduler-header-all-day" *ngIf="allDaySlot && verticalResources.length">
412
+ <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
413
+ daySlot
414
+ [start]="slot.start"
415
+ [end]="slot.end"
416
+ [class.k-selected]="isSlotSelected({
417
+ start: toPlainDate(slot.start),
418
+ end: toPlainDate(slot.end),
419
+ isAllDay: true,
420
+ resources: resourcesByIndex(verticalIndex)
421
+ })"
422
+ [id]="{ resourceIndex: verticalIndex, rangeIndex: 0, index: index }">
423
+ <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
424
+ [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(verticalIndex) }"></ng-container>
425
+ </td>
426
+ </tr>
427
+ <tr *ngFor="let slot of timeSlots; index as index; trackBy: itemIndex" [class.k-middle-row]="isMiddleSlot(index)">
428
+ <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;">
429
+ <td *ngFor="let daySlot of daySlots; index as rangeIndex; trackBy: itemIndex"
430
+ [ngClass]="timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)"
431
+ timeSlot #timeSlot="timeSlot"
432
+ [date]="daySlot.start"
433
+ [invariantStart]="slot.start"
434
+ [invariantEnd]="slot.end"
435
+ [workDayStart]="workDayStartTime"
436
+ [workDayEnd]="workDayEndTime"
437
+ [workWeekStart]="workWeekStart"
438
+ [workWeekEnd]="workWeekEnd"
439
+ [id]="{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }"
440
+ [class.k-selected]="isSlotSelected({
441
+ start: toPlainDateTime(daySlot.start, slot.start),
442
+ end: toPlainDateTime(daySlot.start, slot.end),
443
+ isAllDay: false,
444
+ resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)
445
+ })"
446
+ class="k-scheduler-cell"
447
+ >
448
+ <ng-container *ngIf="timeSlotTemplateRef" [ngTemplateOutlet]="timeSlotTemplateRef"
449
+ [ngTemplateOutletContext]="{ date: timeSlot.startLocalTime, resources: resourcesByIndex(timeSlot.id.resourceIndex) }">
450
+ </ng-container>
451
+ </td>
452
+ </ng-container>
453
+ </tr>
454
+ </ng-container>
455
+ </tbody>
303
456
  </table>
304
- <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
457
+ <ng-container *ngFor="let item of items | async; trackBy: itemIndex;">
305
458
  <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
306
- [ngClass]="getEventClasses(item, itemResource.resources, true)"
307
- [ngStyle]="getEventStyles(item, itemResource, true)"
459
+ [ngClass]="getEventClasses(item, itemResource.resources)"
460
+ [ngStyle]="getEventStyles(item, itemResource)"
308
461
  role="button"
309
462
  [kendoSchedulerFocusIndex]="itemResource.leafIdx"
310
463
  [id]="item.elementId + '_' + itemResource.leafIdx"
311
- dayTimeViewItem
312
- [isAllDay]="true"
464
+ dayTimeViewItem
313
465
  [editable]="editable"
314
- [eventTemplate]="allDayEventTemplateRef"
466
+ [vertical]="true"
467
+ [eventTemplate]="eventTemplateRef"
315
468
  [item]="item"
316
469
  [index]="item.index"
317
470
  [rangeIndex]="item.rangeIndex"
@@ -319,189 +472,58 @@ MultiDayViewRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "1
319
472
  [resourceIndex]="itemResource.leafIdx">
320
473
  </div>
321
474
  </ng-container>
322
- <kendo-hint-container #headerHintContainer>
475
+ <ng-container *ngIf="verticalResources.length">
476
+ <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
477
+ <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
478
+ [ngClass]="getEventClasses(item, itemResource.resources, true)"
479
+ [ngStyle]="getEventStyles(item, itemResource, true)"
480
+ role="button"
481
+ [kendoSchedulerFocusIndex]="itemResource.leafIdx"
482
+ [id]="item.elementId + '_' + itemResource.leafIdx"
483
+ dayTimeViewItem
484
+ [isAllDay]="true"
485
+ [editable]="editable"
486
+ [eventTemplate]="allDayEventTemplateRef"
487
+ [item]="item"
488
+ [index]="item.index"
489
+ [rangeIndex]="item.rangeIndex"
490
+ [resources]="itemResource.resources"
491
+ [resourceIndex]="itemResource.leafIdx">
492
+ </div>
493
+ </ng-container>
494
+ </ng-container>
495
+ <kendo-hint-container #hintContainer>
323
496
  <ng-template>
324
- <div *ngIf="dragHints.length && allDayDragHint"
497
+ <div *ngIf="dragHints.length && (!allDayDragHint || verticalResources.length)"
325
498
  class="k-event-drag-hint"
499
+ role="button"
326
500
  dayTimeViewItem
327
- [isAllDay]="true"
501
+ [isAllDay]="allDayDragHint"
328
502
  [ngStyle]="dragHints[0].style"
329
503
  [ngClass]="dragHints[0].class"
330
504
  [dragHint]="true"
331
505
  [eventTemplate]="eventTemplateRef"
332
- [item]="dragHints[0].item"
333
- [resources]="dragHints[0].resources">
506
+ [resources]="dragHints[0].resources"
507
+ [item]="dragHints[0].item">
334
508
  </div>
335
509
 
336
- <div *ngIf="resizeHints.length && allDayResizeHint"
337
- kendoResizeHint
338
- [hint]="resizeHints[0]"
339
- [ngClass]="resizeHints[0].class"
340
- [format]="allDayResizeHintFormat">
341
- </div>
510
+ <ng-container *ngIf="resizeHints.length && (!allDayResizeHint || verticalResources.length)">
511
+ <div *ngFor="let hint of resizeHints; trackBy: itemIndex;"
512
+ kendoResizeHint
513
+ [hint]="hint"
514
+ [ngClass]="hint.class"
515
+ [format]="allDayResizeHint ? allDayResizeHintFormat : resizeHintFormat">
516
+ </div>
517
+ </ng-container>
342
518
  </ng-template>
343
519
  </kendo-hint-container>
344
520
  </div>
345
- </div>
346
- </div>
347
- </div>
348
- <div class="k-scheduler-pane">
349
- <div class="k-scheduler-times" #times>
350
- <ng-container *ngIf="showCurrentTime">
351
- <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
352
- #currentTimeArrow class="k-current-time k-current-time-arrow-right">
353
- </div>
354
- </ng-container>
355
- <table class="k-scheduler-table" #timesTable aria-hidden="true">
356
- <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;">
357
- <tr *ngIf="verticalResources.length">
358
- <ng-container *ngFor="let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;">
359
- <th *ngIf="verticalItem(leafIndex, resourceIndex)" [attr.rowspan]="verticalRowspan(resourceIndex)" class="k-slot-cell">
360
- <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>
361
- <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef"
362
- [ngTemplateOutletContext]="{ resource: verticalItem(leafIndex, resourceIndex) }"></ng-container>
363
- </th>
364
- </ng-container>
365
- <th *ngIf="allDaySlot" class="k-scheduler-times-all-day" #allDayCell>{{ allDayMessage }}</th>
366
- </tr>
367
- <tr *ngFor="let slot of timeSlots; let timeSlotIndex = index;trackBy: itemIndex">
368
- <th *ngIf="slot.isMajor" [ngClass]="{ 'k-slot-cell': slotDivisions === 1 }">
369
- <ng-container *ngIf="!majorTimeHeaderTemplateRef">{{ slot.start | kendoDate: 't' }}</ng-container>
370
- <ng-container *ngIf="majorTimeHeaderTemplateRef" [ngTemplateOutlet]="majorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
371
- </th>
372
- <th *ngIf="!slot.isMajor" [ngClass]="{ 'k-slot-cell': timeSlotIndex % slotDivisions === slotDivisions - 1 }">
373
- <ng-container *ngIf="minorTimeHeaderTemplateRef" [ngTemplateOutlet]="minorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }">
374
- </ng-container>
375
- </th>
376
- </tr>
377
- </ng-container>
378
- </table>
379
- </div>
380
- <div
381
- class="k-scheduler-content k-user-select-none"
382
- #content
383
- role="group"
384
- tabindex="0"
385
- [attr.aria-owns]="matchOwned(items | async)">
386
- <ng-container *ngIf="showCurrentTime">
387
- <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
388
- #currentTimeMarker class="k-current-time">
389
- </div>
390
- </ng-container>
391
- <table class="k-scheduler-table" #contentTable role="presentation">
392
- <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;">
393
- <tr class="k-scheduler-header-all-day" *ngIf="allDaySlot && verticalResources.length">
394
- <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
395
- daySlot
396
- [start]="slot.start"
397
- [end]="slot.end"
398
- [class.k-selected]="isSlotSelected({
399
- start: toPlainDate(slot.start),
400
- end: toPlainDate(slot.end),
401
- isAllDay: true,
402
- resources: resourcesByIndex(verticalIndex)
403
- })"
404
- [id]="{ resourceIndex: verticalIndex, rangeIndex: 0, index: index }">
405
- <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
406
- [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(verticalIndex) }"></ng-container>
407
- </td>
408
- </tr>
409
- <tr *ngFor="let slot of timeSlots; index as index; trackBy: itemIndex" [class.k-middle-row]="isMiddleSlot(index)">
410
- <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;">
411
- <td *ngFor="let daySlot of daySlots; index as rangeIndex; trackBy: itemIndex"
412
- [ngClass]="timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)"
413
- timeSlot #timeSlot="timeSlot"
414
- [date]="daySlot.start"
415
- [invariantStart]="slot.start"
416
- [invariantEnd]="slot.end"
417
- [workDayStart]="workDayStartTime"
418
- [workDayEnd]="workDayEndTime"
419
- [workWeekStart]="workWeekStart"
420
- [workWeekEnd]="workWeekEnd"
421
- [id]="{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }"
422
- [class.k-selected]="isSlotSelected({
423
- start: toPlainDateTime(daySlot.start, slot.start),
424
- end: toPlainDateTime(daySlot.start, slot.end),
425
- isAllDay: false,
426
- resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)
427
- })"
428
- >
429
- <ng-container *ngIf="timeSlotTemplateRef" [ngTemplateOutlet]="timeSlotTemplateRef"
430
- [ngTemplateOutletContext]="{ date: timeSlot.startLocalTime, resources: resourcesByIndex(timeSlot.id.resourceIndex) }">
431
- </ng-container>
432
- </td>
433
- </ng-container>
434
- </tr>
435
- </ng-container>
436
- </table>
437
- <ng-container *ngFor="let item of items | async; trackBy: itemIndex;">
438
- <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
439
- [ngClass]="getEventClasses(item, itemResource.resources)"
440
- [ngStyle]="getEventStyles(item, itemResource)"
441
- role="button"
442
- [kendoSchedulerFocusIndex]="itemResource.leafIdx"
443
- [id]="item.elementId + '_' + itemResource.leafIdx"
444
- dayTimeViewItem
445
- [editable]="editable"
446
- [vertical]="true"
447
- [eventTemplate]="eventTemplateRef"
448
- [item]="item"
449
- [index]="item.index"
450
- [rangeIndex]="item.rangeIndex"
451
- [resources]="itemResource.resources"
452
- [resourceIndex]="itemResource.leafIdx">
453
- </div>
454
- </ng-container>
455
- <ng-container *ngIf="verticalResources.length">
456
- <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
457
- <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
458
- [ngClass]="getEventClasses(item, itemResource.resources, true)"
459
- [ngStyle]="getEventStyles(item, itemResource, true)"
460
- role="button"
461
- [kendoSchedulerFocusIndex]="itemResource.leafIdx"
462
- [id]="item.elementId + '_' + itemResource.leafIdx"
463
- dayTimeViewItem
464
- [isAllDay]="true"
465
- [editable]="editable"
466
- [eventTemplate]="allDayEventTemplateRef"
467
- [item]="item"
468
- [index]="item.index"
469
- [rangeIndex]="item.rangeIndex"
470
- [resources]="itemResource.resources"
471
- [resourceIndex]="itemResource.leafIdx">
472
- </div>
473
- </ng-container>
474
- </ng-container>
475
- <kendo-hint-container #hintContainer>
476
- <ng-template>
477
- <div *ngIf="dragHints.length && (!allDayDragHint || verticalResources.length)"
478
- class="k-event-drag-hint"
479
- role="button"
480
- dayTimeViewItem
481
- [isAllDay]="allDayDragHint"
482
- [ngStyle]="dragHints[0].style"
483
- [ngClass]="dragHints[0].class"
484
- [dragHint]="true"
485
- [eventTemplate]="eventTemplateRef"
486
- [resources]="dragHints[0].resources"
487
- [item]="dragHints[0].item">
488
- </div>
489
-
490
- <ng-container *ngIf="resizeHints.length && (!allDayResizeHint || verticalResources.length)">
491
- <div *ngFor="let hint of resizeHints; trackBy: itemIndex;"
492
- kendoResizeHint
493
- [hint]="hint"
494
- [ngClass]="hint.class"
495
- [format]="allDayResizeHint ? allDayResizeHintFormat : resizeHintFormat">
496
- </div>
497
- </ng-container>
498
- </ng-template>
499
- </kendo-hint-container>
500
- </div>
501
- </div>
502
- </div>
521
+ </td>
522
+ </tr>
523
+ </tbody>
524
+ </table>
503
525
  `, isInline: true, dependencies: [{ kind: "component", type: i8.HintContainerComponent, selector: "kendo-hint-container" }, { kind: "component", type: i9.ResizeHintComponent, selector: "[kendoResizeHint]", inputs: ["hint", "format"] }, { kind: "directive", type: i10.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i10.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i10.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i10.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i10.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i11.FocusableDirective, selector: "[kendoSchedulerFocusIndex]", inputs: ["kendoSchedulerFocusIndex", "containerType"] }, { kind: "directive", type: i12.TimeSlotDirective, selector: "[timeSlot]", inputs: ["invariantStart", "invariantEnd", "workDayStart", "workDayEnd", "workWeekStart", "workWeekEnd", "date"], exportAs: ["timeSlot"] }, { kind: "directive", type: i12.DaySlotDirective, selector: "[daySlot]", inputs: ["start", "end"] }, { kind: "component", type: i13.DayTimeViewItemComponent, selector: "[dayTimeViewItem]", inputs: ["vertical", "isAllDay"] }, { kind: "pipe", type: i14.ResourceIteratorPipe, name: "resourceIterator" }, { kind: "pipe", type: i4.DatePipe, name: "kendoDate" }, { kind: "pipe", type: i10.AsyncPipe, name: "async" }] });
504
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: MultiDayViewRendererComponent, decorators: [{
526
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: MultiDayViewRendererComponent, decorators: [{
505
527
  type: Component,
506
528
  args: [{
507
529
  // eslint-disable-next-line @angular-eslint/component-selector
@@ -510,73 +532,226 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
510
532
  DayTimeSlotService
511
533
  ],
512
534
  template: `
513
- <div class="k-scheduler-layout k-scheduler-flex-layout" role="presentation" [ngClass]="classNames">
514
- <div class="k-scheduler-pane">
515
- <div class="k-scheduler-times" #timesHeader>
516
- <table class="k-scheduler-table" aria-hidden="true">
517
- <tr *ngFor="let resource of horizontalResources; trackBy: itemIndex;">
518
- <th></th>
519
- </tr>
520
- <tr>
521
- <th [style.height]="'auto'"></th>
522
- </tr>
523
- <tr *ngIf="allDaySlot && !verticalResources.length">
524
- <th class="k-scheduler-times-all-day" #allDayCell>{{ allDayMessage }}</th>
525
- </tr>
526
- </table>
527
- </div>
528
- <div class="k-scheduler-header k-state-default" #header>
529
- <div class="k-scheduler-header-wrap" #headerWrap>
530
- <table class="k-scheduler-table" aria-hidden="true">
531
- <tr *ngFor="let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;">
532
- <th *ngFor="let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;"
533
- class="k-slot-cell" [attr.colspan]="horizontalColspan(resourceIndex)">
534
- <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(item, resource.textField) }}</ng-container>
535
- <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef" [ngTemplateOutletContext]="{ resource: item }"></ng-container>
536
- </th>
537
- </tr>
538
- <tr>
539
- <ng-container *ngFor="let resource of horizontalResources | resourceIterator; trackBy: itemIndex;">
540
- <th *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex">
541
- <span *ngIf="!dateHeaderTemplateRef" class="k-link k-nav-day" [attr.data-dayslot-index]="index">{{ slot.start | kendoDate: dateFormat }}</span>
542
- <ng-container *ngIf="dateHeaderTemplateRef" [ngTemplateOutlet]="dateHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
543
- </th>
544
- </ng-container>
545
- </tr>
546
- </table>
547
- <div [style.position]="'relative'" *ngIf="allDaySlot && !verticalResources.length">
548
- <table class="k-scheduler-table k-scheduler-header-all-day k-user-select-none" aria-hidden="true">
549
- <tr>
550
- <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;">
551
- <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
552
- daySlot
553
- [start]="slot.start"
554
- [end]="slot.end"
555
- [id]="{ resourceIndex: resourceIndex, rangeIndex: 0, index: index }"
556
- [class.k-selected]="isSlotSelected({
557
- start: toPlainDate(slot.start),
558
- end: toPlainDate(slot.end),
559
- isAllDay: true,
560
- resources: resourcesByIndex(resourceIndex)
561
- })"
562
- [ngClass]="allDaySlotClass(slot, resourceIndex)">
563
- <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
564
- [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(resourceIndex) }"></ng-container>
565
- </td>
535
+ <table class="k-scheduler-layout" role="presentation" [ngClass]="classNames">
536
+ <tbody>
537
+ <tr class="k-scheduler-head">
538
+ <td>
539
+ <div class="k-scheduler-times" #timesHeader>
540
+ <table class="k-scheduler-table" aria-hidden="true">
541
+ <tbody>
542
+ <tr *ngFor="let resource of horizontalResources; trackBy: itemIndex;">
543
+ <th class="k-scheduler-cell k-heading-cell"></th>
544
+ </tr>
545
+ <tr [style.height]="'auto'">
546
+ <th class="k-scheduler-cell k-heading-cell"></th>
547
+ </tr>
548
+ <tr *ngIf="allDaySlot && !verticalResources.length">
549
+ <th class="k-scheduler-times-all-day k-scheduler-cell k-heading-cell" #allDayCell>{{ allDayMessage }}</th>
550
+ </tr>
551
+ </tbody>
552
+ </table>
553
+ </div>
554
+ </td>
555
+ <td>
556
+ <div class="k-scheduler-header" #header>
557
+ <div class="k-scheduler-header-wrap" #headerWrap>
558
+ <table class="k-scheduler-table" aria-hidden="true">
559
+ <tbody>
560
+ <tr *ngFor="let resource of horizontalResources; let resourceIndex = index; trackBy: itemIndex;">
561
+ <th *ngFor="let item of horizontalResources | resourceIterator : resourceIndex; trackBy: itemIndex;"
562
+ class="k-scheduler-cell k-heading-cell" [attr.colspan]="horizontalColspan(resourceIndex)">
563
+ <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(item, resource.textField) }}</ng-container>
564
+ <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef" [ngTemplateOutletContext]="{ resource: item }"></ng-container>
565
+ </th>
566
+ </tr>
567
+ <tr class="k-scheduler-date-group">
568
+ <ng-container *ngFor="let resource of horizontalResources | resourceIterator; trackBy: itemIndex;">
569
+ <th *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex" class="k-scheduler-cell k-heading-cell">
570
+ <span *ngIf="!dateHeaderTemplateRef" class="k-link k-nav-day" [attr.data-dayslot-index]="index">{{ slot.start | kendoDate: dateFormat }}</span>
571
+ <ng-container *ngIf="dateHeaderTemplateRef" [ngTemplateOutlet]="dateHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
572
+ </th>
573
+ </ng-container>
574
+ </tr>
575
+ </tbody>
576
+ </table>
577
+ <div [style.position]="'relative'" *ngIf="allDaySlot && !verticalResources.length">
578
+ <table class="k-scheduler-table k-scheduler-header-all-day" aria-hidden="true">
579
+ <tbody>
580
+ <tr>
581
+ <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let resourceIndex = index; trackBy: itemIndex;">
582
+ <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
583
+ daySlot
584
+ [start]="slot.start"
585
+ [end]="slot.end"
586
+ [id]="{ resourceIndex: resourceIndex, rangeIndex: 0, index: index }"
587
+ [class.k-selected]="isSlotSelected({
588
+ start: toPlainDate(slot.start),
589
+ end: toPlainDate(slot.end),
590
+ isAllDay: true,
591
+ resources: resourcesByIndex(resourceIndex)
592
+ })"
593
+ [ngClass]="allDaySlotClass(slot, resourceIndex)"
594
+ class="k-scheduler-cell">
595
+ <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
596
+ [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(resourceIndex) }"></ng-container>
597
+ </td>
598
+ </ng-container>
599
+ </tr>
600
+ </tbody>
601
+ </table>
602
+ <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
603
+ <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
604
+ [ngClass]="getEventClasses(item, itemResource.resources, true)"
605
+ [ngStyle]="getEventStyles(item, itemResource, true)"
606
+ role="button"
607
+ [kendoSchedulerFocusIndex]="itemResource.leafIdx"
608
+ [id]="item.elementId + '_' + itemResource.leafIdx"
609
+ dayTimeViewItem
610
+ [isAllDay]="true"
611
+ [editable]="editable"
612
+ [eventTemplate]="allDayEventTemplateRef"
613
+ [item]="item"
614
+ [index]="item.index"
615
+ [rangeIndex]="item.rangeIndex"
616
+ [resources]="itemResource.resources"
617
+ [resourceIndex]="itemResource.leafIdx">
618
+ </div>
566
619
  </ng-container>
567
- </tr>
620
+ <kendo-hint-container #headerHintContainer>
621
+ <ng-template>
622
+ <div *ngIf="dragHints.length && allDayDragHint"
623
+ class="k-event-drag-hint"
624
+ dayTimeViewItem
625
+ [isAllDay]="true"
626
+ [ngStyle]="dragHints[0].style"
627
+ [ngClass]="dragHints[0].class"
628
+ [dragHint]="true"
629
+ [eventTemplate]="eventTemplateRef"
630
+ [item]="dragHints[0].item"
631
+ [resources]="dragHints[0].resources">
632
+ </div>
633
+
634
+ <div *ngIf="resizeHints.length && allDayResizeHint"
635
+ kendoResizeHint
636
+ [hint]="resizeHints[0]"
637
+ [ngClass]="resizeHints[0].class"
638
+ [format]="allDayResizeHintFormat">
639
+ </div>
640
+ </ng-template>
641
+ </kendo-hint-container>
642
+ </div>
643
+ </div>
644
+ </div>
645
+ </td>
646
+ </tr>
647
+ <tr class="k-scheduler-body">
648
+ <td>
649
+ <div class="k-scheduler-times" #times>
650
+ <ng-container *ngIf="showCurrentTime">
651
+ <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
652
+ #currentTimeArrow class="k-current-time k-current-time-arrow-right">
653
+ </div>
654
+ </ng-container>
655
+ <table class="k-scheduler-table" #timesTable aria-hidden="true">
656
+ <tbody>
657
+ <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;">
658
+ <tr *ngIf="verticalResources.length">
659
+ <ng-container *ngFor="let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;">
660
+ <th *ngIf="verticalItem(leafIndex, resourceIndex)" [attr.rowspan]="verticalRowspan(resourceIndex)" class="k-scheduler-cell k-slot-cell k-heading-cell">
661
+ <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>
662
+ <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef"
663
+ [ngTemplateOutletContext]="{ resource: verticalItem(leafIndex, resourceIndex) }"></ng-container>
664
+ </th>
665
+ </ng-container>
666
+ <th *ngIf="allDaySlot" class="k-scheduler-times-all-day k-scheduler-cell k-heading-cell" #allDayCell>{{ allDayMessage }}</th>
667
+ </tr>
668
+ <tr *ngFor="let slot of timeSlots; let timeSlotIndex = index;trackBy: itemIndex">
669
+ <th *ngIf="slot.isMajor" [ngClass]="{ 'k-slot-cell': slotDivisions === 1 }" class="k-scheduler-cell k-heading-cell">
670
+ <ng-container *ngIf="!majorTimeHeaderTemplateRef">{{ slot.start | kendoDate: 't' }}</ng-container>
671
+ <ng-container *ngIf="majorTimeHeaderTemplateRef" [ngTemplateOutlet]="majorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
672
+ </th>
673
+ <th *ngIf="!slot.isMajor" [ngClass]="{ 'k-slot-cell': timeSlotIndex % slotDivisions === slotDivisions - 1 }" class="k-scheduler-cell k-heading-cell">
674
+ <ng-container *ngIf="minorTimeHeaderTemplateRef" [ngTemplateOutlet]="minorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }">
675
+ </ng-container>
676
+ </th>
677
+ </tr>
678
+ </ng-container>
679
+ </tbody>
680
+ </table>
681
+ </div>
682
+ </td>
683
+ <td>
684
+ <div
685
+ class="k-scheduler-content"
686
+ #content
687
+ role="group"
688
+ tabindex="0"
689
+ [attr.aria-owns]="matchOwned(items | async)">
690
+ <ng-container *ngIf="showCurrentTime">
691
+ <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
692
+ #currentTimeMarker class="k-current-time">
693
+ </div>
694
+ </ng-container>
695
+ <table class="k-scheduler-table" #contentTable role="presentation">
696
+ <tbody>
697
+ <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;">
698
+ <tr class="k-scheduler-header-all-day" *ngIf="allDaySlot && verticalResources.length">
699
+ <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
700
+ daySlot
701
+ [start]="slot.start"
702
+ [end]="slot.end"
703
+ [class.k-selected]="isSlotSelected({
704
+ start: toPlainDate(slot.start),
705
+ end: toPlainDate(slot.end),
706
+ isAllDay: true,
707
+ resources: resourcesByIndex(verticalIndex)
708
+ })"
709
+ [id]="{ resourceIndex: verticalIndex, rangeIndex: 0, index: index }">
710
+ <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
711
+ [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(verticalIndex) }"></ng-container>
712
+ </td>
713
+ </tr>
714
+ <tr *ngFor="let slot of timeSlots; index as index; trackBy: itemIndex" [class.k-middle-row]="isMiddleSlot(index)">
715
+ <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;">
716
+ <td *ngFor="let daySlot of daySlots; index as rangeIndex; trackBy: itemIndex"
717
+ [ngClass]="timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)"
718
+ timeSlot #timeSlot="timeSlot"
719
+ [date]="daySlot.start"
720
+ [invariantStart]="slot.start"
721
+ [invariantEnd]="slot.end"
722
+ [workDayStart]="workDayStartTime"
723
+ [workDayEnd]="workDayEndTime"
724
+ [workWeekStart]="workWeekStart"
725
+ [workWeekEnd]="workWeekEnd"
726
+ [id]="{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }"
727
+ [class.k-selected]="isSlotSelected({
728
+ start: toPlainDateTime(daySlot.start, slot.start),
729
+ end: toPlainDateTime(daySlot.start, slot.end),
730
+ isAllDay: false,
731
+ resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)
732
+ })"
733
+ class="k-scheduler-cell"
734
+ >
735
+ <ng-container *ngIf="timeSlotTemplateRef" [ngTemplateOutlet]="timeSlotTemplateRef"
736
+ [ngTemplateOutletContext]="{ date: timeSlot.startLocalTime, resources: resourcesByIndex(timeSlot.id.resourceIndex) }">
737
+ </ng-container>
738
+ </td>
739
+ </ng-container>
740
+ </tr>
741
+ </ng-container>
742
+ </tbody>
568
743
  </table>
569
- <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
744
+ <ng-container *ngFor="let item of items | async; trackBy: itemIndex;">
570
745
  <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
571
- [ngClass]="getEventClasses(item, itemResource.resources, true)"
572
- [ngStyle]="getEventStyles(item, itemResource, true)"
746
+ [ngClass]="getEventClasses(item, itemResource.resources)"
747
+ [ngStyle]="getEventStyles(item, itemResource)"
573
748
  role="button"
574
749
  [kendoSchedulerFocusIndex]="itemResource.leafIdx"
575
750
  [id]="item.elementId + '_' + itemResource.leafIdx"
576
- dayTimeViewItem
577
- [isAllDay]="true"
751
+ dayTimeViewItem
578
752
  [editable]="editable"
579
- [eventTemplate]="allDayEventTemplateRef"
753
+ [vertical]="true"
754
+ [eventTemplate]="eventTemplateRef"
580
755
  [item]="item"
581
756
  [index]="item.index"
582
757
  [rangeIndex]="item.rangeIndex"
@@ -584,187 +759,56 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
584
759
  [resourceIndex]="itemResource.leafIdx">
585
760
  </div>
586
761
  </ng-container>
587
- <kendo-hint-container #headerHintContainer>
762
+ <ng-container *ngIf="verticalResources.length">
763
+ <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
764
+ <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
765
+ [ngClass]="getEventClasses(item, itemResource.resources, true)"
766
+ [ngStyle]="getEventStyles(item, itemResource, true)"
767
+ role="button"
768
+ [kendoSchedulerFocusIndex]="itemResource.leafIdx"
769
+ [id]="item.elementId + '_' + itemResource.leafIdx"
770
+ dayTimeViewItem
771
+ [isAllDay]="true"
772
+ [editable]="editable"
773
+ [eventTemplate]="allDayEventTemplateRef"
774
+ [item]="item"
775
+ [index]="item.index"
776
+ [rangeIndex]="item.rangeIndex"
777
+ [resources]="itemResource.resources"
778
+ [resourceIndex]="itemResource.leafIdx">
779
+ </div>
780
+ </ng-container>
781
+ </ng-container>
782
+ <kendo-hint-container #hintContainer>
588
783
  <ng-template>
589
- <div *ngIf="dragHints.length && allDayDragHint"
784
+ <div *ngIf="dragHints.length && (!allDayDragHint || verticalResources.length)"
590
785
  class="k-event-drag-hint"
786
+ role="button"
591
787
  dayTimeViewItem
592
- [isAllDay]="true"
788
+ [isAllDay]="allDayDragHint"
593
789
  [ngStyle]="dragHints[0].style"
594
790
  [ngClass]="dragHints[0].class"
595
791
  [dragHint]="true"
596
792
  [eventTemplate]="eventTemplateRef"
597
- [item]="dragHints[0].item"
598
- [resources]="dragHints[0].resources">
793
+ [resources]="dragHints[0].resources"
794
+ [item]="dragHints[0].item">
599
795
  </div>
600
796
 
601
- <div *ngIf="resizeHints.length && allDayResizeHint"
602
- kendoResizeHint
603
- [hint]="resizeHints[0]"
604
- [ngClass]="resizeHints[0].class"
605
- [format]="allDayResizeHintFormat">
606
- </div>
797
+ <ng-container *ngIf="resizeHints.length && (!allDayResizeHint || verticalResources.length)">
798
+ <div *ngFor="let hint of resizeHints; trackBy: itemIndex;"
799
+ kendoResizeHint
800
+ [hint]="hint"
801
+ [ngClass]="hint.class"
802
+ [format]="allDayResizeHint ? allDayResizeHintFormat : resizeHintFormat">
803
+ </div>
804
+ </ng-container>
607
805
  </ng-template>
608
806
  </kendo-hint-container>
609
807
  </div>
610
- </div>
611
- </div>
612
- </div>
613
- <div class="k-scheduler-pane">
614
- <div class="k-scheduler-times" #times>
615
- <ng-container *ngIf="showCurrentTime">
616
- <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
617
- #currentTimeArrow class="k-current-time k-current-time-arrow-right">
618
- </div>
619
- </ng-container>
620
- <table class="k-scheduler-table" #timesTable aria-hidden="true">
621
- <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let leafIndex = index; trackBy: itemIndex;">
622
- <tr *ngIf="verticalResources.length">
623
- <ng-container *ngFor="let resource of verticalResources; let resourceIndex = index; trackBy: itemIndex;">
624
- <th *ngIf="verticalItem(leafIndex, resourceIndex)" [attr.rowspan]="verticalRowspan(resourceIndex)" class="k-slot-cell">
625
- <ng-container *ngIf="!groupHeaderTemplateRef">{{ getField(verticalItem(leafIndex, resourceIndex), resource.textField) }}</ng-container>
626
- <ng-container *ngIf="groupHeaderTemplateRef" [ngTemplateOutlet]="groupHeaderTemplateRef"
627
- [ngTemplateOutletContext]="{ resource: verticalItem(leafIndex, resourceIndex) }"></ng-container>
628
- </th>
629
- </ng-container>
630
- <th *ngIf="allDaySlot" class="k-scheduler-times-all-day" #allDayCell>{{ allDayMessage }}</th>
631
- </tr>
632
- <tr *ngFor="let slot of timeSlots; let timeSlotIndex = index;trackBy: itemIndex">
633
- <th *ngIf="slot.isMajor" [ngClass]="{ 'k-slot-cell': slotDivisions === 1 }">
634
- <ng-container *ngIf="!majorTimeHeaderTemplateRef">{{ slot.start | kendoDate: 't' }}</ng-container>
635
- <ng-container *ngIf="majorTimeHeaderTemplateRef" [ngTemplateOutlet]="majorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }"></ng-container>
636
- </th>
637
- <th *ngIf="!slot.isMajor" [ngClass]="{ 'k-slot-cell': timeSlotIndex % slotDivisions === slotDivisions - 1 }">
638
- <ng-container *ngIf="minorTimeHeaderTemplateRef" [ngTemplateOutlet]="minorTimeHeaderTemplateRef" [ngTemplateOutletContext]="{ date: slot.start }">
639
- </ng-container>
640
- </th>
641
- </tr>
642
- </ng-container>
643
- </table>
644
- </div>
645
- <div
646
- class="k-scheduler-content k-user-select-none"
647
- #content
648
- role="group"
649
- tabindex="0"
650
- [attr.aria-owns]="matchOwned(items | async)">
651
- <ng-container *ngIf="showCurrentTime">
652
- <div *ngFor="let resource of verticalResources | resourceIterator; trackBy: itemIndex;"
653
- #currentTimeMarker class="k-current-time">
654
- </div>
655
- </ng-container>
656
- <table class="k-scheduler-table" #contentTable role="presentation">
657
- <ng-container *ngFor="let resourceItem of verticalResources | resourceIterator; let verticalIndex = index; trackBy: itemIndex;">
658
- <tr class="k-scheduler-header-all-day" *ngIf="allDaySlot && verticalResources.length">
659
- <td *ngFor="let slot of daySlots; let index = index; trackBy: itemIndex"
660
- daySlot
661
- [start]="slot.start"
662
- [end]="slot.end"
663
- [class.k-selected]="isSlotSelected({
664
- start: toPlainDate(slot.start),
665
- end: toPlainDate(slot.end),
666
- isAllDay: true,
667
- resources: resourcesByIndex(verticalIndex)
668
- })"
669
- [id]="{ resourceIndex: verticalIndex, rangeIndex: 0, index: index }">
670
- <ng-container *ngIf="allDaySlotTemplateRef" [ngTemplateOutlet]="allDaySlotTemplateRef"
671
- [ngTemplateOutletContext]="{ date: slot.start, resources: resourcesByIndex(verticalIndex) }"></ng-container>
672
- </td>
673
- </tr>
674
- <tr *ngFor="let slot of timeSlots; index as index; trackBy: itemIndex" [class.k-middle-row]="isMiddleSlot(index)">
675
- <ng-container *ngFor="let resource of horizontalResources | resourceIterator; let horizontalIndex = index; trackBy: itemIndex;">
676
- <td *ngFor="let daySlot of daySlots; index as rangeIndex; trackBy: itemIndex"
677
- [ngClass]="timeSlotClass(slot, daySlot.start, verticalResources.length ? verticalIndex : horizontalIndex)"
678
- timeSlot #timeSlot="timeSlot"
679
- [date]="daySlot.start"
680
- [invariantStart]="slot.start"
681
- [invariantEnd]="slot.end"
682
- [workDayStart]="workDayStartTime"
683
- [workDayEnd]="workDayEndTime"
684
- [workWeekStart]="workWeekStart"
685
- [workWeekEnd]="workWeekEnd"
686
- [id]="{ resourceIndex: verticalResources.length ? verticalIndex : horizontalIndex, rangeIndex: rangeIndex, index: index }"
687
- [class.k-selected]="isSlotSelected({
688
- start: toPlainDateTime(daySlot.start, slot.start),
689
- end: toPlainDateTime(daySlot.start, slot.end),
690
- isAllDay: false,
691
- resources: resourcesByIndex(verticalResources.length ? verticalIndex : horizontalIndex)
692
- })"
693
- >
694
- <ng-container *ngIf="timeSlotTemplateRef" [ngTemplateOutlet]="timeSlotTemplateRef"
695
- [ngTemplateOutletContext]="{ date: timeSlot.startLocalTime, resources: resourcesByIndex(timeSlot.id.resourceIndex) }">
696
- </ng-container>
697
- </td>
698
- </ng-container>
699
- </tr>
700
- </ng-container>
701
- </table>
702
- <ng-container *ngFor="let item of items | async; trackBy: itemIndex;">
703
- <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
704
- [ngClass]="getEventClasses(item, itemResource.resources)"
705
- [ngStyle]="getEventStyles(item, itemResource)"
706
- role="button"
707
- [kendoSchedulerFocusIndex]="itemResource.leafIdx"
708
- [id]="item.elementId + '_' + itemResource.leafIdx"
709
- dayTimeViewItem
710
- [editable]="editable"
711
- [vertical]="true"
712
- [eventTemplate]="eventTemplateRef"
713
- [item]="item"
714
- [index]="item.index"
715
- [rangeIndex]="item.rangeIndex"
716
- [resources]="itemResource.resources"
717
- [resourceIndex]="itemResource.leafIdx">
718
- </div>
719
- </ng-container>
720
- <ng-container *ngIf="verticalResources.length">
721
- <ng-container *ngFor="let item of allDayItems | async; trackBy: itemIndex;">
722
- <div *ngFor="let itemResource of item.resources; trackBy: itemIndex;"
723
- [ngClass]="getEventClasses(item, itemResource.resources, true)"
724
- [ngStyle]="getEventStyles(item, itemResource, true)"
725
- role="button"
726
- [kendoSchedulerFocusIndex]="itemResource.leafIdx"
727
- [id]="item.elementId + '_' + itemResource.leafIdx"
728
- dayTimeViewItem
729
- [isAllDay]="true"
730
- [editable]="editable"
731
- [eventTemplate]="allDayEventTemplateRef"
732
- [item]="item"
733
- [index]="item.index"
734
- [rangeIndex]="item.rangeIndex"
735
- [resources]="itemResource.resources"
736
- [resourceIndex]="itemResource.leafIdx">
737
- </div>
738
- </ng-container>
739
- </ng-container>
740
- <kendo-hint-container #hintContainer>
741
- <ng-template>
742
- <div *ngIf="dragHints.length && (!allDayDragHint || verticalResources.length)"
743
- class="k-event-drag-hint"
744
- role="button"
745
- dayTimeViewItem
746
- [isAllDay]="allDayDragHint"
747
- [ngStyle]="dragHints[0].style"
748
- [ngClass]="dragHints[0].class"
749
- [dragHint]="true"
750
- [eventTemplate]="eventTemplateRef"
751
- [resources]="dragHints[0].resources"
752
- [item]="dragHints[0].item">
753
- </div>
754
-
755
- <ng-container *ngIf="resizeHints.length && (!allDayResizeHint || verticalResources.length)">
756
- <div *ngFor="let hint of resizeHints; trackBy: itemIndex;"
757
- kendoResizeHint
758
- [hint]="hint"
759
- [ngClass]="hint.class"
760
- [format]="allDayResizeHint ? allDayResizeHintFormat : resizeHintFormat">
761
- </div>
762
- </ng-container>
763
- </ng-template>
764
- </kendo-hint-container>
765
- </div>
766
- </div>
767
- </div>
808
+ </td>
809
+ </tr>
810
+ </tbody>
811
+ </table>
768
812
  `
769
813
  }]
770
814
  }], ctorParameters: function () { return [{ type: i1.LocalizationService }, { type: i2.ViewContextService }, { type: i3.ViewStateService }, { type: i4.IntlService }, { type: i5.DayTimeSlotService }, { type: i0.NgZone }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i6.PDFService }, { type: i7.ScrollbarWidthService }]; }, propDecorators: { allDaySlot: [{