@syncfusion/ej2-schedule 21.2.9 → 22.1.34

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

@@ -1,4 +1,4 @@
-import { Animation, Browser, ChildProperty, Collection, Complex, Component, Draggable, Event, EventHandler, HijriParser, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Property, SanitizeHtmlHelper, Touch, addClass, append, classList, cldrData, closest, compile, createElement, detach, extend, formatUnit, getDefaultDateObject, getElement, getValue, isNullOrUndefined, prepend, print, remove, removeClass, setStyleAttribute } from '@syncfusion/ej2-base';
+import { Animation, Browser, ChildProperty, Collection, Complex, Component, Draggable, Event, EventHandler, HijriParser, Internationalization, KeyboardEvents, L10n, NotifyPropertyChanges, Property, SanitizeHtmlHelper, Touch, addClass, append, classList, cldrData, closest, compile, createElement, detach, extend, formatUnit, getDefaultDateObject, getElement, getValue, initializeCSPTemplate, isNullOrUndefined, prepend, print, remove, removeClass, setStyleAttribute } from '@syncfusion/ej2-base';
 import { Dialog, Popup, Tooltip, createSpinner, hideSpinner, isCollide, showSpinner } from '@syncfusion/ej2-popups';
 import { Toolbar, TreeView } from '@syncfusion/ej2-navigations';
 import { Calendar, DatePicker, DateTimePicker } from '@syncfusion/ej2-calendars';
@@ -2446,6 +2446,7 @@ var KeyboardInteraction = /** @__PURE__ @class */ (function () {
                         return;
                     }
                 }
+                e.preventDefault();
                 this.selectCells(isMultiple, targetCell);
             }
         }
@@ -2493,6 +2494,7 @@ var KeyboardInteraction = /** @__PURE__ @class */ (function () {
                         return;
                     }
                 }
+                e.preventDefault();
                 this.selectCells(isMultiple, targetCell);
             }
         }
@@ -10361,7 +10363,9 @@ var QuickPopups = /** @__PURE__ @class */ (function () {
             this.dialogEvent = event;
         }
         this.quickPopupHide();
-        this.parent.eventBase.focusElement();
+        if (isNullOrUndefined(event) || (!isNullOrUndefined(event) && event.action !== 'escape')) {
+            this.parent.eventBase.focusElement();
+        }
     };
     QuickPopups.prototype.addEventListener = function () {
         this.parent.on(cellClick, this.cellClick, this);
@@ -10553,11 +10557,14 @@ var EventTooltip = /** @__PURE__ @class */ (function () {
             }
             var tooltipTime = (record[fields.isAllDay]) ? this.parent.localeObj.getConstant('allDay') :
                 (startTime + ' - ' + endTime);
-            var content = '<div><div class="e-subject">' + tooltipSubject + '</div>' +
+            var content_1 = '<div><div class="e-subject">' + tooltipSubject + '</div>' +
                 '<div class="e-location">' + tooltipLocation + '</div>' +
                 '<div class="e-details">' + tooltipDetails + '</div>' +
                 '<div class="e-all-day">' + tooltipTime + '</div></div>';
-            this.setContent(content);
+            var contentTemp = function () {
+                return content_1;
+            };
+            this.setContent(initializeCSPTemplate(contentTemp));
         }
         this.parent.renderTemplates();
     };
@@ -10804,7 +10811,7 @@ var RecurrenceEditor = /** @__PURE__ @class */ (function (_super) {
         }
         else {
             if (!isNullOrUndefined(this.repeatType.value)) {
-                this.startState(this.repeatType.value.toString().toUpperCase(), NEVER, this.startDate);
+                this.startState(this.repeatType.value.toString().toUpperCase(), this.endTypes[0], this.startDate);
                 this.updateForm(this.repeatType.value.toString());
             }
             if (this.selectedType > 0) {
@@ -11193,11 +11200,10 @@ var RecurrenceEditor = /** @__PURE__ @class */ (function (_super) {
         }
     };
     RecurrenceEditor.prototype.getEndData = function () {
-        var endData = [NEVER, UNTIL$1, COUNT];
         // eslint-disable-next-line @typescript-eslint/no-this-alias
         var self = this;
         var dataSource = [];
-        endData.forEach(function (data) {
+        this.endTypes.forEach(function (data) {
             dataSource.push({ text: self.localeObj.getConstant(data), value: data });
         });
         return dataSource;
@@ -11497,7 +11503,7 @@ var RecurrenceEditor = /** @__PURE__ @class */ (function (_super) {
         this.monthButtons = [];
     };
     RecurrenceEditor.prototype.resetFields = function () {
-        this.startState(NONE, NEVER, this.startDate);
+        this.startState(NONE, this.endTypes[0], this.startDate);
         this.setDefaultValue();
     };
     RecurrenceEditor.prototype.updateRuleUntilDate = function (startDate) {
@@ -11682,6 +11688,7 @@ var RecurrenceEditor = /** @__PURE__ @class */ (function (_super) {
                 case 'locale':
                 case 'frequencies':
                 case 'firstDayOfWeek':
+                case 'endTypes':
                     this.refresh();
                     break;
                 case 'dateFormat':
@@ -11693,6 +11700,9 @@ var RecurrenceEditor = /** @__PURE__ @class */ (function (_super) {
     __decorate$1([
         Property(['none', 'daily', 'weekly', 'monthly', 'yearly'])
     ], RecurrenceEditor.prototype, "frequencies", void 0);
+    __decorate$1([
+        Property(['never', 'until', 'count'])
+    ], RecurrenceEditor.prototype, "endTypes", void 0);
     __decorate$1([
         Property(0)
     ], RecurrenceEditor.prototype, "firstDayOfWeek", void 0);
@@ -12148,8 +12158,10 @@ var EventWindow = /** @__PURE__ @class */ (function () {
         var resourceDiv = this.createDivElement(value + '-container' + ' ' + 'e-resources');
         var resourceInput = this.createInputElement(value + ' ' + EVENT_FIELD$1, fieldName);
         resourceDiv.appendChild(resourceInput);
-        var resourceTemplate = '<div class="e-resource-template"><div class="e-resource-color" style="background-color:${' +
-            resourceData.colorField + '}"></div><div class="e-resource-text">${' + resourceData.textField + '}</div></div>';
+        function resourceTemplate(data) {
+            return "<div class=\"e-resource-template\"><div class=\"e-resource-color\" style=\"background-color:" + data[resourceData.colorField] + "\"></div><div class=\"e-resource-text\">" + data[resourceData.textField] + "</div></div>";
+        }
+        initializeCSPTemplate(resourceTemplate, resourceData);
         if (resourceData.allowMultiple) {
             var listObj = new MultiSelect({
                 enableRtl: this.parent.enableRtl,
@@ -12399,16 +12411,18 @@ var EventWindow = /** @__PURE__ @class */ (function () {
         return labelText;
     };
     EventWindow.prototype.onChange = function (args) {
-        var targetSelector = "." + EVENT_WINDOW_ALL_DAY_CLASS + ",." + TIME_ZONE_CLASS + ",." + EVENT_WINDOW_REPEAT_CLASS;
-        var target = closest(args.event.target, targetSelector);
-        if (target.classList.contains(EVENT_WINDOW_ALL_DAY_CLASS)) {
-            this.onAllDayChange(args.checked);
-        }
-        else if (target.classList.contains(TIME_ZONE_CLASS)) {
-            this.timezoneChangeStyle(args.checked);
-        }
-        else if (target.classList.contains(EVENT_WINDOW_REPEAT_CLASS)) {
-            this.onRepeatChange(args.checked);
+        if (args.event && args.event.target) {
+            var targetSelector = "." + EVENT_WINDOW_ALL_DAY_CLASS + ",." + TIME_ZONE_CLASS + ",." + EVENT_WINDOW_REPEAT_CLASS;
+            var target = closest(args.event.target, targetSelector);
+            if (target.classList.contains(EVENT_WINDOW_ALL_DAY_CLASS)) {
+                this.onAllDayChange(args.checked);
+            }
+            else if (target.classList.contains(TIME_ZONE_CLASS)) {
+                this.timezoneChangeStyle(args.checked);
+            }
+            else if (target.classList.contains(EVENT_WINDOW_REPEAT_CLASS)) {
+                this.onRepeatChange(args.checked);
+            }
         }
     };
     EventWindow.prototype.renderRepeatDialog = function () {
@@ -13243,7 +13257,7 @@ var EventWindow = /** @__PURE__ @class */ (function () {
                 this.parent.quickPopup.openRecurrenceValidationAlert('sameDayAlert');
                 return true;
             }
-            else if (!(previousEndTime.getTime() <= currentStartTime.getTime() && nextStartTime.getTime() >
+            else if (!(previousEndTime.getTime() <= currentStartTime.getTime() && nextStartTime.getTime() >=
                 currentEndTime.getTime()) || (resetTime(nextEndTime).getTime() <
                 resetTime(currentStartTime).getTime()) ||
                 (resetTime(previousStartTime).getTime() > resetTime(currentEndTime).getTime()) ||
@@ -17267,7 +17281,11 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
             };
         }
         this.currentTimezoneDate = this.getCurrentTime();
-        this.activeCellsData = { startTime: new Date(this.currentTimezoneDate), endTime: new Date(this.currentTimezoneDate), isAllDay: false };
+        this.activeCellsData = {
+            startTime: new Date(this.currentTimezoneDate),
+            endTime: new Date(this.currentTimezoneDate),
+            isAllDay: false
+        };
         this.activeEventData = { event: undefined, element: undefined };
         this.getDefaultLocale();
         this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);
@@ -17753,18 +17771,23 @@ var Schedule = /** @__PURE__ @class */ (function (_super) {
     /**
      * Method to process the templates
      *
-     * @param {string} template Accepts the template in string
+     * @param {string | Function} template Accepts the template in string
      * @returns {CallbackFunction} Returns the callback function
      * @private
      */
     Schedule.prototype.templateParser = function (template) {
         if (template) {
             try {
-                if (document.querySelectorAll(template).length) {
-                    return compile(document.querySelector(template).innerHTML.trim());
+                if (typeof template === 'function') {
+                    return compile(template);
                 }
                 else {
-                    return compile(template);
+                    if (document.querySelectorAll(template).length) {
+                        return compile(document.querySelector(template).innerHTML.trim());
+                    }
+                    else {
+                        return compile(template);
+                    }
                 }
             }
             catch (error) {
@@ -26516,18 +26539,23 @@ var TimelineViews = /** @__PURE__ @class */ (function (_super) {
     };
     TimelineViews.prototype.getLeftFromDateTime = function (currentDateIndex, date) {
         var startHour = this.getStartHour();
-        var endHour = this.getEndHour();
         var diffInDates = 0;
         var diffInMinutes = ((date.getHours() - startHour.getHours()) * 60) + (date.getMinutes() - startHour.getMinutes());
         if (!isNullOrUndefined(currentDateIndex)) {
-            var end = (endHour.getHours() === 0) ? 24 : endHour.getHours();
             if (currentDateIndex[0] !== 0) {
-                diffInDates = (currentDateIndex[0]) * ((end - startHour.getHours()) * 60) + (endHour.getMinutes() - startHour.getMinutes());
+                if (this.parent.activeView.colLevels[0] && this.parent.activeView.colLevels[0][0].colSpan) {
+                    diffInDates = currentDateIndex[0] * this.parent.activeView.colLevels[0][0].colSpan * this.getWorkCellWidth();
+                }
+                else {
+                    var endHour = this.getEndHour();
+                    var end = (endHour.getHours() === 0) ? 24 : endHour.getHours();
+                    diffInMinutes = diffInMinutes + ((currentDateIndex[0]) * (((end - startHour.getHours()) * 60) +
+                        (endHour.getMinutes() - startHour.getMinutes())));
+                }
             }
-            diffInMinutes = diffInDates + diffInMinutes;
         }
-        return (diffInMinutes * this.getWorkCellWidth() * this.parent.activeViewOptions.timeScale.slotCount) /
-            this.parent.activeViewOptions.timeScale.interval;
+        return diffInDates + ((diffInMinutes * this.getWorkCellWidth() * this.parent.activeViewOptions.timeScale.slotCount) /
+            this.parent.activeViewOptions.timeScale.interval);
     };
     TimelineViews.prototype.getWorkCellWidth = function () {
         return this.element.querySelector('.e-work-cells').getBoundingClientRect().width;