@syncfusion/ej2-schedule 24.2.8 → 25.1.37

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

@@ -671,6 +671,8 @@ const TIMELINE_WRAPPER_CLASS = 'e-timeline-wrapper';
 /** @private */
 const APPOINTMENT_WRAPPER_CLASS = 'e-appointment-wrapper';
 /** @private */
+const APPOINTMENT_WRAPPER_HIDDEN_CLASS = 'e-appointment-wrapper-hidden';
+/** @private */
 const DAY_WRAPPER_CLASS = 'e-day-wrapper';
 /** @private */
 const TOOLBAR_CONTAINER = 'e-schedule-toolbar-container';
@@ -2566,6 +2568,13 @@ class KeyboardInteraction {
             }
         }
     }
+    isCalendarTarget(e) {
+        const keyTarget = e.currentTarget || e.target;
+        if (keyTarget && !isNullOrUndefined(keyTarget.querySelector('.e-header-popup.e-popup-open'))) {
+            return true;
+        }
+        return false;
+    }
     cancelUpDownAction(isTimelineYear) {
         const isVerticalYear = isTimelineYear && this.parent.activeViewOptions.orientation === 'Vertical';
         const isGroup = this.parent.activeViewOptions.group.resources.length > 0;
@@ -2579,7 +2588,7 @@ class KeyboardInteraction {
     }
     processUp(e, isMultiple) {
         const isTimelineYear = this.parent.currentView === 'TimelineYear';
-        if (isMultiple && this.cancelUpDownAction(isTimelineYear)) {
+        if (isMultiple && this.cancelUpDownAction(isTimelineYear) || (this.isCalendarTarget(e))) {
             return;
         }
         let target = (e.target);
@@ -2627,7 +2636,7 @@ class KeyboardInteraction {
     }
     processDown(e, isMultiple) {
         const isTimelineYear = this.parent.currentView === 'TimelineYear';
-        if (isMultiple && this.cancelUpDownAction(isTimelineYear)) {
+        if (isMultiple && this.cancelUpDownAction(isTimelineYear) || (this.isCalendarTarget(e))) {
             return;
         }
         let target = (e.target);
@@ -2737,7 +2746,7 @@ class KeyboardInteraction {
     }
     processRight(e, isMultiple) {
         const isTimelineYear = this.parent.currentView === 'TimelineYear';
-        if (this.isCancelLeftRightAction(e, isMultiple, isTimelineYear)) {
+        if (this.isCancelLeftRightAction(e, isMultiple, isTimelineYear) || (this.isCalendarTarget(e))) {
             return;
         }
         const selectedCells = this.parent.getSelectedCells();
@@ -2808,7 +2817,7 @@ class KeyboardInteraction {
     }
     processLeft(e, isMultiple) {
         const isTimelineYear = this.parent.currentView === 'TimelineYear';
-        if (this.isCancelLeftRightAction(e, isMultiple, isTimelineYear)) {
+        if (this.isCancelLeftRightAction(e, isMultiple, isTimelineYear) || (this.isCalendarTarget(e))) {
             return;
         }
         let target = (e.target);
@@ -6622,11 +6631,13 @@ class EventBase {
     createEventWrapper(type = '', index = 0) {
         const tr = createElement('tr');
         const levels = this.parent.activeView.colLevels.slice(-1)[0];
+        const className = this.parent.isReact && this.parent.activeViewOptions.eventTemplate ?
+            ' ' + APPOINTMENT_WRAPPER_HIDDEN_CLASS : '';
         for (let i = 0, len = levels.length; i < len; i++) {
             const col = levels[parseInt(i.toString(), 10)];
             const appointmentWrap = createElement('td', {
-                className: (type === 'allDay') ? ALLDAY_APPOINTMENT_WRAPPER_CLASS : (type === 'timeIndicator') ?
-                    TIMELINE_WRAPPER_CLASS : DAY_WRAPPER_CLASS, attrs: { 'data-date': col.date.getTime().toString() }
+                className: (type === 'allDay') ? ALLDAY_APPOINTMENT_WRAPPER_CLASS + className : (type === 'timeIndicator') ?
+                    TIMELINE_WRAPPER_CLASS : DAY_WRAPPER_CLASS + className, attrs: { 'data-date': col.date.getTime().toString() }
             });
             if (!isNullOrUndefined(col.groupIndex)) {
                 appointmentWrap.setAttribute('data-group-index', col.groupIndex.toString());
@@ -6786,7 +6797,12 @@ class VerticalEvent extends EventBase {
         if (isDragging) {
             this.parent.crudModule.crudObj.isCrudAction = false;
         }
-        this.parent.renderTemplates();
+        this.parent.renderTemplates(() => {
+            if (this.parent.isReact && this.parent.activeViewOptions.eventTemplate) {
+                const wraps = [].slice.call(this.parent.element.querySelectorAll('.' + APPOINTMENT_WRAPPER_HIDDEN_CLASS));
+                removeClass(wraps, APPOINTMENT_WRAPPER_HIDDEN_CLASS);
+            }
+        });
     }
     initializeValues() {
         this.resources = (this.parent.activeViewOptions.group.resources.length > 0) ? this.parent.uiStateValues.isGroupAdaptive ?
@@ -10426,6 +10442,17 @@ class QuickPopups {
                 instance.destroy();
             }
         }
+        if (popupName === 'quickPopup') {
+            const input = popup.element.querySelector('input.' + SUBJECT_CLASS);
+            if (input) {
+                input.remove();
+            }
+            const form = this.quickPopup.element.querySelector('form.' + FORM_CLASS);
+            if (form) {
+                removeChildren(form);
+                form.remove();
+            }
+        }
     }
     refreshQuickDialog() {
         this.destroyQuickDialog();
@@ -11306,7 +11333,6 @@ let RecurrenceEditor = class RecurrenceEditor extends Component {
     setTemplate() {
         const dayData = this.getDayData('narrow');
         const fullDay = this.getDayData('wide');
-        const labelId = this.element.id + '_' + 'end_label';
         this.element.innerHTML = '<div class="' + HEADER + '">' +
             '<div class="' + INPUTWARAPPER + ' ' + FORMLEFT + '">' +
             '<input type="text" tabindex="0" class="' + REPEATELEMENT +
@@ -11353,7 +11379,7 @@ let RecurrenceEditor = class RecurrenceEditor extends Component {
             '</div></div>' +
             '<div class="' + INPUTWARAPPERSIDE + ' ' + ENDON + ' ' + FORMRIGHT + '">' +
             '<div class="' + INPUTWARAPPER + ' ' + ENDONLEFT + '">' +
-            '<input type="text" tabindex="0" class="' + ENDONELEMENT + '" aria-labelledby="' + labelId + '"title="' + this.localeObj.getConstant(END) + '" />' +
+            '<input type="text" tabindex="0" class="' + ENDONELEMENT + '"title="' + this.localeObj.getConstant(END) + '" />' +
             '</div>' +
             '<div class="' + INPUTWARAPPER + ' ' + ENDONDATE + '" >' +
             '<input type="text" tabindex="0" class="' + UNTILDATE + '"title="' + this.localeObj.getConstant(UNTIL$1) + '" />' +
@@ -14163,15 +14189,21 @@ class Render {
                 break;
             case 'TimelineDay':
                 this.parent.activeView = this.parent.timelineViewsModule;
-                this.parent.activeView.viewClass = 'e-timeline-day-view';
+                if (!isNullOrUndefined(this.parent.activeView)) {
+                    this.parent.activeView.viewClass = 'e-timeline-day-view';
+                }
                 break;
             case 'TimelineWorkWeek':
                 this.parent.activeView = this.parent.timelineViewsModule;
-                this.parent.activeView.viewClass = 'e-timeline-work-week-view';
+                if (!isNullOrUndefined(this.parent.activeView)) {
+                    this.parent.activeView.viewClass = 'e-timeline-work-week-view';
+                }
                 break;
             case 'TimelineWeek':
                 this.parent.activeView = this.parent.timelineViewsModule;
-                this.parent.activeView.viewClass = 'e-timeline-week-view';
+                if (!isNullOrUndefined(this.parent.activeView)) {
+                    this.parent.activeView.viewClass = 'e-timeline-week-view';
+                }
                 break;
             case 'TimelineMonth':
                 this.parent.activeView = this.parent.timelineMonthModule;
@@ -14188,6 +14220,8 @@ class Render {
                     this.parent.headerModule.updateActiveView();
                     this.parent.headerModule.setCalendarView();
                 }
+                console.warn('[WARNING] :: Module "' + viewName + '" is not available in Schedule component!' +
+                    ' You either misspelled the module name or forgot to load it.');
                 return this.initializeLayout(firstView);
             }
             throw Error('Inject required modules');
@@ -14365,6 +14399,12 @@ class Crud {
         if (!this.parent.activeView) {
             return;
         }
+        if (this.parent.uiStateValues && this.parent.uiStateValues.isPreventEventRefresh) {
+            this.parent.uiStateValues.isPreventEventRefresh = false;
+            this.parent.refreshEvents(false);
+            this.parent.hideSpinner();
+            return;
+        }
         const start = this.parent.activeView.startDate();
         const end = this.parent.activeView.endDate();
         const dataManager = this.parent.dataModule.getData(this.parent.dataModule.generateQuery(start, end));
@@ -14375,6 +14415,9 @@ class Crud {
             return;
         }
         this.parent.trigger(dataBinding, e, (args) => {
+            if (args.cancel) {
+                return;
+            }
             const resultData = extend([], args.result, null, true);
             this.parent.eventsData = resultData.filter((data) => !data[this.parent.eventFields.isBlock]);
             this.parent.blockData = resultData.filter((data) => data[this.parent.eventFields.isBlock]);
@@ -18428,9 +18471,13 @@ let Schedule = class Schedule extends Component {
      *
      * @function setResourceCollections
      * @param {ResourcesModel[]} resourceCol Accepts the resource collections in ResourcesModel type
+     * @param {boolean} isEventDataRefresh Accepts the boolean to refresh the appointment data source from remote or local
      * @returns {void}
      */
-    setResourceCollections(resourceCol) {
+    setResourceCollections(resourceCol, isEventDataRefresh = true) {
+        if (!isEventDataRefresh && this.uiStateValues) {
+            this.uiStateValues.isPreventEventRefresh = true;
+        }
         this.setProperties({ resources: resourceCol }, false);
     }
     /**
@@ -18550,6 +18597,8 @@ let Schedule = class Schedule extends Component {
             this.iCalendarExportModule.initializeCalendarExport(fileName, customData);
         }
         else {
+            console.warn('[WARNING] :: Module "ICalendarExport" is not available in Schedule component!' +
+                ' You either misspelled the module name or forgot to load it.');
             throw Error('Inject ICalendarExport module');
         }
     }
@@ -18566,6 +18615,8 @@ let Schedule = class Schedule extends Component {
             this.iCalendarImportModule.initializeCalendarImport(fileContent);
         }
         else {
+            console.warn('[WARNING] :: Module "ICalendarImport" is not available in Schedule component!' +
+                ' You either misspelled the module name or forgot to load it.');
             throw Error('Inject ICalendarImport module');
         }
     }
@@ -18611,6 +18662,8 @@ let Schedule = class Schedule extends Component {
             this.excelExportModule.initializeExcelExport(excelExportOptions);
         }
         else {
+            console.warn('[WARNING] :: Module "ExcelExport" is not available in Schedule component!' +
+                ' You either misspelled the module name or forgot to load it.');
             throw Error('Inject ExcelExport module');
         }
     }
@@ -18627,6 +18680,8 @@ let Schedule = class Schedule extends Component {
             this.printModule.print(printOptions);
         }
         else {
+            console.warn('[WARNING] :: Module "Print" is not available in Schedule component!' +
+                ' You either misspelled the module name or forgot to load it.');
             throw Error('Inject Print module');
         }
     }
@@ -18909,6 +18964,8 @@ let Schedule = class Schedule extends Component {
     }
     /**
      * To check whether the given time range slots are available for event creation or already occupied by other events.
+     * This method currently focuses on validating appointments within the current view date range.
+     * However, it does not extend this availability check to recurrence occurrences outside of the current date range.
      *
      * @function isSlotAvailable
      * @param {Date | Object} startTime Denotes the start time of the slot.
@@ -25088,23 +25145,40 @@ class AgendaBase extends ViewBase {
             EventHandler.add(element, 'click', this.parent.agendaModule.dayNavigationClick, this);
         }
     }
-    calculateResourceTableElement(tBody, noOfDays, agendaDate) {
+    calculateResourceTableElement(tBody, noOfDays, agendaDate, agendaEnd = null) {
         if (isNullOrUndefined(this.parent.resourceBase.lastResourceLevel)) {
             const level = this.getDateSlots(this.renderDates, this.parent.activeViewOptions.workDays);
             this.parent.resourceBase.generateResourceLevels(level);
         }
-        const agendaLastDate = addDays(new Date(agendaDate.getTime()), noOfDays);
+        let agendaLastDate = addDays(new Date(agendaDate.getTime()), noOfDays);
         const days = (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda') ? noOfDays : 1;
         const resColl = this.parent.resourceBase.resourceCollection;
         const resData = this.parent.resourceBase.lastResourceLevel;
-        const initialDate = agendaDate;
+        const agendaStart = agendaDate;
+        let initialDate = agendaDate;
+        const showWeekend = this.parent.activeViewOptions.showWeekend;
         for (let i = 0; i < days; i++) {
             const lastLevelInfo = [];
             const tempLastLevelInfo = [];
             let tempIndex = 0;
             let eventObj;
             let dateObj;
-            const firstDate = addDays(initialDate, i);
+            let firstDate = addDays(initialDate, i);
+            if (this.parent.currentView === 'Agenda' && this.parent.activeViewOptions.group.byDate &&
+                this.parent.activeViewOptions.allowVirtualScrolling && !showWeekend && !this.isWorkDay(firstDate)) {
+                do {
+                    firstDate = addDays(firstDate, 1);
+                    if (firstDate >= agendaEnd) {
+                        break;
+                    }
+                } while (!this.isWorkDay(firstDate) ||
+                    this.parent.eventBase.filterEvents(firstDate, addDays(firstDate, 1)).length < 1);
+                if (firstDate >= agendaEnd) {
+                    break;
+                }
+                initialDate = addDays(firstDate, -i);
+                agendaLastDate = addDays(firstDate, 1);
+            }
             const finalDate = (this.parent.activeViewOptions.group.byDate || this.parent.currentView === 'MonthAgenda')
                 ? addDays(firstDate, 1) : agendaLastDate;
             const agendaCollection = this.parent.eventBase.filterEvents(firstDate, finalDate);
@@ -25119,7 +25193,9 @@ class AgendaBase extends ViewBase {
                         for (let r = 0; r < noOfDays; r++) {
                             // eslint-disable-next-line max-len
                             const resDayCollection = this.parent.eventBase.filterEvents(agendaDate, addDays(agendaDate, 1), resDataCollection, undefined);
-                            if (resDayCollection.length > 0 || !this.parent.hideEmptyAgendaDays ||
+                            if (((showWeekend || !showWeekend && (this.parent.group.byDate ? this.isWorkDay(agendaDate) :
+                                this.isWorkDay(agendaDate, resData[parseInt(res.toString(), 10)].workDays)))
+                                && (resDayCollection.length > 0 || !this.parent.hideEmptyAgendaDays)) ||
                                 this.parent.currentView === 'MonthAgenda') {
                                 data.push(resDayCollection[0]);
                                 eventObj = {
@@ -25145,16 +25221,18 @@ class AgendaBase extends ViewBase {
                             agendaDate = addDays(agendaDate, 1);
                             if (agendaDate.getTime() >= agendaLastDate.getTime() || this.parent.activeViewOptions.group.byDate
                                 || this.parent.currentView === 'MonthAgenda') {
-                                lastLevelInfo[lastLevelInfo.length - 1][1].cssClass = AGENDA_DAY_BORDER_CLASS;
-                                const tempObj = {
-                                    rowSpan: data.length, type: 'resourceColumn', resource: resColl[parseInt((resColl.length - 1).toString(), 10)],
-                                    groupOrder: resData[parseInt(res.toString(), 10)].groupOrder.slice(0, -1),
-                                    resourceData: resData[parseInt(res.toString(), 10)].resourceData,
-                                    groupIndex: (lastLevelInfo.length - data.length), className: [RESOURCE_NAME],
-                                    date: agendaDate
-                                };
-                                lastLevelInfo[parseInt((lastLevelInfo.length - data.length).toString(), 10)].push(tempObj);
-                                tempLastLevelInfo.push(extend({}, tempObj, null, true));
+                                if (data.length > 0) {
+                                    lastLevelInfo[lastLevelInfo.length - 1][1].cssClass = AGENDA_DAY_BORDER_CLASS;
+                                    const tempObj = {
+                                        rowSpan: data.length, type: 'resourceColumn', resource: resColl[parseInt((resColl.length - 1).toString(), 10)],
+                                        groupOrder: resData[parseInt(res.toString(), 10)].groupOrder.slice(0, -1),
+                                        resourceData: resData[parseInt(res.toString(), 10)].resourceData,
+                                        groupIndex: (lastLevelInfo.length - data.length), className: [RESOURCE_NAME],
+                                        date: agendaDate
+                                    };
+                                    lastLevelInfo[parseInt((lastLevelInfo.length - data.length).toString(), 10)].push(tempObj);
+                                    tempLastLevelInfo.push(extend({}, tempObj, null, true));
+                                }
                                 break;
                             }
                         }
@@ -25189,9 +25267,9 @@ class AgendaBase extends ViewBase {
                 this.createResourceTableRow(lastLevelInfo, tBody);
             }
         }
-        const totalCollection = this.parent.eventBase.filterEvents(initialDate, agendaLastDate);
+        const totalCollection = this.parent.eventBase.filterEvents(agendaStart, agendaLastDate);
         if (totalCollection.length === 0 && !this.parent.activeViewOptions.allowVirtualScrolling && this.parent.hideEmptyAgendaDays) {
-            this.renderEmptyContent(tBody, initialDate);
+            this.renderEmptyContent(tBody, agendaStart);
         }
     }
     createResourceTableRow(tContent, tBody) {
@@ -25446,9 +25524,19 @@ class Agenda extends AgendaBase {
         const firstDate = new Date(agendaDate.getTime());
         const isObject = this.appointmentFiltering(firstDate, lastDate);
         if (isObject.length > 0 && this.parent.activeViewOptions.allowVirtualScrolling && this.parent.hideEmptyAgendaDays) {
-            agendaDate = isObject[0][fieldMapping.startTime];
-            agendaDate = new Date(new Date(agendaDate.getTime()).setHours(0, 0, 0, 0));
-            this.updateHeaderText(isObject[0][fieldMapping.startTime]);
+            if (!this.parent.activeViewOptions.showWeekend && !this.isAgendaWorkDay(isObject[0][fieldMapping.startTime])) {
+                for (const event of isObject) {
+                    if (this.isAgendaWorkDay(event[fieldMapping.startTime])) {
+                        agendaDate = new Date(new Date(event[fieldMapping.startTime].getTime()).setHours(0, 0, 0, 0));
+                        this.updateHeaderText(event[fieldMapping.startTime]);
+                        break;
+                    }
+                }
+            }
+            else {
+                agendaDate = new Date(new Date(isObject[0][fieldMapping.startTime].getTime()).setHours(0, 0, 0, 0));
+                this.updateHeaderText(isObject[0][fieldMapping.startTime]);
+            }
         }
         let endDate;
         if (!this.parent.hideEmptyAgendaDays || (this.parent.agendaDaysCount > 0 && isObject.length > 0)) {
@@ -25462,18 +25550,25 @@ class Agenda extends AgendaBase {
                         this.parent.headerModule.updateHeaderItems('remove');
                     }
                 }
-                this.calculateResourceTableElement(tBody, this.parent.agendaDaysCount, date);
+                this.calculateResourceTableElement(tBody, this.parent.agendaDaysCount, date, lastDate);
             }
             else {
                 for (let day = 0; day < this.parent.agendaDaysCount; day++) {
-                    const filterData = this.appointmentFiltering(agendaDate);
                     const nTr = this.createTableRowElement(agendaDate, 'data');
-                    if (this.element.querySelector('tr[data-row-index="' + parseInt(nTr.getAttribute('data-row-index'), 10) + '"]')) {
+                    const virtualContent = this.element.querySelector('tr[data-row-index="' + (+(nTr.dataset.rowIndex)) + '"]');
+                    if (virtualContent || !this.parent.activeViewOptions.showWeekend && !this.isAgendaWorkDay(agendaDate)) {
                         agendaDate = addDays(agendaDate, 1);
+                        if (!virtualContent && this.parent.activeViewOptions.allowVirtualScrolling) {
+                            day--;
+                        }
+                        if (agendaDate.getTime() > lastDate.getTime()) {
+                            break;
+                        }
                         continue;
                     }
                     const dTd = nTr.children[0];
                     const aTd = nTr.children[1];
+                    const filterData = this.appointmentFiltering(agendaDate);
                     if (filterData.length > 0 || (!this.parent.hideEmptyAgendaDays && filterData.length === 0)) {
                         const elementType = (!this.parent.hideEmptyAgendaDays && filterData.length === 0) ? 'noEvents' : 'data';
                         dTd.appendChild(this.createDateHeaderElement(agendaDate));
@@ -25500,6 +25595,14 @@ class Agenda extends AgendaBase {
         }
         this.agendaDates = { start: firstDate, end: endDate };
     }
+    isAgendaWorkDay(date) {
+        if (this.parent.uiStateValues.isGroupAdaptive && !this.parent.group.byDate) {
+            return this.isWorkDay(date, this.parent.resourceBase.lastResourceLevel[this.parent.uiStateValues.groupIndex].workDays);
+        }
+        else {
+            return this.isWorkDay(date);
+        }
+    }
     agendaScrolling(event) {
         if (this.parent.quickPopup) {
             this.parent.quickPopup.quickPopupHide();
@@ -25604,9 +25707,12 @@ class Agenda extends AgendaBase {
         const lastDate = this.getEndDateFromStartDate(date);
         let daysCount = 0;
         do {
-            const filterData = this.appointmentFiltering(currentDate);
-            if (filterData.length > 0 || !this.parent.hideEmptyAgendaDays) {
-                daysCount++;
+            if (this.parent.activeViewOptions.showWeekend || !this.parent.activeViewOptions.showWeekend &&
+                this.isAgendaWorkDay(currentDate)) {
+                const filterData = this.appointmentFiltering(currentDate);
+                if (filterData.length > 0 || !this.parent.hideEmptyAgendaDays) {
+                    daysCount++;
+                }
             }
             currentDate = addDays(currentDate, (type === 'next') ? 1 : -1);
             if (currentDate < firstDate || currentDate > lastDate) {