@syncfusion/ej2-dropdowns 25.2.7 → 26.1.35-7502

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

@@ -1,10 +1,10 @@
-import { Animation, Browser, ChildProperty, Complex, Component, Event, EventHandler, KeyboardEvents, L10n, NotifyPropertyChanges, Property, SanitizeHtmlHelper, Touch, addClass, append, attributes, classList, closest, compile, createElement, debounce, detach, extend, formatUnit, getComponent, getUniqueID, getValue, isNullOrUndefined, isUndefined, matches, prepend, remove, removeClass, rippleEffect, select, selectAll, setStyleAttribute, setValue } from '@syncfusion/ej2-base';
-import { DataManager, DataUtil, JsonAdaptor, Predicate, Query } from '@syncfusion/ej2-data';
+import { EventHandler, Touch, isNullOrUndefined, getValue, select, Browser, debounce, Property, ChildProperty, selectAll, compile, L10n, addClass, removeClass, extend, append, setStyleAttribute, prepend, rippleEffect, detach, Complex, Event, NotifyPropertyChanges, Component, classList, closest, KeyboardEvents, attributes, isUndefined, formatUnit, Animation, getUniqueID, remove, SanitizeHtmlHelper, setValue, matches as matches$1, createElement, getComponent } from '@syncfusion/ej2-base';
+import { DataManager, Query, DataUtil, Predicate, JsonAdaptor } from '@syncfusion/ej2-data';
 import { ListBase, Sortable, cssClass, moveTo } from '@syncfusion/ej2-lists';
 import { Skeleton } from '@syncfusion/ej2-notifications';
-import { Popup, createSpinner, getZindexPartial, hideSpinner, isCollide, showSpinner } from '@syncfusion/ej2-popups';
+import { hideSpinner, createSpinner, showSpinner, isCollide, Popup, getZindexPartial } from '@syncfusion/ej2-popups';
 import { Input, TextBox } from '@syncfusion/ej2-inputs';
-import { Button, createCheckBox } from '@syncfusion/ej2-buttons';
+import { createCheckBox, Button } from '@syncfusion/ej2-buttons';
 import { TreeView } from '@syncfusion/ej2-navigations';
 
 /**
@@ -13,7 +13,7 @@ import { TreeView } from '@syncfusion/ej2-navigations';
 var queryString = '';
 var prevString = '';
 var tempQueryString = '';
-var matches$1 = [];
+var matches = [];
 var activeClass = 'e-active';
 var prevElementId = '';
 /**
@@ -56,21 +56,21 @@ function incrementalSearch(keyCode, items, selectedIndex, ignoreCase, elementId,
     var index;
     queryString = ignoreCase ? queryString.toLowerCase() : queryString;
     if (prevElementId === elementId && prevString === queryString && !refresh) {
-        for (var i = 0; i < matches$1.length; i++) {
-            if (matches$1[i].classList.contains(activeClass)) {
+        for (var i = 0; i < matches.length; i++) {
+            if (matches[i].classList.contains(activeClass)) {
                 index = i;
                 break;
             }
-            if (currentValue && matches$1[i].textContent.toLowerCase() === currentValue.toLowerCase()) {
+            if (currentValue && matches[i].textContent.toLowerCase() === currentValue.toLowerCase()) {
                 index = i;
                 break;
             }
         }
         index = index + 1;
         if (isVirtual) {
-            return matches$1[index] && matches$1.length - 1 != index ? matches$1[index] : matches$1[matches$1.length];
+            return matches[index] && matches.length - 1 != index ? matches[index] : matches[matches.length];
         }
-        return matches$1[index] ? matches$1[index] : matches$1[0];
+        return matches[index] ? matches[index] : matches[0];
     }
     else {
         var listItems = items;
@@ -79,7 +79,7 @@ function incrementalSearch(keyCode, items, selectedIndex, ignoreCase, elementId,
         var item = void 0;
         selectedIndex = selectedIndex ? selectedIndex + 1 : 0;
         var i = selectedIndex;
-        matches$1 = [];
+        matches = [];
         do {
             if (i === listItems.length) {
                 i = -1;
@@ -93,7 +93,7 @@ function incrementalSearch(keyCode, items, selectedIndex, ignoreCase, elementId,
             item = listItems[index];
             text = ignoreCase ? item.innerText.toLowerCase() : item.innerText;
             if (text.substr(0, strLength) === queryString) {
-                matches$1.push(listItems[index]);
+                matches.push(listItems[index]);
             }
             i++;
         } while (i !== selectedIndex);
@@ -101,8 +101,8 @@ function incrementalSearch(keyCode, items, selectedIndex, ignoreCase, elementId,
         prevElementId = elementId;
         if (isVirtual) {
             var indexUpdated = false;
-            for (var i_1 = 0; i_1 < matches$1.length; i_1++) {
-                if (currentValue && matches$1[i_1].textContent.toLowerCase() === currentValue.toLowerCase()) {
+            for (var i_1 = 0; i_1 < matches.length; i_1++) {
+                if (currentValue && matches[i_1].textContent.toLowerCase() === currentValue.toLowerCase()) {
                     index = i_1;
                     indexUpdated = true;
                     break;
@@ -111,9 +111,9 @@ function incrementalSearch(keyCode, items, selectedIndex, ignoreCase, elementId,
             if (currentValue && indexUpdated) {
                 index = index + 1;
             }
-            return matches$1[index] ? matches$1[index] : matches$1[0];
+            return matches[index] ? matches[index] : matches[0];
         }
-        return matches$1[0];
+        return matches[0];
     }
 }
 /**
@@ -176,7 +176,7 @@ function resetIncrementalSearchValues(elementId) {
         prevElementId = '';
         prevString = '';
         queryString = '';
-        matches$1 = [];
+        matches = [];
     }
 }
 
@@ -555,6 +555,7 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
             this.parent.updatevirtualizationList();
         }
         this.parent.getSkeletonCount();
+        this.parent.skeletonCount = this.parent.totalItemCount != 0 && this.parent.totalItemCount < (this.parent.itemCount * 2) ? 0 : this.parent.skeletonCount;
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var virtualTrackElement = this.parent.list.getElementsByClassName('e-virtual-ddl')[0];
         if (virtualTrackElement) {
@@ -790,10 +791,6 @@ var VirtualScroll = /** @__PURE__ @class */ (function () {
     return VirtualScroll;
 }());
 
-/**
- * Common source
- */
-
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -833,6 +830,9 @@ var FieldSettings = /** @__PURE__ @class */ (function (_super) {
     __decorate([
         Property()
     ], FieldSettings.prototype, "htmlAttributes", void 0);
+    __decorate([
+        Property()
+    ], FieldSettings.prototype, "disabled", void 0);
     return FieldSettings;
 }(ChildProperty));
 var dropDownBaseClasses = {
@@ -875,7 +875,6 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
     function DropDownBase(options, element) {
         var _this = _super.call(this, options, element) || this;
         _this.preventChange = false;
-        _this.isAngular = false;
         _this.isPreventChange = false;
         _this.isDynamicDataChange = false;
         _this.addedNewItem = false;
@@ -1086,7 +1085,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
     };
     DropDownBase.prototype.l10nUpdate = function (actionFailure) {
         var ele = this.getModuleName() === 'listbox' ? this.ulElement : this.list;
-        if (this.noRecordsTemplate !== 'No records found' || this.actionFailureTemplate !== 'Request failed') {
+        if ((!isNullOrUndefined(this.noRecordsTemplate) && this.noRecordsTemplate !== 'No records found') || this.actionFailureTemplate !== 'Request failed') {
             var template = actionFailure ? this.actionFailureTemplate : this.noRecordsTemplate;
             var compiledString = void 0;
             var templateId = actionFailure ? this.actionFailureTemplateId : this.noRecordsTemplateId;
@@ -1248,7 +1247,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
     DropDownBase.prototype.getTransformValues = function () {
         var translateY = this.viewPortInfo.startIndex * this.listItemHeight;
         translateY = translateY - (this.skeletonCount * this.listItemHeight);
-        translateY = this.viewPortInfo.startIndex === 0 && this.listData && this.listData.length === 0 ? 0 : translateY;
+        translateY = ((this.viewPortInfo.startIndex === 0 && this.listData && this.listData.length === 0) || this.skeletonCount === 0) ? 0 : translateY;
         var styleText = "transform: translate(0px, " + translateY + "px);";
         return styleText;
     };
@@ -1393,17 +1392,18 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
             }
             element.querySelectorAll('select>option');
         }
-        this.updateFields(fields.text, fields.value, this.fields.groupBy, this.fields.htmlAttributes, this.fields.iconCss);
+        this.updateFields(fields.text, fields.value, this.fields.groupBy, this.fields.htmlAttributes, this.fields.iconCss, this.fields.disabled);
         this.resetList(jsonElement, fields);
     };
-    DropDownBase.prototype.updateFields = function (text, value, groupBy, htmlAttributes, iconCss) {
+    DropDownBase.prototype.updateFields = function (text, value, groupBy, htmlAttributes, iconCss, disabled) {
         var field = {
             'fields': {
                 text: text,
                 value: value,
                 groupBy: !isNullOrUndefined(groupBy) ? groupBy : this.fields && this.fields.groupBy,
                 htmlAttributes: !isNullOrUndefined(htmlAttributes) ? htmlAttributes : this.fields && this.fields.htmlAttributes,
-                iconCss: !isNullOrUndefined(iconCss) ? iconCss : this.fields && this.fields.iconCss
+                iconCss: !isNullOrUndefined(iconCss) ? iconCss : this.fields && this.fields.iconCss,
+                disabled: !isNullOrUndefined(disabled) ? disabled : this.fields && this.fields.disabled
             }
         };
         this.setProperties(field, true);
@@ -1774,8 +1774,16 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
     };
     /* eslint-disable @typescript-eslint/no-unused-vars */
     DropDownBase.prototype.postRender = function (listElement, list, bindEvent) {
+        if (this.fields.disabled) {
+            var liCollections = listElement.querySelectorAll('.' + dropDownBaseClasses.li);
+            for (var index = 0; index < liCollections.length; index++) {
+                if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.disabled]) {
+                    this.disableListItem(liCollections[index]);
+                }
+            }
+        }
         /* eslint-enable @typescript-eslint/no-unused-vars */
-        var focusItem = listElement.querySelector('.' + dropDownBaseClasses.li);
+        var focusItem = this.fields.disabled ? listElement.querySelector('.' + dropDownBaseClasses.li + ':not(.e-disabled') : listElement.querySelector('.' + dropDownBaseClasses.li);
         var selectedItem = listElement.querySelector('.' + dropDownBaseClasses.selected);
         if (focusItem && !selectedItem) {
             focusItem.classList.add(dropDownBaseClasses.focus);
@@ -1910,9 +1918,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
                     break;
                 }
                 if (isDownkey) {
-                    if ((!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.selected) && this.getModuleName() !== 'autocomplete') || (!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.focus) && this.getModuleName() === 'autocomplete')) {
-                        
-                    }
+                    if ((!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.selected) && this.getModuleName() !== 'autocomplete') || (!isNullOrUndefined(liCollections[index]) && liCollections[index].classList.contains(dropDownBaseClasses.focus) && this.getModuleName() === 'autocomplete')) ;
                 }
             }
             else {
@@ -2123,7 +2129,13 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
      */
     DropDownBase.prototype.getIndexByValue = function (value) {
         var index;
-        var listItems = this.getItems();
+        var listItems = [];
+        if (this.fields.disabled && this.getModuleName() === 'multiselect' && this.liCollections) {
+            listItems = this.liCollections;
+        }
+        else {
+            listItems = this.getItems();
+        }
         for (var i = 0; i < listItems.length; i++) {
             if (!isNullOrUndefined(value) && listItems[i].getAttribute('data-value') === value.toString()) {
                 index = i;
@@ -2412,6 +2424,9 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
             this.notify('addItem', { module: 'CheckBoxSelection', item: li });
             liCollections.push(li);
             if (this.getModuleName() === 'listbox') {
+                if (item.disabled) {
+                    li.classList.add('e-disabled');
+                }
                 this.listData.splice(isListboxEmpty ? this.listData.length : index, 0, item);
                 if (this.listData.length !== this.sortedData.length) {
                     this.sortedData = this.listData;
@@ -2497,18 +2512,53 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
         }
         this.addedNewItem = true;
     };
+    /**
+     * Checks if the given HTML element is disabled.
+     *
+     * @param {HTMLElement} li - The HTML element to check.
+     * @returns {boolean} - Returns true if the element is disabled, otherwise false.
+     */
+    DropDownBase.prototype.isDisabledElement = function (li) {
+        if (li && li.classList.contains('e-disabled')) {
+            return true;
+        }
+        return false;
+    };
+    /**
+     * Checks whether the list item at the specified index is disabled.
+     *
+     * @param {number} index - The index of the list item to check.
+     * @returns {boolean} True if the list item is disabled, false otherwise.
+     */
+    DropDownBase.prototype.isDisabledItemByIndex = function (index) {
+        if (this.fields.disabled && this.liCollections) {
+            return this.isDisabledElement(this.liCollections[index]);
+        }
+        return false;
+    };
+    /**
+     * Disables the given list item.
+     *
+     * @param { HTMLLIElement } li - The list item to disable.
+     * @returns {void}
+     */
+    DropDownBase.prototype.disableListItem = function (li) {
+        li.classList.add('e-disabled');
+        li.setAttribute('aria-disabled', 'true');
+        li.setAttribute('aria-selected', 'false');
+    };
     DropDownBase.prototype.validationAttribute = function (target, hidden) {
         var name = target.getAttribute('name') ? target.getAttribute('name') : target.getAttribute('id');
         hidden.setAttribute('name', name);
         target.removeAttribute('name');
-        var attributes$$1 = ['required', 'aria-required', 'form'];
-        for (var i = 0; i < attributes$$1.length; i++) {
-            if (!target.getAttribute(attributes$$1[i])) {
+        var attributes = ['required', 'aria-required', 'form'];
+        for (var i = 0; i < attributes.length; i++) {
+            if (!target.getAttribute(attributes[i])) {
                 continue;
             }
-            var attr = target.getAttribute(attributes$$1[i]);
-            hidden.setAttribute(attributes$$1[i], attr);
-            target.removeAttribute(attributes$$1[i]);
+            var attr = target.getAttribute(attributes[i]);
+            hidden.setAttribute(attributes[i], attr);
+            target.removeAttribute(attributes[i]);
         }
     };
     DropDownBase.prototype.setZIndex = function () {
@@ -2580,7 +2630,7 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
         _super.prototype.destroy.call(this);
     };
     __decorate([
-        Complex({ text: null, value: null, iconCss: null, groupBy: null }, FieldSettings)
+        Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
     ], DropDownBase.prototype, "fields", void 0);
     __decorate([
         Property(null)
@@ -2645,10 +2695,6 @@ var DropDownBase = /** @__PURE__ @class */ (function (_super) {
     return DropDownBase;
 }(Component));
 
-/**
- * export all modules from current location
- */
-
 var __extends$1 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -2668,8 +2714,6 @@ var __decorate$1 = (undefined && undefined.__decorate) || function (decorators,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-// eslint-disable-next-line @typescript-eslint/triple-slash-reference
-/// <reference path='../drop-down-base/drop-down-base-model.d.ts'/>
 // don't use space in classnames
 var dropDownListClasses = {
     root: 'e-dropdownlist',
@@ -2729,17 +2773,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         var _this = _super.call(this, options, element) || this;
         _this.isListSearched = false;
         _this.preventChange = false;
-        _this.isAngular = false;
         _this.isTouched = false;
         _this.IsScrollerAtEnd = function () {
             return this.list && this.list.scrollTop + this.list.clientHeight >= this.list.scrollHeight;
         };
-        _this.removeAllChildren = function (element) {
-            while (element.children[0]) {
-                this.removeAllChildren(element.children[0]);
-                element.removeChild(element.children[0]);
-            }
-        };
         return _this;
     }
     /**
@@ -2860,7 +2897,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         this.removeFocus();
         this.list.scrollTop = 0;
         if (this.getModuleName() !== 'autocomplete' && !isNullOrUndefined(this.ulElement)) {
-            var li = this.ulElement.querySelector('.' + dropDownListClasses.li);
+            var li = this.fields.disabled ? this.ulElement.querySelector('.' + dropDownListClasses.li + ':not(.e-disabled)') : this.ulElement.querySelector('.' + dropDownListClasses.li);
             if (this.enableVirtualization) {
                 li = this.liCollections[this.skeletonCount];
             }
@@ -3065,7 +3102,32 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
             this.updateValues();
         }
     };
+    /**
+     * Checks if the given value is disabled.
+     *
+     * @param { string | number | boolean | object } value - The value to check for disablement. Can be a string, number, boolean, or object.
+     * @returns { boolean } A boolean indicating whether the value is disabled.
+     */
+    DropDownList.prototype.isDisableItemValue = function (value) {
+        if (typeof (value) === 'object') {
+            var objectValue = JSON.parse(JSON.stringify(value))[this.fields.value];
+            return this.isDisabledItemByIndex(this.getIndexByValue(objectValue));
+        }
+        return this.isDisabledItemByIndex(this.getIndexByValue(value));
+    };
     DropDownList.prototype.updateValues = function () {
+        if (this.fields.disabled) {
+            if (this.value != null) {
+                this.value = !this.isDisableItemValue(this.value) ? this.value : null;
+            }
+            if (this.text != null) {
+                this.text = !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
+            }
+            if (this.index != null) {
+                this.index = !this.isDisabledItemByIndex(this.index) ? this.index : null;
+                this.activeIndex = this.index;
+            }
+        }
         this.selectedValueInfo = this.viewPortInfo;
         if (!isNullOrUndefined(this.value)) {
             var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue(((this.fields.value) ? this.fields.value : ''), this.value) : this.value;
@@ -3258,7 +3320,7 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         var target = e.target;
         this.keyboardEvent = null;
         var li = closest(target, '.' + dropDownBaseClasses.li);
-        if (!this.isValidLI(li)) {
+        if (!this.isValidLI(li) || this.isDisabledElement(li)) {
             return;
         }
         this.setSelection(li, e);
@@ -3402,7 +3464,14 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                 }
             }
             else {
-                var li = incrementalSearch(e.charCode, this.liCollections, this.activeIndex, true, this.element.id);
+                var li = void 0;
+                if (this.fields.disabled) {
+                    var enableLiCollections = this.list.querySelectorAll('.' + dropDownBaseClasses.li + ':not(.e-disabled)');
+                    li = incrementalSearch(e.charCode, enableLiCollections, this.activeIndex, true, this.element.id);
+                }
+                else {
+                    li = incrementalSearch(e.charCode, this.liCollections, this.activeIndex, true, this.element.id);
+                }
                 if (!isNullOrUndefined(li)) {
                     this.setSelection(li, e);
                     this.setScrollPosition();
@@ -3532,6 +3601,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         }
     };
     DropDownList.prototype.updateUpDownAction = function (e, isVirtualKeyAction) {
+        if (this.fields.disabled && this.list && this.list.querySelectorAll('.e-list-item:not(.e-disabled)').length === 0) {
+            return;
+        }
         if (this.allowFiltering && !this.enableVirtualization && this.getModuleName() !== 'autocomplete') {
             var value_1 = this.getItemData().value;
             if (isNullOrUndefined(value_1)) {
@@ -3642,6 +3714,25 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                 attributes(this.filterInput, { 'aria-activedescendant': this.ulElement.getElementsByClassName('e-active')[0].id });
             }
         }
+        var itemIndex;
+        for (var index = 0; index < this.liCollections.length; index++) {
+            if (this.liCollections[index].classList.contains(dropDownListClasses.focus)
+                || this.liCollections[index].classList.contains(dropDownListClasses.selected)) {
+                itemIndex = index;
+                break;
+            }
+        }
+        if (itemIndex != null && this.isDisabledElement(this.liCollections[itemIndex])) {
+            if (this.getModuleName() !== 'autocomplete') {
+                if (this.liCollections.length - 1 === itemIndex && e.action === 'down') {
+                    e.action = 'up';
+                }
+                if (itemIndex === 0 && e.action === 'up') {
+                    e.action = 'down';
+                }
+            }
+            this.updateUpDownAction(e);
+        }
         e.preventDefault();
     };
     DropDownList.prototype.updateHomeEndAction = function (e, isVirtualKeyAction) {
@@ -3742,6 +3833,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
     DropDownList.prototype.selectCurrentItem = function (e) {
         if (this.isPopupOpen) {
             var li = this.list.querySelector('.' + dropDownListClasses.focus);
+            if (this.isDisabledElement(li)) {
+                return;
+            }
             if (li) {
                 this.setSelection(li, e);
                 this.isTyped = false;
@@ -5229,7 +5323,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         var elementRect = element.getBoundingClientRect();
         return (elementRect.top >= 0 && elementRect.left >= 0 && elementRect.bottom <= window.innerHeight && elementRect.right <= window.innerWidth);
     };
-    
     DropDownList.prototype.setSearchBoxPosition = function () {
         var searchBoxHeight = this.filterInput.parentElement.getBoundingClientRect().height;
         this.popupObj.element.style.maxHeight = '100%';
@@ -5349,7 +5442,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                     this.list.scrollTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.virtualListInfo.startIndex * this.listItemHeight : 0;
                 }
                 isScrollerCHanged = this.isKeyBoardAction;
-                
             }
             this.isKeyBoardAction = isScrollerCHanged;
             if (this.enableVirtualization && this.fields.groupBy && this.fixedHeaderElement && (keyAction == "down")) {
@@ -6002,6 +6094,10 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                     this_1.setEnable();
                     break;
                 case 'text':
+                    if (this_1.fields.disabled) {
+                        newProp.text = newProp.text && !this_1.isDisabledItemByIndex(this_1.getIndexByValue(this_1.getValueByText(newProp.text)))
+                            ? newProp.text : null;
+                    }
                     if (newProp.text === null) {
                         this_1.clearAll();
                         break;
@@ -6053,6 +6149,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                     }
                     break;
                 case 'value':
+                    if (this_1.fields.disabled) {
+                        newProp.value = newProp.value != null && !this_1.isDisableItemValue(newProp.value) ? newProp.value : null;
+                    }
                     if (newProp.value === null) {
                         this_1.clearAll();
                         break;
@@ -6112,6 +6211,9 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
                     }
                     break;
                 case 'index':
+                    if (this_1.fields.disabled) {
+                        newProp.index = newProp.index != null && !this_1.isDisabledItemByIndex(newProp.index) ? newProp.index : null;
+                    }
                     if (newProp.index === null) {
                         this_1.clearAll();
                         break;
@@ -6429,6 +6531,65 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
             Input.calculateWidth(this.inputElement, this.inputWrapper.container);
         }
     };
+    /**
+     * Method to disable specific item in the popup.
+     *
+     * @param {string | number | object | HTMLLIElement} item - Specifies the item to be disabled.
+     * @returns {void}
+     * @deprecated
+     */
+    DropDownList.prototype.disableItem = function (item) {
+        if (this.fields.disabled) {
+            if (!this.list) {
+                this.renderList();
+            }
+            var itemIndex = -1;
+            if (this.liCollections && this.liCollections.length > 0 && this.listData && this.fields.disabled) {
+                if (typeof (item) === 'string') {
+                    itemIndex = this.getIndexByValue(item);
+                }
+                else if (typeof item === 'object') {
+                    if (item instanceof HTMLLIElement) {
+                        for (var index = 0; index < this.liCollections.length; index++) {
+                            if (this.liCollections[index] === item) {
+                                itemIndex = this.getIndexByValue(item.getAttribute('data-value'));
+                                break;
+                            }
+                        }
+                    }
+                    else {
+                        var value = JSON.parse(JSON.stringify(item))[this.fields.value];
+                        for (var index = 0; index < this.listData.length; index++) {
+                            if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.value] === value) {
+                                itemIndex = this.getIndexByValue(value);
+                                break;
+                            }
+                        }
+                    }
+                }
+                else {
+                    itemIndex = item;
+                }
+                var isValidIndex = itemIndex < this.liCollections.length && itemIndex > -1;
+                if (isValidIndex && !(JSON.parse(JSON.stringify(this.listData[itemIndex]))[this.fields.disabled])) {
+                    var li = this.liCollections[itemIndex];
+                    if (li) {
+                        this.disableListItem(li);
+                        var parsedData = JSON.parse(JSON.stringify(this.listData[itemIndex]));
+                        parsedData[this.fields.disabled] = true;
+                        this.listData[itemIndex] = parsedData;
+                        this.dataSource = this.listData;
+                        if (li.classList.contains(dropDownListClasses.focus)) {
+                            this.removeFocus();
+                        }
+                        if (li.classList.contains(dropDownListClasses.selected)) {
+                            this.clear();
+                        }
+                    }
+                }
+            }
+        }
+    };
     /**
      * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
      *
@@ -6478,9 +6639,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
         delete this.hiddenElement;
         this.filterInput = null;
         this.keyboardModule = null;
-        if (!isNullOrUndefined(this.ulElement)) {
-            this.removeAllChildren(this.ulElement);
-        }
         this.ulElement = null;
         this.list = null;
         this.clearIconElement = null;
@@ -6638,10 +6796,6 @@ var DropDownList = /** @__PURE__ @class */ (function (_super) {
     return DropDownList;
 }(DropDownBase));
 
-/**
- * export all modules from current location
- */
-
 var __extends$2 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -7046,7 +7200,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                 if (args.text === '') {
                     _this.isFilteredData = false;
                     _this.isFilterRestore = true;
-                    _this.isFromFilterChange = false;
                     fields = _this.cloneFields(_this.fields);
                 }
                 else if (args.preventDefaultAction) {
@@ -7131,8 +7284,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
     DropDownTree.prototype.nestedFilter = function (value, filteredFields) {
         var matchedDataSource = [];
         for (var i = 0; i < this.treeData.length; i++) {
-            // eslint-disable-next-line
-            var filteredChild = this.nestedChildFilter(value, this.treeData[i]);
+            var filteredChild = this.nestedChildFilter(value, this.treeData[parseInt(i.toString(), 10)]);
             if (!isNullOrUndefined(filteredChild)) {
                 matchedDataSource.push(filteredChild);
             }
@@ -7148,8 +7300,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         else {
             var matchedChildren = [];
             for (var i = 0; i < children.length; i++) {
-                // eslint-disable-next-line
-                var filteredChild = this.nestedChildFilter(value, children[i]);
+                var filteredChild = this.nestedChildFilter(value, children[parseInt(i.toString(), 10)]);
                 if (!isNullOrUndefined(filteredChild)) {
                     matchedChildren.push(filteredChild);
                 }
@@ -7176,13 +7327,11 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         for (var i = 0; i < matchedData.length; i++) {
             if (matchedDataSource.indexOf(matchedData[i]) === -1) {
                 matchedDataSource.push(matchedData[i]);
-                // eslint-disable-next-line
-                var parentId = matchedData[i][this.fields.parentValue];
+                var parentId = matchedData[parseInt(i.toString(), 10)][this.fields.parentValue];
                 while (!isNullOrUndefined(parentId)) {
                     var parent_1 = null;
                     for (var j = 0; j < this.treeData.length; j++) {
-                        // eslint-disable-next-line
-                        var value_1 = this.treeData[j][this.fields.value];
+                        var value_1 = this.treeData[parseInt(j.toString(), 10)][this.fields.value];
                         if (!isNullOrUndefined(value_1) && (value_1 === parentId)) {
                             parent_1 = this.treeData[j];
                             break;
@@ -7276,6 +7425,11 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         if (formElement) {
             EventHandler.remove(formElement, 'reset', this.resetValueHandler);
         }
+        this.keyboardModule.destroy();
+        if (this.showSelectAll && this.checkAllParent) {
+            EventHandler.remove(this.checkAllParent, 'mouseup', this.clickHandler);
+        }
+        EventHandler.remove(document, 'mousedown', this.onDocumentClick);
     };
     /* Trigger when the dropdown is clicked */
     DropDownTree.prototype.dropDownClick = function (e) {
@@ -7480,24 +7634,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                             _this.selectAll(true);
                         }
                         break;
-                    case 'moveRight':
-                    case 'moveLeft':
-                    case 'shiftDown':
-                    case 'moveDown':
-                    case 'ctrlDown':
-                    case 'csDown':
-                    case 'shiftUp':
-                    case 'moveUp':
-                    case 'ctrlUp':
-                    case 'csUp':
-                    case 'home':
-                    case 'shiftHome':
-                    case 'ctrlHome':
-                    case 'csHome':
-                    case 'end':
-                    case 'shiftEnd':
-                    case 'ctrlEnd':
-                    case 'csEnd':
                 }
             }
             else {
@@ -7550,6 +7686,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             cancel: false,
             event: e
         };
+        var focusedElement;
         this.trigger('keyPress', eventArgs, function (observedArgs) {
             if (!observedArgs.cancel) {
                 switch (e.action) {
@@ -7557,9 +7694,10 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                         _this.clickHandler(e);
                         break;
                     case 'moveDown':
-                        var focusedElement = _this.treeObj.element.querySelector('li');
+                        focusedElement = _this.treeObj.element.querySelector('li');
                         focusedElement.focus();
                         addClass([focusedElement], ['e-node-focus']);
+                        break;
                 }
             }
         });
@@ -7718,8 +7856,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         return remainElement;
     };
     DropDownTree.prototype.getOverflowVal = function (index) {
-        // eslint-disable-next-line
-        var selectedData = this.getSelectedData(this.value[index]);
+        var selectedData = this.getSelectedData(this.value[parseInt(index.toString(), 10)]);
         return getValue(this.treeSettings.loadOnDemand ? this.fields.text : 'text', selectedData);
     };
     DropDownTree.prototype.updateDelimMode = function () {
@@ -7765,12 +7902,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         var name = this.inputEle.getAttribute('name') ? this.inputEle.getAttribute('name') : this.inputEle.getAttribute('id');
         this.hiddenElement.setAttribute('name', name);
         this.inputEle.removeAttribute('name');
-        var attributes$$1 = ['required', 'aria-required', 'form'];
-        for (var i = 0; i < attributes$$1.length; i++) {
-            var attr = this.inputEle.getAttribute(attributes$$1[i]);
+        var attributes = ['required', 'aria-required', 'form'];
+        for (var i = 0; i < attributes.length; i++) {
+            var attr = this.inputEle.getAttribute(attributes[i]);
             if (attr) {
-                this.hiddenElement.setAttribute(attributes$$1[i], attr);
-                this.inputEle.removeAttribute(attributes$$1[i]);
+                this.hiddenElement.setAttribute(attributes[i], attr);
+                this.inputEle.removeAttribute(attributes[i]);
             }
         }
     };
@@ -8091,8 +8228,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         var data;
         if (this.treeDataType === 1) {
             for (var i = 0; i < this.treeItems.length; i++) {
-                // eslint-disable-next-line
-                var text = getValue(this.fields.text, this.treeItems[i]);
+                var text = getValue(this.fields.text, this.treeItems[parseInt(i.toString(), 10)]);
                 if (!isNullOrUndefined(this.treeItems[i]) && !isNullOrUndefined(text) && text === givenText) {
                     data = this.treeItems[i];
                     break;
@@ -8107,14 +8243,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
     DropDownTree.prototype.getNestedItems = function (data, field, givenText) {
         var newData;
         for (var i = 0, objlen = data.length; i < objlen; i++) {
-            // eslint-disable-next-line
-            var dataId = getValue(this.fields.text, data[i]);
+            var dataId = getValue(this.fields.text, data[parseInt(i.toString(), 10)]);
             if (data[i] && dataId && dataId.toString() === givenText) {
                 return data[i];
             }
             else if (typeof field.child === 'string' && !isNullOrUndefined(getValue(field.child, data[i]))) {
-                // eslint-disable-next-line
-                var childData = getValue(field.child, data[i]);
+                var childData = getValue(field.child, data[parseInt(i.toString(), 10)]);
                 newData = this.getNestedItems(childData, this.getChildType(field), givenText);
                 if (newData !== undefined) {
                     break;
@@ -8122,8 +8256,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             }
             else if (this.fields.dataSource instanceof DataManager && !isNullOrUndefined(getValue('child', data[i]))) {
                 var child = 'child';
-                // eslint-disable-next-line
-                newData = this.getNestedItems(getValue(child, data[i]), this.getChildType(field), givenText);
+                newData = this.getNestedItems(getValue(child, data[parseInt(i.toString(), 10)]), this.getChildType(field), givenText);
                 if (newData !== undefined) {
                     break;
                 }
@@ -8213,12 +8346,12 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                     _this.setFooterTemplate();
                 }
                 _this.isFirstRender = false;
-                /* eslint-disable */
                 if (_this.hasTemplate && _this.portals) {
                     if (_this.treeObj.portals) {
-                        _this.portals = _this.portals.concat(_this.treeObj.portals.filter(function (item) { return !_this.portals.includes(item); }));
+                        _this.portals = _this.portals.concat(_this.treeObj.portals.filter(function (item) {
+                            return !_this.portals.includes(item);
+                        }));
                     }
-                    /* eslint-enable */
                     if (_this.isReact) {
                         _this.renderReactTemplates(_this.reactCallBack);
                     }
@@ -8241,7 +8374,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                     else {
                         var oldFocussedNode = _this.treeObj.element.querySelector('.e-node-focus');
                         focusedElement = _this.treeObj.element.querySelector('li:not(.e-disable):not(.e-prevent)');
-                        if (oldFocussedNode && oldFocussedNode != focusedElement) {
+                        if (oldFocussedNode && oldFocussedNode !== focusedElement) {
                             oldFocussedNode.setAttribute('tabindex', '-1');
                             removeClass([oldFocussedNode], 'e-node-focus');
                         }
@@ -8367,8 +8500,9 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         var isHeader = closest(target, '.' + HEADER);
         var isFooter = closest(target, '.' + FOOTER);
         var isScroller = target.classList.contains(DROPDOWN) ? true :
-            (matches(target, '.e-ddt .e-popup') || matches(target, '.e-ddt .e-treeview'));
-        if ((this.isPopupOpen && ((!isNullOrUndefined(this.inputWrapper) && this.inputWrapper.contains(target)) || isTree || isScroller || isHeader || isFooter)) ||
+            (matches$1(target, '.e-ddt .e-popup') || matches$1(target, '.e-ddt .e-treeview'));
+        if ((this.isPopupOpen && ((!isNullOrUndefined(this.inputWrapper) &&
+            this.inputWrapper.contains(target)) || isTree || isScroller || isHeader || isFooter)) ||
             ((this.allowMultiSelection || this.showCheckBox) && (this.isPopupOpen && target.classList.contains(CHIP_CLOSE) ||
                 (this.isPopupOpen && (target.classList.contains(CHECKALLPARENT) || target.classList.contains(ALLTEXT)
                     || target.classList.contains(CHECKBOXFRAME)))))) {
@@ -8395,7 +8529,9 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             removeClass([this.popupDiv], NODATA);
             this.hideCheckAll(false);
         }
-        this.treeDataType = this.getTreeDataType(this.treeItems, this.fields);
+        if (!this.isFilteredData) {
+            this.treeDataType = this.getTreeDataType(this.treeItems, this.fields);
+        }
         if (this.isFirstRender && this.isRemoteData) {
             this.setTreeValue();
             this.setTreeText();
@@ -8491,7 +8627,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                 dataSource: fields.dataSource, value: fields.value, text: fields.text, parentValue: fields.parentValue,
                 child: (fields.child ? this.cloneChildField(fields.child) : null), hasChildren: fields.hasChildren,
                 expanded: fields.expanded, iconCss: fields.iconCss, imageUrl: fields.imageUrl, htmlAttributes: fields.htmlAttributes,
-                query: fields.query, selected: fields.selected, selectable: fields.selectable, tableName: fields.tableName, tooltip: fields.tooltip
+                query: fields.query, selected: fields.selected, selectable: fields.selectable,
+                tableName: fields.tableName, tooltip: fields.tooltip
             };
             return clonedField;
         }
@@ -8545,7 +8682,8 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             if ((typeof field.child === 'string') && !isNullOrUndefined(getValue(field.child, this.fields.dataSource[i]))) {
                 return 2;
             }
-            if (!isNullOrUndefined(getValue(field.parentValue, this.fields.dataSource[i])) || !isNullOrUndefined(getValue(field.hasChildren, this.fields.dataSource[i]))) {
+            if (!isNullOrUndefined(getValue(field.parentValue, this.fields.dataSource[i])) ||
+                !isNullOrUndefined(getValue(field.hasChildren, this.fields.dataSource[i]))) {
                 return 1;
             }
         }
@@ -8694,14 +8832,13 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
             this.oldValue = this.value ? this.value.slice() : this.value;
         }
     };
-    DropDownTree.prototype.onNodeExpanded = function (args) {
+    DropDownTree.prototype.onNodeExpanded = function () {
         if (this.hasTemplate && this.portals && this.treeObj.portals) {
             for (var i = 0; i < this.treeObj.portals.length; i++) {
                 if (this.portals.indexOf(this.treeObj.portals[i]) === -1) {
                     this.portals.push(this.treeObj.portals[i]);
                 }
             }
-            /* eslint-enable */
             this.renderReactTemplates();
         }
     };
@@ -8797,7 +8934,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         if (!this.isFilteredData) {
             this.setProperties({ value: this.isFromFilterChange && newValues && newValues.length === 0 ? this.value : newValues }, true);
             this.isFromFilterChange = false;
-            if (newValues && newValues.length !== 0 && !this.showCheckBox) {
+            if (newValues && newValues.length !== 0 && !this.showCheckBox && !this.ddtCompareValues(this.treeObj.selectedNodes, this.value.slice())) {
                 this.treeObj.selectedNodes = this.value.slice();
                 this.treeObj.dataBind();
             }
@@ -9079,7 +9216,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
     };
     DropDownTree.prototype.templateComplier = function (template) {
         if (template) {
-            // eslint-disable-next-line
             try {
                 if (typeof template !== 'function' && document.querySelectorAll(template).length) {
                     return compile(document.querySelector(template).innerHTML.trim());
@@ -9165,7 +9301,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         this.ensurePlaceHolder();
     };
     DropDownTree.prototype.resetValue = function (isDynamicChange) {
-        if (this.value === [] && this.text == null) {
+        if (Array.isArray(this.value) && this.value.length === 0 && this.text == null) {
             return;
         }
         Input.setValue(null, this.inputEle, this.floatLabelType);
@@ -9279,9 +9415,7 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
     DropDownTree.prototype.updateTemplate = function () {
         if (this.popupObj) {
             this.clearTemplate();
-            /* eslint-disable */
             this.portals = [];
-            /* eslint-enable */
             this.popupObj.destroy();
             if (this.isPopupOpen) {
                 this.hidePopup();
@@ -9658,22 +9792,35 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
         detach(this.inputWrapper);
         detach(this.popupDiv);
         detach(this.hiddenElement);
+        Input.setRipple(false, [this.inputObj]);
         this.element.classList.remove('e-input');
         if (this.showCheckBox || this.allowMultiSelection) {
             this.element.classList.remove(CHIP_INPUT);
         }
+        detach(this.inputObj.container);
+        if (this.inputObj.buttons.length) {
+            detach(this.inputObj.buttons[0]);
+        }
         this.inputObj = null;
         while (this.hiddenElement.options.length > 0) {
             this.hiddenElement.remove(0);
         }
         this.hiddenElement.innerHTML = '';
         this.hiddenElement = null;
+        this.inputWrapper.innerHTML = '';
         this.inputWrapper = null;
         this.popupDiv = null;
         this.tree = null;
         this.popupObj = null;
         this.treeObj = null;
         this.overAllClear = null;
+        if (this.chipCollection) {
+            var chipsIcons = selectAll('.e-chips-close', this.chipCollection);
+            for (var _i = 0, chipsIcons_1 = chipsIcons; _i < chipsIcons_1.length; _i++) {
+                var element = chipsIcons_1[_i];
+                EventHandler.remove(element, 'mousedown', this.removeChip);
+            }
+        }
         this.chipWrapper = null;
         this.chipCollection = null;
         this.checkAllParent = null;
@@ -9732,7 +9879,11 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
      * @returns {void}
      */
     DropDownTree.prototype.hidePopup = function () {
-        var eventArgs = { popup: this.popupObj };
+        var eventArgs = { popup: this.popupObj, cancel: false };
+        this.trigger('close', eventArgs);
+        if (eventArgs.cancel) {
+            return;
+        }
         this.inputWrapper.classList.remove(ICONANIMATION);
         if (this.popupEle) {
             addClass([this.popupEle], DDTHIDEICON);
@@ -9746,7 +9897,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
                     addClass([this.inputWrapper], [INPUTFOCUS]);
                 }
             }
-            this.trigger('close', eventArgs);
             if (this.destroyPopupOnHide) {
                 this.isFirstRender = true;
                 this.destroyPopup();
@@ -9946,10 +10096,6 @@ var DropDownTree = /** @__PURE__ @class */ (function (_super) {
     return DropDownTree;
 }(Component));
 
-/**
- * export all modules from current location
- */
-
 var __extends$3 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -9969,8 +10115,6 @@ var __decorate$3 = (undefined && undefined.__decorate) || function (decorators,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-// eslint-disable-next-line @typescript-eslint/triple-slash-reference
-/// <reference path='../drop-down-list/drop-down-list-model.d.ts'/>
 var SPINNER_CLASS = 'e-atc-spinner-icon';
 dropDownListClasses.root = 'e-combobox';
 var inputObject$1 = {
@@ -10089,6 +10233,18 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
         }
     };
     ComboBox.prototype.updateValues = function () {
+        if (this.fields.disabled) {
+            if (this.value != null) {
+                this.value = !this.isDisableItemValue(this.value) ? this.value : null;
+            }
+            if (this.text != null) {
+                this.text = !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
+            }
+            if (this.index != null) {
+                this.index = !this.isDisabledItemByIndex(this.index) ? this.index : null;
+                this.activeIndex = this.index;
+            }
+        }
         if (!isNullOrUndefined(this.value)) {
             var currentValue = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;
             var li = this.getElementByValue(currentValue);
@@ -10336,9 +10492,9 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
         var value = this.allowObjectBinding && !isNullOrUndefined(this.value) ? getValue((this.fields.value) ? this.fields.value : '', this.value) : this.value;
         this.itemData = this.getDataByValue(value);
         var dataItem = this.getItemData();
-        var setValue$$1 = this.allowObjectBinding ? this.itemData : dataItem.value;
+        var setValue = this.allowObjectBinding ? this.itemData : dataItem.value;
         if (!(this.allowCustom && isNullOrUndefined(dataItem.value) && isNullOrUndefined(dataItem.text))) {
-            this.setProperties({ 'value': setValue$$1 }, !this.allowCustom);
+            this.setProperties({ 'value': setValue }, !this.allowCustom);
         }
     };
     /**
@@ -10522,6 +10678,9 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
             else {
                 li = this.list.querySelector('.' + dropDownListClasses.focus);
             }
+            if (this.isDisabledElement(li)) {
+                return;
+            }
             if (li) {
                 this.setSelection(li, e);
                 this.isTyped = false;
@@ -10941,10 +11100,6 @@ var ComboBox = /** @__PURE__ @class */ (function (_super) {
     return ComboBox;
 }(DropDownList));
 
-/**
- * export all modules from current location
- */
-
 var __extends$4 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -10964,8 +11119,6 @@ var __decorate$4 = (undefined && undefined.__decorate) || function (decorators,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-// eslint-disable-next-line @typescript-eslint/triple-slash-reference
-/// <reference path='../combo-box/combo-box-model.d.ts'/>
 dropDownListClasses.root = 'e-autocomplete';
 dropDownListClasses.icon = 'e-input-group-icon e-ddl-icon e-search-icon';
 /**
@@ -11423,7 +11576,7 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
         _super.prototype.render.call(this);
     };
     __decorate$4([
-        Complex({ value: null, iconCss: null, groupBy: null }, FieldSettings)
+        Complex({ value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
     ], AutoComplete.prototype, "fields", void 0);
     __decorate$4([
         Property(true)
@@ -11476,10 +11629,6 @@ var AutoComplete = /** @__PURE__ @class */ (function (_super) {
     return AutoComplete;
 }(ComboBox));
 
-/**
- * export all modules from current location
- */
-
 /**
  * FloatLable Moduel
  * Specifies whether to display the floating label above the input element.
@@ -11654,8 +11803,6 @@ var __decorate$5 = (undefined && undefined.__decorate) || function (decorators,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-// eslint-disable-next-line @typescript-eslint/triple-slash-reference
-/// <reference path='../drop-down-base/drop-down-base-model.d.ts'/>
 var FOCUS = 'e-input-focus';
 var DISABLED$1 = 'e-disabled';
 var OVER_ALL_WRAPPER = 'e-multiselect e-input-group e-control-wrapper';
@@ -11982,13 +12129,26 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             }
             else {
                 if (this.enableVirtualization) {
-                    element = this.ulElement.querySelector('li.'
-                        + dropDownBaseClasses.li + ':not(.e-virtual-list)' + ':not(.e-hide-listitem)');
+                    if (this.fields.disabled) {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.e-virtual-list)' + ':not(.e-hide-listitem)' + ':not(.' + DISABLED$1 + ')');
+                    }
+                    else {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.e-virtual-list)' + ':not(.e-hide-listitem)');
+                    }
                 }
                 else {
-                    element = this.ulElement.querySelector('li.'
-                        + dropDownBaseClasses.li + ':not(.'
-                        + HIDE_LIST + ')');
+                    if (this.fields.disabled) {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.'
+                            + HIDE_LIST + ')' + ':not(.' + DISABLED$1 + ')');
+                    }
+                    else {
+                        element = this.ulElement.querySelector('li.'
+                            + dropDownBaseClasses.li + ':not(.'
+                            + HIDE_LIST + ')');
+                    }
                 }
             }
             if (element !== null) {
@@ -12448,9 +12608,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             if (filterQuery.queries[queryElements].fn === 'onSkip') {
                 isSkip = false;
             }
-            if (filterQuery.queries[queryElements].fn === 'onTake') {
-                
-            }
+            if (filterQuery.queries[queryElements].fn === 'onTake') ;
         }
         var queryTakeValue = 0;
         if (filterQuery && filterQuery.queries.length > 0) {
@@ -13441,7 +13599,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 this.list.scrollTop = this.virtualListInfo && this.virtualListInfo.startIndex ? this.virtualListInfo.startIndex * this.listItemHeight : 0;
             }
             isScrollerCHanged = this.isKeyBoardAction;
-            
         }
         this.isKeyBoardAction = isScrollerCHanged;
     };
@@ -13719,6 +13876,21 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 }
             }
         }
+        var focusedLi = this.list ? this.list.querySelector('.e-item-focus') : null;
+        if (this.isDisabledElement(focusedLi)) {
+            if (this.list.querySelectorAll('.e-list-item:not(.e-hide-listitem):not(.e-disabled)').length === 0) {
+                this.removeFocus();
+                return;
+            }
+            var index = this.getIndexByValue(focusedLi.getAttribute('data-value'));
+            if (index === 0 && this.mode !== 'CheckBox') {
+                position = 1;
+            }
+            if (index === (this.list.querySelectorAll('.e-list-item:not(.e-hide-listitem)').length - 1)) {
+                position = -1;
+            }
+            this.moveByList(position);
+        }
     };
     MultiSelect.prototype.getElementByValue = function (value) {
         var item;
@@ -13909,7 +14081,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     }
                     _this.setProperties({ value: [].concat([], removeVal) }, true);
                     if (_this.enableVirtualization) {
-                        var currentText = index == 0 ? _this.text.replace(_this.text.split(_this.delimiterChar)[index] + _this.delimiterChar, '') : _this.text.replace(_this.delimiterChar + _this.text.split(_this.delimiterChar)[index], '');
+                        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 (element_1 !== null) {
@@ -15301,7 +15473,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
     };
     MultiSelect.prototype.addListFocus = function (element) {
-        if (this.enabled && this.isValidLI(element)) {
+        if (this.enabled && (this.isValidLI(element) || (this.fields.disabled && this.isDisabledElement(element)))) {
             this.removeFocus();
             addClass([element], dropDownBaseClasses.focus);
             this.updateAriaActiveDescendant();
@@ -15892,14 +16064,14 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         var li;
         if (!isNullOrUndefined(this.list)) {
             li = this.list.querySelectorAll(state ?
-                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-virtual-list)' :
-                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-virtual-list)');
+                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)' :
+                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)');
         }
         if (this.value && this.value.length && event && event.target
             && closest(event.target, '.e-close-hooker') && this.allowFiltering) {
             li = this.mainList.querySelectorAll(state ?
-                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-virtual-list)' :
-                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-virtual-list)');
+                'li.e-list-item:not([aria-selected="true"]):not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)' :
+                'li.e-list-item[aria-selected="true"]:not(.e-reorder-hide):not(.e-disabled):not(.e-virtual-list)');
         }
         if (this.enableGroupCheckBox && this.mode === 'CheckBox' && !isNullOrUndefined(this.fields.groupBy)) {
             var target = (event ? (this.groupTemplate ? closest(event.target, '.e-list-group-item') : event.target) : null);
@@ -16347,9 +16519,16 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                     this.updateClearButton(newProp.showClearButton);
                     break;
                 case 'text':
+                    if (this.fields.disabled) {
+                        this.text =
+                            this.text && !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
+                    }
                     this.updateVal(this.value, this.value, 'text');
                     break;
                 case 'value':
+                    if (this.fields.disabled) {
+                        this.removeDisabledItemsValue(this.value);
+                    }
                     this.updateVal(this.value, oldProp.value, 'value');
                     this.addValidInputClass();
                     if (!this.closePopupOnSelect && this.isPopupOpen()) {
@@ -16512,7 +16691,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         }
         return valuecheck;
     };
-    
     MultiSelect.prototype.addNonPresentItems = function (valuecheck, ulElement, list, event) {
         var _this = this;
         this.dataSource.executeQuery(this.getForQuery(valuecheck)).then(function (e) {
@@ -16522,7 +16700,6 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             _this.updateActionList(ulElement, list, event);
         });
     };
-    
     MultiSelect.prototype.updateVal = function (newProp, oldProp, prop) {
         if (!this.list) {
             this.onLoadSelect();
@@ -16598,7 +16775,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
             var animModel = {
                 name: 'FadeOut',
                 duration: 100,
-                delay: delay ? delay : 0
+                delay:  delay 
             };
             this.customFilterQuery = null;
             var eventArgs = { popup: this.popupObj, cancel: false, animation: animModel, event: e || null };
@@ -16921,8 +17098,33 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         listParent.remove();
         return listItemHeight;
     };
+    /**
+     * Removes disabled values from the given array.
+     *
+     * @param { number[] | string[] | boolean[] | object[] } value - The array to check.
+     * @returns {void}
+     */
+    MultiSelect.prototype.removeDisabledItemsValue = function (value) {
+        if (value) {
+            var data = [];
+            var dataIndex = 0;
+            for (var index = 0; index < value.length; index++) {
+                var indexValue = value[index];
+                if (typeof (indexValue) === 'object') {
+                    indexValue = JSON.parse(JSON.stringify(indexValue))[this.fields.value];
+                }
+                if ((indexValue != null) && !(this.isDisabledItemByIndex(this.getIndexByValue(indexValue)))) {
+                    data[dataIndex++] = value[index];
+                }
+            }
+            this.value = data.length > 0 ? data : null;
+        }
+    };
     MultiSelect.prototype.checkInitialValue = function () {
         var _this = this;
+        if (this.fields.disabled) {
+            this.removeDisabledItemsValue(this.value);
+        }
         var isData = this.dataSource instanceof Array ? (this.dataSource.length > 0)
             : !isNullOrUndefined(this.dataSource);
         if (!(this.value && this.value.length) &&
@@ -16961,6 +17163,9 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
                 _super.prototype.render.call(this);
             }
         }
+        if (this.fields.disabled) {
+            this.text = this.text && !this.isDisabledItemByIndex(this.getIndexByValue(this.getValueByText(this.text))) ? this.text : null;
+        }
         if (!isNullOrUndefined(this.text) && (isNullOrUndefined(this.value) || this.value.length === 0)) {
             this.initialTextUpdate();
         }
@@ -17095,6 +17300,66 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         this.refreshInputHight();
         this.checkPlaceholderSize();
     };
+    /**
+     * Method to disable specific item in the popup.
+     *
+     * @param {string | number | object | HTMLLIElement} item - Specifies the item to be disabled.
+     * @returns {void}
+     * @deprecated
+     */
+    MultiSelect.prototype.disableItem = function (item) {
+        if (this.fields.disabled) {
+            if (!this.list) {
+                this.renderList();
+            }
+            var itemIndex = -1;
+            if (this.liCollections && this.liCollections.length > 0 && this.listData && this.fields.disabled) {
+                if (typeof (item) === 'string') {
+                    itemIndex = this.getIndexByValue(item);
+                }
+                else if (typeof item === 'object') {
+                    if (item instanceof HTMLLIElement) {
+                        for (var index = 0; index < this.liCollections.length; index++) {
+                            if (this.liCollections[index] === item) {
+                                itemIndex = this.getIndexByValue(item.getAttribute('data-value'));
+                                break;
+                            }
+                        }
+                    }
+                    else {
+                        var value = JSON.parse(JSON.stringify(item))[this.fields.value];
+                        for (var index = 0; index < this.listData.length; index++) {
+                            if (JSON.parse(JSON.stringify(this.listData[index]))[this.fields.value] === value) {
+                                itemIndex = this.getIndexByValue(value);
+                                break;
+                            }
+                        }
+                    }
+                }
+                else {
+                    itemIndex = item;
+                }
+                var isValidIndex = itemIndex < this.liCollections.length && itemIndex > -1;
+                if (isValidIndex && !(JSON.parse(JSON.stringify(this.listData[itemIndex]))[this.fields.disabled])) {
+                    var li = this.liCollections[itemIndex];
+                    if (li) {
+                        this.disableListItem(li);
+                        var parsedData = JSON.parse(JSON.stringify(this.listData[itemIndex]));
+                        parsedData[this.fields.disabled] = true;
+                        this.listData[itemIndex] = parsedData;
+                        if (li.classList.contains(dropDownBaseClasses.focus)) {
+                            this.removeFocus();
+                        }
+                        if (li.classList.contains(HIDE_LIST) || li.classList.contains(dropDownBaseClasses.selected)) {
+                            var oldValue = this.value;
+                            this.removeDisabledItemsValue(this.value);
+                            this.updateVal(this.value, oldValue, 'value');
+                        }
+                    }
+                }
+            }
+        }
+    };
     /**
      * Removes the component from the DOM and detaches all its related event handlers. Also it removes the attributes and classes.
      *
@@ -17162,7 +17427,7 @@ var MultiSelect = /** @__PURE__ @class */ (function (_super) {
         this.selectAllEventEle = null;
     };
     __decorate$5([
-        Complex({ text: null, value: null, iconCss: null, groupBy: null }, FieldSettings)
+        Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)
     ], MultiSelect.prototype, "fields", void 0);
     __decorate$5([
         Property(false)
@@ -17547,12 +17812,12 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
         }
         if (!isNullOrUndefined(this.checkWrapper)) {
             var checkElement = select('.' + CHECKBOXFRAME$1, this.checkWrapper);
-            var selectAll$$1 = false;
-            this.validateCheckNode(this.checkWrapper, checkElement.classList.contains(CHECK$1), args.li, args.e, selectAll$$1);
+            var selectAll = false;
+            this.validateCheckNode(this.checkWrapper, checkElement.classList.contains(CHECK$1), args.li, args.e, selectAll);
         }
     };
-    CheckBoxSelection.prototype.validateCheckNode = function (checkWrap, isCheck, li, e, selectAll$$1) {
-        this.changeState(checkWrap, isCheck ? 'uncheck' : 'check', e, true, selectAll$$1);
+    CheckBoxSelection.prototype.validateCheckNode = function (checkWrap, isCheck, li, e, selectAll) {
+        this.changeState(checkWrap, isCheck ? 'uncheck' : 'check', e, true, selectAll);
     };
     CheckBoxSelection.prototype.clickHandler = function (e) {
         var target;
@@ -17563,26 +17828,26 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
             target = e.currentTarget;
         }
         this.checkWrapper = closest(target, '.' + CHECKBOXWRAP$1);
-        var selectAll$$1 = true;
+        var selectAll = true;
         if (!isNullOrUndefined(this.checkWrapper)) {
             var checkElement = select('.' + CHECKBOXFRAME$1, this.checkWrapper);
-            this.validateCheckNode(this.checkWrapper, checkElement.classList.contains(CHECK$1), null, e, selectAll$$1);
+            this.validateCheckNode(this.checkWrapper, checkElement.classList.contains(CHECK$1), null, e, selectAll);
         }
         e.preventDefault();
     };
-    CheckBoxSelection.prototype.changeState = function (wrapper, state, e, isPrevent, selectAll$$1) {
+    CheckBoxSelection.prototype.changeState = function (wrapper, state, e, isPrevent, selectAll) {
         var frameSpan = wrapper.getElementsByClassName(CHECKBOXFRAME$1)[0];
         if (state === 'check' && !frameSpan.classList.contains(CHECK$1)) {
             frameSpan.classList.remove(INDETERMINATE);
             frameSpan.classList.add(CHECK$1);
-            if (selectAll$$1) {
+            if (selectAll) {
                 this.parent.selectAllItems(true, e);
                 this.setLocale(true);
             }
         }
         else if (state === 'uncheck' && (frameSpan.classList.contains(CHECK$1) || frameSpan.classList.contains(INDETERMINATE))) {
             removeClass([frameSpan], [CHECK$1, INDETERMINATE]);
-            if (selectAll$$1) {
+            if (selectAll) {
                 this.parent.selectAllItems(false, e);
                 this.setLocale();
             }
@@ -17590,7 +17855,7 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
         else if (state === 'indeterminate' && !(frameSpan.classList.contains(INDETERMINATE))) {
             removeClass([frameSpan], [CHECK$1]);
             frameSpan.classList.add(INDETERMINATE);
-            if (selectAll$$1) {
+            if (selectAll) {
                 this.parent.selectAllItems(false, e);
                 this.setLocale();
             }
@@ -17882,10 +18147,6 @@ var CheckBoxSelection = /** @__PURE__ @class */ (function () {
     return CheckBoxSelection;
 }());
 
-/**
- * export all modules from current location
- */
-
 var __extends$6 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -17905,8 +18166,6 @@ var __decorate$6 = (undefined && undefined.__decorate) || function (decorators,
     else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
     return c > 3 && r && Object.defineProperty(target, key, r), r;
 };
-// eslint-disable-next-line @typescript-eslint/triple-slash-reference
-/// <reference path='../drop-down-base/drop-down-base-model.d.ts'/>
 /**
  * Defines the Selection settings of List Box.
  */
@@ -18020,6 +18279,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
         var hiddenSelect = this.createElement('select', { className: 'e-hidden-select', attrs: { 'multiple': '' } });
         hiddenSelect.style.visibility = 'hidden';
         this.list.classList.add('e-listbox-wrapper');
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         this.list.querySelector('.e-list-parent').setAttribute('role', 'presentation');
         var groupHdrs = this.list.querySelectorAll('.e-list-group-item');
         for (var i = 0; i < groupHdrs.length; i++) {
@@ -18038,7 +18298,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
             }
         }
         else {
-            if (this.initLoad) {
+            if (this.initLoad && this.element.parentElement) {
                 this.element.parentElement.insertBefore(this.list, this.element);
             }
             this.list.insertBefore(this.element, this.list.firstChild);
@@ -18106,6 +18366,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
     ListBox.prototype.initToolbar = function () {
         var pos = this.toolbarSettings.position;
         var prevScope = this.element.getAttribute('data-value');
+        this.toolbarSettings.items = isNullOrUndefined(this.toolbarSettings.items) ? [] : this.toolbarSettings.items;
         if (this.toolbarSettings.items.length) {
             var toolElem = this.createElement('div', { className: 'e-listbox-tool', attrs: { 'role': 'toolbar' } });
             var wrapper = this.createElement('div', {
@@ -18200,7 +18461,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
             this.spinner = this.createElement('div', { className: 'e-listbox-wrapper' });
         }
         this.spinner.style.height = formatUnit(this.height);
-        this.element.parentElement.insertBefore(this.spinner, this.element.nextSibling);
+        if (this.element.parentElement) {
+            this.element.parentElement.insertBefore(this.spinner, this.element.nextSibling);
+        }
         createSpinner({ target: this.spinner }, this.createElement);
         showSpinner(this.spinner);
     };
@@ -18506,7 +18769,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
             }
             var fListData_1 = [].slice.call(this.listData);
             var fSortData_1 = [].slice.call(this.sortedData);
-            selectedOptions.forEach(function (value, index) {
+            selectedOptions.forEach(function (value) {
                 droppedData = _this.getDataByValue(value);
                 var srcIdx = _this.listData.indexOf(droppedData);
                 var jsonSrcIdx = _this.jsonData.indexOf(droppedData);
@@ -19057,6 +19320,10 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
         }
     };
     ListBox.prototype.clickHandler = function (e) {
+        var li = closest(e.target, '.' + 'e-list-item');
+        if (isNullOrUndefined(li)) {
+            return;
+        }
         this.selectHandler(e);
     };
     ListBox.prototype.checkSelectAll = function () {
@@ -19549,6 +19816,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
         }
         var _loop_3 = function (i) {
             if (fListBox.ulElement.childNodes[i].classList.contains('e-disabled')) {
+                // eslint-disable-next-line @typescript-eslint/tslint/config
                 flistboxarray = flistboxarray.filter(function (item) { return item !== i; });
                 tempLiColl.push(fListBox.ulElement.childNodes[i]);
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -19879,10 +20147,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
     };
     ListBox.prototype.dataUpdater = function (dataSource, query, fields) {
         this.isDataFetched = false;
-        var backCommand = true;
         if (this.targetElement().trim() === '') {
             var list = this.mainList.cloneNode ? this.mainList.cloneNode(true) : this.mainList;
-            if (backCommand) {
+            {
                 this.remoteCustomValue = false;
                 if (this.isAngular && this.itemTemplate) {
                     list = this.renderItems(this.listData, fields);
@@ -19969,7 +20236,9 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
             });
         }
     };
-    ListBox.prototype.setSelection = function (values, isSelect, isText, canFocus) {
+    ListBox.prototype.setSelection = function (
+    // eslint-disable-next-line max-len
+    values, isSelect, isText, canFocus) {
         var _this = this;
         if (values === void 0) { values = this.value; }
         if (isSelect === void 0) { isSelect = true; }
@@ -19994,21 +20263,21 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
                     li = _this.list.querySelector('[data-value="' + text + '"]');
                 }
                 if (li) {
-                    if (_this.selectionSettings.showCheckbox) {
+                    if (_this.selectionSettings.showCheckbox && !li.classList.contains('e-disabled')) {
                         liselect = li.getElementsByClassName('e-frame')[0].classList.contains('e-check');
                     }
                     else {
                         liselect = li.classList.contains('e-selected');
                     }
                     if (!isSelect && liselect || isSelect && !liselect && li) {
-                        if (_this.selectionSettings.showCheckbox) {
+                        if (_this.selectionSettings.showCheckbox && !li.classList.contains('e-disabled')) {
                             _this.notify('updatelist', { li: li, module: 'listbox' });
                             if (canFocus) {
                                 li.focus();
                             }
                         }
                         else {
-                            if (isSelect) {
+                            if (isSelect && !li.classList.contains('e-disabled')) {
                                 li.classList.add(cssClass.selected);
                                 li.setAttribute('aria-selected', 'true');
                                 if (canFocus) {
@@ -20042,7 +20311,17 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
         this.checkSelectAll();
     };
     ListBox.prototype.checkDisabledState = function (inst) {
-        return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
+        if (isNullOrUndefined(inst.ulElement)) {
+            if (!isNullOrUndefined(this.dataSource) && isNullOrUndefined(this.dataSource.length)) {
+                return false;
+            }
+            else {
+                return true;
+            }
+        }
+        else {
+            return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
+        }
     };
     ListBox.prototype.updateToolBarState = function () {
         var _this = this;
@@ -20280,6 +20559,7 @@ var ListBox = /** @__PURE__ @class */ (function (_super) {
                         }
                     }
                     if (newProp.toolbarSettings.items) {
+                        oldProp.toolbarSettings.items = isNullOrUndefined(oldProp.toolbarSettings.items) ? [] : oldProp.toolbarSettings.items;
                         if (oldProp.toolbarSettings && oldProp.toolbarSettings.items.length) {
                             ele = this.list.parentElement;
                             ele.parentElement.insertBefore(this.list, ele);
@@ -20416,10 +20696,6 @@ var listBoxClasses = {
     clearIcon: 'e-clear-icon'
 };
 
-/**
- * export all modules from current location
- */
-
 var __extends$7 = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -20501,12 +20777,12 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
             this.setCssClass(newClass, [this.popupObj.element], oldClass);
         }
     };
-    Mention.prototype.setCssClass = function (cssClass$$1, elements, oldClass) {
+    Mention.prototype.setCssClass = function (cssClass, elements, oldClass) {
         if (!isNullOrUndefined(oldClass) && oldClass !== '') {
             removeClass(elements, oldClass.split(' '));
         }
-        if (!isNullOrUndefined(cssClass$$1) && cssClass$$1 !== '') {
-            addClass(elements, cssClass$$1.split(' '));
+        if (!isNullOrUndefined(cssClass) && cssClass !== '') {
+            addClass(elements, cssClass.split(' '));
         }
     };
     Mention.prototype.initializeData = function () {
@@ -20711,6 +20987,9 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
         }
     };
     Mention.prototype.updateUpDownAction = function (e) {
+        if (this.fields.disabled && this.list && this.list.querySelectorAll('.e-list-item:not(.e-disabled)').length === 0) {
+            return;
+        }
         var focusEle = this.list.querySelector('.' + dropDownBaseClasses.focus);
         if (this.isSelectFocusItem(focusEle)) {
             this.setSelection(focusEle, e);
@@ -20731,6 +21010,17 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
                 this.setSelection(nextItem, e);
             }
         }
+        var itemIndex;
+        for (var index = 0; index < this.liCollections.length; index++) {
+            if (this.liCollections[index].classList.contains(dropDownBaseClasses.focus)
+                || this.liCollections[index].classList.contains(dropDownBaseClasses.selected)) {
+                itemIndex = index;
+                break;
+            }
+        }
+        if (itemIndex != null && this.isDisabledElement(this.liCollections[itemIndex])) {
+            this.updateUpDownAction(e);
+        }
         if (this.isPopupOpen) {
             e.preventDefault();
         }
@@ -20906,7 +21196,7 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
             if (!isNullOrUndefined(ulElement)) {
                 attributes(ulElement, { 'id': this.inputElement.id + '_options', 'role': 'listbox', 'aria-hidden': 'false' });
             }
-            var focusItem = ulElement.querySelector('.' + dropDownBaseClasses.li);
+            var focusItem = this.fields.disabled ? ulElement.querySelector('.' + dropDownBaseClasses.li + ':not(.e-disabled)') : ulElement.querySelector('.' + dropDownBaseClasses.li);
             if (focusItem) {
                 focusItem.classList.add(dropDownBaseClasses.selected);
                 this.selectedLI = focusItem;
@@ -21135,10 +21425,10 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
                     }
                 }
                 append([_this.list], popupEle_1);
-                if (_this.inputElement.parentElement && _this.inputElement.parentElement.parentElement &&
-                    _this.inputElement.parentElement.parentElement.classList.contains('e-richtexteditor')) {
-                    if (popupEle_1.firstElementChild && popupEle_1.firstElementChild.childElementCount > 0) {
-                        popupEle_1.firstElementChild.setAttribute('aria-owns', _this.inputElement.parentElement.parentElement.id);
+                if (_this.inputElement.parentElement) {
+                    var rteRootElement = _this.inputElement.parentElement.closest('.e-richtexteditor');
+                    if (rteRootElement && popupEle_1.firstElementChild && popupEle_1.firstElementChild.childElementCount > 0) {
+                        popupEle_1.firstElementChild.setAttribute('aria-owns', rteRootElement.id);
                         addClass([popupEle_1], 'e-rte-elements');
                     }
                 }
@@ -21441,7 +21731,7 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
     Mention.prototype.onMouseClick = function (e) {
         var target = e.target;
         var li = closest(target, '.' + dropDownBaseClasses.li);
-        if (!this.isValidLI(li)) {
+        if (!this.isValidLI(li) || this.isDisabledElement(li)) {
             return;
         }
         this.isSelected = true;
@@ -21672,6 +21962,7 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
             }
             this.isTyped = false;
             range.deleteContents();
+            range.startContainer.parentElement.normalize();
             var element = this.createElement('div');
             element.innerHTML = value;
             var frag = document.createDocumentFragment();
@@ -21697,7 +21988,6 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
                 var event_1 = new CustomEvent('content-changed', { detail: { click: true } });
                 this.inputElement.dispatchEvent(event_1);
             }
-            
             this.onChangeEvent(e);
         }
     };
@@ -21708,10 +21998,10 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
         }
         if (this.isContentEditable(this.inputElement)) {
             if (Browser.isAndroid) {
-                return '<span contenteditable="true" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : ' ');
+                return '<span contenteditable="true" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : '');
             }
             else {
-                return '<span contenteditable="false" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : ' ');
+                return '<span contenteditable="false" class="e-mention-chip">' + showChar + value + '</span>'.concat(typeof this.suffixText === 'string' ? this.suffixText : '');
             }
         }
         else {
@@ -22068,13 +22358,5 @@ var Mention = /** @__PURE__ @class */ (function (_super) {
     return Mention;
 }(DropDownBase));
 
-/**
- * export all modules from current location
- */
-
-/**
- * export all modules from current location
- */
-
-export { incrementalSearch, Search, escapeCharRegExp, resetIncrementalSearchValues, highlightSearch, revertHighlightSearch, VirtualScroll, FieldSettings, dropDownBaseClasses, DropDownBase, dropDownListClasses, DropDownList, Fields, TreeSettings, DropDownTree, ComboBox, AutoComplete, MultiSelect, CheckBoxSelection, createFloatLabel, updateFloatLabelState, removeFloating, setPlaceHolder, floatLabelFocus, floatLabelBlur, encodePlaceholder, SelectionSettings, ToolbarSettings, ListBox, Mention };
+export { AutoComplete, CheckBoxSelection, ComboBox, DropDownBase, DropDownList, DropDownTree, FieldSettings, Fields, ListBox, Mention, MultiSelect, Search, SelectionSettings, ToolbarSettings, TreeSettings, VirtualScroll, createFloatLabel, dropDownBaseClasses, dropDownListClasses, encodePlaceholder, escapeCharRegExp, floatLabelBlur, floatLabelFocus, highlightSearch, incrementalSearch, removeFloating, resetIncrementalSearchValues, revertHighlightSearch, setPlaceHolder, updateFloatLabelState };
 //# sourceMappingURL=ej2-dropdowns.es5.js.map