@syncfusion/ej2-dropdowns 35.1.39 → 35.1.41

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

@@ -3368,6 +3368,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
      */
     function DropDownList(options, element) {
         var _this = _super.call(this, options, element) || this;
+        _this.filterGeneration = null;
+        _this.pendingFilterRequests = 0;
+        _this.isStaleFilter = false;
         _this.isListSearched = false;
         _this.preventChange = false;
         _this.isTouched = false;
@@ -3420,6 +3423,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         this.preventAltUp = false;
         this.isCustomFilter = false;
         this.isSecondClick = false;
+        this.filterGeneration = null;
+        this.pendingFilterRequests = 0;
+        this.isStaleFilter = false;
         this.previousValue = null;
         this.keyConfigure = {
             tab: 'tab',
@@ -3474,7 +3480,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
     DropDownList.prototype.floatLabelChange = function () {
         if (this.getModuleName() === 'dropdownlist' && this.floatLabelType === 'Auto') {
             var floatElement = this.inputWrapper.container.querySelector('.e-float-text');
-            if (floatElement && this.inputElement.value !== '' || this.isInteracted) {
+            if (floatElement && (this.inputElement.value !== '' || this.isInteracted)) {
                 classList(floatElement, ['e-label-top'], ['e-label-bottom']);
             }
             else if (floatElement) {
@@ -4836,6 +4842,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         li = null;
     };
     DropDownList.prototype.selectEventCallback = function (li, e, preventSelect, selectedData, value) {
+        if (this.getModuleName() === 'dropdownlist' && this.allowFiltering &&
+            this.dataSource instanceof DataManager && this.filterGeneration) {
+            this.isStaleFilter = true;
+        }
         this.previousItemData = (!isNullOrUndefined(this.itemData)) ? this.itemData : null;
         if (this.itemData !== selectedData) {
             this.previousValue = (!isNullOrUndefined(this.itemData)) ? typeof this.itemData == 'object' &&
@@ -4882,7 +4892,11 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
     DropDownList.prototype.setValue = function (e, autofill) {
         var dataItem = this.getItemData();
         this.isTouched = !isNullOrUndefined(e);
-        if (dataItem.value === null) {
+        if (dataItem.value === null && !isNullOrUndefined(this.item) &&
+            this.item.getAttribute('data-value') === 'null') {
+            Input.setValue('null', this.inputElement, this.floatLabelType, this.showClearButton);
+        }
+        else if (dataItem.value === null) {
             Input.setValue(null, this.inputElement, this.floatLabelType, this.showClearButton);
         }
         else {
@@ -4927,6 +4941,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DropDownList.prototype.setSelection = function (li, e) {
+        if (this.getModuleName() === 'dropdownlist' && this.allowFiltering && this.dataSource instanceof DataManager &&
+            this.pendingFilterRequests > 0 && this.isValidLI(li)) {
+            this.isStaleFilter = true;
+        }
         if (this.isValidLI(li) && (!li.classList.contains(dropDownBaseClasses.selected) || (this.isPopupOpen && this.isSelected
             && li.classList.contains(dropDownBaseClasses.selected)))) {
             this.updateSelectedItem(li, e, false, true);
@@ -5499,7 +5517,21 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                     this.previousStartIndex = 0;
                     this.virtualListInfo = null;
                 }
+                if (this.getModuleName() === 'dropdownlist' && this.allowFiltering && dataSource instanceof DataManager) {
+                    this.filterGeneration = {
+                        value: this.value
+                    };
+                    this.pendingFilterRequests++;
+                }
                 this.resetList(dataSource, fields, query);
+                if (this.getModuleName() === 'dropdownlist' && this.allowFiltering &&
+                    dataSource instanceof DataManager && !this.isRequesting) {
+                    this.pendingFilterRequests--;
+                    if (this.pendingFilterRequests === 0) {
+                        this.filterGeneration = null;
+                        this.isStaleFilter = false;
+                    }
+                }
                 if (this.getModuleName() === 'dropdownlist' && this.list.classList.contains(dropDownBaseClasses.noData)) {
                     this.popupContentElement.setAttribute('role', 'status');
                     this.popupContentElement.setAttribute('id', 'no-record');
@@ -5627,6 +5659,14 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         });
     };
     DropDownList.prototype.onActionFailure = function (e) {
+        if (this.getModuleName() === 'dropdownlist' && this.allowFiltering && this.dataSource instanceof DataManager &&
+            this.pendingFilterRequests > 0) {
+            this.pendingFilterRequests--;
+            if (this.pendingFilterRequests === 0) {
+                this.filterGeneration = null;
+                this.isStaleFilter = false;
+            }
+        }
         _super.prototype.onActionFailure.call(this, e);
         if (this.beforePopupOpen) {
             this.renderPopup();
@@ -5638,6 +5678,26 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     DropDownList.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {
         var _this = this;
+        if (this.getModuleName() === 'dropdownlist' && this.allowFiltering && this.dataSource instanceof DataManager &&
+            !isNullOrUndefined(e) && this.pendingFilterRequests > 0) {
+            this.pendingFilterRequests--;
+            if (this.filterGeneration && (this.isStaleFilter || this.filterGeneration.value !== this.value)) {
+                if (this.actionCompleteData.ulElement && this.actionCompleteData.list) {
+                    ulElement = this.actionCompleteData.ulElement.cloneNode(true);
+                    list = this.actionCompleteData.list;
+                    e = null;
+                    this.typedString = '';
+                    this.isTyped = false;
+                    if (this.filterInput) {
+                        this.filterInput.value = '';
+                    }
+                }
+            }
+            if (this.pendingFilterRequests === 0) {
+                this.filterGeneration = null;
+                this.isStaleFilter = false;
+            }
+        }
         if (this.dataSource instanceof DataManager && !isNullOrUndefined(e) && !this.virtualGroupDataSource) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             this.totalItemCount = e.count;
@@ -5905,7 +5965,16 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                 return (((typeof data === 'string' || typeof data === 'number' || typeof data === 'boolean') && data === value_1) ||
                     (getValue(_this.fields.value, data) === value_1));
             });
-            if (!isExist) {
+            var isRemoteFilteredDropDownList = this.getModuleName() === 'dropdownlist' && this.allowFiltering &&
+                this.dataSource instanceof DataManager;
+            var isExistInCachedList = Boolean(isRemoteFilteredDropDownList && this.actionCompleteData.list &&
+                this.actionCompleteData.list.some(function (data) {
+                    return (((typeof data === 'string' || typeof data === 'number' || typeof data === 'boolean') && data === value_1) ||
+                        (getValue(_this.fields.value, data) === value_1));
+                }));
+            var isExistInCachedElement = Boolean(isRemoteFilteredDropDownList && this.actionCompleteData.ulElement &&
+                Array.prototype.some.call(this.actionCompleteData.ulElement.querySelectorAll('li[data-value]'), function (item) { return item.getAttribute('data-value') === String(value_1); }));
+            if (!isExist && (!isRemoteFilteredDropDownList || (!isExistInCachedList && !isExistInCachedElement))) {
                 this.addItem(this.itemData);
             }
         }
@@ -7264,6 +7333,47 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                     break;
                 case 'placeholder':
                     Input.setPlaceholder(newProp.placeholder, this_1.inputElement);
+                    if (this_1.getModuleName() === 'dropdownlist') {
+                        if (!newProp.placeholder || newProp.placeholder.trim() === '') {
+                            var label = this_1.inputWrapper.container.querySelector('.e-float-text');
+                            if (label) {
+                                label.remove();
+                            }
+                            this_1.inputElement.removeAttribute('aria-labelledby');
+                        }
+                        else if (this_1.floatLabelType !== 'Never' && !this_1.value) {
+                            var floatLabel = this_1.inputWrapper.container
+                                .querySelector('.e-float-text');
+                            if (!floatLabel) {
+                                floatLabel = this_1.createElement('label');
+                                floatLabel.classList.add('e-float-text');
+                                if (this_1.floatLabelType === 'Auto') {
+                                    floatLabel.classList.add('e-label-bottom');
+                                }
+                                else if (this_1.floatLabelType === 'Always') {
+                                    floatLabel.classList.add('e-label-top');
+                                }
+                                floatLabel.id = 'label_' + this_1.inputElement.id;
+                                floatLabel.setAttribute('for', this_1.inputElement.id);
+                                var floatLine = this_1.inputWrapper.container
+                                    .querySelector('.e-float-line');
+                                var icon = this_1.inputWrapper.container
+                                    .querySelector('.e-input-group-icon');
+                                if (floatLine) {
+                                    floatLine.insertAdjacentElement('afterend', floatLabel);
+                                }
+                                else if (icon) {
+                                    this_1.inputWrapper.container.insertBefore(floatLabel, icon);
+                                }
+                                else {
+                                    this_1.inputWrapper.container.appendChild(floatLabel);
+                                }
+                            }
+                            floatLabel.style.width = this_1.inputElement.offsetWidth + 'px';
+                            floatLabel.textContent = newProp.placeholder;
+                            this_1.inputElement.setAttribute('aria-labelledby', floatLabel.id);
+                        }
+                    }
                     break;
                 case 'filterBarPlaceholder':
                     if (this_1.filterInput) {
@@ -7588,6 +7698,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                 label.style.width = calculateWidth + 'px';
             }
         }
+        if (label && this.getModuleName() === 'dropdownlist' && (!this.placeholder || this.placeholder.trim() === '')) {
+            label.remove();
+            this.inputElement.removeAttribute('aria-labelledby');
+        }
     };
     /**
      * Return the module name of this component.
@@ -7852,6 +7966,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
      */
     DropDownList.prototype.destroy = function () {
         this.isActive = false;
+        this.isStaleFilter = false;
+        this.filterGeneration = null;
+        this.pendingFilterRequests = 0;
         if (this.showClearButton) {
             this.clearButton = document.getElementsByClassName('e-clear-icon')[0];
         }
@@ -8344,6 +8461,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         _this.isFromFilterChange = false;
         _this.fallbackValue = [];
         _this.uncheckedNodeId = null;
+        _this.isTotalCountClicked = false;
         return _this;
     }
     /**
@@ -8484,7 +8602,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         this.tree = this.createElement('div', { id: this.element.id + '_tree' });
         this.popupDiv.appendChild(this.tree);
         if (!this.destroyPopupOnHide) {
-            document.body.appendChild(this.popupDiv);
+            this.getAppendToElement().appendChild(this.popupDiv);
         }
         this.wireTreeEvents();
         addClass([this.popupDiv], DDTHIDEICON);
@@ -8574,6 +8692,11 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                             _this.hidePopup();
                         }
                         break;
+                    case 'tab':
+                        if (_this.isPopupOpen && !isNullOrUndefined(_this.popupDiv) && _this.popupDiv.classList.contains('e-no-data')) {
+                            _this.hidePopup();
+                        }
+                        break;
                     case 'shiftTab':
                         addClass([_this.inputWrapper], [INPUTFOCUS]);
                         break;
@@ -9976,7 +10099,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                     });
                     _this.popupEle.setAttribute('role', 'region');
                     _this.popupEle.setAttribute('aria-label', _this.element.id);
-                    document.body.appendChild(_this.popupEle);
+                    _this.getAppendToElement().appendChild(_this.popupEle);
                     _this.createPopup(_this.popupEle);
                 }
                 else {
@@ -10069,6 +10192,16 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             }
         });
     };
+    DropDownTree.prototype.getAppendToElement = function () {
+        if (this.isAngular) {
+            var cdkPane = this.element && this.element.closest ? this.element.closest('.cdk-overlay-pane') : null;
+            var popoverEl = this.element && this.element.closest ? this.element.closest('[popover]') : null;
+            if (cdkPane && popoverEl) {
+                return cdkPane;
+            }
+        }
+        return document.body;
+    };
     DropDownTree.prototype.checkCollision = function (popupEle) {
         var collision = isCollide(popupEle);
         if (collision.length > 0) {
@@ -10192,6 +10325,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         var isScroller = target.classList.contains(DROPDOWN) ? true :
             (matches$1(target, '.e-ddt .e-popup') || matches$1(target, '.e-ddt .e-treeview'));
         var isSelectAllArea = target.classList.contains('e-ripple-container');
+        if (this.overFlowWrapper && !this.overFlowWrapper.classList.contains(HIDEICON) && !this.isPopupOpen) {
+            this.isTotalCountClicked = true;
+        }
+        else {
+            this.isTotalCountClicked = false;
+        }
         if ((this.isPopupOpen && ((!isNullOrUndefined(this.inputWrapper) &&
             this.inputWrapper.contains(target)) || isTree || isScroller || isHeader || isFooter || isSelectAllArea)) ||
             ((this.allowMultiSelection || this.showCheckBox) && (this.isPopupOpen && target.classList.contains(CHIP_CLOSE) ||
@@ -11239,7 +11378,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DropDownTree.prototype.removeChip = function (e) {
-        if (!this.enabled || this.readonly) {
+        if (!this.enabled || this.readonly || this.isTotalCountClicked) {
+            this.isTotalCountClicked = false;
             return;
         }
         if (e.target.classList.contains('e-chips-close') && !this.isPopupOpen) {
@@ -13840,7 +13980,7 @@ function createFloatLabel(overAllWrapper, searchWrapper, element, inputElement,
     searchWrapper.appendChild(floatLinelement);
     searchWrapper.appendChild(floatLabelElement);
     overAllWrapper.classList.add('e-float-input');
-    updateFloatLabelState(value, floatLabelElement);
+    updateFloatLabelState(value, floatLabelElement, floatLabelType);
     if (floatLabelType === 'Always') {
         if (floatLabelElement.classList.contains(LABELBOTTOM)) {
             removeClass([floatLabelElement], LABELBOTTOM);
@@ -13853,9 +13993,13 @@ function createFloatLabel(overAllWrapper, searchWrapper, element, inputElement,
  *
  * @param {string[] | number[] | boolean[]} value - Value of the MultiSelect.
  * @param {HTMLElement} label - Float label element.
+ * @param {FloatLabelType} floatlabeltype - specify the float label type.
  */
-function updateFloatLabelState(value, label) {
-    if (value && value.length > 0) {
+function updateFloatLabelState(value, label, floatlabeltype) {
+    var floatElement = label.closest('.e-float-input');
+    var isFocused = floatElement &&
+        floatElement.classList.contains('e-input-focus');
+    if ((value && value.length > 0) || (isFocused && floatElement.closest('.e-multiselect') && floatlabeltype === 'Auto')) {
         addClass([label], LABELTOP);
         removeClass([label], LABELBOTTOM);
     }
@@ -14190,7 +14334,6 @@ 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;
@@ -15766,6 +15909,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
     };
     MultiSelect.prototype.showDelimWrapper = function () {
+        if (!this.value || !this.value.length) {
+            return;
+        }
         if (this.mode === 'CheckBox') {
             this.viewWrapper.style.display = '';
         }
@@ -16903,14 +17049,12 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                         _this.selectedListData.splice(index, 1);
                     }
                     _this.setProperties({ value: [].concat([], removeVal) }, true);
-                    if (_this.enableVirtualization) {
-                        var currentText = index === 0 && _this.text.split(_this.delimiterChar) &&
-                            _this.text.split(_this.delimiterChar).length === 1 ?
-                            _this.text.replace(_this.text.split(_this.delimiterChar)[index], '') :
-                            index === 0 ? _this.text.replace(_this.text.split(_this.delimiterChar)[index] +
-                                _this.delimiterChar, '') :
-                                _this.text.replace(_this.delimiterChar + _this.text.split(_this.delimiterChar)[index], '');
-                        _this.setProperties({ text: currentText.toString() }, true);
+                    if (_this.enableVirtualization && !isNullOrUndefined(_this.text)) {
+                        var textItems = _this.text.split(_this.delimiterChar);
+                        var currentText = index === 0 && textItems.length === 1
+                            ? _this.text.replace(textItems[index], '') : index === 0 ? _this.text.replace(textItems[index]
+                            + _this.delimiterChar, '') : _this.text.replace(_this.delimiterChar + textItems[index], '');
+                        _this.setProperties({ text: currentText }, true);
                     }
                     if (element_1 !== null) {
                         var currentValue_1 = _this.allowObjectBinding ? getValue(((_this.fields.value) ?
@@ -18033,7 +18177,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
         this.preventSetCurrentData = false;
         this.initializeData();
-        this.sanitizeData();
         this.updateDataAttribute(this.htmlAttributes);
         _super.prototype.preRender.call(this);
     };
@@ -18064,56 +18207,6 @@ 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';
@@ -18152,7 +18245,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                             var value = this_1.allowObjectBinding ?
                                 getValue(((this_1.fields.value) ? this_1.fields.value : ''), this_1.value[this_1.value.length - 1]) :
                                 this_1.value[this_1.value.length - 1];
-                            if (this_1.isRemoveSelection) {
+                            if (this_1.isRemoveSelection && this_1.text) {
                                 data = this_1.text.replace(/,/g, delimiterChar + ' ') + delimiterChar + ' ';
                                 text = this_1.text.split(delimiterChar);
                             }
@@ -18264,7 +18357,6 @@ 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;
@@ -19531,7 +19623,8 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                                     : (_this.fields.value ? obj[_this.fields.value] : obj);
                                 var text = isPlainValue
                                     ? String(obj)
-                                    : (_this.fields.text ? (obj[_this.fields.text]).toString() : String(obj));
+                                    : (_this.fields.text && obj[_this.fields.text] != null ? (obj[_this.fields.text]).toString()
+                                        : String(obj));
                                 if (_this.value && value != null && Array.isArray(_this.value) &&
                                     ((!_this.allowObjectBinding && _this.value.indexOf(value) < 0) ||
                                         (_this.allowObjectBinding && !_this.isObjectInArray(value, _this.value)))) {
@@ -20195,7 +20288,6 @@ 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.isDimColumnWithCustomStyle()) {
                             this.popupObj.destroy();
@@ -20229,7 +20321,6 @@ 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);
                     }
@@ -20672,8 +20763,6 @@ 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) {
@@ -20685,50 +20774,6 @@ 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) {
@@ -20886,7 +20931,6 @@ 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 = [];
@@ -22094,12 +22138,14 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
         var target;
         if (!isNullOrUndefined(args.e)) {
             var frameElm = args.li.querySelector('.e-checkbox-wrapper .e-frame');
-            target = !isNullOrUndefined(args.e.target) ?
-                (args.e.target.classList.contains('e-frame')
-                    && (!this.parent.showSelectAll
-                        || (this.checkAllParent && !this.checkAllParent.contains(args.e.target)))) ?
-                    args.e.target : args.li.querySelector('.e-checkbox-wrapper').childNodes[1]
-                : args.li.querySelector('.e-checkbox-wrapper').childNodes[1];
+            var checkboxWrapper = args.li.querySelector('.e-checkbox-wrapper');
+            target = !isNullOrUndefined(args.e.target)
+                ? (args.e.target.classList.contains('e-frame') &&
+                    (!this.parent.showSelectAll ||
+                        (this.checkAllParent && !this.checkAllParent.contains(args.e.target))))
+                    ? args.e.target
+                    : (checkboxWrapper ? checkboxWrapper.childNodes[1] : null)
+                : (checkboxWrapper ? checkboxWrapper.childNodes[1] : null);
         }
         else {
             var checkboxWrapper = args.li.querySelector('.e-checkbox-wrapper');