@syncfusion/ej2-schedule 19.3.55 → 19.4.38

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

@@ -91,6 +91,7 @@ const cellMouseDown = 'cell-mouse-down';
  * Schedule common utilities
  */
 const WEEK_LENGTH = 7;
+const DEFAULT_WEEKS = 6;
 const MS_PER_DAY = 86400000;
 const MS_PER_MINUTE = 60000;
 /**
@@ -1243,8 +1244,10 @@ class HeaderRenderer {
             enableRtl: this.parent.enableRtl
         });
         const calendarView = this.getCalendarView();
+        const isDisplayDate = this.parent.currentView === 'Month' &&
+            !isNullOrUndefined(this.parent.activeViewOptions.displayDate) && !this.hasSelectedDate();
         this.headerCalendar = new Calendar({
-            value: this.parent.selectedDate,
+            value: isDisplayDate ? this.parent.activeViewOptions.displayDate : this.parent.selectedDate,
             min: this.parent.minDate,
             max: this.parent.maxDate,
             firstDayOfWeek: this.parent.activeViewOptions.firstDayOfWeek,
@@ -1332,8 +1335,13 @@ class HeaderRenderer {
                 this.parent.changeView('TimelineYear', args.originalEvent, undefined, this.calculateViewIndex(args));
                 break;
             case 'e-today':
-                if (this.parent.currentView === 'Agenda' || !this.parent.isSelectedDate(resetTime(this.parent.getCurrentTime()))) {
-                    this.parent.changeDate(resetTime(this.parent.getCurrentTime()), args.originalEvent);
+                const currentTime = resetTime(this.parent.getCurrentTime());
+                if (this.parent.currentView === 'Agenda' || !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()
+                    && resetTime(firstDateOfMonth(this.parent.selectedDate)) !== currentTime) {
+                    this.parent.changeDate(currentTime, args.originalEvent);
                 }
                 break;
             case 'e-prev':
@@ -1368,6 +1376,11 @@ class HeaderRenderer {
             toolbarPopUp.ej2_instances[0].hide({ name: 'SlideUp', duration: 100 });
         }
     }
+    hasSelectedDate() {
+        const selectedTime = resetTime(this.parent.selectedDate).getTime();
+        return selectedTime >= this.parent.activeView.getStartDate().getTime() &&
+            selectedTime <= this.parent.activeView.getEndDate().getTime();
+    }
     getHeaderElement() {
         return this.toolbarObj.element;
     }
@@ -1412,9 +1425,11 @@ class HeaderRenderer {
             lastDate = addDays(firstDate, 7 * this.parent.activeViewOptions.interval);
         }
         if (this.parent.currentView === 'Month') {
-            firstDate = firstDateOfMonth(this.parent.selectedDate);
-            const lastMonthFirstDate = addMonths(firstDate, this.parent.activeViewOptions.interval - 1);
-            lastDate = lastDateOfMonth(lastMonthFirstDate);
+            const isCustomMonth = !isNullOrUndefined(this.parent.activeViewOptions.displayDate) ||
+                this.parent.activeViewOptions.numberOfWeeks > 0;
+            firstDate = isCustomMonth ? this.parent.activeView.getStartDate() : firstDateOfMonth(this.parent.selectedDate);
+            lastDate = isCustomMonth ? this.parent.activeView.getEndDate() :
+                lastDateOfMonth(addMonths(firstDate, this.parent.activeViewOptions.interval - 1));
         }
         if (!isNullOrUndefined(prevNavEle)) {
             this.toolbarObj.enableItems(prevNavEle, firstDate > this.parent.minDate);
@@ -1945,6 +1960,9 @@ class KeyboardInteraction {
         }
         const queryStr = '.' + WORK_CELLS_CLASS + ',.' + ALLDAY_CELLS_CLASS + ',.' + HEADER_CELLS_CLASS;
         const target = closest(e.target, queryStr);
+        if (this.parent.currentView === 'TimelineYear' && target.classList.contains(OTHERMONTH_CLASS)) {
+            return;
+        }
         this.parent.activeCellsData = this.getSelectedElements(target);
         const cellData = {};
         if (this.parent.eventWindow) {
@@ -1968,6 +1986,9 @@ class KeyboardInteraction {
             || this.isPreventAction(e)) {
             return;
         }
+        if (this.parent.currentView === 'TimelineYear' && e.target.classList.contains(OTHERMONTH_CLASS)) {
+            return;
+        }
         const target = e.target;
         if (closest(target, '.' + POPUP_WRAPPER_CLASS)) {
             if (target.classList.contains(QUICK_POPUP_EVENT_DETAILS_CLASS) ||
@@ -2002,11 +2023,16 @@ class KeyboardInteraction {
                 this.parent.notify(inlineClick, inlineArgs);
             }
             else {
-                this.parent.notify(cellClick, args);
+                if (this.parent.currentView === 'Year') {
+                    target.click();
+                }
+                else {
+                    this.parent.notify(cellClick, args);
+                }
             }
             return;
         }
-        if (target.classList.contains(INLINE_SUBJECT_CLASS)) {
+        if (target.classList.contains(INLINE_SUBJECT_CLASS) && this.parent.inlineModule) {
             this.parent.inlineModule.inlineCrudActions(target);
             return;
         }
@@ -2038,7 +2064,9 @@ class KeyboardInteraction {
     }
     getCells(isInverseTable, start, end) {
         const tableEle = this.parent.getContentTable();
-        let cells = [].slice.call(tableEle.querySelectorAll('td'));
+        const isTimelineYear = this.parent.currentView === 'TimelineYear';
+        const query = isTimelineYear && !isInverseTable ? '.' + WORK_CELLS_CLASS + ':not(.' + OTHERMONTH_CLASS + ')' : 'td';
+        let cells = [].slice.call(tableEle.querySelectorAll(query));
         let maxRow = tableEle.rows.length;
         let maxColumn = tableEle.rows[0].cells.length;
         if (start && start.classList.contains(ALLDAY_CELLS_CLASS)) {
@@ -2053,7 +2081,11 @@ class KeyboardInteraction {
         if (isInverseTable) {
             for (let i = 0; i < maxColumn; i++) {
                 for (let j = 0; j < maxRow; j++) {
-                    inverseCells.push(cells[maxColumn * j + i]);
+                    const cell = cells[maxColumn * j + i];
+                    if (isTimelineYear && cell.classList.contains(OTHERMONTH_CLASS)) {
+                        continue;
+                    }
+                    inverseCells.push(cell);
                 }
             }
             startIndex = inverseCells.indexOf(start);
@@ -2075,11 +2107,17 @@ class KeyboardInteraction {
             return;
         }
         this.parent.eventBase.removeSelectedAppointmentClass();
-        if (this.parent.activeView.isTimelineView()) {
+        if (this.parent.activeView.isTimelineView() && this.parent.currentView !== 'TimelineYear') {
             const cell = this.parent.element.querySelector('.' + CONTENT_TABLE_CLASS +
                 ' tr:not(.' + HIDDEN_CLASS + ') .' + WORK_CELLS_CLASS + ':not(.' + RESOURCE_GROUP_CELLS_CLASS + ')');
             this.selectCells(false, cell);
         }
+        else if (this.parent.currentView.indexOf('Year') > -1) {
+            let query = '.' + WORK_CELLS_CLASS + ':not(.' + OTHERMONTH_CLASS + ')' + ':not(.' + RESOURCE_GROUP_CELLS_CLASS + ')';
+            const isVerticalYear = this.parent.currentView === 'TimelineYear' && this.parent.activeViewOptions.orientation === 'Vertical';
+            query += isVerticalYear ? '[data-date="' + this.parent.activeView.startDate().getTime() + '"]' : '';
+            this.selectCells(false, this.parent.element.querySelector(query));
+        }
         else {
             this.selectCells(false, this.parent.getWorkCellElements()[0]);
         }
@@ -2100,13 +2138,21 @@ class KeyboardInteraction {
         let target = (targetCell instanceof Array) ? targetCell.slice(-1)[0] : targetCell;
         if (isMultiple) {
             let initialId;
-            const views = ['Day', 'Week', 'WorkWeek', 'Month', 'TimelineDay', 'TimelineWeek', 'TimelineWorkWeek', 'TimelineMonth'];
+            const views = ['Day', 'Week', 'WorkWeek', 'TimelineDay', 'TimelineWeek', 'TimelineWorkWeek', 'TimelineMonth', 'TimelineYear'];
             const args = { element: targetCell, requestType: 'mousemove', allowMultipleRow: true };
             this.parent.inlineModule.removeInlineAppointmentElement();
             this.parent.trigger(select, args, (selectArgs) => {
                 const allowMultipleRow = (!selectArgs.allowMultipleRow) || (!this.parent.allowMultiRowSelection);
-                if (allowMultipleRow && (views.indexOf(this.parent.currentView) > -1)) {
-                    target = target.parentElement.children[this.initialTarget.cellIndex];
+                if (allowMultipleRow) {
+                    const isTimelineYear = this.parent.currentView === 'TimelineYear';
+                    if (isTimelineYear && this.parent.activeViewOptions.orientation === 'Horizontal' || this.parent.currentView === 'Month') {
+                        const isGroupYear = isTimelineYear && this.parent.activeViewOptions.group.resources.length > 0;
+                        target = isGroupYear ? this.initialTarget :
+                            this.initialTarget.parentElement.children[target.cellIndex];
+                    }
+                    else if (views.indexOf(this.parent.currentView) > -1) {
+                        target = target.parentElement.children[this.initialTarget.cellIndex];
+                    }
                 }
                 let selectedCells = this.getCells(this.isInverseTableSelect(), this.initialTarget, target);
                 if (this.parent.activeViewOptions.group.resources.length > 0) {
@@ -2239,8 +2285,20 @@ class KeyboardInteraction {
             }
         }
     }
+    cancelUpDownAction(isTimelineYear) {
+        const isVerticalYear = isTimelineYear && this.parent.activeViewOptions.orientation === 'Vertical';
+        const isGroup = this.parent.activeViewOptions.group.resources.length > 0;
+        if (isVerticalYear && isGroup || isTimelineYear && this.initialTarget.classList.contains(OTHERMONTH_CLASS)) {
+            return true;
+        }
+        if (this.parent.activeView.isTimelineView() && !isTimelineYear || this.parent.currentView === 'MonthAgenda') {
+            return true;
+        }
+        return false;
+    }
     processUp(e, isMultiple) {
-        if ((isMultiple && (this.parent.activeView.isTimelineView() || this.parent.currentView === 'MonthAgenda'))) {
+        const isTimelineYear = this.parent.currentView === 'TimelineYear';
+        if (isMultiple && this.cancelUpDownAction(isTimelineYear)) {
             return;
         }
         let target = (e.target);
@@ -2263,8 +2321,22 @@ class KeyboardInteraction {
         if (target.classList.contains(WORK_CELLS_CLASS) && !this.parent.element.querySelector('.' + POPUP_OPEN)) {
             const tableRows = this.parent.getTableRows();
             const curRowIndex = tableRows.indexOf(target.parentElement);
-            if (curRowIndex > 0 && curRowIndex < tableRows.length) {
-                this.selectCells(isMultiple, (tableRows[curRowIndex - 1]).cells[target.cellIndex]);
+            let targetCell;
+            if (isTimelineYear && isMultiple && this.parent.activeViewOptions.group.resources.length === 0) {
+                targetCell = this.isInverseTableSelect() ? this.getVerticalUpDownCell(tableRows, target, curRowIndex, true) :
+                    this.getHorizontalUpDownCell(tableRows, target, curRowIndex, true);
+            }
+            if ((curRowIndex > 0 || targetCell) && curRowIndex < tableRows.length) {
+                targetCell = targetCell ? targetCell : (tableRows[curRowIndex - 1]).cells[target.cellIndex];
+                if (this.parent.currentView === 'Year' && targetCell.classList.contains(OTHERMONTH_CLASS)) {
+                    if (this.parent.activeView.getStartDate().getTime() < +targetCell.getAttribute('data-date')) {
+                        targetCell = this.getYearUpDownCell(tableRows, curRowIndex - 1, target.cellIndex, true);
+                    }
+                    else {
+                        return;
+                    }
+                }
+                this.selectCells(isMultiple, targetCell);
             }
         }
         else if (this.parent.currentView === 'Agenda' || this.parent.currentView === 'MonthAgenda') {
@@ -2272,7 +2344,8 @@ class KeyboardInteraction {
         }
     }
     processDown(e, isMultiple) {
-        if (isMultiple && (this.parent.activeView.isTimelineView() || this.parent.currentView === 'MonthAgenda')) {
+        const isTimelineYear = this.parent.currentView === 'TimelineYear';
+        if (isMultiple && this.cancelUpDownAction(isTimelineYear)) {
             return;
         }
         let target = (e.target);
@@ -2295,16 +2368,62 @@ class KeyboardInteraction {
         }
         if (target.classList.contains(WORK_CELLS_CLASS) && !this.parent.element.querySelector('.' + POPUP_OPEN)) {
             const curRowIndex = tableRows.indexOf(target.parentElement);
-            if (curRowIndex >= 0 && curRowIndex < tableRows.length - 1) {
-                this.selectCells(isMultiple, (tableRows[curRowIndex + 1]).cells[target.cellIndex]);
+            let targetCell;
+            if (isTimelineYear && isMultiple && this.parent.activeViewOptions.group.resources.length === 0) {
+                targetCell = this.isInverseTableSelect() ? this.getVerticalUpDownCell(tableRows, target, curRowIndex, false)
+                    : this.getHorizontalUpDownCell(tableRows, target, curRowIndex, false);
+            }
+            if (curRowIndex >= 0 && ((curRowIndex < tableRows.length - 1) || targetCell)) {
+                targetCell = targetCell ? targetCell : (tableRows[curRowIndex + 1]).cells[target.cellIndex];
+                if (this.parent.currentView === 'Year' && targetCell.classList.contains(OTHERMONTH_CLASS)) {
+                    if (this.parent.activeView.getEndDate().getTime() > +targetCell.getAttribute('data-date')) {
+                        targetCell = this.getYearUpDownCell(tableRows, curRowIndex + 1, target.cellIndex, false);
+                    }
+                    else {
+                        return;
+                    }
+                }
+                this.selectCells(isMultiple, targetCell);
             }
         }
         else if (this.parent.currentView === 'Agenda' || this.parent.currentView === 'MonthAgenda') {
             this.selectAppointment(false, target);
         }
     }
+    getYearUpDownCell(tableRows, rowIndex, cellIndex, isUp) {
+        while (tableRows[rowIndex] && tableRows[rowIndex].cells[cellIndex].classList.contains(OTHERMONTH_CLASS)) {
+            rowIndex = rowIndex + (isUp ? -1 : 1);
+        }
+        return tableRows[rowIndex].cells[cellIndex];
+    }
+    // eslint-disable-next-line max-len
+    getHorizontalUpDownCell(tableRows, target, curRowIndex, isUp) {
+        const row = tableRows[curRowIndex + (isUp ? -1 : 1)];
+        let cell = row ? row.cells[target.cellIndex] : target;
+        if (cell.classList.contains(OTHERMONTH_CLASS)) {
+            const workCell = row.querySelector('.' + WORK_CELLS_CLASS + ':not(.' + OTHERMONTH_CLASS + ')');
+            const date = new Date(+workCell.getAttribute('data-date'));
+            const query = '[data-date="' + new Date(date.getFullYear(), date.getMonth() + 1, 0).getTime() + '"]';
+            cell = cell.cellIndex < workCell.cellIndex ? workCell : row.querySelector(query);
+        }
+        return cell;
+    }
+    // eslint-disable-next-line max-len
+    getVerticalUpDownCell(tableRows, target, curRowIndex, isUp) {
+        const hasRow = isUp && curRowIndex > 0 || !isUp && curRowIndex < tableRows.length - 1;
+        let targetCell = hasRow ? tableRows[curRowIndex + (isUp ? -1 : 1)].cells[target.cellIndex] : undefined;
+        if (!targetCell || targetCell.classList.contains(OTHERMONTH_CLASS)) {
+            const column = tableRows[curRowIndex].cells[target.cellIndex - (isUp ? 1 : -1)];
+            if (column) {
+                const dateAttr = +target.getAttribute('data-date') - (isUp ? MS_PER_DAY : -MS_PER_DAY);
+                return this.parent.getContentTable().querySelector('.' + WORK_CELLS_CLASS + '[data-date="' + dateAttr + '"]');
+            }
+            targetCell = target;
+        }
+        return targetCell;
+    }
     processLeftRight(target) {
-        const tableEle = this.parent.getContentTable();
+        const tableEle = (this.parent.currentView === 'Year' ? target.closest('tbody') : this.parent.getContentTable());
         const curRowIndex = target.parentNode.sectionRowIndex;
         const key = {
             element: tableEle,
@@ -2317,8 +2436,9 @@ class KeyboardInteraction {
     getQuickPopupElement() {
         return (this.parent.isAdaptive ? document.body : this.parent.element).querySelector('.' + POPUP_WRAPPER_CLASS);
     }
-    isCancelLeftRightAction(e, isMultiple) {
-        if (this.parent.currentView === 'Agenda' || (isMultiple && this.parent.currentView === 'MonthAgenda')) {
+    isCancelLeftRightAction(e, isMultiple, isTimelineYear) {
+        const prevent = this.parent.currentView === 'MonthAgenda' || isTimelineYear && this.initialTarget.classList.contains(OTHERMONTH_CLASS);
+        if (this.parent.currentView === 'Agenda' || (isMultiple && prevent)) {
             return true;
         }
         if (this.isPreventAction(e) && isMultiple) {
@@ -2332,7 +2452,8 @@ class KeyboardInteraction {
         return false;
     }
     processRight(e, isMultiple) {
-        if (this.isCancelLeftRightAction(e, isMultiple)) {
+        const isTimelineYear = this.parent.currentView === 'TimelineYear';
+        if (this.isCancelLeftRightAction(e, isMultiple, isTimelineYear)) {
             return;
         }
         const selectedCells = this.parent.getSelectedElements();
@@ -2353,24 +2474,36 @@ class KeyboardInteraction {
         if (target.classList.contains(WORK_CELLS_CLASS) &&
             (e.target).classList.contains(WORK_CELLS_CLASS)) {
             const key = this.processLeftRight(target);
-            if (key.columnIndex >= 0 && key.columnIndex < key.maxIndex - 1) {
+            const targetDate = new Date(+target.getAttribute('data-date'));
+            const isMonthEnd = this.parent.currentView === 'Year' && targetDate.getTime() === lastDateOfMonth(targetDate).getTime();
+            if (key.columnIndex >= 0 && key.columnIndex < key.maxIndex - 1 && !isMonthEnd) {
                 targetCell = this.calculateNextPrevDate(target, key.element.rows[key.rowIndex].cells[target.cellIndex + 1], 'right');
+                if (isTimelineYear && isMultiple && targetCell.classList.contains(OTHERMONTH_CLASS)) {
+                    targetCell = this.getTimelineYearTargetCell(key, target, true);
+                }
                 if (!isNullOrUndefined(targetCell)) {
                     this.selectCells(isMultiple, targetCell);
                 }
             }
-            else if (key.columnIndex === key.maxIndex - 1) {
-                if (!this.isInverseTableSelect() && key.rowIndex < key.element.rows.length - 1) {
+            else if (key.columnIndex === key.maxIndex - 1 || isMonthEnd) {
+                if (!this.isInverseTableSelect() && key.rowIndex < key.element.rows.length - 1 && !isMonthEnd) {
                     targetCell = this.calculateNextPrevDate(target, key.element.rows[key.rowIndex + 1].cells[0], 'right');
+                    const changeTargetCell = isTimelineYear && isMultiple && targetCell.classList.contains(OTHERMONTH_CLASS);
+                    targetCell = changeTargetCell ? this.getHorizontalLeftRightCell(key, target, true) : targetCell;
                     if (!isNullOrUndefined(targetCell)) {
                         this.selectCells(isMultiple, targetCell);
                     }
                 }
                 else if (!isMultiple) {
+                    if (isMonthEnd && targetDate.getTime() !== this.parent.activeView.getEndDate().getTime()) {
+                        this.selectCells(isMultiple, this.parent.element.querySelector(':not(.' + OTHERMONTH_CLASS + ')[data-date="' + (targetDate.getTime() + MS_PER_DAY) + '"]'));
+                        return;
+                    }
                     const rowIndex = this.isInverseTableSelect() ? key.rowIndex : 0;
                     this.parent.changeDate(this.parent.activeView.getNextPreviousDate('next'), e);
                     const tableEle = this.parent.getContentTable();
-                    this.selectCells(false, tableEle.rows[rowIndex].cells[0]);
+                    const cell = isMonthEnd ? tableEle.rows[rowIndex].querySelector('.' + WORK_CELLS_CLASS + ':not(.' + OTHERMONTH_CLASS + ')') : tableEle.rows[rowIndex].cells[0];
+                    this.selectCells(false, cell);
                 }
             }
         }
@@ -2389,7 +2522,8 @@ class KeyboardInteraction {
         }
     }
     processLeft(e, isMultiple) {
-        if (this.isCancelLeftRightAction(e, isMultiple)) {
+        const isTimelineYear = this.parent.currentView === 'TimelineYear';
+        if (this.isCancelLeftRightAction(e, isMultiple, isTimelineYear)) {
             return;
         }
         let target = (e.target);
@@ -2410,24 +2544,40 @@ class KeyboardInteraction {
         if ((e.target).classList.contains(WORK_CELLS_CLASS) &&
             target.classList.contains(WORK_CELLS_CLASS)) {
             const key = this.processLeftRight(target);
-            if (key.columnIndex > 0 && key.columnIndex < key.maxIndex) {
+            const targetDate = new Date(+target.getAttribute('data-date'));
+            const isMonthStart = this.parent.currentView === 'Year' && targetDate.getTime() === firstDateOfMonth(targetDate).getTime();
+            if (key.columnIndex > 0 && key.columnIndex < key.maxIndex && !isMonthStart) {
                 targetCell = this.calculateNextPrevDate(target, key.element.rows[key.rowIndex].cells[target.cellIndex - 1], 'left');
+                if (isTimelineYear && isMultiple && targetCell.classList.contains(OTHERMONTH_CLASS)) {
+                    targetCell = this.getTimelineYearTargetCell(key, target, false);
+                }
                 if (!isNullOrUndefined(targetCell)) {
                     this.selectCells(isMultiple, targetCell);
                 }
             }
-            else if (key.columnIndex === 0) {
+            else if (key.columnIndex === 0 || isMonthStart) {
                 if (!this.isInverseTableSelect() && key.rowIndex > 0) {
                     targetCell = this.calculateNextPrevDate(target, key.element.rows[key.rowIndex - 1].cells[key.maxIndex - 1], 'left');
+                    const otherMonthCell = isTimelineYear && isMultiple && targetCell.classList.contains(OTHERMONTH_CLASS);
+                    targetCell = otherMonthCell ? this.getHorizontalLeftRightCell(key, target, false) : targetCell;
                     if (!isNullOrUndefined(targetCell)) {
                         this.selectCells(isMultiple, targetCell);
                     }
                 }
                 else if (!isMultiple) {
+                    if (isMonthStart && targetDate.getTime() !== this.parent.activeView.getStartDate().getTime()) {
+                        this.selectCells(isMultiple, this.parent.element.querySelector('[data-date="' + (targetDate.getTime() - MS_PER_DAY) + '"]'));
+                        return;
+                    }
                     this.parent.changeDate(this.parent.activeView.getNextPreviousDate('previous'), e);
                     const tableEle = this.parent.getContentTable();
                     const rowIndex = this.isInverseTableSelect() ? key.rowIndex : tableEle.rows.length - 1;
-                    this.selectCells(false, tableEle.rows[rowIndex].cells[key.maxIndex - 1]);
+                    let cell = tableEle.rows[rowIndex].cells[key.maxIndex - 1];
+                    if (isMonthStart) {
+                        const tbody = this.parent.element.querySelectorAll('.' + CONTENT_TABLE_CLASS + ' tbody');
+                        cell = tbody.item(tbody.length - 1).querySelector(':not(.' + OTHERMONTH_CLASS + ')[data-date="' + this.parent.activeView.getEndDate().getTime() + '"]');
+                    }
+                    this.selectCells(false, cell);
                 }
             }
         }
@@ -2445,6 +2595,29 @@ class KeyboardInteraction {
             }
         }
     }
+    getTimelineYearTargetCell(key, target, isRight) {
+        return this.isInverseTableSelect() ? this.getVerticalLeftRightCell(target, isRight) :
+            this.getHorizontalLeftRightCell(key, target, isRight);
+    }
+    getHorizontalLeftRightCell(key, target, isRight) {
+        const row = key.element.rows[target.parentNode.sectionRowIndex + (isRight ? 1 : -1)];
+        if (row) {
+            const query = isRight ? '.' + WORK_CELLS_CLASS + ':not(.' + OTHERMONTH_CLASS + ')'
+                : '[data-date="' + ((+target.getAttribute('data-date')) - MS_PER_DAY) + '"]';
+            return row.querySelector(query);
+        }
+        return target;
+    }
+    getVerticalLeftRightCell(target, isRight) {
+        const date = new Date(+target.getAttribute('data-date'));
+        const start = new Date(date.getFullYear(), date.getMonth() + (isRight ? 1 : -1), 1);
+        const tableEle = this.parent.getContentTable();
+        const targetCell = tableEle.querySelector('[data-date="' + start.getTime() + '"]');
+        if (targetCell.parentNode.sectionRowIndex > target.parentNode.sectionRowIndex) {
+            return targetCell;
+        }
+        return tableEle.querySelector('[data-date="' + new Date(start.getFullYear(), start.getMonth() + 1, 0).getTime() + '"]');
+    }
     calculateNextPrevDate(currentCell, target, type) {
         const initialId = this.initialTarget.getAttribute('data-group-index');
         if (this.parent.activeViewOptions.group.resources.length > 0 && this.parent.currentView === 'Month') {
@@ -2488,6 +2661,16 @@ class KeyboardInteraction {
     }
     processTab(e, isReverse) {
         let target = e.target;
+        if (target.classList.contains(INLINE_SUBJECT_CLASS) && this.parent.inlineModule) {
+            target = target.closest('.e-appointment');
+            this.parent.inlineModule.inlineCrudActions(e.target);
+        }
+        if (this.parent.currentView === 'TimelineYear' && target.classList.contains(OTHERMONTH_CLASS)) {
+            if (target.classList.contains(SELECTED_CELL_CLASS)) {
+                this.parent.removeSelectedClass();
+            }
+            return;
+        }
         const popupWrapper = closest(target, '.' + POPUP_WRAPPER_CLASS + ',.' + MORE_POPUP_WRAPPER_CLASS);
         if (popupWrapper && popupWrapper.classList.contains(POPUP_OPEN)) {
             if (popupWrapper.classList.contains(MORE_POPUP_WRAPPER_CLASS)) {
@@ -2529,7 +2712,9 @@ class KeyboardInteraction {
         }
         if (target.classList.contains(APPOINTMENT_CLASS)) {
             let appElements = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_CLASS));
-            if (this.parent.activeView.isTimelineView() && this.parent.activeViewOptions.group.resources.length > 0) {
+            const isTimelineYear = this.parent.currentView === 'TimelineYear';
+            const isTimeline = this.parent.activeView.isTimelineView() && !isTimelineYear;
+            if ((isTimeline || isTimelineYear && this.parent.activeViewOptions.orientation === 'Vertical') && this.parent.activeViewOptions.group.resources.length > 0) {
                 const index = parseInt(target.getAttribute('data-group-index'), 10);
                 appElements = [].slice.call(this.parent.element.querySelectorAll(`.${APPOINTMENT_CLASS}[data-group-index="${index}"]`));
                 const resCellSelector = `.${RESOURCE_CELLS_CLASS}[data-group-index="${isReverse ? index : index + 1}"]`;
@@ -2578,7 +2763,6 @@ class KeyboardInteraction {
             this.processTabOnResourceCells(target, isReverse);
         }
     }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     processDelete(e) {
         let activeEle = document.activeElement;
         if (this.parent.currentView === 'MonthAgenda') {
@@ -5579,7 +5763,8 @@ class EventBase {
     }
     eventClick(eventData) {
         const target = eventData.target;
-        if (target.classList.contains(DRAG_CLONE_CLASS) || target.classList.contains(RESIZE_CLONE_CLASS)) {
+        if (target.classList.contains(DRAG_CLONE_CLASS) || target.classList.contains(RESIZE_CLONE_CLASS) ||
+            target.classList.contains(INLINE_SUBJECT_CLASS)) {
             return;
         }
         if ((eventData.ctrlKey || eventData.metaKey) && eventData.which === 1 && this.parent.keyboardInteractionModule) {
@@ -6028,13 +6213,28 @@ class EventBase {
         indentHeight = dateHeader.offsetHeight - indentHeight;
         this.parent.element.querySelector('.' + ALLDAY_CELLS_CLASS).style.height = (indentHeight / 12) + 'em';
         const content = this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS);
-        if (this.parent.uiStateValues.expand && (content.offsetWidth - content.clientWidth > 0 || heightPropChanged)) {
+        if (this.parent.uiStateValues.expand && (content.offsetWidth - content.clientWidth > 0 || heightPropChanged || this.parent.element.classList.contains(DEVICE_CLASS))) {
             addClass([dateHeader], ALLDAY_APPOINTMENT_SCROLL);
         }
         else {
             removeClass([dateHeader], ALLDAY_APPOINTMENT_SCROLL);
         }
     }
+    updateEventMinimumDuration(startEndHours, startTime, endTime) {
+        const eventDuration = (getUniversalTime(endTime) - getUniversalTime(startTime)) / MS_PER_MINUTE;
+        if (eventDuration < this.parent.eventSettings.minimumEventDuration) {
+            const tempEnd = new Date(startTime);
+            tempEnd.setMinutes(tempEnd.getMinutes() + this.parent.eventSettings.minimumEventDuration);
+            endTime = tempEnd;
+            if (endTime.getTime() > startEndHours.endHour.getTime()) {
+                const tempStart = new Date(startEndHours.endHour.getTime());
+                tempStart.setMinutes(tempStart.getMinutes() - this.parent.eventSettings.minimumEventDuration);
+                startTime = tempStart;
+                endTime = startEndHours.endHour;
+            }
+        }
+        return { startDate: startTime, endDate: endTime };
+    }
     unWireEvents() {
         const appElements = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_CLASS));
         for (const element of appElements) {
@@ -6436,18 +6636,21 @@ class VerticalEvent extends EventBase {
         if (currentDay.length === 0) {
             currentDate = resetTime(renderedDate[0]);
         }
-        const fieldMapping = this.parent.eventFields;
-        const startEndHours = getStartEndHours(currentDate, this.startHour, this.endHour);
+        const field = this.parent.eventFields;
+        const schedule = getStartEndHours(currentDate, this.startHour, this.endHour);
         const event = extend({}, record, null, true);
         event.isSpanned = { isBottom: false, isTop: false };
-        if (record[fieldMapping.startTime].getTime() < startEndHours.startHour.getTime()) {
-            event[fieldMapping.startTime] = startEndHours.startHour;
+        if (record[field.startTime].getTime() < schedule.startHour.getTime()) {
+            event[field.startTime] = schedule.startHour;
             event.isSpanned.isTop = true;
         }
-        if (record[fieldMapping.endTime].getTime() > startEndHours.endHour.getTime()) {
-            event[fieldMapping.endTime] = startEndHours.endHour;
+        if (record[field.endTime].getTime() > schedule.endHour.getTime()) {
+            event[field.endTime] = schedule.endHour;
             event.isSpanned.isBottom = true;
         }
+        const eventDates = this.updateEventMinimumDuration(schedule, event[field.startTime], event[field.endTime]);
+        event[field.startTime] = eventDates.startDate;
+        event[field.endTime] = eventDates.endDate;
         return event;
     }
     renderAllDayEvents(eventObj, dayIndex, resource, dayCount, inline) {
@@ -6981,7 +7184,7 @@ class MonthEvent extends EventBase {
         this.cellHeight = cellDetail.height;
         this.dateRender = dateRender;
         const filteredDates = this.getRenderedDates(dateRender);
-        this.getSlotDates(workDays);
+        this.getSlotDates(workDays || this.parent.activeViewOptions.workDays);
         this.processBlockEvents(blockList, resIndex, resData);
         for (const event of eventsList) {
             if (this.parent.resourceBase && !resData) {
@@ -7607,6 +7810,10 @@ class TimelineEvent extends MonthEvent {
         const eventData = event.data;
         startTime = this.getStartTime(event, eventData);
         endTime = this.getEndTime(event, eventData);
+        const startEndHours = getStartEndHours(event[this.fields.startTime], this.startHour, this.endHour);
+        const eventDates = this.updateEventMinimumDuration(startEndHours, startTime, endTime);
+        startTime = eventDates.startDate;
+        endTime = eventDates.endDate;
         this.day = this.parent.getIndexOfDate(this.dateRender, resetTime(new Date(startTime.getTime())));
         if (this.day < 0) {
             return;
@@ -7993,11 +8200,11 @@ class InlineEdit {
         if (this.parent.quickPopup) {
             this.parent.quickPopup.quickPopupHide();
         }
-        const moreWrapper = this.parent.element.querySelector('.e-more-popup-wrapper ');
-        if (moreWrapper && moreWrapper.classList.contains(POPUP_OPEN)) {
-            this.parent.quickPopup.morePopup.hide();
-        }
         if (args.type === 'Cell') {
+            const moreWrapper = this.parent.element.querySelector('.' + MORE_POPUP_WRAPPER_CLASS);
+            if (moreWrapper && moreWrapper.classList.contains(POPUP_OPEN)) {
+                this.parent.quickPopup.morePopup.hide();
+            }
             this.removeInlineAppointmentElement();
             this.cellEdit(args);
         }
@@ -8060,8 +8267,8 @@ class InlineEdit {
                     '.e-inner-wrap' : '.e-appointment-details';
                 args.element.querySelector(elementSelector).insertBefore(inlineSubject, timeEle);
             }
+            inlineSubject.focus();
         }
-        inlineSubject.focus();
         inlineSubject.setSelectionRange(subject.length, subject.length);
     }
     createVerticalViewInline(saveObj, dayIndex, resIndex, daysCount) {
@@ -8155,6 +8362,9 @@ class InlineEdit {
         if (target && target.value !== '') {
             this.inlineCrudActions(target);
         }
+        else {
+            this.removeInlineAppointmentElement();
+        }
     }
     inlineCrudActions(target) {
         if (closest(target, '.' + INLINE_APPOINTMENT_CLASS)) {
@@ -9188,6 +9398,9 @@ class QuickPopups {
     }
     closeClick(event) {
         this.dialogEvent = event;
+        if (this.parent.currentView === 'Year' && this.parent.activeCellsData && this.parent.activeCellsData.element) {
+            this.parent.selectCell(this.parent.activeCellsData.element);
+        }
         this.quickPopupHide();
         this.morePopup.hide();
     }
@@ -9771,6 +9984,7 @@ const INTERVALCLASS = 'e-interval';
 const DAYWRAPPER = 'e-days';
 const WEEKWRAPPER = 'e-non-week';
 const WEEKPOSITION = 'e-week-position';
+const DAYPOSITION = 'e-day-position';
 const YEAREXPANDERWRAPPER = 'e-year-expander';
 const YEAREXPANDERELEMENT = 'e-year-expander-element';
 const MONETHEXPANDERWRAPPER = 'e-month-expander';
@@ -10115,7 +10329,6 @@ let RecurrenceEditor = class RecurrenceEditor extends Component {
             }
         });
         this.endType.appendTo(this.element.querySelector('.' + ENDONELEMENT));
-        // eslint-disable-next-line @typescript-eslint/ban-types
         const renderDropDownList = (dropDownData) => {
             return new DropDownList({
                 dataSource: dropDownData,
@@ -10477,7 +10690,7 @@ let RecurrenceEditor = class RecurrenceEditor extends Component {
             '<td><div class="' + INPUTWARAPPER + ' ' + WEEKPOSITION + '" >' +
             '<input type="text" tabindex="0" class="' + MONTHPOS + '"title="' + this.localeObj.getConstant('monthPosition') + '" />' +
             '</div></td>' +
-            '<td><div class="' + INPUTWARAPPER + '" style="min-width: 120px;">' +
+            '<td><div class="' + INPUTWARAPPER + ' ' + DAYPOSITION + '">' +
             '<input type="text" tabindex="0" class="' + MONTHWEEK + '"title="' + this.localeObj.getConstant('monthWeek') + '" />' +
             '</div></td></tr></table>' +
             '</div></div>' +
@@ -13927,12 +14140,15 @@ __decorate$6([
 __decorate$6([
     Property(false)
 ], EventSettings.prototype, "enableTooltip", void 0);
-__decorate$6([
-    Property()
-], EventSettings.prototype, "tooltipTemplate", void 0);
 __decorate$6([
     Property('AllDayRow')
 ], EventSettings.prototype, "spannedEventPlacement", void 0);
+__decorate$6([
+    Property(1)
+], EventSettings.prototype, "minimumEventDuration", void 0);
+__decorate$6([
+    Property()
+], EventSettings.prototype, "tooltipTemplate", void 0);
 __decorate$6([
     Property()
 ], EventSettings.prototype, "resourceColorField", void 0);
@@ -14381,6 +14597,7 @@ class ResourceBase {
             targetType: 'relative',
             actionOnScroll: 'none',
             content: this.treeViewObj.element,
+            relateTo: this.parent.element.querySelector('.' + TABLE_CONTAINER_CLASS),
             enableRtl: this.parent.enableRtl,
             hideAnimation: { name: 'SlideLeftOut', duration: 500 },
             showAnimation: { name: 'SlideLeftIn', duration: 500 },
@@ -15279,13 +15496,19 @@ let Schedule = class Schedule extends Component {
             timeFormat: this.internalTimeFormat,
             group: group,
             headerRows: this.headerRows,
-            orientation: 'Horizontal'
+            orientation: 'Horizontal',
+            numberOfWeeks: 0,
+            displayDate: null
         };
         const viewOptions = this.viewCollections[this.viewIndex];
         const viewsData = extend(scheduleOptions, viewOptions, undefined, true);
         if (this.firstDayOfWeek !== 0 && viewOptions.firstDayOfWeek && this.firstDayOfWeek !== viewOptions.firstDayOfWeek) {
             viewsData.firstDayOfWeek = this.firstDayOfWeek;
         }
+        if (viewsData.displayDate) {
+            viewsData.displayDate = viewsData.displayDate instanceof Date ? new Date(viewsData.displayDate.getTime()) :
+                new Date(viewsData.displayDate);
+        }
         return viewsData;
     }
     initializeDataModule() {
@@ -15592,7 +15815,7 @@ let Schedule = class Schedule extends Component {
         if (this && isNullOrUndefined(this.uiStateValues) || !(this.enablePersistence)) {
             this.uiStateValues = {
                 expand: false, isInitial: true, left: 0, top: 0, isGroupAdaptive: false,
-                isIgnoreOccurrence: false, groupIndex: 0, action: false, isBlock: false
+                isIgnoreOccurrence: false, groupIndex: 0, action: false, isBlock: false, isCustomMonth: true
             };
         }
         this.activeCellsData = { startTime: this.getCurrentTime(), endTime: this.getCurrentTime(), isAllDay: false };
@@ -16556,6 +16779,7 @@ let Schedule = class Schedule extends Component {
                     }
                     break;
                 case 'spannedEventPlacement':
+                case 'minimumEventDuration':
                 case 'enableMaxHeight':
                 case 'enableIndicator':
                     this.refreshEvents(false);
@@ -16928,7 +17152,7 @@ let Schedule = class Schedule extends Component {
      */
     exportToExcel(excelExportOptions) {
         if (this.excelExportModule) {
-            this.excelExportModule.initializeExcelExport(excelExportOptions || {});
+            this.excelExportModule.initializeExcelExport(excelExportOptions);
         }
         else {
             throw Error('Inject ExcelExport module');
@@ -17112,6 +17336,9 @@ let Schedule = class Schedule extends Component {
             this.crudModule.refreshDataManager();
         }
         else {
+            if (this.activeViewOptions && this.activeViewOptions.eventTemplate) {
+                this.resetTemplates(['eventTemplate']);
+            }
             const eventsData = this.eventsData || [];
             const blockData = this.blockData || [];
             const data = eventsData.concat(blockData);
@@ -17366,6 +17593,7 @@ let Schedule = class Schedule extends Component {
             this.eventTooltip = null;
         }
         this.destroyPopups();
+        this.hideSpinner();
         this.unWireEvents();
         this.destroyHeaderModule();
         if (this.eventTooltip) {
@@ -19117,7 +19345,7 @@ class YearEvent extends TimelineEvent {
                 }
             }
             else {
-                if (((resetTime(appStart).getTime() <= dateStart) && (resetTime(appEnd).getTime() > dateStart)) ||
+                if (((resetTime(appStart).getTime() <= dateStart) && (resetTime(appEnd).getTime() >= dateStart)) ||
                     (resetTime(appStart).getTime() >= dateStart) && (resetTime(appEnd).getTime() <= dateEnd)) {
                     appointmentsList.push(app);
                 }
@@ -19295,7 +19523,9 @@ class DragAndDrop extends ActionBase {
         const eventGuid = this.actionObj.element.getAttribute('data-guid');
         this.actionObj.event = this.parent.eventBase.getEventByGuid(eventGuid);
         const eventObj = extend({}, this.actionObj.event, null, true);
-        this.startTime = eventObj[this.parent.eventFields.startTime].getTime();
+        if (!isNullOrUndefined(eventObj)) {
+            this.startTime = eventObj[this.parent.eventFields.startTime].getTime();
+        }
         const dragArgs = {
             cancel: false,
             data: eventObj,
@@ -19712,7 +19942,7 @@ class DragAndDrop extends ActionBase {
             return;
         }
         const td = tr.children[colIndex];
-        if (this.parent.activeViewOptions.group.resources.length > 0) {
+        if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
             this.actionObj.groupIndex = parseInt(td.getAttribute('data-group-index'), 10);
         }
         let dragStart$$1;
@@ -19978,7 +20208,7 @@ class DragAndDrop extends ActionBase {
         const renderDates = this.getRenderedDates();
         const events = this.parent.eventBase.splitEvent(event, renderDates);
         let query = `.e-all-day-cells[data-date="${events[0][this.parent.eventFields.startTime].getTime()}"]`;
-        if (this.parent.activeViewOptions.group.resources.length > 0) {
+        if (this.parent.activeViewOptions.group.resources.length > 0 && !this.parent.uiStateValues.isGroupAdaptive) {
             query = query.concat('[data-group-index = "' + this.actionObj.groupIndex + '"]');
         }
         const cell = [].slice.call(this.parent.element.querySelectorAll(query));
@@ -20176,7 +20406,13 @@ class DragAndDrop extends ActionBase {
         if (this.parent.eventDragArea) {
             const targetDate = this.parent.getDateFromElement(e.target);
             if (!isNullOrUndefined(targetDate)) {
-                eventStart = targetDate;
+                if (!this.parent.activeViewOptions.timeScale.enable || (this.parent.currentView == "TimelineMonth")) {
+                    const eventSrt = eventObj[this.parent.eventFields.startTime];
+                    eventStart = new Date(eventStart.setHours(eventSrt.getHours(), eventSrt.getMinutes(), eventSrt.getSeconds()));
+                }
+                else {
+                    eventStart = targetDate;
+                }
             }
         }
         const eventEnd = new Date(eventStart.getTime());
@@ -20605,6 +20841,10 @@ class ViewBase {
         return date.setHours(0, 0, 0, 0) === this.parent.getCurrentTime().setHours(0, 0, 0, 0);
     }
     isCurrentMonth(date) {
+        if (this.parent.activeViewOptions.displayDate || this.parent.activeViewOptions.numberOfWeeks > 0) {
+            return this.parent.activeView.getStartDate().getTime() <= this.parent.getCurrentTime().getTime() &&
+                this.parent.activeView.getEndDate().getTime() >= this.parent.getCurrentTime().getTime();
+        }
         return date.getFullYear() ===
             this.parent.getCurrentTime().getFullYear() && date.getMonth() === this.parent.getCurrentTime().getMonth();
     }
@@ -20835,6 +21075,11 @@ class ViewBase {
                     setStyleAttribute(resourceColumn, { 'height': formatUnit(content.clientHeight) });
                 }
             }
+            const headerCellElements = [].slice.call(this.element.querySelectorAll('.' + HEADER_CELLS_CLASS));
+            headerCellElements.forEach((ele) => {
+                const headerCellColSpan = parseInt(ele.getAttribute('colspan'), 10);
+                setStyleAttribute(ele, { 'width': formatUnit(colWidth * headerCellColSpan) });
+            });
         }
     }
     resetColWidth() {
@@ -21872,10 +22117,11 @@ class Month extends ViewBase {
     getDateSlots(renderDates, workDays) {
         const count = this.parent.activeViewOptions.showWeekend ? WEEK_LENGTH : workDays.length;
         const dateSlots = [];
+        const isCurrentMonth = this.isCurrentMonth(this.parent.selectedDate);
         for (let col = 0; col < count; col++) {
             const classList$$1 = [HEADER_CELLS_CLASS];
             const currentDateIndex = renderDates.slice(0, count).map((date) => date.getDay());
-            if (this.isCurrentMonth(this.parent.selectedDate) && currentDateIndex.indexOf(this.parent.getCurrentTime().getDay()) === col) {
+            if (isCurrentMonth && currentDateIndex.indexOf(this.parent.getCurrentTime().getDay()) === col) {
                 classList$$1.push(CURRENT_DAY_CLASS);
             }
             dateSlots.push({ date: renderDates[col], type: 'monthDay', className: classList$$1, colSpan: 1, workDays: workDays });
@@ -21914,6 +22160,9 @@ class Month extends ViewBase {
             this.renderResourceMobileLayout();
         }
         this.parent.notify(contentReady, {});
+        if (this.parent.uiStateValues.isCustomMonth) {
+            this.parent.uiStateValues.isCustomMonth = false;
+        }
     }
     refreshHeader() {
         remove(this.element.querySelector('tbody tr'));
@@ -22096,7 +22345,7 @@ class Month extends ViewBase {
         return slotDatas;
     }
     updateClassList(data) {
-        if (this.isOtherMonth(data.date)) {
+        if (!this.isCustomMonth() && this.isOtherMonth(data.date)) {
             data.className.push(OTHERMONTH_CLASS);
         }
         if (!this.parent.isMinMaxDate(data.date)) {
@@ -22205,15 +22454,33 @@ class Month extends ViewBase {
         }
     }
     getMonthStart(currentDate) {
-        const monthStart = getWeekFirstDate(this.parent.calendarUtil.firstDateOfMonth(currentDate), this.parent.activeViewOptions.firstDayOfWeek);
-        const start = new Date(monthStart.getFullYear(), monthStart.getMonth(), monthStart.getDate());
-        return start;
+        const useDisplayDate = this.parent.currentView === 'Month' && !isNullOrUndefined(this.parent.activeViewOptions.displayDate) && (this.parent.uiStateValues.isCustomMonth || this.isCustomRange());
+        const date = useDisplayDate ? this.parent.activeViewOptions.displayDate : !(this.parent.uiStateValues.isCustomMonth ||
+            this.isCustomRange()) && this.isCustomMonth() ? currentDate : this.parent.calendarUtil.firstDateOfMonth(currentDate);
+        const monthStart = getWeekFirstDate(date, this.parent.activeViewOptions.firstDayOfWeek);
+        return new Date(monthStart.getFullYear(), monthStart.getMonth(), monthStart.getDate());
     }
     getMonthEnd(currentDate) {
-        const endDate = addMonths(currentDate, this.parent.activeViewOptions.interval - 1);
-        const lastWeekOfMonth = getWeekFirstDate(this.parent.calendarUtil.lastDateOfMonth(endDate), this.parent.activeViewOptions.firstDayOfWeek);
-        const monthEnd = addDays(lastWeekOfMonth, WEEK_LENGTH - 1);
-        return monthEnd;
+        if (this.isCustomMonth()) {
+            const start = this.getMonthStart(currentDate);
+            const numberOfDays = WEEK_LENGTH * (this.parent.activeViewOptions.numberOfWeeks > 0 ?
+                this.parent.activeViewOptions.numberOfWeeks : DEFAULT_WEEKS);
+            return addDays(start, (numberOfDays - 1));
+        }
+        else {
+            const endDate = addMonths(currentDate, this.parent.activeViewOptions.interval - 1);
+            const lastWeekOfMonth = getWeekFirstDate(this.parent.calendarUtil.lastDateOfMonth(endDate), this.parent.activeViewOptions.firstDayOfWeek);
+            return addDays(lastWeekOfMonth, WEEK_LENGTH - 1);
+        }
+    }
+    isCustomRange() {
+        const dates = this.parent.getCurrentViewDates();
+        if (dates && dates.length > 0) {
+            const selectedTime = resetTime(this.parent.selectedDate).getTime();
+            return !(selectedTime >= getWeekFirstDate(dates[0], this.parent.activeViewOptions.firstDayOfWeek).getTime() &&
+                selectedTime <= addDays(getWeekFirstDate(dates[dates.length - 1], this.parent.activeViewOptions.firstDayOfWeek), 6).getTime());
+        }
+        return false;
     }
     getRenderDates(workDays) {
         const renderDates = [];
@@ -22243,34 +22510,57 @@ class Month extends ViewBase {
         return renderDates;
     }
     getNextPreviousDate(type) {
-        if (type === 'next') {
-            return addMonths(this.parent.selectedDate, this.parent.activeViewOptions.interval);
+        if (this.isCustomMonth()) {
+            const dates = this.parent.getCurrentViewDates();
+            const date = getWeekFirstDate(type === 'next' ? dates[dates.length - 1]
+                : dates[0], this.parent.activeViewOptions.firstDayOfWeek);
+            return addDays(date, type === 'next' ? WEEK_LENGTH : -(this.parent.activeViewOptions.numberOfWeeks > 0 ?
+                this.parent.activeViewOptions.numberOfWeeks : DEFAULT_WEEKS) * WEEK_LENGTH);
         }
         else {
-            return addMonths(this.parent.selectedDate, -(this.parent.activeViewOptions.interval));
+            return addMonths(this.parent.selectedDate, ((type === 'next' ? 1 : -1) * this.parent.activeViewOptions.interval));
         }
     }
+    getStartDate() {
+        return this.getMonthStart(this.parent.selectedDate);
+    }
+    getEndDate() {
+        return this.getMonthEnd(this.parent.selectedDate);
+    }
     getEndDateFromStartDate(start) {
         return addDays(new Date(start.getTime()), 1);
     }
     getDateRangeText() {
         if (this.parent.isAdaptive || isNullOrUndefined(this.parent.activeViewOptions.dateFormat)) {
-            if (this.parent.activeViewOptions.interval > 1) {
-                const endDate = addMonths(lastDateOfMonth(this.parent.selectedDate), this.parent.activeViewOptions.interval - 1);
-                if (this.parent.selectedDate.getFullYear() === endDate.getFullYear()) {
-                    const monthNames = (this.parent.globalize.formatDate(this.parent.selectedDate, { format: 'MMMM', calendar: this.parent.getCalendarMode() })) + ' - ' +
+            let startDate = this.parent.selectedDate;
+            let endDate;
+            let updateCustomRange = false;
+            if (this.isCustomMonth()) {
+                const dates = this.parent.getCurrentViewDates();
+                updateCustomRange = dates[0].getMonth() !== dates[dates.length - 1].getMonth() ||
+                    dates[0].getFullYear() !== dates[dates.length - 1].getFullYear();
+                if (updateCustomRange) {
+                    startDate = dates[0];
+                    endDate = dates[dates.length - 1];
+                }
+            }
+            const isUpdateDateRange = (this.parent.currentView !== 'Month' || !this.isCustomMonth());
+            if (this.parent.activeViewOptions.interval > 1 && isUpdateDateRange || updateCustomRange) {
+                endDate = endDate ? endDate : addMonths(lastDateOfMonth(startDate), this.parent.activeViewOptions.interval - 1);
+                if (startDate.getFullYear() === endDate.getFullYear()) {
+                    const monthNames = (this.parent.globalize.formatDate(startDate, { format: 'MMMM', calendar: this.parent.getCalendarMode() })) + ' - ' +
                         (this.parent.globalize.formatDate(endDate, { format: 'MMMM ', calendar: this.parent.getCalendarMode() })) +
                         this.parent.globalize.formatDate(endDate, { skeleton: 'y', calendar: this.parent.getCalendarMode() });
                     return capitalizeFirstWord(monthNames, 'single');
                 }
-                const text = (this.parent.globalize.formatDate(this.parent.selectedDate, { format: 'MMMM', calendar: this.parent.getCalendarMode() })) + ' ' +
-                    this.parent.selectedDate.getFullYear() + ' - ' +
+                const text = (this.parent.globalize.formatDate(startDate, { format: 'MMMM', calendar: this.parent.getCalendarMode() })) + ' ' +
+                    startDate.getFullYear() + ' - ' +
                     this.parent.globalize.formatDate(endDate, { format: 'MMMM ', calendar: this.parent.getCalendarMode() }) +
                     this.parent.globalize.formatDate(endDate, { skeleton: 'y', calendar: this.parent.getCalendarMode() });
                 return capitalizeFirstWord(text, 'single');
             }
             const format = (this.parent.activeViewOptions.dateFormat) ? this.parent.activeViewOptions.dateFormat : 'MMMM y';
-            return capitalizeFirstWord(this.parent.globalize.formatDate(this.parent.selectedDate, { format: format, calendar: this.parent.getCalendarMode() }), 'single');
+            return capitalizeFirstWord(this.parent.globalize.formatDate(startDate, { format: format, calendar: this.parent.getCalendarMode() }), 'single');
         }
         return this.formatDateRange(this.parent.selectedDate);
     }
@@ -22295,6 +22585,10 @@ class Month extends ViewBase {
             EventHandler.remove(contentScrollableEle, 'scroll', this.onContentScroll);
         }
     }
+    isCustomMonth() {
+        return this.parent.currentView === 'Month' &&
+            (!isNullOrUndefined(this.parent.activeViewOptions.displayDate) || this.parent.activeViewOptions.numberOfWeeks > 0);
+    }
     getModuleName() {
         return 'month';
     }
@@ -22526,12 +22820,29 @@ class Year extends ViewBase {
         return Array.apply(null, { length: this.parent.activeViewOptions.monthsCount }).map((value, index) => this.parent.firstMonthOfYear + index);
     }
     onCellClick(e) {
-        const target = closest(e.target, '.' + WORK_CELLS_CLASS);
+        let target = closest(e.target, '.' + WORK_CELLS_CLASS);
         const startDate = this.parent.getDateFromElement(target);
-        const endDate = addDays(new Date(startDate.getTime()), 1);
-        const filteredEvents = this.parent.eventBase.filterEvents(startDate, endDate);
-        const moreEventArgs = { date: startDate, event: filteredEvents, element: e.target };
-        this.parent.quickPopup.moreEventClick(moreEventArgs, endDate);
+        this.parent.activeCellsData = this.parent.getCellDetails(target);
+        const isPrevious = startDate.getTime() < this.getStartDate().getTime();
+        if (isPrevious || startDate.getTime() > this.getEndDate().getTime()) {
+            this.parent.changeDate(this.parent.activeView.getNextPreviousDate(isPrevious ? 'previous' : 'next'), e);
+            const activeDate = this.parent.activeCellsData.startTime.getTime();
+            const inRange = activeDate >= this.getStartDate().getTime() && activeDate <= this.getEndDate().getTime();
+            const dateAttr = inRange ? activeDate : (isPrevious ? this.getEndDate() : this.getStartDate()).getTime();
+            const selectedCell = this.parent.element.querySelector(':not(.' + OTHERMONTH_CLASS + ')[data-date="' + dateAttr + '"]');
+            this.parent.selectCell(selectedCell);
+            this.parent.activeCellsData = this.parent.getCellDetails(selectedCell);
+        }
+        else {
+            const endDate = addDays(new Date(startDate.getTime()), 1);
+            const filteredEvents = this.parent.eventBase.filterEvents(startDate, endDate);
+            const moreEventArgs = { date: startDate, event: filteredEvents, element: e.target };
+            if (target.classList.contains(OTHERMONTH_CLASS)) {
+                target = this.parent.element.querySelector(':not(.' + OTHERMONTH_CLASS + ')[data-date="' + target.getAttribute('data-date') + '"]');
+            }
+            this.parent.activeCellsData = this.parent.getCellDetails(target);
+            this.parent.quickPopup.moreEventClick(moreEventArgs, endDate);
+        }
     }
     onContentScroll(e) {
         const target = e.target;
@@ -22583,10 +22894,10 @@ class Year extends ViewBase {
         return addDays(addMonths(this.getStartDate(), this.parent.monthsCount), -1);
     }
     startDate() {
-        return getWeekFirstDate(this.getStartDate(), this.parent.firstDayOfWeek);
+        return this.parent.currentView === 'Year' ? getWeekFirstDate(this.getStartDate(), this.parent.firstDayOfWeek) : this.getStartDate();
     }
     endDate() {
-        return addDays(getWeekLastDate(this.getEndDate(), this.parent.firstDayOfWeek), 1);
+        return this.parent.currentView === 'Year' ? addDays(getWeekLastDate(this.getEndDate(), this.parent.firstDayOfWeek), 1) : this.getEndDate();
     }
     getEndDateFromStartDate(start) {
         let date = new Date(start.getTime());
@@ -22629,6 +22940,7 @@ class Year extends ViewBase {
                 EventHandler.add(element, 'click', this.onCellClick, this);
             }
             else {
+                EventHandler.add(element, 'mousedown', this.parent.workCellAction.cellMouseDown, this.parent.workCellAction);
                 EventHandler.add(element, 'click', this.parent.workCellAction.cellClick, this.parent.workCellAction);
                 if (!this.parent.isAdaptive) {
                     EventHandler.add(element, 'dblclick', this.parent.workCellAction.cellDblClick, this.parent.workCellAction);
@@ -23065,7 +23377,8 @@ class Agenda extends AgendaBase {
         for (const event of this.parent.eventsData) {
             delete event.generatedDates;
         }
-        let eventCollection = this.parent.activeViewOptions.allowVirtualScrolling ? args.processedData : this.parent.eventsProcessed;
+        let eventCollection = this.parent.activeViewOptions.allowVirtualScrolling ?
+            args.processedData : this.parent.eventsProcessed;
         if (this.parent.uiStateValues.isGroupAdaptive) {
             const resource = this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex];
             this.dataSource = this.parent.eventBase.filterEventsByResource(resource, this.dataSource);
@@ -24114,6 +24427,9 @@ class TimelineYear extends Year {
             tr.appendChild(leftHeaderCells);
             leftHeaderCells.appendChild(this.renderResourceHeader(LEFT_INDENT_WRAP_CLASS));
         }
+        const isHorizontal = this.parent.activeViewOptions.orientation === 'Horizontal';
+        const isGroup = this.parent.activeViewOptions.group.resources.length > 0;
+        this.isInverseTableSelect = isHorizontal && !isGroup ? false : true;
         const td = createElement('td');
         tr.appendChild(td);
         const container = createElement('div', { className: DATE_HEADER_CONTAINER_CLASS });
@@ -24791,8 +25107,8 @@ class ExcelExport {
     constructor(parent) {
         this.parent = parent;
     }
-    initializeExcelExport(excelExportOptions) {
-        const exportFields = excelExportOptions.fields || Object.keys(this.parent.eventFields).map((field) => this.parent.eventFields[field]);
+    initializeExcelExport(excelExportOptions = {}) {
+        const exportColumns = this.getExportColumns(excelExportOptions);
         const exportName = excelExportOptions.fileName || 'Schedule';
         const exportType = excelExportOptions.exportType || 'xlsx';
         const isIncludeOccurrences = excelExportOptions.includeOccurrences || false;
@@ -24804,34 +25120,40 @@ class ExcelExport {
         else {
             eventCollection = !isIncludeOccurrences ? this.parent.eventsData : this.parent.eventsProcessed;
         }
-        this.processWorkbook(exportFields, exportName, exportType, eventCollection);
+        this.processWorkbook(exportColumns, exportName, exportType, eventCollection);
     }
     processWorkbook(fields, name, type, eventCollection) {
         const columns = [];
         const rows = [];
         const columnHeader = [];
-        fields.forEach((field, i) => columns.push({ index: i + 1, width: (field === 'Id' ? 20 : 150) }));
+        fields.forEach((field, i) => { columns.push({ index: i + 1, width: (field.name === 'Id' ? 50 : 150) }); });
         const style = { fontSize: 12, borders: { color: '#E0E0E0' }, bold: true };
-        fields.forEach((field, i) => columnHeader.push({ index: i + 1, value: field, style: style }));
+        fields.forEach((field, i) => { columnHeader.push({ index: i + 1, value: field.text, style: style }); });
         rows.push({ index: 1, cells: columnHeader });
-        let i = 2;
-        for (const event of eventCollection) {
+        eventCollection.forEach((event, i) => {
             const columnData = [];
             fields.forEach((field, n) => {
-                let columnRule = { index: n + 1, value: event[field] || '' };
-                if (field === this.parent.eventFields.startTime || field === this.parent.eventFields.endTime) {
+                let columnRule = { index: n + 1, value: event[field.name] || '' };
+                if (field.name === this.parent.eventFields.startTime || field.name === this.parent.eventFields.endTime) {
                     const styleRule = { fontSize: 12, numberFormat: 'm/d/yyyy h:mm AM/PM' };
                     columnRule = extend({}, columnRule, { style: styleRule }, true);
                 }
                 columnData.push(columnRule);
             });
-            rows.push({ index: i, cells: columnData });
-            i++;
-        }
+            rows.push({ index: i + 2, cells: columnData });
+        });
         const workSheet = [{ columns: columns, rows: rows }];
         const book = new Workbook({ worksheets: workSheet }, type, this.parent.locale);
         book.save(name + '.' + type);
     }
+    getExportColumns(exportOptions) {
+        const exportColumns = exportOptions.fieldsInfo || [];
+        if (exportColumns.length === 0) {
+            const fields = exportOptions.fields || Object.keys(this.parent.eventFields).map((field) => this.parent.eventFields[field]);
+            fields.forEach((field) => { exportColumns.push({ name: field, text: field }); });
+        }
+        return exportColumns;
+    }
     getModuleName() {
         return 'excelExport';
     }
@@ -24976,5 +25298,5 @@ class Print {
  * Export Schedule components
  */
 
-export { Schedule, cellClick, cellDoubleClick, moreEventsClick, select, hover, actionBegin, actionComplete, actionFailure, navigating, renderCell, eventClick, eventRendered, dataBinding, dataBound, popupOpen, popupClose, dragStart, drag, dragStop, resizeStart, resizing, resizeStop, inlineClick, initialLoad, initialEnd, print$1 as print, dataReady, eventsLoaded, contentReady, scroll, virtualScroll, scrollUiUpdate, uiUpdate, documentClick, cellMouseDown, WEEK_LENGTH, MS_PER_DAY, MS_PER_MINUTE, getElementHeightFromClass, getTranslateY, getWeekFirstDate, getWeekLastDate, firstDateOfMonth, lastDateOfMonth, getWeekNumber, getWeekMiddleDate, setTime, resetTime, getDateInMs, getDateCount, addDays, addMonths, addYears, getStartEndHours, getMaxDays, getDaysCount, getDateFromString, getScrollBarWidth, findIndexInData, getOuterHeight, removeChildren, isDaylightSavingTime, getUniversalTime, isMobile, isIPadDevice, capitalizeFirstWord, Resize, DragAndDrop, HeaderRenderer, ViewBase, Day, Week, WorkWeek, Month, Year, Agenda, MonthAgenda, TimelineViews, TimelineMonth, TimelineYear, Timezone, timezoneData, ICalendarExport, ICalendarImport, ExcelExport, Print, RecurrenceEditor, generateSummary, generate, getDateFromRecurrenceDateString, extractObjectFromRule, getCalendarUtil, getRecurrenceStringFromDate, Gregorian, Islamic };
+export { Schedule, cellClick, cellDoubleClick, moreEventsClick, select, hover, actionBegin, actionComplete, actionFailure, navigating, renderCell, eventClick, eventRendered, dataBinding, dataBound, popupOpen, popupClose, dragStart, drag, dragStop, resizeStart, resizing, resizeStop, inlineClick, initialLoad, initialEnd, print$1 as print, dataReady, eventsLoaded, contentReady, scroll, virtualScroll, scrollUiUpdate, uiUpdate, documentClick, cellMouseDown, WEEK_LENGTH, DEFAULT_WEEKS, MS_PER_DAY, MS_PER_MINUTE, getElementHeightFromClass, getTranslateY, getWeekFirstDate, getWeekLastDate, firstDateOfMonth, lastDateOfMonth, getWeekNumber, getWeekMiddleDate, setTime, resetTime, getDateInMs, getDateCount, addDays, addMonths, addYears, getStartEndHours, getMaxDays, getDaysCount, getDateFromString, getScrollBarWidth, findIndexInData, getOuterHeight, removeChildren, isDaylightSavingTime, getUniversalTime, isMobile, isIPadDevice, capitalizeFirstWord, Resize, DragAndDrop, HeaderRenderer, ViewBase, Day, Week, WorkWeek, Month, Year, Agenda, MonthAgenda, TimelineViews, TimelineMonth, TimelineYear, Timezone, timezoneData, ICalendarExport, ICalendarImport, ExcelExport, Print, RecurrenceEditor, generateSummary, generate, getDateFromRecurrenceDateString, extractObjectFromRule, getCalendarUtil, getRecurrenceStringFromDate, Gregorian, Islamic };
 //# sourceMappingURL=ej2-schedule.es2015.js.map