@syncfusion/ej2-dropdowns 27.1.50 → 27.1.52

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 27.1.50
+*  version : 27.1.52
 *  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.48",
+  "_id": "@syncfusion/ej2-dropdowns@27.1.51",
   "_inBundle": false,
-  "_integrity": "sha512-yXBzRSQUFyq8m1WpqdZO09nFfx7e2oQ+xMIE4ZMaOFUTSKNfhSvhFZyy5ZKbTtG5OF3K8yS+Gwma9XWJqCaE0g==",
+  "_integrity": "sha512-750+JQ5NQhry6CN+uownI1WIljTmyMp3yfLVoU49Xt7OvYAA00LE6SExiAt1ahSP6hZ5FArdNBrtozJfMTzEYw==",
   "_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.48.tgz",
-  "_shasum": "3a2629ba43646e25b3720200f1b1c83f028ba800",
+  "_resolved": "https://nexus.syncfusioninternal.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-27.1.51.tgz",
+  "_shasum": "5921651e7e84bb1de437bfcace522cb1ddc7ac59",
   "_spec": "@syncfusion/ej2-dropdowns@*",
   "_where": "/jenkins/workspace/elease-automation_release_27.1.1/packages/included",
   "author": {
@@ -45,11 +45,11 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~27.1.50",
-    "@syncfusion/ej2-data": "~27.1.50",
+    "@syncfusion/ej2-base": "~27.1.52",
+    "@syncfusion/ej2-data": "~27.1.52",
     "@syncfusion/ej2-inputs": "~27.1.50",
     "@syncfusion/ej2-lists": "~27.1.50",
-    "@syncfusion/ej2-navigations": "~27.1.50",
+    "@syncfusion/ej2-navigations": "~27.1.52",
     "@syncfusion/ej2-notifications": "~27.1.50",
     "@syncfusion/ej2-popups": "~27.1.50"
   },
@@ -76,7 +76,7 @@
   "module": "./index.js",
   "name": "@syncfusion/ej2-dropdowns",
   "typings": "index.d.ts",
-  "version": "27.1.50",
+  "version": "27.1.52",
   "sideEffects": false,
   "homepage": "https://www.syncfusion.com/javascript-ui-controls"
 }

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

@@ -836,6 +836,7 @@ var ComboBox = /** @class */ (function (_super) {
         _super.prototype.render.call(this);
         this.setSearchBox();
         this.renderComplete();
+        this.autoFill = this.autofill;
     };
     /**
      * Return the module name of this component.

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

@@ -1226,7 +1226,7 @@ var DropDownBase = /** @class */ (function (_super) {
                 }
                 dataSource = ListBase.groupDataSource(dataSource, fields.properties, this.sortOrder);
             }
-            else {
+            else if (this.getModuleName() !== 'listbox' || (this.getModuleName() === 'listbox' && !this.preventDefActionFilter)) {
                 dataSource = this.getSortedDataSource(dataSource);
             }
             this.sortedData = dataSource;
@@ -1234,21 +1234,23 @@ var DropDownBase = /** @class */ (function (_super) {
                 new DataManager(dataSource).executeLocal(new Query().take(100))
                 : dataSource;
             ulElement = this.templateListItem((this.getModuleName() === 'autocomplete') ? spliceData : dataSource, fields);
-            var oldUlElement = this.list.querySelector('.e-list-parent');
-            var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
-            if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
-                virtualUlElement.replaceChild(ulElement, oldUlElement);
-                var reOrderList = this.list.querySelectorAll('.e-reorder');
-                if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
-                    this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
+            if (this.isVirtualizationEnabled) {
+                var oldUlElement = this.list.querySelector('.e-list-parent');
+                var virtualUlElement = this.list.querySelector('.e-virtual-ddl-content');
+                if ((listData.length >= this.virtualizedItemsCount && oldUlElement && virtualUlElement) || (oldUlElement && virtualUlElement && this.isAllowFiltering) || (oldUlElement && virtualUlElement && this.getModuleName() === 'autocomplete')) {
+                    virtualUlElement.replaceChild(ulElement, oldUlElement);
+                    var reOrderList = this.list.querySelectorAll('.e-reorder');
+                    if (this.list.querySelector('.e-virtual-ddl-content') && reOrderList && reOrderList.length > 0 && !isCheckBoxUpdate) {
+                        this.list.querySelector('.e-virtual-ddl-content').removeChild(reOrderList[0]);
+                    }
+                    this.updateListElements(listData);
+                }
+                else if (!virtualUlElement) {
+                    this.list.innerHTML = '';
+                    this.createVirtualContent();
+                    this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
+                    this.updateListElements(listData);
                 }
-                this.updateListElements(listData);
-            }
-            else if ((!virtualUlElement)) {
-                this.list.innerHTML = '';
-                this.createVirtualContent();
-                this.list.querySelector('.e-virtual-ddl-content').appendChild(ulElement);
-                this.updateListElements(listData);
             }
         }
         else {

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

@@ -109,6 +109,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
     private isTouched;
     protected isFocused: boolean;
     private clearButton;
+    protected autoFill: boolean;
     /**
      * Sets CSS classes to the root element of the component that allows customization of appearance.
      *
@@ -519,7 +520,7 @@ export declare class DropDownList extends DropDownBase implements IInput {
     }[] | DataManager | string[] | number[] | boolean[], query?: Query, fields?: FieldSettingsModel): void;
     private filteringAction;
     protected setSearchBox(popupElement: HTMLElement): InputObject;
-    protected onInput(e: KeyboardEventArgs): void;
+    protected onInput(e: any): void;
     protected pasteHandler(e: KeyboardEventArgs): void;
     protected onActionFailure(e: Object): void;
     protected getTakeValue(): number;

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

@@ -89,6 +89,7 @@ var DropDownList = /** @class */ (function (_super) {
         _this.preventChange = false;
         _this.isTouched = false;
         _this.isFocused = false;
+        _this.autoFill = false;
         return _this;
     }
     /**
@@ -361,12 +362,20 @@ var DropDownList = /** @class */ (function (_super) {
             removeClass([this.inputWrapper.container], dropDownListClasses.disable);
             this.inputElement.setAttribute('aria-disabled', 'false');
             this.targetElement().setAttribute('tabindex', this.tabIndex);
+            if (this.inputWrapper && this.inputWrapper.container) {
+                this.inputWrapper.container.setAttribute('aria-disabled', 'false');
+                this.inputWrapper.container.removeAttribute('disabled');
+            }
         }
         else {
             this.hidePopup();
             addClass([this.inputWrapper.container], dropDownListClasses.disable);
             this.inputElement.setAttribute('aria-disabled', 'true');
             this.targetElement().tabIndex = -1;
+            if (this.inputWrapper && this.inputWrapper.container) {
+                this.inputWrapper.container.setAttribute('aria-disabled', 'true');
+                this.inputWrapper.container.setAttribute('disabled', '');
+            }
         }
     };
     /**
@@ -2127,6 +2136,9 @@ var DropDownList = /** @class */ (function (_super) {
         }
     };
     DropDownList.prototype.onInput = function (e) {
+        if (!isNullOrUndefined(e) && !isNullOrUndefined(e.data) && e.data.length > 1 && this.autoFill && (this.getModuleName() === 'combobox' || this.getModuleName() === 'autocomplete')) {
+            this.inputElement.value = e.data;
+        }
         this.isValidKey = true;
         if (this.getModuleName() === 'combobox') {
             this.updateIconState();

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

@@ -1710,8 +1710,8 @@ var DropDownTree = /** @class */ (function (_super) {
                     }
                     else {
                         var oldFocussedNode = _this.treeObj.element.querySelector('.e-node-focus');
-                        focusedElement = _this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable):not(.e-prevent)') ||
-                            _this.treeObj.element.querySelector('li:not(.e-disable):not(.e-prevent)');
+                        focusedElement = _this.treeObj.element.querySelector('li[tabindex="0"]:not(.e-disable)') ||
+                            _this.treeObj.element.querySelector('li:not(.e-disable)');
                         if (oldFocussedNode && oldFocussedNode !== focusedElement) {
                             oldFocussedNode.setAttribute('tabindex', '-1');
                             removeClass([oldFocussedNode], 'e-node-focus');

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

@@ -806,6 +806,17 @@ var ListBox = /** @class */ (function (_super) {
                 li.setAttribute('aria-disabled', 'true');
             }
         });
+        if (this.allowFiltering && this.filterInput.value !== '' && this.toolbarSettings.items.length > 0) {
+            var canDisable_1 = false;
+            this.liCollections.forEach(function (li) { if (!li.classList.contains('e-disabled')) {
+                canDisable_1 = true;
+            } });
+            if (!canDisable_1) {
+                var wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
+                var btn = wrap.querySelector('[data-value="moveAllTo"]');
+                btn.disabled = true;
+            }
+        }
     };
     /**
      * Based on the state parameter, specified list item will be selected/deselected.
@@ -1669,6 +1680,12 @@ var ListBox = /** @class */ (function (_super) {
         if (fListBox.value.length === 1 && fListBox.getSelectedItems().length) {
             fListBox.value[0] = fListBox.getFormattedValue(fListBox.getSelectedItems()[0].getAttribute('data-value'));
         }
+        if (fListBox.liCollections.length === fListBox.ulElement.querySelectorAll('.e-disabled').length) {
+            var wrap = this.list.parentElement.getElementsByClassName('e-listbox-tool')[0];
+            var toolbarAction = this.toolbarAction === 'moveFrom' ? 'moveAllFrom' : 'moveAllTo';
+            var btn = wrap.querySelector('[data-value="' + toolbarAction + '"]');
+            btn.disabled = true;
+        }
     };
     ListBox.prototype.selectNextList = function (elems, dataLiIdx, dataIdx, inst) {
         var childCnt = inst.ulElement.querySelectorAll('.e-list-item').length;
@@ -1792,7 +1809,7 @@ var ListBox = /** @class */ (function (_super) {
             if (tempLiColl.length > 0) {
                 for (var i = 0; i < tempLiColl.length; i++) {
                     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                    disabledData_1.push(this.getDataByValue(tempLiColl[i].getAttribute('data-value')));
+                    disabledData_1.push(fListBox.getDataByValue(tempLiColl[i].getAttribute('data-value')));
                 }
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 fListBox.listData = fListBox.listData.filter(function (obj1) {
@@ -1816,9 +1833,7 @@ var ListBox = /** @class */ (function (_super) {
         }
         if (isRefresh) {
             var sourceElem = tListBox.renderItems(listData, tListBox.fields);
-            if (!this.itemTemplate) {
-                tListBox.updateListItems(sourceElem, tListBox.ulElement);
-            }
+            tListBox.updateListItems(sourceElem, tListBox.ulElement);
         }
         else {
             tListBox.sortedData = listData;
@@ -2270,6 +2285,9 @@ var ListBox = /** @class */ (function (_super) {
             }
         }
         else {
+            if (inst.ulElement.querySelectorAll('.e-disabled').length > 0) {
+                return inst.liCollections.length === inst.ulElement.querySelectorAll('.e-disabled').length;
+            }
             return inst.ulElement.querySelectorAll('.' + cssClass.li).length === 0;
         }
     };

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

@@ -2397,9 +2397,6 @@ var MultiSelect = /** @class */ (function (_super) {
                         _this.fields.value : ''), value) : value;
                     _this.virtualSelectAll = false;
                     var removeVal = _this.value.slice(0);
-                    if (_this.enableVirtualization && isClearAll) {
-                        removeVal = [];
-                    }
                     removeVal.splice(index, 1);
                     if (_this.enableVirtualization && _this.mode === 'CheckBox') {
                         _this.selectedListData.splice(index, 1);
@@ -4676,7 +4673,7 @@ var MultiSelect = /** @class */ (function (_super) {
                 this.isSelectAll = this.isSelectAll ? !this.isSelectAll : this.isSelectAll;
             }
             this.updateHiddenElement();
-            this.value = [];
+            this.setProperties({ value: [] }, true);
             this.virtualSelectAll = false;
             if (!isNullOrUndefined(this.viewPortInfo.startIndex) && !isNullOrUndefined(this.viewPortInfo.endIndex)) {
                 this.notify('setCurrentViewDataAsync', {

package/styles/bootstrap-dark-lite.css

@@ -1197,6 +1197,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap-dark.css

@@ -1446,6 +1446,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap-lite.css

@@ -1191,6 +1191,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap.css

@@ -1440,6 +1440,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap4-lite.css

@@ -1275,6 +1275,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap4.css

@@ -1557,6 +1557,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap5-dark-lite.css

@@ -1261,6 +1261,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap5-dark.css

@@ -1570,6 +1570,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap5-lite.css

@@ -1261,6 +1261,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap5.3-lite.css

@@ -1254,6 +1254,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap5.3.css

@@ -1505,6 +1505,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/bootstrap5.css

@@ -1570,6 +1570,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fabric-dark-lite.css

@@ -1171,6 +1171,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fabric-dark.css

@@ -1419,6 +1419,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fabric-lite.css

@@ -1167,6 +1167,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fabric.css

@@ -1415,6 +1415,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fluent-dark-lite.css

@@ -1265,6 +1265,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fluent-dark.css

@@ -1575,6 +1575,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fluent-lite.css

@@ -1265,6 +1265,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fluent.css

@@ -1575,6 +1575,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fluent2-lite.css

@@ -1471,6 +1471,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/fluent2.css

@@ -1732,6 +1732,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/highcontrast-light-lite.css

@@ -1273,6 +1273,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/highcontrast-light.css

@@ -1510,6 +1510,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/highcontrast-lite.css

@@ -1290,6 +1290,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/highcontrast.css

@@ -1527,6 +1527,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/material-dark-lite.css

@@ -1614,6 +1614,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/material-dark.css

@@ -2020,6 +2020,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/material-lite.css

@@ -1641,6 +1641,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/material.css

@@ -2068,6 +2068,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/material3-dark-lite.css

@@ -1513,6 +1513,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;

package/styles/material3-dark.css

@@ -1746,6 +1746,10 @@ ejs-dropdownlist {
   display: block;
 }
 
+.e-multiselect.e-input-group.e-control-wrapper:not(.e-control-container) .e-multi-select-wrapper.e-down-icon .e-chips-collection {
+  margin-right: 30px;
+}
+
 .e-multi-select-wrapper .e-multi-hidden {
   border: 0;
   height: 0;