@syncfusion/ej2-schedule 19.4.55 → 20.1.50

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 (77) hide show
  1. package/CHANGELOG.md +42 -9
  2. package/dist/ej2-schedule.umd.min.js +2 -2
  3. package/dist/ej2-schedule.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-schedule.es2015.js +165 -53
  5. package/dist/es6/ej2-schedule.es2015.js.map +1 -1
  6. package/dist/es6/ej2-schedule.es5.js +165 -53
  7. package/dist/es6/ej2-schedule.es5.js.map +1 -1
  8. package/dist/global/ej2-schedule.min.js +2 -2
  9. package/dist/global/ej2-schedule.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +15 -15
  12. package/src/recurrence-editor/date-generator.js +11 -1
  13. package/src/schedule/base/schedule.js +4 -0
  14. package/src/schedule/event-renderer/agenda-base.js +1 -1
  15. package/src/schedule/event-renderer/month.d.ts +1 -0
  16. package/src/schedule/event-renderer/month.js +37 -28
  17. package/src/schedule/event-renderer/timeline-view.js +2 -1
  18. package/src/schedule/event-renderer/year.js +3 -1
  19. package/src/schedule/exports/calendar-export.js +1 -1
  20. package/src/schedule/popups/event-window.js +4 -2
  21. package/src/schedule/renderer/month.d.ts +1 -0
  22. package/src/schedule/renderer/month.js +29 -12
  23. package/src/schedule/renderer/renderer.js +2 -1
  24. package/src/schedule/renderer/timeline-year.d.ts +2 -1
  25. package/src/schedule/renderer/timeline-year.js +49 -4
  26. package/src/schedule/renderer/vertical-view.js +2 -1
  27. package/src/schedule/renderer/year.js +20 -0
  28. package/styles/bootstrap-dark.css +10 -7
  29. package/styles/bootstrap.css +10 -7
  30. package/styles/bootstrap4.css +11 -8
  31. package/styles/bootstrap5-dark.css +20 -19
  32. package/styles/bootstrap5.css +20 -19
  33. package/styles/fabric-dark.css +10 -7
  34. package/styles/fabric.css +10 -7
  35. package/styles/fluent-dark.css +5102 -0
  36. package/styles/fluent-dark.scss +2 -0
  37. package/styles/fluent.css +5103 -0
  38. package/styles/fluent.scss +2 -0
  39. package/styles/highcontrast-light.css +10 -7
  40. package/styles/highcontrast.css +11 -8
  41. package/styles/material-dark.css +10 -7
  42. package/styles/material.css +10 -7
  43. package/styles/recurrence-editor/_fluent-dark-definition.scss +1 -0
  44. package/styles/recurrence-editor/fluent-dark.css +495 -0
  45. package/styles/recurrence-editor/fluent-dark.scss +3 -0
  46. package/styles/recurrence-editor/fluent.css +495 -0
  47. package/styles/recurrence-editor/fluent.scss +3 -0
  48. package/styles/schedule/_bootstrap4-definition.scss +1 -1
  49. package/styles/schedule/_bootstrap5-definition.scss +4 -4
  50. package/styles/schedule/_fluent-dark-definition.scss +1 -0
  51. package/styles/schedule/_fluent-definition.scss +10 -8
  52. package/styles/schedule/_highcontrast-definition.scss +1 -1
  53. package/styles/schedule/_layout.scss +55 -14
  54. package/styles/schedule/_tailwind-definition.scss +1 -0
  55. package/styles/schedule/_theme.scss +6 -9
  56. package/styles/schedule/bootstrap-dark.css +10 -7
  57. package/styles/schedule/bootstrap.css +10 -7
  58. package/styles/schedule/bootstrap4.css +11 -8
  59. package/styles/schedule/bootstrap5-dark.css +20 -19
  60. package/styles/schedule/bootstrap5.css +20 -19
  61. package/styles/schedule/fabric-dark.css +10 -7
  62. package/styles/schedule/fabric.css +10 -7
  63. package/styles/schedule/fluent-dark.css +4606 -0
  64. package/styles/schedule/fluent-dark.scss +4 -0
  65. package/styles/schedule/fluent.css +4607 -0
  66. package/styles/schedule/fluent.scss +5 -0
  67. package/styles/schedule/highcontrast-light.css +10 -7
  68. package/styles/schedule/highcontrast.css +11 -8
  69. package/styles/schedule/icons/_fluent-dark.scss +1 -0
  70. package/styles/schedule/icons/_fluent.scss +51 -50
  71. package/styles/schedule/icons/_tailwind.scss +51 -50
  72. package/styles/schedule/material-dark.css +10 -7
  73. package/styles/schedule/material.css +10 -7
  74. package/styles/schedule/tailwind-dark.css +65 -60
  75. package/styles/schedule/tailwind.css +65 -60
  76. package/styles/tailwind-dark.css +65 -60
  77. package/styles/tailwind.css +65 -60
@@ -3631,6 +3631,10 @@ function generate(startDate, rule, excludeDate, startDayOfWeek, maximumCount = M
3631
3631
  }
3632
3632
  maxOccurrence = maximumCount;
3633
3633
  setFirstDayOfWeek(DAYINDEX[startDayOfWeek]);
3634
+ if (ruleObject.until) {
3635
+ const end = resetTime(ruleObject.until);
3636
+ ruleObject.until = new Date(end.getFullYear(), end.getMonth(), end.getDate(), 23, 59, 59);
3637
+ }
3634
3638
  switch (ruleObject.freq) {
3635
3639
  case 'DAILY':
3636
3640
  dailyType(modifiedDate, ruleObject.until, data, ruleObject);
@@ -3727,6 +3731,9 @@ function dailyType(startDate, endDate, data, ruleObject) {
3727
3731
  }
3728
3732
  }
3729
3733
  tempDate.setDate(tempDate.getDate() + interval);
3734
+ if (tempDate.getHours() !== startDate.getHours()) {
3735
+ tempDate.setHours(startDate.getHours());
3736
+ }
3730
3737
  }
3731
3738
  }
3732
3739
  /**
@@ -3771,6 +3778,9 @@ function weeklyType(startDate, endDate, data, ruleObject) {
3771
3778
  break;
3772
3779
  }
3773
3780
  tempDate.setDate(tempDate.getDate() + 1);
3781
+ if (tempDate.getHours() !== startDate.getHours()) {
3782
+ tempDate.setHours(startDate.getHours());
3783
+ }
3774
3784
  compareTempDate = new Date(tempDate.getTime());
3775
3785
  compareTempDate = resetTime(compareTempDate);
3776
3786
  }
@@ -4652,7 +4662,7 @@ function insertDateCollection(state, startDate, endDate, data, ruleObject, dayDa
4652
4662
  function weekCount(year, startDayOfWeek, monthCollection, week, ruleObject) {
4653
4663
  const firstDayOfWeek = startDayOfWeek || 0;
4654
4664
  const firstOfMonth = new Date(year, ruleObject.month[0] - 1, 1);
4655
- const lastOfMonth = new Date(year, ruleObject.month[0] - 1, 0);
4665
+ const lastOfMonth = new Date(year, ruleObject.month[0], 0);
4656
4666
  const numberOfDaysInMonth = lastOfMonth.getDate();
4657
4667
  const firstWeekDay = (firstOfMonth.getDay() - firstDayOfWeek + 7) % 7;
4658
4668
  const used = firstWeekDay + numberOfDaysInMonth;
@@ -7096,7 +7106,7 @@ class MonthEvent extends EventBase {
7096
7106
  if (appElement.length > 0) {
7097
7107
  appElement = (this.parent.currentView === 'Month') ? appElement : [appElement[0]];
7098
7108
  for (const wrap of appElement) {
7099
- if (!wrap.classList.contains('e-more-indicator') && wrap.parentElement && wrap.parentElement.parentNode) {
7109
+ if (wrap.parentElement && wrap.parentElement.parentNode) {
7100
7110
  remove(wrap.parentElement);
7101
7111
  }
7102
7112
  }
@@ -7226,11 +7236,18 @@ class MonthEvent extends EventBase {
7226
7236
  const filteredDates = this.getRenderedDates(dateRender);
7227
7237
  this.getSlotDates(workDays || this.parent.activeViewOptions.workDays);
7228
7238
  this.processBlockEvents(blockList, resIndex, resData);
7239
+ let events = [];
7229
7240
  for (const event of eventsList) {
7230
7241
  if (this.parent.resourceBase && !resData) {
7231
7242
  this.cssClass = this.parent.resourceBase.getCssClass(event);
7232
7243
  }
7233
- const spannedEvents = this.splitEvent(event, filteredDates || this.dateRender);
7244
+ events = events.concat(this.splitEvent(event, filteredDates || this.dateRender));
7245
+ }
7246
+ for (let level = 0; level < this.slots.length; level++) {
7247
+ this.renderedEvents = [];
7248
+ const slot = this.slots[level];
7249
+ const endDate = addDays(new Date(slot[slot.length - 1]), 1);
7250
+ const spannedEvents = this.filterEvents(new Date(slot[0]), endDate, events);
7234
7251
  for (const event of spannedEvents) {
7235
7252
  if (this.maxHeight) {
7236
7253
  const sDate = this.parent.currentView === 'Month' ? event[this.fields.startTime] :
@@ -7529,21 +7546,17 @@ class MonthEvent extends EventBase {
7529
7546
  if (day < 0) {
7530
7547
  return;
7531
7548
  }
7532
- if ((startTime.getTime() < this.parent.minDate.getTime()) || (endTime.getTime() > this.parent.maxDate.getTime())) {
7533
- return;
7534
- }
7535
7549
  const overlapCount = this.getIndex(startTime);
7536
7550
  event.Index = overlapCount;
7537
- let appHeight = this.eventHeight;
7538
- this.renderedEvents.push(extend({}, event, null, true));
7539
7551
  const diffInDays = event.data.count;
7540
7552
  if (startTime.getTime() <= endTime.getTime()) {
7541
7553
  const appWidth = (diffInDays * this.cellWidth) - 5;
7542
7554
  const cellTd = this.workCells[day];
7543
- const appTop = (overlapCount * (appHeight + EVENT_GAP));
7544
- const height = this.monthHeaderHeight + ((overlapCount + 1) * (appHeight + EVENT_GAP)) + this.moreIndicatorHeight;
7555
+ const appTop = (overlapCount * (this.eventHeight + EVENT_GAP));
7556
+ const height = this.monthHeaderHeight + ((overlapCount + 1) * (this.eventHeight + EVENT_GAP)) + this.moreIndicatorHeight;
7545
7557
  const enableAppRender = this.maxOrIndicator ? overlapCount < 1 ? true : false : this.cellHeight > height;
7546
7558
  if (this.parent.rowAutoHeight || enableAppRender) {
7559
+ this.renderedEvents.push(extend({}, event, null, true));
7547
7560
  let appointmentElement;
7548
7561
  if (this.inlineValue) {
7549
7562
  appointmentElement = this.parent.inlineModule.createInlineAppointmentElement();
@@ -7562,24 +7575,26 @@ class MonthEvent extends EventBase {
7562
7575
  }
7563
7576
  else {
7564
7577
  for (let i = 0; i < diffInDays; i++) {
7565
- const cellTd = this.workCells[day + i];
7566
- if (cellTd && isNullOrUndefined(cellTd.querySelector('.' + MORE_INDICATOR_CLASS))) {
7567
- const startDate = new Date(this.dateRender[day + i].getTime());
7568
- const endDate = addDays(this.dateRender[day + i], 1);
7569
- const groupIndex = cellTd.getAttribute('data-group-index');
7570
- const filterEvents = this.getFilteredEvents(startDate, endDate, groupIndex);
7571
- const appArea = this.cellHeight - this.monthHeaderHeight - this.moreIndicatorHeight;
7572
- appHeight = this.withIndicator ? appArea : appHeight;
7573
- const renderedAppCount = Math.floor(appArea / (appHeight + EVENT_GAP));
7574
- const count = (filterEvents.length - renderedAppCount) <= 0 ? 1 : (filterEvents.length - renderedAppCount);
7575
- const moreIndicatorElement = this.getMoreIndicatorElement(count, startDate, endDate);
7576
- if (!isNullOrUndefined(groupIndex)) {
7577
- moreIndicatorElement.setAttribute('data-group-index', groupIndex);
7578
+ if (this.workCells[day + i]) {
7579
+ const indicator = this.workCells[day + i].querySelector('.' + MORE_INDICATOR_CLASS);
7580
+ if (indicator) {
7581
+ const count = parseInt(indicator.getAttribute('data-count'), 10) + 1;
7582
+ indicator.setAttribute('data-count', count.toString());
7583
+ indicator.innerHTML = this.getMoreIndicatorText(count);
7584
+ }
7585
+ else {
7586
+ const startDate = new Date(this.dateRender[day + i].getTime());
7587
+ const endDate = addDays(this.dateRender[day + i], 1);
7588
+ const groupIndex = this.workCells[day + i].getAttribute('data-group-index');
7589
+ const moreIndicatorElement = this.getMoreIndicatorElement(1, startDate, endDate);
7590
+ if (!isNullOrUndefined(groupIndex)) {
7591
+ moreIndicatorElement.setAttribute('data-group-index', groupIndex);
7592
+ }
7593
+ moreIndicatorElement.style.top = (this.cellHeight - this.monthHeaderHeight - this.moreIndicatorHeight) + 'px';
7594
+ moreIndicatorElement.style.width = this.cellWidth - 2 + 'px';
7595
+ this.renderElement(this.workCells[day + i], moreIndicatorElement);
7596
+ EventHandler.add(moreIndicatorElement, 'click', this.moreIndicatorClick, this);
7578
7597
  }
7579
- moreIndicatorElement.style.top = appArea + 'px';
7580
- moreIndicatorElement.style.width = this.cellWidth - 2 + 'px';
7581
- this.renderElement(cellTd, moreIndicatorElement);
7582
- EventHandler.add(moreIndicatorElement, 'click', this.moreIndicatorClick, this);
7583
7598
  }
7584
7599
  }
7585
7600
  }
@@ -7615,8 +7630,8 @@ class MonthEvent extends EventBase {
7615
7630
  }
7616
7631
  getOverlapEvents(date, appointments) {
7617
7632
  const appointmentsList = [];
7633
+ const dateTime = resetTime(date).getTime();
7618
7634
  for (const app of appointments) {
7619
- const dateTime = resetTime(date).getTime();
7620
7635
  if ((resetTime(app[this.fields.startTime]).getTime() <= dateTime) &&
7621
7636
  (resetTime(app[this.fields.endTime]).getTime() >= dateTime)) {
7622
7637
  appointmentsList.push(app);
@@ -7697,9 +7712,10 @@ class MonthEvent extends EventBase {
7697
7712
  getMoreIndicatorElement(count, startDate, endDate) {
7698
7713
  const moreIndicatorElement = createElement('div', {
7699
7714
  className: MORE_INDICATOR_CLASS,
7700
- innerHTML: '+' + this.parent.globalize.formatNumber(count) + '&nbsp;' + (this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('more')),
7715
+ innerHTML: this.getMoreIndicatorText(count),
7701
7716
  attrs: {
7702
7717
  'tabindex': '0',
7718
+ 'data-count': count.toString(),
7703
7719
  'data-start-date': startDate.getTime().toString(),
7704
7720
  'data-end-date': endDate.getTime().toString(),
7705
7721
  'role': 'list'
@@ -7707,6 +7723,9 @@ class MonthEvent extends EventBase {
7707
7723
  });
7708
7724
  return moreIndicatorElement;
7709
7725
  }
7726
+ getMoreIndicatorText(count) {
7727
+ return '+' + this.parent.globalize.formatNumber(count) + '&nbsp;' + (this.parent.isAdaptive ? '' : this.parent.localeObj.getConstant('more'));
7728
+ }
7710
7729
  removeHeightProperty(selector) {
7711
7730
  const rows = [].slice.call(this.element.querySelectorAll('.' + selector + ' tbody tr'));
7712
7731
  for (const row of rows) {
@@ -7986,7 +8005,8 @@ class TimelineEvent extends MonthEvent {
7986
8005
  }
7987
8006
  }
7988
8007
  updateCellHeight(cell, height) {
7989
- if ((height > this.cellHeight)) {
8008
+ const cellHeight = cell.style.height === '' ? this.cellHeight : parseInt(cell.style.height, 10);
8009
+ if (height > cellHeight) {
7990
8010
  setStyleAttribute(cell, { 'height': height + 'px' });
7991
8011
  if (this.parent.activeViewOptions.group.resources.length > 0) {
7992
8012
  const resourceCell = this.parent.element.querySelector('.' + RESOURCE_COLUMN_TABLE_CLASS + ' ' + 'tbody td[data-group-index="' +
@@ -11730,7 +11750,8 @@ class EventWindow {
11730
11750
  return labelText;
11731
11751
  }
11732
11752
  onChange(args) {
11733
- const target = args.event.currentTarget.querySelector('input');
11753
+ const targetSelector = `.${EVENT_WINDOW_ALL_DAY_CLASS},.${TIME_ZONE_CLASS},.${EVENT_WINDOW_REPEAT_CLASS}`;
11754
+ const target = closest(args.event.target, targetSelector);
11734
11755
  if (target.classList.contains(EVENT_WINDOW_ALL_DAY_CLASS)) {
11735
11756
  this.onAllDayChange(args.checked);
11736
11757
  }
@@ -11894,7 +11915,8 @@ class EventWindow {
11894
11915
  }
11895
11916
  showDetails(eventData) {
11896
11917
  const eventObj = extend({}, eventData, null, true);
11897
- if (eventObj[this.fields.endTime].getHours() === 0 && eventObj[this.fields.endTime].getMinutes() === 0) {
11918
+ if ((!this.cellClickAction || this.cellClickAction && !isNullOrUndefined(this.parent.editorTemplate)) &&
11919
+ eventObj[this.fields.endTime].getHours() === 0 && eventObj[this.fields.endTime].getMinutes() === 0) {
11898
11920
  this.trimAllDay(eventObj);
11899
11921
  }
11900
11922
  this.eventData = eventObj;
@@ -13182,7 +13204,8 @@ class Render {
13182
13204
  this.parent.virtualScrollModule.destroy();
13183
13205
  this.parent.virtualScrollModule = null;
13184
13206
  }
13185
- if (this.parent.currentView.indexOf('Timeline') !== -1 && this.parent.currentView.indexOf('Year') === -1
13207
+ if (this.parent.currentView.indexOf('Timeline') !== -1 && (this.parent.currentView.indexOf('Year') === -1 ||
13208
+ (this.parent.currentView === 'TimelineYear' && this.parent.activeViewOptions.orientation === 'Vertical'))
13186
13209
  && this.parent.activeViewOptions.allowVirtualScrolling
13187
13210
  && this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
13188
13211
  this.parent.virtualScrollModule = new VirtualScroll(this.parent);
@@ -15728,6 +15751,7 @@ let Schedule = class Schedule extends Component {
15728
15751
  };
15729
15752
  this.trigger(navigating, navArgs, (navigationArgs) => {
15730
15753
  if (!navigationArgs.cancel) {
15754
+ this.uiStateValues.isInitial = ['TimelineMonth', 'TimelineYear', 'Year'].indexOf(view) > -1 ? true : this.uiStateValues.isInitial;
15731
15755
  this.viewIndex = navigationArgs.viewIndex;
15732
15756
  this.setProperties({ currentView: view }, true);
15733
15757
  if (this.headerModule) {
@@ -16346,6 +16370,9 @@ let Schedule = class Schedule extends Component {
16346
16370
  if (document.querySelectorAll(template).length) {
16347
16371
  return compile(document.querySelector(template).innerHTML.trim());
16348
16372
  }
16373
+ else {
16374
+ return compile(template);
16375
+ }
16349
16376
  }
16350
16377
  catch (error) {
16351
16378
  return compile(template);
@@ -19151,7 +19178,9 @@ class YearEvent extends TimelineEvent {
19151
19178
  this.eventHeight = getElementHeightFromClass(eventTable, APPOINTMENT_CLASS);
19152
19179
  const wrapperCollection = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_CONTAINER_CLASS));
19153
19180
  const resources = this.parent.uiStateValues.isGroupAdaptive ?
19154
- [this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex]] : this.parent.resourceBase.lastResourceLevel;
19181
+ [this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex]] :
19182
+ this.parent.activeViewOptions.allowVirtualScrolling ? this.parent.resourceBase.renderedResources :
19183
+ this.parent.resourceBase.lastResourceLevel;
19155
19184
  const months = this.getMonths();
19156
19185
  if (this.parent.activeViewOptions.orientation === 'Horizontal') {
19157
19186
  for (let month = 0; month < months.length; month++) {
@@ -21930,8 +21959,9 @@ class VerticalView extends ViewBase {
21930
21959
  const msStartHour = startHour.getTime();
21931
21960
  const msEndHour = endHour.getTime();
21932
21961
  if (msStartHour !== msEndHour) {
21962
+ const duration = this.parent.activeViewOptions.timeScale.interval / this.parent.activeViewOptions.timeScale.slotCount;
21933
21963
  length = (Math.abs(msEndHour - msStartHour) / msInterval) - ((new Date(msEndHour).getTimezoneOffset()
21934
- - new Date(msStartHour).getTimezoneOffset()) / (60 / this.parent.activeViewOptions.timeScale.slotCount));
21964
+ - new Date(msStartHour).getTimezoneOffset()) / duration);
21935
21965
  }
21936
21966
  if (!this.parent.activeViewOptions.timeScale.enable) {
21937
21967
  length = 1;
@@ -22106,6 +22136,8 @@ class Month extends ViewBase {
22106
22136
  this.parent.notify(virtualScroll, e);
22107
22137
  this.scrollTopPanel(e.target);
22108
22138
  this.scrollLeftPanel(e.target);
22139
+ this.parent.uiStateValues.top = e.target.scrollTop;
22140
+ this.parent.uiStateValues.left = e.target.scrollLeft;
22109
22141
  this.setPersistence();
22110
22142
  }
22111
22143
  scrollLeftPanel(target) {
@@ -22138,26 +22170,41 @@ class Month extends ViewBase {
22138
22170
  header.style[args.cssProperties.padding] = '';
22139
22171
  }
22140
22172
  this.setColWidth(content);
22141
- if (args.scrollPosition) {
22173
+ if (args.scrollPosition || !args.isPreventScrollUpdate && this.parent.currentView === 'TimelineMonth') {
22174
+ const top = this.parent.currentView === 'TimelineMonth' ? this.parent.uiStateValues.top : args.scrollPosition.top;
22142
22175
  if (leftPanel) {
22143
- leftPanel.scrollTop = args.scrollPosition.top;
22176
+ leftPanel.scrollTop = top;
22144
22177
  }
22145
- content.scrollTop = args.scrollPosition.top;
22146
- content.scrollLeft = args.scrollPosition.left;
22147
- }
22148
- else {
22149
- const headerCell = this.element.querySelector('.' + HEADER_CELLS_CLASS + '[data-date="'
22150
- + this.parent.selectedDate.getTime().toString() + '"]');
22151
- if (!isNullOrUndefined(headerCell)) {
22152
- content.scrollLeft = !this.parent.enableRtl ?
22153
- headerCell.offsetLeft : -(this.parent.getContentTable().offsetWidth - headerCell.offsetLeft - headerCell.offsetWidth);
22178
+ content.scrollTop = top;
22179
+ if (this.parent.uiStateValues.isInitial) {
22180
+ this.scrollToSelectedDate();
22181
+ this.parent.uiStateValues.isInitial = false;
22154
22182
  }
22155
22183
  else {
22156
- content.scrollLeft = 0;
22184
+ content.scrollLeft = this.parent.currentView === 'TimelineMonth' ? this.parent.uiStateValues.left :
22185
+ args.scrollPosition.left;
22157
22186
  }
22158
22187
  }
22188
+ else {
22189
+ this.scrollToSelectedDate();
22190
+ }
22159
22191
  this.retainScrollPosition();
22160
22192
  }
22193
+ scrollToSelectedDate() {
22194
+ const headerCell = this.element.querySelector('.' + HEADER_CELLS_CLASS + '[data-date="'
22195
+ + this.parent.selectedDate.getTime().toString() + '"]');
22196
+ const content = this.getContentAreaElement();
22197
+ if (!isNullOrUndefined(headerCell)) {
22198
+ content.scrollLeft = !this.parent.enableRtl ?
22199
+ headerCell.offsetLeft : -(this.parent.getContentTable().offsetWidth - headerCell.offsetLeft - headerCell.offsetWidth);
22200
+ }
22201
+ else {
22202
+ content.scrollLeft = 0;
22203
+ }
22204
+ if (content.scrollLeft === 0 && this.parent.uiStateValues.isInitial) {
22205
+ this.parent.uiStateValues.left = 0;
22206
+ }
22207
+ }
22161
22208
  setContentHeight(content, leftPanelElement, height) {
22162
22209
  content.style.height = 'auto';
22163
22210
  if (this.parent.currentView === 'Month') {
@@ -22712,6 +22759,9 @@ class Year extends ViewBase {
22712
22759
  const viewTypeClass = this.parent.activeViewOptions.orientation === 'Horizontal' ? 'e-horizontal' : 'e-vertical';
22713
22760
  addClass([this.element], [this.viewClass, viewTypeClass, className]);
22714
22761
  this.renderPanel(className);
22762
+ if (this.parent.activeViewOptions.allowVirtualScrolling) {
22763
+ addClass([this.element], [VIRTUAL_SCROLL_CLASS]);
22764
+ }
22715
22765
  const calendarTable = this.createTableLayout(OUTER_TABLE_CLASS);
22716
22766
  this.element.appendChild(calendarTable);
22717
22767
  this.element.querySelector('table').setAttribute('role', 'presentation');
@@ -22924,6 +22974,7 @@ class Year extends ViewBase {
22924
22974
  onContentScroll(e) {
22925
22975
  const target = e.target;
22926
22976
  const headerWrapper = this.getDatesHeaderElement();
22977
+ this.parent.notify(virtualScroll, e);
22927
22978
  if (headerWrapper) {
22928
22979
  headerWrapper.firstElementChild.scrollLeft = target.scrollLeft;
22929
22980
  }
@@ -22932,6 +22983,10 @@ class Year extends ViewBase {
22932
22983
  if (scrollTopElement) {
22933
22984
  scrollTopElement.scrollTop = target.scrollTop;
22934
22985
  }
22986
+ if (!this.parent.isAdaptive) {
22987
+ this.parent.uiStateValues.top = e.target.scrollTop;
22988
+ }
22989
+ this.parent.uiStateValues.left = e.target.scrollLeft;
22935
22990
  this.setPersistence();
22936
22991
  }
22937
22992
  onScrollUiUpdate(args) {
@@ -22962,6 +23017,18 @@ class Year extends ViewBase {
22962
23017
  const isYScroll = contentWrapper.scrollWidth > contentWrapper.clientWidth;
22963
23018
  leftPanelElement.style.height = formatUnit(height - (isYScroll ? 17 : 0));
22964
23019
  }
23020
+ if (!args.isPreventScrollUpdate) {
23021
+ if (this.parent.uiStateValues.isInitial) {
23022
+ this.parent.uiStateValues.isInitial = false;
23023
+ }
23024
+ else {
23025
+ if (leftPanelElement) {
23026
+ leftPanelElement.scrollTop = this.parent.uiStateValues.top;
23027
+ }
23028
+ contentWrapper.scrollTop = this.parent.uiStateValues.top;
23029
+ contentWrapper.scrollLeft = this.parent.uiStateValues.left;
23030
+ }
23031
+ }
22965
23032
  this.retainScrollPosition();
22966
23033
  }
22967
23034
  getStartDate() {
@@ -23064,7 +23131,7 @@ class AgendaBase extends ViewBase {
23064
23131
  moduleName: 'agenda',
23065
23132
  listClass: this.parent.activeView.viewClass,
23066
23133
  itemClass: this.parent.activeView.viewClass,
23067
- template: '<div class=' + AGENDA_NO_EVENT_CLASS + '>${subject}</div>'
23134
+ template: `<div class="${AGENDA_NO_EVENT_CLASS}">${this.parent.localeObj.getConstant('noEvents')}</div>`
23068
23135
  });
23069
23136
  }
23070
23137
  else {
@@ -24608,7 +24675,7 @@ class TimelineYear extends Year {
24608
24675
  !this.parent.uiStateValues.isGroupAdaptive) {
24609
24676
  tdCollection.push(firstTd);
24610
24677
  firstTd.appendChild(this.parent.resourceBase.createResourceColumn());
24611
- this.rowCount = this.parent.resourceBase.lastResourceLevel.length;
24678
+ this.rowCount = this.parent.resourceBase.renderedResources.length;
24612
24679
  }
24613
24680
  else {
24614
24681
  tdCollection.push(firstTd);
@@ -24625,6 +24692,9 @@ class TimelineYear extends Year {
24625
24692
  content.appendChild(contentTable);
24626
24693
  const eventWrapper = createElement('div', { className: EVENT_TABLE_CLASS });
24627
24694
  content.appendChild(eventWrapper);
24695
+ if (this.parent.virtualScrollModule) {
24696
+ this.parent.virtualScrollModule.renderVirtualTrack(content);
24697
+ }
24628
24698
  const contentTBody = contentTable.querySelector('tbody');
24629
24699
  if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
24630
24700
  if (this.parent.rowAutoHeight) {
@@ -24742,6 +24812,47 @@ class TimelineYear extends Year {
24742
24812
  }
24743
24813
  }
24744
24814
  }
24815
+ getContentRows() {
24816
+ const tRow = [];
24817
+ const monthCells = this.getMonths();
24818
+ for (let row = 0; row < this.parent.resourceBase.renderedResources.length; row++) {
24819
+ const tr = createElement('tr', { attrs: { 'role': 'row' } });
24820
+ tRow.push(tr);
24821
+ let resData;
24822
+ if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
24823
+ resData = this.parent.resourceBase.renderedResources[row];
24824
+ }
24825
+ let monthDate = new Date(this.parent.selectedDate.getFullYear(), monthCells[row], 1);
24826
+ let date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
24827
+ for (let month = 0; month < this.columnCount; month++) {
24828
+ let classList$$1 = [];
24829
+ const groupIndex = resData.groupIndex;
24830
+ classList$$1 = classList$$1.concat(resData.className);
24831
+ if (classList$$1.indexOf(RESOURCE_PARENT_CLASS) > -1) {
24832
+ classList$$1.push(RESOURCE_GROUP_CELLS_CLASS);
24833
+ }
24834
+ else {
24835
+ classList$$1.push(WORKDAY_CLASS);
24836
+ }
24837
+ monthDate = new Date(this.parent.selectedDate.getFullYear(), monthCells[month], 1);
24838
+ date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
24839
+ const tdELe = createElement('td', {
24840
+ className: WORK_CELLS_CLASS,
24841
+ attrs: {
24842
+ 'role': 'gridcell', 'aria-selected': 'false',
24843
+ 'data-date': date.getTime().toString()
24844
+ }
24845
+ });
24846
+ addClass([tdELe], classList$$1);
24847
+ tdELe.setAttribute('data-group-index', groupIndex.toString());
24848
+ this.renderCellTemplate({ date: date, type: 'resourceGroupCells', groupIndex: groupIndex }, tdELe);
24849
+ this.wireEvents(tdELe, 'cell');
24850
+ this.parent.trigger(renderCell, { elementType: 'resourceGroupCells', element: tdELe, date: date });
24851
+ tr.appendChild(tdELe);
24852
+ }
24853
+ }
24854
+ return tRow;
24855
+ }
24745
24856
  renderResourceContent(wrapper, monthBody, contentBody) {
24746
24857
  const months = this.getMonths();
24747
24858
  for (let row = 0; row < this.rowCount; row++) {
@@ -24749,8 +24860,8 @@ class TimelineYear extends Year {
24749
24860
  const tr = createElement('tr', { attrs: { 'role': 'row' } });
24750
24861
  contentBody.appendChild(tr);
24751
24862
  let resData;
24752
- if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
24753
- resData = this.parent.resourceBase.lastResourceLevel[row];
24863
+ if (this.parent.activeViewOptions.orientation === 'Vertical' && this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
24864
+ resData = this.parent.resourceBase.renderedResources[row];
24754
24865
  }
24755
24866
  let monthDate = new Date(this.parent.selectedDate.getFullYear(), months[row], 1);
24756
24867
  let date = this.parent.calendarUtil.getMonthStartDate(new Date(monthDate.getTime()));
@@ -24771,8 +24882,9 @@ class TimelineYear extends Year {
24771
24882
  }
24772
24883
  for (let month = 0; month < this.columnCount; month++) {
24773
24884
  let classList$$1 = [];
24774
- let groupIndex = row;
24885
+ let groupIndex;
24775
24886
  if (this.parent.activeViewOptions.orientation === 'Vertical') {
24887
+ groupIndex = resData.groupIndex;
24776
24888
  classList$$1 = classList$$1.concat(resData.className);
24777
24889
  if (classList$$1.indexOf(RESOURCE_PARENT_CLASS) > -1) {
24778
24890
  classList$$1.push(RESOURCE_GROUP_CELLS_CLASS);
@@ -24874,7 +24986,7 @@ class ICalendarExport {
24874
24986
  const editedExDate = [];
24875
24987
  if (eventObj[fields.recurrenceID]) {
24876
24988
  const filter = this.filterEvents(filterCollection, fields.id, eventObj[fields.recurrenceID]);
24877
- uId = filter[0].UID;
24989
+ uId = filter.length > 0 ? filter[0].UID : uId;
24878
24990
  }
24879
24991
  if (!eventObj[fields.recurrenceID] && eventObj[fields.recurrenceRule] && eventObj[fields.recurrenceException]) {
24880
24992
  const exDate = (eventObj[fields.recurrenceException]).split(',');