@syncfusion/ej2-dropdowns 34.2.5 → 34.2.7

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

@@ -3885,6 +3885,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         this.bindClearEvent();
     };
     DropDownList.prototype.windowResize = function () {
+        this.updateFloatLabelOverflowWidth();
         if (this.isPopupOpen) {
             this.popupObj.refreshPosition(this.inputWrapper.container);
         }
@@ -4684,7 +4685,8 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
     };
     DropDownList.prototype.onDocumentClick = function (e) {
         var target = e.target;
-        if (!(!isNullOrUndefined(this.popupObj) && closest(target, this.checkSelector(this.popupObj.element.id))) &&
+        if (!isNullOrUndefined(target) && !(!isNullOrUndefined(this.popupObj) &&
+            closest(target, this.checkSelector(this.popupObj.element.id))) &&
             !isNullOrUndefined(this.inputWrapper) && !this.inputWrapper.container.contains(e.target)) {
             if (this.inputWrapper.container.classList.contains(dropDownListClasses.inputFocus) || this.isPopupOpen) {
                 this.isDocumentClick = true;
@@ -6343,7 +6345,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                 ulElement = null;
             },
             targetExitViewport: function () {
-                _this.hidePopup();
+                if (!Browser.isDevice || (_this.allowFiltering === false && _this.isPopupOpen)) {
+                    _this.hidePopup();
+                }
             }
         });
     };
@@ -8316,6 +8320,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         _this.isNodeChecked = false;
         _this.isFromFilterChange = false;
         _this.fallbackValue = [];
+        _this.uncheckedNodeId = null;
         return _this;
     }
     /**
@@ -10474,6 +10479,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         var eventArgs = this.getEventArgs(args);
         this.trigger('select', eventArgs);
         this.isNodeChecked = args.action === 'check';
+        this.uncheckedNodeId = args.action === 'uncheck' && !isNullOrUndefined(args.data[0]) ?
+            getValue('id', args.data[0]).toString() : null;
         if (this.isFilteredData && args.action === 'uncheck') {
             var id = getValue('id', args.data[0]).toString();
             this.removeSelectedData(id, true);
@@ -10506,21 +10513,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             this.triggerChangeEvent(this.keyEventArgs);
             this.isValueChange = false;
         }
-        if (!this.isRemoteData && !this.treeSettings.loadOnDemand) {
-            var treeData = this.treeObj.getTreeData();
-            if (this.showCheckBox && this.treeSettings.autoCheck &&
-                treeData.length > 0 && this.treeData && this.treeData.length > 0) {
-                for (var i = 0; i < treeData.length; i++) {
-                    for (var j = 0; j < this.treeData.length; j++) {
-                        if (treeData[i][this.fields.value] === this.treeData[j][this.fields.value]) {
-                            this.treeData[j].selected = treeData[i].selected !== undefined ?
-                                treeData[i].selected : false;
-                        }
-                    }
-                }
-            }
-        }
         this.updateIndeterminateNodes();
+        this.uncheckedNodeId = null;
     };
     DropDownTree.prototype.beforeCheck = function (args) {
         if (args.isInteracted) {
@@ -10814,15 +10808,13 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             }
         }
     };
-    DropDownTree.prototype.getFilteredTreeData = function () {
-        return this.treeData;
-    };
     DropDownTree.prototype.getChildren = function (parentId, result) {
         var _this = this;
-        var treeData = this.getFilteredTreeData();
-        treeData.forEach(function (item) {
-            if (!isNullOrUndefined(item) && !isNullOrUndefined(item.pid) && !isNullOrUndefined(item.id) && item.pid.toString() === parentId.toString()) {
-                var childId = item.id.toString();
+        this.treeData.forEach(function (item) {
+            var itemId = !isNullOrUndefined(item) ? getValue(_this.fields.value, item) : null;
+            var itemPid = !isNullOrUndefined(item) ? getValue(_this.fields.parentValue, item) : null;
+            if (!isNullOrUndefined(itemId) && !isNullOrUndefined(itemPid) && itemPid.toString() === parentId.toString()) {
+                var childId = itemId.toString();
                 if (result.indexOf(childId) === -1) {
                     result.push(childId);
                     _this.getChildren(childId, result);
@@ -10831,41 +10823,17 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         });
     };
     DropDownTree.prototype.getDirectChildren = function (parentId) {
-        return this.getFilteredTreeData()
+        var _this = this;
+        return this.treeData
             .filter(function (childNode) {
-            return !isNullOrUndefined(childNode) && !isNullOrUndefined(childNode.pid) && !isNullOrUndefined(childNode.id) && childNode.pid.toString() === parentId;
+            var childId = !isNullOrUndefined(childNode) ? getValue(_this.fields.value, childNode) : null;
+            var childPid = !isNullOrUndefined(childNode) ? getValue(_this.fields.parentValue, childNode) : null;
+            return !isNullOrUndefined(childId) && !isNullOrUndefined(childPid) && childPid.toString() === parentId;
         })
-            .map(function (childNode) { return childNode.id.toString(); });
-    };
-    DropDownTree.prototype.restoreRootParentValues = function () {
-        var _this = this;
-        var treeData = this.getFilteredTreeData();
-        treeData.forEach(function (node) {
-            if (isNullOrUndefined(node) || isNullOrUndefined(node.id)) {
-                return;
-            }
-            if (isNullOrUndefined(node.pid)) {
-                var rootId = node.id.toString();
-                var currentValues_1 = _this.value.map(function (item) {
-                    return item.toString();
-                });
-                if (currentValues_1.indexOf(rootId) === -1) {
-                    var childValues = [];
-                    _this.getChildren(rootId, childValues);
-                    var hasSelectedChild = childValues.some(function (childId) { return currentValues_1.indexOf(childId) !== -1; });
-                    if (hasSelectedChild) {
-                        _this.value.push(rootId);
-                    }
-                }
-            }
-        });
+            .map(function (childNode) { return getValue(_this.fields.value, childNode).toString(); });
     };
     DropDownTree.prototype.updateFilteredAutoCheckValues = function () {
         var _this = this;
-        var treeData = this.getFilteredTreeData();
-        if (!this.isNodeChecked && Array.isArray(this.value) && this.value.length > 0 && this.showCheckBox) {
-            this.restoreRootParentValues();
-        }
         var currentValues = Array.isArray(this.value) ? this.value.map(function (item) { return item.toString(); }) : [];
         var removeParent = function (parentId) {
             _this.value = _this.value.filter(function (value) { return value.toString() !== parentId; });
@@ -10876,12 +10844,14 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                     _this.value.push(value);
                 }
             });
-            treeData.forEach(function (node) {
-                if (isNullOrUndefined(node) || isNullOrUndefined(node.id)) {
+            this.treeData.forEach(function (node) {
+                var nodeId = isNullOrUndefined(node) ? null : getValue(_this.fields.value, node);
+                var nodeHasChild = !isNullOrUndefined(node) && !!_this.fields.hasChildren && getValue(_this.fields.hasChildren, node) === true;
+                if (isNullOrUndefined(nodeId)) {
                     return;
                 }
-                var parentId = node.id.toString();
-                if (node.haschild && _this.value.indexOf(parentId) !== -1) {
+                var parentId = nodeId.toString();
+                if (nodeHasChild && _this.value.indexOf(parentId) !== -1) {
                     var childValues = [];
                     _this.getChildren(parentId, childValues);
                     if (_this.value.indexOf(parentId) === -1) {
@@ -10895,14 +10865,16 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                 }
                 currentValues = _this.value.map(function (item) { return item.toString(); });
             });
-            treeData.forEach(function (node) {
-                if (isNullOrUndefined(node) || isNullOrUndefined(node.id)) {
+            this.treeData.forEach(function (node) {
+                var nodeId = isNullOrUndefined(node) ? null : getValue(_this.fields.value, node);
+                var nodeHasChild = !isNullOrUndefined(node) && !!_this.fields.hasChildren && getValue(_this.fields.hasChildren, node) === true;
+                if (isNullOrUndefined(nodeId)) {
                     return;
                 }
-                if (!node.haschild) {
+                if (!nodeHasChild) {
                     return;
                 }
-                var parentId = node.id.toString();
+                var parentId = nodeId.toString();
                 var directChildren = _this.getDirectChildren(parentId);
                 if (!directChildren.length) {
                     return;
@@ -10936,14 +10908,19 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             return;
         }
         var removeValues = [];
-        treeData.forEach(function (node) {
-            if (isNullOrUndefined(node.id)) {
+        this.treeData.forEach(function (node) {
+            var nodeId = isNullOrUndefined(node) ? null : getValue(_this.fields.value, node);
+            var nodeHasChild = !isNullOrUndefined(node) && !!_this.fields.hasChildren && getValue(_this.fields.hasChildren, node) === true;
+            if (isNullOrUndefined(nodeId)) {
+                return;
+            }
+            if (!nodeHasChild) {
                 return;
             }
-            if (!node.haschild) {
+            var parentId = nodeId.toString();
+            if (parentId !== _this.uncheckedNodeId) {
                 return;
             }
-            var parentId = node.id.toString();
             if (currentValues.indexOf(parentId) === -1) {
                 var childValues = [];
                 _this.getChildren(parentId, childValues);
@@ -10959,18 +10936,20 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         var stabilized = false;
         var valueBeforeReconciliation = this.value.slice();
         var iterationCount = 0;
-        var maxIterations = treeData.length + 1;
+        var maxIterations = this.treeData.length + 1;
         while (!stabilized && iterationCount < maxIterations) {
             stabilized = true;
             iterationCount++;
-            treeData.forEach(function (node) {
-                if (isNullOrUndefined(node) || isNullOrUndefined(node.id)) {
+            this.treeData.forEach(function (node) {
+                var nodeId = isNullOrUndefined(node) ? null : getValue(_this.fields.value, node);
+                var nodeHasChild = !isNullOrUndefined(node) && !!_this.fields.hasChildren && getValue(_this.fields.hasChildren, node) === true;
+                if (isNullOrUndefined(nodeId)) {
                     return;
                 }
-                if (!node.haschild) {
+                if (!nodeHasChild) {
                     return;
                 }
-                var parentId = node.id.toString();
+                var parentId = nodeId.toString();
                 var directChildren = _this.getDirectChildren(parentId);
                 if (!directChildren.length) {
                     return;
@@ -14185,6 +14164,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
     };
     MultiSelect.prototype.onPopupShown = function (e) {
         var _this = this;
+        this.sanitizeData();
         if (Browser.isDevice && (this.mode === 'CheckBox' && this.allowFiltering)) {
             // eslint-disable-next-line @typescript-eslint/no-this-alias
             var proxy_1 = this;
@@ -15809,7 +15789,10 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             }
         }
         this.UpdateSkeleton();
-        var scrollEle = this.ulElement.querySelectorAll('li.' + dropDownBaseClasses.li
+        var hasOnlyVirtualItems = this.ulElement && this.ulElement.querySelector('li.e-virtual-list') &&
+            this.ulElement.querySelectorAll('li:not(.e-virtual-list)').length === 0;
+        var targetElement = hasOnlyVirtualItems ? this.list : this.ulElement;
+        var scrollEle = targetElement.querySelectorAll('li.' + dropDownBaseClasses.li
             + ':not(.' + HIDE_LIST + ')' + ':not(.e-reorder-hide)');
         if (scrollEle.length > 0) {
             var element = scrollEle[(isHome) ? 0 : (scrollEle.length - 1)];
@@ -17703,6 +17686,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
     };
     MultiSelect.prototype.windowResize = function () {
         this.refreshPopup();
+        this.calculateWidth();
+        this.updateFloatLabelOverflowWidth();
         if ((!this.inputFocus || this.mode === 'CheckBox') && this.viewWrapper && this.viewWrapper.parentElement) {
             this.updateDelimView();
         }
@@ -17932,6 +17917,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
         this.preventSetCurrentData = false;
         this.initializeData();
+        this.sanitizeData();
         this.updateDataAttribute(this.htmlAttributes);
         _super.prototype.preRender.call(this);
     };
@@ -17962,6 +17948,56 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             endIndex: this.itemCount
         };
     };
+    MultiSelect.prototype.sanitizeData = function () {
+        if (this.enableVirtualization && this.mode === 'CheckBox') {
+            if (this.dataSource && Array.isArray(this.dataSource) && !(this.dataSource instanceof DataManager)) {
+                var cleanedDataSource = [];
+                for (var i = 0; i < this.dataSource.length; i++) {
+                    var item = this.dataSource[i];
+                    if (item !== null && item !== undefined && item !== '') {
+                        if (typeof item === 'object') {
+                            var itemValue = getValue((this.fields.value ? this.fields.value : 'value'), item);
+                            if (this.fields.value !== null) {
+                                if (itemValue !== null && itemValue !== undefined && itemValue !== '') {
+                                    cleanedDataSource.push(item);
+                                }
+                            }
+                            else {
+                                cleanedDataSource.push(item);
+                            }
+                        }
+                        else if (typeof item === 'string') {
+                            if (item !== null && item !== undefined && item.trim() !== '') {
+                                cleanedDataSource.push(item);
+                            }
+                        }
+                        else {
+                            cleanedDataSource.push(item);
+                        }
+                    }
+                }
+                if (cleanedDataSource.length !== this.dataSource.length) {
+                    this.setProperties({ dataSource: cleanedDataSource }, true);
+                }
+            }
+            if (this.value && Array.isArray(this.value) && this.value.length > 0) {
+                var cleanedValue = [];
+                for (var i = 0; i < this.value.length; i++) {
+                    var val = this.value[i];
+                    if (val !== null && val !== undefined && val !== '') {
+                        cleanedValue.push(val);
+                    }
+                }
+                if (cleanedValue.length !== this.value.length) {
+                    this.setProperties({ value: cleanedValue }, true);
+                }
+            }
+            return true;
+        }
+        else {
+            return false;
+        }
+    };
     MultiSelect.prototype.updateData = function (delimiterChar, e, isInitialVirtualData) {
         var data = '';
         var delim = this.mode === 'Delimiter' || this.mode === 'CheckBox';
@@ -18112,6 +18148,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             || this.list.querySelector('.e-ul') && this.list.querySelector('.e-ul').childElementCount === 0)) {
             isEmptyData = true;
         }
+        this.sanitizeData();
         _super.prototype.render.call(this, null, isEmptyData);
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         this.totalItemCount = this.dataSource && this.dataSource.length ? this.dataSource.length : 0;
@@ -19850,6 +19887,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             switch (prop) {
                 case 'query':
                 case 'dataSource':
+                    this.sanitizeData();
                     if (this.mode === 'CheckBox' && this.showSelectAll) {
                         if (!isNullOrUndefined(this.popupObj)) {
                             this.popupObj.destroy();
@@ -19872,6 +19910,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     this.updateVal(this.value, this.value, 'text');
                     break;
                 case 'value':
+                    this.sanitizeData();
                     if (this.fields.disabled) {
                         this.removeDisabledItemsValue(this.value);
                     }
@@ -20308,6 +20347,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
         this.firstItem = this.dataSource && this.dataSource.length > 0 ? this.dataSource[0] : null;
         var args = { cancel: false };
+        var oldValue = extend([], this.value, [], true);
+        var oldData = extend([], this.dataSource, [], true);
         this.trigger('beforeOpen', args, function (args) {
             if (!args.cancel) {
                 if (!_this.ulElement) {
@@ -20319,6 +20360,50 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     if (_this.inputElement && _this.mode !== 'CheckBox') {
                         _this.focusIn();
                     }
+                    if (_this.enableVirtualization && _this.mode === 'CheckBox') {
+                        if (JSON.stringify(oldData) !== JSON.stringify(_this.dataSource) && _this.sanitizeData() && _this.showSelectAll) {
+                            _this.renderPopup();
+                        }
+                        if (!isNullOrUndefined(oldValue) && !isNullOrUndefined(_this.value) &&
+                            JSON.stringify(oldValue) !== JSON.stringify(_this.value) && _this.sanitizeData()) {
+                            if (_this.fields.disabled) {
+                                _this.removeDisabledItemsValue(_this.value);
+                            }
+                            if (!_this.validateValues(_this.value, oldValue)) {
+                                return;
+                            }
+                            if (_this.isVue && !_this.changeOnBlur && !_this.validateValues(_this.value, oldValue)) {
+                                return;
+                            }
+                            _this.updateVal(_this.value, oldValue, 'value', _this.enableVirtualization);
+                            _this.addValidInputClass();
+                            if (_this.showSelectAll) {
+                                _this.renderPopup();
+                                var totalCount = _this.dataSource instanceof DataManager ? 0 :
+                                    _this.dataSource.length;
+                                var selectedCount = _this.value ? _this.value.length : 0;
+                                if (selectedCount === totalCount) {
+                                    var frame = null;
+                                    if (_this.popupObj) {
+                                        frame = _this.popupObj.element.querySelector('.e-selectall-parent .e-frame');
+                                    }
+                                    if (frame) {
+                                        frame.classList.add('e-check');
+                                        frame.classList.remove('e-uncheck');
+                                        frame.classList.remove('e-stop');
+                                    }
+                                }
+                            }
+                            if (!_this.closePopupOnSelect && _this.isPopupOpen()) {
+                                _this.refreshPopup();
+                            }
+                            if (_this.isPopupOpen() && _this.list && _this.list.querySelector('.e-active.e-disable')) {
+                                var activeItems = _this.list.querySelectorAll('li.' + dropDownBaseClasses.li + '.e-active' + '.e-disable');
+                                removeClass(activeItems, 'e-disable');
+                            }
+                            _this.preventChange = _this.isAngular && _this.preventChange ? !_this.preventChange : _this.preventChange;
+                        }
+                    }
                     return;
                 }
                 if (_this.mode === 'CheckBox' && Browser.isDevice && _this.allowFiltering && _this.isDeviceFullScreen) {
@@ -20475,6 +20560,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             // eslint-disable-next-line
             this.value = this.value.slice();
         }
+        this.sanitizeData();
         this.setDynValue = this.initStatus = false;
         this.isSelectAll = false;
         this.selectAllEventEle = [];
@@ -25184,7 +25270,7 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
                 ? lastWordRange.substring(lastWordRange.lastIndexOf(this.mentionChar) + 1).trim()
                 : lastWordRange.replace(this.mentionChar, '');
         }
-        if (this.queryString !== '' && e.keyCode === 8 && lastWordRange.includes(this.mentionChar) && !this.isPopupOpen &&
+        if (this.queryString !== '' && e.keyCode === 8 && lastWordRange.includes(this.mentionChar) && !this.isPopupOpen && !isNullOrUndefined(this.displayTemplate) &&
             ((typeof this.displayTemplate === 'function' ? this.displayTemplate() : this.displayTemplate)).includes(this.mentionChar)) {
             this.queryString = '';
         }