@syncfusion/ej2-schedule 19.4.38 → 19.4.43

package/dist/es6/ej2-schedule.es5.js

@@ -515,6 +515,12 @@ var DATE_HEADER_CONTAINER_CLASS = 'e-date-header-container';
 /** @private */
 var HEADER_CELLS_CLASS = 'e-header-cells';
 /** @private */
+var HEADER_WEEK_CELLS_CLASS = 'e-header-week-cell';
+/** @private */
+var HEADER_MONTH_CELLS_CLASS = 'e-header-month-cell';
+/** @private */
+var HEADER_YEAR_CELLS_CLASS = 'e-header-year-cell';
+/** @private */
 var WORKDAY_CLASS = 'e-work-days';
 /** @private */
 var OTHERMONTH_CLASS = 'e-other-month';
@@ -1290,6 +1296,7 @@ var HeaderRenderer = /** @__PURE__ @class */ (function () {
         var strClass = args.item.cssClass.replace('e-views ', '');
         var data;
         var isSameTime;
+        var currentTime;
         switch (strClass) {
             case 'e-date-range':
                 if (!this.headerPopup) {
@@ -1339,8 +1346,8 @@ var HeaderRenderer = /** @__PURE__ @class */ (function () {
                 this.parent.changeView('TimelineYear', args.originalEvent, undefined, this.calculateViewIndex(args));
                 break;
             case 'e-today':
-                var currentTime = resetTime(this.parent.getCurrentTime());
-                if (this.parent.currentView === 'Agenda' || !this.parent.isSelectedDate(currentTime) ||
+                currentTime = resetTime(this.parent.getCurrentTime());
+                if (this.parent.currentView === 'Agenda' || this.parent.currentView === 'MonthAgenda' || !this.parent.isSelectedDate(currentTime) ||
                     this.parent.currentView === 'Month' && this.parent.activeViewOptions.displayDate && !this.hasSelectedDate() &&
                         resetTime(this.parent.activeViewOptions.displayDate) !== currentTime || this.parent.currentView === 'Month' &&
                     this.parent.activeViewOptions.numberOfWeeks > 0 && !this.hasSelectedDate()
@@ -6305,7 +6312,7 @@ var EventBase = /** @__PURE__ @class */ (function () {
             eventObj[this.parent.eventFields.endTime].getTime() < schedule.endHour.getTime() && start.getTime() === end.getTime();
         return isHourRange || isSameRange;
     };
-    EventBase.prototype.allDayExpandScroll = function (dateHeader, heightPropChanged) {
+    EventBase.prototype.allDayExpandScroll = function (dateHeader) {
         var indentHeight = 0;
         var headerRows = [].slice.call(this.parent.element.querySelectorAll('.' + HEADER_ROW_CLASS));
         headerRows.forEach(function (element) {
@@ -6315,8 +6322,7 @@ var EventBase = /** @__PURE__ @class */ (function () {
         });
         indentHeight = dateHeader.offsetHeight - indentHeight;
         this.parent.element.querySelector('.' + ALLDAY_CELLS_CLASS).style.height = (indentHeight / 12) + 'em';
-        var content = this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS);
-        if (this.parent.uiStateValues.expand && (content.offsetWidth - content.clientWidth > 0 || heightPropChanged || this.parent.element.classList.contains(DEVICE_CLASS))) {
+        if (this.parent.uiStateValues.expand) {
             addClass([dateHeader], ALLDAY_APPOINTMENT_SCROLL);
         }
         else {
@@ -7346,7 +7352,8 @@ var MonthEvent = /** @__PURE__ @class */ (function (_super) {
                 setStyleAttribute(cell, { 'height': height_1 + 'px' });
             });
         }
-        var cellDetail = this.workCells.slice(-1)[0].getBoundingClientRect();
+        var cellDetail = this.workCells[this.parent.activeView.isTimelineView() ?
+            0 : this.workCells.length - 1].getBoundingClientRect();
         this.cellWidth = cellDetail.width;
         this.cellHeight = cellDetail.height;
         this.dateRender = dateRender;
@@ -13372,7 +13379,12 @@ var Render = /** @__PURE__ @class */ (function () {
     };
     Render.prototype.initializeLayout = function (viewName) {
         if (this.parent.activeView) {
-            this.parent.resetTemplates();
+            var templates = [
+                'cellTemplate', 'eventTemplate', 'tooltipTemplate', 'majorSlotTemplate', 'minorSlotTemplate',
+                'headerTooltipTemplate', 'dateHeaderTemplate', 'dayHeaderTemplate', 'mothHeaderTemplate',
+                'headerIndentTemplate', 'resourceHeaderTemplate', 'cellHeaderTemplate'
+            ];
+            this.parent.resetTemplates(templates);
             this.parent.activeView.removeEventListener();
             this.parent.activeView.destroy();
         }
@@ -17194,7 +17206,7 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
             if (dateHeader.classList.contains(ALLDAY_APPOINTMENT_AUTO)) {
                 removeClass([dateHeader], ALLDAY_APPOINTMENT_AUTO);
             }
-            this.eventBase.allDayExpandScroll(dateHeader, true);
+            this.eventBase.allDayExpandScroll(dateHeader);
         }
         if (!this.uiStateValues.expand) {
             allDayRow.style.height = '';
@@ -19048,9 +19060,9 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                 bottom: resizeTarget.classList.contains(BOTTOM_RESIZE_HANDLER)
             };
             _this.actionObj.groupIndex = _this.parent.uiStateValues.isGroupAdaptive ? _this.parent.uiStateValues.groupIndex : 0;
-            var workCell = _this.parent.element.querySelector('.' + WORK_CELLS_CLASS);
-            _this.actionObj.cellWidth = workCell.offsetWidth;
-            _this.actionObj.cellHeight = workCell.offsetHeight;
+            var workCell = _this.parent.element.querySelector('.' + WORK_CELLS_CLASS).getBoundingClientRect();
+            _this.actionObj.cellWidth = workCell.width;
+            _this.actionObj.cellHeight = workCell.height;
             var hRows = _this.parent.activeViewOptions.headerRows.map(function (row) { return row.option; });
             if (_this.parent.activeView.isTimelineView() && hRows.length > 0 && ['Date', 'Hour'].indexOf(hRows.slice(-1)[0]) < 0) {
                 var tr = _this.parent.getContentTable().querySelector('tr');
@@ -19060,8 +19072,9 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                     var td = tdCollections_1[_i];
                     noOfDays += parseInt(td.getAttribute('colspan'), 10);
                 }
-                _this.actionObj.cellWidth = tr.offsetWidth / noOfDays;
-                _this.actionObj.cellHeight = tr.offsetHeight;
+                var trRect = tr.getBoundingClientRect();
+                _this.actionObj.cellWidth = trRect.width / noOfDays;
+                _this.actionObj.cellHeight = trRect.height;
             }
             var pages = _this.getPageCoordinates(e);
             _this.actionObj.X = pages.pageX;
@@ -19312,12 +19325,12 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         var eventEnd = new Date(this.actionObj.event[this.parent.eventFields.endTime].getTime());
         var resizeTime;
         var isDateHeader = false;
+        var headerName = this.parent.currentView;
         var isTimeViews = ['TimelineDay', 'TimelineWeek', 'TimelineWorkWeek'].indexOf(this.parent.currentView) > -1;
         var isTimelineMonth = this.parent.currentView === 'TimelineMonth';
         var isWithoutScale = isTimelineMonth || isTimeViews && !this.parent.activeViewOptions.timeScale.enable;
         if (this.parent.activeView.isTimelineView()) {
             var tr = this.parent.getContentTable().querySelector('tr');
-            var headerName = this.parent.currentView;
             if (this.parent.activeViewOptions.headerRows.length > 0) {
                 var rows = this.parent.activeViewOptions.headerRows.map(function (row) { return row.option; });
                 headerName = rows.slice(-1)[0];
@@ -19329,6 +19342,11 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             var cellIndex = 0;
             var tdCollections = [].slice.call(tr.children);
             var isLastCell = false;
+            var pixelsPerMinute = this.actionObj.cellWidth / (this.parent.activeViewOptions.timeScale.interval /
+                this.parent.activeViewOptions.timeScale.slotCount);
+            var offset = parseFloat(this.parent.enableRtl ? this.actionObj.clone.style.right :
+                this.actionObj.clone.style.left);
+            offset = Math.round(offset / pixelsPerMinute) * pixelsPerMinute;
             if (['Year', 'Month', 'Week', 'Date'].indexOf(headerName) !== -1) {
                 var noOfDays = 0;
                 for (var _i = 0, tdCollections_2 = tdCollections; _i < tdCollections_2.length; _i++) {
@@ -19337,28 +19355,28 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                 }
                 var offsetValue = this.parent.enableRtl ? parseInt(this.actionObj.clone.style.right, 10) :
                     parseInt(this.actionObj.clone.style.left, 10);
+                offsetValue = Math.round(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth;
                 if (!isLeft) {
-                    offsetValue += (this.actionObj.clone.offsetWidth - this.actionObj.cellWidth);
+                    offsetValue += (this.actionObj.clone.getBoundingClientRect().width - this.actionObj.cellWidth);
                 }
-                cellIndex = Math.floor(offsetValue / Math.floor(tr.offsetWidth / noOfDays));
+                cellIndex = Math.floor(offsetValue / Math.floor(tr.getBoundingClientRect().width / noOfDays));
                 isDateHeader = isTimeViews && headerName === 'Date';
-                cellIndex = isLeft ? cellIndex : (isTimelineMonth || isDateHeader) ? cellIndex + 1 : cellIndex;
+                cellIndex = isLeft ? cellIndex : isTimelineMonth ? cellIndex + 1 : cellIndex;
                 isLastCell = cellIndex === tdCollections.length;
                 cellIndex = (cellIndex < 0) ? 0 : (cellIndex >= noOfDays) ? noOfDays - 1 : cellIndex;
             }
             else {
                 var cellWidth = this.actionObj.cellWidth;
-                cellIndex = isLeft ? Math.floor(this.actionObj.clone.offsetLeft / this.actionObj.cellWidth) :
-                    Math.ceil((this.actionObj.clone.offsetLeft + (this.actionObj.clone.offsetWidth - cellWidth)) /
-                        this.actionObj.cellWidth);
+                cellIndex = isLeft ? Math.floor(offset / this.actionObj.cellWidth) :
+                    Math.ceil((offset + (this.actionObj.clone.getBoundingClientRect().width - cellWidth)) / this.actionObj.cellWidth);
                 if (this.parent.enableRtl) {
                     var cellOffsetWidth = 0;
                     if (headerName === 'TimelineMonth' || (!this.parent.activeViewOptions.timeScale.enable &&
                         !isTimelineMonth)) {
                         cellOffsetWidth = this.actionObj.cellWidth;
                     }
-                    var offsetWidth = (Math.floor(parseInt(this.actionObj.clone.style.right, 10) / this.actionObj.cellWidth) *
-                        this.actionObj.cellWidth) + (isLeft ? 0 : this.actionObj.clone.offsetWidth - cellOffsetWidth);
+                    var offsetWidth = (Math.floor(offset / this.actionObj.cellWidth) *
+                        this.actionObj.cellWidth) + (isLeft ? 0 : this.actionObj.clone.getBoundingClientRect().width - cellOffsetWidth);
                     cellIndex = Math.floor(offsetWidth / this.actionObj.cellWidth);
                 }
                 isLastCell = cellIndex === tdCollections.length;
@@ -19376,13 +19394,11 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                 resizeTime = new Date(resizeDate.setHours(resizeTime.getHours(), resizeTime.getMinutes(), resizeTime.getSeconds()));
             }
             else {
-                var offsetValue = this.parent.enableRtl ? parseFloat(this.actionObj.clone.style.right) :
-                    parseFloat(this.actionObj.clone.style.left);
                 if (!isLeft) {
-                    offsetValue += this.actionObj.clone.offsetWidth;
+                    offset += this.actionObj.clone.getBoundingClientRect().width;
                 }
                 var spanMinutes = Math.ceil((this.actionObj.slotInterval / this.actionObj.cellWidth) *
-                    (offsetValue - Math.floor(offsetValue / this.actionObj.cellWidth) * this.actionObj.cellWidth));
+                    (offset - Math.floor(offset / this.actionObj.cellWidth) * this.actionObj.cellWidth));
                 spanMinutes = (isLastCell || (!isLeft && spanMinutes === 0)) ? this.actionObj.slotInterval : spanMinutes;
                 resizeTime = new Date(resizeDate.getTime());
                 resizeTime.setMinutes(resizeTime.getMinutes() + spanMinutes);
@@ -19391,9 +19407,10 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             var cloneIndex = closest(this.actionObj.clone, 'td').cellIndex;
-            var originalWidth = Math.ceil((isLeft ? this.actionObj.element.offsetWidth : 0) / this.actionObj.cellWidth) *
-                this.actionObj.cellWidth;
-            var noOfDays = Math.ceil((this.actionObj.clone.offsetWidth - originalWidth) / this.actionObj.cellWidth);
+            var originalWidth = Math.ceil((isLeft ? this.actionObj.element.getBoundingClientRect().width : 0) /
+                this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            var noOfDays = Math.ceil((this.actionObj.clone.getBoundingClientRect().width - originalWidth) /
+                this.actionObj.cellWidth);
             var tr = closest(this.actionObj.clone, 'tr');
             var dayIndex = isLeft ? cloneIndex - noOfDays : cloneIndex + noOfDays - 1;
             dayIndex = this.getIndex(dayIndex);
@@ -19413,8 +19430,8 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             var isTimeScaleViews = isTimeViews && this.parent.activeViewOptions.timeScale.enable;
-            var resizeEnd = ((!isTimeScaleViews || isDateHeader) && resizeTime.getHours() === 0 && resizeTime.getMinutes() === 0) ?
-                addDays(resizeTime, 1) : resizeTime;
+            var resizeEnd = ((!isTimeScaleViews || isDateHeader || isTimeViews && ['Week', 'Month', 'Year'].indexOf(headerName) > -1)
+                && resizeTime.getHours() === 0 && resizeTime.getMinutes() === 0) ? addDays(resizeTime, 1) : resizeTime;
             if (isWithoutScale && (resizeEnd.getTime() - eventStart.getTime()) <= 0) {
                 resizeEnd = addDays(resetTime(eventStart), 1);
             }
@@ -19451,29 +19468,30 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
         var slotInterval = (this.actionObj.cellWidth / this.actionObj.slotInterval) * this.actionObj.interval;
         var pageWidth = isLeft ? (this.actionObj.X - this.actionObj.pageX) : (this.actionObj.pageX - this.actionObj.X);
         var targetWidth = isTimelineView ?
-            (this.actionObj.element.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth :
-            this.parent.currentView === 'Month' ? this.actionObj.element.offsetWidth :
-                Math.ceil(this.actionObj.element.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            (this.actionObj.element.getBoundingClientRect().width / this.actionObj.cellWidth) * this.actionObj.cellWidth :
+            this.parent.currentView === 'Month' ? this.actionObj.element.getBoundingClientRect().width :
+                Math.ceil(this.actionObj.element.getBoundingClientRect().width / this.actionObj.cellWidth) * this.actionObj.cellWidth;
         var offsetWidth = targetWidth + (Math.ceil(pageWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth);
+        var left = (this.parent.enableRtl) ? parseInt(this.actionObj.element.style.right, 10) : this.actionObj.clone.offsetLeft;
         if (isTimeViews) {
-            offsetWidth = targetWidth + (isLeft ? (Math.ceil(pageWidth / slotInterval) * slotInterval) :
-                (Math.floor(pageWidth / slotInterval) * slotInterval));
+            offsetWidth = targetWidth + (Math.ceil(pageWidth / slotInterval) * slotInterval);
+            offsetWidth = (Math.round((left + offsetWidth) / slotInterval) * slotInterval) - left;
             this.actionObj.event[this.parent.eventFields.isAllDay] = false;
         }
         var width = !isLeft && ((offsetWidth + this.actionObj.clone.offsetLeft > this.scrollArgs.width)) ?
-            this.actionObj.clone.offsetWidth : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
+            this.actionObj.clone.getBoundingClientRect().width : (offsetWidth < this.actionObj.cellWidth) ? offsetWidth : offsetWidth;
         if (this.parent.enableRtl) {
             var rightValue = isTimelineView ? parseInt(this.actionObj.element.style.right, 10) :
                 -(offsetWidth - this.actionObj.cellWidth);
             rightValue = isTimelineView ? rightValue : isLeft ? 0 : rightValue > 0 ? 0 : rightValue;
             if (isTimelineView && !isLeft) {
-                rightValue = Math.ceil((this.actionObj.element.offsetLeft + (this.actionObj.element.offsetWidth +
+                rightValue = Math.ceil((this.actionObj.element.offsetLeft + (this.actionObj.element.getBoundingClientRect().width +
                     (this.actionObj.pageX - this.actionObj.X))) / slotInterval) * slotInterval;
                 rightValue = rightValue < 0 ? Math.abs(rightValue) : -rightValue;
             }
             rightValue = rightValue >= this.scrollArgs.width ? this.scrollArgs.width - this.actionObj.cellWidth : rightValue;
             styles.right = formatUnit(rightValue);
-            width = width + rightValue > this.scrollArgs.width ? this.actionObj.clone.offsetWidth : width;
+            width = width + rightValue > this.scrollArgs.width ? this.actionObj.clone.getBoundingClientRect().width : width;
         }
         else {
             var offsetLeft = isLeft ? this.actionObj.element.offsetLeft - (this.actionObj.X - this.actionObj.pageX) :
@@ -19481,12 +19499,12 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
             if (isTimelineView) {
                 offsetLeft = isLeft ? offsetLeft : parseInt(this.actionObj.clone.style.left, 10);
                 if (this.parent.enableRtl) {
-                    offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.actionObj.clone.offsetWidth) ?
-                        parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
+                    offsetLeft = !isLeft ? (this.actionObj.pageX < this.actionObj.X - this.actionObj.clone.getBoundingClientRect().width)
+                        ? parseInt(this.actionObj.clone.style.right, 10) : offsetLeft : offsetLeft;
                 }
                 else {
-                    offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.actionObj.clone.offsetWidth &&
-                        this.actionObj.clone.offsetWidth === this.actionObj.cellWidth) ?
+                    offsetLeft = isLeft ? (this.actionObj.pageX > this.actionObj.X + this.actionObj.clone.getBoundingClientRect().width &&
+                        this.actionObj.clone.getBoundingClientRect().width === this.actionObj.cellWidth) ?
                         parseInt(this.actionObj.clone.style.left, 10) : offsetLeft : offsetLeft;
                 }
             }
@@ -19496,9 +19514,10 @@ var Resize = /** @__PURE__ @class */ (function (_super) {
                 Math.ceil(Math.abs(offsetLeft) / this.actionObj.cellWidth) * this.actionObj.cellWidth;
             if (offsetLeft < 0) {
                 offsetLeft = 0;
-                width = this.actionObj.clone.offsetWidth;
+                width = this.actionObj.clone.getBoundingClientRect().width;
             }
-            var cloneWidth = Math.ceil(this.actionObj.clone.offsetWidth / this.actionObj.cellWidth) * this.actionObj.cellWidth;
+            var cloneWidth = Math.ceil(this.actionObj.clone.getBoundingClientRect().width / this.actionObj.cellWidth) *
+                this.actionObj.cellWidth;
             if (isLeft) {
                 styles.left = formatUnit(isTimelineView ? offsetLeft : isLeft ? leftValue < 0 ? -offsetLeft :
                     (Math.ceil((targetWidth - cloneWidth) / this.actionObj.cellWidth) * this.actionObj.cellWidth) : offsetLeft);
@@ -21122,9 +21141,9 @@ var DragAndDrop = /** @__PURE__ @class */ (function (_super) {
         if (this.parent.eventDragArea) {
             var targetDate = this.parent.getDateFromElement(e.target);
             if (!isNullOrUndefined(targetDate)) {
-                if (!this.parent.activeViewOptions.timeScale.enable || (this.parent.currentView == "TimelineMonth")) {
+                if (!this.parent.activeViewOptions.timeScale.enable || (this.parent.currentView === 'TimelineMonth')) {
                     var eventSrt = eventObj[this.parent.eventFields.startTime];
-                    eventStart = new Date(eventStart.setHours(eventSrt.getHours(), eventSrt.getMinutes(), eventSrt.getSeconds()));
+                    eventStart = new Date(targetDate.setHours(eventSrt.getHours(), eventSrt.getMinutes(), eventSrt.getSeconds()));
                 }
                 else {
                     eventStart = targetDate;
@@ -21791,7 +21810,7 @@ var ViewBase = /** @__PURE__ @class */ (function () {
         if (this.isTimelineView()) {
             var colElements = this.getColElements();
             var contentBody = this.element.querySelector('.' + CONTENT_TABLE_CLASS + ' tbody');
-            var colWidth_1 = Math.ceil(contentBody.offsetWidth / (colElements.length / 2));
+            var colWidth_1 = (contentBody.getBoundingClientRect().width / (colElements.length / 2));
             colElements.forEach(function (col) { return setStyleAttribute(col, { 'width': formatUnit(colWidth_1) }); });
             if (content.offsetHeight !== content.clientHeight) {
                 var resourceColumn = this.parent.element.querySelector('.' + RESOURCE_COLUMN_WRAP_CLASS);
@@ -21799,9 +21818,11 @@ var ViewBase = /** @__PURE__ @class */ (function () {
                     setStyleAttribute(resourceColumn, { 'height': formatUnit(content.clientHeight) });
                 }
             }
-            var headerCellElements = [].slice.call(this.element.querySelectorAll('.' + HEADER_CELLS_CLASS));
+            var cssClass = "." + HEADER_CELLS_CLASS + ",." + TIME_SLOT_CLASS + ",." + HEADER_WEEK_CELLS_CLASS + ",." + HEADER_MONTH_CELLS_CLASS + ",." + HEADER_YEAR_CELLS_CLASS;
+            var headerCellElements = [].slice.call(this.element.querySelectorAll(cssClass));
             headerCellElements.forEach(function (ele) {
-                var headerCellColSpan = parseInt(ele.getAttribute('colspan'), 10);
+                var colSpan = isNullOrUndefined(ele.getAttribute('colspan')) ? '1' : ele.getAttribute('colspan');
+                var headerCellColSpan = parseInt(colSpan, 10);
                 setStyleAttribute(ele, { 'width': formatUnit(colWidth_1 * headerCellColSpan) });
             });
         }
@@ -23298,8 +23319,9 @@ var Month = /** @__PURE__ @class */ (function (_super) {
         var dates = this.parent.getCurrentViewDates();
         if (dates && dates.length > 0) {
             var selectedTime = resetTime(this.parent.selectedDate).getTime();
+            var weekFirstDate = getWeekFirstDate(dates[dates.length - 1], this.parent.activeViewOptions.firstDayOfWeek);
             return !(selectedTime >= getWeekFirstDate(dates[0], this.parent.activeViewOptions.firstDayOfWeek).getTime() &&
-                selectedTime <= addDays(getWeekFirstDate(dates[dates.length - 1], this.parent.activeViewOptions.firstDayOfWeek), 6).getTime());
+                selectedTime <= addDays(weekFirstDate, 6).getTime());
         }
         return false;
     };
@@ -25429,7 +25451,7 @@ var TimelineYear = /** @__PURE__ @class */ (function (_super) {
                 }
                 else {
                     if (this.parent.monthHeaderTemplate) {
-                        append(this.renderDayMonthHeaderTemplate(date, months[column], 'mothHeaderTemplate'), innerTd);
+                        append(this.renderDayMonthHeaderTemplate(date, months[column], 'monthHeaderTemplate'), innerTd);
                     }
                     else {
                         innerTd.innerHTML = "<span>" + this.getMonthName(date) + "</span>";