@syncfusion/ej2-schedule 20.3.61 → 20.4.40

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 (157) hide show
  1. package/.eslintrc.json +16 -1
  2. package/CHANGELOG.md +10 -0
  3. package/README.md +62 -46
  4. package/dist/ej2-schedule.min.js +2 -2
  5. package/dist/ej2-schedule.umd.min.js +2 -2
  6. package/dist/ej2-schedule.umd.min.js.map +1 -1
  7. package/dist/es6/ej2-schedule.es2015.js +786 -524
  8. package/dist/es6/ej2-schedule.es2015.js.map +1 -1
  9. package/dist/es6/ej2-schedule.es5.js +821 -535
  10. package/dist/es6/ej2-schedule.es5.js.map +1 -1
  11. package/dist/global/ej2-schedule.min.js +2 -2
  12. package/dist/global/ej2-schedule.min.js.map +1 -1
  13. package/dist/global/index.d.ts +1 -1
  14. package/package.json +23 -33
  15. package/src/common/calendar-util.js +1 -1
  16. package/src/recurrence-editor/date-generator.js +26 -26
  17. package/src/recurrence-editor/recurrence-editor.js +5 -5
  18. package/src/schedule/actions/action-base.js +3 -3
  19. package/src/schedule/actions/crud.js +16 -16
  20. package/src/schedule/actions/drag.js +36 -32
  21. package/src/schedule/actions/keyboard.js +10 -8
  22. package/src/schedule/actions/resize.js +6 -6
  23. package/src/schedule/actions/touch.js +4 -3
  24. package/src/schedule/actions/virtual-scroll.js +10 -7
  25. package/src/schedule/base/interface.d.ts +8 -1
  26. package/src/schedule/base/resource.d.ts +1 -0
  27. package/src/schedule/base/resource.js +179 -93
  28. package/src/schedule/base/schedule-model.d.ts +7 -0
  29. package/src/schedule/base/schedule.d.ts +23 -0
  30. package/src/schedule/base/schedule.js +73 -22
  31. package/src/schedule/base/util.js +4 -6
  32. package/src/schedule/event-renderer/agenda-base.js +36 -31
  33. package/src/schedule/event-renderer/event-base.js +25 -25
  34. package/src/schedule/event-renderer/inline-edit.js +8 -5
  35. package/src/schedule/event-renderer/month.js +17 -14
  36. package/src/schedule/event-renderer/timeline-view.js +11 -11
  37. package/src/schedule/event-renderer/vertical-view.d.ts +1 -0
  38. package/src/schedule/event-renderer/vertical-view.js +97 -70
  39. package/src/schedule/event-renderer/year.js +25 -17
  40. package/src/schedule/exports/calendar-export.js +4 -4
  41. package/src/schedule/exports/calendar-import.js +14 -15
  42. package/src/schedule/exports/excel-export.js +1 -1
  43. package/src/schedule/models/group-model.d.ts +8 -0
  44. package/src/schedule/models/group.d.ts +7 -0
  45. package/src/schedule/models/group.js +3 -0
  46. package/src/schedule/models/views-model.d.ts +8 -1
  47. package/src/schedule/models/views.d.ts +7 -1
  48. package/src/schedule/models/views.js +3 -0
  49. package/src/schedule/popups/event-tooltip.js +3 -2
  50. package/src/schedule/popups/event-window.js +36 -30
  51. package/src/schedule/popups/quick-popups.js +6 -6
  52. package/src/schedule/renderer/agenda.js +5 -5
  53. package/src/schedule/renderer/header-renderer.d.ts +1 -1
  54. package/src/schedule/renderer/header-renderer.js +21 -5
  55. package/src/schedule/renderer/month-agenda.js +11 -4
  56. package/src/schedule/renderer/month.js +44 -16
  57. package/src/schedule/renderer/renderer.js +3 -3
  58. package/src/schedule/renderer/timeline-header-row.js +7 -7
  59. package/src/schedule/renderer/timeline-month.js +5 -5
  60. package/src/schedule/renderer/timeline-view.js +2 -2
  61. package/src/schedule/renderer/timeline-year.js +20 -14
  62. package/src/schedule/renderer/vertical-view.js +24 -9
  63. package/src/schedule/renderer/view-base.d.ts +3 -0
  64. package/src/schedule/renderer/view-base.js +11 -3
  65. package/src/schedule/renderer/year.js +11 -5
  66. package/styles/bootstrap-dark.css +364 -101
  67. package/styles/bootstrap.css +363 -99
  68. package/styles/bootstrap4.css +375 -141
  69. package/styles/bootstrap5-dark.css +339 -137
  70. package/styles/bootstrap5.css +339 -137
  71. package/styles/fabric-dark.css +330 -101
  72. package/styles/fabric.css +316 -106
  73. package/styles/fluent-dark.css +395 -102
  74. package/styles/fluent.css +395 -102
  75. package/styles/highcontrast-light.css +407 -98
  76. package/styles/highcontrast.css +399 -113
  77. package/styles/material-dark.css +362 -110
  78. package/styles/material.css +404 -110
  79. package/styles/recurrence-editor/_layout.scss +42 -28
  80. package/styles/recurrence-editor/bootstrap-dark.css +137 -28
  81. package/styles/recurrence-editor/bootstrap-dark.scss +5 -0
  82. package/styles/recurrence-editor/bootstrap.css +137 -28
  83. package/styles/recurrence-editor/bootstrap.scss +5 -0
  84. package/styles/recurrence-editor/bootstrap4.css +171 -28
  85. package/styles/recurrence-editor/bootstrap4.scss +5 -0
  86. package/styles/recurrence-editor/bootstrap5-dark.css +178 -28
  87. package/styles/recurrence-editor/bootstrap5-dark.scss +5 -0
  88. package/styles/recurrence-editor/bootstrap5.css +178 -28
  89. package/styles/recurrence-editor/bootstrap5.scss +5 -0
  90. package/styles/recurrence-editor/fabric-dark.css +113 -28
  91. package/styles/recurrence-editor/fabric-dark.scss +5 -0
  92. package/styles/recurrence-editor/fabric.css +106 -28
  93. package/styles/recurrence-editor/fabric.scss +5 -0
  94. package/styles/recurrence-editor/fluent-dark.css +158 -28
  95. package/styles/recurrence-editor/fluent-dark.scss +5 -0
  96. package/styles/recurrence-editor/fluent.css +158 -28
  97. package/styles/recurrence-editor/fluent.scss +5 -0
  98. package/styles/recurrence-editor/highcontrast-light.css +110 -28
  99. package/styles/recurrence-editor/highcontrast-light.scss +5 -0
  100. package/styles/recurrence-editor/highcontrast.css +110 -28
  101. package/styles/recurrence-editor/highcontrast.scss +5 -0
  102. package/styles/recurrence-editor/material-dark.css +138 -28
  103. package/styles/recurrence-editor/material-dark.scss +5 -0
  104. package/styles/recurrence-editor/material.css +163 -28
  105. package/styles/recurrence-editor/material.scss +5 -0
  106. package/styles/recurrence-editor/tailwind-dark.css +126 -28
  107. package/styles/recurrence-editor/tailwind-dark.scss +5 -0
  108. package/styles/recurrence-editor/tailwind.css +126 -28
  109. package/styles/recurrence-editor/tailwind.scss +5 -0
  110. package/styles/schedule/_bootstrap-dark-definition.scss +63 -4
  111. package/styles/schedule/_bootstrap-definition.scss +62 -3
  112. package/styles/schedule/_bootstrap4-definition.scss +65 -5
  113. package/styles/schedule/_bootstrap5-definition.scss +63 -5
  114. package/styles/schedule/_fabric-dark-definition.scss +61 -3
  115. package/styles/schedule/_fabric-definition.scss +62 -3
  116. package/styles/schedule/_fluent-definition.scss +63 -6
  117. package/styles/schedule/_fusionnew-definition.scss +60 -3
  118. package/styles/schedule/_highcontrast-definition.scss +62 -3
  119. package/styles/schedule/_highcontrast-light-definition.scss +62 -3
  120. package/styles/schedule/_layout.scss +117 -506
  121. package/styles/schedule/_material-dark-definition.scss +63 -4
  122. package/styles/schedule/_material-definition.scss +63 -4
  123. package/styles/schedule/_material3-definition.scss +62 -3
  124. package/styles/schedule/_tailwind-definition.scss +63 -6
  125. package/styles/schedule/_theme.scss +97 -62
  126. package/styles/schedule/bootstrap-dark.css +332 -73
  127. package/styles/schedule/bootstrap-dark.scss +11 -0
  128. package/styles/schedule/bootstrap.css +331 -71
  129. package/styles/schedule/bootstrap.scss +11 -0
  130. package/styles/schedule/bootstrap4.css +343 -113
  131. package/styles/schedule/bootstrap4.scss +11 -0
  132. package/styles/schedule/bootstrap5-dark.css +307 -109
  133. package/styles/schedule/bootstrap5-dark.scss +11 -0
  134. package/styles/schedule/bootstrap5.css +307 -109
  135. package/styles/schedule/bootstrap5.scss +11 -0
  136. package/styles/schedule/fabric-dark.css +298 -73
  137. package/styles/schedule/fabric-dark.scss +11 -0
  138. package/styles/schedule/fabric.css +284 -78
  139. package/styles/schedule/fabric.scss +11 -0
  140. package/styles/schedule/fluent-dark.css +363 -74
  141. package/styles/schedule/fluent-dark.scss +11 -0
  142. package/styles/schedule/fluent.css +363 -74
  143. package/styles/schedule/fluent.scss +11 -0
  144. package/styles/schedule/highcontrast-light.css +375 -70
  145. package/styles/schedule/highcontrast-light.scss +11 -0
  146. package/styles/schedule/highcontrast.css +367 -85
  147. package/styles/schedule/highcontrast.scss +11 -0
  148. package/styles/schedule/material-dark.css +330 -82
  149. package/styles/schedule/material-dark.scss +11 -0
  150. package/styles/schedule/material.css +372 -82
  151. package/styles/schedule/material.scss +11 -0
  152. package/styles/schedule/tailwind-dark.css +246 -111
  153. package/styles/schedule/tailwind-dark.scss +11 -0
  154. package/styles/schedule/tailwind.css +246 -111
  155. package/styles/schedule/tailwind.scss +11 -0
  156. package/styles/tailwind-dark.css +279 -140
  157. package/styles/tailwind.css +279 -140
@@ -520,7 +520,7 @@ var KeyboardInteraction = /** @class */ (function () {
520
520
  var appointmentElements = [];
521
521
  appointments.map(function (value) { return value.getAttribute('data-guid'); }).filter(function (value, index, self) {
522
522
  if (self.indexOf(value) === index) {
523
- appointmentElements.push(appointments[index]);
523
+ appointmentElements.push(appointments[parseInt(index.toString(), 10)]);
524
524
  }
525
525
  });
526
526
  return appointmentElements;
@@ -532,7 +532,7 @@ var KeyboardInteraction = /** @class */ (function () {
532
532
  KeyboardInteraction.prototype.processViewNavigation = function (e) {
533
533
  var index = parseInt(e.key, 10) - 1;
534
534
  if (index < this.parent.views.length) {
535
- var view = this.parent.viewCollections[index].option;
535
+ var view = this.parent.viewCollections[parseInt(index.toString(), 10)].option;
536
536
  this.parent.changeView(view, e, undefined, index);
537
537
  if (this.parent.headerModule) {
538
538
  this.parent.headerModule.element.querySelector('.e-active-view button').focus();
@@ -645,10 +645,11 @@ var KeyboardInteraction = /** @class */ (function () {
645
645
  }
646
646
  };
647
647
  KeyboardInteraction.prototype.getYearUpDownCell = function (tableRows, rowIndex, cellIndex, isUp) {
648
- while (tableRows[rowIndex] && tableRows[rowIndex].cells[cellIndex].classList.contains(cls.OTHERMONTH_CLASS)) {
648
+ while (tableRows[parseInt(rowIndex.toString(), 10)] &&
649
+ tableRows[parseInt(rowIndex.toString(), 10)].cells[parseInt(cellIndex.toString(), 10)].classList.contains(cls.OTHERMONTH_CLASS)) {
649
650
  rowIndex = rowIndex + (isUp ? -1 : 1);
650
651
  }
651
- return tableRows[rowIndex].cells[cellIndex];
652
+ return tableRows[parseInt(rowIndex.toString(), 10)].cells[parseInt(cellIndex.toString(), 10)];
652
653
  };
653
654
  // eslint-disable-next-line max-len
654
655
  KeyboardInteraction.prototype.getHorizontalUpDownCell = function (tableRows, target, curRowIndex, isUp) {
@@ -667,7 +668,7 @@ var KeyboardInteraction = /** @class */ (function () {
667
668
  var hasRow = isUp && curRowIndex > 0 || !isUp && curRowIndex < tableRows.length - 1;
668
669
  var targetCell = hasRow ? tableRows[curRowIndex + (isUp ? -1 : 1)].cells[target.cellIndex] : undefined;
669
670
  if (!targetCell || targetCell.classList.contains(cls.OTHERMONTH_CLASS)) {
670
- var column = tableRows[curRowIndex].cells[target.cellIndex - (isUp ? 1 : -1)];
671
+ var column = tableRows[parseInt(curRowIndex.toString(), 10)].cells[target.cellIndex - (isUp ? 1 : -1)];
671
672
  if (column) {
672
673
  var dateAttr = +target.getAttribute('data-date') - (isUp ? util.MS_PER_DAY : -util.MS_PER_DAY);
673
674
  return this.parent.getContentTable().querySelector('.' + cls.WORK_CELLS_CLASS + '[data-date="' + dateAttr + '"]');
@@ -683,7 +684,7 @@ var KeyboardInteraction = /** @class */ (function () {
683
684
  element: tableEle,
684
685
  rowIndex: curRowIndex,
685
686
  columnIndex: target.cellIndex,
686
- maxIndex: tableEle.rows[curRowIndex].cells.length
687
+ maxIndex: tableEle.rows[parseInt(curRowIndex.toString(), 10)].cells.length
687
688
  };
688
689
  return key;
689
690
  };
@@ -756,7 +757,8 @@ var KeyboardInteraction = /** @class */ (function () {
756
757
  var rowIndex = this.isInverseTableSelect() ? key.rowIndex : 0;
757
758
  this.parent.changeDate(this.parent.activeView.getNextPreviousDate('next'), e);
758
759
  var tableEle = this.parent.getContentTable();
759
- var cell = isMonthEnd ? tableEle.rows[rowIndex].querySelector('.' + cls.WORK_CELLS_CLASS + ':not(.' + cls.OTHERMONTH_CLASS + ')') : tableEle.rows[rowIndex].cells[0];
760
+ var cell = isMonthEnd ? tableEle.rows[parseInt(rowIndex.toString(), 10)].querySelector('.' + cls.WORK_CELLS_CLASS + ':not(.' + cls.OTHERMONTH_CLASS + ')')
761
+ : tableEle.rows[parseInt(rowIndex.toString(), 10)].cells[0];
760
762
  this.selectCells(false, cell);
761
763
  }
762
764
  }
@@ -826,7 +828,7 @@ var KeyboardInteraction = /** @class */ (function () {
826
828
  this.parent.changeDate(this.parent.activeView.getNextPreviousDate('previous'), e);
827
829
  var tableEle = this.parent.getContentTable();
828
830
  var rowIndex = this.isInverseTableSelect() ? key.rowIndex : tableEle.rows.length - 1;
829
- var cell = tableEle.rows[rowIndex].cells[key.maxIndex - 1];
831
+ var cell = tableEle.rows[parseInt(rowIndex.toString(), 10)].cells[key.maxIndex - 1];
830
832
  if (isMonthStart) {
831
833
  var tbody = this.parent.element.querySelectorAll('.' + cls.CONTENT_TABLE_CLASS + ' tbody');
832
834
  cell = tbody.item(tbody.length - 1).querySelector(':not(.' + cls.OTHERMONTH_CLASS + ')[data-date="' + this.parent.activeView.getEndDate().getTime() + '"]');
@@ -36,9 +36,9 @@ var Resize = /** @class */ (function (_super) {
36
36
  Resize.prototype.resizeHelper = function () {
37
37
  if (this.parent.activeViewOptions.group.resources.length > 0 && this.parent.activeViewOptions.group.allowGroupEdit) {
38
38
  for (var i = 0, len = this.actionObj.originalElement.length; i < len; i++) {
39
- var cloneElement = this.createCloneElement(this.actionObj.originalElement[i]);
40
- this.actionObj.cloneElement[i] = cloneElement;
41
- if (this.actionObj.element === this.actionObj.originalElement[i]) {
39
+ var cloneElement = this.createCloneElement(this.actionObj.originalElement[parseInt(i.toString(), 10)]);
40
+ this.actionObj.cloneElement[parseInt(i.toString(), 10)] = cloneElement;
41
+ if (this.actionObj.element === this.actionObj.originalElement[parseInt(i.toString(), 10)]) {
42
42
  this.actionObj.clone = cloneElement;
43
43
  }
44
44
  }
@@ -403,10 +403,10 @@ var Resize = /** @class */ (function (_super) {
403
403
  }
404
404
  var resizeDate = void 0;
405
405
  if (['Year', 'Month', 'Week', 'Date'].indexOf(headerName) !== -1) {
406
- resizeDate = new Date(this.parent.activeView.renderDates[cellIndex].getTime());
406
+ resizeDate = new Date(this.parent.activeView.renderDates[parseInt(cellIndex.toString(), 10)].getTime());
407
407
  }
408
408
  else {
409
- resizeDate = this.parent.getDateFromElement(tr.children[cellIndex]);
409
+ resizeDate = this.parent.getDateFromElement(tr.children[parseInt(cellIndex.toString(), 10)]);
410
410
  }
411
411
  if (['TimelineMonth', 'Year', 'Month', 'Week', 'Date'].indexOf(headerName) !== -1 ||
412
412
  !this.parent.activeViewOptions.timeScale.enable) {
@@ -433,7 +433,7 @@ var Resize = /** @class */ (function (_super) {
433
433
  var tr = closest(this.actionObj.clone, 'tr');
434
434
  var dayIndex = isLeft ? cloneIndex - noOfDays : cloneIndex + noOfDays - 1;
435
435
  dayIndex = this.getIndex(dayIndex);
436
- resizeTime = this.parent.getDateFromElement(tr.children[dayIndex]);
436
+ resizeTime = this.parent.getDateFromElement(tr.children[parseInt(dayIndex.toString(), 10)]);
437
437
  if (isLeft) {
438
438
  resizeTime.setHours(eventStart.getHours(), eventStart.getMinutes(), eventStart.getSeconds());
439
439
  }
@@ -22,8 +22,9 @@ var ScheduleTouch = /** @class */ (function () {
22
22
  }
23
23
  ScheduleTouch.prototype.scrollHandler = function (e) {
24
24
  if (this.parent.currentView === 'Agenda' || this.parent.uiStateValues.action || !this.parent.allowSwiping ||
25
- (e.originalEvent && e.originalEvent.target && (e.originalEvent.target.classList.contains(cls.APPOINTMENT_CLASS) ||
26
- closest(e.originalEvent.target, '.' + cls.APPOINTMENT_CLASS)) && !this.parent.isAdaptive)) {
25
+ (e.originalEvent && e.originalEvent.target &&
26
+ (e.originalEvent.target.classList.contains(cls.APPOINTMENT_CLASS) ||
27
+ closest(e.originalEvent.target, '.' + cls.APPOINTMENT_CLASS)) && !this.parent.isAdaptive)) {
27
28
  return;
28
29
  }
29
30
  if (!this.timeStampStart) {
@@ -175,7 +176,7 @@ var ScheduleTouch = /** @class */ (function () {
175
176
  addClass([_this.element], cls.TRANSLATE_CLASS);
176
177
  _this.element.style.transform = 'translatex(' + translateX + 'px)';
177
178
  if (_this.parent.headerModule) {
178
- _this.parent.headerModule.updateDateRange(_this.parent.activeView.getDateRangeText());
179
+ _this.parent.headerModule.updateDateRange();
179
180
  }
180
181
  _this.parent.renderTemplates();
181
182
  _this.parent.crudModule.refreshDataManager();
@@ -233,21 +233,24 @@ var VirtualScroll = /** @class */ (function () {
233
233
  var resCollection = [];
234
234
  var index = { startIndex: 0, endIndex: 0 };
235
235
  if (this.parent.activeViewOptions.group.byDate) {
236
- if (lastLevel[startIndex].date.getTime() === this.parent.resourceBase.expandedResources[0].date.getTime() &&
237
- lastLevel[endIndex].date.getTime() ===
236
+ if (lastLevel[parseInt(startIndex.toString(), 10)].date.getTime() ===
237
+ this.parent.resourceBase.expandedResources[0].date.getTime() &&
238
+ lastLevel[parseInt(endIndex.toString(), 10)].date.getTime() ===
238
239
  this.parent.resourceBase.expandedResources[this.parent.resourceBase.expandedResources.length - 1].date.getTime()) {
239
240
  return this.parent.resourceBase.expandedResources;
240
241
  }
241
- resCollection = this.getByDateCollection(lastLevel[startIndex], lastLevel[endIndex], index);
242
+ resCollection =
243
+ this.getByDateCollection(lastLevel[parseInt(startIndex.toString(), 10)], lastLevel[parseInt(endIndex.toString(), 10)], index);
242
244
  this.setRenderedDates(resCollection);
243
245
  }
244
246
  else {
245
- if (lastLevel[startIndex].groupIndex === this.parent.resourceBase.expandedResources[0].groupIndex &&
246
- lastLevel[endIndex].groupIndex ===
247
+ if (lastLevel[parseInt(startIndex.toString(), 10)].groupIndex === this.parent.resourceBase.expandedResources[0].groupIndex &&
248
+ lastLevel[parseInt(endIndex.toString(), 10)].groupIndex ===
247
249
  this.parent.resourceBase.expandedResources[this.parent.resourceBase.expandedResources.length - 1].groupIndex) {
248
250
  return this.parent.resourceBase.expandedResources;
249
251
  }
250
- resCollection = this.getByIdCollection(lastLevel[startIndex], lastLevel[endIndex], index);
252
+ resCollection =
253
+ this.getByIdCollection(lastLevel[parseInt(startIndex.toString(), 10)], lastLevel[parseInt(endIndex.toString(), 10)], index);
251
254
  }
252
255
  if (this.parent.currentView !== 'Month') {
253
256
  this.startIndex = index.startIndex;
@@ -327,7 +330,7 @@ var VirtualScroll = /** @class */ (function () {
327
330
  else {
328
331
  var col = [].slice.call(conWrap.querySelector('colgroup').children);
329
332
  for (var i = 0; i < col.length; i++) {
330
- remove(col[i]);
333
+ remove(col[parseInt(i.toString(), 10)]);
331
334
  }
332
335
  this.parent.activeView.colLevels[this.parent.activeView.colLevels.length - 1] = resCollection;
333
336
  var contentRows = this.parent.activeView.getContentRows();
@@ -375,6 +375,12 @@ export interface CellTemplateArgs {
375
375
  groupIndex?: number;
376
376
  }
377
377
  /** @private */
378
+ export interface DateRangeTemplateArgs {
379
+ startDate: Date;
380
+ endDate: Date;
381
+ currentView: View;
382
+ }
383
+ /** @private */
378
384
  export interface CrudArgs extends ActionEventArgs {
379
385
  promise?: Promise<any>;
380
386
  editParams?: SaveChanges;
@@ -396,7 +402,7 @@ export interface IRenderer {
396
402
  getStartHour(): Date;
397
403
  getEndHour(): Date;
398
404
  getLabelText(view: string): string;
399
- getDateRangeText(): string;
405
+ getDateRangeText(date?: Date): string;
400
406
  getEndDateFromStartDate(date: Date): Date;
401
407
  addEventListener(): void;
402
408
  removeEventListener(): void;
@@ -563,6 +569,7 @@ export interface ViewsData extends ViewsModel {
563
569
  eventTemplateName?: string;
564
570
  dayHeaderTemplateName?: string;
565
571
  monthHeaderTemplateName?: string;
572
+ dateRangeTemplateName?: string;
566
573
  }
567
574
  /** @private */
568
575
  export interface CrudAction {
@@ -13,6 +13,7 @@ export declare class ResourceBase {
13
13
  private treePopup;
14
14
  private popupOverlay;
15
15
  private leftPixel;
16
+ resourceDateTree: TdData[][];
16
17
  constructor(parent: Schedule);
17
18
  renderResourceHeaderIndent(tr: Element): void;
18
19
  hideResourceRows(tBody: Element): void;