@syncfusion/ej2-dropdowns 27.1.52 → 27.1.53

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 27.1.52
+*  version : 27.1.53
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-dropdowns@*",
-  "_id": "@syncfusion/ej2-dropdowns@27.1.51",
+  "_id": "@syncfusion/ej2-dropdowns@27.1.52",
   "_inBundle": false,
-  "_integrity": "sha512-750+JQ5NQhry6CN+uownI1WIljTmyMp3yfLVoU49Xt7OvYAA00LE6SExiAt1ahSP6hZ5FArdNBrtozJfMTzEYw==",
+  "_integrity": "sha512-lgrKKbthjGtnEjuwnAZd+5EzMt2JLyNRVUP0+SPCG7vJWyXFle2NiJX0FKIogrUk2Idaif+qtcs9CXIBh8NOBw==",
   "_location": "/@syncfusion/ej2-dropdowns",
   "_phantomChildren": {},
   "_requested": {
@@ -36,8 +36,8 @@
     "/@syncfusion/ej2-spreadsheet",
     "/@syncfusion/ej2-vue-dropdowns"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-27.1.51.tgz",
-  "_shasum": "5921651e7e84bb1de437bfcace522cb1ddc7ac59",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-27.1.52.tgz",
+  "_shasum": "f5fe34cbcdf22285b14cce67aba1da75d36b301d",
   "_spec": "@syncfusion/ej2-dropdowns@*",
   "_where": "/jenkins/workspace/elease-automation_release_27.1.1/packages/included",
   "author": {
@@ -45,13 +45,13 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~27.1.52",
+    "@syncfusion/ej2-base": "~27.1.53",
     "@syncfusion/ej2-data": "~27.1.52",
     "@syncfusion/ej2-inputs": "~27.1.50",
     "@syncfusion/ej2-lists": "~27.1.50",
-    "@syncfusion/ej2-navigations": "~27.1.52",
+    "@syncfusion/ej2-navigations": "~27.1.53",
     "@syncfusion/ej2-notifications": "~27.1.50",
-    "@syncfusion/ej2-popups": "~27.1.50"
+    "@syncfusion/ej2-popups": "~27.1.53"
   },
   "deprecated": false,
   "description": "Essential JS 2 DropDown Components",
@@ -76,7 +76,7 @@
   "module": "./index.js",
   "name": "@syncfusion/ej2-dropdowns",
   "typings": "index.d.ts",
-  "version": "27.1.52",
+  "version": "27.1.53",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

package/src/drop-down-base/drop-down-base.js

@@ -1219,6 +1219,10 @@ var DropDownBase = /** @class */ (function (_super) {
     DropDownBase.prototype.renderItems = function (listData, fields, isCheckBoxUpdate) {
         var ulElement;
         if (this.itemTemplate && listData) {
+            if (this.getModuleName() === 'multiselect' && this.virtualSelectAll) {
+                this.virtualSelectAllData = listData;
+                listData = listData.slice(this.virtualItemStartIndex, this.virtualItemEndIndex);
+            }
             var dataSource = listData;
             if (dataSource && fields.groupBy) {
                 if (this.sortOrder !== 'None') {

package/src/drop-down-list/drop-down-list.js

@@ -2348,7 +2348,7 @@ var DropDownList = /** @class */ (function (_super) {
         if (!isNullOrUndefined(this.itemData) && !isNullOrUndefined(newElement)) {
             var value_2 = this.getItemData().value;
             var isExist = listData.some(function (data) {
-                return (((typeof data === 'string' || typeof data === 'number') && data === value_2) ||
+                return (((typeof data === 'string' || typeof data === 'number' || typeof data === 'boolean') && data === value_2) ||
                     (getValue(_this.fields.value, data) === value_2));
             });
             if (!isExist) {
@@ -2653,7 +2653,7 @@ var DropDownList = /** @class */ (function (_super) {
                 _this.isNotSearchList = false;
                 _this.isDocumentClick = false;
                 _this.destroyPopup();
-                if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list[0]) {
+                if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list.length > 0) {
                     _this.isActive = true;
                     if (_this.enableVirtualization) {
                         _this.onActionComplete(_this.ulElement, _this.listData, null, true);

package/src/drop-down-tree/drop-down-tree.js

@@ -2155,7 +2155,7 @@ var DropDownTree = /** @class */ (function (_super) {
             var id = getValue('id', args.data[0]).toString();
             this.removeSelectedData(id, true);
         }
-        if (!this.isChipDelete && args.isInteracted) {
+        if (!this.isChipDelete && args.isInteracted || (!this.isFilteredData && args.action === 'check' && this.isFromFilterChange)) {
             this.setMultiSelect();
             this.ensurePlaceHolder();
         }

package/src/list-box/list-box.js

@@ -721,6 +721,12 @@ var ListBox = /** @class */ (function (_super) {
                 liCollElem[i].classList.remove('e-grabbed');
             }
         }
+        if (this.toolbarSettings.items.length > 0) {
+            this.updateToolBarState();
+        }
+        else if (this.tBListBox && this.tBListBox.toolbarSettings.items.length > 0) {
+            this.tBListBox.updateToolBarState();
+        }
     };
     ListBox.prototype.updateListItems = function (sourceElem, destElem) {
         destElem.innerHTML = '';
@@ -806,9 +812,9 @@ var ListBox = /** @class */ (function (_super) {
                 li.setAttribute('aria-disabled', 'true');
             }
         });
-        if (this.allowFiltering && this.filterInput.value !== '' && this.toolbarSettings.items.length > 0) {
+        if (this.allowFiltering && this.filterInput && this.filterInput.value !== '' && this.toolbarSettings.items.length > 0) {
             var canDisable_1 = false;
-            this.liCollections.forEach(function (li) { if (!li.classList.contains('e-disabled')) {
+            this.ulElement.childNodes.forEach(function (li) { if (!li.classList.contains('e-disabled')) {
                 canDisable_1 = true;
             } });
             if (!canDisable_1) {

package/src/multi-select/multi-select.js

@@ -2590,7 +2590,7 @@ var MultiSelect = /** @class */ (function (_super) {
                 var value_1 = this.allowObjectBinding ?
                     getValue(((this.fields.value) ? this.fields.value : ''), this.value[this.value.length - 1]) :
                     this.value[this.value.length - 1];
-                var temp = this.getTextByValue(value_1);
+                var temp = text;
                 var textValues = this.text != null && this.text !== '' ? this.text + ',' + temp : temp;
                 currentText.push(textValues);
                 this.setProperties({ text: currentText.toString() }, true);
@@ -2627,12 +2627,12 @@ var MultiSelect = /** @class */ (function (_super) {
             removeClass(collection, 'e-disable');
         }
     };
-    MultiSelect.prototype.dispatchSelect = function (value, eve, element, isNotTrigger, length) {
+    MultiSelect.prototype.dispatchSelect = function (value, eve, element, isNotTrigger, length, dataValue, text) {
         var _this = this;
         var list = this.listData;
         if (this.initStatus && !isNotTrigger) {
             value = this.allowObjectBinding ? getValue(((this.fields.value) ? this.fields.value : ''), value) : value;
-            var val_2 = this.getDataByValue(value);
+            var val_2 = dataValue ? dataValue : this.getDataByValue(value);
             var eventArgs = {
                 e: eve,
                 item: element,
@@ -2666,16 +2666,26 @@ var MultiSelect = /** @class */ (function (_super) {
                             _this.selectedListData = [(_this.getDataByValue(value))];
                         }
                         else {
-                            if (Array.isArray(_this.selectedListData)) {
-                                _this.selectedListData.push((_this.getDataByValue(value)));
+                            if (dataValue) {
+                                if (Array.isArray(_this.selectedListData)) {
+                                    _this.selectedListData.push(dataValue);
+                                }
+                                else {
+                                    _this.selectedListData = [_this.selectedListData, dataValue];
+                                }
                             }
                             else {
-                                _this.selectedListData = [_this.selectedListData, (_this.getDataByValue(value))];
+                                if (Array.isArray(_this.selectedListData)) {
+                                    _this.selectedListData.push((_this.getDataByValue(value)));
+                                }
+                                else {
+                                    _this.selectedListData = [_this.selectedListData, (_this.getDataByValue(value))];
+                                }
                             }
                         }
                     }
                     if ((_this.enableVirtualization && value) || !_this.enableVirtualization) {
-                        _this.updateListSelectEventCallback(value, element, eve);
+                        _this.updateListSelectEventCallback(value, element, eve, text);
                     }
                     if (_this.hideSelectedItem && _this.fixedHeaderElement && _this.fields.groupBy && _this.mode !== 'CheckBox') {
                         _super.prototype.scrollStop.call(_this);
@@ -3789,10 +3799,10 @@ var MultiSelect = /** @class */ (function (_super) {
             this.removeValue(value, e, length);
         }
     };
-    MultiSelect.prototype.updateListSelectEventCallback = function (value, li, e) {
+    MultiSelect.prototype.updateListSelectEventCallback = function (value, li, e, currentText) {
         var _this = this;
         value = this.allowObjectBinding ? getValue(((this.fields.value) ? this.fields.value : ''), value) : value;
-        var text = this.getTextByValue(value);
+        var text = currentText ? currentText : this.getTextByValue(value);
         if ((this.allowCustomValue || this.allowFiltering) &&
             !this.findListElement(this.mainList, 'li', 'data-value', value) &&
             (!this.enableVirtualization || (this.enableVirtualization && this.virtualCustomData))) {
@@ -4639,7 +4649,9 @@ var MultiSelect = /** @class */ (function (_super) {
                                 if (_this.value && obj[_this.fields.value] != null && Array.isArray(_this.value) &&
                                     ((!_this.allowObjectBinding && _this.value.indexOf(obj[_this.fields.value]) < 0) ||
                                         (_this.allowObjectBinding && !_this.isObjectInArray(obj[_this.fields.value], _this.value)))) {
-                                    _this.dispatchSelect(obj[_this.fields.value], event, null, false, length);
+                                    var value = obj[_this.fields.value];
+                                    var text = (obj[_this.fields.text]).toString();
+                                    _this.dispatchSelect(value, event, null, false, length, obj, text);
                                 }
                             });
                         }
@@ -4649,7 +4661,7 @@ var MultiSelect = /** @class */ (function (_super) {
                             _this.updateValueState(event, _this.value, _this.tempValues);
                             _this.isSelectAll = _this.isSelectAll ? !_this.isSelectAll : _this.isSelectAll;
                         }
-                        _this.updateHiddenElement();
+                        _this.updateHiddenElement(true);
                         if (_this.popupWrapper && li[index - 1] && li[index - 1].classList.contains('e-item-focus')) {
                             var selectAllParent = document.getElementsByClassName('e-selectall-parent')[0];
                             if (selectAllParent && selectAllParent.classList.contains('e-item-focus')) {
@@ -4819,7 +4831,7 @@ var MultiSelect = /** @class */ (function (_super) {
             }
         }
     };
-    MultiSelect.prototype.updateHiddenElement = function () {
+    MultiSelect.prototype.updateHiddenElement = function (isVirtualSelectAll) {
         var _this = this;
         var hiddenValue = '';
         var wrapperText = '';
@@ -4828,20 +4840,24 @@ var MultiSelect = /** @class */ (function (_super) {
         if (this.mode === 'CheckBox') {
             this.value.map(function (value, index) {
                 hiddenValue += '<option selected value ="' + value + '">' + index + '</option>';
-                if (_this.listData) {
-                    data = _this.getTextByValue(value);
-                }
-                else {
-                    data = value;
+                if (!isVirtualSelectAll) {
+                    if (_this.listData) {
+                        data = _this.getTextByValue(value);
+                    }
+                    else {
+                        data = value;
+                    }
+                    wrapperText += data + _this.delimiterChar + ' ';
+                    text.push(data);
                 }
-                wrapperText += data + _this.delimiterChar + ' ';
-                text.push(data);
             });
             this.hiddenElement.innerHTML = hiddenValue;
-            this.updateWrapperText(this.delimiterWrapper, wrapperText);
+            if (!isVirtualSelectAll) {
+                this.updateWrapperText(this.delimiterWrapper, wrapperText);
+                this.setProperties({ text: text.toString() }, true);
+            }
             this.delimiterWrapper.setAttribute('id', getUniqueID('delim_val'));
             this.inputElement.setAttribute('aria-describedby', this.delimiterWrapper.id);
-            this.setProperties({ text: text.toString() }, true);
             this.refreshInputHight();
             this.refreshPlaceHolder();
         }
@@ -5870,20 +5886,13 @@ var MultiSelect = /** @class */ (function (_super) {
         if (this.isReact) {
             this.clearTemplate();
         }
-        if (this.popupObj) {
+        if (!isNullOrUndefined(this.popupObj)) {
             this.popupObj.hide();
+            this.popupObj.destroy();
         }
         this.notify(destroy, {});
         this.unwireListEvents();
         this.unWireEvent();
-        this.list = null;
-        this.popupObj = null;
-        this.mainList = null;
-        this.mainData = null;
-        this.filterParent = null;
-        this.ulElement = null;
-        this.mainListCollection = null;
-        _super.prototype.destroy.call(this);
         var temp = ['readonly', 'aria-disabled', 'placeholder', 'aria-label', 'aria-expanded'];
         var length = temp.length;
         if (!isNullOrUndefined(this.inputElement)) {
@@ -5905,6 +5914,56 @@ var MultiSelect = /** @class */ (function (_super) {
                 remove(this.overAllWrapper);
             }
         }
+        if (this.popupWrapper && this.popupWrapper.parentElement) {
+            this.popupWrapper.parentElement.remove();
+        }
+        while (this.searchWrapper && this.searchWrapper.firstChild) {
+            this.searchWrapper.removeChild(this.searchWrapper.firstChild);
+        }
+        if (this.searchWrapper && this.searchWrapper.parentElement) {
+            this.searchWrapper.parentElement.remove();
+        }
+        if (this.viewWrapper && this.viewWrapper.parentElement) {
+            this.viewWrapper.parentElement.remove();
+        }
+        if (this.overAllClear && this.overAllClear.parentElement) {
+            this.overAllClear.parentElement.remove();
+        }
+        if (this.delimiterWrapper && this.delimiterWrapper.parentElement) {
+            this.delimiterWrapper.parentElement.remove();
+        }
+        // Remove the select element if it exists
+        var selectElement = this.overAllWrapper.querySelector('select.e-multi-hidden');
+        if (selectElement && selectElement.parentElement) {
+            selectElement.parentElement.remove();
+        }
+        while (this.componentWrapper && this.componentWrapper.firstChild) {
+            this.componentWrapper.removeChild(this.componentWrapper.firstChild);
+        }
+        if (this.componentWrapper && this.componentWrapper.parentElement) {
+            this.componentWrapper.removeAttribute('class');
+            this.componentWrapper.parentElement.remove();
+        }
+        while (this.popupWrapper && this.popupWrapper.firstChild) {
+            this.popupWrapper.removeChild(this.popupWrapper.firstChild);
+        }
+        if (this.inputElement) {
+            var attrArray = ['readonly', 'aria-disabled', 'placeholder', 'aria-labelledby',
+                'aria-expanded', 'autocomplete', 'aria-readonly', 'autocapitalize',
+                'spellcheck', 'aria-autocomplete', 'aria-live', 'aria-label', 'aria-hidden', 'tabindex', 'aria-controls',
+                'aria-describedby', 'size', 'role', 'type', 'class'];
+            for (var i = 0; i < attrArray.length; i++) {
+                this.inputElement.removeAttribute(attrArray[i]);
+            }
+        }
+        if (this.inputElement) {
+            this.inputElement.remove();
+        }
+        this.list = null;
+        this.popupObj = null;
+        this.mainData = null;
+        this.filterParent = null;
+        this.ulElement = null;
         this.componentWrapper = null;
         this.overAllClear = null;
         this.overAllWrapper = null;
@@ -5916,14 +5975,13 @@ var MultiSelect = /** @class */ (function (_super) {
         this.popupWrapper = null;
         this.inputElement = null;
         this.delimiterWrapper = null;
-        this.popupObj = null;
-        this.popupWrapper = null;
         this.liCollections = null;
         this.header = null;
         this.mainList = null;
         this.mainListCollection = null;
         this.footer = null;
         this.selectAllEventEle = null;
+        _super.prototype.destroy.call(this);
     };
     __decorate([
         Complex({ text: null, value: null, iconCss: null, groupBy: null, disabled: null }, FieldSettings)

package/styles/bootstrap-dark-lite.css

@@ -566,6 +566,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap-dark.css

@@ -641,6 +641,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap-lite.css

@@ -566,6 +566,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap.css

@@ -641,6 +641,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap4-lite.css

@@ -596,6 +596,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap4.css

@@ -675,6 +675,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap5-dark-lite.css

@@ -619,6 +619,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap5-dark.css

@@ -708,6 +708,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap5-lite.css

@@ -619,6 +619,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap5.3-lite.css

@@ -623,6 +623,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap5.3.css

@@ -712,6 +712,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/bootstrap5.css

@@ -708,6 +708,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/_layout.scss

@@ -181,6 +181,7 @@
       margin: $ddl-zero-value;
       outline: none;
       width: 100%;
+      overflow: hidden;
     }
 
     input[readonly].e-input,

package/styles/drop-down-list/bootstrap-dark.css

@@ -273,6 +273,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/bootstrap.css

@@ -273,6 +273,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/bootstrap4.css

@@ -303,6 +303,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/bootstrap5-dark.css

@@ -320,6 +320,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/bootstrap5.3.css

@@ -324,6 +324,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/bootstrap5.css

@@ -320,6 +320,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/fabric-dark.css

@@ -249,6 +249,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/fabric.css

@@ -249,6 +249,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/fluent-dark.css

@@ -314,6 +314,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/fluent.css

@@ -314,6 +314,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/fluent2.css

@@ -494,6 +494,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/highcontrast-light.css

@@ -270,6 +270,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/highcontrast.css

@@ -270,6 +270,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/material-dark.css

@@ -312,6 +312,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/material.css

@@ -335,6 +335,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/material3-dark.css

@@ -350,6 +350,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/material3.css

@@ -352,6 +352,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/tailwind-dark.css

@@ -300,6 +300,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/drop-down-list/tailwind.css

@@ -300,6 +300,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],

package/styles/fabric-dark-lite.css

@@ -542,6 +542,7 @@
   margin: 0;
   outline: none;
   width: 100%;
+  overflow: hidden;
 }
 .e-ddl.e-input-group input[readonly].e-input,
 .e-ddl.e-input-group input[readonly],