@syncfusion/ej2-base 24.2.7 → 25.1.35

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

@@ -1548,6 +1548,7 @@ class NumberFormat {
      * @param {number} value ?
      * @param {base.GenericFormatOptions} fOptions ?
      * @param {CommonOptions} dOptions ?
+     * @param {NumberFormatOptions} [option] ?
      * @returns {string} ?
      */
     static intNumberFormatter(value, fOptions, dOptions, option) {
@@ -1599,7 +1600,7 @@ class NumberFormat {
                 fValue = fValue.replace('e', dOptions.numberMapper.numberSymbols[mapper$1[4]]);
             }
             fValue = fValue.replace('.', dOptions.numberMapper.numberSymbols[mapper$1[3]]);
-            fValue = curData.format === "#,###,,;(#,###,,)" ? this.customPivotFormat(parseInt(fValue)) : fValue;
+            fValue = curData.format === '#,###,,;(#,###,,)' ? this.customPivotFormat(parseInt(fValue, 10)) : fValue;
             if (curData.useGrouping) {
                 /* eslint-disable  @typescript-eslint/no-explicit-any */
                 fValue = this.groupNumbers(fValue, curData.groupData.primary, curData.groupSeparator || ',', dOptions.numberMapper.numberSymbols[mapper$1[3]] || '.', curData.groupData.secondary);
@@ -1671,6 +1672,7 @@ class NumberFormat {
      * @param {number} value ?
      * @param {number} min ?
      * @param {number} max ?
+     * @param {NumberFormatOptions} [option] ?
      * @returns {string} ?
      */
     static processFraction(value, min, max, option) {
@@ -1722,16 +1724,18 @@ class NumberFormat {
      * Returns custom format for pivot table
      *
      * @param {number} value ?
+     * @returns {string} ?
      */
     static customPivotFormat(value) {
         if (value >= 500000) {
             value /= 1000000;
-            const [integer, decimal] = value.toString().split(".");
+            // eslint-disable-next-line
+            const [integer, decimal] = value.toString().split('.');
             return decimal && +decimal.substring(0, 1) >= 5
                 ? Math.ceil(value).toString()
                 : Math.floor(value).toString();
         }
-        return "";
+        return '';
     }
 }
 
@@ -2069,6 +2073,7 @@ class DateParser {
                         // eslint-disable-next-line
                         matchString = ((prop === 'month') && (!parseOptions.isIslamic) && (parseOptions.culture === 'en' || parseOptions.culture === 'en-GB' || parseOptions.culture === 'en-US'))
                             ? matchString[0].toUpperCase() + matchString.substring(1).toLowerCase() : matchString;
+                        // eslint-disable-next-line
                         matchString = ((prop !== 'month') && (prop === 'designator') && parseOptions.culture && parseOptions.culture.indexOf('en-') !== -1 && cultureOptions.indexOf(parseOptions.culture) === -1)
                             ? matchString.toLowerCase() : matchString;
                         // eslint-disable-next-line
@@ -2146,6 +2151,7 @@ class DateParser {
 }
 
 const regExp$1 = RegExp;
+// eslint-disable-next-line
 const parseRegex = new regExp$1('^([^0-9]*)' + '(([0-9,]*[0-9]+)(\.[0-9]+)?)' + '([Ee][+-]?[0-9]+)?([^0-9]*)$');
 const groupRegex = /,/g;
 const keys = ['minusSign', 'infinity'];
@@ -2444,10 +2450,12 @@ class Observer {
      * @returns {void} ?
      */
     offIntlEvents() {
-        let eventsArr = this.boundedEvents['notifyExternalChange'];
+        // eslint-disable-next-line
+        const eventsArr = this.boundedEvents['notifyExternalChange'];
         if (eventsArr) {
             for (let i = 0; i < eventsArr.length; i++) {
-                let curContext = eventsArr[`${i}`].context;
+                // eslint-disable-next-line
+                const curContext = eventsArr[`${i}`].context;
                 if (curContext && curContext.detectFunction && curContext.randomId && !curContext.isRendered) {
                     this.off('notifyExternalChange', curContext.detectFunction, curContext.randomId);
                     i--;
@@ -3534,7 +3542,6 @@ var IntlBase;
         const ret = {};
         const pattern = matches[1].toUpperCase();
         ret.isAccount = (pattern === 'A');
-        // eslint-disable-next-line
         ret.type = IntlBase.patternMatcher[pattern];
         if (skeleton.length > 1) {
             ret.fractionDigits = parseInt(matches[2], 10);
@@ -3622,7 +3629,6 @@ var IntlBase;
         const formatSplit = format.split(';');
         const data = ['pData', 'nData', 'zeroData'];
         for (let i = 0; i < formatSplit.length; i++) {
-            // eslint-disable-next-line
             options[data[i]] = customNumberFormat(formatSplit[i], dOptions, obj);
         }
         if (isNullOrUndefined(options.nData)) {
@@ -3682,7 +3688,6 @@ var IntlBase;
         if (!isNullOrUndefined(numObject)) {
             const symbolPattern = getSymbolPattern(cOptions.type, dOptions.numberMapper.numberSystem, numObject, false);
             if (cOptions.useGrouping) {
-                // eslint-disable-next-line
                 cOptions.groupSeparator = spaceGrouping ? ' ' : dOptions.numberMapper.numberSymbols[mapper[2]];
                 cOptions.groupData = NumberFormat.getGroupingDetails(symbolPattern.split(';')[0]);
             }
@@ -3707,9 +3712,7 @@ var IntlBase;
             const part = parts[parseInt(i.toString(), 10)];
             const loc = part.indexOf(actual);
             if ((loc !== -1) && ((loc < part.indexOf('\'')) || (loc > part.lastIndexOf('\'')))) {
-                // eslint-disable-next-line
                 options[typeMapper[i]] = part.substr(0, loc) + symbol + part.substr(loc + 1);
-                // eslint-disable-next-line
                 options[typeMapper[actual]] = true;
                 options.type = options.isCurrency ? 'currency' : 'percent';
                 break;
@@ -3748,7 +3751,6 @@ var IntlBase;
         let actualPattern = options.format || getResultantPattern(options.skeleton, dependable.dateObject, options.type);
         if (isExcelFormat) {
             actualPattern = actualPattern.replace(patternRegex, (pattern) => {
-                // eslint-disable-next-line
                 return patternMatch[pattern];
             });
             if (actualPattern.indexOf('z') !== -1) {
@@ -3781,10 +3783,8 @@ var IntlBase;
      * @param {any} option ?
      * @returns {any} ?
      */
-    // eslint-disable-next-line
     function processSymbol(actual, option) {
         if (actual.indexOf(',') !== -1) {
-            // eslint-disable-next-line
             let split = actual.split(',');
             actual = (split[0] + getValue('numberMapper.numberSymbols.group', option) +
                 split[1].replace('.', getValue('numberMapper.numberSymbols.decimal', option)));
@@ -4081,7 +4081,6 @@ class Ajax {
             if (!isNullOrUndefined(this.onUploadProgress)) {
                 this.httpRequest.upload.onprogress = this.onUploadProgress;
             }
-            // eslint-disable-next-line
             this.httpRequest.open(this.type, this.url, this.mode);
             // Set default headers
             if (!isNullOrUndefined(this.data) && this.contentType !== null) {
@@ -4696,7 +4695,8 @@ class EventHandler {
         // eslint-disable-next-line
         copyData = extend([], copyData, eventData);
         for (let i = 0; i < copyData.length; i++) {
-            element.removeEventListener(copyData[parseInt(i.toString(), 10)].name, copyData[parseInt(i.toString(), 10)].debounce);
+            const parseValue = copyData[parseInt(i.toString(), 10)];
+            element.removeEventListener(parseValue.name, parseValue.debounce);
             eventData.shift();
         }
     }
@@ -5436,12 +5436,13 @@ class Base {
     destroy() {
         // eslint-disable-next-line
         this.element.ej2_instances =
-            this.element.ej2_instances ? this.element.ej2_instances.filter((i) => {
-                if (proxyToRaw) {
-                    return proxyToRaw(i) !== proxyToRaw(this);
-                }
-                return i !== this;
-            })
+            this.element.ej2_instances ?
+                this.element.ej2_instances.filter((i) => {
+                    if (proxyToRaw) {
+                        return proxyToRaw(i) !== proxyToRaw(this);
+                    }
+                    return i !== this;
+                })
                 : [];
         removeClass([this.element], ['e-' + this.getModuleName()]);
         if (this.element.ej2_instances.length === 0) {
@@ -5503,7 +5504,7 @@ function removeChildInstance(element) {
     }
 }
 let proxyToRaw;
-let setProxyToRaw = (toRaw) => { proxyToRaw = toRaw; };
+const setProxyToRaw = (toRaw) => { proxyToRaw = toRaw; };
 
 /**
  * Returns the Class Object
@@ -5745,8 +5746,9 @@ function complexArrayDefinedCallback(dFunc, curKey, type, prop) {
         switch (dFunc) {
             case 'push':
                 for (let i = 0; i < newValue.length; i++) {
-                    Array.prototype[`${dFunc}`].apply(prop, [newValue[parseInt(i.toString(), 10)]]);
-                    const model = getArrayModel(keyString + (prop.length - 1), newValue[parseInt(i.toString(), 10)], !this.controlParent, dFunc);
+                    const newValueParse = newValue[parseInt(i.toString(), 10)];
+                    Array.prototype[`${dFunc}`].apply(prop, [newValueParse]);
+                    const model = getArrayModel(keyString + (prop.length - 1), newValueParse, !this.controlParent, dFunc);
                     this.serverDataBind(model, newValue[parseInt(i.toString(), 10)], false, dFunc);
                 }
                 break;
@@ -6513,16 +6515,16 @@ function setGlobalAnimation(value) {
 var GlobalAnimationMode;
 (function (GlobalAnimationMode) {
     /**
-    * Defines the global animation mode as Default. Animation is enabled or disabled based on the component's animation settings.
-    */
+     * Defines the global animation mode as Default. Animation is enabled or disabled based on the component's animation settings.
+     */
     GlobalAnimationMode["Default"] = "Default";
     /**
-    * Defines the global animation mode as Enable. Enables the animation for all components, regardless of the individual component's animation settings.
-    */
+     * Defines the global animation mode as Enable. Enables the animation for all components, regardless of the individual component's animation settings.
+     */
     GlobalAnimationMode["Enable"] = "Enable";
     /**
-    * Defines the global animation mode as Disable. Disables the animation for all components, regardless of the individual component's animation settings.
-    */
+     * Defines the global animation mode as Disable. Disables the animation for all components, regardless of the individual component's animation settings.
+     */
     GlobalAnimationMode["Disable"] = "Disable";
 })(GlobalAnimationMode || (GlobalAnimationMode = {}));
 
@@ -6584,6 +6586,16 @@ class ModuleLoader {
         }
         this.loadedModules = [];
     }
+    /**
+     * Returns the array of modules that are not loaded in the component library.
+     *
+     * @param {ModuleDeclaration[]} requiredModules - Array of modules to be required
+     * @returns {ModuleDeclaration[]} ?
+     * @private
+     */
+    getNonInjectedModules(requiredModules) {
+        return requiredModules.filter((module) => !this.isModuleLoaded(module.member));
+    }
     /**
      * Removes all unused modules
      *
@@ -6802,7 +6814,7 @@ class ChildProperty {
     }
 }
 
-let componentList = ['grid', 'pivotview', 'treegrid', 'spreadsheet', 'rangeNavigator', 'DocumentEditor', 'listbox', 'inplaceeditor', 'PdfViewer', 'richtexteditor', 'DashboardLayout', 'chart', 'stockChart', 'circulargauge', 'diagram', 'heatmap', 'lineargauge', 'maps', 'slider', 'smithchart', 'barcode', 'sparkline', 'treemap', 'bulletChart', 'kanban', 'daterangepicker', 'schedule', 'gantt', 'signature', 'query-builder', 'drop-down-tree', 'carousel', 'filemanager', 'uploader', 'accordion', 'tab', 'treeview'];
+const componentList = ['grid', 'pivotview', 'treegrid', 'spreadsheet', 'rangeNavigator', 'DocumentEditor', 'listbox', 'inplaceeditor', 'PdfViewer', 'richtexteditor', 'DashboardLayout', 'chart', 'stockChart', 'circulargauge', 'diagram', 'heatmap', 'lineargauge', 'maps', 'slider', 'smithchart', 'barcode', 'sparkline', 'treemap', 'bulletChart', 'kanban', 'daterangepicker', 'schedule', 'gantt', 'signature', 'query-builder', 'drop-down-tree', 'carousel', 'filemanager', 'uploader', 'accordion', 'tab', 'treeview'];
 const bypassKey = [115, 121, 110, 99, 102, 117, 115, 105,
     111, 110, 46, 105, 115, 76, 105, 99, 86, 97, 108,
     105, 100, 97, 116, 101, 100];
@@ -6816,7 +6828,7 @@ class LicenseValidator {
     constructor(key) {
         this.isValidated = false;
         this.isLicensed = true;
-        this.version = '24';
+        this.version = '25';
         this.platform = /JavaScript|ASPNET|ASPNETCORE|ASPNETMVC|FileFormats|essentialstudio/i;
         this.errors = {
             noLicense: '<span>This application was built using a trial version of Syncfusion Essential Studio.' +
@@ -6869,11 +6881,13 @@ class LicenseValidator {
     }
     /**
      * To validate the provided license key.
-    */
+     *
+     * @returns {boolean} ?
+     */
     validate() {
-        let contentKey = [115, 121, 110, 99, 102, 117, 115, 105, 111, 110, 46,
+        const contentKey = [115, 121, 110, 99, 102, 117, 115, 105, 111, 110, 46,
             108, 105, 99, 101, 110, 115, 101, 67, 111, 110, 116, 101, 110, 116];
-        let URLKey = [115, 121, 110, 99, 102, 117, 115, 105, 111, 110, 46,
+        const URLKey = [115, 121, 110, 99, 102, 117, 115, 105, 111, 110, 46,
             99, 108, 97, 105, 109, 65, 99, 99, 111, 117, 110, 116, 85, 82, 76];
         if (!this.isValidated && (containerObject && !getValue(convertToChar(bypassKey), containerObject) && !getValue('Blazor', containerObject))) {
             let validateMsg;
@@ -6907,7 +6921,7 @@ class LicenseValidator {
                 }
             }
             else {
-                let licenseContent = getValue(convertToChar(contentKey), containerObject);
+                const licenseContent = getValue(convertToChar(contentKey), containerObject);
                 validateURL = getValue(convertToChar(URLKey), containerObject);
                 if (licenseContent && licenseContent !== '') {
                     validateMsg = licenseContent;
@@ -6917,7 +6931,7 @@ class LicenseValidator {
                 }
             }
             if (validateMsg && typeof document !== 'undefined' && !isNullOrUndefined(document)) {
-                accountURL = (validateURL && validateURL !== '') ? validateURL : "https://www.syncfusion.com/account/claim-license-key?pl=SmF2YVNjcmlwdA==&vs=MjQ=&utm_source=es_license_validation_banner&utm_medium=listing&utm_campaign=license-information";
+                accountURL = (validateURL && validateURL !== '') ? validateURL : 'https://www.syncfusion.com/account/claim-license-key?pl=SmF2YVNjcmlwdA==&vs=MjU=&utm_source=es_license_validation_banner&utm_medium=listing&utm_campaign=license-information';
                 const errorDiv = createElement('div', {
                     innerHTML: `<img src='data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgY2xpcC1wYXRoPSJ1cmwoI2NsaXAwXzE5OV80KSI+CjxwYXRoIGQ9Ik0xMiAyMUMxNi45NzA2IDIxIDIxIDE2Ljk3MDYgMjEgMTJDMjEgNy4wMjk0NCAxNi45NzA2IDMgMTIgM0M3LjAyOTQ0IDMgMyA3LjAyOTQ0IDMgMTJDMyAxNi45NzA2IDcuMDI5NDQgMjEgMTIgMjFaIiBzdHJva2U9IiM3MzczNzMiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMS4yNSAxMS4yNUgxMlYxNi41SDEyLjc1IiBmaWxsPSIjNjE2MDYzIi8+CjxwYXRoIGQ9Ik0xMS4yNSAxMS4yNUgxMlYxNi41SDEyLjc1IiBzdHJva2U9IiM3MzczNzMiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0xMS44MTI1IDlDMTIuNDMzOCA5IDEyLjkzNzUgOC40OTYzMiAxMi45Mzc1IDcuODc1QzEyLjkzNzUgNy4yNTM2OCAxMi40MzM4IDYuNzUgMTEuODEyNSA2Ljc1QzExLjE5MTIgNi43NSAxMC42ODc1IDcuMjUzNjggMTAuNjg3NSA3Ljg3NUMxMC42ODc1IDguNDk2MzIgMTEuMTkxMiA5IDExLjgxMjUgOVoiIGZpbGw9IiM3MzczNzMiLz4KPC9nPgo8ZGVmcz4KPGNsaXBQYXRoIGlkPSJjbGlwMF8xOTlfNCI+CjxyZWN0IHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgZmlsbD0id2hpdGUiLz4KPC9jbGlwUGF0aD4KPC9kZWZzPgo8L3N2Zz4K' style="top: 6px;
                     position: absolute;
@@ -6997,7 +7011,7 @@ class LicenseValidator {
                     const charKey = decodeStr[decodeStr.length - 1];
                     const decryptedKey = [];
                     for (let i = 0; i < decodeStr.length; i++) {
-                        decryptedKey[parseInt(i.toString(), 10)] = decodeStr[parseInt(i.toString(), 10)].charCodeAt(0) - charKey.charCodeAt(0);
+                        decryptedKey[`${i}`] = decodeStr[`${i}`].charCodeAt(0) - charKey.charCodeAt(0);
                     }
                     for (let i = 0; i < decryptedKey.length; i++) {
                         buffr += String.fromCharCode(decryptedKey[parseInt(i.toString(), 10)]);
@@ -7034,7 +7048,7 @@ let licenseValidator = new LicenseValidator();
  * Converts the given number to characters.
  *
  * @param {number} cArr - Specifies the license key as number.
- * @returns {string}
+ * @returns {string} ?
  */
 function convertToChar(cArr) {
     let ret = '';
@@ -7063,7 +7077,7 @@ const getVersion = () => {
 };
 // Method for create overlay over the sample
 const createLicenseOverlay = () => {
-    let bannerTemplate = `
+    const bannerTemplate = `
     <div style="
     position: fixed;
     width: 100%;
@@ -7257,7 +7271,7 @@ let Component = class Component extends Base {
         // tslint:disable-next-line:no-function-constructor-with-string-args
         onIntlChange.on('notifyExternalChange', this.detectFunction, this, this.randomId);
         // Based on the considered control list we have count the instance
-        if (typeof window !== "undefined" && typeof document !== "undefined" && !validateLicense()) {
+        if (typeof window !== 'undefined' && typeof document !== 'undefined' && !validateLicense()) {
             if (componentList.indexOf(this.getModuleName()) !== -1) {
                 instancecount = instancecount + 1;
                 if (instancecount > 5) {
@@ -7347,6 +7361,8 @@ let Component = class Component extends Base {
     }
     /**
      * Adding unload event to persist data when enable persistence true
+     *
+     * @returns {void}
      */
     attachUnloadEvent() {
         this.handleUnload = this.handleUnload.bind(this);
@@ -7354,12 +7370,16 @@ let Component = class Component extends Base {
     }
     /**
      * Handling unload event to persist data when enable persistence true
+     *
+     * @returns {void}
      */
     handleUnload() {
         this.setPersistData();
     }
     /**
      * Removing unload event to persist data when enable persistence true
+     *
+     * @returns {void}
      */
     detachUnloadEvent() {
         window.removeEventListener('unload', this.handleUnload);
@@ -7394,7 +7414,31 @@ let Component = class Component extends Base {
             }
             this.preRender();
             this.injectModules();
-            // Checked weather cases are valid or not. If control leads to more than five counts  
+            // Throw a warning for the required modules to be injected.
+            const ignoredComponents = {
+                schedule: 'all',
+                diagram: 'all',
+                PdfViewer: 'all',
+                grid: ['logger'],
+                richtexteditor: ['link', 'table', 'image', 'audio', 'video', 'formatPainter', 'emojiPicker', 'pasteCleanup', 'htmlEditor', 'toolbar'],
+                treegrid: ['filter'],
+                gantt: ['tooltip'],
+                chart: ['Export', 'Zoom'],
+                accumulationchart: ['Export']
+            };
+            const component = this.getModuleName();
+            if (this.requiredModules && (!ignoredComponents[`${component}`] || ignoredComponents[`${component}`] !== 'all')) {
+                const modulesRequired = this.requiredModules();
+                for (const module of this.moduleLoader.getNonInjectedModules(modulesRequired)) {
+                    const moduleName = module.name ? module.name : module.member;
+                    if (ignoredComponents[`${component}`] && ignoredComponents[`${component}`].indexOf(module.member) !== -1) {
+                        continue;
+                    }
+                    const componentName = component.charAt(0).toUpperCase() + component.slice(1); // To capitalize the component name
+                    console.warn(`[WARNING] :: Module "${moduleName}" is not available in ${componentName} component! You either misspelled the module name or forgot to load it.`);
+                }
+            }
+            // Checked weather cases are valid or not. If control leads to more than five counts
             if (!isvalid && !isBannerAdded) {
                 createLicenseOverlay();
                 isBannerAdded = true;
@@ -7805,6 +7849,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
             return this.getScrollableParent(element.parentNode, axis);
         }
     }
+    /* eslint-disable */
     getScrollableValues() {
         this.parentScrollX = 0;
         this.parentScrollY = 0;
@@ -7812,6 +7857,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         const verticalScrollParent = this.getScrollableParent(this.element.parentNode, 'vertical');
         const horizontalScrollParent = this.getScrollableParent(this.element.parentNode, 'horizontal');
     }
+    /* eslint-enable */
     initialize(evt, curTarget) {
         this.currentStateTarget = evt.target;
         if (this.isDragStarted()) {
@@ -7825,6 +7871,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         this.dragProcessStarted = false;
         if (this.abort) {
             /* tslint:disable no-any */
+            // eslint-disable-next-line
             let abortSelectors = this.abort;
             if (typeof abortSelectors === 'string') {
                 abortSelectors = [abortSelectors];
@@ -7895,6 +7942,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         }
         /* istanbul ignore next */
         if (this.isReplaceDragEle) {
+            // eslint-disable-next-line
             element = this.currentStateCheck(evt.target, element);
         }
         this.offset = this.calculateParentPosition(element);
@@ -8047,6 +8095,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
                 }
             }
             if (flag) {
+                // eslint-disable-next-line
                 eleObj.instance.dragData[this.scope] = this.droppables[this.scope];
                 eleObj.instance.intOver(evt, eleObj.target);
                 this.hoverObject = eleObj;
@@ -8125,7 +8174,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         }
         else {
             if (this.dragArea) {
-                let isDialogEle = this.helperElement.classList.contains('e-dialog');
+                const isDialogEle = this.helperElement.classList.contains('e-dialog');
                 this.dragLimit.top = this.clone ? this.dragLimit.top : 0;
                 draEleTop = (top - iTop) < 0 ? this.dragLimit.top : (top - iTop);
                 draEleLeft = (left - iLeft) < 0 ? isDialogEle ? (left - (iLeft - this.borderWidth.left)) :
@@ -8196,6 +8245,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
                 elements = this.getPathElements(evt);
             }
             /* tslint:disable no-any */
+            // eslint-disable-next-line
             let scrollParent = this.getScrollParent(elements, false);
             if (this.elementInViewport(this.helperElement)) {
                 this.getScrollPosition(scrollParent, draEleTop);
@@ -8218,8 +8268,10 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         this.pageY = pagey;
     }
     /* tslint:disable no-any */
+    // eslint-disable-next-line
     getScrollParent(node, reverse) {
         /* tslint:disable no-any */
+        // eslint-disable-next-line
         const nodeEl = reverse ? node.reverse() : node;
         let hasScroll;
         for (let i = nodeEl.length - 1; i >= 0; i--) {
@@ -8246,10 +8298,12 @@ let Draggable = Draggable_1 = class Draggable extends Base {
             }
         }
         else if (nodeEle && nodeEle !== document.scrollingElement) {
-            if ((nodeEle.clientHeight + nodeEle.getBoundingClientRect().top - this.helperElement.clientHeight + document.scrollingElement.scrollTop) < draEleTop) {
+            const docScrollTop = document.scrollingElement.scrollTop;
+            const helperClientHeight = this.helperElement.clientHeight;
+            if ((nodeEle.clientHeight + nodeEle.getBoundingClientRect().top - helperClientHeight + docScrollTop) < draEleTop) {
                 nodeEle.scrollTop += this.helperElement.clientHeight;
             }
-            else if (nodeEle.getBoundingClientRect().top > (draEleTop - this.helperElement.clientHeight - document.scrollingElement.scrollTop)) {
+            else if (nodeEle.getBoundingClientRect().top > (draEleTop - helperClientHeight - docScrollTop)) {
                 nodeEle.scrollTop -= this.helperElement.clientHeight;
             }
         }
@@ -8301,6 +8355,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         const eleObj = this.checkTargetElement(evt);
         if (eleObj.target && eleObj.instance) {
             eleObj.instance.dragStopCalled = true;
+            // eslint-disable-next-line
             eleObj.instance.dragData[this.scope] = this.droppables[this.scope];
             eleObj.instance.intDrop(evt, eleObj.target);
         }
@@ -8308,8 +8363,11 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         document.body.classList.remove('e-prevent-select');
     }
     /**
+     * @param {MouseEvent | TouchEvent} evt ?
+     * @returns {void}
      * @private
      */
+    // eslint-disable-next-line
     intDestroy(evt) {
         this.dragProcessStarted = false;
         this.toggleEvents();
@@ -8324,6 +8382,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         }
     }
     // triggers when property changed
+    // eslint-disable-next-line
     onPropertyChanged(newProp, oldProp) {
         //No Code to handle
     }
@@ -8354,6 +8413,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
             eleWidthBound = ele.scrollWidth ? ele.scrollWidth : elementArea.right - elementArea.left;
             eleHeightBound = ele.scrollHeight ? (this.dragArea && !isNullOrUndefined(this.helperElement) && this.helperElement.classList.contains('e-treeview')) ? ele.clientHeight : ele.scrollHeight : elementArea.bottom - elementArea.top;
             const keys = ['Top', 'Left', 'Bottom', 'Right'];
+            /* eslint-disable */
             const styles = getComputedStyle(ele);
             for (let i = 0; i < keys.length; i++) {
                 const key = keys[parseInt(i.toString(), 10)];
@@ -8363,6 +8423,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
                 this.borderWidth[`${lowerKey}`] = isNaN(parseFloat(tborder)) ? 0 : parseFloat(tborder);
                 this.padding[`${lowerKey}`] = isNaN(parseFloat(tpadding)) ? 0 : parseFloat(tpadding);
             }
+            /* eslint-enable */
             if (this.dragArea && !isNullOrUndefined(this.helperElement) && this.helperElement.classList.contains('e-treeview')) {
                 top = elementArea.top + document.scrollingElement.scrollTop;
             }
@@ -8380,7 +8441,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
         const intCoord = this.getCoordinates(evt);
         let ele;
         const prevStyle = this.helperElement.style.pointerEvents || '';
-        let isPointer = evt.type.indexOf('pointer') !== -1 && Browser.info.name === 'safari' && parseInt(Browser.info.version) > 12;
+        const isPointer = evt.type.indexOf('pointer') !== -1 && Browser.info.name === 'safari' && parseInt(Browser.info.version, 10) > 12;
         if (compareElementParent(evt.target, this.helperElement) || evt.type.indexOf('touch') !== -1 || isPointer) {
             this.helperElement.style.pointerEvents = 'none';
             ele = document.elementFromPoint(intCoord.clientX, intCoord.clientY);
@@ -8404,6 +8465,7 @@ let Draggable = Draggable_1 = class Draggable extends Base {
     }
     getMousePosition(evt, isdragscroll) {
         /* tslint:disable no-any */
+        // eslint-disable-next-line
         const dragEle = evt.srcElement !== undefined ? evt.srcElement : evt.target;
         const intCoord = this.getCoordinates(evt);
         let pageX;
@@ -8421,10 +8483,11 @@ let Draggable = Draggable_1 = class Draggable extends Base {
             pageY = this.clone ? intCoord.pageY : (intCoord.pageY + window.pageYOffset) - this.relativeYPosition;
         }
         if (document.scrollingElement && (!isdragscroll && !this.clone)) {
-            let isVerticalScroll = document.scrollingElement.scrollHeight > 0 && document.scrollingElement.scrollHeight > document.scrollingElement.clientHeight && document.scrollingElement.scrollTop > 0;
-            let isHorrizontalScroll = document.scrollingElement.scrollWidth > 0 && document.scrollingElement.scrollWidth > document.scrollingElement.clientWidth && document.scrollingElement.scrollLeft > 0;
-            pageX = isHorrizontalScroll ? pageX - document.scrollingElement.scrollLeft : pageX;
-            pageY = isVerticalScroll ? pageY - document.scrollingElement.scrollTop : pageY;
+            const ele = document.scrollingElement;
+            const isVerticalScroll = ele.scrollHeight > 0 && ele.scrollHeight > ele.clientHeight && ele.scrollTop > 0;
+            const isHorrizontalScroll = ele.scrollWidth > 0 && ele.scrollWidth > ele.clientWidth && ele.scrollLeft > 0;
+            pageX = isHorrizontalScroll ? pageX - ele.scrollLeft : pageX;
+            pageY = isVerticalScroll ? pageY - ele.scrollTop : pageY;
         }
         return {
             left: pageX - (this.margin.left + this.cursorAt.left),
@@ -9362,7 +9425,7 @@ function compile$1(template, helper, ignorePrefix) {
     else {
         const argName = 'data';
         const evalExpResult = evalExp(template, argName, helper, ignorePrefix);
-        // eslint-disable-next-line
+        /* eslint-disable */
         const condtion = `var valueRegEx = (/value=\\'([A-Za-z0-9 _]*)((.)([\\w)(!-;?-■\\s]+)['])/g);
         var hrefRegex = (/(?:href)([\\s='"./]+)([\\w-./?=&\\\\#"]+)((.)([\\w)(!-;/?-■\\s]+)['])/g);
         if(str.match(valueRegEx)){
@@ -9393,6 +9456,7 @@ function compile$1(template, helper, ignorePrefix) {
         }
         `;
         const fnCode = 'var str=\"' + evalExpResult + '\";' + condtion + ' return str;';
+        /* eslint-enable */
         const fn = new Function(argName, fnCode);
         return fn.bind(helper);
     }
@@ -9539,7 +9603,7 @@ function evalExp(str, nameSpace, helper, ignorePrefix) {
  * @returns {string} ?
  */
 function addNameSpace(str, addNS, nameSpace, ignoreList, ignorePrefix) {
-    return ((addNS && !(NOT_NUMBER.test(str)) && ignoreList.indexOf(str.split('.')[0]) === -1 && !ignorePrefix && str !== "true" && str !== "false") ? nameSpace + '.' + str : str);
+    return ((addNS && !(NOT_NUMBER.test(str)) && ignoreList.indexOf(str.split('.')[0]) === -1 && !ignorePrefix && str !== 'true' && str !== 'false') ? nameSpace + '.' + str : str);
 }
 /**
  *
@@ -9761,6 +9825,7 @@ function getTemplateEngine() {
  * @returns {Function} ?
  * @private
  */
+// eslint-disable-next-line
 function initializeCSPTemplate(template, helper) {
     let boundFunc;
     template.prototype.CSPTemplate = true;
@@ -9901,6 +9966,9 @@ class SanitizeHtmlHelper {
         };
     }
     static sanitize(value) {
+        if (isNullOrUndefined(value)) {
+            return value;
+        }
         const item = this.beforeSanitize();
         const output = this.serializeValue(item, value);
         return output;
@@ -9915,6 +9983,7 @@ class SanitizeHtmlHelper {
         this.removeXssAttrs();
         const tempEleValue = this.wrapElement.innerHTML;
         this.removeElement();
+        this.wrapElement = null;
         return tempEleValue.replace(/&amp;/g, '&');
     }
     static removeElement() {