@syncfusion/ej2-dropdowns 21.2.8 → 22.1.34

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (162) hide show
  1. package/.eslintrc.json +1 -0
  2. package/CHANGELOG.md +35 -6
  3. package/README.md +201 -103
  4. package/dist/ej2-dropdowns.min.js +2 -2
  5. package/dist/ej2-dropdowns.umd.min.js +2 -2
  6. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es2015.js +158 -41
  8. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  9. package/dist/es6/ej2-dropdowns.es5.js +158 -41
  10. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  11. package/dist/global/ej2-dropdowns.min.js +2 -2
  12. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  13. package/dist/global/index.d.ts +1 -1
  14. package/package.json +11 -11
  15. package/src/auto-complete/auto-complete-model.d.ts +2 -1
  16. package/src/auto-complete/auto-complete.d.ts +2 -1
  17. package/src/auto-complete/auto-complete.js +1 -1
  18. package/src/combo-box/combo-box-model.d.ts +6 -3
  19. package/src/combo-box/combo-box.d.ts +6 -3
  20. package/src/drop-down-base/drop-down-base-model.d.ts +8 -4
  21. package/src/drop-down-base/drop-down-base.d.ts +8 -4
  22. package/src/drop-down-base/drop-down-base.js +21 -7
  23. package/src/drop-down-list/drop-down-list-model.d.ts +6 -3
  24. package/src/drop-down-list/drop-down-list.d.ts +6 -3
  25. package/src/drop-down-list/drop-down-list.js +23 -14
  26. package/src/drop-down-tree/drop-down-tree-model.d.ts +21 -6
  27. package/src/drop-down-tree/drop-down-tree.d.ts +55 -62
  28. package/src/drop-down-tree/drop-down-tree.js +1 -1
  29. package/src/list-box/list-box.d.ts +15 -0
  30. package/src/list-box/list-box.js +53 -3
  31. package/src/mention/mention-model.d.ts +4 -2
  32. package/src/mention/mention.d.ts +4 -2
  33. package/src/multi-select/multi-select-model.d.ts +15 -8
  34. package/src/multi-select/multi-select.d.ts +15 -7
  35. package/src/multi-select/multi-select.js +59 -15
  36. package/styles/auto-complete/_material3-dark-definition.scss +1 -0
  37. package/styles/auto-complete/_material3-definition.scss +2 -0
  38. package/styles/auto-complete/material3-dark.css +198 -0
  39. package/styles/auto-complete/material3-dark.scss +5 -0
  40. package/styles/auto-complete/material3.css +254 -0
  41. package/styles/auto-complete/material3.scss +5 -0
  42. package/styles/bootstrap-dark.css +212 -100
  43. package/styles/bootstrap.css +214 -101
  44. package/styles/bootstrap4.css +214 -101
  45. package/styles/bootstrap5-dark.css +212 -100
  46. package/styles/bootstrap5.css +212 -100
  47. package/styles/combo-box/_material3-dark-definition.scss +1 -0
  48. package/styles/combo-box/_material3-definition.scss +2 -0
  49. package/styles/combo-box/material3-dark.css +198 -0
  50. package/styles/combo-box/material3-dark.scss +5 -0
  51. package/styles/combo-box/material3.css +254 -0
  52. package/styles/combo-box/material3.scss +5 -0
  53. package/styles/drop-down-base/_layout.scss +3 -1
  54. package/styles/drop-down-base/_material3-dark-definition.scss +1 -0
  55. package/styles/drop-down-base/_material3-definition.scss +87 -0
  56. package/styles/drop-down-base/_theme.scss +10 -0
  57. package/styles/drop-down-base/bootstrap-dark.css +4 -0
  58. package/styles/drop-down-base/bootstrap.css +4 -0
  59. package/styles/drop-down-base/bootstrap4.css +4 -0
  60. package/styles/drop-down-base/bootstrap5-dark.css +4 -0
  61. package/styles/drop-down-base/bootstrap5.css +4 -0
  62. package/styles/drop-down-base/fabric-dark.css +4 -0
  63. package/styles/drop-down-base/fabric.css +4 -0
  64. package/styles/drop-down-base/fluent-dark.css +4 -0
  65. package/styles/drop-down-base/fluent.css +4 -0
  66. package/styles/drop-down-base/highcontrast-light.css +4 -0
  67. package/styles/drop-down-base/highcontrast.css +4 -0
  68. package/styles/drop-down-base/material-dark.css +4 -0
  69. package/styles/drop-down-base/material.css +4 -0
  70. package/styles/drop-down-base/material3-dark.css +439 -0
  71. package/styles/drop-down-base/material3-dark.scss +4 -0
  72. package/styles/drop-down-base/material3.css +495 -0
  73. package/styles/drop-down-base/material3.scss +4 -0
  74. package/styles/drop-down-base/tailwind-dark.css +4 -0
  75. package/styles/drop-down-base/tailwind.css +4 -0
  76. package/styles/drop-down-list/_layout.scss +15 -1
  77. package/styles/drop-down-list/_material3-dark-definition.scss +1 -0
  78. package/styles/drop-down-list/_material3-definition.scss +180 -0
  79. package/styles/drop-down-list/icons/_material3-dark.scss +1 -0
  80. package/styles/drop-down-list/material3-dark.css +503 -0
  81. package/styles/drop-down-list/material3-dark.scss +9 -0
  82. package/styles/drop-down-list/material3.css +559 -0
  83. package/styles/drop-down-list/material3.scss +9 -0
  84. package/styles/drop-down-tree/_layout.scss +13 -7
  85. package/styles/drop-down-tree/_material3-dark-definition.scss +1 -0
  86. package/styles/drop-down-tree/_material3-definition.scss +76 -0
  87. package/styles/drop-down-tree/_theme.scss +14 -2
  88. package/styles/drop-down-tree/icons/_material3-dark.scss +1 -0
  89. package/styles/drop-down-tree/icons/_material3.scss +1 -1
  90. package/styles/drop-down-tree/material3-dark.css +466 -0
  91. package/styles/drop-down-tree/material3-dark.scss +10 -0
  92. package/styles/drop-down-tree/material3.css +522 -0
  93. package/styles/drop-down-tree/material3.scss +10 -0
  94. package/styles/fabric-dark.css +212 -100
  95. package/styles/fabric.css +214 -101
  96. package/styles/fluent-dark.css +214 -101
  97. package/styles/fluent.css +214 -101
  98. package/styles/highcontrast-light.css +212 -100
  99. package/styles/highcontrast.css +214 -101
  100. package/styles/list-box/_layout.scss +17 -3
  101. package/styles/list-box/_material3-dark-definition.scss +1 -0
  102. package/styles/list-box/_material3-definition.scss +117 -0
  103. package/styles/list-box/_theme.scss +2 -1
  104. package/styles/list-box/bootstrap-dark.css +207 -99
  105. package/styles/list-box/bootstrap.css +209 -100
  106. package/styles/list-box/bootstrap4.css +209 -100
  107. package/styles/list-box/bootstrap5-dark.css +207 -99
  108. package/styles/list-box/bootstrap5.css +207 -99
  109. package/styles/list-box/fabric-dark.css +207 -99
  110. package/styles/list-box/fabric.css +209 -100
  111. package/styles/list-box/fluent-dark.css +209 -100
  112. package/styles/list-box/fluent.css +209 -100
  113. package/styles/list-box/highcontrast-light.css +207 -99
  114. package/styles/list-box/highcontrast.css +209 -100
  115. package/styles/list-box/icons/_material3-dark.scss +1 -0
  116. package/styles/list-box/material-dark.css +207 -99
  117. package/styles/list-box/material.css +209 -100
  118. package/styles/list-box/material3-dark.css +956 -0
  119. package/styles/list-box/material3-dark.scss +6 -0
  120. package/styles/list-box/material3.css +1012 -0
  121. package/styles/list-box/material3.scss +6 -0
  122. package/styles/list-box/tailwind-dark.css +209 -100
  123. package/styles/list-box/tailwind.css +209 -100
  124. package/styles/material-dark.css +212 -100
  125. package/styles/material.css +214 -101
  126. package/styles/material3-dark.css +4664 -0
  127. package/styles/material3-dark.scss +10 -0
  128. package/styles/material3.css +4720 -0
  129. package/styles/material3.scss +10 -0
  130. package/styles/mention/_material3-dark-definition.scss +1 -0
  131. package/styles/mention/_material3-definition.scss +1 -0
  132. package/styles/mention/material3-dark.css +87 -0
  133. package/styles/mention/material3-dark.scss +7 -0
  134. package/styles/mention/material3.css +143 -0
  135. package/styles/mention/material3.scss +7 -0
  136. package/styles/multi-select/_layout.scss +160 -7
  137. package/styles/multi-select/_material3-dark-definition.scss +1 -0
  138. package/styles/multi-select/_material3-definition.scss +246 -0
  139. package/styles/multi-select/_theme.scss +6 -0
  140. package/styles/multi-select/bootstrap-dark.css +1 -1
  141. package/styles/multi-select/bootstrap.css +1 -1
  142. package/styles/multi-select/bootstrap4.css +1 -1
  143. package/styles/multi-select/bootstrap5-dark.css +1 -1
  144. package/styles/multi-select/bootstrap5.css +1 -1
  145. package/styles/multi-select/fabric-dark.css +1 -1
  146. package/styles/multi-select/fabric.css +1 -1
  147. package/styles/multi-select/fluent-dark.css +1 -1
  148. package/styles/multi-select/fluent.css +1 -1
  149. package/styles/multi-select/highcontrast-light.css +1 -1
  150. package/styles/multi-select/highcontrast.css +1 -1
  151. package/styles/multi-select/icons/_material3-dark.scss +1 -0
  152. package/styles/multi-select/icons/_material3.scss +3 -4
  153. package/styles/multi-select/material-dark.css +1 -1
  154. package/styles/multi-select/material.css +1 -1
  155. package/styles/multi-select/material3-dark.css +2547 -0
  156. package/styles/multi-select/material3-dark.scss +10 -0
  157. package/styles/multi-select/material3.css +2603 -0
  158. package/styles/multi-select/material3.scss +10 -0
  159. package/styles/multi-select/tailwind-dark.css +1 -1
  160. package/styles/multi-select/tailwind.css +1 -1
  161. package/styles/tailwind-dark.css +214 -101
  162. package/styles/tailwind.css +214 -101
@@ -375,6 +375,10 @@
375
375
  color: #fff;
376
376
  }
377
377
 
378
+ .e-selectall-parent.e-item-focus {
379
+ background-color: rgba(255, 255, 255, 0.05);
380
+ }
381
+
378
382
  /* stylelint-disable property-no-vendor-prefix */
379
383
  @keyframes e-input-ripple {
380
384
  100% {
@@ -2364,8 +2368,8 @@ ejs-dropdownlist {
2364
2368
  margin-top: -2.5em;
2365
2369
  position: absolute;
2366
2370
  right: 5px;
2367
- top: 100%;
2368
2371
  width: 24px;
2372
+ top: 100%;
2369
2373
  }
2370
2374
 
2371
2375
  .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
@@ -3907,7 +3911,8 @@ ejs-multiselect {
3907
3911
 
3908
3912
  /* stylelint-disable property-no-vendor-prefix */
3909
3913
  .e-listbox-wrapper,
3910
- .e-listbox-container {
3914
+ .e-listbox-container,
3915
+ .e-listboxtool-wrapper {
3911
3916
  -webkit-overflow-scrolling: touch;
3912
3917
  box-sizing: border-box;
3913
3918
  cursor: pointer;
@@ -3919,20 +3924,24 @@ ejs-multiselect {
3919
3924
  width: 100%;
3920
3925
  }
3921
3926
  .e-listbox-wrapper *,
3922
- .e-listbox-container * {
3927
+ .e-listbox-container *,
3928
+ .e-listboxtool-wrapper * {
3923
3929
  box-sizing: border-box;
3924
3930
  }
3925
3931
  .e-listbox-wrapper:focus,
3926
- .e-listbox-container:focus {
3932
+ .e-listbox-container:focus,
3933
+ .e-listboxtool-wrapper:focus {
3927
3934
  outline: none;
3928
3935
  }
3929
3936
  .e-listbox-wrapper.e-disabled,
3930
- .e-listbox-container.e-disabled {
3937
+ .e-listbox-container.e-disabled,
3938
+ .e-listboxtool-wrapper.e-disabled {
3931
3939
  cursor: default;
3932
3940
  pointer-events: none;
3933
3941
  }
3934
3942
  .e-listbox-wrapper:not(.e-list-template) .e-list-nrt,
3935
- .e-listbox-container:not(.e-list-template) .e-list-nrt {
3943
+ .e-listbox-container:not(.e-list-template) .e-list-nrt,
3944
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-nrt {
3936
3945
  text-align: center;
3937
3946
  }
3938
3947
  .e-listbox-wrapper:not(.e-list-template) .e-list-item,
@@ -3940,53 +3949,66 @@ ejs-multiselect {
3940
3949
  .e-listbox-wrapper .e-selectall-parent,
3941
3950
  .e-listbox-container:not(.e-list-template) .e-list-item,
3942
3951
  .e-listbox-container .e-list-nrt,
3943
- .e-listbox-container .e-selectall-parent {
3952
+ .e-listbox-container .e-selectall-parent,
3953
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-item,
3954
+ .e-listboxtool-wrapper .e-list-nrt,
3955
+ .e-listboxtool-wrapper .e-selectall-parent {
3944
3956
  height: 36px;
3945
3957
  line-height: 1;
3946
3958
  padding: 11px 16px;
3947
3959
  position: relative;
3948
3960
  }
3949
3961
  .e-listbox-wrapper.e-filter-list,
3950
- .e-listbox-container.e-filter-list {
3962
+ .e-listbox-container.e-filter-list,
3963
+ .e-listboxtool-wrapper.e-filter-list {
3951
3964
  overflow: inherit;
3952
3965
  }
3953
3966
  .e-listbox-wrapper .e-list-parent,
3954
- .e-listbox-container .e-list-parent {
3967
+ .e-listbox-container .e-list-parent,
3968
+ .e-listboxtool-wrapper .e-list-parent {
3955
3969
  height: 100%;
3956
3970
  min-height: 36px;
3957
3971
  }
3958
3972
  .e-listbox-wrapper .e-list-item,
3959
- .e-listbox-container .e-list-item {
3973
+ .e-listbox-container .e-list-item,
3974
+ .e-listboxtool-wrapper .e-list-item {
3960
3975
  border-bottom: 0 solid;
3961
3976
  outline: none;
3962
3977
  }
3963
3978
  .e-listbox-wrapper .e-list-item.e-disabled,
3964
- .e-listbox-container .e-list-item.e-disabled {
3979
+ .e-listbox-container .e-list-item.e-disabled,
3980
+ .e-listboxtool-wrapper .e-list-item.e-disabled {
3965
3981
  pointer-events: none;
3966
3982
  }
3967
3983
  .e-listbox-wrapper .e-disable,
3968
- .e-listbox-container .e-disable {
3984
+ .e-listbox-container .e-disable,
3985
+ .e-listboxtool-wrapper .e-disable {
3969
3986
  opacity: 0.7;
3970
3987
  }
3971
3988
  .e-listbox-wrapper .e-list-parent,
3972
- .e-listbox-container .e-list-parent {
3989
+ .e-listbox-container .e-list-parent,
3990
+ .e-listboxtool-wrapper .e-list-parent {
3973
3991
  margin: 0;
3974
3992
  padding: 0;
3975
3993
  }
3976
3994
  .e-listbox-wrapper .e-list-header .e-text.header,
3977
- .e-listbox-container .e-list-header .e-text.header {
3995
+ .e-listbox-container .e-list-header .e-text.header,
3996
+ .e-listboxtool-wrapper .e-list-header .e-text.header {
3978
3997
  display: none;
3979
3998
  }
3980
3999
  .e-listbox-wrapper .e-icon-back,
3981
- .e-listbox-container .e-icon-back {
4000
+ .e-listbox-container .e-icon-back,
4001
+ .e-listboxtool-wrapper .e-icon-back {
3982
4002
  margin-top: 2px;
3983
4003
  }
3984
4004
  .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
3985
- .e-listbox-container .e-list-header .e-headertemplate-text.nested-header {
4005
+ .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
4006
+ .e-listboxtool-wrapper .e-list-header .e-headertemplate-text.nested-header {
3986
4007
  display: none;
3987
4008
  }
3988
4009
  .e-listbox-wrapper .e-list-header,
3989
- .e-listbox-container .e-list-header {
4010
+ .e-listbox-container .e-list-header,
4011
+ .e-listboxtool-wrapper .e-list-header {
3990
4012
  -ms-flex-align: center;
3991
4013
  align-items: center;
3992
4014
  border-bottom: 1px solid;
@@ -3997,21 +4019,25 @@ ejs-multiselect {
3997
4019
  padding: 0 16px;
3998
4020
  }
3999
4021
  .e-listbox-wrapper .e-has-header > .e-view,
4000
- .e-listbox-container .e-has-header > .e-view {
4022
+ .e-listbox-container .e-has-header > .e-view,
4023
+ .e-listboxtool-wrapper .e-has-header > .e-view {
4001
4024
  top: 45px;
4002
4025
  }
4003
4026
  .e-listbox-wrapper .e-but-back,
4004
- .e-listbox-container .e-but-back {
4027
+ .e-listbox-container .e-but-back,
4028
+ .e-listboxtool-wrapper .e-but-back {
4005
4029
  cursor: pointer;
4006
4030
  padding-right: 30px;
4007
4031
  }
4008
4032
  .e-listbox-wrapper .e-list-group-item:first-child,
4009
- .e-listbox-container .e-list-group-item:first-child {
4033
+ .e-listbox-container .e-list-group-item:first-child,
4034
+ .e-listboxtool-wrapper .e-list-group-item:first-child {
4010
4035
  border: 0;
4011
4036
  border-bottom: 0 solid transparent;
4012
4037
  }
4013
4038
  .e-listbox-wrapper .e-list-group-item,
4014
- .e-listbox-container .e-list-group-item {
4039
+ .e-listbox-container .e-list-group-item,
4040
+ .e-listboxtool-wrapper .e-list-group-item {
4015
4041
  border-bottom: 0 solid transparent;
4016
4042
  border-top: 1px solid;
4017
4043
  font-weight: 600;
@@ -4020,7 +4046,8 @@ ejs-multiselect {
4020
4046
  padding: 11px 16px;
4021
4047
  }
4022
4048
  .e-listbox-wrapper .e-icon-collapsible,
4023
- .e-listbox-container .e-icon-collapsible {
4049
+ .e-listbox-container .e-icon-collapsible,
4050
+ .e-listboxtool-wrapper .e-icon-collapsible {
4024
4051
  cursor: pointer;
4025
4052
  font-size: 12px;
4026
4053
  position: absolute;
@@ -4029,42 +4056,51 @@ ejs-multiselect {
4029
4056
  transform: translateY(-50%);
4030
4057
  }
4031
4058
  .e-listbox-wrapper .e-text-content,
4032
- .e-listbox-container .e-text-content {
4059
+ .e-listbox-container .e-text-content,
4060
+ .e-listboxtool-wrapper .e-text-content {
4033
4061
  height: 100%;
4034
4062
  position: relative;
4035
4063
  vertical-align: middle;
4036
4064
  }
4037
4065
  .e-listbox-wrapper .e-text-content *,
4038
- .e-listbox-container .e-text-content * {
4066
+ .e-listbox-container .e-text-content *,
4067
+ .e-listboxtool-wrapper .e-text-content * {
4039
4068
  display: inline-block;
4040
4069
  vertical-align: middle;
4041
4070
  }
4042
4071
  .e-listbox-wrapper .e-text-content.e-checkbox .e-list-text,
4043
- .e-listbox-container .e-text-content.e-checkbox .e-list-text {
4072
+ .e-listbox-container .e-text-content.e-checkbox .e-list-text,
4073
+ .e-listboxtool-wrapper .e-text-content.e-checkbox .e-list-text {
4044
4074
  width: calc(100% - 40px);
4045
4075
  }
4046
4076
  .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
4047
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
4077
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
4078
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
4048
4079
  width: calc(100% - 90px);
4049
4080
  }
4050
4081
  .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4051
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4082
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4083
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4052
4084
  width: calc(100% - 80px);
4053
4085
  }
4054
4086
  .e-listbox-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4055
- .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4087
+ .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
4088
+ .e-listboxtool-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
4056
4089
  width: calc(100% - 92px);
4057
4090
  }
4058
4091
  .e-listbox-wrapper .e-checkbox .e-checkbox-left,
4059
- .e-listbox-container .e-checkbox .e-checkbox-left {
4092
+ .e-listbox-container .e-checkbox .e-checkbox-left,
4093
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-left {
4060
4094
  margin: -2px 10px 0 0;
4061
4095
  }
4062
4096
  .e-listbox-wrapper .e-checkbox .e-checkbox-right,
4063
- .e-listbox-container .e-checkbox .e-checkbox-right {
4097
+ .e-listbox-container .e-checkbox .e-checkbox-right,
4098
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-right {
4064
4099
  margin: -2px 0 0 10px;
4065
4100
  }
4066
4101
  .e-listbox-wrapper .e-list-text,
4067
- .e-listbox-container .e-list-text {
4102
+ .e-listbox-container .e-list-text,
4103
+ .e-listboxtool-wrapper .e-list-text {
4068
4104
  cursor: pointer;
4069
4105
  display: inline-block;
4070
4106
  overflow: hidden;
@@ -4074,107 +4110,129 @@ ejs-multiselect {
4074
4110
  width: 100%;
4075
4111
  }
4076
4112
  .e-listbox-wrapper .e-list-icon + .e-list-text,
4077
- .e-listbox-container .e-list-icon + .e-list-text {
4113
+ .e-listbox-container .e-list-icon + .e-list-text,
4114
+ .e-listboxtool-wrapper .e-list-icon + .e-list-text {
4078
4115
  width: calc(100% - 60px);
4079
4116
  }
4080
4117
  .e-listbox-wrapper .e-icon-wrapper .e-list-text,
4081
- .e-listbox-container .e-icon-wrapper .e-list-text {
4118
+ .e-listbox-container .e-icon-wrapper .e-list-text,
4119
+ .e-listboxtool-wrapper .e-icon-wrapper .e-list-text {
4082
4120
  width: calc(100% - 60px);
4083
4121
  }
4084
4122
  .e-listbox-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
4085
- .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
4123
+ .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
4124
+ .e-listboxtool-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
4086
4125
  width: calc(100% - 60px);
4087
4126
  }
4088
4127
  .e-listbox-wrapper .e-list-icon,
4089
- .e-listbox-container .e-list-icon {
4128
+ .e-listbox-container .e-list-icon,
4129
+ .e-listboxtool-wrapper .e-list-icon {
4090
4130
  height: 30px;
4091
4131
  margin-right: 16px;
4092
4132
  width: 30px;
4093
4133
  }
4094
4134
  .e-listbox-wrapper .e-content,
4095
- .e-listbox-container .e-content {
4135
+ .e-listbox-container .e-content,
4136
+ .e-listboxtool-wrapper .e-content {
4096
4137
  overflow: hidden;
4097
4138
  position: relative;
4098
4139
  }
4099
4140
  .e-listbox-wrapper .e-list-header .e-text,
4100
- .e-listbox-container .e-list-header .e-text {
4141
+ .e-listbox-container .e-list-header .e-text,
4142
+ .e-listboxtool-wrapper .e-list-header .e-text {
4101
4143
  cursor: pointer;
4102
4144
  text-indent: 0;
4103
4145
  }
4104
4146
  .e-listbox-wrapper .e-text .e-headertext,
4105
- .e-listbox-container .e-text .e-headertext {
4147
+ .e-listbox-container .e-text .e-headertext,
4148
+ .e-listboxtool-wrapper .e-text .e-headertext {
4106
4149
  display: inline-block;
4107
4150
  line-height: 15px;
4108
4151
  }
4109
4152
  .e-listbox-wrapper.e-rtl,
4110
- .e-listbox-container.e-rtl {
4153
+ .e-listbox-container.e-rtl,
4154
+ .e-listboxtool-wrapper.e-rtl {
4111
4155
  direction: rtl;
4112
4156
  }
4113
4157
  .e-listbox-wrapper.e-rtl .e-list-icon,
4114
- .e-listbox-container.e-rtl .e-list-icon {
4158
+ .e-listbox-container.e-rtl .e-list-icon,
4159
+ .e-listboxtool-wrapper.e-rtl .e-list-icon {
4115
4160
  margin-left: 16px;
4116
4161
  margin-right: 0;
4117
4162
  }
4118
4163
  .e-listbox-wrapper.e-rtl .e-icon-collapsible,
4119
- .e-listbox-container.e-rtl .e-icon-collapsible {
4164
+ .e-listbox-container.e-rtl .e-icon-collapsible,
4165
+ .e-listboxtool-wrapper.e-rtl .e-icon-collapsible {
4120
4166
  left: 0%;
4121
4167
  right: initial;
4122
4168
  top: 50%;
4123
4169
  transform: translateY(-50%) rotate(180deg);
4124
4170
  }
4125
4171
  .e-listbox-wrapper.e-rtl .e-list-header .e-text,
4126
- .e-listbox-container.e-rtl .e-list-header .e-text {
4172
+ .e-listbox-container.e-rtl .e-list-header .e-text,
4173
+ .e-listboxtool-wrapper.e-rtl .e-list-header .e-text {
4127
4174
  cursor: pointer;
4128
4175
  }
4129
4176
  .e-listbox-wrapper.e-rtl .e-but-back,
4130
- .e-listbox-container.e-rtl .e-but-back {
4177
+ .e-listbox-container.e-rtl .e-but-back,
4178
+ .e-listboxtool-wrapper.e-rtl .e-but-back {
4131
4179
  transform: rotate(180deg);
4132
4180
  }
4133
4181
  .e-listbox-wrapper.e-rtl .e-icon-back,
4134
- .e-listbox-container.e-rtl .e-icon-back {
4182
+ .e-listbox-container.e-rtl .e-icon-back,
4183
+ .e-listboxtool-wrapper.e-rtl .e-icon-back {
4135
4184
  margin-top: -2px;
4136
4185
  }
4137
4186
  .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-left,
4138
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left {
4187
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left,
4188
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-left {
4139
4189
  margin: -2px 0 0 10px;
4140
4190
  }
4141
4191
  .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-right,
4142
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right {
4192
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right,
4193
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-right {
4143
4194
  margin: -2px 10px 0 0;
4144
4195
  }
4145
4196
  .e-listbox-wrapper.e-rtl .e-checkbox-wrapper,
4146
- .e-listbox-container.e-rtl .e-checkbox-wrapper {
4197
+ .e-listbox-container.e-rtl .e-checkbox-wrapper,
4198
+ .e-listboxtool-wrapper.e-rtl .e-checkbox-wrapper {
4147
4199
  margin: -2px 0 0 10px;
4148
4200
  }
4149
4201
  .e-listbox-wrapper .e-checkbox-wrapper,
4150
- .e-listbox-container .e-checkbox-wrapper {
4202
+ .e-listbox-container .e-checkbox-wrapper,
4203
+ .e-listboxtool-wrapper .e-checkbox-wrapper {
4151
4204
  margin: -2px 10px 0 0;
4152
4205
  text-indent: 0;
4153
4206
  vertical-align: middle;
4154
4207
  }
4155
4208
  .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
4156
- .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
4209
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper,
4210
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper {
4157
4211
  position: absolute;
4158
4212
  right: 0;
4159
4213
  top: 30%;
4160
4214
  }
4161
4215
  .e-listbox-wrapper .e-input-group,
4162
- .e-listbox-container .e-input-group {
4216
+ .e-listbox-container .e-input-group,
4217
+ .e-listboxtool-wrapper .e-input-group {
4163
4218
  padding: 4px 8px;
4164
4219
  }
4165
4220
  .e-listbox-wrapper .e-input-focus,
4166
- .e-listbox-container .e-input-focus {
4221
+ .e-listbox-container .e-input-focus,
4222
+ .e-listboxtool-wrapper .e-input-focus {
4167
4223
  padding: 4px 4px 4px 8px;
4168
4224
  }
4169
4225
  .e-listbox-wrapper .e-hidden-select,
4170
- .e-listbox-container .e-hidden-select {
4226
+ .e-listbox-container .e-hidden-select,
4227
+ .e-listboxtool-wrapper .e-hidden-select {
4171
4228
  height: 1px;
4172
4229
  opacity: 0;
4173
4230
  position: absolute;
4174
4231
  width: 100%;
4175
4232
  }
4176
4233
  .e-listbox-wrapper .e-placeholder,
4177
- .e-listbox-container .e-placeholder {
4234
+ .e-listbox-container .e-placeholder,
4235
+ .e-listboxtool-wrapper .e-placeholder {
4178
4236
  background-color: #00b0ff;
4179
4237
  display: block;
4180
4238
  height: 1px;
@@ -4196,24 +4254,29 @@ ejs-listbox {
4196
4254
  }
4197
4255
 
4198
4256
  .e-listbox-wrapper.e-sortableclone,
4199
- .e-listbox-container.e-sortableclone {
4257
+ .e-listbox-container.e-sortableclone,
4258
+ .e-listboxtool-wrapper.e-sortableclone {
4200
4259
  border-width: 0;
4201
4260
  overflow: visible;
4202
4261
  }
4203
4262
  .e-listbox-wrapper.e-sortableclone .e-list-item,
4204
- .e-listbox-container.e-sortableclone .e-list-item {
4263
+ .e-listbox-container.e-sortableclone .e-list-item,
4264
+ .e-listboxtool-wrapper.e-sortableclone .e-list-item {
4205
4265
  list-style-type: none;
4206
4266
  }
4207
4267
  .e-listbox-wrapper.e-sortableclone .e-ripple,
4208
- .e-listbox-container.e-sortableclone .e-ripple {
4268
+ .e-listbox-container.e-sortableclone .e-ripple,
4269
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple {
4209
4270
  overflow: visible;
4210
4271
  }
4211
4272
  .e-listbox-wrapper.e-sortableclone .e-ripple .e-ripple-element,
4212
- .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element {
4273
+ .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element,
4274
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple .e-ripple-element {
4213
4275
  display: none;
4214
4276
  }
4215
4277
  .e-listbox-wrapper.e-sortableclone .e-list-badge,
4216
- .e-listbox-container.e-sortableclone .e-list-badge {
4278
+ .e-listbox-container.e-sortableclone .e-list-badge,
4279
+ .e-listboxtool-wrapper.e-sortableclone .e-list-badge {
4217
4280
  -ms-flex-align: center;
4218
4281
  align-items: center;
4219
4282
  background-color: #00b0ff;
@@ -4232,6 +4295,10 @@ ejs-listbox {
4232
4295
  width: 22px;
4233
4296
  }
4234
4297
 
4298
+ .e-listboxtool-wrapper.e-sortableclone {
4299
+ display: block;
4300
+ }
4301
+
4235
4302
  .e-listboxtool-wrapper,
4236
4303
  .e-listboxtool-container {
4237
4304
  cursor: pointer;
@@ -4407,12 +4474,14 @@ ejs-listbox {
4407
4474
  }
4408
4475
 
4409
4476
  .e-listbox-wrapper,
4410
- .e-listbox-container {
4477
+ .e-listbox-container,
4478
+ .e-listboxtool-wrapper {
4411
4479
  font-family: "Roboto", "Segoe UI", "GeezaPro", "DejaVu Serif", "sans-serif", "-apple-system", "BlinkMacSystemFont";
4412
4480
  font-size: 15px;
4413
4481
  }
4414
4482
  .e-listbox-wrapper .e-list-header,
4415
- .e-listbox-container .e-list-header {
4483
+ .e-listbox-container .e-list-header,
4484
+ .e-listboxtool-wrapper .e-list-header {
4416
4485
  background-color: #424242;
4417
4486
  border-color: rgba(0, 0, 0, 0.12);
4418
4487
  color: rgba(255, 255, 255, 0.7);
@@ -4420,27 +4489,32 @@ ejs-listbox {
4420
4489
  }
4421
4490
 
4422
4491
  .e-listbox-wrapper.e-filter-list .e-list-parent,
4423
- .e-listbox-container.e-filter-list .e-list-parent {
4492
+ .e-listbox-container.e-filter-list .e-list-parent,
4493
+ .e-listboxtool-wrapper.e-filter-list .e-list-parent {
4424
4494
  height: calc(100% - 43px);
4425
4495
  }
4426
4496
 
4427
4497
  .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
4428
- .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
4498
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent,
4499
+ .e-listboxtool-wrapper.e-filter-list .e-selectall-parent + .e-list-parent {
4429
4500
  height: calc(100% - 79px);
4430
4501
  }
4431
4502
 
4432
4503
  .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
4433
- .e-listbox-container .e-selectall-parent + .e-list-parent {
4504
+ .e-listbox-container .e-selectall-parent + .e-list-parent,
4505
+ .e-listboxtool-wrapper .e-selectall-parent + .e-list-parent {
4434
4506
  height: calc(100% - 36px);
4435
4507
  }
4436
4508
 
4437
4509
  .e-listbox-wrapper .e-icons,
4438
- .e-listbox-container .e-icons {
4510
+ .e-listbox-container .e-icons,
4511
+ .e-listboxtool-wrapper .e-icons {
4439
4512
  color: #fff;
4440
4513
  }
4441
4514
 
4442
4515
  .e-listbox-wrapper .e-list-item,
4443
- .e-listbox-container .e-list-item {
4516
+ .e-listbox-container .e-list-item,
4517
+ .e-listboxtool-wrapper .e-list-item {
4444
4518
  background-color: #303030;
4445
4519
  border-bottom: 0 solid transparent;
4446
4520
  border-left: 0 solid transparent;
@@ -4451,41 +4525,50 @@ ejs-listbox {
4451
4525
 
4452
4526
  .e-listbox-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled), .e-listbox-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
4453
4527
  .e-listbox-container .e-list-item:hover:not(.e-selected):not(.e-disabled),
4454
- .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
4528
+ .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
4529
+ .e-listboxtool-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
4530
+ .e-listboxtool-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
4455
4531
  background-color: #424242;
4456
4532
  border-color: transparent;
4457
4533
  color: #fff;
4458
4534
  }
4459
4535
 
4460
4536
  .e-listbox-wrapper .e-list-item.e-selected,
4461
- .e-listbox-container .e-list-item.e-selected {
4537
+ .e-listbox-container .e-list-item.e-selected,
4538
+ .e-listboxtool-wrapper .e-list-item.e-selected {
4462
4539
  background-color: #616161;
4463
4540
  color: #fff;
4464
4541
  }
4465
4542
 
4466
4543
  .e-listbox-wrapper .e-list-item.e-selected.e-checklist,
4467
- .e-listbox-container .e-list-item.e-selected.e-checklist {
4544
+ .e-listbox-container .e-list-item.e-selected.e-checklist,
4545
+ .e-listboxtool-wrapper .e-list-item.e-selected.e-checklist {
4468
4546
  background-color: #303030;
4469
4547
  color: #fff;
4470
4548
  }
4471
4549
 
4472
4550
  .e-listbox-wrapper .e-list-item.e-focused, .e-listbox-wrapper .e-list-item.e-focused.e-selected.e-checklist,
4473
4551
  .e-listbox-container .e-list-item.e-focused,
4474
- .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist {
4552
+ .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist,
4553
+ .e-listboxtool-wrapper .e-list-item.e-focused,
4554
+ .e-listboxtool-wrapper .e-list-item.e-focused.e-selected.e-checklist {
4475
4555
  background-color: #616161;
4476
4556
  color: #fff;
4477
4557
  }
4478
4558
 
4479
4559
  .e-listbox-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check, .e-listbox-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
4480
4560
  .e-listbox-container .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
4481
- .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
4561
+ .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
4562
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
4563
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
4482
4564
  background-color: #00b0ff;
4483
4565
  border-color: transparent;
4484
4566
  color: #000;
4485
4567
  }
4486
4568
 
4487
4569
  .e-listbox-wrapper .e-list-group-item,
4488
- .e-listbox-container .e-list-group-item {
4570
+ .e-listbox-container .e-list-group-item,
4571
+ .e-listboxtool-wrapper .e-list-group-item {
4489
4572
  background-color: #424242;
4490
4573
  border-color: rgba(0, 0, 0, 0.12);
4491
4574
  color: rgba(255, 255, 255, 0.7);
@@ -4493,32 +4576,38 @@ ejs-listbox {
4493
4576
  }
4494
4577
 
4495
4578
  .e-listbox-wrapper .e-selectall-parent,
4496
- .e-listbox-container .e-selectall-parent {
4579
+ .e-listbox-container .e-selectall-parent,
4580
+ .e-listboxtool-wrapper .e-selectall-parent {
4497
4581
  background-color: #303030;
4498
4582
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
4499
4583
  color: #fff;
4500
4584
  }
4501
4585
 
4502
4586
  .e-listbox-wrapper .e-sortableclone.e-ripple .e-ripple-element,
4503
- .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element {
4587
+ .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element,
4588
+ .e-listboxtool-wrapper .e-sortableclone.e-ripple .e-ripple-element {
4504
4589
  background-color: transparent;
4505
4590
  }
4506
4591
 
4507
4592
  .e-listbox-wrapper.e-list-template .e-list-wrapper,
4508
- .e-listbox-container.e-list-template .e-list-wrapper {
4593
+ .e-listbox-container.e-list-template .e-list-wrapper,
4594
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper {
4509
4595
  height: inherit;
4510
4596
  position: relative;
4511
4597
  }
4512
4598
  .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line),
4513
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
4599
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line),
4600
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
4514
4601
  padding: 0.2667em 1.0666em;
4515
4602
  }
4516
4603
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line,
4517
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line {
4604
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line,
4605
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line {
4518
4606
  padding: 1.0666em;
4519
4607
  }
4520
4608
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
4521
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
4609
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
4610
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
4522
4611
  color: rgba(0, 0, 0, 0.87);
4523
4612
  display: block;
4524
4613
  font-size: 15px;
@@ -4530,7 +4619,8 @@ ejs-listbox {
4530
4619
  white-space: nowrap;
4531
4620
  }
4532
4621
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
4533
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
4622
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
4623
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
4534
4624
  color: rgba(0, 0, 0, 0.54);
4535
4625
  display: block;
4536
4626
  font-size: 13px;
@@ -4539,13 +4629,15 @@ ejs-listbox {
4539
4629
  word-wrap: break-word;
4540
4630
  }
4541
4631
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
4542
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
4632
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
4633
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
4543
4634
  overflow: hidden;
4544
4635
  text-overflow: ellipsis;
4545
4636
  white-space: nowrap;
4546
4637
  }
4547
4638
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4548
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4639
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4640
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4549
4641
  height: 2.6667em;
4550
4642
  left: 1.0667em;
4551
4643
  position: absolute;
@@ -4553,17 +4645,20 @@ ejs-listbox {
4553
4645
  width: 2.6667em;
4554
4646
  }
4555
4647
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4556
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4648
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4649
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4557
4650
  padding-left: 4.8em;
4558
4651
  padding-right: 1.0666em;
4559
4652
  }
4560
4653
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4561
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4654
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4655
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4562
4656
  padding-left: 1.0666em;
4563
4657
  padding-right: 4.8em;
4564
4658
  }
4565
4659
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4566
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4660
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4661
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4567
4662
  height: 2.6667em;
4568
4663
  position: absolute;
4569
4664
  right: 1.0667em;
@@ -4571,15 +4666,18 @@ ejs-listbox {
4571
4666
  width: 2.6667em;
4572
4667
  }
4573
4668
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
4574
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
4669
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
4670
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
4575
4671
  top: 1.0666em;
4576
4672
  }
4577
4673
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4578
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4674
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4675
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4579
4676
  top: 1.0666em;
4580
4677
  }
4581
4678
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4582
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4679
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4680
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4583
4681
  font-size: 12px;
4584
4682
  height: 1.6666em;
4585
4683
  line-height: 1.8666em;
@@ -4591,17 +4689,20 @@ ejs-listbox {
4591
4689
  width: 2.5em;
4592
4690
  }
4593
4691
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4594
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4692
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4693
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4595
4694
  padding-left: 4.8em;
4596
4695
  padding-right: 4.1333em;
4597
4696
  }
4598
4697
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4599
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4698
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4699
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4600
4700
  padding-left: 1.0666em;
4601
4701
  padding-right: 4.1333em;
4602
4702
  }
4603
4703
  .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
4604
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
4704
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
4705
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
4605
4706
  display: block;
4606
4707
  margin: 0;
4607
4708
  overflow: hidden;
@@ -4610,53 +4711,64 @@ ejs-listbox {
4610
4711
  white-space: nowrap;
4611
4712
  }
4612
4713
  .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
4613
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
4714
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
4715
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
4614
4716
  color: #fff;
4615
4717
  }
4616
4718
  .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content,
4617
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content {
4719
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content,
4720
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content {
4618
4721
  color: #fff;
4619
4722
  }
4620
4723
  .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header,
4621
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header {
4724
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header,
4725
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header {
4622
4726
  color: #fff;
4623
4727
  }
4624
4728
  .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-content,
4625
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content {
4729
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content,
4730
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-content {
4626
4731
  color: #fff;
4627
4732
  }
4628
4733
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4629
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4734
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
4735
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
4630
4736
  left: inherit;
4631
4737
  right: 1.0667em;
4632
4738
  }
4633
4739
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4634
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4740
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
4741
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
4635
4742
  padding-left: 1.0666em;
4636
4743
  padding-right: 4.8em;
4637
4744
  }
4638
4745
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4639
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4746
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
4747
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
4640
4748
  padding-left: 4.8em;
4641
4749
  padding-right: 1.0666em;
4642
4750
  }
4643
4751
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4644
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4752
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
4753
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
4645
4754
  left: 1.0667em;
4646
4755
  right: inherit;
4647
4756
  }
4648
4757
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4649
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4758
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
4759
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
4650
4760
  left: 1.33em;
4651
4761
  right: inherit;
4652
4762
  }
4653
4763
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4654
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4764
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
4765
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
4655
4766
  padding-left: 4.1333em;
4656
4767
  padding-right: 4.8em;
4657
4768
  }
4658
4769
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4659
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4770
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
4771
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
4660
4772
  padding-left: 4.1333em;
4661
4773
  padding-right: 1.0666em;
4662
4774
  }