@syncfusion/ej2-dropdowns 20.4.52 → 20.4.54-54740

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 (516) hide show
  1. package/CHANGELOG.md +2085 -2063
  2. package/{README.md → ReadMe.md} +119 -119
  3. package/dist/ej2-dropdowns.umd.min.js +1 -10
  4. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-dropdowns.es2015.js +66 -53
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +184 -171
  8. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  9. package/helpers/e2e/autocomplete.js +13 -13
  10. package/helpers/e2e/combobox.js +13 -13
  11. package/helpers/e2e/dropdownlist.js +13 -13
  12. package/helpers/e2e/index.js +3 -3
  13. package/helpers/e2e/listboxHelper.js +13 -13
  14. package/helpers/e2e/multiselect.js +13 -13
  15. package/license +2 -2
  16. package/package.json +78 -78
  17. package/src/auto-complete/auto-complete-model.d.ts +187 -187
  18. package/src/auto-complete/auto-complete.d.ts +12 -12
  19. package/src/auto-complete/auto-complete.js +21 -21
  20. package/src/combo-box/combo-box-model.d.ts +221 -221
  21. package/src/combo-box/combo-box.d.ts +27 -27
  22. package/src/combo-box/combo-box.js +29 -29
  23. package/src/common/incremental-search.js +1 -1
  24. package/src/drop-down-base/drop-down-base-model.d.ts +196 -196
  25. package/src/drop-down-base/drop-down-base.d.ts +15 -15
  26. package/src/drop-down-base/drop-down-base.js +20 -20
  27. package/src/drop-down-list/drop-down-list-model.d.ts +194 -194
  28. package/src/drop-down-list/drop-down-list.d.ts +4 -4
  29. package/src/drop-down-list/drop-down-list.js +34 -21
  30. package/src/drop-down-tree/drop-down-tree-model.d.ts +445 -445
  31. package/src/drop-down-tree/drop-down-tree.js +21 -22
  32. package/src/global.d.ts +1 -0
  33. package/src/list-box/list-box-model.d.ts +194 -194
  34. package/src/list-box/list-box.d.ts +2 -2
  35. package/src/list-box/list-box.js +19 -19
  36. package/src/mention/mention-model.d.ts +259 -259
  37. package/src/mention/mention.js +19 -19
  38. package/src/multi-select/multi-select-model.d.ts +505 -505
  39. package/src/multi-select/multi-select.js +20 -19
  40. package/styles/auto-complete/_all.scss +1 -1
  41. package/styles/auto-complete/_bds-definition.scss +2 -0
  42. package/styles/auto-complete/_bootstrap-dark-definition.scss +3 -3
  43. package/styles/auto-complete/_bootstrap-definition.scss +2 -2
  44. package/styles/auto-complete/_bootstrap4-definition.scss +11 -11
  45. package/styles/auto-complete/_bootstrap5-definition.scss +2 -2
  46. package/styles/auto-complete/_fabric-dark-definition.scss +2 -2
  47. package/styles/auto-complete/_fabric-definition.scss +2 -2
  48. package/styles/auto-complete/_fluent-definition.scss +2 -2
  49. package/styles/auto-complete/_fusionnew-definition.scss +2 -2
  50. package/styles/auto-complete/_highcontrast-definition.scss +2 -2
  51. package/styles/auto-complete/_highcontrast-light-definition.scss +2 -2
  52. package/styles/auto-complete/_material-dark-definition.scss +2 -2
  53. package/styles/auto-complete/_material-definition.scss +2 -2
  54. package/styles/auto-complete/_material3-dark-definition.scss +1 -0
  55. package/styles/auto-complete/_material3-definition.scss +2 -2
  56. package/styles/auto-complete/_tailwind-definition.scss +2 -2
  57. package/styles/auto-complete/bootstrap-dark.scss +1 -1
  58. package/styles/auto-complete/bootstrap.scss +1 -1
  59. package/styles/auto-complete/bootstrap4.css +13 -2
  60. package/styles/auto-complete/bootstrap4.scss +1 -1
  61. package/styles/auto-complete/bootstrap5-dark.scss +1 -1
  62. package/styles/auto-complete/bootstrap5.scss +1 -1
  63. package/styles/auto-complete/fabric-dark.scss +1 -1
  64. package/styles/auto-complete/fabric.scss +1 -1
  65. package/styles/auto-complete/fluent-dark.scss +1 -1
  66. package/styles/auto-complete/fluent.scss +1 -1
  67. package/styles/auto-complete/highcontrast-light.scss +1 -1
  68. package/styles/auto-complete/highcontrast.scss +1 -1
  69. package/styles/auto-complete/material-dark.css +0 -1
  70. package/styles/auto-complete/material-dark.scss +1 -1
  71. package/styles/auto-complete/material.css +0 -1
  72. package/styles/auto-complete/material.scss +1 -1
  73. package/styles/auto-complete/material3-dark.css +197 -0
  74. package/styles/auto-complete/material3-dark.scss +5 -0
  75. package/styles/auto-complete/material3.css +253 -0
  76. package/styles/auto-complete/material3.scss +5 -0
  77. package/styles/auto-complete/tailwind-dark.css +0 -1
  78. package/styles/auto-complete/tailwind-dark.scss +1 -1
  79. package/styles/auto-complete/tailwind.css +0 -1
  80. package/styles/auto-complete/tailwind.scss +1 -1
  81. package/styles/bootstrap-dark.css +309 -138
  82. package/styles/bootstrap.css +306 -129
  83. package/styles/bootstrap4.css +340 -141
  84. package/styles/bootstrap5-dark.css +310 -133
  85. package/styles/bootstrap5.css +310 -133
  86. package/styles/combo-box/_all.scss +1 -1
  87. package/styles/combo-box/_bds-definition.scss +2 -0
  88. package/styles/combo-box/_bootstrap-dark-definition.scss +2 -2
  89. package/styles/combo-box/_bootstrap-definition.scss +2 -2
  90. package/styles/combo-box/_bootstrap4-definition.scss +11 -11
  91. package/styles/combo-box/_bootstrap5-definition.scss +2 -2
  92. package/styles/combo-box/_fabric-dark-definition.scss +2 -2
  93. package/styles/combo-box/_fabric-definition.scss +2 -2
  94. package/styles/combo-box/_fluent-definition.scss +2 -2
  95. package/styles/combo-box/_fusionnew-definition.scss +2 -2
  96. package/styles/combo-box/_highcontrast-definition.scss +2 -2
  97. package/styles/combo-box/_highcontrast-light-definition.scss +3 -3
  98. package/styles/combo-box/_material-dark-definition.scss +2 -2
  99. package/styles/combo-box/_material-definition.scss +2 -2
  100. package/styles/combo-box/_material3-dark-definition.scss +1 -0
  101. package/styles/combo-box/_material3-definition.scss +2 -2
  102. package/styles/combo-box/_tailwind-definition.scss +2 -2
  103. package/styles/combo-box/bootstrap-dark.scss +1 -1
  104. package/styles/combo-box/bootstrap.scss +1 -1
  105. package/styles/combo-box/bootstrap4.css +13 -2
  106. package/styles/combo-box/bootstrap4.scss +1 -1
  107. package/styles/combo-box/bootstrap5-dark.scss +1 -1
  108. package/styles/combo-box/bootstrap5.scss +1 -1
  109. package/styles/combo-box/fabric-dark.scss +1 -1
  110. package/styles/combo-box/fabric.scss +1 -1
  111. package/styles/combo-box/fluent-dark.scss +1 -1
  112. package/styles/combo-box/fluent.scss +1 -1
  113. package/styles/combo-box/highcontrast-light.scss +1 -1
  114. package/styles/combo-box/highcontrast.scss +1 -1
  115. package/styles/combo-box/material-dark.css +0 -1
  116. package/styles/combo-box/material-dark.scss +1 -1
  117. package/styles/combo-box/material.css +0 -1
  118. package/styles/combo-box/material.scss +1 -1
  119. package/styles/combo-box/material3-dark.css +197 -0
  120. package/styles/combo-box/material3-dark.scss +5 -0
  121. package/styles/combo-box/material3.css +253 -0
  122. package/styles/combo-box/material3.scss +5 -0
  123. package/styles/combo-box/tailwind-dark.css +0 -1
  124. package/styles/combo-box/tailwind-dark.scss +1 -1
  125. package/styles/combo-box/tailwind.css +0 -1
  126. package/styles/combo-box/tailwind.scss +1 -1
  127. package/styles/drop-down-base/_all.scss +2 -2
  128. package/styles/drop-down-base/_bds-definition.scss +134 -0
  129. package/styles/drop-down-base/_bootstrap-dark-definition.scss +83 -83
  130. package/styles/drop-down-base/_bootstrap-definition.scss +83 -83
  131. package/styles/drop-down-base/_bootstrap4-definition.scss +90 -98
  132. package/styles/drop-down-base/_bootstrap5-definition.scss +117 -117
  133. package/styles/drop-down-base/_definition.scss +23 -23
  134. package/styles/drop-down-base/_fabric-dark-definition.scss +86 -86
  135. package/styles/drop-down-base/_fabric-definition.scss +84 -84
  136. package/styles/drop-down-base/_fluent-definition.scss +121 -121
  137. package/styles/drop-down-base/_fusionnew-definition.scss +117 -117
  138. package/styles/drop-down-base/_highcontrast-definition.scss +105 -105
  139. package/styles/drop-down-base/_highcontrast-light-definition.scss +105 -105
  140. package/styles/drop-down-base/_layout.scss +187 -193
  141. package/styles/drop-down-base/_material-dark-definition.scss +86 -86
  142. package/styles/drop-down-base/_material-definition.scss +85 -85
  143. package/styles/drop-down-base/_material3-dark-definition.scss +1 -0
  144. package/styles/drop-down-base/_material3-definition.scss +87 -117
  145. package/styles/drop-down-base/_tailwind-definition.scss +129 -129
  146. package/styles/drop-down-base/_theme.scss +391 -328
  147. package/styles/drop-down-base/bootstrap-dark.css +6 -10
  148. package/styles/drop-down-base/bootstrap-dark.scss +1 -1
  149. package/styles/drop-down-base/bootstrap.css +6 -10
  150. package/styles/drop-down-base/bootstrap.scss +1 -1
  151. package/styles/drop-down-base/bootstrap4.css +6 -18
  152. package/styles/drop-down-base/bootstrap4.scss +1 -1
  153. package/styles/drop-down-base/bootstrap5-dark.css +6 -10
  154. package/styles/drop-down-base/bootstrap5-dark.scss +1 -1
  155. package/styles/drop-down-base/bootstrap5.css +6 -10
  156. package/styles/drop-down-base/bootstrap5.scss +1 -1
  157. package/styles/drop-down-base/fabric-dark.css +6 -10
  158. package/styles/drop-down-base/fabric-dark.scss +1 -1
  159. package/styles/drop-down-base/fabric.css +6 -10
  160. package/styles/drop-down-base/fabric.scss +1 -1
  161. package/styles/drop-down-base/fluent-dark.css +6 -10
  162. package/styles/drop-down-base/fluent-dark.scss +1 -1
  163. package/styles/drop-down-base/fluent.css +6 -10
  164. package/styles/drop-down-base/fluent.scss +1 -1
  165. package/styles/drop-down-base/highcontrast-light.css +6 -10
  166. package/styles/drop-down-base/highcontrast-light.scss +1 -1
  167. package/styles/drop-down-base/highcontrast.css +6 -10
  168. package/styles/drop-down-base/highcontrast.scss +1 -1
  169. package/styles/drop-down-base/material-dark.css +6 -11
  170. package/styles/drop-down-base/material-dark.scss +1 -1
  171. package/styles/drop-down-base/material.css +6 -11
  172. package/styles/drop-down-base/material.scss +1 -1
  173. package/styles/drop-down-base/material3-dark.css +430 -0
  174. package/styles/drop-down-base/material3-dark.scss +4 -0
  175. package/styles/drop-down-base/material3.css +486 -0
  176. package/styles/drop-down-base/material3.scss +4 -0
  177. package/styles/drop-down-base/tailwind-dark.css +6 -11
  178. package/styles/drop-down-base/tailwind-dark.scss +1 -1
  179. package/styles/drop-down-base/tailwind.css +6 -11
  180. package/styles/drop-down-base/tailwind.scss +1 -1
  181. package/styles/drop-down-list/_all.scss +3 -3
  182. package/styles/drop-down-list/_bds-definition.scss +134 -0
  183. package/styles/drop-down-list/_bootstrap-dark-definition.scss +157 -157
  184. package/styles/drop-down-list/_bootstrap-definition.scss +156 -156
  185. package/styles/drop-down-list/_bootstrap4-definition.scss +202 -191
  186. package/styles/drop-down-list/_bootstrap5-definition.scss +201 -201
  187. package/styles/drop-down-list/_fabric-dark-definition.scss +128 -128
  188. package/styles/drop-down-list/_fabric-definition.scss +124 -124
  189. package/styles/drop-down-list/_fluent-definition.scss +185 -185
  190. package/styles/drop-down-list/_fusionnew-definition.scss +201 -201
  191. package/styles/drop-down-list/_highcontrast-definition.scss +142 -142
  192. package/styles/drop-down-list/_highcontrast-light-definition.scss +144 -144
  193. package/styles/drop-down-list/_layout.scss +315 -299
  194. package/styles/drop-down-list/_material-dark-definition.scss +143 -143
  195. package/styles/drop-down-list/_material-definition.scss +167 -167
  196. package/styles/drop-down-list/_material3-dark-definition.scss +1 -0
  197. package/styles/drop-down-list/_material3-definition.scss +180 -201
  198. package/styles/drop-down-list/_tailwind-definition.scss +134 -134
  199. package/styles/drop-down-list/_theme.scss +10 -10
  200. package/styles/drop-down-list/bootstrap-dark.css +5 -3
  201. package/styles/drop-down-list/bootstrap-dark.scss +1 -1
  202. package/styles/drop-down-list/bootstrap.css +5 -3
  203. package/styles/drop-down-list/bootstrap.scss +1 -1
  204. package/styles/drop-down-list/bootstrap4.css +19 -14
  205. package/styles/drop-down-list/bootstrap4.scss +1 -1
  206. package/styles/drop-down-list/bootstrap5-dark.css +5 -3
  207. package/styles/drop-down-list/bootstrap5-dark.scss +1 -1
  208. package/styles/drop-down-list/bootstrap5.css +5 -3
  209. package/styles/drop-down-list/bootstrap5.scss +1 -1
  210. package/styles/drop-down-list/fabric-dark.css +5 -3
  211. package/styles/drop-down-list/fabric-dark.scss +1 -1
  212. package/styles/drop-down-list/fabric.css +5 -3
  213. package/styles/drop-down-list/fabric.scss +1 -1
  214. package/styles/drop-down-list/fluent-dark.css +5 -3
  215. package/styles/drop-down-list/fluent-dark.scss +1 -1
  216. package/styles/drop-down-list/fluent.css +5 -3
  217. package/styles/drop-down-list/fluent.scss +1 -1
  218. package/styles/drop-down-list/highcontrast-light.css +5 -3
  219. package/styles/drop-down-list/highcontrast-light.scss +1 -1
  220. package/styles/drop-down-list/highcontrast.css +5 -3
  221. package/styles/drop-down-list/highcontrast.scss +1 -1
  222. package/styles/drop-down-list/icons/_bootstrap-dark.scss +14 -14
  223. package/styles/drop-down-list/icons/_bootstrap.scss +14 -14
  224. package/styles/drop-down-list/icons/_bootstrap4.scss +14 -14
  225. package/styles/drop-down-list/icons/_bootstrap5.scss +14 -14
  226. package/styles/drop-down-list/icons/_fabric-dark.scss +14 -14
  227. package/styles/drop-down-list/icons/_fabric.scss +14 -14
  228. package/styles/drop-down-list/icons/_fluent.scss +14 -14
  229. package/styles/drop-down-list/icons/_fusionnew.scss +14 -14
  230. package/styles/drop-down-list/icons/_highcontrast-light.scss +14 -14
  231. package/styles/drop-down-list/icons/_highcontrast.scss +14 -14
  232. package/styles/drop-down-list/icons/_material-dark.scss +14 -14
  233. package/styles/drop-down-list/icons/_material.scss +14 -14
  234. package/styles/drop-down-list/icons/_material3-dark.scss +1 -0
  235. package/styles/drop-down-list/icons/_material3.scss +14 -14
  236. package/styles/drop-down-list/icons/_tailwind.scss +14 -14
  237. package/styles/drop-down-list/material-dark.css +6 -4
  238. package/styles/drop-down-list/material-dark.scss +1 -1
  239. package/styles/drop-down-list/material.css +5 -4
  240. package/styles/drop-down-list/material.scss +1 -1
  241. package/styles/drop-down-list/material3-dark.css +507 -0
  242. package/styles/drop-down-list/material3-dark.scss +9 -0
  243. package/styles/drop-down-list/material3.css +563 -0
  244. package/styles/drop-down-list/material3.scss +9 -0
  245. package/styles/drop-down-list/tailwind-dark.css +6 -5
  246. package/styles/drop-down-list/tailwind-dark.scss +1 -1
  247. package/styles/drop-down-list/tailwind.css +6 -5
  248. package/styles/drop-down-list/tailwind.scss +1 -1
  249. package/styles/drop-down-tree/_all.scss +2 -2
  250. package/styles/drop-down-tree/_bds-definition.scss +61 -0
  251. package/styles/drop-down-tree/_bootstrap-dark-definition.scss +71 -71
  252. package/styles/drop-down-tree/_bootstrap-definition.scss +70 -70
  253. package/styles/drop-down-tree/_bootstrap4-definition.scss +71 -71
  254. package/styles/drop-down-tree/_bootstrap5-definition.scss +59 -59
  255. package/styles/drop-down-tree/_fabric-dark-definition.scss +71 -71
  256. package/styles/drop-down-tree/_fabric-definition.scss +71 -71
  257. package/styles/drop-down-tree/_fluent-definition.scss +65 -65
  258. package/styles/drop-down-tree/_fusionnew-definition.scss +59 -59
  259. package/styles/drop-down-tree/_highcontrast-definition.scss +71 -71
  260. package/styles/drop-down-tree/_highcontrast-light-definition.scss +71 -71
  261. package/styles/drop-down-tree/_layout.scss +1423 -1386
  262. package/styles/drop-down-tree/_material-dark-definition.scss +72 -72
  263. package/styles/drop-down-tree/_material-definition.scss +72 -72
  264. package/styles/drop-down-tree/_material3-dark-definition.scss +1 -0
  265. package/styles/drop-down-tree/_material3-definition.scss +76 -60
  266. package/styles/drop-down-tree/_tailwind-definition.scss +61 -61
  267. package/styles/drop-down-tree/_theme.scss +132 -120
  268. package/styles/drop-down-tree/bootstrap-dark.css +4 -0
  269. package/styles/drop-down-tree/bootstrap-dark.scss +1 -1
  270. package/styles/drop-down-tree/bootstrap.css +4 -0
  271. package/styles/drop-down-tree/bootstrap.scss +1 -1
  272. package/styles/drop-down-tree/bootstrap4.css +4 -8
  273. package/styles/drop-down-tree/bootstrap4.scss +1 -1
  274. package/styles/drop-down-tree/bootstrap5-dark.css +4 -0
  275. package/styles/drop-down-tree/bootstrap5-dark.scss +1 -1
  276. package/styles/drop-down-tree/bootstrap5.css +4 -0
  277. package/styles/drop-down-tree/bootstrap5.scss +1 -1
  278. package/styles/drop-down-tree/fabric-dark.css +4 -0
  279. package/styles/drop-down-tree/fabric-dark.scss +1 -1
  280. package/styles/drop-down-tree/fabric.css +4 -0
  281. package/styles/drop-down-tree/fabric.scss +1 -1
  282. package/styles/drop-down-tree/fluent-dark.css +6 -0
  283. package/styles/drop-down-tree/fluent-dark.scss +1 -1
  284. package/styles/drop-down-tree/fluent.css +6 -0
  285. package/styles/drop-down-tree/fluent.scss +1 -1
  286. package/styles/drop-down-tree/highcontrast-light.css +4 -0
  287. package/styles/drop-down-tree/highcontrast-light.scss +1 -1
  288. package/styles/drop-down-tree/highcontrast.css +4 -0
  289. package/styles/drop-down-tree/highcontrast.scss +1 -1
  290. package/styles/drop-down-tree/icons/_bootstrap-dark.scss +11 -11
  291. package/styles/drop-down-tree/icons/_bootstrap.scss +11 -11
  292. package/styles/drop-down-tree/icons/_bootstrap4.scss +11 -11
  293. package/styles/drop-down-tree/icons/_bootstrap5.scss +11 -11
  294. package/styles/drop-down-tree/icons/_fabric-dark.scss +11 -11
  295. package/styles/drop-down-tree/icons/_fabric.scss +11 -11
  296. package/styles/drop-down-tree/icons/_fluent.scss +11 -11
  297. package/styles/drop-down-tree/icons/_fusionnew.scss +11 -11
  298. package/styles/drop-down-tree/icons/_highcontrast-light.scss +11 -11
  299. package/styles/drop-down-tree/icons/_highcontrast.scss +11 -11
  300. package/styles/drop-down-tree/icons/_material-dark.scss +11 -11
  301. package/styles/drop-down-tree/icons/_material.scss +11 -11
  302. package/styles/drop-down-tree/icons/_material3-dark.scss +1 -0
  303. package/styles/drop-down-tree/icons/_material3.scss +11 -11
  304. package/styles/drop-down-tree/icons/_tailwind-dark.scss +11 -11
  305. package/styles/drop-down-tree/icons/_tailwind.scss +11 -11
  306. package/styles/drop-down-tree/material-dark.css +5 -1
  307. package/styles/drop-down-tree/material-dark.scss +1 -1
  308. package/styles/drop-down-tree/material.css +4 -1
  309. package/styles/drop-down-tree/material.scss +1 -1
  310. package/styles/drop-down-tree/material3-dark.css +469 -0
  311. package/styles/drop-down-tree/material3-dark.scss +10 -0
  312. package/styles/drop-down-tree/material3.css +525 -0
  313. package/styles/drop-down-tree/material3.scss +10 -0
  314. package/styles/drop-down-tree/tailwind-dark.css +4 -1
  315. package/styles/drop-down-tree/tailwind-dark.scss +1 -1
  316. package/styles/drop-down-tree/tailwind.css +4 -1
  317. package/styles/drop-down-tree/tailwind.scss +1 -1
  318. package/styles/fabric-dark.css +310 -139
  319. package/styles/fabric.css +307 -130
  320. package/styles/fluent-dark.css +315 -135
  321. package/styles/fluent.css +315 -135
  322. package/styles/highcontrast-light.css +311 -138
  323. package/styles/highcontrast.css +324 -135
  324. package/styles/list-box/_all.scss +2 -2
  325. package/styles/list-box/_bds-definition.scss +136 -0
  326. package/styles/list-box/_bootstrap-dark-definition.scss +126 -125
  327. package/styles/list-box/_bootstrap-definition.scss +119 -118
  328. package/styles/list-box/_bootstrap4-definition.scss +124 -123
  329. package/styles/list-box/_bootstrap5-definition.scss +120 -121
  330. package/styles/list-box/_fabric-dark-definition.scss +126 -125
  331. package/styles/list-box/_fabric-definition.scss +119 -118
  332. package/styles/list-box/_fluent-definition.scss +120 -121
  333. package/styles/list-box/_fusionnew-definition.scss +111 -114
  334. package/styles/list-box/_highcontrast-definition.scss +119 -118
  335. package/styles/list-box/_highcontrast-light-definition.scss +126 -125
  336. package/styles/list-box/_layout.scss +542 -534
  337. package/styles/list-box/_material-dark-definition.scss +126 -125
  338. package/styles/list-box/_material-definition.scss +119 -118
  339. package/styles/list-box/_material3-dark-definition.scss +1 -0
  340. package/styles/list-box/_material3-definition.scss +119 -120
  341. package/styles/list-box/_tailwind-definition.scss +119 -120
  342. package/styles/list-box/_theme.scss +382 -316
  343. package/styles/list-box/bootstrap-dark.css +276 -113
  344. package/styles/list-box/bootstrap-dark.scss +1 -1
  345. package/styles/list-box/bootstrap.css +278 -114
  346. package/styles/list-box/bootstrap.scss +1 -1
  347. package/styles/list-box/bootstrap4.css +279 -123
  348. package/styles/list-box/bootstrap4.scss +1 -1
  349. package/styles/list-box/bootstrap5-dark.css +277 -114
  350. package/styles/list-box/bootstrap5-dark.scss +1 -1
  351. package/styles/list-box/bootstrap5.css +277 -114
  352. package/styles/list-box/bootstrap5.scss +1 -1
  353. package/styles/list-box/fabric-dark.css +276 -113
  354. package/styles/list-box/fabric-dark.scss +1 -1
  355. package/styles/list-box/fabric.css +278 -114
  356. package/styles/list-box/fabric.scss +1 -1
  357. package/styles/list-box/fluent-dark.css +279 -115
  358. package/styles/list-box/fluent-dark.scss +1 -1
  359. package/styles/list-box/fluent.css +279 -115
  360. package/styles/list-box/fluent.scss +1 -1
  361. package/styles/list-box/highcontrast-light.css +276 -113
  362. package/styles/list-box/highcontrast-light.scss +1 -1
  363. package/styles/list-box/highcontrast.css +278 -114
  364. package/styles/list-box/highcontrast.scss +1 -1
  365. package/styles/list-box/icons/_bootstrap-dark.scss +25 -25
  366. package/styles/list-box/icons/_bootstrap.scss +25 -25
  367. package/styles/list-box/icons/_bootstrap4.scss +25 -25
  368. package/styles/list-box/icons/_bootstrap5.scss +25 -25
  369. package/styles/list-box/icons/_fabric-dark.scss +25 -25
  370. package/styles/list-box/icons/_fabric.scss +25 -25
  371. package/styles/list-box/icons/_fluent.scss +25 -25
  372. package/styles/list-box/icons/_fusionnew.scss +25 -25
  373. package/styles/list-box/icons/_highcontrast-light.scss +25 -25
  374. package/styles/list-box/icons/_highcontrast.scss +25 -25
  375. package/styles/list-box/icons/_material-dark.scss +25 -25
  376. package/styles/list-box/icons/_material.scss +25 -25
  377. package/styles/list-box/icons/_material3-dark.scss +1 -0
  378. package/styles/list-box/icons/_material3.scss +25 -25
  379. package/styles/list-box/icons/_tailwind-dark.scss +25 -25
  380. package/styles/list-box/icons/_tailwind.scss +25 -25
  381. package/styles/list-box/material-dark.css +277 -115
  382. package/styles/list-box/material-dark.scss +1 -1
  383. package/styles/list-box/material.css +279 -116
  384. package/styles/list-box/material.scss +1 -1
  385. package/styles/list-box/material3-dark.css +1010 -0
  386. package/styles/list-box/material3-dark.scss +6 -0
  387. package/styles/list-box/material3.css +1066 -0
  388. package/styles/list-box/material3.scss +6 -0
  389. package/styles/list-box/tailwind-dark.css +279 -116
  390. package/styles/list-box/tailwind-dark.scss +1 -1
  391. package/styles/list-box/tailwind.css +279 -116
  392. package/styles/list-box/tailwind.scss +1 -1
  393. package/styles/material-dark.css +311 -144
  394. package/styles/material.css +311 -135
  395. package/styles/material3-dark.css +4723 -0
  396. package/styles/material3-dark.scss +10 -0
  397. package/styles/material3.css +4779 -0
  398. package/styles/material3.scss +10 -0
  399. package/styles/mention/_all.scss +1 -1
  400. package/styles/mention/_bds-definition.scss +1 -0
  401. package/styles/mention/_bootstrap-dark-definition.scss +3 -3
  402. package/styles/mention/_bootstrap-definition.scss +3 -3
  403. package/styles/mention/_bootstrap4-definition.scss +3 -3
  404. package/styles/mention/_bootstrap5-definition.scss +1 -1
  405. package/styles/mention/_fabric-dark-definition.scss +2 -2
  406. package/styles/mention/_fabric-definition.scss +3 -3
  407. package/styles/mention/_fluent-definition.scss +1 -1
  408. package/styles/mention/_fusionnew-definition.scss +1 -1
  409. package/styles/mention/_highcontrast-definition.scss +3 -3
  410. package/styles/mention/_highcontrast-light-definition.scss +3 -3
  411. package/styles/mention/_layout.scss +6 -6
  412. package/styles/mention/_material-dark-definition.scss +3 -3
  413. package/styles/mention/_material-definition.scss +3 -3
  414. package/styles/mention/_material3-dark-definition.scss +1 -0
  415. package/styles/mention/_material3-definition.scss +1 -1
  416. package/styles/mention/_tailwind-definition.scss +1 -1
  417. package/styles/mention/bootstrap-dark.scss +1 -1
  418. package/styles/mention/bootstrap.scss +1 -1
  419. package/styles/mention/bootstrap4.css +0 -8
  420. package/styles/mention/bootstrap4.scss +1 -1
  421. package/styles/mention/bootstrap5-dark.scss +1 -1
  422. package/styles/mention/bootstrap5.scss +1 -1
  423. package/styles/mention/fabric-dark.scss +1 -1
  424. package/styles/mention/fabric.scss +1 -1
  425. package/styles/mention/fluent-dark.scss +1 -1
  426. package/styles/mention/fluent.scss +1 -1
  427. package/styles/mention/highcontrast-light.scss +1 -1
  428. package/styles/mention/highcontrast.scss +1 -1
  429. package/styles/mention/material-dark.css +0 -1
  430. package/styles/mention/material-dark.scss +1 -1
  431. package/styles/mention/material.css +0 -1
  432. package/styles/mention/material.scss +1 -1
  433. package/styles/mention/material3-dark.css +86 -0
  434. package/styles/mention/material3-dark.scss +7 -0
  435. package/styles/mention/material3.css +142 -0
  436. package/styles/mention/material3.scss +7 -0
  437. package/styles/mention/tailwind-dark.css +0 -1
  438. package/styles/mention/tailwind-dark.scss +1 -1
  439. package/styles/mention/tailwind.css +0 -1
  440. package/styles/mention/tailwind.scss +1 -1
  441. package/styles/multi-select/_all.scss +2 -2
  442. package/styles/multi-select/_bds-definition.scss +235 -0
  443. package/styles/multi-select/_bootstrap-dark-definition.scss +203 -196
  444. package/styles/multi-select/_bootstrap-definition.scss +192 -190
  445. package/styles/multi-select/_bootstrap4-definition.scss +278 -257
  446. package/styles/multi-select/_bootstrap5-definition.scss +230 -227
  447. package/styles/multi-select/_fabric-dark-definition.scss +192 -185
  448. package/styles/multi-select/_fabric-definition.scss +183 -181
  449. package/styles/multi-select/_fluent-definition.scss +241 -238
  450. package/styles/multi-select/_fusionnew-definition.scss +227 -227
  451. package/styles/multi-select/_highcontrast-definition.scss +303 -294
  452. package/styles/multi-select/_highcontrast-light-definition.scss +297 -293
  453. package/styles/multi-select/_layout.scss +2199 -2016
  454. package/styles/multi-select/_material-dark-definition.scss +230 -228
  455. package/styles/multi-select/_material-definition.scss +223 -221
  456. package/styles/multi-select/_material3-dark-definition.scss +1 -0
  457. package/styles/multi-select/_material3-definition.scss +246 -226
  458. package/styles/multi-select/_tailwind-definition.scss +235 -232
  459. package/styles/multi-select/_theme.scss +586 -492
  460. package/styles/multi-select/bootstrap-dark.css +18 -2
  461. package/styles/multi-select/bootstrap-dark.scss +1 -1
  462. package/styles/multi-select/bootstrap.css +13 -2
  463. package/styles/multi-select/bootstrap.scss +1 -1
  464. package/styles/multi-select/bootstrap4.css +32 -10
  465. package/styles/multi-select/bootstrap4.scss +1 -1
  466. package/styles/multi-select/bootstrap5-dark.css +18 -6
  467. package/styles/multi-select/bootstrap5-dark.scss +1 -1
  468. package/styles/multi-select/bootstrap5.css +18 -6
  469. package/styles/multi-select/bootstrap5.scss +1 -1
  470. package/styles/multi-select/fabric-dark.css +19 -3
  471. package/styles/multi-select/fabric-dark.scss +1 -1
  472. package/styles/multi-select/fabric.css +14 -3
  473. package/styles/multi-select/fabric.scss +1 -1
  474. package/styles/multi-select/fluent-dark.css +19 -7
  475. package/styles/multi-select/fluent-dark.scss +1 -1
  476. package/styles/multi-select/fluent.css +19 -7
  477. package/styles/multi-select/fluent.scss +1 -1
  478. package/styles/multi-select/highcontrast-light.css +20 -2
  479. package/styles/multi-select/highcontrast-light.scss +1 -1
  480. package/styles/multi-select/highcontrast.css +31 -8
  481. package/styles/multi-select/highcontrast.scss +1 -1
  482. package/styles/multi-select/icons/_bootstrap-dark.scss +26 -26
  483. package/styles/multi-select/icons/_bootstrap.scss +26 -26
  484. package/styles/multi-select/icons/_bootstrap4.scss +37 -37
  485. package/styles/multi-select/icons/_bootstrap5.scss +26 -26
  486. package/styles/multi-select/icons/_fabric-dark.scss +26 -26
  487. package/styles/multi-select/icons/_fabric.scss +26 -26
  488. package/styles/multi-select/icons/_fluent.scss +55 -55
  489. package/styles/multi-select/icons/_fusionnew.scss +26 -26
  490. package/styles/multi-select/icons/_highcontrast-light.scss +26 -26
  491. package/styles/multi-select/icons/_highcontrast.scss +26 -26
  492. package/styles/multi-select/icons/_material-dark.scss +693 -693
  493. package/styles/multi-select/icons/_material.scss +693 -693
  494. package/styles/multi-select/icons/_material3-dark.scss +1 -0
  495. package/styles/multi-select/icons/_material3.scss +692 -26
  496. package/styles/multi-select/icons/_tailwind.scss +26 -26
  497. package/styles/multi-select/material-dark.css +17 -7
  498. package/styles/multi-select/material-dark.scss +1 -1
  499. package/styles/multi-select/material.css +17 -7
  500. package/styles/multi-select/material.scss +1 -1
  501. package/styles/multi-select/material3-dark.css +2550 -0
  502. package/styles/multi-select/material3-dark.scss +10 -0
  503. package/styles/multi-select/material3.css +2606 -0
  504. package/styles/multi-select/material3.scss +10 -0
  505. package/styles/multi-select/tailwind-dark.css +17 -5
  506. package/styles/multi-select/tailwind-dark.scss +1 -1
  507. package/styles/multi-select/tailwind.css +17 -5
  508. package/styles/multi-select/tailwind.scss +1 -1
  509. package/styles/tailwind-dark.css +312 -141
  510. package/styles/tailwind.css +312 -141
  511. package/.eslintrc.json +0 -259
  512. package/dist/ej2-dropdowns.min.js +0 -10
  513. package/dist/global/ej2-dropdowns.min.js +0 -11
  514. package/dist/global/ej2-dropdowns.min.js.map +0 -1
  515. package/dist/global/index.d.ts +0 -14
  516. package/tslint.json +0 -111
package/styles/fabric.css CHANGED
@@ -68,9 +68,6 @@
68
68
  position: absolute;
69
69
  top: 0;
70
70
  }
71
- .e-rtl .e-dropdownbase .e-fixed-head {
72
- left: 33px;
73
- }
74
71
 
75
72
  .e-dropdownbase.e-content {
76
73
  overflow: auto;
@@ -110,11 +107,6 @@
110
107
  cursor: default;
111
108
  }
112
109
 
113
- .e-mention .e-mention-chip::selection {
114
- color: #fff;
115
- background: #0078d6;
116
- }
117
-
118
110
  .e-mention.e-editable-element {
119
111
  border: 2px solid rgba(234, 234, 234, 0.25);
120
112
  height: auto;
@@ -190,7 +182,6 @@
190
182
  .e-dropdownbase .e-list-item {
191
183
  /* stylelint-disable property-no-vendor-prefix */
192
184
  -webkit-tap-highlight-color: transparent;
193
- background-color: #fff;
194
185
  border-bottom: 1px;
195
186
  border-color: transparent;
196
187
  color: rgba(51, 51, 51, 0.87);
@@ -200,11 +191,11 @@
200
191
  min-height: 36px;
201
192
  padding-right: 16px;
202
193
  text-indent: 10px;
194
+ background-color: #fff;
203
195
  }
204
196
 
205
197
  .e-dropdownbase .e-list-group-item,
206
198
  .e-fixed-head {
207
- background-color: #fff;
208
199
  border-color: transparent;
209
200
  color: #0078d6;
210
201
  font-family: inherit;
@@ -214,6 +205,7 @@
214
205
  min-height: 36px;
215
206
  padding-left: 10px;
216
207
  padding-right: 16px;
208
+ background-color: #fff;
217
209
  }
218
210
 
219
211
  .e-dropdownbase .e-list-item.e-active, .e-dropdownbase .e-list-item.e-active.e-hover {
@@ -375,6 +367,10 @@
375
367
  color: #333;
376
368
  }
377
369
 
370
+ .e-selectall-parent.e-item-focus {
371
+ background-color: #f4f4f4;
372
+ }
373
+
378
374
  /* stylelint-disable property-no-vendor-prefix */
379
375
  /* stylelint-disable property-no-vendor-prefix */
380
376
  @keyframes material-spinner-rotate {
@@ -504,6 +500,11 @@
504
500
  padding: 4px 0;
505
501
  }
506
502
 
503
+ .e-popup.e-ddl-device.e-popup-close {
504
+ display: block;
505
+ visibility: hidden;
506
+ }
507
+
507
508
  .e-popup-full-page {
508
509
  bottom: 0;
509
510
  left: 0;
@@ -516,9 +517,6 @@
516
517
  .e-popup-full-page .e-popup-full-page.e-ddl.e-popup.e-ddl-device-filter {
517
518
  margin: 0;
518
519
  }
519
- .e-popup-full-page .e-popup-full-page.e-ios {
520
- position: fixed;
521
- }
522
520
 
523
521
  .e-ddl.e-control-wrapper .e-ddl-disable-icon {
524
522
  position: relative;
@@ -805,6 +803,10 @@ ejs-dropdownlist {
805
803
  padding-left: 0;
806
804
  padding-right: 0;
807
805
  }
806
+ .e-ddt.e-input-group.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon {
807
+ display: -ms-flexbox;
808
+ display: flex;
809
+ }
808
810
  .e-ddt .e-chips-wrapper {
809
811
  width: 100%;
810
812
  }
@@ -1352,8 +1354,9 @@ ejs-dropdownlist {
1352
1354
  padding: 0 0 0 48px;
1353
1355
  }
1354
1356
 
1355
- .e-bigger .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
1356
- margin-top: -3.2em;
1357
+ .e-bigger .e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon,
1358
+ .e-bigger.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
1359
+ margin-top: -3.15em;
1357
1360
  }
1358
1361
 
1359
1362
  .e-popup.e-multi-select-list-wrapper .e-list-item.e-disabled,
@@ -1462,8 +1465,8 @@ ejs-dropdownlist {
1462
1465
  margin-top: -3em;
1463
1466
  position: absolute;
1464
1467
  right: 0;
1465
- top: 100%;
1466
1468
  width: auto;
1469
+ top: 100%;
1467
1470
  }
1468
1471
 
1469
1472
  .e-multiselect .e-down-icon .e-chips-close.e-close-hooker,
@@ -1899,11 +1902,21 @@ ejs-multiselect {
1899
1902
  margin-top: -3em;
1900
1903
  }
1901
1904
 
1905
+ .e-small.e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
1906
+ .e-small.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
1907
+ margin-top: -2.5em;
1908
+ }
1909
+
1902
1910
  .e-bigger.e-small.e-multi-select-list-wrapper .e-selectall-parent,
1903
1911
  .e-bigger.e-small .e-multi-select-list-wrapper .e-selectall-parent {
1904
1912
  line-height: 40px;
1905
1913
  }
1906
1914
 
1915
+ .e-bigger.e-small.e-multiselect.e-control-container .e-multi-select-wrapper .e-ddl-icon,
1916
+ .e-bigger.e-small.e-multiselect.e-control-container.e-input-group .e-multi-select-wrapper .e-ddl-icon {
1917
+ margin-top: -2.85em;
1918
+ }
1919
+
1907
1920
  .e-bigger.e-small .e-multi-select-wrapper .e-chips-close {
1908
1921
  height: 26px;
1909
1922
  width: auto;
@@ -2415,7 +2428,8 @@ ejs-multiselect {
2415
2428
 
2416
2429
  /* stylelint-disable property-no-vendor-prefix */
2417
2430
  .e-listbox-wrapper,
2418
- .e-listbox-container {
2431
+ .e-listbox-container,
2432
+ .e-listboxtool-wrapper {
2419
2433
  -webkit-overflow-scrolling: touch;
2420
2434
  box-sizing: border-box;
2421
2435
  cursor: pointer;
@@ -2427,24 +2441,29 @@ ejs-multiselect {
2427
2441
  width: 100%;
2428
2442
  }
2429
2443
  .e-listbox-wrapper *,
2430
- .e-listbox-container * {
2444
+ .e-listbox-container *,
2445
+ .e-listboxtool-wrapper * {
2431
2446
  box-sizing: border-box;
2432
2447
  }
2433
2448
  .e-listbox-wrapper.e-listboxtool-container .e-list-wrap,
2434
- .e-listbox-container.e-listboxtool-container .e-list-wrap {
2449
+ .e-listbox-container.e-listboxtool-container .e-list-wrap,
2450
+ .e-listboxtool-wrapper.e-listboxtool-container .e-list-wrap {
2435
2451
  width: 86% !important; /* stylelint-disable-line declaration-no-important */
2436
2452
  }
2437
2453
  .e-listbox-wrapper:focus,
2438
- .e-listbox-container:focus {
2454
+ .e-listbox-container:focus,
2455
+ .e-listboxtool-wrapper:focus {
2439
2456
  outline: none;
2440
2457
  }
2441
2458
  .e-listbox-wrapper.e-disabled,
2442
- .e-listbox-container.e-disabled {
2459
+ .e-listbox-container.e-disabled,
2460
+ .e-listboxtool-wrapper.e-disabled {
2443
2461
  cursor: default;
2444
2462
  pointer-events: none;
2445
2463
  }
2446
2464
  .e-listbox-wrapper:not(.e-list-template) .e-list-nrt,
2447
- .e-listbox-container:not(.e-list-template) .e-list-nrt {
2465
+ .e-listbox-container:not(.e-list-template) .e-list-nrt,
2466
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-nrt {
2448
2467
  text-align: center;
2449
2468
  }
2450
2469
  .e-listbox-wrapper:not(.e-list-template) .e-list-item,
@@ -2452,53 +2471,61 @@ ejs-multiselect {
2452
2471
  .e-listbox-wrapper .e-selectall-parent,
2453
2472
  .e-listbox-container:not(.e-list-template) .e-list-item,
2454
2473
  .e-listbox-container .e-list-nrt,
2455
- .e-listbox-container .e-selectall-parent {
2474
+ .e-listbox-container .e-selectall-parent,
2475
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-item,
2476
+ .e-listboxtool-wrapper .e-list-nrt,
2477
+ .e-listboxtool-wrapper .e-selectall-parent {
2456
2478
  height: 36px;
2457
2479
  line-height: 1;
2458
2480
  padding: 10px 16px;
2459
2481
  position: relative;
2460
2482
  }
2461
- .e-listbox-wrapper.e-filter-list,
2462
- .e-listbox-container.e-filter-list {
2463
- overflow: inherit;
2464
- }
2465
2483
  .e-listbox-wrapper .e-list-parent,
2466
- .e-listbox-container .e-list-parent {
2484
+ .e-listbox-container .e-list-parent,
2485
+ .e-listboxtool-wrapper .e-list-parent {
2467
2486
  height: 100%;
2468
2487
  min-height: 36px;
2469
2488
  }
2470
2489
  .e-listbox-wrapper .e-list-item,
2471
- .e-listbox-container .e-list-item {
2490
+ .e-listbox-container .e-list-item,
2491
+ .e-listboxtool-wrapper .e-list-item {
2472
2492
  border-bottom: 0 solid;
2473
2493
  outline: none;
2474
2494
  }
2475
2495
  .e-listbox-wrapper .e-list-item.e-disabled,
2476
- .e-listbox-container .e-list-item.e-disabled {
2496
+ .e-listbox-container .e-list-item.e-disabled,
2497
+ .e-listboxtool-wrapper .e-list-item.e-disabled {
2477
2498
  pointer-events: none;
2478
2499
  }
2479
2500
  .e-listbox-wrapper .e-disable,
2480
- .e-listbox-container .e-disable {
2501
+ .e-listbox-container .e-disable,
2502
+ .e-listboxtool-wrapper .e-disable {
2481
2503
  opacity: 0.7;
2482
2504
  }
2483
2505
  .e-listbox-wrapper .e-list-parent,
2484
- .e-listbox-container .e-list-parent {
2506
+ .e-listbox-container .e-list-parent,
2507
+ .e-listboxtool-wrapper .e-list-parent {
2485
2508
  margin: 0;
2486
2509
  padding: 0;
2487
2510
  }
2488
2511
  .e-listbox-wrapper .e-list-header .e-text.header,
2489
- .e-listbox-container .e-list-header .e-text.header {
2512
+ .e-listbox-container .e-list-header .e-text.header,
2513
+ .e-listboxtool-wrapper .e-list-header .e-text.header {
2490
2514
  display: none;
2491
2515
  }
2492
2516
  .e-listbox-wrapper .e-icon-back,
2493
- .e-listbox-container .e-icon-back {
2517
+ .e-listbox-container .e-icon-back,
2518
+ .e-listboxtool-wrapper .e-icon-back {
2494
2519
  margin-top: 2px;
2495
2520
  }
2496
2521
  .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
2497
- .e-listbox-container .e-list-header .e-headertemplate-text.nested-header {
2522
+ .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
2523
+ .e-listboxtool-wrapper .e-list-header .e-headertemplate-text.nested-header {
2498
2524
  display: none;
2499
2525
  }
2500
2526
  .e-listbox-wrapper .e-list-header,
2501
- .e-listbox-container .e-list-header {
2527
+ .e-listbox-container .e-list-header,
2528
+ .e-listboxtool-wrapper .e-list-header {
2502
2529
  -ms-flex-align: center;
2503
2530
  align-items: center;
2504
2531
  border-bottom: 1px solid;
@@ -2509,21 +2536,25 @@ ejs-multiselect {
2509
2536
  padding: 0 16px;
2510
2537
  }
2511
2538
  .e-listbox-wrapper .e-has-header > .e-view,
2512
- .e-listbox-container .e-has-header > .e-view {
2539
+ .e-listbox-container .e-has-header > .e-view,
2540
+ .e-listboxtool-wrapper .e-has-header > .e-view {
2513
2541
  top: 45px;
2514
2542
  }
2515
2543
  .e-listbox-wrapper .e-but-back,
2516
- .e-listbox-container .e-but-back {
2544
+ .e-listbox-container .e-but-back,
2545
+ .e-listboxtool-wrapper .e-but-back {
2517
2546
  cursor: pointer;
2518
2547
  padding-right: 20px;
2519
2548
  }
2520
2549
  .e-listbox-wrapper .e-list-group-item:first-child,
2521
- .e-listbox-container .e-list-group-item:first-child {
2550
+ .e-listbox-container .e-list-group-item:first-child,
2551
+ .e-listboxtool-wrapper .e-list-group-item:first-child {
2522
2552
  border: 0;
2523
2553
  border-bottom: 0 solid transparent;
2524
2554
  }
2525
2555
  .e-listbox-wrapper .e-list-group-item,
2526
- .e-listbox-container .e-list-group-item {
2556
+ .e-listbox-container .e-list-group-item,
2557
+ .e-listboxtool-wrapper .e-list-group-item {
2527
2558
  border-bottom: 0 solid transparent;
2528
2559
  border-top: 1px solid;
2529
2560
  font-weight: 600;
@@ -2532,7 +2563,8 @@ ejs-multiselect {
2532
2563
  padding: 10px 16px;
2533
2564
  }
2534
2565
  .e-listbox-wrapper .e-icon-collapsible,
2535
- .e-listbox-container .e-icon-collapsible {
2566
+ .e-listbox-container .e-icon-collapsible,
2567
+ .e-listboxtool-wrapper .e-icon-collapsible {
2536
2568
  cursor: pointer;
2537
2569
  font-size: 12px;
2538
2570
  position: absolute;
@@ -2541,42 +2573,51 @@ ejs-multiselect {
2541
2573
  transform: translateY(-50%);
2542
2574
  }
2543
2575
  .e-listbox-wrapper .e-text-content,
2544
- .e-listbox-container .e-text-content {
2576
+ .e-listbox-container .e-text-content,
2577
+ .e-listboxtool-wrapper .e-text-content {
2545
2578
  height: 100%;
2546
2579
  position: relative;
2547
2580
  vertical-align: middle;
2548
2581
  }
2549
2582
  .e-listbox-wrapper .e-text-content *,
2550
- .e-listbox-container .e-text-content * {
2583
+ .e-listbox-container .e-text-content *,
2584
+ .e-listboxtool-wrapper .e-text-content * {
2551
2585
  display: inline-block;
2552
2586
  vertical-align: middle;
2553
2587
  }
2554
2588
  .e-listbox-wrapper .e-text-content.e-checkbox .e-list-text,
2555
- .e-listbox-container .e-text-content.e-checkbox .e-list-text {
2589
+ .e-listbox-container .e-text-content.e-checkbox .e-list-text,
2590
+ .e-listboxtool-wrapper .e-text-content.e-checkbox .e-list-text {
2556
2591
  width: calc(100% - 40px);
2557
2592
  }
2558
2593
  .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
2559
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
2594
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
2595
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
2560
2596
  width: calc(100% - 90px);
2561
2597
  }
2562
2598
  .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
2563
- .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
2599
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
2600
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
2564
2601
  width: calc(100% - 80px);
2565
2602
  }
2566
2603
  .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,
2567
- .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 {
2604
+ .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,
2605
+ .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 {
2568
2606
  width: calc(100% - 92px);
2569
2607
  }
2570
2608
  .e-listbox-wrapper .e-checkbox .e-checkbox-left,
2571
- .e-listbox-container .e-checkbox .e-checkbox-left {
2609
+ .e-listbox-container .e-checkbox .e-checkbox-left,
2610
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-left {
2572
2611
  margin: -2px 10px 0 0;
2573
2612
  }
2574
2613
  .e-listbox-wrapper .e-checkbox .e-checkbox-right,
2575
- .e-listbox-container .e-checkbox .e-checkbox-right {
2614
+ .e-listbox-container .e-checkbox .e-checkbox-right,
2615
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-right {
2576
2616
  margin: -2px 0 0 10px;
2577
2617
  }
2578
2618
  .e-listbox-wrapper .e-list-text,
2579
- .e-listbox-container .e-list-text {
2619
+ .e-listbox-container .e-list-text,
2620
+ .e-listboxtool-wrapper .e-list-text {
2580
2621
  cursor: pointer;
2581
2622
  display: inline-block;
2582
2623
  overflow: hidden;
@@ -2586,107 +2627,129 @@ ejs-multiselect {
2586
2627
  width: 100%;
2587
2628
  }
2588
2629
  .e-listbox-wrapper .e-list-icon + .e-list-text,
2589
- .e-listbox-container .e-list-icon + .e-list-text {
2630
+ .e-listbox-container .e-list-icon + .e-list-text,
2631
+ .e-listboxtool-wrapper .e-list-icon + .e-list-text {
2590
2632
  width: calc(100% - 60px);
2591
2633
  }
2592
2634
  .e-listbox-wrapper .e-icon-wrapper .e-list-text,
2593
- .e-listbox-container .e-icon-wrapper .e-list-text {
2635
+ .e-listbox-container .e-icon-wrapper .e-list-text,
2636
+ .e-listboxtool-wrapper .e-icon-wrapper .e-list-text {
2594
2637
  width: calc(100% - 60px);
2595
2638
  }
2596
2639
  .e-listbox-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
2597
- .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
2640
+ .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
2641
+ .e-listboxtool-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
2598
2642
  width: calc(100% - 60px);
2599
2643
  }
2600
2644
  .e-listbox-wrapper .e-list-icon,
2601
- .e-listbox-container .e-list-icon {
2645
+ .e-listbox-container .e-list-icon,
2646
+ .e-listboxtool-wrapper .e-list-icon {
2602
2647
  height: 30px;
2603
2648
  margin-right: 16px;
2604
2649
  width: 30px;
2605
2650
  }
2606
2651
  .e-listbox-wrapper .e-content,
2607
- .e-listbox-container .e-content {
2652
+ .e-listbox-container .e-content,
2653
+ .e-listboxtool-wrapper .e-content {
2608
2654
  overflow: hidden;
2609
2655
  position: relative;
2610
2656
  }
2611
2657
  .e-listbox-wrapper .e-list-header .e-text,
2612
- .e-listbox-container .e-list-header .e-text {
2658
+ .e-listbox-container .e-list-header .e-text,
2659
+ .e-listboxtool-wrapper .e-list-header .e-text {
2613
2660
  cursor: pointer;
2614
2661
  text-indent: 0;
2615
2662
  }
2616
2663
  .e-listbox-wrapper .e-text .e-headertext,
2617
- .e-listbox-container .e-text .e-headertext {
2664
+ .e-listbox-container .e-text .e-headertext,
2665
+ .e-listboxtool-wrapper .e-text .e-headertext {
2618
2666
  display: inline-block;
2619
2667
  line-height: 21px;
2620
2668
  }
2621
2669
  .e-listbox-wrapper.e-rtl,
2622
- .e-listbox-container.e-rtl {
2670
+ .e-listbox-container.e-rtl,
2671
+ .e-listboxtool-wrapper.e-rtl {
2623
2672
  direction: rtl;
2624
2673
  }
2625
2674
  .e-listbox-wrapper.e-rtl .e-list-icon,
2626
- .e-listbox-container.e-rtl .e-list-icon {
2675
+ .e-listbox-container.e-rtl .e-list-icon,
2676
+ .e-listboxtool-wrapper.e-rtl .e-list-icon {
2627
2677
  margin-left: 16px;
2628
2678
  margin-right: 0;
2629
2679
  }
2630
2680
  .e-listbox-wrapper.e-rtl .e-icon-collapsible,
2631
- .e-listbox-container.e-rtl .e-icon-collapsible {
2681
+ .e-listbox-container.e-rtl .e-icon-collapsible,
2682
+ .e-listboxtool-wrapper.e-rtl .e-icon-collapsible {
2632
2683
  left: 0%;
2633
2684
  right: initial;
2634
2685
  top: 50%;
2635
2686
  transform: translateY(-50%) rotate(180deg);
2636
2687
  }
2637
2688
  .e-listbox-wrapper.e-rtl .e-list-header .e-text,
2638
- .e-listbox-container.e-rtl .e-list-header .e-text {
2689
+ .e-listbox-container.e-rtl .e-list-header .e-text,
2690
+ .e-listboxtool-wrapper.e-rtl .e-list-header .e-text {
2639
2691
  cursor: pointer;
2640
2692
  }
2641
2693
  .e-listbox-wrapper.e-rtl .e-but-back,
2642
- .e-listbox-container.e-rtl .e-but-back {
2694
+ .e-listbox-container.e-rtl .e-but-back,
2695
+ .e-listboxtool-wrapper.e-rtl .e-but-back {
2643
2696
  transform: rotate(180deg);
2644
2697
  }
2645
2698
  .e-listbox-wrapper.e-rtl .e-icon-back,
2646
- .e-listbox-container.e-rtl .e-icon-back {
2699
+ .e-listbox-container.e-rtl .e-icon-back,
2700
+ .e-listboxtool-wrapper.e-rtl .e-icon-back {
2647
2701
  margin-top: 1px;
2648
2702
  }
2649
2703
  .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-left,
2650
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left {
2704
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left,
2705
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-left {
2651
2706
  margin: -2px 0 0 10px;
2652
2707
  }
2653
2708
  .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-right,
2654
- .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right {
2709
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right,
2710
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-right {
2655
2711
  margin: -2px 10px 0 0;
2656
2712
  }
2657
2713
  .e-listbox-wrapper.e-rtl .e-checkbox-wrapper,
2658
- .e-listbox-container.e-rtl .e-checkbox-wrapper {
2714
+ .e-listbox-container.e-rtl .e-checkbox-wrapper,
2715
+ .e-listboxtool-wrapper.e-rtl .e-checkbox-wrapper {
2659
2716
  margin: -2px 0 0 10px;
2660
2717
  }
2661
2718
  .e-listbox-wrapper .e-checkbox-wrapper,
2662
- .e-listbox-container .e-checkbox-wrapper {
2719
+ .e-listbox-container .e-checkbox-wrapper,
2720
+ .e-listboxtool-wrapper .e-checkbox-wrapper {
2663
2721
  margin: -2px 10px 0 0;
2664
2722
  text-indent: 0;
2665
2723
  vertical-align: middle;
2666
2724
  }
2667
2725
  .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
2668
- .e-listbox-container.e-checkbox-right .e-checkbox-wrapper {
2726
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper,
2727
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper {
2669
2728
  position: absolute;
2670
2729
  right: 0;
2671
2730
  top: 30%;
2672
2731
  }
2673
2732
  .e-listbox-wrapper .e-input-group,
2674
- .e-listbox-container .e-input-group {
2733
+ .e-listbox-container .e-input-group,
2734
+ .e-listboxtool-wrapper .e-input-group {
2675
2735
  padding: 4px 8px;
2676
2736
  }
2677
2737
  .e-listbox-wrapper .e-input-focus,
2678
- .e-listbox-container .e-input-focus {
2738
+ .e-listbox-container .e-input-focus,
2739
+ .e-listboxtool-wrapper .e-input-focus {
2679
2740
  padding: 4px 4px 4px 8px;
2680
2741
  }
2681
2742
  .e-listbox-wrapper .e-hidden-select,
2682
- .e-listbox-container .e-hidden-select {
2743
+ .e-listbox-container .e-hidden-select,
2744
+ .e-listboxtool-wrapper .e-hidden-select {
2683
2745
  height: 1px;
2684
2746
  opacity: 0;
2685
2747
  position: absolute;
2686
2748
  width: 100%;
2687
2749
  }
2688
2750
  .e-listbox-wrapper .e-placeholder,
2689
- .e-listbox-container .e-placeholder {
2751
+ .e-listbox-container .e-placeholder,
2752
+ .e-listboxtool-wrapper .e-placeholder {
2690
2753
  background-color: #0078d6;
2691
2754
  display: block;
2692
2755
  height: 1px;
@@ -2700,32 +2763,34 @@ ejs-listbox {
2700
2763
  overflow: auto;
2701
2764
  }
2702
2765
 
2703
- .e-listbox-wrapper.e-filter-list {
2704
- overflow: inherit;
2705
- }
2706
2766
  .e-listbox-wrapper.e-filter-list .e-list-parent {
2707
2767
  overflow: auto;
2708
2768
  }
2709
2769
 
2710
2770
  .e-listbox-wrapper.e-sortableclone,
2711
- .e-listbox-container.e-sortableclone {
2771
+ .e-listbox-container.e-sortableclone,
2772
+ .e-listboxtool-wrapper.e-sortableclone {
2712
2773
  border-width: 0;
2713
2774
  overflow: visible;
2714
2775
  }
2715
2776
  .e-listbox-wrapper.e-sortableclone .e-list-item,
2716
- .e-listbox-container.e-sortableclone .e-list-item {
2777
+ .e-listbox-container.e-sortableclone .e-list-item,
2778
+ .e-listboxtool-wrapper.e-sortableclone .e-list-item {
2717
2779
  list-style-type: none;
2718
2780
  }
2719
2781
  .e-listbox-wrapper.e-sortableclone .e-ripple,
2720
- .e-listbox-container.e-sortableclone .e-ripple {
2782
+ .e-listbox-container.e-sortableclone .e-ripple,
2783
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple {
2721
2784
  overflow: visible;
2722
2785
  }
2723
2786
  .e-listbox-wrapper.e-sortableclone .e-ripple .e-ripple-element,
2724
- .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element {
2787
+ .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element,
2788
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple .e-ripple-element {
2725
2789
  display: none;
2726
2790
  }
2727
2791
  .e-listbox-wrapper.e-sortableclone .e-list-badge,
2728
- .e-listbox-container.e-sortableclone .e-list-badge {
2792
+ .e-listbox-container.e-sortableclone .e-list-badge,
2793
+ .e-listboxtool-wrapper.e-sortableclone .e-list-badge {
2729
2794
  -ms-flex-align: center;
2730
2795
  align-items: center;
2731
2796
  background-color: #0078d6;
@@ -2744,6 +2809,10 @@ ejs-listbox {
2744
2809
  width: 22px;
2745
2810
  }
2746
2811
 
2812
+ .e-listboxtool-wrapper.e-sortableclone {
2813
+ display: block;
2814
+ }
2815
+
2747
2816
  .e-listboxtool-wrapper,
2748
2817
  .e-listboxtool-container {
2749
2818
  cursor: pointer;
@@ -2895,27 +2964,66 @@ ejs-listbox {
2895
2964
  }
2896
2965
  .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
2897
2966
  .e-small .e-listbox-container.e-filter-list .e-list-parent {
2898
- height: calc(100% - 45px);
2967
+ height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
2968
+ }
2969
+
2970
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
2971
+ height: calc(100% - 59px) !important; /* stylelint-disable-line declaration-no-important */
2972
+ }
2973
+
2974
+ .e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
2975
+ height: calc(100% - 58px) !important; /* stylelint-disable-line declaration-no-important */
2899
2976
  }
2900
2977
 
2901
- .e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
2902
2978
  .e-bigger .e-listbox-container.e-filter-list .e-list-parent {
2903
- height: calc(100% - 59px);
2979
+ height: 100%;
2904
2980
  }
2905
2981
 
2906
2982
  .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
2907
2983
  .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
2908
- height: calc(100% - 104px);
2984
+ height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
2985
+ }
2986
+
2987
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
2988
+ height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
2989
+ }
2990
+
2991
+ .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
2992
+ height: calc(100% - 51px) !important; /* stylelint-disable-line declaration-no-important */
2993
+ }
2994
+
2995
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-list-parent {
2996
+ height: calc(100% - 59px) !important; /* stylelint-disable-line declaration-no-important */
2997
+ }
2998
+
2999
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
3000
+ height: 100%;
2909
3001
  }
2910
3002
 
2911
3003
  .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
3004
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-wrap {
3005
+ height: calc(100% - 45px) !important; /* stylelint-disable-line declaration-no-important */
3006
+ }
3007
+
2912
3008
  .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
2913
- height: calc(100% - 45px);
3009
+ height: 100%;
2914
3010
  }
2915
3011
 
2916
3012
  .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
3013
+ .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-wrap {
3014
+ height: calc(100% - 55px) !important; /* stylelint-disable-line declaration-no-important */
3015
+ }
3016
+
3017
+ .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-selectall-parent + .e-hidden-select + .e-listbox + .e-list-parent {
3018
+ height: calc(100% - 87px) !important; /* stylelint-disable-line declaration-no-important */
3019
+ }
3020
+
3021
+ .e-bigger .e-listbox-wrapper.e-filter-list:not(.e-listbox-container) .e-selectall-parent + .e-hidden-select + .e-listbox + .e-list-parent {
3022
+ height: calc(100% - 104px) !important; /* stylelint-disable-line declaration-no-important */
3023
+ }
3024
+
2917
3025
  .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
2918
- height: calc(100% - 55px);
3026
+ height: 100%;
2919
3027
  }
2920
3028
 
2921
3029
  .e-listbox-wrapper,
@@ -2925,12 +3033,14 @@ ejs-listbox {
2925
3033
  }
2926
3034
 
2927
3035
  .e-listbox-wrapper,
2928
- .e-listbox-container {
3036
+ .e-listbox-container,
3037
+ .e-listboxtool-wrapper {
2929
3038
  font-family: "Segoe UI", "GeezaPro", "DejaVu Serif", sans-serif, "-apple-system", "BlinkMacSystemFont";
2930
3039
  font-size: 13px;
2931
3040
  }
2932
3041
  .e-listbox-wrapper .e-list-header,
2933
- .e-listbox-container .e-list-header {
3042
+ .e-listbox-container .e-list-header,
3043
+ .e-listboxtool-wrapper .e-list-header {
2934
3044
  background-color: #fff;
2935
3045
  border-color: #eaeaea;
2936
3046
  color: #333;
@@ -2938,27 +3048,32 @@ ejs-listbox {
2938
3048
  }
2939
3049
 
2940
3050
  .e-listbox-wrapper.e-filter-list .e-list-parent,
2941
- .e-listbox-container.e-filter-list .e-list-parent {
3051
+ .e-listbox-container.e-filter-list .e-list-parent,
3052
+ .e-listboxtool-wrapper.e-filter-list .e-list-parent {
2942
3053
  height: calc(100% - 51px);
2943
3054
  }
2944
3055
 
2945
3056
  .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
2946
- .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
2947
- height: calc(100% - 87px);
3057
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent,
3058
+ .e-listboxtool-wrapper.e-filter-list .e-selectall-parent + .e-list-parent {
3059
+ height: calc(100% - 36px) !important; /* stylelint-disable-line declaration-no-important */
2948
3060
  }
2949
3061
 
2950
3062
  .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
2951
- .e-listbox-container .e-selectall-parent + .e-list-parent {
2952
- height: calc(100% - 36px);
3063
+ .e-listbox-container .e-selectall-parent + .e-list-parent,
3064
+ .e-listboxtool-wrapper .e-selectall-parent + .e-list-parent {
3065
+ height: calc(100% - 36px) !important; /* stylelint-disable-line declaration-no-important */
2953
3066
  }
2954
3067
 
2955
3068
  .e-listbox-wrapper .e-icons,
2956
- .e-listbox-container .e-icons {
3069
+ .e-listbox-container .e-icons,
3070
+ .e-listboxtool-wrapper .e-icons {
2957
3071
  color: #333;
2958
3072
  }
2959
3073
 
2960
3074
  .e-listbox-wrapper .e-list-item,
2961
- .e-listbox-container .e-list-item {
3075
+ .e-listbox-container .e-list-item,
3076
+ .e-listboxtool-wrapper .e-list-item {
2962
3077
  background-color: inherit;
2963
3078
  border-bottom: 0 solid transparent;
2964
3079
  border-left: 0 solid transparent;
@@ -2969,41 +3084,50 @@ ejs-listbox {
2969
3084
 
2970
3085
  .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),
2971
3086
  .e-listbox-container .e-list-item:hover:not(.e-selected):not(.e-disabled),
2972
- .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
3087
+ .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
3088
+ .e-listboxtool-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
3089
+ .e-listboxtool-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
2973
3090
  background-color: #eaeaea;
2974
3091
  border-color: transparent;
2975
3092
  color: #333;
2976
3093
  }
2977
3094
 
2978
3095
  .e-listbox-wrapper .e-list-item.e-selected,
2979
- .e-listbox-container .e-list-item.e-selected {
3096
+ .e-listbox-container .e-list-item.e-selected,
3097
+ .e-listboxtool-wrapper .e-list-item.e-selected {
2980
3098
  background-color: #d1ebff;
2981
3099
  color: #333;
2982
3100
  }
2983
3101
 
2984
3102
  .e-listbox-wrapper .e-list-item.e-selected.e-checklist,
2985
- .e-listbox-container .e-list-item.e-selected.e-checklist {
3103
+ .e-listbox-container .e-list-item.e-selected.e-checklist,
3104
+ .e-listboxtool-wrapper .e-list-item.e-selected.e-checklist {
2986
3105
  background-color: inherit;
2987
3106
  color: #333;
2988
3107
  }
2989
3108
 
2990
3109
  .e-listbox-wrapper .e-list-item.e-focused, .e-listbox-wrapper .e-list-item.e-focused.e-selected.e-checklist,
2991
3110
  .e-listbox-container .e-list-item.e-focused,
2992
- .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist {
3111
+ .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist,
3112
+ .e-listboxtool-wrapper .e-list-item.e-focused,
3113
+ .e-listboxtool-wrapper .e-list-item.e-focused.e-selected.e-checklist {
2993
3114
  background-color: #d1ebff;
2994
3115
  color: #333;
2995
3116
  }
2996
3117
 
2997
3118
  .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,
2998
3119
  .e-listbox-container .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
2999
- .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
3120
+ .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
3121
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
3122
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
3000
3123
  background-color: #0078d6;
3001
3124
  border-color: #0078d6;
3002
3125
  color: #fff;
3003
3126
  }
3004
3127
 
3005
3128
  .e-listbox-wrapper .e-list-group-item,
3006
- .e-listbox-container .e-list-group-item {
3129
+ .e-listbox-container .e-list-group-item,
3130
+ .e-listboxtool-wrapper .e-list-group-item {
3007
3131
  background-color: #fff;
3008
3132
  border-color: #eaeaea;
3009
3133
  color: #0078d6;
@@ -3011,32 +3135,38 @@ ejs-listbox {
3011
3135
  }
3012
3136
 
3013
3137
  .e-listbox-wrapper .e-selectall-parent,
3014
- .e-listbox-container .e-selectall-parent {
3138
+ .e-listbox-container .e-selectall-parent,
3139
+ .e-listboxtool-wrapper .e-selectall-parent {
3015
3140
  background-color: inherit;
3016
3141
  border-bottom: 1px solid #eaeaea;
3017
3142
  color: #333;
3018
3143
  }
3019
3144
 
3020
3145
  .e-listbox-wrapper .e-sortableclone.e-ripple .e-ripple-element,
3021
- .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element {
3146
+ .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element,
3147
+ .e-listboxtool-wrapper .e-sortableclone.e-ripple .e-ripple-element {
3022
3148
  background-color: transparent;
3023
3149
  }
3024
3150
 
3025
3151
  .e-listbox-wrapper.e-list-template .e-list-wrapper,
3026
- .e-listbox-container.e-list-template .e-list-wrapper {
3152
+ .e-listbox-container.e-list-template .e-list-wrapper,
3153
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper {
3027
3154
  height: inherit;
3028
3155
  position: relative;
3029
3156
  }
3030
3157
  .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line),
3031
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
3158
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line),
3159
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
3032
3160
  padding: 0.6153em 0.923em;
3033
3161
  }
3034
3162
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line,
3035
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line {
3163
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line,
3164
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line {
3036
3165
  padding: 0.6153em 0.923em;
3037
3166
  }
3038
3167
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
3039
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
3168
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
3169
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
3040
3170
  color: #333;
3041
3171
  display: block;
3042
3172
  font-size: 13px;
@@ -3048,7 +3178,8 @@ ejs-listbox {
3048
3178
  white-space: nowrap;
3049
3179
  }
3050
3180
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
3051
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
3181
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
3182
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
3052
3183
  color: #666;
3053
3184
  display: block;
3054
3185
  font-size: 13px;
@@ -3057,13 +3188,15 @@ ejs-listbox {
3057
3188
  word-wrap: break-word;
3058
3189
  }
3059
3190
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
3060
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
3191
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
3192
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
3061
3193
  overflow: hidden;
3062
3194
  text-overflow: ellipsis;
3063
3195
  white-space: nowrap;
3064
3196
  }
3065
3197
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3066
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3198
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3199
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3067
3200
  height: 3.0769em;
3068
3201
  left: 0.923em;
3069
3202
  position: absolute;
@@ -3071,17 +3204,20 @@ ejs-listbox {
3071
3204
  width: 3.0769em;
3072
3205
  }
3073
3206
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3074
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3207
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3208
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3075
3209
  padding-left: 4.923em;
3076
3210
  padding-right: 0.923em;
3077
3211
  }
3078
3212
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3079
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3213
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3214
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3080
3215
  padding-left: 0.923em;
3081
3216
  padding-right: 4.923em;
3082
3217
  }
3083
3218
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3084
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3219
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3220
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3085
3221
  height: 3.0769em;
3086
3222
  position: absolute;
3087
3223
  right: 0.923em;
@@ -3089,15 +3225,18 @@ ejs-listbox {
3089
3225
  width: 3.0769em;
3090
3226
  }
3091
3227
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
3092
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
3228
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
3229
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
3093
3230
  top: 0.6153em;
3094
3231
  }
3095
3232
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3096
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3233
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3234
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3097
3235
  top: 0.6153em;
3098
3236
  }
3099
3237
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3100
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3238
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3239
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3101
3240
  font-size: 13px;
3102
3241
  height: 1.5384em;
3103
3242
  line-height: 1.3384em;
@@ -3109,17 +3248,20 @@ ejs-listbox {
3109
3248
  width: 1.5384em;
3110
3249
  }
3111
3250
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3112
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3251
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3252
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3113
3253
  padding-left: 4.923em;
3114
3254
  padding-right: 3.3846em;
3115
3255
  }
3116
3256
  .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3117
- .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3257
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3258
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3118
3259
  padding-left: 0.923em;
3119
3260
  padding-right: 3.3846em;
3120
3261
  }
3121
3262
  .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
3122
- .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
3263
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
3264
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
3123
3265
  display: block;
3124
3266
  margin: 0;
3125
3267
  overflow: hidden;
@@ -3128,57 +3270,92 @@ ejs-listbox {
3128
3270
  white-space: nowrap;
3129
3271
  }
3130
3272
  .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
3131
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
3273
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
3274
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
3132
3275
  color: #333;
3133
3276
  }
3134
3277
  .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content,
3135
- .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content {
3278
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content,
3279
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content {
3136
3280
  color: #333;
3137
3281
  }
3138
3282
  .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header,
3139
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header {
3283
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header,
3284
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header {
3140
3285
  color: #333;
3141
3286
  }
3142
3287
  .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-content,
3143
- .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content {
3288
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content,
3289
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-content {
3144
3290
  color: #333;
3145
3291
  }
3146
3292
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3147
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3293
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
3294
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
3148
3295
  left: inherit;
3149
3296
  right: 0.923em;
3150
3297
  }
3151
3298
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3152
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3299
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
3300
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
3153
3301
  padding-left: 0.923em;
3154
3302
  padding-right: 4.923em;
3155
3303
  }
3156
3304
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3157
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3305
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
3306
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
3158
3307
  padding-left: 4.923em;
3159
3308
  padding-right: 0.923em;
3160
3309
  }
3161
3310
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3162
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3311
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
3312
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
3163
3313
  left: 0.923em;
3164
3314
  right: inherit;
3165
3315
  }
3166
3316
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3167
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3317
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
3318
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
3168
3319
  left: 0.923em;
3169
3320
  right: inherit;
3170
3321
  }
3171
3322
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3172
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3323
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
3324
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
3173
3325
  padding-left: 3.3846em;
3174
3326
  padding-right: 4.923em;
3175
3327
  }
3176
3328
  .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3177
- .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3329
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
3330
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
3178
3331
  padding-left: 3.3846em;
3179
3332
  padding-right: 0.923em;
3180
3333
  }
3181
3334
 
3335
+ .e-listbox-container.e-filter-list .e-list-parent {
3336
+ height: 100%;
3337
+ }
3338
+
3339
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
3340
+ height: 100%;
3341
+ }
3342
+
3343
+ .e-listbox-container .e-selectall-parent + .e-list-parent {
3344
+ height: 100%;
3345
+ }
3346
+
3347
+ .e-listbox-container.e-filter-list .e-list-wrap {
3348
+ height: calc(100% - 50px) !important; /* stylelint-disable-line declaration-no-important */
3349
+ }
3350
+
3351
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-wrap {
3352
+ height: calc(100% - 36px) !important; /* stylelint-disable-line declaration-no-important */
3353
+ }
3354
+
3355
+ .e-listbox-container .e-selectall-parent + .e-list-wrap {
3356
+ height: calc(100% - 36px) !important; /* stylelint-disable-line declaration-no-important */
3357
+ }
3358
+
3182
3359
  /* stylelint-disable property-no-vendor-prefix */
3183
3360
  @keyframes material-spinner-rotate {
3184
3361
  0% {