@syncfusion/ej2-dropdowns 32.2.8 → 33.1.44

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 (216) hide show
  1. package/dist/ej2-dropdowns.min.js +2 -2
  2. package/dist/ej2-dropdowns.umd.min.js +2 -2
  3. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-dropdowns.es2015.js +490 -139
  5. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es5.js +467 -114
  7. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  8. package/dist/global/ej2-dropdowns.min.js +2 -2
  9. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +8 -8
  12. package/src/combo-box/combo-box.js +3 -0
  13. package/src/common/virtual-scroll.d.ts +1 -0
  14. package/src/common/virtual-scroll.js +17 -1
  15. package/src/drop-down-base/drop-down-base.d.ts +2 -0
  16. package/src/drop-down-base/drop-down-base.js +42 -0
  17. package/src/drop-down-list/drop-down-list.d.ts +1 -0
  18. package/src/drop-down-list/drop-down-list.js +143 -30
  19. package/src/drop-down-tree/drop-down-tree-model.d.ts +1 -1
  20. package/src/drop-down-tree/drop-down-tree.d.ts +1 -1
  21. package/src/mention/mention.js +8 -4
  22. package/src/multi-select/multi-select.d.ts +2 -0
  23. package/src/multi-select/multi-select.js +254 -79
  24. package/styles/bds-lite.css +17 -9
  25. package/styles/bds.css +29 -15
  26. package/styles/bootstrap-dark-lite.css +17 -9
  27. package/styles/bootstrap-dark.css +27 -14
  28. package/styles/bootstrap-lite.css +17 -9
  29. package/styles/bootstrap.css +27 -14
  30. package/styles/bootstrap4-lite.css +17 -9
  31. package/styles/bootstrap4.css +27 -14
  32. package/styles/bootstrap5-dark-lite.css +17 -9
  33. package/styles/bootstrap5-dark.css +27 -14
  34. package/styles/bootstrap5-lite.css +17 -9
  35. package/styles/bootstrap5.3-lite.css +19 -9
  36. package/styles/bootstrap5.3.css +29 -14
  37. package/styles/bootstrap5.css +27 -14
  38. package/styles/drop-down-base/_bds-definition.scss +2 -2
  39. package/styles/drop-down-base/_bigger.scss +3 -3
  40. package/styles/drop-down-base/_bootstrap-dark-definition.scss +3 -3
  41. package/styles/drop-down-base/_bootstrap-definition.scss +3 -3
  42. package/styles/drop-down-base/_bootstrap4-definition.scss +3 -3
  43. package/styles/drop-down-base/_bootstrap5-dark-definition.scss +3 -3
  44. package/styles/drop-down-base/_bootstrap5-definition.scss +3 -3
  45. package/styles/drop-down-base/_bootstrap5.3-definition.scss +6 -3
  46. package/styles/drop-down-base/_fabric-dark-definition.scss +3 -3
  47. package/styles/drop-down-base/_fabric-definition.scss +3 -3
  48. package/styles/drop-down-base/_fluent-dark-definition.scss +3 -3
  49. package/styles/drop-down-base/_fluent-definition.scss +3 -3
  50. package/styles/drop-down-base/_fluent2-definition.scss +8 -5
  51. package/styles/drop-down-base/_fusionnew-definition.scss +2 -2
  52. package/styles/drop-down-base/_highcontrast-definition.scss +3 -3
  53. package/styles/drop-down-base/_highcontrast-light-definition.scss +3 -3
  54. package/styles/drop-down-base/_layout.scss +12 -1
  55. package/styles/drop-down-base/_material-dark-definition.scss +2 -2
  56. package/styles/drop-down-base/_material-definition.scss +2 -2
  57. package/styles/drop-down-base/_material3-dark-definition.scss +6 -4
  58. package/styles/drop-down-base/_material3-definition.scss +6 -4
  59. package/styles/drop-down-base/_tailwind-dark-definition.scss +4 -4
  60. package/styles/drop-down-base/_tailwind-definition.scss +4 -4
  61. package/styles/drop-down-base/_tailwind3-definition.scss +5 -2
  62. package/styles/drop-down-base/_theme.scss +6 -0
  63. package/styles/drop-down-base/bds.css +21 -11
  64. package/styles/drop-down-base/bootstrap-dark.css +19 -10
  65. package/styles/drop-down-base/bootstrap.css +19 -10
  66. package/styles/drop-down-base/bootstrap4.css +19 -10
  67. package/styles/drop-down-base/bootstrap5-dark.css +19 -10
  68. package/styles/drop-down-base/bootstrap5.3.css +21 -10
  69. package/styles/drop-down-base/bootstrap5.css +19 -10
  70. package/styles/drop-down-base/fabric-dark.css +19 -10
  71. package/styles/drop-down-base/fabric.css +19 -10
  72. package/styles/drop-down-base/fluent-dark.css +19 -10
  73. package/styles/drop-down-base/fluent.css +19 -10
  74. package/styles/drop-down-base/fluent2.css +28 -12
  75. package/styles/drop-down-base/highcontrast-light.css +19 -10
  76. package/styles/drop-down-base/highcontrast.css +19 -10
  77. package/styles/drop-down-base/material-dark.css +17 -9
  78. package/styles/drop-down-base/material.css +17 -9
  79. package/styles/drop-down-base/material3-dark.css +19 -9
  80. package/styles/drop-down-base/material3.css +19 -9
  81. package/styles/drop-down-base/tailwind-dark.css +21 -11
  82. package/styles/drop-down-base/tailwind.css +21 -11
  83. package/styles/drop-down-base/tailwind3.css +19 -9
  84. package/styles/drop-down-list/bds.css +4 -2
  85. package/styles/drop-down-list/bootstrap-dark.css +4 -2
  86. package/styles/drop-down-list/bootstrap.css +4 -2
  87. package/styles/drop-down-list/bootstrap4.css +4 -2
  88. package/styles/drop-down-list/bootstrap5-dark.css +4 -2
  89. package/styles/drop-down-list/bootstrap5.3.css +4 -2
  90. package/styles/drop-down-list/bootstrap5.css +4 -2
  91. package/styles/drop-down-list/fabric-dark.css +4 -2
  92. package/styles/drop-down-list/fabric.css +4 -2
  93. package/styles/drop-down-list/fluent-dark.css +4 -2
  94. package/styles/drop-down-list/fluent.css +4 -2
  95. package/styles/drop-down-list/fluent2.css +4 -2
  96. package/styles/drop-down-list/highcontrast-light.css +4 -2
  97. package/styles/drop-down-list/highcontrast.css +4 -2
  98. package/styles/drop-down-list/material-dark.css +4 -2
  99. package/styles/drop-down-list/material.css +4 -2
  100. package/styles/drop-down-list/material3-dark.css +4 -2
  101. package/styles/drop-down-list/material3.css +4 -2
  102. package/styles/drop-down-list/tailwind-dark.css +4 -2
  103. package/styles/drop-down-list/tailwind.css +4 -2
  104. package/styles/drop-down-list/tailwind3.css +4 -2
  105. package/styles/drop-down-tree/bds.css +4 -2
  106. package/styles/drop-down-tree/bootstrap-dark.css +4 -2
  107. package/styles/drop-down-tree/bootstrap.css +4 -2
  108. package/styles/drop-down-tree/bootstrap4.css +4 -2
  109. package/styles/drop-down-tree/bootstrap5-dark.css +4 -2
  110. package/styles/drop-down-tree/bootstrap5.3.css +4 -2
  111. package/styles/drop-down-tree/bootstrap5.css +4 -2
  112. package/styles/drop-down-tree/fabric-dark.css +4 -2
  113. package/styles/drop-down-tree/fabric.css +4 -2
  114. package/styles/drop-down-tree/fluent-dark.css +4 -2
  115. package/styles/drop-down-tree/fluent.css +4 -2
  116. package/styles/drop-down-tree/fluent2.css +4 -2
  117. package/styles/drop-down-tree/highcontrast-light.css +4 -2
  118. package/styles/drop-down-tree/highcontrast.css +4 -2
  119. package/styles/drop-down-tree/material-dark.css +4 -2
  120. package/styles/drop-down-tree/material.css +4 -2
  121. package/styles/drop-down-tree/material3-dark.css +4 -2
  122. package/styles/drop-down-tree/material3.css +4 -2
  123. package/styles/drop-down-tree/tailwind-dark.css +4 -2
  124. package/styles/drop-down-tree/tailwind.css +4 -2
  125. package/styles/drop-down-tree/tailwind3.css +4 -2
  126. package/styles/fabric-dark-lite.css +17 -9
  127. package/styles/fabric-dark.css +27 -14
  128. package/styles/fabric-lite.css +17 -9
  129. package/styles/fabric.css +27 -14
  130. package/styles/fluent-dark-lite.css +17 -9
  131. package/styles/fluent-dark.css +27 -14
  132. package/styles/fluent-lite.css +17 -9
  133. package/styles/fluent.css +27 -14
  134. package/styles/fluent2-lite.css +24 -10
  135. package/styles/fluent2.css +36 -16
  136. package/styles/highcontrast-light-lite.css +17 -9
  137. package/styles/highcontrast-light.css +27 -14
  138. package/styles/highcontrast-lite.css +17 -9
  139. package/styles/highcontrast.css +27 -14
  140. package/styles/list-box/bds.css +4 -2
  141. package/styles/list-box/bootstrap-dark.css +4 -2
  142. package/styles/list-box/bootstrap.css +4 -2
  143. package/styles/list-box/bootstrap4.css +4 -2
  144. package/styles/list-box/bootstrap5-dark.css +4 -2
  145. package/styles/list-box/bootstrap5.3.css +4 -2
  146. package/styles/list-box/bootstrap5.css +4 -2
  147. package/styles/list-box/fabric-dark.css +4 -2
  148. package/styles/list-box/fabric.css +4 -2
  149. package/styles/list-box/fluent-dark.css +4 -2
  150. package/styles/list-box/fluent.css +4 -2
  151. package/styles/list-box/fluent2.css +4 -2
  152. package/styles/list-box/highcontrast-light.css +4 -2
  153. package/styles/list-box/highcontrast.css +4 -2
  154. package/styles/list-box/material-dark.css +4 -2
  155. package/styles/list-box/material.css +4 -2
  156. package/styles/list-box/material3-dark.css +4 -2
  157. package/styles/list-box/material3.css +4 -2
  158. package/styles/list-box/tailwind-dark.css +4 -2
  159. package/styles/list-box/tailwind.css +4 -2
  160. package/styles/list-box/tailwind3.css +4 -2
  161. package/styles/material-dark-lite.css +17 -9
  162. package/styles/material-dark.css +25 -13
  163. package/styles/material-lite.css +17 -9
  164. package/styles/material.css +25 -13
  165. package/styles/material3-dark-lite.css +19 -9
  166. package/styles/material3-dark.css +27 -13
  167. package/styles/material3-lite.css +19 -9
  168. package/styles/material3.css +27 -13
  169. package/styles/mention/bds.css +4 -2
  170. package/styles/mention/bootstrap-dark.css +4 -2
  171. package/styles/mention/bootstrap.css +4 -2
  172. package/styles/mention/bootstrap4.css +4 -2
  173. package/styles/mention/bootstrap5-dark.css +4 -2
  174. package/styles/mention/bootstrap5.3.css +4 -2
  175. package/styles/mention/bootstrap5.css +4 -2
  176. package/styles/mention/fabric-dark.css +4 -2
  177. package/styles/mention/fabric.css +4 -2
  178. package/styles/mention/fluent-dark.css +4 -2
  179. package/styles/mention/fluent.css +4 -2
  180. package/styles/mention/fluent2.css +4 -2
  181. package/styles/mention/highcontrast-light.css +4 -2
  182. package/styles/mention/highcontrast.css +4 -2
  183. package/styles/mention/material-dark.css +4 -2
  184. package/styles/mention/material.css +4 -2
  185. package/styles/mention/material3-dark.css +4 -2
  186. package/styles/mention/material3.css +4 -2
  187. package/styles/mention/tailwind-dark.css +4 -2
  188. package/styles/mention/tailwind.css +4 -2
  189. package/styles/mention/tailwind3.css +4 -2
  190. package/styles/multi-select/bds.css +12 -6
  191. package/styles/multi-select/bootstrap-dark.css +12 -6
  192. package/styles/multi-select/bootstrap.css +12 -6
  193. package/styles/multi-select/bootstrap4.css +12 -6
  194. package/styles/multi-select/bootstrap5-dark.css +12 -6
  195. package/styles/multi-select/bootstrap5.3.css +12 -6
  196. package/styles/multi-select/bootstrap5.css +12 -6
  197. package/styles/multi-select/fabric-dark.css +12 -6
  198. package/styles/multi-select/fabric.css +12 -6
  199. package/styles/multi-select/fluent-dark.css +12 -6
  200. package/styles/multi-select/fluent.css +12 -6
  201. package/styles/multi-select/fluent2.css +12 -6
  202. package/styles/multi-select/highcontrast-light.css +12 -6
  203. package/styles/multi-select/highcontrast.css +12 -6
  204. package/styles/multi-select/material-dark.css +12 -6
  205. package/styles/multi-select/material.css +12 -6
  206. package/styles/multi-select/material3-dark.css +12 -6
  207. package/styles/multi-select/material3.css +12 -6
  208. package/styles/multi-select/tailwind-dark.css +12 -6
  209. package/styles/multi-select/tailwind.css +12 -6
  210. package/styles/multi-select/tailwind3.css +12 -6
  211. package/styles/tailwind-dark-lite.css +17 -9
  212. package/styles/tailwind-dark.css +29 -15
  213. package/styles/tailwind-lite.css +17 -9
  214. package/styles/tailwind.css +29 -15
  215. package/styles/tailwind3-lite.css +19 -9
  216. package/styles/tailwind3.css +27 -13
package/styles/list-box/tailwind3.css CHANGED
@@ -85,11 +85,13 @@
85
85
  }
86
86
 
87
87
  .e-dropdownbase .e-list-item .e-list-icon {
88
- padding: 0 8px 0 0;
88
+ -webkit-padding-end: 8px;
89
+ padding-inline-end: 8px;
89
90
  }
90
91
 
91
92
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
92
- padding: 0 6px 0 0;
93
+ -webkit-padding-end: 6px;
94
+ padding-inline-end: 6px;
93
95
  }
94
96
 
95
97
  .e-listbox-tool .e-moveup::before {
package/styles/material-dark-lite.css CHANGED
@@ -1,17 +1,21 @@
1
1
  .e-dropdownbase .e-list-item .e-list-icon {
2
- padding: 0 16px 0 0;
2
+ -webkit-padding-end: 16px;
3
+ padding-inline-end: 16px;
3
4
  }
4
5
 
5
6
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
6
- padding: 0 12px 0 0;
7
+ -webkit-padding-end: 12px;
8
+ padding-inline-end: 12px;
7
9
  }
8
10
 
9
11
  .e-dropdownbase .e-list-item .e-list-icon {
10
- padding: 0 16px 0 0;
12
+ -webkit-padding-end: 16px;
13
+ padding-inline-end: 16px;
11
14
  }
12
15
 
13
16
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
14
- padding: 0 12px 0 0;
17
+ -webkit-padding-end: 12px;
18
+ padding-inline-end: 12px;
15
19
  }
16
20
 
17
21
  .e-dropdownbase {
@@ -67,11 +71,11 @@
67
71
 
68
72
  .e-mention.e-popup {
69
73
  background: rgba(0, 0, 0, 0.9);
70
- border: 0;
71
74
  -webkit-box-shadow: 0 2px 3px 1px 0 2px 3px 1px rgba(0, 0, 0, 0.21);
72
75
  box-shadow: 0 2px 3px 1px 0 2px 3px 1px rgba(0, 0, 0, 0.21);
73
76
  margin-top: 2px;
74
77
  position: absolute;
78
+ border: 0;
75
79
  }
76
80
 
77
81
  .e-mention.e-popup .e-dropdownbase {
@@ -137,11 +141,13 @@
137
141
  }
138
142
 
139
143
  .e-dropdownbase .e-list-item .e-list-icon {
140
- padding: 0 16px 0 0;
144
+ -webkit-padding-end: 16px;
145
+ padding-inline-end: 16px;
141
146
  }
142
147
 
143
148
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
144
- padding: 0 12px 0 0;
149
+ -webkit-padding-end: 12px;
150
+ padding-inline-end: 12px;
145
151
  }
146
152
 
147
153
  .e-rtl .e-dropdownbase .e-list-item {
@@ -1674,11 +1680,13 @@ ejs-dropdownlist {
1674
1680
  }
1675
1681
 
1676
1682
  .e-dropdownbase .e-list-item .e-list-icon {
1677
- padding: 0 16px 0 0;
1683
+ -webkit-padding-end: 16px;
1684
+ padding-inline-end: 16px;
1678
1685
  }
1679
1686
 
1680
1687
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
1681
- padding: 0 12px 0 0;
1688
+ -webkit-padding-end: 12px;
1689
+ padding-inline-end: 12px;
1682
1690
  }
1683
1691
 
1684
1692
  .e-multiselect.e-input-group.e-checkbox .e-multi-select-wrapper input[type=text] {
package/styles/material-dark.css CHANGED
@@ -1,17 +1,21 @@
1
1
  .e-dropdownbase .e-list-item .e-list-icon {
2
- padding: 0 16px 0 0;
2
+ -webkit-padding-end: 16px;
3
+ padding-inline-end: 16px;
3
4
  }
4
5
 
5
6
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
6
- padding: 0 12px 0 0;
7
+ -webkit-padding-end: 12px;
8
+ padding-inline-end: 12px;
7
9
  }
8
10
 
9
11
  .e-dropdownbase .e-list-item .e-list-icon {
10
- padding: 0 16px 0 0;
12
+ -webkit-padding-end: 16px;
13
+ padding-inline-end: 16px;
11
14
  }
12
15
 
13
16
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
14
- padding: 0 12px 0 0;
17
+ -webkit-padding-end: 12px;
18
+ padding-inline-end: 12px;
15
19
  }
16
20
 
17
21
  .e-dropdownbase {
@@ -67,11 +71,11 @@
67
71
 
68
72
  .e-mention.e-popup {
69
73
  background: rgba(0, 0, 0, 0.9);
70
- border: 0;
71
74
  -webkit-box-shadow: 0 2px 3px 1px 0 2px 3px 1px rgba(0, 0, 0, 0.21);
72
75
  box-shadow: 0 2px 3px 1px 0 2px 3px 1px rgba(0, 0, 0, 0.21);
73
76
  margin-top: 2px;
74
77
  position: absolute;
78
+ border: 0;
75
79
  }
76
80
 
77
81
  .e-mention.e-popup .e-dropdownbase {
@@ -137,11 +141,13 @@
137
141
  }
138
142
 
139
143
  .e-dropdownbase .e-list-item .e-list-icon {
140
- padding: 0 16px 0 0;
144
+ -webkit-padding-end: 16px;
145
+ padding-inline-end: 16px;
141
146
  }
142
147
 
143
148
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
144
- padding: 0 12px 0 0;
149
+ -webkit-padding-end: 12px;
150
+ padding-inline-end: 12px;
145
151
  }
146
152
 
147
153
  .e-rtl .e-dropdownbase .e-list-item {
@@ -320,11 +326,13 @@
320
326
  }
321
327
 
322
328
  .e-dropdownbase .e-list-item .e-list-icon {
323
- padding: 0 16px 0 0;
329
+ -webkit-padding-end: 16px;
330
+ padding-inline-end: 16px;
324
331
  }
325
332
 
326
333
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
327
- padding: 0 12px 0 0;
334
+ -webkit-padding-end: 12px;
335
+ padding-inline-end: 12px;
328
336
  }
329
337
 
330
338
  .e-bigger .e-dropdownbase,
@@ -2187,11 +2195,13 @@ ejs-dropdownlist {
2187
2195
  }
2188
2196
 
2189
2197
  .e-dropdownbase .e-list-item .e-list-icon {
2190
- padding: 0 16px 0 0;
2198
+ -webkit-padding-end: 16px;
2199
+ padding-inline-end: 16px;
2191
2200
  }
2192
2201
 
2193
2202
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
2194
- padding: 0 12px 0 0;
2203
+ -webkit-padding-end: 12px;
2204
+ padding-inline-end: 12px;
2195
2205
  }
2196
2206
 
2197
2207
  .e-multiselect.e-input-group.e-checkbox .e-multi-select-wrapper input[type=text] {
@@ -3540,11 +3550,13 @@ ejs-multiselect {
3540
3550
  }
3541
3551
 
3542
3552
  .e-dropdownbase .e-list-item .e-list-icon {
3543
- padding: 0 16px 0 0;
3553
+ -webkit-padding-end: 16px;
3554
+ padding-inline-end: 16px;
3544
3555
  }
3545
3556
 
3546
3557
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
3547
- padding: 0 12px 0 0;
3558
+ -webkit-padding-end: 12px;
3559
+ padding-inline-end: 12px;
3548
3560
  }
3549
3561
 
3550
3562
  .e-multiselect.e-input-group.e-checkbox .e-multi-select-wrapper input[type=text] {
package/styles/material-lite.css CHANGED
@@ -1,17 +1,21 @@
1
1
  .e-dropdownbase .e-list-item .e-list-icon {
2
- padding: 0 16px 0 0;
2
+ -webkit-padding-end: 16px;
3
+ padding-inline-end: 16px;
3
4
  }
4
5
 
5
6
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
6
- padding: 0 12px 0 0;
7
+ -webkit-padding-end: 12px;
8
+ padding-inline-end: 12px;
7
9
  }
8
10
 
9
11
  .e-dropdownbase .e-list-item .e-list-icon {
10
- padding: 0 16px 0 0;
12
+ -webkit-padding-end: 16px;
13
+ padding-inline-end: 16px;
11
14
  }
12
15
 
13
16
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
14
- padding: 0 12px 0 0;
17
+ -webkit-padding-end: 12px;
18
+ padding-inline-end: 12px;
15
19
  }
16
20
 
17
21
  .e-dropdownbase {
@@ -67,11 +71,11 @@
67
71
 
68
72
  .e-mention.e-popup {
69
73
  background: #fff;
70
- border: 0;
71
74
  -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
72
75
  box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
73
76
  margin-top: 2px;
74
77
  position: absolute;
78
+ border: 0;
75
79
  }
76
80
 
77
81
  .e-mention.e-popup .e-dropdownbase {
@@ -137,11 +141,13 @@
137
141
  }
138
142
 
139
143
  .e-dropdownbase .e-list-item .e-list-icon {
140
- padding: 0 16px 0 0;
144
+ -webkit-padding-end: 16px;
145
+ padding-inline-end: 16px;
141
146
  }
142
147
 
143
148
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
144
- padding: 0 12px 0 0;
149
+ -webkit-padding-end: 12px;
150
+ padding-inline-end: 12px;
145
151
  }
146
152
 
147
153
  .e-rtl .e-dropdownbase .e-list-item {
@@ -1713,11 +1719,13 @@ ejs-dropdownlist {
1713
1719
  }
1714
1720
 
1715
1721
  .e-dropdownbase .e-list-item .e-list-icon {
1716
- padding: 0 16px 0 0;
1722
+ -webkit-padding-end: 16px;
1723
+ padding-inline-end: 16px;
1717
1724
  }
1718
1725
 
1719
1726
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
1720
- padding: 0 12px 0 0;
1727
+ -webkit-padding-end: 12px;
1728
+ padding-inline-end: 12px;
1721
1729
  }
1722
1730
 
1723
1731
  .e-multiselect.e-input-group.e-checkbox .e-multi-select-wrapper input[type=text] {
package/styles/material.css CHANGED
@@ -1,17 +1,21 @@
1
1
  .e-dropdownbase .e-list-item .e-list-icon {
2
- padding: 0 16px 0 0;
2
+ -webkit-padding-end: 16px;
3
+ padding-inline-end: 16px;
3
4
  }
4
5
 
5
6
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
6
- padding: 0 12px 0 0;
7
+ -webkit-padding-end: 12px;
8
+ padding-inline-end: 12px;
7
9
  }
8
10
 
9
11
  .e-dropdownbase .e-list-item .e-list-icon {
10
- padding: 0 16px 0 0;
12
+ -webkit-padding-end: 16px;
13
+ padding-inline-end: 16px;
11
14
  }
12
15
 
13
16
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
14
- padding: 0 12px 0 0;
17
+ -webkit-padding-end: 12px;
18
+ padding-inline-end: 12px;
15
19
  }
16
20
 
17
21
  .e-dropdownbase {
@@ -67,11 +71,11 @@
67
71
 
68
72
  .e-mention.e-popup {
69
73
  background: #fff;
70
- border: 0;
71
74
  -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
72
75
  box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
73
76
  margin-top: 2px;
74
77
  position: absolute;
78
+ border: 0;
75
79
  }
76
80
 
77
81
  .e-mention.e-popup .e-dropdownbase {
@@ -137,11 +141,13 @@
137
141
  }
138
142
 
139
143
  .e-dropdownbase .e-list-item .e-list-icon {
140
- padding: 0 16px 0 0;
144
+ -webkit-padding-end: 16px;
145
+ padding-inline-end: 16px;
141
146
  }
142
147
 
143
148
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
144
- padding: 0 12px 0 0;
149
+ -webkit-padding-end: 12px;
150
+ padding-inline-end: 12px;
145
151
  }
146
152
 
147
153
  .e-rtl .e-dropdownbase .e-list-item {
@@ -320,11 +326,13 @@
320
326
  }
321
327
 
322
328
  .e-dropdownbase .e-list-item .e-list-icon {
323
- padding: 0 16px 0 0;
329
+ -webkit-padding-end: 16px;
330
+ padding-inline-end: 16px;
324
331
  }
325
332
 
326
333
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
327
- padding: 0 12px 0 0;
334
+ -webkit-padding-end: 12px;
335
+ padding-inline-end: 12px;
328
336
  }
329
337
 
330
338
  .e-bigger .e-dropdownbase,
@@ -2251,11 +2259,13 @@ ejs-dropdownlist {
2251
2259
  }
2252
2260
 
2253
2261
  .e-dropdownbase .e-list-item .e-list-icon {
2254
- padding: 0 16px 0 0;
2262
+ -webkit-padding-end: 16px;
2263
+ padding-inline-end: 16px;
2255
2264
  }
2256
2265
 
2257
2266
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
2258
- padding: 0 12px 0 0;
2267
+ -webkit-padding-end: 12px;
2268
+ padding-inline-end: 12px;
2259
2269
  }
2260
2270
 
2261
2271
  .e-multiselect.e-input-group.e-checkbox .e-multi-select-wrapper input[type=text] {
@@ -3617,11 +3627,13 @@ ejs-multiselect {
3617
3627
  }
3618
3628
 
3619
3629
  .e-dropdownbase .e-list-item .e-list-icon {
3620
- padding: 0 16px 0 0;
3630
+ -webkit-padding-end: 16px;
3631
+ padding-inline-end: 16px;
3621
3632
  }
3622
3633
 
3623
3634
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
3624
- padding: 0 12px 0 0;
3635
+ -webkit-padding-end: 12px;
3636
+ padding-inline-end: 12px;
3625
3637
  }
3626
3638
 
3627
3639
  .e-multiselect.e-input-group.e-checkbox .e-multi-select-wrapper input[type=text] {
package/styles/material3-dark-lite.css CHANGED
@@ -81,11 +81,13 @@
81
81
  /* 15px */
82
82
  /* 16px */
83
83
  .e-dropdownbase .e-list-item .e-list-icon {
84
- padding: 0 16px 0 0;
84
+ -webkit-padding-end: 16px;
85
+ padding-inline-end: 16px;
85
86
  }
86
87
 
87
88
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
88
- padding: 0 12px 0 0;
89
+ -webkit-padding-end: 12px;
90
+ padding-inline-end: 12px;
89
91
  }
90
92
 
91
93
 
@@ -171,11 +173,13 @@
171
173
  /* 15px */
172
174
  /* 16px */
173
175
  .e-dropdownbase .e-list-item .e-list-icon {
174
- padding: 0 16px 0 0;
176
+ -webkit-padding-end: 16px;
177
+ padding-inline-end: 16px;
175
178
  }
176
179
 
177
180
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
178
- padding: 0 12px 0 0;
181
+ -webkit-padding-end: 12px;
182
+ padding-inline-end: 12px;
179
183
  }
180
184
 
181
185
  .e-dropdownbase {
@@ -231,11 +235,13 @@
231
235
 
232
236
  .e-mention.e-popup {
233
237
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
234
- border: 0;
235
238
  -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
236
239
  box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
237
240
  margin-top: 2px;
238
241
  position: absolute;
242
+ border: 0;
243
+ border-radius: calc(var(--e-radius) * 0.25);
244
+ padding: 4px 0;
239
245
  }
240
246
 
241
247
  .e-mention.e-popup .e-dropdownbase {
@@ -382,11 +388,13 @@
382
388
  /* 15px */
383
389
  /* 16px */
384
390
  .e-dropdownbase .e-list-item .e-list-icon {
385
- padding: 0 16px 0 0;
391
+ -webkit-padding-end: 16px;
392
+ padding-inline-end: 16px;
386
393
  }
387
394
 
388
395
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
389
- padding: 0 12px 0 0;
396
+ -webkit-padding-end: 12px;
397
+ padding-inline-end: 12px;
390
398
  }
391
399
 
392
400
  .e-rtl .e-dropdownbase .e-list-item {
@@ -2776,11 +2784,13 @@ ejs-dropdownlist {
2776
2784
  /* 15px */
2777
2785
  /* 16px */
2778
2786
  .e-dropdownbase .e-list-item .e-list-icon {
2779
- padding: 0 16px 0 0;
2787
+ -webkit-padding-end: 16px;
2788
+ padding-inline-end: 16px;
2780
2789
  }
2781
2790
 
2782
2791
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
2783
- padding: 0 12px 0 0;
2792
+ -webkit-padding-end: 12px;
2793
+ padding-inline-end: 12px;
2784
2794
  }
2785
2795
 
2786
2796
 
package/styles/material3-dark.css CHANGED
@@ -81,11 +81,13 @@
81
81
  /* 15px */
82
82
  /* 16px */
83
83
  .e-dropdownbase .e-list-item .e-list-icon {
84
- padding: 0 16px 0 0;
84
+ -webkit-padding-end: 16px;
85
+ padding-inline-end: 16px;
85
86
  }
86
87
 
87
88
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
88
- padding: 0 12px 0 0;
89
+ -webkit-padding-end: 12px;
90
+ padding-inline-end: 12px;
89
91
  }
90
92
 
91
93
 
@@ -171,11 +173,13 @@
171
173
  /* 15px */
172
174
  /* 16px */
173
175
  .e-dropdownbase .e-list-item .e-list-icon {
174
- padding: 0 16px 0 0;
176
+ -webkit-padding-end: 16px;
177
+ padding-inline-end: 16px;
175
178
  }
176
179
 
177
180
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
178
- padding: 0 12px 0 0;
181
+ -webkit-padding-end: 12px;
182
+ padding-inline-end: 12px;
179
183
  }
180
184
 
181
185
  .e-dropdownbase {
@@ -231,11 +235,13 @@
231
235
 
232
236
  .e-mention.e-popup {
233
237
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.11), rgba(var(--color-sf-primary), 0.11)), rgba(var(--color-sf-surface));
234
- border: 0;
235
238
  -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
236
239
  box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
237
240
  margin-top: 2px;
238
241
  position: absolute;
242
+ border: 0;
243
+ border-radius: calc(var(--e-radius) * 0.25);
244
+ padding: 4px 0;
239
245
  }
240
246
 
241
247
  .e-mention.e-popup .e-dropdownbase {
@@ -382,11 +388,13 @@
382
388
  /* 15px */
383
389
  /* 16px */
384
390
  .e-dropdownbase .e-list-item .e-list-icon {
385
- padding: 0 16px 0 0;
391
+ -webkit-padding-end: 16px;
392
+ padding-inline-end: 16px;
386
393
  }
387
394
 
388
395
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
389
- padding: 0 12px 0 0;
396
+ -webkit-padding-end: 12px;
397
+ padding-inline-end: 12px;
390
398
  }
391
399
 
392
400
  .e-rtl .e-dropdownbase .e-list-item {
@@ -652,11 +660,13 @@
652
660
  /* 15px */
653
661
  /* 16px */
654
662
  .e-dropdownbase .e-list-item .e-list-icon {
655
- padding: 0 16px 0 0;
663
+ -webkit-padding-end: 16px;
664
+ padding-inline-end: 16px;
656
665
  }
657
666
 
658
667
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
659
- padding: 0 12px 0 0;
668
+ -webkit-padding-end: 12px;
669
+ padding-inline-end: 12px;
660
670
  }
661
671
 
662
672
  .e-bigger .e-dropdownbase,
@@ -3371,11 +3381,13 @@ ejs-dropdownlist {
3371
3381
  /* 15px */
3372
3382
  /* 16px */
3373
3383
  .e-dropdownbase .e-list-item .e-list-icon {
3374
- padding: 0 16px 0 0;
3384
+ -webkit-padding-end: 16px;
3385
+ padding-inline-end: 16px;
3375
3386
  }
3376
3387
 
3377
3388
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
3378
- padding: 0 12px 0 0;
3389
+ -webkit-padding-end: 12px;
3390
+ padding-inline-end: 12px;
3379
3391
  }
3380
3392
 
3381
3393
 
@@ -5547,11 +5559,13 @@ ejs-multiselect {
5547
5559
  /* 15px */
5548
5560
  /* 16px */
5549
5561
  .e-dropdownbase .e-list-item .e-list-icon {
5550
- padding: 0 16px 0 0;
5562
+ -webkit-padding-end: 16px;
5563
+ padding-inline-end: 16px;
5551
5564
  }
5552
5565
 
5553
5566
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
5554
- padding: 0 12px 0 0;
5567
+ -webkit-padding-end: 12px;
5568
+ padding-inline-end: 12px;
5555
5569
  }
5556
5570
 
5557
5571
 
package/styles/material3-lite.css CHANGED
@@ -83,11 +83,13 @@
83
83
 
84
84
 
85
85
  .e-dropdownbase .e-list-item .e-list-icon {
86
- padding: 0 16px 0 0;
86
+ -webkit-padding-end: 16px;
87
+ padding-inline-end: 16px;
87
88
  }
88
89
 
89
90
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
90
- padding: 0 12px 0 0;
91
+ -webkit-padding-end: 12px;
92
+ padding-inline-end: 12px;
91
93
  }
92
94
 
93
95
 
@@ -175,11 +177,13 @@
175
177
 
176
178
 
177
179
  .e-dropdownbase .e-list-item .e-list-icon {
178
- padding: 0 16px 0 0;
180
+ -webkit-padding-end: 16px;
181
+ padding-inline-end: 16px;
179
182
  }
180
183
 
181
184
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
182
- padding: 0 12px 0 0;
185
+ -webkit-padding-end: 12px;
186
+ padding-inline-end: 12px;
183
187
  }
184
188
 
185
189
  .e-dropdownbase {
@@ -235,11 +239,13 @@
235
239
 
236
240
  .e-mention.e-popup {
237
241
  background: linear-gradient(0deg, rgba(var(--color-sf-surface), 1), rgba(var(--color-sf-surface), 1)), rgba(var(--color-sf-surface));
238
- border: 0;
239
242
  -webkit-box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
240
243
  box-shadow: 0 2px 3px 1px rgba(0, 0, 0, 0.21);
241
244
  margin-top: 2px;
242
245
  position: absolute;
246
+ border: 0;
247
+ border-radius: calc(var(--e-radius) * 0.25);
248
+ padding: 4px 0;
243
249
  }
244
250
 
245
251
  .e-mention.e-popup .e-dropdownbase {
@@ -388,11 +394,13 @@
388
394
 
389
395
 
390
396
  .e-dropdownbase .e-list-item .e-list-icon {
391
- padding: 0 16px 0 0;
397
+ -webkit-padding-end: 16px;
398
+ padding-inline-end: 16px;
392
399
  }
393
400
 
394
401
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
395
- padding: 0 12px 0 0;
402
+ -webkit-padding-end: 12px;
403
+ padding-inline-end: 12px;
396
404
  }
397
405
 
398
406
  .e-rtl .e-dropdownbase .e-list-item {
@@ -2708,11 +2716,13 @@ ejs-dropdownlist {
2708
2716
 
2709
2717
 
2710
2718
  .e-dropdownbase .e-list-item .e-list-icon {
2711
- padding: 0 16px 0 0;
2719
+ -webkit-padding-end: 16px;
2720
+ padding-inline-end: 16px;
2712
2721
  }
2713
2722
 
2714
2723
  .e-small .e-dropdownbase .e-list-item .e-list-icon {
2715
- padding: 0 12px 0 0;
2724
+ -webkit-padding-end: 12px;
2725
+ padding-inline-end: 12px;
2716
2726
  }
2717
2727
 
2718
2728