@syncfusion/ej2-dropdowns 28.1.37 → 28.1.39

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 28.1.37
+*  version : 28.1.39
 *  Copyright Syncfusion Inc. 2001 - 2024. 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@28.1.35",
+  "_id": "@syncfusion/ej2-dropdowns@28.1.38",
   "_inBundle": false,
-  "_integrity": "sha512-bL308Ch9zV+ucVhTJM3P6epXzfnZBPsS/SD+1yysjb3XTMqnd04itZ2ujOdGMkjokSld5qT1K1KKk72JTysDsQ==",
+  "_integrity": "sha512-FGCpdclni6qQ3LeUi4ZYQp/ziJ/TarJpuufjvLID6+Emm8qvjpqsXHRpBBx7ySxGBqSv9EvFvwwX3tlEU7Q9uw==",
   "_location": "/@syncfusion/ej2-dropdowns",
   "_phantomChildren": {},
   "_requested": {
@@ -18,22 +18,26 @@
   },
   "_requiredBy": [
     "/",
+    "/@syncfusion/ej2",
     "/@syncfusion/ej2-angular-dropdowns",
     "/@syncfusion/ej2-documenteditor",
     "/@syncfusion/ej2-gantt",
     "/@syncfusion/ej2-grids",
+    "/@syncfusion/ej2-image-editor",
     "/@syncfusion/ej2-inplace-editor",
     "/@syncfusion/ej2-kanban",
     "/@syncfusion/ej2-pdfviewer",
     "/@syncfusion/ej2-pivotview",
+    "/@syncfusion/ej2-querybuilder",
     "/@syncfusion/ej2-react-dropdowns",
+    "/@syncfusion/ej2-ribbon",
     "/@syncfusion/ej2-richtexteditor",
     "/@syncfusion/ej2-schedule",
     "/@syncfusion/ej2-spreadsheet",
     "/@syncfusion/ej2-vue-dropdowns"
   ],
-  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-28.1.35.tgz",
-  "_shasum": "f81e5c32210ced7ff8fc68210e8fce81054ec4c4",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-28.1.38.tgz",
+  "_shasum": "5d383cb4f7b3f08fbaff11b8bb86a5c3320adbab",
   "_spec": "@syncfusion/ej2-dropdowns@*",
   "_where": "/jenkins/workspace/elease-automation_release_28.1.1/packages/included",
   "author": {
@@ -45,9 +49,9 @@
     "@syncfusion/ej2-data": "~28.1.33",
     "@syncfusion/ej2-inputs": "~28.1.37",
     "@syncfusion/ej2-lists": "~28.1.37",
-    "@syncfusion/ej2-navigations": "~28.1.37",
+    "@syncfusion/ej2-navigations": "~28.1.39",
     "@syncfusion/ej2-notifications": "~28.1.33",
-    "@syncfusion/ej2-popups": "~28.1.33"
+    "@syncfusion/ej2-popups": "~28.1.39"
   },
   "deprecated": false,
   "description": "Essential JS 2 DropDown Components",
@@ -72,7 +76,7 @@
   "module": "./index.js",
   "name": "@syncfusion/ej2-dropdowns",
   "typings": "index.d.ts",
-  "version": "28.1.37",
+  "version": "28.1.39",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

package/src/combo-box/combo-box.js

@@ -662,7 +662,7 @@ var ComboBox = /** @class */ (function (_super) {
                 this.onChangeEvent(e);
             }
         }
-        if (e.action === 'enter' && this.inputElement.value.trim() === '') {
+        if (e.action === 'enter' && this.inputElement.value === '') {
             this.clearAll(e);
         }
         else if (this.isTyped && !this.isSelected && isNullOrUndefined(li)) {
@@ -708,7 +708,7 @@ var ComboBox = /** @class */ (function (_super) {
                 this.onChangeEvent(null);
             }
         }
-        else if (this.inputElement.value.trim() !== '') {
+        else if (this.inputElement.value !== '') {
             var previousValue_1 = this.value;
             if (isNullOrUndefined(value)) {
                 var value_1 = this.inputElement.value === '' ? null : this.inputElement.value;

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

@@ -1025,7 +1025,17 @@ var DropDownBase = /** @class */ (function (_super) {
             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]);
+                    if (!isNullOrUndefined(this.fields.groupBy)) {
+                        var item = this.listData[index];
+                        var value = getValue((this.fields.value ? this.fields.value : 'value'), item);
+                        var li = listElement.querySelector('li[data-value="' + value + '"]');
+                        if (!isNullOrUndefined(li)) {
+                            this.disableListItem(li);
+                        }
+                    }
+                    else {
+                        this.disableListItem(liCollections[index]);
+                    }
                 }
             }
         }
@@ -1166,8 +1176,10 @@ var DropDownBase = /** @class */ (function (_super) {
     DropDownBase.prototype.scrollStop = function (e, isDownkey) {
         var target = !isNullOrUndefined(e) ? e.target : this.list;
         var computedHeight = getComputedStyle(this.getValidLi(), null).getPropertyValue('height');
+        var computedMarginValue = getComputedStyle(this.getValidLi(), null).getPropertyValue('margin-bottom');
+        var marginValue = parseInt(computedMarginValue, 10);
         var liHeight = this.getModuleName() === 'multiselect' ? parseFloat(computedHeight) : parseInt(computedHeight, 10);
-        var topIndex = Math.round(target.scrollTop / liHeight);
+        var topIndex = Math.round(target.scrollTop / (liHeight + marginValue));
         var liCollections = this.list.querySelectorAll('li' + ':not(.e-hide-listitem)');
         var virtualListCount = this.list.querySelectorAll('.e-virtual-list').length;
         var count = 0;

package/src/drop-down-list/drop-down-list.d.ts

@@ -121,6 +121,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
     private isUpdateHeaderHeight;
     private isUpdateFooterHeight;
     private filterArgs;
+    private isReactTemplateUpdate;
     /**
      * Sets CSS classes to the root element of the component that allows customization of appearance.
      *

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

@@ -93,6 +93,7 @@ var DropDownList = /** @class */ (function (_super) {
         _this.autoFill = false;
         _this.isUpdateHeaderHeight = false;
         _this.isUpdateFooterHeight = false;
+        _this.isReactTemplateUpdate = false;
         return _this;
     }
     /**
@@ -1463,6 +1464,7 @@ var DropDownList = /** @class */ (function (_super) {
                 setTimeout(function () {
                     proxy_1.cloneElements();
                     proxy_1.isSecondClick = true;
+                    proxy_1.isSecondClick = proxy_1.isReact && proxy_1.isFiltering() && proxy_1.dataSource instanceof DataManager && !proxy_1.list.querySelector('ul') ? false : true;
                 }, duration);
             }
         }
@@ -2302,6 +2304,7 @@ var DropDownList = /** @class */ (function (_super) {
         if (this.getInitialData) {
             this.updateActionCompleteDataValues(ulElement, list);
             this.getInitialData = false;
+            this.isReactTemplateUpdate = true;
             this.searchLists(this.filterArgs);
             return;
         }
@@ -2737,6 +2740,9 @@ var DropDownList = /** @class */ (function (_super) {
                             addClass([_this.inputWrapper.container], [dropDownListClasses.iconAnimation]);
                         }
                         _this.renderReactTemplates();
+                        if (_this.isReact && _this.isFiltering() && _this.dataSource instanceof DataManager && _this.list.querySelector('ul') && !_this.isSecondClick) {
+                            _this.executeCloneElements();
+                        }
                         if (!isNullOrUndefined(_this.popupObj)) {
                             _this.popupObj.show(new Animation(eventArgs.animation), (_this.zIndex === 1000) ? _this.element : null);
                         }
@@ -2763,7 +2769,7 @@ var DropDownList = /** @class */ (function (_super) {
                         _this.destroyPopup();
                     }
                 });
-                if (_this.allowResize) {
+                if (_this.allowResize && (_this.getModuleName() !== 'dropdownlist' || !(Browser.isDevice && _this.isDeviceFullScreen && _this.allowFiltering))) {
                     var resizePaddingBottom = 16;
                     // Create the resizer div
                     _this.resizer = _this.createElement('div', {
@@ -2834,6 +2840,10 @@ var DropDownList = /** @class */ (function (_super) {
                 _this.destroyPopup();
                 if (_this.isFiltering() && _this.actionCompleteData.list && _this.actionCompleteData.list.length > 0) {
                     _this.isActive = true;
+                    if (_this.isReactTemplateUpdate && _this.isReact && _this.itemTemplate && !_this.enableVirtualization) {
+                        _this.actionCompleteData.ulElement = _this.renderItems(_this.actionCompleteData.list, _this.fields);
+                        _this.isReactTemplateUpdate = false;
+                    }
                     if (_this.enableVirtualization) {
                         _this.onActionComplete(_this.ulElement, _this.listData, null, true);
                     }
@@ -4146,7 +4156,7 @@ var DropDownList = /** @class */ (function (_super) {
         if (isSelectVal && this.enableVirtualization && this.selectedLI.classList) {
             isSelectVal = this.selectedLI.classList.contains('e-active');
         }
-        if (this.inputElement && this.inputElement.value.trim() === '' && !this.isInteracted && (this.isSelectCustom ||
+        if (this.inputElement && this.inputElement.value === '' && !this.isInteracted && (this.isSelectCustom ||
             isSelectVal && this.inputElement.value !== dataItem.text)) {
             this.isSelectCustom = false;
             this.clearAll(e);

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

@@ -499,6 +499,9 @@ var DropDownTree = /** @class */ (function (_super) {
                 }
                 _this.treeObj.fields = _this.getTreeFields(fields);
                 _this.treeObj.dataBind();
+                if (_this.popupObj) {
+                    _this.popupObj.refreshPosition();
+                }
                 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) {

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

@@ -2040,7 +2040,7 @@ var ListBox = /** @class */ (function (_super) {
     };
     ListBox.prototype.KeyUp = function (e) {
         var _this = this;
-        if (this.allowFiltering && e.ctrlKey && e.keyCode === 65) {
+        if (this.allowFiltering && ((e.ctrlKey && e.keyCode === 65) || (e.keyCode === 8 && !this.filterInput.value))) {
             e.preventDefault();
             return;
         }

package/src/mention/mention.js

@@ -128,7 +128,9 @@ var Mention = /** @class */ (function (_super) {
                 ? document.querySelector(this.target)
                 : this.target) : this.element;
         if (this.isContentEditable(this.inputElement)) {
-            this.inputElement.setAttribute('contenteditable', 'true');
+            if (!this.inputElement.hasAttribute('contenteditable')) {
+                this.inputElement.setAttribute('contenteditable', 'true');
+            }
             addClass([this.inputElement], ['e-mention']);
             if (isNullOrUndefined(this.target)) {
                 addClass([this.inputElement], ['e-editable-element']);

package/src/multi-select/multi-select.d.ts

@@ -70,6 +70,8 @@ export declare class MultiSelect extends DropDownBase implements IInput {
     private isClearAllAction;
     private isUpdateHeaderHeight;
     private isUpdateFooterHeight;
+    private isBlurDispatching;
+    private isFilterPrevented;
     /**
      * The `fields` property maps the columns of the data table and binds the data to the component.
      * * text - Maps the text column from data table for each list item.

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

@@ -103,6 +103,8 @@ var MultiSelect = /** @class */ (function (_super) {
         _this.storedSelectAllHeight = 0;
         _this.isUpdateHeaderHeight = false;
         _this.isUpdateFooterHeight = false;
+        _this.isBlurDispatching = false;
+        _this.isFilterPrevented = false;
         _this.isValidKey = false;
         _this.selectAllEventData = [];
         _this.selectAllEventEle = [];
@@ -561,10 +563,24 @@ var MultiSelect = /** @class */ (function (_super) {
     };
     /* eslint-disable @typescript-eslint/no-unused-vars */
     MultiSelect.prototype.onActionComplete = function (ulElement, list, e, isUpdated) {
+        var _this = this;
         if (this.dataSource instanceof DataManager && !isNullOrUndefined(e) && !this.virtualGroupDataSource) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             this.totalItemCount = e.count;
         }
+        if (this.value && list && list.length > 0 && this.allowFiltering && this.mode !== 'CheckBox' && !this.enableVirtualization && !this.isFilterPrevented && !this.allowCustomValue) {
+            var allItemsInValue = list.every(function (item) {
+                var itemValue = getValue((_this.fields.value) ? _this.fields.value : '', item);
+                return _this.value.some(function (val) {
+                    var value = _this.allowObjectBinding ? getValue((_this.fields.value) ? _this.fields.value : '', val) : val;
+                    return itemValue === value;
+                });
+            });
+            if (allItemsInValue) {
+                ulElement.innerHTML = '';
+                list = [];
+            }
+        }
         /* eslint-enable @typescript-eslint/no-unused-vars */
         _super.prototype.onActionComplete.call(this, ulElement, list, e);
         this.skeletonCount = this.totalItemCount !== 0 && this.totalItemCount < (this.itemCount * 2) &&
@@ -1216,6 +1232,10 @@ var MultiSelect = /** @class */ (function (_super) {
     };
     MultiSelect.prototype.onBlurHandler = function (eve, isDocClickFromCheck) {
         var target;
+        if (this.isBlurDispatching && this.isAngular) {
+            this.isBlurDispatching = false;
+            return;
+        }
         if (!isNullOrUndefined(eve)) {
             target = eve.relatedTarget;
         }
@@ -1298,6 +1318,10 @@ var MultiSelect = /** @class */ (function (_super) {
             this.overAllWrapper.getElementsByClassName('e-float-text-content')[0] && this.floatLabelType !== 'Never')) {
             this.overAllWrapper.getElementsByClassName('e-float-text-content')[0].classList.add('e-icon');
         }
+        this.isBlurDispatching = true;
+        if (this.isAngular) {
+            this.dispatchEvent(this.inputElement, 'blur');
+        }
     };
     MultiSelect.prototype.calculateWidth = function () {
         var elementWidth;
@@ -2949,6 +2973,10 @@ var MultiSelect = /** @class */ (function (_super) {
         if (!this.list) {
             _super.prototype.render.call(this);
         }
+        if (this.popupObj && document.body.contains(this.popupObj.element) && this.allowFiltering) {
+            this.refreshPopup();
+            return;
+        }
         if (!this.popupObj) {
             if (!isNullOrUndefined(this.popupWrapper)) {
                 document.body.appendChild(this.popupWrapper);
@@ -3442,6 +3470,7 @@ var MultiSelect = /** @class */ (function (_super) {
                     cancel: false
                 };
                 this.trigger('filtering', eventArgs_1, function (eventArgs) {
+                    _this.isFilterPrevented = eventArgs.cancel;
                     if (!eventArgs.cancel) {
                         if (!_this.isFiltered && !eventArgs.preventDefaultAction) {
                             _this.filterAction = true;

package/styles/bds-lite.css

@@ -657,6 +657,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: var(--color-sf-bg-primary-alt);
 }

package/styles/bds.css

@@ -792,6 +792,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: var(--color-sf-bg-primary-alt);
 }

package/styles/bootstrap-dark-lite.css

@@ -446,6 +446,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #6e6e6e;
 }

package/styles/bootstrap-dark.css

@@ -521,6 +521,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #6e6e6e;
 }

package/styles/bootstrap-lite.css

@@ -446,6 +446,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

package/styles/bootstrap.css

@@ -521,6 +521,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

package/styles/bootstrap4-lite.css

@@ -480,6 +480,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

package/styles/bootstrap4.css

@@ -559,6 +559,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

package/styles/bootstrap5-dark-lite.css

@@ -503,6 +503,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #212529;
 }

package/styles/bootstrap5-dark.css

@@ -592,6 +592,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #212529;
 }

package/styles/bootstrap5-lite.css

@@ -503,6 +503,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

package/styles/bootstrap5.3-lite.css

@@ -507,6 +507,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: var(--color-sf-content-bg-color);
 }

package/styles/bootstrap5.3.css

@@ -596,6 +596,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: var(--color-sf-content-bg-color);
 }

package/styles/bootstrap5.css

@@ -592,6 +592,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

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

@@ -35,6 +35,14 @@
     content: '';
   }
 
+  .e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+    position: relative;
+  }
+
+  .e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+    content: '';
+  }
+
   .e-ddl-device-filter .e-filter-parent {
     background-color: $ddl-filter-background-color;
   }

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

@@ -330,6 +330,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: var(--color-sf-bg-primary-alt);
 }

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

@@ -149,6 +149,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #6e6e6e;
 }

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

@@ -149,6 +149,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

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

@@ -183,6 +183,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }

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

@@ -200,6 +200,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #212529;
 }

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

@@ -204,6 +204,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: var(--color-sf-content-bg-color);
 }

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

@@ -200,6 +200,14 @@
   content: "";
 }
 
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon {
+  position: relative;
+}
+
+.e-ddl.e-control-wrapper.e-input-group .e-ddl-icon.e-ddl-disable-icon::before {
+  content: "";
+}
+
 .e-ddl-device-filter .e-filter-parent {
   background-color: #fff;
 }