@syncfusion/ej2-dropdowns 20.1.60 → 20.2.38

package/styles/fluent-dark.css

@@ -2608,6 +2608,10 @@ ejs-multiselect {
 .e-listbox-container * {
   box-sizing: border-box;
 }
+.e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-listboxtool-container .e-list-wrap {
+  width: 84% !important;
+}
 .e-listbox-wrapper:focus,
 .e-listbox-container:focus {
   outline: none;
@@ -2838,8 +2842,8 @@ ejs-multiselect {
   text-indent: 0;
   vertical-align: middle;
 }
-.e-listbox-wrapper.e-right .e-checkbox-wrapper,
-.e-listbox-container.e-right .e-checkbox-wrapper {
+.e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
   position: absolute;
   right: 0;
   top: 30%;
@@ -2903,9 +2907,9 @@ ejs-listbox {
   -ms-flex-align: center;
       align-items: center;
   background-color: #0078d4;
-  border: 1px solid #fff;
+  border: 1px solid #1b1a19;
   border-radius: 50%;
-  color: #fff;
+  color: #1b1a19;
   display: -ms-flexbox;
   display: flex;
   font-size: 12px;
@@ -2958,6 +2962,12 @@ ejs-listbox {
   list-style-type: none;
   margin-bottom: 10px;
 }
+.e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
+  position: absolute;
+  right: 0;
+  top: 30%;
+}
 
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -2968,6 +2978,12 @@ ejs-listbox {
   margin-left: 15px;
 }
 
+.e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
+.e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
+  width: 80% !important;
+}
 .e-bigger .e-listbox-wrapper .e-list-item,
 .e-listbox-wrapper.e-bigger .e-list-item,
 .e-bigger .e-listbox-container .e-list-item,
@@ -3055,21 +3071,48 @@ 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% - 57px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 57px) !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-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-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 65px);
+}
+
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 65px) !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% - 113px);
+}
+
+.e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 48px);
+}
+
+.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 {
@@ -3089,9 +3132,14 @@ 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% - 93px);
+}
+
+.e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 36px);
 }
 
 .e-listbox-wrapper .e-icons,
@@ -3141,7 +3189,7 @@ ejs-listbox {
 .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
   background-color: #0078d4;
   border-color: transparent;
-  color: #fff;
+  color: #1b1a19;
 }
 
 .e-listbox-wrapper .e-list-group-item,

package/styles/fluent.css

@@ -2608,6 +2608,10 @@ ejs-multiselect {
 .e-listbox-container * {
   box-sizing: border-box;
 }
+.e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-listboxtool-container .e-list-wrap {
+  width: 84% !important;
+}
 .e-listbox-wrapper:focus,
 .e-listbox-container:focus {
   outline: none;
@@ -2838,8 +2842,8 @@ ejs-multiselect {
   text-indent: 0;
   vertical-align: middle;
 }
-.e-listbox-wrapper.e-right .e-checkbox-wrapper,
-.e-listbox-container.e-right .e-checkbox-wrapper {
+.e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
   position: absolute;
   right: 0;
   top: 30%;
@@ -2958,6 +2962,12 @@ ejs-listbox {
   list-style-type: none;
   margin-bottom: 10px;
 }
+.e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
+  position: absolute;
+  right: 0;
+  top: 30%;
+}
 
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -2968,6 +2978,12 @@ ejs-listbox {
   margin-left: 15px;
 }
 
+.e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
+.e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
+  width: 80% !important;
+}
 .e-bigger .e-listbox-wrapper .e-list-item,
 .e-listbox-wrapper.e-bigger .e-list-item,
 .e-bigger .e-listbox-container .e-list-item,
@@ -3055,21 +3071,48 @@ 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% - 57px);
+}
+
+.e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 57px) !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-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-bigger .e-listbox-wrapper.e-filter-list .e-list-parent {
+  height: calc(100% - 65px);
+}
+
+.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
+  height: calc(100% - 65px) !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% - 113px);
+}
+
+.e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 48px);
+}
+
+.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 {
@@ -3089,9 +3132,14 @@ 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% - 93px);
+}
+
+.e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 36px);
 }
 
 .e-listbox-wrapper .e-icons,

package/styles/highcontrast-light.css

@@ -2459,6 +2459,10 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
 .e-listbox-container * {
   box-sizing: border-box;
 }
+.e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-listboxtool-container .e-list-wrap {
+  width: 87% !important;
+}
 .e-listbox-wrapper:focus,
 .e-listbox-container:focus {
   outline: none;
@@ -2689,8 +2693,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   text-indent: 0;
   vertical-align: middle;
 }
-.e-listbox-wrapper.e-right .e-checkbox-wrapper,
-.e-listbox-container.e-right .e-checkbox-wrapper {
+.e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
   position: absolute;
   right: 0;
   top: 30%;
@@ -2809,6 +2813,12 @@ ejs-listbox {
   list-style-type: none;
   margin-bottom: 10px;
 }
+.e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
+  position: absolute;
+  right: 0;
+  top: 30%;
+}
 
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -2819,6 +2829,12 @@ ejs-listbox {
   margin-left: 15px;
 }
 
+.e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
+.e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
+  width: 83% !important;
+}
 .e-bigger .e-listbox-wrapper .e-list-item,
 .e-listbox-wrapper.e-bigger .e-list-item,
 .e-bigger .e-listbox-container .e-list-item,
@@ -2906,21 +2922,48 @@ 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-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-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);
+}
+
+.e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 45px);
+}
+
+.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 {
@@ -2940,9 +2983,14 @@ 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);
+}
+
+.e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 36px);
 }
 
 .e-listbox-wrapper .e-icons,

package/styles/highcontrast.css

@@ -2465,6 +2465,10 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
 .e-listbox-container * {
   box-sizing: border-box;
 }
+.e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-listboxtool-container .e-list-wrap {
+  width: 87% !important;
+}
 .e-listbox-wrapper:focus,
 .e-listbox-container:focus {
   outline: none;
@@ -2695,8 +2699,8 @@ e-ddl.e-popup.e-multi-select-list-wrapper.e-multiselct-group.e-checkbox .e-list-
   text-indent: 0;
   vertical-align: middle;
 }
-.e-listbox-wrapper.e-right .e-checkbox-wrapper,
-.e-listbox-container.e-right .e-checkbox-wrapper {
+.e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
   position: absolute;
   right: 0;
   top: 30%;
@@ -2815,6 +2819,12 @@ ejs-listbox {
   list-style-type: none;
   margin-bottom: 10px;
 }
+.e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
+.e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
+  position: absolute;
+  right: 0;
+  top: 30%;
+}
 
 .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
 .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
@@ -2825,6 +2835,12 @@ ejs-listbox {
   margin-left: 15px;
 }
 
+.e-bigger .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
+.e-listbox-wrapper.e-bigger.e-listboxtool-container .e-list-wrap,
+.e-bigger .e-listbox-container.e-listboxtool-container .e-list-wrap,
+.e-listbox-container.e-bigger.e-listboxtool-container .e-list-wrap {
+  width: 83% !important;
+}
 .e-bigger .e-listbox-wrapper .e-list-item,
 .e-listbox-wrapper.e-bigger .e-list-item,
 .e-bigger .e-listbox-container .e-list-item,
@@ -2912,21 +2928,48 @@ 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-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-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);
+}
+
+.e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 45px);
+}
+
+.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 {
@@ -2946,9 +2989,14 @@ 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);
+}
+
+.e-listbox-wrapper .e-selectall-parent + .e-list-parent,
+.e-listbox-container .e-selectall-parent + .e-list-parent {
+  height: calc(100% - 36px);
 }
 
 .e-listbox-wrapper .e-icons,

package/styles/list-box/_bootstrap-dark-definition.scss

@@ -113,7 +113,11 @@ $badge-bgcolor: $brand-primary !default;
 
 $select-all-border-color: $grey-88 !default;
 
-$listbox-filter-height: calc(100% - 52px) !default;
 $listbox-filter-small-height: calc(100% - 46px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 54px) !default;
+$listbox-select-height: calc(100% - 40px) !default;
+$listbox-select-bigger-height: calc(100% - 48px) !default;
+$listbox-filterselect-height: calc(100% - 92px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 106px) !default;
+$listbox-filter-height: calc(100% - 52px) !default;
 $listbox-filter-bigger-height: calc(100% - 58px) !default;

package/styles/list-box/_bootstrap-definition.scss

@@ -107,7 +107,11 @@ $badge-bgcolor: $brand-primary !default;
 
 $select-all-border-color: $grey-e6 !default;
 
-$listbox-filter-height: calc(100% - 52px) !default;
 $listbox-filter-small-height: calc(100% - 46px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 54px) !default;
+$listbox-select-height: calc(100% - 40px) !default;
+$listbox-select-bigger-height: calc(100% - 48px) !default;
+$listbox-filterselect-height: calc(100% - 92px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 106px) !default;
+$listbox-filter-height: calc(100% - 52px) !default;
 $listbox-filter-bigger-height: calc(100% - 58px) !default;

package/styles/list-box/_bootstrap4-definition.scss

@@ -112,7 +112,11 @@ $badge-bgcolor: $primary !default;
 
 $select-all-border-color: rgba($black, .15);
 
-$listbox-filter-height: calc(100% - 39px) !default;
 $listbox-filter-small-height: calc(100% - 32px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 44px) !default;
+$listbox-select-height: calc(100% - 40px) !default;
+$listbox-select-bigger-height: calc(100% - 50px) !default;
+$listbox-filterselect-height: calc(100% - 79px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 96px) !default;
+$listbox-filter-height: calc(100% - 39px) !default;
 $listbox-filter-bigger-height: calc(100% - 46px) !default;

package/styles/list-box/_bootstrap5-definition.scss

@@ -70,10 +70,8 @@ $listbox-template-multiline-header-font-size: $text-sm !default;
 $listbox-template-multiline-padding: 4px !default;
 $listbox-template-multiline-content-font-size: $text-sm !default;
 $listbox-template-multiline-avatar-top: 0 !default;
-$listbox-filter-height: calc(100% - 47px) !default;
 $listbox-filter-small-height: calc(100% - 45px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
-$listbox-filter-bigger-height: calc(100% - 55px) !default;
 $listbox-item-height: 36px !default;
 
 $listbox-border-color: $border-light;
@@ -111,3 +109,10 @@ $listbox-groupheader-border: $black !default;
 $listbox-groupheader-icon: $icon-color !default;
 $listbox-template-multiline-header-color: $content-text-color !default;
 $listbox-template-multiline-content-color: $content-text-color-alt2 !default;
+
+$listbox-select-height: calc(100% - 36px) !default;
+$listbox-select-bigger-height: calc(100% - 40px) !default;
+$listbox-filterselect-height: calc(100% - 86px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 96px) !default;
+$listbox-filter-height: calc(100% - 50px) !default;
+$listbox-filter-bigger-height: calc(100% - 56px) !default;

package/styles/list-box/_fabric-dark-definition.scss

@@ -113,7 +113,11 @@ $badge-bgcolor: $theme-primary !default;
 
 $select-all-border-color: $neutral-light !default;
 
-$listbox-filter-height: calc(100% - 51px) !default;
 $listbox-filter-small-height: calc(100% - 45px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 55px) !default;
+$listbox-select-height: calc(100% - 36px) !default;
+$listbox-select-bigger-height: calc(100% - 45px) !default;
+$listbox-filterselect-height: calc(100% - 87px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 104px) !default;
+$listbox-filter-height: calc(100% - 51px) !default;
 $listbox-filter-bigger-height: calc(100% - 59px) !default;

package/styles/list-box/_fabric-definition.scss

@@ -107,7 +107,11 @@ $badge-bgcolor: $theme-primary !default;
 
 $select-all-border-color: $neutral-light !default;
 
-$listbox-filter-height: calc(100% - 51px) !default;
 $listbox-filter-small-height: calc(100% - 45px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 55px) !default;
+$listbox-select-height: calc(100% - 36px) !default;
+$listbox-select-bigger-height: calc(100% - 45px) !default;
+$listbox-filterselect-height: calc(100% - 87px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 104px) !default;
+$listbox-filter-height: calc(100% - 51px) !default;
 $listbox-filter-bigger-height: calc(100% - 59px) !default;

package/styles/list-box/_fluent-definition.scss

@@ -70,10 +70,8 @@ $listbox-template-multiline-header-font-size: $text-sm !default;
 $listbox-template-multiline-padding: 4px !default;
 $listbox-template-multiline-content-font-size: $text-sm !default;
 $listbox-template-multiline-avatar-top: 0 !default;
-$listbox-filter-height: calc(100% - 47px) !default;
 $listbox-filter-small-height: calc(100% - 45px) !default;
 $listbox-filter-bigger-small-height: calc(100% - 45px) !default;
-$listbox-filter-bigger-height: calc(100% - 55px) !default;
 $listbox-item-height: 36px !default;
 
 $listbox-border-color: $border-light;
@@ -111,3 +109,10 @@ $listbox-groupheader-border: $border-light !default;
 $listbox-groupheader-icon: $icon-color !default;
 $listbox-template-multiline-header-color: $content-text-color !default;
 $listbox-template-multiline-content-color: $content-text-color-alt2 !default;
+
+$listbox-select-height: calc(100% - 36px) !default;
+$listbox-select-bigger-height: calc(100% - 48px) !default;
+$listbox-filterselect-height: calc(100% - 93px) !default;
+$listbox-filterselect-bigger-height: calc(100% - 113px) !default;
+$listbox-filter-height: calc(100% - 57px) !default;
+$listbox-filter-bigger-height: calc(100% - 65px) !default;