@syncfusion/ej2-schedule 26.1.35 → 26.1.39

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 26.1.35
+*  version : 26.1.39
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-schedule@*",
-  "_id": "@syncfusion/ej2-schedule@22.9.0",
+  "_id": "@syncfusion/ej2-schedule@26.1.38",
   "_inBundle": false,
-  "_integrity": "sha512-cbmdRc8J/qV77jIuDMYvpqRZxfgaaT8ATKKb8JFgIE2W/9wR2bhVqd9nWjMfnqTB2n8C+s07mz1p590gCbi5eQ==",
+  "_integrity": "sha512-6wiM9HSKXKAhDc4QcYohgHXw5aBMa9GL6V99hxG5+1qDdJRqCEsTmKThJSYDMYt8rC2CjJjgTWZt+SIveHVZvQ==",
   "_location": "/@syncfusion/ej2-schedule",
   "_phantomChildren": {},
   "_requested": {
@@ -23,8 +23,8 @@
     "/@syncfusion/ej2-react-schedule",
     "/@syncfusion/ej2-vue-schedule"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-release/@syncfusion/ej2-schedule/-/ej2-schedule-22.9.0.tgz",
-  "_shasum": "dc4b9da9933cae83dd17089bda3a219960824ba3",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-schedule/-/ej2-schedule-26.1.38.tgz",
+  "_shasum": "43e837e3f81d03784ae9ec082ecbb0ecffb9f96c",
   "_spec": "@syncfusion/ej2-schedule@*",
   "_where": "/jenkins/workspace/elease-automation_release_26.1.1/packages/included",
   "author": {
@@ -35,16 +35,16 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~26.1.35",
+    "@syncfusion/ej2-base": "~26.1.37",
     "@syncfusion/ej2-buttons": "~26.1.35",
-    "@syncfusion/ej2-calendars": "~26.1.35",
+    "@syncfusion/ej2-calendars": "~26.1.38",
     "@syncfusion/ej2-data": "~26.1.35",
-    "@syncfusion/ej2-dropdowns": "~26.1.35",
+    "@syncfusion/ej2-dropdowns": "~26.1.39",
     "@syncfusion/ej2-excel-export": "~26.1.35",
-    "@syncfusion/ej2-inputs": "~26.1.35",
+    "@syncfusion/ej2-inputs": "~26.1.39",
     "@syncfusion/ej2-lists": "~26.1.35",
-    "@syncfusion/ej2-navigations": "~26.1.35",
-    "@syncfusion/ej2-popups": "~26.1.35",
+    "@syncfusion/ej2-navigations": "~26.1.39",
+    "@syncfusion/ej2-popups": "~26.1.38",
     "@types/requirejs": "^2.1.37"
   },
   "deprecated": false,
@@ -74,6 +74,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "26.1.35",
+  "version": "26.1.39",
   "sideEffects": false
 }

package/src/schedule/actions/crud.js

@@ -59,7 +59,9 @@ var Crud = /** @class */ (function () {
             _this.parent.trigger(events.dataBound, null, function () {
                 _this.parent.hideSpinner();
                 if (_this.parent.isPrinting) {
-                    _this.parent.notify(events.print, {});
+                    setTimeout(function () {
+                        _this.parent.notify(events.print, {});
+                    }, 100);
                 }
             });
         });

package/src/schedule/actions/resize.js

@@ -116,6 +116,11 @@ var Resize = /** @class */ (function (_super) {
             }
             var viewElement = _this.parent.element.querySelector('.' + cls.CONTENT_WRAP_CLASS);
             _this.scrollArgs = { element: viewElement, width: viewElement.scrollWidth, height: viewElement.scrollHeight };
+            // 883565 - To fix the resizing not working issue at the last column of the timeline view
+            if (['Month', 'TimelineYear'].indexOf(_this.parent.currentView) < 0) {
+                var scrollWidth = Math.round(_this.scrollArgs.width / _this.actionObj.cellWidth) * _this.actionObj.cellWidth;
+                _this.scrollArgs.width = _this.scrollArgs.width < scrollWidth ? scrollWidth : _this.scrollArgs.width;
+            }
             EventHandler.add(document, Browser.touchMoveEvent, _this.resizing, _this);
             EventHandler.add(document, Browser.touchEndEvent, _this.resizeStop, _this);
         });

package/src/schedule/base/schedule.js

@@ -788,6 +788,7 @@ var Schedule = /** @class */ (function (_super) {
             subject: 'Subject',
             addTitle: 'Add title',
             moreDetails: 'More Details',
+            moreEvents: 'More Events',
             save: 'Save',
             editContent: 'How would you like to change the appointment in the series?',
             deleteContent: 'Are you sure you want to delete this event?',
@@ -822,6 +823,7 @@ var Schedule = /** @class */ (function (_super) {
             ok: 'Ok',
             yes: 'Yes',
             no: 'No',
+            of: 'of',
             occurrence: 'Occurrence',
             series: 'Series',
             previous: 'Previous',
@@ -1393,7 +1395,7 @@ var Schedule = /** @class */ (function (_super) {
             var scheduleId = this.element.id + '_';
             var viewName = this.activeViewOptions.headerIndentTemplateName;
             var templateId = scheduleId + viewName + 'headerIndentTemplate';
-            var indentTemplate = [].slice.call(this.getHeaderIndentTemplate()(data, this, 'headerIndentTemplate', templateId, false));
+            var indentTemplate = [].slice.call(this.getHeaderIndentTemplate()(data, this, 'headerIndentTemplate', templateId, false, undefined, undefined, this.root));
             append(indentTemplate, td);
         }
     };
@@ -1925,8 +1927,9 @@ var Schedule = /** @class */ (function (_super) {
         }
         var msMajorInterval = this.activeViewOptions.timeScale.interval * util.MS_PER_MINUTE;
         var msInterval = msMajorInterval / this.activeViewOptions.timeScale.slotCount;
-        var startIndex = Math.round((startHour.getTime() - viewStartHour.getTime()) / msInterval);
-        var endIndex = Math.ceil((endHour.getTime() - viewStartHour.getTime()) / msInterval);
+        var offsetDiff = ((viewStartHour.getTimezoneOffset() - startHour.getTimezoneOffset()) * util.MS_PER_MINUTE);
+        var startIndex = Math.round((startHour.getTime() - viewStartHour.getTime() + offsetDiff) / msInterval);
+        var endIndex = Math.ceil((endHour.getTime() - viewStartHour.getTime() + offsetDiff) / msInterval);
         var tempStartIndex = startIndex;
         var tempEndIndex = endIndex;
         var cells = [];

package/src/schedule/event-renderer/agenda-base.js

@@ -68,7 +68,7 @@ var AgendaBase = /** @class */ (function (_super) {
                     var scheduleId = _this.parent.element.id + '_';
                     var viewName = _this.parent.activeViewOptions.eventTemplateName;
                     var templateId = scheduleId + viewName + 'eventTemplate';
-                    templateEle = _this.parent.getAppointmentTemplate()(listData[parseInt(li.toString(), 10)], _this.parent, 'eventTemplate', templateId, false);
+                    templateEle = _this.parent.getAppointmentTemplate()(listData[parseInt(li.toString(), 10)], _this.parent, 'eventTemplate', templateId, false, undefined, undefined, _this.parent.root);
                     if (!isNullOrUndefined(listData[parseInt(li.toString(), 10)][fieldMapping.recurrenceRule])) {
                         var iconClass = (listData[parseInt(li.toString(), 10)][fieldMapping.id] ===
                             listData[parseInt(li.toString(), 10)][fieldMapping.recurrenceID]) ?
@@ -372,7 +372,7 @@ var AgendaBase = /** @class */ (function (_super) {
             var scheduleId = this.parent.element.id + '_';
             var viewName = this.parent.activeViewOptions.dateHeaderTemplateName;
             var templateId = scheduleId + viewName + 'dateHeaderTemplate';
-            var dateTemplate = [].slice.call(this.parent.getDateHeaderTemplate()(args, this.parent, 'dateHeaderTemplate', templateId, false));
+            var dateTemplate = [].slice.call(this.parent.getDateHeaderTemplate()(args, this.parent, 'dateHeaderTemplate', templateId, false, undefined, undefined, this.parent.root));
             append(dateTemplate, dateHeader);
         }
         else {

package/src/schedule/event-renderer/event-base.js

@@ -1131,7 +1131,7 @@ var EventBase = /** @class */ (function () {
             var templateId = scheduleId + viewName + 'eventTemplate';
             var templateName = isResourceEventTemplate && this.parent.currentView.indexOf('Year') === -1 ?
                 this.parent.getEventTemplateName(resIndex) : 'eventTemplate';
-            templateElement = this.parent.getAppointmentTemplate()(record, this.parent, templateName, templateId, false);
+            templateElement = this.parent.getAppointmentTemplate()(record, this.parent, templateName, templateId, false, undefined, undefined, this.parent.root);
         }
         else {
             var appointmentSubject = createElement('div', { className: cls.SUBJECT_CLASS });
@@ -1270,7 +1270,9 @@ var EventBase = /** @class */ (function () {
         }
     };
     EventBase.prototype.updateEventMinimumDuration = function (startEndHours, startTime, endTime) {
-        if (startTime.getTime() < endTime.getTime()) {
+        if (startTime.getTime() < endTime.getTime() || (startTime.getTime() === endTime.getTime() &&
+            (startEndHours.startHour.getTime() < endTime.getTime() && startEndHours.endHour.getTime() > startTime.getTime()) &&
+            this.parent.currentView.indexOf('Timeline') === -1)) {
             var eventDuration = (util.getUniversalTime(endTime) - util.getUniversalTime(startTime)) / util.MS_PER_MINUTE;
             if (eventDuration < this.parent.eventSettings.minimumEventDuration) {
                 var tempEnd = new Date(startTime);

package/src/schedule/event-renderer/month.js

@@ -406,7 +406,7 @@ var MonthEvent = /** @class */ (function (_super) {
             var viewName = this.parent.activeViewOptions.eventTemplateName;
             var templateId = scheduleId + viewName + 'eventTemplate';
             var eventTemplate = this.isResourceEventTemplate ? this.parent.getEventTemplateName(resIndex) : 'eventTemplate';
-            templateElement = this.parent.getAppointmentTemplate()(eventObj, this.parent, eventTemplate, templateId, false);
+            templateElement = this.parent.getAppointmentTemplate()(eventObj, this.parent, eventTemplate, templateId, false, undefined, undefined, this.parent.root);
         }
         else {
             var eventLocation = (record[this.fields.location] || this.parent.eventSettings.fields.location.default || '');
@@ -535,6 +535,7 @@ var MonthEvent = /** @class */ (function (_super) {
                         if (indicator) {
                             var count = parseInt(indicator.getAttribute('data-count'), 10) + 1;
                             indicator.setAttribute('data-count', count.toString());
+                            indicator.setAttribute('aria-label', count + ' ' + this.parent.localeObj.getConstant('moreEvents'));
                             indicator.innerHTML = this.getMoreIndicatorText(count);
                         }
                         else {

package/src/schedule/event-renderer/timeline-view.js

@@ -462,8 +462,13 @@ var TimelineEvent = /** @class */ (function (_super) {
         }
     };
     TimelineEvent.prototype.getSameDayEventsWidth = function (startDate, endDate) {
+        var intervalMins = this.interval;
+        if (this.slotsPerDay === 1) {
+            var hoursRange = util.getStartEndHours(util.resetTime(new Date(startDate.getTime())), this.startHour, this.endHour);
+            intervalMins = (hoursRange.endHour.getTime() - hoursRange.startHour.getTime()) / util.MS_PER_MINUTE;
+        }
         return ((util.getUniversalTime(endDate) - util.getUniversalTime(startDate)) /
-            util.MS_PER_MINUTE * (this.cellWidth * this.slotCount) / this.interval);
+            util.MS_PER_MINUTE * (this.cellWidth * this.slotCount) / intervalMins);
     };
     TimelineEvent.prototype.getSpannedEventsWidth = function (startDate, endDate, diffInDays) {
         var width = (diffInDays * this.slotsPerDay) * this.cellWidth;

package/src/schedule/event-renderer/vertical-view.js

@@ -360,7 +360,7 @@ var VerticalEvent = /** @class */ (function (_super) {
             var templateId = elementId + viewName + 'eventTemplate';
             var resIndex = this.parent.uiStateValues.isGroupAdaptive ? this.parent.uiStateValues.groupIndex : resource;
             var templateName = this.isResourceEventTemplate ? this.parent.getEventTemplateName(resIndex) : 'eventTemplate';
-            templateElement = this.parent.getAppointmentTemplate()(record, this.parent, templateName, templateId, false);
+            templateElement = this.parent.getAppointmentTemplate()(record, this.parent, templateName, templateId, false, undefined, undefined, this.parent.root);
         }
         else {
             var appointmentSubject = createElement('div', { className: cls.SUBJECT_CLASS });
@@ -575,7 +575,7 @@ var VerticalEvent = /** @class */ (function (_super) {
         }
         if (eStart <= eEnd && isValidEvent && this.isWorkDayAvailable(resource, eStart)) {
             var appHeight = this.getHeight(eStart, eEnd);
-            if (eStart.getTime() > schedule.startHour.getTime()) {
+            if (eStart.getTime() >= schedule.startHour.getTime()) {
                 topValue = this.getTopValue(eStart, dayIndex, resource);
             }
             var appIndex = this.getOverlapIndex(record, dayIndex, false, resource);
@@ -842,12 +842,12 @@ var VerticalEvent = /** @class */ (function (_super) {
         var rowHeight;
         if (this.parent.uiStateValues.expand) {
             target.setAttribute('title', this.parent.localeObj.getConstant('collapseAllDaySection'));
-            target.setAttribute('aria-label', 'Collapse section');
+            target.setAttribute('aria-label', this.parent.localeObj.getConstant('collapseAllDaySection'));
             rowHeight = ((this.allDayLevel + 1) * this.getEventHeight()) + 4;
         }
         else {
             target.setAttribute('title', this.parent.localeObj.getConstant('expandAllDaySection'));
-            target.setAttribute('aria-label', 'Expand section');
+            target.setAttribute('aria-label', this.parent.localeObj.getConstant('expandAllDaySection'));
             rowHeight = (3 * this.getEventHeight()) + 4;
             this.parent.element.querySelector('.' + cls.DATE_HEADER_WRAP_CLASS).scrollTop = 0;
         }

package/src/schedule/event-renderer/year.js

@@ -479,7 +479,7 @@ var YearEvent = /** @class */ (function (_super) {
         var eventObj = extend({}, record, null, true);
         if (this.parent.activeViewOptions.eventTemplate) {
             var templateId = this.parent.element.id + '_' + this.parent.activeViewOptions.eventTemplateName + 'eventTemplate';
-            templateElement = this.parent.getAppointmentTemplate()(eventObj, this.parent, 'eventTemplate', templateId, false);
+            templateElement = this.parent.getAppointmentTemplate()(eventObj, this.parent, 'eventTemplate', templateId, false, undefined, undefined, this.parent.root);
         }
         else {
             var locationEle = (record[this.fields.location] || this.parent.eventSettings.fields.location.default || '');

package/src/schedule/exports/excel-export.js

@@ -42,7 +42,7 @@ var ExcelExport = /** @class */ (function () {
             fields.forEach(function (field, n) {
                 var columnRule = { index: n + 1, value: event[field.name] || '' };
                 if (field.name === _this.parent.eventFields.startTime || field.name === _this.parent.eventFields.endTime) {
-                    var styleRule = { fontSize: 12, numberFormat: 'm/d/yyyy h:mm AM/PM' };
+                    var styleRule = { fontSize: 12, numberFormat: 'm/d/yyyy h:mm a' };
                     columnRule = extend({}, columnRule, { style: styleRule }, true);
                 }
                 columnData.push(columnRule);

package/src/schedule/exports/print.js

@@ -78,6 +78,7 @@ var Print = /** @class */ (function () {
         Schedule.Inject(Day, Week, WorkWeek, Month, Agenda, MonthAgenda, TimelineViews, TimelineMonth, Year, TimelineYear);
         this.printInstance = new Schedule(this.getPrintScheduleModel(printOptions));
         this.printInstance.isPrinting = true;
+        this.printInstance.root = this.parent.root ? this.parent.root : this.parent;
         this.printInstance.appendTo(element);
         this.printInstance.on(events.print, this.contentReady, this);
         this.printWindow = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');
@@ -111,7 +112,7 @@ var Print = /** @class */ (function () {
                     eventSettings.dataSource = this.parent.eventsData;
                     var eventTemplate = !isNullOrUndefined(printOptions.eventSettings) &&
                         !isNullOrUndefined(printOptions.eventSettings.template) ? printOptions.eventSettings.template : eventSettings.template;
-                    eventSettings.template = typeof (eventTemplate) === 'function' ? null : eventTemplate;
+                    eventSettings.template = !this.parent.isAngular && typeof (eventTemplate) === 'function' ? null : eventTemplate;
                     printModel.eventSettings = eventSettings;
                     break;
                 }
@@ -122,13 +123,15 @@ var Print = /** @class */ (function () {
                     break;
                 case 'timeScale':
                     timeScale = isNullOrUndefined(printOptions.timeScale) ? this.parent.timeScale : printOptions.timeScale;
-                    timeScale.majorSlotTemplate = typeof (timeScale.majorSlotTemplate) === 'function' ? null : timeScale.majorSlotTemplate;
-                    timeScale.minorSlotTemplate = typeof (timeScale.minorSlotTemplate) === 'function' ? null : timeScale.minorSlotTemplate;
-                    printOptions.timeScale = timeScale;
+                    if (!this.parent.isAngular) {
+                        timeScale.majorSlotTemplate = typeof (timeScale.majorSlotTemplate) === 'function' ? null : timeScale.majorSlotTemplate;
+                        timeScale.minorSlotTemplate = typeof (timeScale.minorSlotTemplate) === 'function' ? null : timeScale.minorSlotTemplate;
+                    }
+                    printModel.timeScale = timeScale;
                     break;
                 case 'views':
                     views = isNullOrUndefined(printOptions.views) ? this.parent.views : printOptions.views;
-                    if (views && views.length > 0 && typeof (views[0]) === 'object') {
+                    if (!this.parent.isAngular && views && views.length > 0 && typeof (views[0]) === 'object') {
                         var _loop_1 = function (view) {
                             scheduleTemplates.forEach(function (x) {
                                 if (!isNullOrUndefined(view["" + x])) {
@@ -146,8 +149,8 @@ var Print = /** @class */ (function () {
                 default:
                     if (scheduleTemplates.indexOf(key) > -1) {
                         printModel["" + key] = isNullOrUndefined(printOptions["" + key]) ?
-                            (typeof (this.parent["" + key]) === 'function' ? null : this.parent["" + key]) :
-                            (typeof (printOptions["" + key]) === 'function' ? null : printOptions["" + key]);
+                            (!this.parent.isAngular && typeof (this.parent["" + key]) === 'function' ? null : this.parent["" + key]) :
+                            (!this.parent.isAngular && typeof (printOptions["" + key]) === 'function' ? null : printOptions["" + key]);
                         break;
                     }
                     if (scheduleEvents.indexOf(key) > -1) {

package/src/schedule/popups/quick-popups.js

@@ -325,7 +325,7 @@ var QuickPopups = /** @class */ (function () {
                 var templateElement = void 0;
                 if (!isNullOrUndefined(this_1.parent.activeViewOptions.eventTemplate)) {
                     var tempId = this_1.parent.element.id + '_' + this_1.parent.activeViewOptions.eventTemplateName + 'eventTemplate';
-                    templateElement = this_1.parent.getAppointmentTemplate()(eventData, this_1.parent, 'eventTemplate', tempId, false);
+                    templateElement = this_1.parent.getAppointmentTemplate()(eventData, this_1.parent, 'eventTemplate', tempId, false, undefined, undefined, this_1.parent.root);
                     append(templateElement, appointmentElement);
                 }
                 else {

package/src/schedule/renderer/header-renderer.js

@@ -178,7 +178,7 @@ var HeaderRenderer = /** @class */ (function () {
             };
             var viewName = this.parent.activeViewOptions.dateRangeTemplateName;
             var templateId = this.parent.element.id + '_' + viewName + 'dateRangeTemplate';
-            var dateTemplate = [].slice.call(this.parent.getDateRangeTemplate()(args, this.parent, 'dateRangeTemplate', templateId, false));
+            var dateTemplate = [].slice.call(this.parent.getDateRangeTemplate()(args, this.parent, 'dateRangeTemplate', templateId, false, undefined, undefined, this.parent.root));
             append(dateTemplate, textEle);
         }
         else {

package/src/schedule/renderer/month.js

@@ -347,7 +347,7 @@ var Month = /** @class */ (function (_super) {
                 var elementId = this.parent.element.id + '_';
                 var viewName = this.parent.activeViewOptions.dateHeaderTemplateName;
                 var templateId = elementId + viewName + 'dateHeaderTemplate';
-                var dateTemplate = [].slice.call(this.parent.getDateHeaderTemplate()(cellArgs, this.parent, 'dateHeaderTemplate', templateId, false));
+                var dateTemplate = [].slice.call(this.parent.getDateHeaderTemplate()(cellArgs, this.parent, 'dateHeaderTemplate', templateId, false, undefined, undefined, this.parent.root));
                 if (dateTemplate && dateTemplate.length) {
                     append(dateTemplate, tdEle);
                 }
@@ -523,7 +523,7 @@ var Month = /** @class */ (function (_super) {
             var scheduleId = this.parent.element.id + '_';
             var viewName = this.parent.activeViewOptions.cellTemplateName;
             var templateId = scheduleId + viewName + 'cellTemplate';
-            var cellTemplate = [].slice.call(this.parent.getCellTemplate()(args_1, this.parent, 'cellTemplate', templateId, false));
+            var cellTemplate = [].slice.call(this.parent.getCellTemplate()(args_1, this.parent, 'cellTemplate', templateId, false, undefined, undefined, this.parent.root));
             append(cellTemplate, ntd);
         }
         var args = { elementType: type, element: ntd, date: data.date, groupIndex: data.groupIndex };
@@ -540,7 +540,7 @@ var Month = /** @class */ (function (_super) {
             var scheduleId = this.parent.element.id + '_';
             var viewName = this.parent.activeViewOptions.cellHeaderTemplateName;
             var templateId = scheduleId + viewName + 'cellHeaderTemplate';
-            var cellHeaderTemplate = [].slice.call(this.parent.getCellHeaderTemplate()(args, this.parent, 'cellHeaderTemplate', templateId, false));
+            var cellHeaderTemplate = [].slice.call(this.parent.getCellHeaderTemplate()(args, this.parent, 'cellHeaderTemplate', templateId, false, undefined, undefined, this.parent.root));
             append(cellHeaderTemplate, dateHeader);
         }
         else {
@@ -670,7 +670,8 @@ var Month = /** @class */ (function (_super) {
         return this.formatDateRange(this.parent.selectedDate);
     };
     Month.prototype.getLabelText = function (view) {
-        return this.parent.localeObj.getConstant(view) + ' of ' + util.capitalizeFirstWord(this.parent.globalize.formatDate(this.parent.selectedDate, { format: 'MMMM y', calendar: this.parent.getCalendarMode() }), 'single');
+        var viewStr = view.charAt(0).toLowerCase() + view.substring(1);
+        return this.formatViewLabel(viewStr, this.getStartDate(), this.getEndDate());
     };
     Month.prototype.createWeekNumberElement = function (text) {
         var tr = createElement('tr');

package/src/schedule/renderer/renderer.js

@@ -147,9 +147,15 @@ var Render = /** @class */ (function () {
         }
     };
     Render.prototype.updateLabelText = function (view) {
-        var content = this.parent.activeView.getLabelText(view);
         this.parent.element.setAttribute('role', 'application');
-        this.parent.element.setAttribute('aria-label', content);
+        this.parent.element.removeAttribute('aria-labelledby');
+        this.parent.element.removeAttribute('aria-label');
+        if (view === 'Year') {
+            this.parent.element.setAttribute('aria-label', this.parent.activeView.getLabelText(view));
+        }
+        else {
+            this.parent.element.setAttribute('aria-labelledby', this.parent.element.id + '_table');
+        }
     };
     return Render;
 }());

package/src/schedule/renderer/timeline-year.js

@@ -413,10 +413,10 @@ var TimelineYear = /** @class */ (function (_super) {
         var monthId = "schedule_" + this.parent.activeViewOptions.dayHeaderTemplateName + "monthHeaderTemplate";
         if (type === 'dayHeaderTemplate') {
             args.day = this.parent.getDayNames('wide')[column % 7];
-            return [].slice.call(this.parent.getDayHeaderTemplate()(args, this.parent, 'dayHeaderTemplate', dayId, false));
+            return [].slice.call(this.parent.getDayHeaderTemplate()(args, this.parent, 'dayHeaderTemplate', dayId, false, undefined, undefined, this.parent.root));
         }
         else {
-            return [].slice.call(this.parent.getMonthHeaderTemplate()(args, this.parent, 'monthHeaderTemplate', monthId, false));
+            return [].slice.call(this.parent.getMonthHeaderTemplate()(args, this.parent, 'monthHeaderTemplate', monthId, false, undefined, undefined, this.parent.root));
         }
     };
     TimelineYear.prototype.renderCellTemplate = function (data, td) {
@@ -430,7 +430,7 @@ var TimelineYear = /** @class */ (function (_super) {
         var scheduleId = this.parent.element.id + '_';
         var viewName = this.parent.activeViewOptions.cellTemplateName;
         var templateId = scheduleId + viewName + 'cellTemplate';
-        var cellTemplate = [].slice.call(this.parent.getCellTemplate()(args, this.parent, 'cellTemplate', templateId, false));
+        var cellTemplate = [].slice.call(this.parent.getCellTemplate()(args, this.parent, 'cellTemplate', templateId, false, undefined, undefined, this.parent.root));
         append(cellTemplate, td);
     };
     TimelineYear.prototype.scrollToDate = function (scrollDate) {

package/src/schedule/renderer/vertical-view.d.ts

@@ -56,6 +56,7 @@ export declare class VerticalView extends ViewBase implements IRenderer {
     getScrollableElement(): Element;
     getLeftPanelElement(): HTMLElement;
     getEndDateFromStartDate(start: Date): Date;
+    private getStartEndHours;
     getTimeSlotRows(handler?: CallbackFunction): TimeSlotData[];
     getAdjustedDate(startTime: Date): Date;
     destroy(): void;

package/src/schedule/renderer/vertical-view.js

@@ -387,7 +387,7 @@ var VerticalView = /** @class */ (function (_super) {
                     templateName = 'dateHeaderTemplate';
                     var args = { date: date, type: type };
                     var viewName = this.parent.activeViewOptions.dateHeaderTemplateName;
-                    cntEle = [].slice.call(this.parent.getDateHeaderTemplate()(args, this.parent, templateName, templateId + viewName + templateName, false));
+                    cntEle = [].slice.call(this.parent.getDateHeaderTemplate()(args, this.parent, templateName, templateId + viewName + templateName, false, undefined, undefined, this.parent.root));
                 }
                 else {
                     wrapper.innerHTML = this.parent.activeView.isTimelineView() ?
@@ -401,7 +401,7 @@ var VerticalView = /** @class */ (function (_super) {
                 if (this.parent.activeViewOptions.timeScale.majorSlotTemplate) {
                     templateName = 'majorSlotTemplate';
                     var args = { date: date, type: type };
-                    cntEle = [].slice.call(this.parent.getMajorSlotTemplate()(args, this.parent, templateName, templateId + templateName, false));
+                    cntEle = [].slice.call(this.parent.getMajorSlotTemplate()(args, this.parent, templateName, templateId + templateName, false, undefined, undefined, this.parent.root));
                 }
                 else {
                     wrapper.innerHTML = "<span>" + this.getTime(date) + "</span>";
@@ -412,7 +412,7 @@ var VerticalView = /** @class */ (function (_super) {
                 if (this.parent.activeViewOptions.timeScale.minorSlotTemplate) {
                     templateName = 'minorSlotTemplate';
                     var args = { date: date, type: type };
-                    cntEle = [].slice.call(this.parent.getMinorSlotTemplate()(args, this.parent, templateName, templateId + templateName, false));
+                    cntEle = [].slice.call(this.parent.getMinorSlotTemplate()(args, this.parent, templateName, templateId + templateName, false, undefined, undefined, this.parent.root));
                 }
                 else {
                     cntEle = [].slice.call(wrapper.childNodes);
@@ -423,7 +423,7 @@ var VerticalView = /** @class */ (function (_super) {
                     var viewName = this.parent.activeViewOptions.cellTemplateName;
                     templateName = 'cellTemplate';
                     var args = { date: date, type: type, groupIndex: groupIndex };
-                    cntEle = [].slice.call(this.parent.getCellTemplate()(args, this.parent, templateName, templateId + viewName + templateName, false));
+                    cntEle = [].slice.call(this.parent.getCellTemplate()(args, this.parent, templateName, templateId + viewName + templateName, false, undefined, undefined, this.parent.root));
                 }
                 break;
         }
@@ -542,7 +542,8 @@ var VerticalView = /** @class */ (function (_super) {
         var appointmentExpandCollapse = createElement('div', {
             attrs: {
                 'tabindex': '0', 'role': 'list',
-                title: this.parent.localeObj.getConstant('expandAllDaySection'), 'aria-disabled': 'false', 'aria-label': 'Expand section'
+                title: this.parent.localeObj.getConstant('expandAllDaySection'), 'aria-disabled': 'false',
+                'aria-label': this.parent.localeObj.getConstant('expandAllDaySection')
             },
             className: cls.ALLDAY_APPOINTMENT_SECTION_CLASS + ' ' + cls.APPOINTMENT_ROW_EXPAND_CLASS + ' ' +
                 cls.ICON + ' ' + cls.DISABLE_CLASS
@@ -699,7 +700,7 @@ var VerticalView = /** @class */ (function (_super) {
         if (!this.parent.isMinMaxDate(cellDate)) {
             clsName.push(cls.DISABLE_DATES);
         }
-        util.setTime(cellDate, util.getDateInMs(r.date));
+        cellDate = new Date(cellDate.setHours(r.date.getHours(), r.date.getMinutes(), r.date.getSeconds(), r.date.getMilliseconds()));
         var type = 'workCells';
         if (tdData.className.indexOf(cls.RESOURCE_PARENT_CLASS) !== -1) {
             clsName.push(cls.RESOURCE_GROUP_CELLS_CLASS);
@@ -716,7 +717,7 @@ var VerticalView = /** @class */ (function (_super) {
             var scheduleId = this.parent.element.id + '_';
             var viewName = this.parent.activeViewOptions.cellTemplateName;
             var templateId = scheduleId + viewName + 'cellTemplate';
-            var tooltipTemplate = [].slice.call(this.parent.getCellTemplate()(args_1, this.parent, 'cellTemplate', templateId, false));
+            var tooltipTemplate = [].slice.call(this.parent.getCellTemplate()(args_1, this.parent, 'cellTemplate', templateId, false, undefined, undefined, this.parent.root));
             append(tooltipTemplate, ntd);
         }
         ntd.setAttribute('data-date', cellDate.getTime().toString());
@@ -772,10 +773,21 @@ var VerticalView = /** @class */ (function (_super) {
         end.setMilliseconds(end.getMilliseconds() + msInterval);
         return end;
     };
+    VerticalView.prototype.getStartEndHours = function (startEndTime) {
+        if (!isNullOrUndefined(startEndTime) && startEndTime !== '') {
+            var startEndDate = new Date(2000, 0, 0, 0);
+            var timeString = startEndTime.split(':');
+            if (timeString.length === 2) {
+                startEndDate.setHours(parseInt(timeString[0], 10), parseInt(timeString[1], 10), 0);
+            }
+            return startEndDate;
+        }
+        return new Date(2000, 0, 0, 0);
+    };
     VerticalView.prototype.getTimeSlotRows = function (handler) {
         var rows = [];
-        var startHour = this.getStartHour();
-        var endHour = this.getEndHour();
+        var startHour = this.getStartEndHours(this.parent.activeViewOptions.startHour);
+        var endHour = this.getStartEndHours(this.parent.activeViewOptions.endHour);
         var msMajorInterval = this.parent.activeViewOptions.timeScale.interval * util.MS_PER_MINUTE;
         var msInterval = msMajorInterval / this.parent.activeViewOptions.timeScale.slotCount;
         var length = Math.round(util.MS_PER_DAY / msInterval);

package/src/schedule/renderer/view-base.d.ts

@@ -55,6 +55,7 @@ export declare class ViewBase {
     isWorkHour(date: Date, startHour: Date, endHour: Date, workDays: number[]): boolean;
     getRenderDates(workDays?: number[]): Date[];
     getNextPreviousDate(type: string): Date;
+    formatViewLabel(view: string, startDate: Date, endDate: Date): string;
     getLabelText(view: string): string;
     getDateRangeText(): string;
     formatDateRange(startDate: Date, endDate?: Date): string;

package/src/schedule/renderer/view-base.js

@@ -101,6 +101,9 @@ var ViewBase = /** @class */ (function () {
     };
     ViewBase.prototype.setAriaAttributes = function (table) {
         table.setAttribute('role', 'grid');
+        if (this.parent.currentView !== 'Year') {
+            table.setAttribute('id', this.parent.element.id + '_table');
+        }
         table.setAttribute('aria-label', this.getLabelText(this.parent.currentView));
     };
     ViewBase.prototype.createColGroup = function (table, lastRow) {
@@ -348,9 +351,29 @@ var ViewBase = /** @class */ (function () {
         var weekLength = type === 'next' ? util.WEEK_LENGTH : -util.WEEK_LENGTH;
         return util.addDays(this.parent.selectedDate, weekLength * this.parent.activeViewOptions.interval);
     };
+    ViewBase.prototype.formatViewLabel = function (view, startDate, endDate) {
+        var formatOptions = { type: 'date', skeleton: 'full', calendar: this.parent.getCalendarMode() };
+        return this.parent.localeObj.getConstant(view) + ' ' + this.parent.localeObj.getConstant('start') + ' ' + this.parent.globalize.formatDate(startDate, formatOptions) + ' '
+            + this.parent.localeObj.getConstant('endAt') + ' ' + this.parent.globalize.formatDate(endDate, formatOptions);
+    };
     ViewBase.prototype.getLabelText = function (view) {
         var viewStr = view.charAt(0).toLowerCase() + view.substring(1);
-        return this.parent.localeObj.getConstant(viewStr) + ' of ' + util.capitalizeFirstWord(this.parent.globalize.formatDate(this.parent.selectedDate, { skeleton: 'long', calendar: this.parent.getCalendarMode() }), 'single');
+        if (view === 'Year' || view === 'TimelineYear') {
+            return this.formatViewLabel(viewStr, this.parent.activeView.getStartDate(), this.parent.activeView.getEndDate());
+        }
+        else {
+            if (this.renderDates.length > 0) {
+                if (this.parent.currentView === 'Day' || this.parent.currentView === 'TimelineDay') {
+                    return this.parent.localeObj.getConstant(viewStr) + ' of ' + util.capitalizeFirstWord(this.parent.globalize.formatDate(this.parent.selectedDate, { type: 'date', skeleton: 'full', calendar: this.parent.getCalendarMode() }), 'single');
+                }
+                else {
+                    return this.formatViewLabel(viewStr, this.renderDates[0], this.renderDates[this.renderDates.length - 1]);
+                }
+            }
+            else {
+                return '';
+            }
+        }
     };
     ViewBase.prototype.getDateRangeText = function () {
         if (this.parent.isAdaptive) {
@@ -441,7 +464,7 @@ var ViewBase = /** @class */ (function () {
             var scheduleId = this.parent.element.id + '_';
             var viewName = this.parent.activeViewOptions.resourceHeaderTemplateName;
             var templateId = scheduleId + viewName + 'resourceHeaderTemplate';
-            var quickTemplate = [].slice.call(this.parent.getResourceHeaderTemplate()(data, this.parent, 'resourceHeaderTemplate', templateId, false));
+            var quickTemplate = [].slice.call(this.parent.getResourceHeaderTemplate()(data, this.parent, 'resourceHeaderTemplate', templateId, false, undefined, undefined, this.parent.root));
             append(quickTemplate, tdElement);
         }
         else {

package/src/schedule/renderer/year.js

@@ -280,7 +280,7 @@ var Year = /** @class */ (function (_super) {
     };
     Year.prototype.renderTemplates = function (fn, args, tName, vName, ele) {
         var templateId = this.parent.element.id + '_' + vName + tName;
-        var template = [].slice.call(fn(args, this.parent, tName, templateId, false));
+        var template = [].slice.call(fn(args, this.parent, tName, templateId, false, undefined, undefined, this.parent.root));
         append(template, ele);
     };
     Year.prototype.onCellClick = function (e) {

package/styles/bootstrap-dark.css

@@ -3673,6 +3673,16 @@
   width: 26px;
 }
 
+@media print {
+  .e-schedule .e-table-container {
+    display: block;
+  }
+  .e-schedule .e-vertical-view .e-content-table thead {
+    -webkit-column-break-inside: auto;
+       -moz-column-break-inside: auto;
+            break-inside: auto;
+  }
+}
 .e-bigger .e-more-popup-wrapper,
 .e-more-popup-wrapper {
   background: #1a1a1a;

package/styles/bootstrap.css

@@ -3668,6 +3668,16 @@
   width: 26px;
 }
 
+@media print {
+  .e-schedule .e-table-container {
+    display: block;
+  }
+  .e-schedule .e-vertical-view .e-content-table thead {
+    -webkit-column-break-inside: auto;
+       -moz-column-break-inside: auto;
+            break-inside: auto;
+  }
+}
 .e-bigger .e-more-popup-wrapper,
 .e-more-popup-wrapper {
   background: #fff;

package/styles/bootstrap4.css

@@ -3770,6 +3770,16 @@
   width: 26px;
 }
 
+@media print {
+  .e-schedule .e-table-container {
+    display: block;
+  }
+  .e-schedule .e-vertical-view .e-content-table thead {
+    -webkit-column-break-inside: auto;
+       -moz-column-break-inside: auto;
+            break-inside: auto;
+  }
+}
 .e-bigger .e-more-popup-wrapper,
 .e-more-popup-wrapper {
   background: #fff;