@syncfusion/ej2-dropdowns 32.1.24 → 32.2.3

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 (268) hide show
  1. package/.eslintrc.json +263 -0
  2. package/aceconfig.js +17 -0
  3. package/dist/ej2-dropdowns.min.js +2 -2
  4. package/dist/ej2-dropdowns.umd.min.js +2 -2
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +14 -6
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +14 -6
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +2 -2
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  12. package/dist/global/index.d.ts +1 -1
  13. package/package.json +8 -8
  14. package/src/drop-down-list/drop-down-list.js +1 -1
  15. package/src/multi-select/multi-select.js +13 -5
  16. package/styles/bds-lite.css +898 -898
  17. package/styles/bds.css +1302 -1302
  18. package/styles/bootstrap-dark-lite.css +870 -870
  19. package/styles/bootstrap-dark.css +1275 -1275
  20. package/styles/bootstrap-lite.css +867 -867
  21. package/styles/bootstrap.css +1278 -1278
  22. package/styles/bootstrap4-lite.css +1408 -1408
  23. package/styles/bootstrap4.css +1721 -1721
  24. package/styles/bootstrap5-dark-lite.css +1769 -1769
  25. package/styles/bootstrap5-dark.css +1710 -1710
  26. package/styles/bootstrap5-lite.css +1396 -1396
  27. package/styles/bootstrap5.3-lite.css +1138 -1138
  28. package/styles/bootstrap5.3.css +1592 -1592
  29. package/styles/bootstrap5.css +1711 -1711
  30. package/styles/drop-down-base/_all.bds.scss +1 -1
  31. package/styles/drop-down-base/_all.bootstrap-dark.scss +1 -1
  32. package/styles/drop-down-base/_all.bootstrap.scss +1 -1
  33. package/styles/drop-down-base/_all.bootstrap4.scss +1 -1
  34. package/styles/drop-down-base/_all.bootstrap5-dark.scss +1 -1
  35. package/styles/drop-down-base/_all.bootstrap5.3.scss +1 -1
  36. package/styles/drop-down-base/_all.bootstrap5.scss +1 -1
  37. package/styles/drop-down-base/_all.fabric-dark.scss +1 -1
  38. package/styles/drop-down-base/_all.fabric.scss +1 -1
  39. package/styles/drop-down-base/_all.fluent-dark.scss +1 -1
  40. package/styles/drop-down-base/_all.fluent.scss +1 -1
  41. package/styles/drop-down-base/_all.fluent2.scss +1 -1
  42. package/styles/drop-down-base/_all.highcontrast-light.scss +1 -1
  43. package/styles/drop-down-base/_all.highcontrast.scss +1 -1
  44. package/styles/drop-down-base/_all.material-dark.scss +1 -1
  45. package/styles/drop-down-base/_all.material.scss +1 -1
  46. package/styles/drop-down-base/_all.material3-dark.scss +1 -1
  47. package/styles/drop-down-base/_all.material3.scss +1 -1
  48. package/styles/drop-down-base/_all.tailwind-dark.scss +1 -1
  49. package/styles/drop-down-base/_all.tailwind.scss +1 -1
  50. package/styles/drop-down-base/_all.tailwind3.scss +1 -1
  51. package/styles/drop-down-base/bds.css +164 -164
  52. package/styles/drop-down-base/bootstrap-dark.css +130 -130
  53. package/styles/drop-down-base/bootstrap.css +130 -130
  54. package/styles/drop-down-base/bootstrap4.css +136 -136
  55. package/styles/drop-down-base/bootstrap5-dark.css +143 -143
  56. package/styles/drop-down-base/bootstrap5.3.css +219 -219
  57. package/styles/drop-down-base/bootstrap5.css +143 -143
  58. package/styles/drop-down-base/fabric-dark.css +130 -130
  59. package/styles/drop-down-base/fabric.css +130 -130
  60. package/styles/drop-down-base/fluent-dark.css +148 -148
  61. package/styles/drop-down-base/fluent.css +148 -148
  62. package/styles/drop-down-base/fluent2.css +215 -215
  63. package/styles/drop-down-base/highcontrast-light.css +146 -146
  64. package/styles/drop-down-base/highcontrast.css +146 -146
  65. package/styles/drop-down-base/material-dark.css +130 -130
  66. package/styles/drop-down-base/material.css +130 -130
  67. package/styles/drop-down-base/material3-dark.css +212 -212
  68. package/styles/drop-down-base/material3.css +214 -214
  69. package/styles/drop-down-base/tailwind-dark.css +155 -155
  70. package/styles/drop-down-base/tailwind.css +155 -155
  71. package/styles/drop-down-base/tailwind3.css +215 -215
  72. package/styles/drop-down-list/_all.bds.scss +1 -1
  73. package/styles/drop-down-list/_all.bootstrap-dark.scss +1 -1
  74. package/styles/drop-down-list/_all.bootstrap.scss +1 -1
  75. package/styles/drop-down-list/_all.bootstrap4.scss +1 -1
  76. package/styles/drop-down-list/_all.bootstrap5-dark.scss +1 -1
  77. package/styles/drop-down-list/_all.bootstrap5.3.scss +1 -1
  78. package/styles/drop-down-list/_all.bootstrap5.scss +1 -1
  79. package/styles/drop-down-list/_all.fabric-dark.scss +1 -1
  80. package/styles/drop-down-list/_all.fabric.scss +1 -1
  81. package/styles/drop-down-list/_all.fluent-dark.scss +1 -1
  82. package/styles/drop-down-list/_all.fluent.scss +1 -1
  83. package/styles/drop-down-list/_all.fluent2.scss +1 -1
  84. package/styles/drop-down-list/_all.highcontrast-light.scss +1 -1
  85. package/styles/drop-down-list/_all.highcontrast.scss +1 -1
  86. package/styles/drop-down-list/_all.material-dark.scss +1 -1
  87. package/styles/drop-down-list/_all.material.scss +1 -1
  88. package/styles/drop-down-list/_all.material3-dark.scss +1 -1
  89. package/styles/drop-down-list/_all.material3.scss +1 -1
  90. package/styles/drop-down-list/_all.tailwind-dark.scss +1 -1
  91. package/styles/drop-down-list/_all.tailwind.scss +1 -1
  92. package/styles/drop-down-list/_all.tailwind3.scss +1 -1
  93. package/styles/drop-down-list/bds.css +87 -87
  94. package/styles/drop-down-list/bootstrap-dark.css +74 -74
  95. package/styles/drop-down-list/bootstrap.css +74 -74
  96. package/styles/drop-down-list/bootstrap4.css +111 -111
  97. package/styles/drop-down-list/bootstrap5-dark.css +113 -113
  98. package/styles/drop-down-list/bootstrap5.3.css +197 -197
  99. package/styles/drop-down-list/bootstrap5.css +113 -113
  100. package/styles/drop-down-list/fabric-dark.css +48 -48
  101. package/styles/drop-down-list/fabric.css +48 -48
  102. package/styles/drop-down-list/fluent-dark.css +105 -105
  103. package/styles/drop-down-list/fluent.css +105 -105
  104. package/styles/drop-down-list/fluent2.css +204 -204
  105. package/styles/drop-down-list/highcontrast-light.css +63 -63
  106. package/styles/drop-down-list/highcontrast.css +64 -64
  107. package/styles/drop-down-list/material-dark.css +96 -96
  108. package/styles/drop-down-list/material.css +100 -100
  109. package/styles/drop-down-list/material3-dark.css +235 -235
  110. package/styles/drop-down-list/material3.css +235 -235
  111. package/styles/drop-down-list/tailwind-dark.css +83 -83
  112. package/styles/drop-down-list/tailwind.css +83 -83
  113. package/styles/drop-down-list/tailwind3.css +186 -186
  114. package/styles/drop-down-tree/_all.bds.scss +1 -1
  115. package/styles/drop-down-tree/_all.bootstrap-dark.scss +1 -1
  116. package/styles/drop-down-tree/_all.bootstrap.scss +1 -1
  117. package/styles/drop-down-tree/_all.bootstrap4.scss +1 -1
  118. package/styles/drop-down-tree/_all.bootstrap5-dark.scss +1 -1
  119. package/styles/drop-down-tree/_all.bootstrap5.3.scss +1 -1
  120. package/styles/drop-down-tree/_all.bootstrap5.scss +1 -1
  121. package/styles/drop-down-tree/_all.fabric-dark.scss +1 -1
  122. package/styles/drop-down-tree/_all.fabric.scss +1 -1
  123. package/styles/drop-down-tree/_all.fluent-dark.scss +1 -1
  124. package/styles/drop-down-tree/_all.fluent.scss +1 -1
  125. package/styles/drop-down-tree/_all.fluent2.scss +1 -1
  126. package/styles/drop-down-tree/_all.highcontrast-light.scss +1 -1
  127. package/styles/drop-down-tree/_all.highcontrast.scss +1 -1
  128. package/styles/drop-down-tree/_all.material-dark.scss +1 -1
  129. package/styles/drop-down-tree/_all.material.scss +1 -1
  130. package/styles/drop-down-tree/_all.material3-dark.scss +1 -1
  131. package/styles/drop-down-tree/_all.material3.scss +1 -1
  132. package/styles/drop-down-tree/_all.tailwind-dark.scss +1 -1
  133. package/styles/drop-down-tree/_all.tailwind.scss +1 -1
  134. package/styles/drop-down-tree/_all.tailwind3.scss +1 -1
  135. package/styles/drop-down-tree/bds.css +56 -56
  136. package/styles/drop-down-tree/bootstrap-dark.css +33 -33
  137. package/styles/drop-down-tree/bootstrap.css +33 -33
  138. package/styles/drop-down-tree/bootstrap4.css +39 -39
  139. package/styles/drop-down-tree/bootstrap5-dark.css +40 -40
  140. package/styles/drop-down-tree/bootstrap5.3.css +124 -124
  141. package/styles/drop-down-tree/bootstrap5.css +40 -40
  142. package/styles/drop-down-tree/fabric-dark.css +33 -33
  143. package/styles/drop-down-tree/fabric.css +33 -33
  144. package/styles/drop-down-tree/fluent-dark.css +33 -33
  145. package/styles/drop-down-tree/fluent.css +33 -33
  146. package/styles/drop-down-tree/fluent2.css +122 -122
  147. package/styles/drop-down-tree/highcontrast-light.css +33 -33
  148. package/styles/drop-down-tree/highcontrast.css +42 -42
  149. package/styles/drop-down-tree/material-dark.css +33 -33
  150. package/styles/drop-down-tree/material.css +33 -33
  151. package/styles/drop-down-tree/material3-dark.css +115 -115
  152. package/styles/drop-down-tree/material3.css +117 -117
  153. package/styles/drop-down-tree/tailwind-dark.css +52 -52
  154. package/styles/drop-down-tree/tailwind.css +52 -52
  155. package/styles/drop-down-tree/tailwind3.css +107 -107
  156. package/styles/fabric-dark-lite.css +877 -877
  157. package/styles/fabric-dark.css +1274 -1274
  158. package/styles/fabric-lite.css +877 -877
  159. package/styles/fabric.css +1147 -1147
  160. package/styles/fluent-dark-lite.css +1765 -1765
  161. package/styles/fluent-dark.css +1718 -1718
  162. package/styles/fluent-lite.css +1765 -1765
  163. package/styles/fluent.css +1718 -1718
  164. package/styles/fluent2-lite.css +2081 -2081
  165. package/styles/fluent2.css +1703 -1703
  166. package/styles/highcontrast-light-lite.css +1412 -1412
  167. package/styles/highcontrast-light.css +1760 -1760
  168. package/styles/highcontrast-lite.css +1751 -1751
  169. package/styles/highcontrast.css +1768 -1768
  170. package/styles/list-box/_all.bds.scss +1 -1
  171. package/styles/list-box/_all.bootstrap-dark.scss +1 -1
  172. package/styles/list-box/_all.bootstrap.scss +1 -1
  173. package/styles/list-box/_all.bootstrap4.scss +1 -1
  174. package/styles/list-box/_all.bootstrap5-dark.scss +1 -1
  175. package/styles/list-box/_all.bootstrap5.3.scss +1 -1
  176. package/styles/list-box/_all.bootstrap5.scss +1 -1
  177. package/styles/list-box/_all.fabric-dark.scss +1 -1
  178. package/styles/list-box/_all.fabric.scss +1 -1
  179. package/styles/list-box/_all.fluent-dark.scss +1 -1
  180. package/styles/list-box/_all.fluent.scss +1 -1
  181. package/styles/list-box/_all.fluent2.scss +1 -1
  182. package/styles/list-box/_all.highcontrast-light.scss +1 -1
  183. package/styles/list-box/_all.highcontrast.scss +1 -1
  184. package/styles/list-box/_all.material-dark.scss +1 -1
  185. package/styles/list-box/_all.material.scss +1 -1
  186. package/styles/list-box/_all.material3-dark.scss +1 -1
  187. package/styles/list-box/_all.material3.scss +1 -1
  188. package/styles/list-box/_all.tailwind-dark.scss +1 -1
  189. package/styles/list-box/_all.tailwind.scss +1 -1
  190. package/styles/list-box/_all.tailwind3.scss +1 -1
  191. package/styles/list-box/bds.css +654 -654
  192. package/styles/list-box/bootstrap-dark.css +644 -644
  193. package/styles/list-box/bootstrap.css +649 -649
  194. package/styles/list-box/bootstrap4.css +649 -649
  195. package/styles/list-box/bootstrap5-dark.css +649 -649
  196. package/styles/list-box/bootstrap5.3.css +659 -659
  197. package/styles/list-box/bootstrap5.css +649 -649
  198. package/styles/list-box/fabric-dark.css +644 -644
  199. package/styles/list-box/fabric.css +649 -649
  200. package/styles/list-box/fluent-dark.css +649 -649
  201. package/styles/list-box/fluent.css +649 -649
  202. package/styles/list-box/fluent2.css +692 -692
  203. package/styles/list-box/highcontrast-light.css +644 -644
  204. package/styles/list-box/highcontrast.css +649 -649
  205. package/styles/list-box/material-dark.css +643 -643
  206. package/styles/list-box/material.css +648 -648
  207. package/styles/list-box/material3-dark.css +659 -659
  208. package/styles/list-box/material3.css +659 -659
  209. package/styles/list-box/tailwind-dark.css +640 -640
  210. package/styles/list-box/tailwind.css +640 -640
  211. package/styles/list-box/tailwind3.css +698 -698
  212. package/styles/material-dark-lite.css +1566 -1566
  213. package/styles/material-dark.css +2278 -2278
  214. package/styles/material-lite.css +1659 -1659
  215. package/styles/material.css +1921 -1921
  216. package/styles/material3-dark-lite.css +2644 -2644
  217. package/styles/material3-dark.css +2687 -2687
  218. package/styles/material3-lite.css +2663 -2663
  219. package/styles/material3.css +2684 -2684
  220. package/styles/multi-select/_all.bds.scss +1 -1
  221. package/styles/multi-select/_all.bootstrap-dark.scss +1 -1
  222. package/styles/multi-select/_all.bootstrap.scss +1 -1
  223. package/styles/multi-select/_all.bootstrap4.scss +1 -1
  224. package/styles/multi-select/_all.bootstrap5-dark.scss +1 -1
  225. package/styles/multi-select/_all.bootstrap5.3.scss +1 -1
  226. package/styles/multi-select/_all.bootstrap5.scss +1 -1
  227. package/styles/multi-select/_all.fabric-dark.scss +1 -1
  228. package/styles/multi-select/_all.fabric.scss +1 -1
  229. package/styles/multi-select/_all.fluent-dark.scss +1 -1
  230. package/styles/multi-select/_all.fluent.scss +1 -1
  231. package/styles/multi-select/_all.fluent2.scss +1 -1
  232. package/styles/multi-select/_all.highcontrast-light.scss +1 -1
  233. package/styles/multi-select/_all.highcontrast.scss +1 -1
  234. package/styles/multi-select/_all.material-dark.scss +1 -1
  235. package/styles/multi-select/_all.material.scss +1 -1
  236. package/styles/multi-select/_all.material3-dark.scss +1 -1
  237. package/styles/multi-select/_all.material3.scss +1 -1
  238. package/styles/multi-select/_all.tailwind-dark.scss +1 -1
  239. package/styles/multi-select/_all.tailwind.scss +1 -1
  240. package/styles/multi-select/_all.tailwind3.scss +1 -1
  241. package/styles/multi-select/bds.css +221 -221
  242. package/styles/multi-select/bootstrap-dark.css +231 -231
  243. package/styles/multi-select/bootstrap.css +224 -224
  244. package/styles/multi-select/bootstrap4.css +676 -676
  245. package/styles/multi-select/bootstrap5-dark.css +235 -235
  246. package/styles/multi-select/bootstrap5.3.css +336 -336
  247. package/styles/multi-select/bootstrap5.css +235 -235
  248. package/styles/multi-select/fabric-dark.css +225 -225
  249. package/styles/multi-select/fabric.css +220 -220
  250. package/styles/multi-select/fluent-dark.css +677 -677
  251. package/styles/multi-select/fluent.css +677 -677
  252. package/styles/multi-select/fluent2.css +959 -959
  253. package/styles/multi-select/highcontrast-light.css +789 -789
  254. package/styles/multi-select/highcontrast.css +793 -793
  255. package/styles/multi-select/material-dark.css +918 -918
  256. package/styles/multi-select/material.css +920 -920
  257. package/styles/multi-select/material3-dark.css +1330 -1330
  258. package/styles/multi-select/material3.css +1334 -1334
  259. package/styles/multi-select/tailwind-dark.css +217 -217
  260. package/styles/multi-select/tailwind.css +217 -217
  261. package/styles/multi-select/tailwind3.css +326 -326
  262. package/styles/tailwind-dark-lite.css +861 -861
  263. package/styles/tailwind-dark.css +1263 -1263
  264. package/styles/tailwind-lite.css +862 -862
  265. package/styles/tailwind.css +1263 -1263
  266. package/styles/tailwind3-lite.css +1114 -1114
  267. package/styles/tailwind3.css +2339 -2339
  268. package/tslint.json +111 -0
@@ -186,179 +186,128 @@
186
186
  padding: 0 6px 0 0;
187
187
  }
188
188
 
189
- .e-rtl .e-dropdownbase .e-list-item {
190
- padding-left: 16px;
191
- padding-right: 0;
192
- }
193
- .e-small.e-rtl .e-dropdownbase .e-list-item,
194
- .e-small .e-rtl .e-dropdownbase .e-list-item,
195
- .e-rtl .e-small .e-dropdownbase .e-list-item {
196
- padding-left: 16px;
197
- padding-right: 0;
198
- }
199
189
  .e-dropdownbase {
200
- border-color: var(--color-sf-border-light);
201
- }
202
- .e-dropdownbase .e-list-item {
203
- /* stylelint-disable property-no-vendor-prefix */
204
- -webkit-tap-highlight-color: transparent;
205
- border-bottom: 0;
206
- border-color: var(--color-sf-border-light);
207
- color: var(--color-sf-flyout-text-color);
208
- font-family: var(--e-font-family);
209
- font-size: 14px;
210
- line-height: 32px;
211
- min-height: 32px;
212
- padding-right: 16px;
213
- text-indent: 12px;
214
- background-color: var(--color-sf-flyout-bg-color);
215
- }
216
-
217
- .e-dropdownbase .e-list-group-item,
218
- .e-fixed-head {
219
- border-color: var(--color-sf-border-light);
220
- color: var(--color-sf-flyout-text-color);
221
- font-family: var(--e-font-family);
222
- font-size: 14px;
223
- font-weight: 500;
224
- line-height: 32px;
225
- min-height: 32px;
226
- padding-left: 12px;
227
- padding-right: 16px;
228
- overflow: hidden;
229
- text-overflow: ellipsis;
230
- background-color: var(--color-sf-flyout-bg-color);
231
- }
232
-
233
- .e-dropdownbase .e-list-item.e-active, .e-dropdownbase .e-list-item.e-active.e-hover {
234
- background-color: var(--color-sf-flyout-bg-color-selected);
235
- border-color: var(--color-sf-content-bg-color);
236
- color: var(--color-sf-flyout-text-color-selected);
237
- }
238
-
239
- .e-dropdownbase .e-list-item.e-hover {
240
- background-color: var(--color-sf-flyout-bg-color-hover);
241
- border-color: var(--color-sf-content-bg-color);
242
- color: var(--color-sf-flyout-text-color-hover);
243
- }
244
-
245
- .e-dropdownbase .e-list-item:last-child {
246
- border-bottom: 0;
190
+ display: block;
191
+ height: 100%;
192
+ min-height: 36px;
193
+ position: relative;
194
+ width: 100%;
247
195
  }
248
-
249
- .e-dropdownbase .e-list-item.e-item-focus {
250
- background-color: var(--color-sf-flyout-bg-color-hover);
196
+ .e-dropdownbase .e-list-parent {
197
+ margin: 0;
198
+ padding: 0;
251
199
  }
252
200
 
253
- .e-multi-column.e-ddl.e-popup.e-popup-open table {
254
- border-collapse: collapse;
255
- table-layout: fixed;
256
- width: 100%;
201
+ .e-dropdownbase .e-list-group-item, .e-dropdownbase .e-fixed-head {
202
+ cursor: default;
257
203
  }
258
204
 
259
- .e-multi-column.e-ddl.e-popup.e-popup-open th,
260
- .e-multi-column.e-ddl.e-popup.e-popup-open td {
261
- display: table-cell;
205
+ .e-dropdownbase .e-list-item {
206
+ cursor: pointer;
262
207
  overflow: hidden;
263
- padding-right: 16px;
264
- text-indent: 10px;
208
+ position: relative;
265
209
  text-overflow: ellipsis;
210
+ vertical-align: middle;
211
+ white-space: nowrap;
212
+ width: 100%;
266
213
  }
267
214
 
268
- .e-multi-column.e-ddl.e-popup.e-popup-open th {
269
- line-height: 36px;
270
- text-align: left;
215
+ .e-dropdownbase .e-list-item .e-list-icon {
216
+ font-size: 16px;
217
+ vertical-align: middle;
271
218
  }
272
219
 
273
- .e-multi-column.e-ddl.e-popup.e-popup-open .e-ddl-header {
274
- background-color: var(--color-sf-flyout-bg-color);
275
- border-color: var(--color-sf-flyout-border);
276
- border-style: solid;
277
- border-width: 0 0 1px 0;
278
- color: var(--color-sf-flyout-text-color);
279
- font-family: var(--e-font-family);
280
- font-size: 14px;
281
- font-weight: 500;
282
- text-indent: 10px;
220
+ .e-dropdownbase .e-fixed-head {
221
+ position: absolute;
222
+ top: 0;
283
223
  }
284
224
 
285
- .e-multi-column.e-ddl.e-popup.e-popup-open .e-dropdownbase .e-list-item {
286
- padding-right: 0;
225
+ .e-dropdownbase.e-content {
226
+ overflow: auto;
227
+ position: relative;
228
+ border-radius: calc(var(--e-radius) * 0.25);
287
229
  }
288
230
 
289
- .e-multi-column.e-ddl.e-popup.e-popup-open.e-scroller .e-ddl-header {
290
- padding-right: 16px;
231
+ .e-popup.e-ddl .e-dropdownbase.e-nodata,
232
+ .e-popup.e-mention .e-dropdownbase.e-nodata {
233
+ color: var(--color-sf-content-text-color);
234
+ cursor: default;
235
+ font-family: var(--e-font-family);
236
+ font-size: 14px;
237
+ padding: 14px 16px;
238
+ text-align: center;
291
239
  }
292
240
 
293
- .e-multi-column.e-ddl.e-popup.e-popup-open .e-ddl-header,
294
- .e-multi-column.e-ddl.e-popup.e-popup-open.e-ddl-device .e-ddl-header {
295
- padding-right: 0;
241
+ .e-mention.e-popup {
242
+ background: var(--color-sf-content-bg-color);
243
+ border: 0;
244
+ -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
245
+ box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
246
+ margin-top: 2px;
247
+ position: absolute;
296
248
  }
297
249
 
298
- .e-multi-column.e-ddl.e-popup.e-popup-open .e-text-center {
299
- text-align: center;
250
+ .e-mention.e-popup .e-dropdownbase {
251
+ min-height: 32px;
300
252
  }
301
253
 
302
- .e-multi-column.e-ddl.e-popup.e-popup-open .e-text-right {
303
- text-align: right;
254
+ .e-mention .e-dropdownbase .e-list-item .e-highlight {
255
+ display: inline;
256
+ font-weight: bold;
257
+ vertical-align: baseline;
304
258
  }
305
259
 
306
- .e-multi-column.e-ddl.e-popup.e-popup-open .e-text-left {
307
- text-align: left;
260
+ .e-mention .e-mention-chip,
261
+ .e-mention .e-mention-chip:hover {
262
+ background: var(--color-sf-content-bg-color-alt2);
263
+ border-radius: calc(var(--e-radius) * 0.125);
264
+ border: none;
265
+ color: var(--color-sf-primary);
266
+ cursor: default;
267
+ font-weight: 500;
308
268
  }
309
269
 
310
- .e-small .e-dropdownbase .e-list-item,
311
- .e-dropdownbase.e-small .e-list-item {
312
- color: var(--color-sf-content-text-color);
313
- line-height: 26px;
314
- min-height: 26px;
315
- text-indent: 8px;
270
+ .e-mention.e-editable-element {
271
+ border: 2px solid var(--color-sf-border-light);
272
+ height: auto;
273
+ min-height: 120px;
274
+ width: 100%;
316
275
  }
317
276
 
318
- .e-small .e-dropdownbase .e-list-group-item, .e-small .e-dropdownbase .e-fixed-head,
319
- .e-dropdownbase.e-small .e-list-group-item,
320
- .e-dropdownbase.e-small .e-fixed-head {
321
- font-size: 10px;
322
- line-height: 26px;
323
- min-height: 26px;
324
- padding-left: 8px;
277
+ .e-form-mirror-div {
278
+ white-space: pre-wrap;
325
279
  }
326
280
 
327
- .e-small .e-dropdownbase .e-list-item .e-list-icon,
328
- .e-dropdownbase.e-small .e-list-item .e-list-icon {
329
- font-size: 14px;
281
+ .e-rtl .e-dropdownbase.e-dd-group .e-list-item {
282
+ padding-right: 12px;
330
283
  }
331
284
 
332
- .e-ddl.e-popup.e-multiselect-group .e-list-group-item {
333
- background-color: var(--color-sf-flyout-bg-color);
334
- border-bottom: 0;
335
- border-color: var(--color-sf-border-light);
336
- color: var(--color-sf-flyout-text-color);
337
- font-family: var(--e-font-family);
338
- text-indent: 12px;
339
- font-size: 14px;
340
- padding-right: 16px;
285
+ .e-dropdownbase.e-dd-group .e-list-item {
286
+ padding-left: 12px;
287
+ text-indent: 0;
341
288
  }
342
289
 
343
- .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-item-focus {
344
- background-color: var(--color-sf-flyout-bg-color-hover);
290
+ .e-small .e-dropdownbase.e-dd-group .e-list-item {
291
+ padding-left: 8px;
345
292
  }
346
293
 
347
- .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-active,
348
- .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-active.e-hover {
349
- background-color: var(--color-sf-flyout-bg-color-selected);
350
- border-color: var(--color-sf-content-bg-color);
351
- color: var(--color-sf-flyout-text-color-selected);
294
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
295
+ text-indent: 0;
352
296
  }
353
297
 
354
- .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-hover {
355
- background-color: var(--color-sf-flyout-bg-color-hover);
356
- border-color: var(--color-sf-content-bg-color);
357
- color: var(--color-sf-flyout-text-color-hover);
298
+ .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
299
+ cursor: pointer;
300
+ font-weight: normal;
301
+ overflow: hidden;
302
+ position: relative;
303
+ text-overflow: ellipsis;
304
+ vertical-align: middle;
305
+ white-space: nowrap;
306
+ width: 100%;
358
307
  }
359
308
 
360
- .e-selectall-parent.e-item-focus {
361
- background-color: var(--color-sf-flyout-bg-color-hover);
309
+ .e-rtl.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-item {
310
+ padding-right: 12px;
362
311
  }
363
312
 
364
313
 
@@ -455,128 +404,179 @@
455
404
  padding: 0 6px 0 0;
456
405
  }
457
406
 
458
- .e-dropdownbase {
459
- display: block;
460
- height: 100%;
461
- min-height: 36px;
462
- position: relative;
463
- width: 100%;
407
+ .e-rtl .e-dropdownbase .e-list-item {
408
+ padding-left: 16px;
409
+ padding-right: 0;
464
410
  }
465
- .e-dropdownbase .e-list-parent {
466
- margin: 0;
467
- padding: 0;
411
+ .e-small.e-rtl .e-dropdownbase .e-list-item,
412
+ .e-small .e-rtl .e-dropdownbase .e-list-item,
413
+ .e-rtl .e-small .e-dropdownbase .e-list-item {
414
+ padding-left: 16px;
415
+ padding-right: 0;
468
416
  }
469
-
470
- .e-dropdownbase .e-list-group-item, .e-dropdownbase .e-fixed-head {
471
- cursor: default;
417
+ .e-dropdownbase {
418
+ border-color: var(--color-sf-border-light);
472
419
  }
473
-
474
420
  .e-dropdownbase .e-list-item {
475
- cursor: pointer;
421
+ /* stylelint-disable property-no-vendor-prefix */
422
+ -webkit-tap-highlight-color: transparent;
423
+ border-bottom: 0;
424
+ border-color: var(--color-sf-border-light);
425
+ color: var(--color-sf-flyout-text-color);
426
+ font-family: var(--e-font-family);
427
+ font-size: 14px;
428
+ line-height: 32px;
429
+ min-height: 32px;
430
+ padding-right: 16px;
431
+ text-indent: 12px;
432
+ background-color: var(--color-sf-flyout-bg-color);
433
+ }
434
+
435
+ .e-dropdownbase .e-list-group-item,
436
+ .e-fixed-head {
437
+ border-color: var(--color-sf-border-light);
438
+ color: var(--color-sf-flyout-text-color);
439
+ font-family: var(--e-font-family);
440
+ font-size: 14px;
441
+ font-weight: 500;
442
+ line-height: 32px;
443
+ min-height: 32px;
444
+ padding-left: 12px;
445
+ padding-right: 16px;
476
446
  overflow: hidden;
477
- position: relative;
478
447
  text-overflow: ellipsis;
479
- vertical-align: middle;
480
- white-space: nowrap;
481
- width: 100%;
448
+ background-color: var(--color-sf-flyout-bg-color);
482
449
  }
483
450
 
484
- .e-dropdownbase .e-list-item .e-list-icon {
485
- font-size: 16px;
486
- vertical-align: middle;
451
+ .e-dropdownbase .e-list-item.e-active, .e-dropdownbase .e-list-item.e-active.e-hover {
452
+ background-color: var(--color-sf-flyout-bg-color-selected);
453
+ border-color: var(--color-sf-content-bg-color);
454
+ color: var(--color-sf-flyout-text-color-selected);
487
455
  }
488
456
 
489
- .e-dropdownbase .e-fixed-head {
490
- position: absolute;
491
- top: 0;
457
+ .e-dropdownbase .e-list-item.e-hover {
458
+ background-color: var(--color-sf-flyout-bg-color-hover);
459
+ border-color: var(--color-sf-content-bg-color);
460
+ color: var(--color-sf-flyout-text-color-hover);
492
461
  }
493
462
 
494
- .e-dropdownbase.e-content {
495
- overflow: auto;
496
- position: relative;
497
- border-radius: calc(var(--e-radius) * 0.25);
463
+ .e-dropdownbase .e-list-item:last-child {
464
+ border-bottom: 0;
498
465
  }
499
466
 
500
- .e-popup.e-ddl .e-dropdownbase.e-nodata,
501
- .e-popup.e-mention .e-dropdownbase.e-nodata {
502
- color: var(--color-sf-content-text-color);
503
- cursor: default;
504
- font-family: var(--e-font-family);
505
- font-size: 14px;
506
- padding: 14px 16px;
507
- text-align: center;
467
+ .e-dropdownbase .e-list-item.e-item-focus {
468
+ background-color: var(--color-sf-flyout-bg-color-hover);
508
469
  }
509
470
 
510
- .e-mention.e-popup {
511
- background: var(--color-sf-content-bg-color);
512
- border: 0;
513
- -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
514
- box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
515
- margin-top: 2px;
516
- position: absolute;
471
+ .e-multi-column.e-ddl.e-popup.e-popup-open table {
472
+ border-collapse: collapse;
473
+ table-layout: fixed;
474
+ width: 100%;
517
475
  }
518
476
 
519
- .e-mention.e-popup .e-dropdownbase {
520
- min-height: 32px;
477
+ .e-multi-column.e-ddl.e-popup.e-popup-open th,
478
+ .e-multi-column.e-ddl.e-popup.e-popup-open td {
479
+ display: table-cell;
480
+ overflow: hidden;
481
+ padding-right: 16px;
482
+ text-indent: 10px;
483
+ text-overflow: ellipsis;
521
484
  }
522
485
 
523
- .e-mention .e-dropdownbase .e-list-item .e-highlight {
524
- display: inline;
525
- font-weight: bold;
526
- vertical-align: baseline;
486
+ .e-multi-column.e-ddl.e-popup.e-popup-open th {
487
+ line-height: 36px;
488
+ text-align: left;
527
489
  }
528
490
 
529
- .e-mention .e-mention-chip,
530
- .e-mention .e-mention-chip:hover {
531
- background: var(--color-sf-content-bg-color-alt2);
532
- border-radius: calc(var(--e-radius) * 0.125);
533
- border: none;
534
- color: var(--color-sf-primary);
535
- cursor: default;
491
+ .e-multi-column.e-ddl.e-popup.e-popup-open .e-ddl-header {
492
+ background-color: var(--color-sf-flyout-bg-color);
493
+ border-color: var(--color-sf-flyout-border);
494
+ border-style: solid;
495
+ border-width: 0 0 1px 0;
496
+ color: var(--color-sf-flyout-text-color);
497
+ font-family: var(--e-font-family);
498
+ font-size: 14px;
536
499
  font-weight: 500;
500
+ text-indent: 10px;
537
501
  }
538
502
 
539
- .e-mention.e-editable-element {
540
- border: 2px solid var(--color-sf-border-light);
541
- height: auto;
542
- min-height: 120px;
543
- width: 100%;
503
+ .e-multi-column.e-ddl.e-popup.e-popup-open .e-dropdownbase .e-list-item {
504
+ padding-right: 0;
544
505
  }
545
506
 
546
- .e-form-mirror-div {
547
- white-space: pre-wrap;
507
+ .e-multi-column.e-ddl.e-popup.e-popup-open.e-scroller .e-ddl-header {
508
+ padding-right: 16px;
548
509
  }
549
510
 
550
- .e-rtl .e-dropdownbase.e-dd-group .e-list-item {
551
- padding-right: 12px;
511
+ .e-multi-column.e-ddl.e-popup.e-popup-open .e-ddl-header,
512
+ .e-multi-column.e-ddl.e-popup.e-popup-open.e-ddl-device .e-ddl-header {
513
+ padding-right: 0;
552
514
  }
553
515
 
554
- .e-dropdownbase.e-dd-group .e-list-item {
555
- padding-left: 12px;
556
- text-indent: 0;
516
+ .e-multi-column.e-ddl.e-popup.e-popup-open .e-text-center {
517
+ text-align: center;
557
518
  }
558
519
 
559
- .e-small .e-dropdownbase.e-dd-group .e-list-item {
520
+ .e-multi-column.e-ddl.e-popup.e-popup-open .e-text-right {
521
+ text-align: right;
522
+ }
523
+
524
+ .e-multi-column.e-ddl.e-popup.e-popup-open .e-text-left {
525
+ text-align: left;
526
+ }
527
+
528
+ .e-small .e-dropdownbase .e-list-item,
529
+ .e-dropdownbase.e-small .e-list-item {
530
+ color: var(--color-sf-content-text-color);
531
+ line-height: 26px;
532
+ min-height: 26px;
533
+ text-indent: 8px;
534
+ }
535
+
536
+ .e-small .e-dropdownbase .e-list-group-item, .e-small .e-dropdownbase .e-fixed-head,
537
+ .e-dropdownbase.e-small .e-list-group-item,
538
+ .e-dropdownbase.e-small .e-fixed-head {
539
+ font-size: 10px;
540
+ line-height: 26px;
541
+ min-height: 26px;
560
542
  padding-left: 8px;
561
543
  }
562
544
 
563
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
564
- text-indent: 0;
545
+ .e-small .e-dropdownbase .e-list-item .e-list-icon,
546
+ .e-dropdownbase.e-small .e-list-item .e-list-icon {
547
+ font-size: 14px;
565
548
  }
566
549
 
567
- .e-popup.e-multi-select-list-wrapper.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-group-item {
568
- cursor: pointer;
569
- font-weight: normal;
570
- overflow: hidden;
571
- position: relative;
572
- text-overflow: ellipsis;
573
- vertical-align: middle;
574
- white-space: nowrap;
575
- width: 100%;
550
+ .e-ddl.e-popup.e-multiselect-group .e-list-group-item {
551
+ background-color: var(--color-sf-flyout-bg-color);
552
+ border-bottom: 0;
553
+ border-color: var(--color-sf-border-light);
554
+ color: var(--color-sf-flyout-text-color);
555
+ font-family: var(--e-font-family);
556
+ text-indent: 12px;
557
+ font-size: 14px;
558
+ padding-right: 16px;
576
559
  }
577
560
 
578
- .e-rtl.e-multiselect-group .e-dropdownbase.e-dd-group .e-list-item {
579
- padding-right: 12px;
561
+ .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-item-focus {
562
+ background-color: var(--color-sf-flyout-bg-color-hover);
563
+ }
564
+
565
+ .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-active,
566
+ .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-active.e-hover {
567
+ background-color: var(--color-sf-flyout-bg-color-selected);
568
+ border-color: var(--color-sf-content-bg-color);
569
+ color: var(--color-sf-flyout-text-color-selected);
570
+ }
571
+
572
+ .e-ddl.e-popup.e-multiselect-group .e-list-group-item.e-hover {
573
+ background-color: var(--color-sf-flyout-bg-color-hover);
574
+ border-color: var(--color-sf-content-bg-color);
575
+ color: var(--color-sf-flyout-text-color-hover);
576
+ }
577
+
578
+ .e-selectall-parent.e-item-focus {
579
+ background-color: var(--color-sf-flyout-bg-color-hover);
580
580
  }
581
581
 
582
582
 
@@ -1,2 +1,2 @@
1
- @use 'theme.bds' as *;
2
1
  @use 'layout.bds' as *;
2
+ @use 'theme.bds' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.bootstrap-dark' as *;
2
1
  @use 'layout.bootstrap-dark' as *;
2
+ @use 'theme.bootstrap-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.bootstrap' as *;
2
1
  @use 'layout.bootstrap' as *;
2
+ @use 'theme.bootstrap' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.bootstrap4' as *;
2
1
  @use 'layout.bootstrap4' as *;
2
+ @use 'theme.bootstrap4' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.bootstrap5-dark' as *;
2
1
  @use 'layout.bootstrap5-dark' as *;
2
+ @use 'theme.bootstrap5-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.bootstrap5.3' as *;
2
1
  @use 'layout.bootstrap5.3' as *;
2
+ @use 'theme.bootstrap5.3' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.bootstrap5' as *;
2
1
  @use 'layout.bootstrap5' as *;
2
+ @use 'theme.bootstrap5' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.fabric-dark' as *;
2
1
  @use 'layout.fabric-dark' as *;
2
+ @use 'theme.fabric-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.fabric' as *;
2
1
  @use 'layout.fabric' as *;
2
+ @use 'theme.fabric' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.fluent-dark' as *;
2
1
  @use 'layout.fluent-dark' as *;
2
+ @use 'theme.fluent-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.fluent' as *;
2
1
  @use 'layout.fluent' as *;
2
+ @use 'theme.fluent' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.fluent2' as *;
2
1
  @use 'layout.fluent2' as *;
2
+ @use 'theme.fluent2' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.highcontrast-light' as *;
2
1
  @use 'layout.highcontrast-light' as *;
2
+ @use 'theme.highcontrast-light' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.highcontrast' as *;
2
1
  @use 'layout.highcontrast' as *;
2
+ @use 'theme.highcontrast' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.material-dark' as *;
2
1
  @use 'layout.material-dark' as *;
2
+ @use 'theme.material-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.material' as *;
2
1
  @use 'layout.material' as *;
2
+ @use 'theme.material' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.material3-dark' as *;
2
1
  @use 'layout.material3-dark' as *;
2
+ @use 'theme.material3-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.material3' as *;
2
1
  @use 'layout.material3' as *;
2
+ @use 'theme.material3' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.tailwind-dark' as *;
2
1
  @use 'layout.tailwind-dark' as *;
2
+ @use 'theme.tailwind-dark' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.tailwind' as *;
2
1
  @use 'layout.tailwind' as *;
2
+ @use 'theme.tailwind' as *;
@@ -1,2 +1,2 @@
1
- @use 'theme.tailwind3' as *;
2
1
  @use 'layout.tailwind3' as *;
2
+ @use 'theme.tailwind3' as *;