@syncfusion/ej2-dropdowns 20.2.36 → 20.2.40

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 20.2.36
+*  version : 20.2.40
 *  Copyright Syncfusion Inc. 2001 - 2020. 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@18.37.4",
+  "_id": "@syncfusion/ej2-dropdowns@20.2.39",
   "_inBundle": false,
-  "_integrity": "sha512-ImC+pSQKT4ls3VGNz3udyVhLktKTuqZQdW+JlmLRRe1ZAcliTdUj7zjKmntcFRzZpvQv76KKXIKoBBAp6rR+TQ==",
+  "_integrity": "sha512-PoCt2o2HN19B0msREq8czIzWbMVqo8swH4cqk4Vc54NQcYMuiIzYum8cZwzY20GOQvx8oR6ObeGXcp/rmAObuA==",
   "_location": "/@syncfusion/ej2-dropdowns",
   "_phantomChildren": {},
   "_requested": {
@@ -33,8 +33,8 @@
     "/@syncfusion/ej2-spreadsheet",
     "/@syncfusion/ej2-vue-dropdowns"
   ],
-  "_resolved": "http://nexus.syncfusion.com/repository/ej2-release/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-18.37.4.tgz",
-  "_shasum": "43499295a10a192983bc1112c07ca99d72d88651",
+  "_resolved": "http://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-dropdowns/-/ej2-dropdowns-20.2.39.tgz",
+  "_shasum": "6cde197c74db9e63e4af98dbd2ca48359b3ada05",
   "_spec": "@syncfusion/ej2-dropdowns@*",
   "_where": "/jenkins/workspace/automation_release_19.1.0.1-ZPMUBNQ6AUYH6YGEFBPVYMEQLRRW2SLD4XCZ6GATNZJFYJ3RIAOA/packages/included",
   "author": {
@@ -42,12 +42,12 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~20.2.36",
-    "@syncfusion/ej2-data": "~20.2.36",
-    "@syncfusion/ej2-inputs": "~20.2.36",
-    "@syncfusion/ej2-lists": "~20.2.36",
-    "@syncfusion/ej2-navigations": "~20.2.36",
-    "@syncfusion/ej2-popups": "~20.2.36"
+    "@syncfusion/ej2-base": "~20.2.39",
+    "@syncfusion/ej2-data": "~20.2.38",
+    "@syncfusion/ej2-inputs": "~20.2.38",
+    "@syncfusion/ej2-lists": "~20.2.39",
+    "@syncfusion/ej2-navigations": "~20.2.39",
+    "@syncfusion/ej2-popups": "~20.2.40"
   },
   "deprecated": false,
   "description": "Essential JS 2 DropDown Components",
@@ -72,6 +72,6 @@
   "module": "./index.js",
   "name": "@syncfusion/ej2-dropdowns",
   "typings": "index.d.ts",
-  "version": "20.2.36",
+  "version": "20.2.40",
   "sideEffects": false
 }

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

@@ -1498,7 +1498,6 @@ var DropDownList = /** @class */ (function (_super) {
                 this.initial = true;
                 this.activeIndex = this.index;
                 this.initRemoteRender = false;
-                this.initial = false;
                 if (this.value && this.dataSource instanceof DataManager) {
                     var checkField_1 = isNullOrUndefined(this.fields.value) ? this.fields.text : this.fields.value;
                     var checkVal = list.some(function (x) { return x[checkField_1] === _this.value; });
@@ -1521,6 +1520,28 @@ var DropDownList = /** @class */ (function (_super) {
                 else {
                     this.updateValues();
                 }
+                this.initial = false;
+            }
+            else if (this.getModuleName() === 'autocomplete' && this.value && this.typedString === '' && !(this.dataSource instanceof DataManager)) {
+                var checkFields_1 = this.typeOfData(this.dataSource).typeof === 'string' ? '' : this.fields.value;
+                var checkValue = list.some(function (x) { return x[checkFields_1] === _this.value; });
+                var query = new Query();
+                if (!checkValue) {
+                    new DataManager(this.dataSource).executeQuery(query.where(new Predicate(checkFields_1, 'equal', this.value)))
+                        .then(function (e) {
+                        if (e.result.length > 0) {
+                            _this.value = checkFields_1 !== '' ? e.result[0][_this.fields.value].toString() : e.result[0].toString();
+                            _this.addItem(e.result, list.length);
+                            _this.updateValues();
+                        }
+                        else {
+                            _this.updateValues();
+                        }
+                    });
+                }
+                else {
+                    this.updateValues();
+                }
             }
             if (this.getModuleName() !== 'autocomplete' && this.isFiltering() && !this.isTyped) {
                 if (!this.actionCompleteData.isUpdated || ((!this.isCustomFilter

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

@@ -1803,7 +1803,8 @@ var DropDownTree = /** @class */ (function (_super) {
             }
             return 2;
         }
-        this.fields.dataSource = isNOU(this.fields.dataSource) ? [] : this.fields.dataSource;
+        if (isNOU(this.fields.dataSource))
+            this.fields.dataSource = [];
         for (var i = 0, len = this.fields.dataSource.length; i < len; i++) {
             if ((typeof field.child === 'string') && !isNOU(getValue(field.child, this.fields.dataSource[i]))) {
                 return 2;

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

@@ -1545,7 +1545,19 @@ var ListBox = /** @class */ (function (_super) {
             .filter(function (data) { return data.isHeader !== true; });
         tListBox.listData = listData;
         tListBox.jsonData = jsonData;
-        fListBox.listData = fListBox.sortedData = fListBox.jsonData = [];
+        if (this.listData.length == this.jsonData.length) {
+            fListBox.listData = fListBox.sortedData = fListBox.jsonData = [];
+        }
+        else if (this.allowFiltering) {
+            for (var i = 0; i < fListBox.listData.length; i++) {
+                for (var j = 0; j < fListBox.jsonData.length; j++) {
+                    if (fListBox.listData[i] === fListBox.jsonData[j]) {
+                        fListBox.jsonData.splice(j, 1);
+                    }
+                }
+            }
+            fListBox.listData = fListBox.sortedData = [];
+        }
         if (isRefresh) {
             var sourceElem = tListBox.renderItems(listData, tListBox.fields);
             tListBox.updateListItems(sourceElem, tListBox.ulElement);

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

@@ -1628,7 +1628,7 @@ var MultiSelect = /** @class */ (function (_super) {
                         });
                         _this.invokeCheckboxSelection(element_1, eve, isClearAll);
                     }
-                    if (_this.hideSelectedItem && _this.fields.groupBy) {
+                    if (_this.hideSelectedItem && _this.fields.groupBy && element_1) {
                         _this.hideGroupItem(value);
                     }
                     if (_this.hideSelectedItem && _this.fixedHeaderElement && _this.fields.groupBy && _this.mode !== 'CheckBox' &&
@@ -2472,7 +2472,7 @@ var MultiSelect = /** @class */ (function (_super) {
         }
     };
     MultiSelect.prototype.updateDataList = function () {
-        if (this.mainList && this.ulElement) {
+        if (this.mainList && this.ulElement && !(this.isFiltered || this.filterAction || this.targetElement().trim())) {
             var isDynamicGroupItemUpdate = this.mainList.childElementCount < this.ulElement.childElementCount;
             var isReactTemplateUpdate = ((this.ulElement.childElementCount > 0 && this.ulElement.children[0].childElementCount > 0) && (this.mainList.children[0].childElementCount < this.ulElement.children[0].childElementCount));
             var isAngularTemplateUpdate = this.itemTemplate && this.ulElement.childElementCount > 0 && !(this.ulElement.childElementCount < this.mainList.childElementCount) && (this.ulElement.children[0].childElementCount > 0 || (this.fields.groupBy && this.ulElement.children[1] && this.ulElement.children[1].childElementCount > 0));
@@ -3679,7 +3679,7 @@ var MultiSelect = /** @class */ (function (_super) {
                 var mainLiLength = _this.ulElement.querySelectorAll('li.' + 'e-list-item').length;
                 var liLength = _this.ulElement.querySelectorAll('li.'
                     + dropDownBaseClasses.li + '.' + HIDE_LIST).length;
-                if (mainLiLength > 0 && (mainLiLength === liLength) && (liLength === _this.mainData.length)) {
+                if (mainLiLength > 0 && (mainLiLength === liLength) && (liLength === _this.mainData.length) && !(_this.targetElement() !== '' && _this.allowCustomValue)) {
                     _this.beforePopupOpen = false;
                     return;
                 }

package/styles/bootstrap-dark.css

@@ -2737,6 +2737,16 @@ ejs-listbox {
   top: 30%;
 }
 
+.e-listboxtool-container .e-left {
+  -ms-flex-direction: row-reverse;
+      flex-direction: row-reverse;
+}
+
+.e-listboxtool-wrapper .e-left {
+  -ms-flex-direction: column-reverse;
+      flex-direction: column-reverse;
+}
+
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
   margin-right: 15px;
@@ -2839,16 +2849,30 @@ ejs-listbox {
 .e-listbox-container.e-bigger .e-list-header .e-text {
   font-size: 15px;
 }
-.e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small .e-listbox-container.e-filter-list .e-list-parent {
+.e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 52px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 52px) !important;
+}
+
+.e-small .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 46px);
 }
 
-.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 46px) !important;
+}
+
+.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 58px);
 }
 
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 58px) !important;
+}
+
 .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 106px);
@@ -2859,11 +2883,14 @@ ejs-listbox {
   height: calc(100% - 48px);
 }
 
-.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 54px);
 }
 
+.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 54px) !important;
+}
+
 .e-listbox-wrapper,
 .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
 .e-listboxtool-container.e-listbox-container .e-ul {
@@ -2883,11 +2910,6 @@ ejs-listbox {
   font-size: 14px;
 }
 
-.e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 52px);
-}
-
 .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 92px);

package/styles/bootstrap.css

@@ -2736,6 +2736,16 @@ ejs-listbox {
   top: 30%;
 }
 
+.e-listboxtool-container .e-left {
+  -ms-flex-direction: row-reverse;
+      flex-direction: row-reverse;
+}
+
+.e-listboxtool-wrapper .e-left {
+  -ms-flex-direction: column-reverse;
+      flex-direction: column-reverse;
+}
+
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
   margin-right: 15px;
@@ -2838,16 +2848,30 @@ ejs-listbox {
 .e-listbox-container.e-bigger .e-list-header .e-text {
   font-size: 15px;
 }
-.e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small .e-listbox-container.e-filter-list .e-list-parent {
+.e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 52px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 52px) !important;
+}
+
+.e-small .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 46px);
 }
 
-.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 46px) !important;
+}
+
+.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 58px);
 }
 
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 58px) !important;
+}
+
 .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 106px);
@@ -2858,11 +2882,14 @@ ejs-listbox {
   height: calc(100% - 48px);
 }
 
-.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 54px);
 }
 
+.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 54px) !important;
+}
+
 .e-listbox-wrapper,
 .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
 .e-listboxtool-container.e-listbox-container .e-ul {
@@ -2882,11 +2909,6 @@ ejs-listbox {
   font-size: 14px;
 }
 
-.e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 52px);
-}
-
 .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 92px);

package/styles/bootstrap4.css

@@ -2919,6 +2919,16 @@ ejs-listbox {
   top: 30%;
 }
 
+.e-listboxtool-container .e-left {
+  -ms-flex-direction: row-reverse;
+      flex-direction: row-reverse;
+}
+
+.e-listboxtool-wrapper .e-left {
+  -ms-flex-direction: column-reverse;
+      flex-direction: column-reverse;
+}
+
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
   margin-right: 15px;
@@ -3065,16 +3075,30 @@ ejs-listbox {
   margin: 0 0 0 12px;
 }
 
-.e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small .e-listbox-container.e-filter-list .e-list-parent {
+.e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 39px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 39px) !important;
+}
+
+.e-small .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 32px);
 }
 
-.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 32px) !important;
+}
+
+.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 46px);
 }
 
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 46px) !important;
+}
+
 .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 96px);
@@ -3085,11 +3109,14 @@ ejs-listbox {
   height: calc(100% - 50px);
 }
 
-.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 44px);
 }
 
+.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 44px) !important;
+}
+
 .e-listbox-wrapper,
 .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
 .e-listboxtool-container.e-listbox-container .e-ul {
@@ -3109,11 +3136,6 @@ ejs-listbox {
   font-size: 16px;
 }
 
-.e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 39px);
-}
-
 .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 79px);

package/styles/bootstrap5-dark.css

@@ -2899,6 +2899,16 @@ ejs-listbox {
   top: 30%;
 }
 
+.e-listboxtool-container .e-left {
+  -ms-flex-direction: row-reverse;
+      flex-direction: row-reverse;
+}
+
+.e-listboxtool-wrapper .e-left {
+  -ms-flex-direction: column-reverse;
+      flex-direction: column-reverse;
+}
+
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
   margin-right: 15px;
@@ -3001,14 +3011,28 @@ ejs-listbox {
 .e-listbox-container.e-bigger .e-list-header .e-text {
   font-size: 14px;
 }
-.e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small .e-listbox-container.e-filter-list .e-list-parent {
+.e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 50px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 50px) !important;
+}
+
+.e-small .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 45px);
 }
 
-.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 55px);
+.e-small .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 45px) !important;
+}
+
+.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 56px);
+}
+
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 56px) !important;
 }
 
 .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
@@ -3021,11 +3045,14 @@ ejs-listbox {
   height: calc(100% - 40px);
 }
 
-.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 45px);
 }
 
+.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 45px) !important;
+}
+
 .e-listbox-wrapper,
 .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
 .e-listboxtool-container.e-listbox-container .e-ul {
@@ -3045,11 +3072,6 @@ ejs-listbox {
   font-size: 12px;
 }
 
-.e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 47px);
-}
-
 .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 86px);

package/styles/bootstrap5.css

@@ -2899,6 +2899,16 @@ ejs-listbox {
   top: 30%;
 }
 
+.e-listboxtool-container .e-left {
+  -ms-flex-direction: row-reverse;
+      flex-direction: row-reverse;
+}
+
+.e-listboxtool-wrapper .e-left {
+  -ms-flex-direction: column-reverse;
+      flex-direction: column-reverse;
+}
+
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
   margin-right: 15px;
@@ -3001,14 +3011,28 @@ ejs-listbox {
 .e-listbox-container.e-bigger .e-list-header .e-text {
   font-size: 14px;
 }
-.e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small .e-listbox-container.e-filter-list .e-list-parent {
+.e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 50px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 50px) !important;
+}
+
+.e-small .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 45px);
 }
 
-.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 55px);
+.e-small .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 45px) !important;
+}
+
+.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 56px);
+}
+
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 56px) !important;
 }
 
 .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
@@ -3021,11 +3045,14 @@ ejs-listbox {
   height: calc(100% - 40px);
 }
 
-.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 45px);
 }
 
+.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 45px) !important;
+}
+
 .e-listbox-wrapper,
 .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
 .e-listboxtool-container.e-listbox-container .e-ul {
@@ -3045,11 +3072,6 @@ ejs-listbox {
   font-size: 12px;
 }
 
-.e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 47px);
-}
-
 .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 86px);

package/styles/fabric-dark.css

@@ -2716,6 +2716,16 @@ ejs-listbox {
   top: 30%;
 }
 
+.e-listboxtool-container .e-left {
+  -ms-flex-direction: row-reverse;
+      flex-direction: row-reverse;
+}
+
+.e-listboxtool-wrapper .e-left {
+  -ms-flex-direction: column-reverse;
+      flex-direction: column-reverse;
+}
+
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
   margin-right: 15px;
@@ -2818,16 +2828,30 @@ ejs-listbox {
 .e-listbox-container.e-bigger .e-list-header .e-text {
   font-size: 15px;
 }
-.e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small .e-listbox-container.e-filter-list .e-list-parent {
+.e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 51px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 51px) !important;
+}
+
+.e-small .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 45px);
 }
 
-.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 45px) !important;
+}
+
+.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 59px);
 }
 
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 59px) !important;
+}
+
 .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 104px);
@@ -2838,11 +2862,14 @@ ejs-listbox {
   height: calc(100% - 45px);
 }
 
-.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
+.e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
   height: calc(100% - 55px);
 }
 
+.e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 55px) !important;
+}
+
 .e-listbox-wrapper,
 .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
 .e-listboxtool-container.e-listbox-container .e-ul {
@@ -2862,11 +2889,6 @@ ejs-listbox {
   font-size: 14px;
 }
 
-.e-listbox-wrapper.e-filter-list .e-list-parent,
-.e-listbox-container.e-filter-list .e-list-parent {
-  height: calc(100% - 51px);
-}
-
 .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
 .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
   height: calc(100% - 87px);