@syncfusion/ej2-dropdowns 25.2.7 → 26.1.38

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 (267) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-dropdowns.min.js +2 -2
  3. package/dist/ej2-dropdowns.umd.min.js +2 -2
  4. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-dropdowns.es2015.js +531 -224
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +524 -216
  8. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  9. package/dist/global/ej2-dropdowns.min.js +2 -2
  10. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +14 -13
  13. package/src/auto-complete/auto-complete.js +1 -1
  14. package/src/combo-box/combo-box.js +15 -0
  15. package/src/common/interface.js +0 -1
  16. package/src/common/virtual-scroll.js +1 -0
  17. package/src/drop-down-base/drop-down-base-model.d.ts +8 -1
  18. package/src/drop-down-base/drop-down-base.d.ts +28 -2
  19. package/src/drop-down-base/drop-down-base.js +64 -9
  20. package/src/drop-down-list/drop-down-list.d.ts +15 -2
  21. package/src/drop-down-list/drop-down-list.js +129 -13
  22. package/src/drop-down-tree/drop-down-tree-model.d.ts +15 -15
  23. package/src/drop-down-tree/drop-down-tree.d.ts +17 -13
  24. package/src/drop-down-tree/drop-down-tree.js +67 -38
  25. package/src/list-box/list-box.d.ts +1 -0
  26. package/src/list-box/list-box.js +41 -9
  27. package/src/mention/mention.js +23 -8
  28. package/src/multi-select/interface.js +0 -1
  29. package/src/multi-select/multi-select.d.ts +15 -0
  30. package/src/multi-select/multi-select.js +135 -12
  31. package/styles/auto-complete/_bootstrap5.3-definition.scss +2 -0
  32. package/styles/auto-complete/_fluent2-definition.scss +2 -0
  33. package/styles/auto-complete/bootstrap-dark.css +5 -2
  34. package/styles/auto-complete/bootstrap.css +5 -2
  35. package/styles/auto-complete/bootstrap4.css +6 -2
  36. package/styles/auto-complete/bootstrap5-dark.css +6 -2
  37. package/styles/auto-complete/bootstrap5.css +6 -2
  38. package/styles/auto-complete/fabric-dark.css +3 -1
  39. package/styles/auto-complete/fabric.css +3 -1
  40. package/styles/auto-complete/fluent-dark.css +6 -2
  41. package/styles/auto-complete/fluent.css +6 -2
  42. package/styles/auto-complete/fluent2.css +1140 -0
  43. package/styles/auto-complete/fluent2.scss +4 -0
  44. package/styles/auto-complete/highcontrast-light.css +3 -1
  45. package/styles/auto-complete/highcontrast.css +3 -1
  46. package/styles/auto-complete/material-dark.css +16 -5
  47. package/styles/auto-complete/material.css +16 -5
  48. package/styles/auto-complete/material3-dark.css +17 -6
  49. package/styles/auto-complete/material3.css +17 -6
  50. package/styles/auto-complete/tailwind-dark.css +16 -5
  51. package/styles/auto-complete/tailwind.css +16 -5
  52. package/styles/bootstrap-dark.css +197 -228
  53. package/styles/bootstrap-dark.scss +28 -8
  54. package/styles/bootstrap.css +197 -228
  55. package/styles/bootstrap.scss +28 -8
  56. package/styles/bootstrap4.css +200 -229
  57. package/styles/bootstrap4.scss +28 -8
  58. package/styles/bootstrap5-dark.css +197 -221
  59. package/styles/bootstrap5-dark.scss +28 -8
  60. package/styles/bootstrap5.css +197 -221
  61. package/styles/bootstrap5.scss +28 -8
  62. package/styles/combo-box/_bootstrap5.3-definition.scss +2 -0
  63. package/styles/combo-box/_fluent2-definition.scss +2 -0
  64. package/styles/combo-box/bootstrap-dark.css +5 -2
  65. package/styles/combo-box/bootstrap.css +5 -2
  66. package/styles/combo-box/bootstrap4.css +6 -2
  67. package/styles/combo-box/bootstrap5-dark.css +6 -2
  68. package/styles/combo-box/bootstrap5.css +6 -2
  69. package/styles/combo-box/fabric-dark.css +3 -1
  70. package/styles/combo-box/fabric.css +3 -1
  71. package/styles/combo-box/fluent-dark.css +6 -2
  72. package/styles/combo-box/fluent.css +6 -2
  73. package/styles/combo-box/fluent2.css +1140 -0
  74. package/styles/combo-box/fluent2.scss +4 -0
  75. package/styles/combo-box/highcontrast-light.css +3 -1
  76. package/styles/combo-box/highcontrast.css +3 -1
  77. package/styles/combo-box/material-dark.css +16 -5
  78. package/styles/combo-box/material.css +16 -5
  79. package/styles/combo-box/material3-dark.css +17 -6
  80. package/styles/combo-box/material3.css +17 -6
  81. package/styles/combo-box/tailwind-dark.css +16 -5
  82. package/styles/combo-box/tailwind.css +16 -5
  83. package/styles/drop-down-base/_bds-definition.scss +2 -2
  84. package/styles/drop-down-base/_bootstrap5.3-definition.scss +117 -0
  85. package/styles/drop-down-base/_fluent2-definition.scss +134 -0
  86. package/styles/drop-down-base/_layout.scss +12 -2
  87. package/styles/drop-down-base/_material3-definition.scss +0 -11
  88. package/styles/drop-down-base/_theme.scss +2 -11
  89. package/styles/drop-down-base/bootstrap-dark.css +2 -1
  90. package/styles/drop-down-base/bootstrap.css +2 -1
  91. package/styles/drop-down-base/bootstrap4.css +2 -1
  92. package/styles/drop-down-base/bootstrap5-dark.css +2 -1
  93. package/styles/drop-down-base/bootstrap5.css +2 -1
  94. package/styles/drop-down-base/fabric-dark.css +2 -1
  95. package/styles/drop-down-base/fabric.css +2 -1
  96. package/styles/drop-down-base/fluent-dark.css +2 -1
  97. package/styles/drop-down-base/fluent.css +2 -1
  98. package/styles/drop-down-base/fluent2.css +1447 -0
  99. package/styles/drop-down-base/fluent2.scss +3 -0
  100. package/styles/drop-down-base/highcontrast-light.css +2 -1
  101. package/styles/drop-down-base/highcontrast.css +2 -1
  102. package/styles/drop-down-base/material-dark.css +2 -1
  103. package/styles/drop-down-base/material.css +2 -1
  104. package/styles/drop-down-base/material3-dark.css +9 -2
  105. package/styles/drop-down-base/material3.css +9 -2
  106. package/styles/drop-down-base/tailwind-dark.css +2 -1
  107. package/styles/drop-down-base/tailwind.css +2 -1
  108. package/styles/drop-down-list/_bootstrap5.3-definition.scss +201 -0
  109. package/styles/drop-down-list/_fluent2-definition.scss +134 -0
  110. package/styles/drop-down-list/_layout.scss +5 -3
  111. package/styles/drop-down-list/_material3-definition.scss +0 -8
  112. package/styles/drop-down-list/bootstrap-dark.css +38 -3
  113. package/styles/drop-down-list/bootstrap.css +38 -3
  114. package/styles/drop-down-list/bootstrap4.css +39 -3
  115. package/styles/drop-down-list/bootstrap5-dark.css +39 -3
  116. package/styles/drop-down-list/bootstrap5.css +39 -3
  117. package/styles/drop-down-list/fabric-dark.css +36 -2
  118. package/styles/drop-down-list/fabric.css +36 -2
  119. package/styles/drop-down-list/fluent-dark.css +39 -3
  120. package/styles/drop-down-list/fluent.css +39 -3
  121. package/styles/drop-down-list/fluent2.css +1684 -0
  122. package/styles/drop-down-list/fluent2.scss +9 -0
  123. package/styles/drop-down-list/highcontrast-light.css +36 -2
  124. package/styles/drop-down-list/highcontrast.css +36 -2
  125. package/styles/drop-down-list/icons/_bootstrap5.3.scss +14 -0
  126. package/styles/drop-down-list/icons/_fluent2.scss +14 -0
  127. package/styles/drop-down-list/material-dark.css +58 -7
  128. package/styles/drop-down-list/material.css +72 -9
  129. package/styles/drop-down-list/material3-dark.css +74 -10
  130. package/styles/drop-down-list/material3.css +74 -10
  131. package/styles/drop-down-list/tailwind-dark.css +49 -6
  132. package/styles/drop-down-list/tailwind.css +49 -6
  133. package/styles/drop-down-tree/_bds-definition.scss +5 -0
  134. package/styles/drop-down-tree/_bootstrap4-definition.scss +1 -0
  135. package/styles/drop-down-tree/_bootstrap5-definition.scss +5 -0
  136. package/styles/drop-down-tree/_bootstrap5.3-definition.scss +66 -0
  137. package/styles/drop-down-tree/_fluent-definition.scss +4 -0
  138. package/styles/drop-down-tree/_fluent2-definition.scss +75 -0
  139. package/styles/drop-down-tree/_layout.scss +290 -327
  140. package/styles/drop-down-tree/_material3-definition.scss +3 -5
  141. package/styles/drop-down-tree/_tailwind-definition.scss +7 -2
  142. package/styles/drop-down-tree/_theme.scss +24 -41
  143. package/styles/drop-down-tree/bootstrap-dark.css +64 -29
  144. package/styles/drop-down-tree/bootstrap.css +64 -29
  145. package/styles/drop-down-tree/bootstrap4.css +65 -30
  146. package/styles/drop-down-tree/bootstrap5-dark.css +64 -27
  147. package/styles/drop-down-tree/bootstrap5.css +64 -27
  148. package/styles/drop-down-tree/fabric-dark.css +64 -29
  149. package/styles/drop-down-tree/fabric.css +64 -29
  150. package/styles/drop-down-tree/fluent-dark.css +72 -35
  151. package/styles/drop-down-tree/fluent.css +72 -35
  152. package/styles/drop-down-tree/fluent2.css +1733 -0
  153. package/styles/drop-down-tree/fluent2.scss +9 -0
  154. package/styles/drop-down-tree/highcontrast-light.css +64 -29
  155. package/styles/drop-down-tree/highcontrast.css +64 -23
  156. package/styles/drop-down-tree/icons/_bootstrap5.3.scss +11 -0
  157. package/styles/drop-down-tree/icons/_fluent2.scss +14 -0
  158. package/styles/drop-down-tree/material-dark.css +81 -43
  159. package/styles/drop-down-tree/material.css +98 -51
  160. package/styles/drop-down-tree/material3-dark.css +86 -32
  161. package/styles/drop-down-tree/material3.css +86 -32
  162. package/styles/drop-down-tree/tailwind-dark.css +73 -28
  163. package/styles/drop-down-tree/tailwind.css +73 -28
  164. package/styles/fabric-dark.css +195 -227
  165. package/styles/fabric-dark.scss +28 -8
  166. package/styles/fabric.css +195 -227
  167. package/styles/fabric.scss +28 -8
  168. package/styles/fluent-dark.css +207 -236
  169. package/styles/fluent-dark.scss +28 -8
  170. package/styles/fluent.css +207 -236
  171. package/styles/fluent.scss +28 -8
  172. package/styles/fluent2.css +4772 -0
  173. package/styles/fluent2.scss +28 -0
  174. package/styles/highcontrast-light.css +198 -227
  175. package/styles/highcontrast-light.scss +28 -8
  176. package/styles/highcontrast.css +198 -221
  177. package/styles/highcontrast.scss +28 -8
  178. package/styles/list-box/_bootstrap-dark-definition.scss +0 -2
  179. package/styles/list-box/_bootstrap5.3-definition.scss +120 -0
  180. package/styles/list-box/_fabric-dark-definition.scss +0 -2
  181. package/styles/list-box/_fluent2-definition.scss +121 -0
  182. package/styles/list-box/_highcontrast-light-definition.scss +0 -2
  183. package/styles/list-box/_layout.scss +65 -44
  184. package/styles/list-box/_material-dark-definition.scss +0 -2
  185. package/styles/list-box/_tailwind-definition.scss +1 -1
  186. package/styles/list-box/_theme.scss +36 -65
  187. package/styles/list-box/bootstrap-dark.css +72 -112
  188. package/styles/list-box/bootstrap.css +72 -112
  189. package/styles/list-box/bootstrap4.css +72 -112
  190. package/styles/list-box/bootstrap5-dark.css +72 -106
  191. package/styles/list-box/bootstrap5.css +72 -106
  192. package/styles/list-box/fabric-dark.css +72 -112
  193. package/styles/list-box/fabric.css +72 -112
  194. package/styles/list-box/fluent-dark.css +72 -112
  195. package/styles/list-box/fluent.css +72 -112
  196. package/styles/list-box/fluent2.css +2029 -0
  197. package/styles/list-box/fluent2.scss +5 -0
  198. package/styles/list-box/highcontrast-light.css +72 -112
  199. package/styles/list-box/highcontrast.css +72 -112
  200. package/styles/list-box/icons/_bootstrap5.3.scss +25 -0
  201. package/styles/list-box/icons/_fluent2.scss +25 -0
  202. package/styles/list-box/material-dark.css +72 -112
  203. package/styles/list-box/material.css +72 -112
  204. package/styles/list-box/material3-dark.css +73 -113
  205. package/styles/list-box/material3.css +73 -113
  206. package/styles/list-box/tailwind-dark.css +74 -114
  207. package/styles/list-box/tailwind.css +74 -114
  208. package/styles/material-dark.css +237 -260
  209. package/styles/material-dark.scss +28 -8
  210. package/styles/material.css +254 -284
  211. package/styles/material.scss +28 -8
  212. package/styles/material3-dark.css +254 -266
  213. package/styles/material3-dark.scss +28 -8
  214. package/styles/material3.css +254 -266
  215. package/styles/material3.scss +28 -8
  216. package/styles/mention/_bootstrap5.3-definition.scss +1 -0
  217. package/styles/mention/_fluent2-definition.scss +1 -0
  218. package/styles/mention/bootstrap-dark.css +24 -0
  219. package/styles/mention/bootstrap.css +24 -0
  220. package/styles/mention/bootstrap4.css +24 -0
  221. package/styles/mention/bootstrap5-dark.css +24 -0
  222. package/styles/mention/bootstrap5.css +24 -0
  223. package/styles/mention/fabric-dark.css +24 -0
  224. package/styles/mention/fabric.css +24 -0
  225. package/styles/mention/fluent-dark.css +24 -0
  226. package/styles/mention/fluent.css +24 -0
  227. package/styles/mention/fluent2.css +1130 -0
  228. package/styles/mention/fluent2.scss +6 -0
  229. package/styles/mention/highcontrast-light.css +24 -0
  230. package/styles/mention/highcontrast.css +24 -0
  231. package/styles/mention/material-dark.css +24 -0
  232. package/styles/mention/material.css +24 -0
  233. package/styles/mention/material3-dark.css +25 -1
  234. package/styles/mention/material3.css +25 -1
  235. package/styles/mention/tailwind-dark.css +24 -0
  236. package/styles/mention/tailwind.css +24 -0
  237. package/styles/multi-select/_bootstrap5.3-definition.scss +230 -0
  238. package/styles/multi-select/_fluent2-definition.scss +236 -0
  239. package/styles/multi-select/_layout.scss +32 -38
  240. package/styles/multi-select/_material3-definition.scss +0 -15
  241. package/styles/multi-select/_theme.scss +0 -4
  242. package/styles/multi-select/bootstrap-dark.css +67 -28
  243. package/styles/multi-select/bootstrap.css +67 -28
  244. package/styles/multi-select/bootstrap4.css +70 -29
  245. package/styles/multi-select/bootstrap5-dark.css +67 -28
  246. package/styles/multi-select/bootstrap5.css +67 -28
  247. package/styles/multi-select/fabric-dark.css +67 -28
  248. package/styles/multi-select/fabric.css +67 -28
  249. package/styles/multi-select/fluent-dark.css +69 -29
  250. package/styles/multi-select/fluent.css +69 -29
  251. package/styles/multi-select/fluent2.css +2663 -0
  252. package/styles/multi-select/fluent2.scss +9 -0
  253. package/styles/multi-select/highcontrast-light.css +70 -28
  254. package/styles/multi-select/highcontrast.css +70 -28
  255. package/styles/multi-select/icons/_bootstrap5.3.scss +26 -0
  256. package/styles/multi-select/icons/_fluent2.scss +692 -0
  257. package/styles/multi-select/material-dark.css +88 -32
  258. package/styles/multi-select/material.css +102 -34
  259. package/styles/multi-select/material3-dark.css +109 -35
  260. package/styles/multi-select/material3.css +109 -35
  261. package/styles/multi-select/tailwind-dark.css +67 -28
  262. package/styles/multi-select/tailwind.css +67 -28
  263. package/styles/tailwind-dark.css +218 -233
  264. package/styles/tailwind-dark.scss +28 -8
  265. package/styles/tailwind.css +218 -233
  266. package/styles/tailwind.scss +28 -8
  267. package/CHANGELOG.md +0 -2200
@@ -1,19 +1,43 @@
1
1
  /* stylelint-disable property-no-vendor-prefix */
2
2
  /* stylelint-disable-line no-empty-source */
3
3
  /* stylelint-disable property-no-vendor-prefix */
4
+ @-webkit-keyframes material-spinner-rotate {
5
+ 0% {
6
+ -webkit-transform: rotate(0);
7
+ transform: rotate(0);
8
+ }
9
+ 100% {
10
+ -webkit-transform: rotate(360deg);
11
+ transform: rotate(360deg);
12
+ }
13
+ }
4
14
  @keyframes material-spinner-rotate {
5
15
  0% {
16
+ -webkit-transform: rotate(0);
17
+ transform: rotate(0);
18
+ }
19
+ 100% {
20
+ -webkit-transform: rotate(360deg);
21
+ transform: rotate(360deg);
22
+ }
23
+ }
24
+ @-webkit-keyframes fabric-spinner-rotate {
25
+ 0% {
26
+ -webkit-transform: rotate(0);
6
27
  transform: rotate(0);
7
28
  }
8
29
  100% {
30
+ -webkit-transform: rotate(360deg);
9
31
  transform: rotate(360deg);
10
32
  }
11
33
  }
12
34
  @keyframes fabric-spinner-rotate {
13
35
  0% {
36
+ -webkit-transform: rotate(0);
14
37
  transform: rotate(0);
15
38
  }
16
39
  100% {
40
+ -webkit-transform: rotate(360deg);
17
41
  transform: rotate(360deg);
18
42
  }
19
43
  }
@@ -80,12 +104,20 @@
80
104
  outline: none;
81
105
  }
82
106
  .e-ddt .e-ddt-icon::before {
83
- transform: rotate(0deg);
107
+ -webkit-transform: rotate(0deg);
108
+ transform: rotate(0deg);
109
+ -webkit-transition: -webkit-transform 300ms ease;
110
+ transition: -webkit-transform 300ms ease;
84
111
  transition: transform 300ms ease;
112
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
85
113
  }
86
114
  .e-ddt.e-icon-anim .e-ddt-icon::before {
87
- transform: rotate(180deg);
115
+ -webkit-transform: rotate(180deg);
116
+ transform: rotate(180deg);
117
+ -webkit-transition: -webkit-transform 300ms ease;
118
+ transition: -webkit-transform 300ms ease;
88
119
  transition: transform 300ms ease;
120
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
89
121
  }
90
122
  .e-ddt .e-ddt-hidden {
91
123
  border: 0;
@@ -94,7 +126,8 @@
94
126
  width: 0;
95
127
  }
96
128
  .e-ddt.e-input-group.e-control-wrapper .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper .e-clear-icon {
97
- box-sizing: content-box;
129
+ -webkit-box-sizing: content-box;
130
+ box-sizing: content-box;
98
131
  }
99
132
  .e-ddt.e-input-group.e-control-wrapper .e-input-group-icon.e-ddt-icon, .e-ddt.e-float-input.e-control-wrapper .e-input-group-icon.e-ddt-icon {
100
133
  border: 0;
@@ -124,6 +157,7 @@
124
157
  padding-right: 0;
125
158
  }
126
159
  .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 {
160
+ display: -webkit-box;
127
161
  display: -ms-flexbox;
128
162
  display: flex;
129
163
  }
@@ -131,20 +165,25 @@
131
165
  width: 100%;
132
166
  }
133
167
  .e-ddt.e-show-chip .e-chips-close {
134
- line-height: 10px;
135
168
  min-height: 16px;
136
169
  min-width: 16px;
170
+ line-height: 10px;
137
171
  text-align: center;
138
172
  }
139
173
  .e-ddt.e-show-chip .e-chips-close::before {
140
174
  font-size: 16px;
175
+ }
176
+ .e-ddt.e-show-chip .e-chips-close::before {
141
177
  vertical-align: middle;
142
178
  }
143
179
  .e-ddt.e-show-chip .e-chips {
144
- -ms-flex-align: center;
145
- align-items: center;
180
+ -webkit-box-align: center;
181
+ -ms-flex-align: center;
182
+ align-items: center;
146
183
  border-radius: 0px;
147
- box-sizing: border-box;
184
+ -webkit-box-sizing: border-box;
185
+ box-sizing: border-box;
186
+ display: -webkit-inline-box;
148
187
  display: -ms-inline-flexbox;
149
188
  display: inline-flex;
150
189
  float: left;
@@ -175,7 +214,8 @@
175
214
  padding-left: 8px;
176
215
  }
177
216
  .e-ddt .e-overflow.e-total-count {
178
- box-sizing: border-box;
217
+ -webkit-box-sizing: border-box;
218
+ box-sizing: border-box;
179
219
  display: inline-block;
180
220
  overflow: hidden;
181
221
  text-overflow: ellipsis;
@@ -219,12 +259,14 @@
219
259
  .e-ddt .e-dropdowntree.e-chip-input,
220
260
  .e-ddt input[readonly].e-input.e-chip-input {
221
261
  width: 0;
262
+ display: none;
222
263
  }
223
264
  .e-ddt.e-popup {
224
265
  border: 1px solid #4b5563;
225
- border-radius: 4px;
226
266
  margin-top: 4px;
227
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
267
+ border-radius: 4px;
268
+ -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
269
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
228
270
  position: absolute;
229
271
  }
230
272
  .e-ddt.e-popup .e-selectall-parent {
@@ -255,10 +297,10 @@
255
297
  line-height: 22px;
256
298
  }
257
299
  .e-ddt.e-popup .e-filter-wrap {
258
- border-bottom: 1px solid #4b5563;
259
300
  border-top-width: 0;
260
301
  display: block;
261
302
  padding: 4px;
303
+ border-bottom: 1px solid #4b5563;
262
304
  }
263
305
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
264
306
  margin-bottom: 0;
@@ -276,8 +318,8 @@
276
318
  cursor: default;
277
319
  font-family: inherit;
278
320
  font-size: 14px;
279
- padding: 8px 16px;
280
321
  text-align: center;
322
+ padding: 8px 16px;
281
323
  }
282
324
  .e-ddt.e-popup .e-popup-content.e-no-data .e-treeview {
283
325
  display: none;
@@ -331,16 +373,16 @@
331
373
  padding: 3px 12px;
332
374
  }
333
375
  .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
334
- margin-left: 18px;
335
376
  margin-right: 4px;
377
+ margin-left: 18px;
336
378
  }
337
379
  .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
338
- margin-left: 18px;
339
380
  margin-right: 4px;
381
+ margin-left: 18px;
340
382
  }
341
383
  .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
342
- margin-left: 45px;
343
384
  margin-right: 4px;
385
+ margin-left: 45px;
344
386
  }
345
387
  .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
346
388
  .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-text .e-clear-icon,
@@ -393,22 +435,14 @@
393
435
  }
394
436
  .e-bigger .e-ddt.e-show-chip .e-chips-close,
395
437
  .e-ddt.e-bigger.e-show-chip .e-chips-close {
396
- line-height: 18px;
397
438
  min-height: 24px;
398
439
  min-width: 24px;
440
+ line-height: 18px;
399
441
  }
400
442
  .e-bigger .e-ddt.e-show-chip .e-chips-close::before,
401
443
  .e-ddt.e-bigger.e-show-chip .e-chips-close::before {
402
444
  font-size: 20px;
403
445
  }
404
- .e-bigger .e-ddt .e-overflow.e-show-text,
405
- .e-ddt.e-bigger .e-overflow.e-show-text {
406
- padding: 7px 16px;
407
- }
408
- .e-bigger .e-ddt .e-overflow .e-remain,
409
- .e-ddt.e-bigger .e-overflow .e-remain {
410
- font-size: 16px;
411
- }
412
446
  .e-bigger .e-ddt.e-show-chip .e-overflow .e-remain.e-wrap-count,
413
447
  .e-ddt.e-bigger.e-show-chip .e-overflow .e-remain.e-wrap-count {
414
448
  line-height: 22px;
@@ -418,6 +452,14 @@
418
452
  .e-ddt.e-bigger.e-show-chip .e-overflow.e-total-count .e-remain {
419
453
  padding: 8px 12px;
420
454
  }
455
+ .e-bigger .e-ddt .e-overflow.e-show-text,
456
+ .e-ddt.e-bigger .e-overflow.e-show-text {
457
+ padding: 7px 16px;
458
+ }
459
+ .e-bigger .e-ddt .e-overflow .e-remain,
460
+ .e-ddt.e-bigger .e-overflow .e-remain {
461
+ font-size: 16px;
462
+ }
421
463
  .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
422
464
  .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
423
465
  max-width: calc(100% - 25px);
@@ -477,8 +519,8 @@
477
519
  }
478
520
  .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
479
521
  .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
480
- margin-left: 52px;
481
- margin-right: 4px;
522
+ margin-right: 52px;
523
+ margin-left: 4px;
482
524
  }
483
525
  .e-bigger .e-ddt.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon, .e-bigger .e-ddt.e-rtl.e-show-text.e-input-group.e-show-dd-icon .e-clear-icon,
484
526
  .e-ddt.e-bigger.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon,
@@ -504,10 +546,13 @@
504
546
  .e-ddt .e-chips:hover > .e-chipcontent {
505
547
  color: #fff;
506
548
  }
507
- .e-ddt.e-disabled .e-chips {
549
+ .e-ddt.e-disabled {
508
550
  background-color: #4b5563;
509
551
  }
510
- .e-ddt.e-disabled .e-chips > .e-chipcontent {
552
+ .e-ddt.e-disabled .e-chips-close::before {
553
+ color: #6b7280;
554
+ }
555
+ .e-ddt.e-disabled > .e-chipcontent {
511
556
  color: #6b7280;
512
557
  }
513
558
  .e-ddt .e-overflow .e-remain {
@@ -1,19 +1,43 @@
1
1
  /* stylelint-disable property-no-vendor-prefix */
2
2
  /* stylelint-disable-line no-empty-source */
3
3
  /* stylelint-disable property-no-vendor-prefix */
4
+ @-webkit-keyframes material-spinner-rotate {
5
+ 0% {
6
+ -webkit-transform: rotate(0);
7
+ transform: rotate(0);
8
+ }
9
+ 100% {
10
+ -webkit-transform: rotate(360deg);
11
+ transform: rotate(360deg);
12
+ }
13
+ }
4
14
  @keyframes material-spinner-rotate {
5
15
  0% {
16
+ -webkit-transform: rotate(0);
17
+ transform: rotate(0);
18
+ }
19
+ 100% {
20
+ -webkit-transform: rotate(360deg);
21
+ transform: rotate(360deg);
22
+ }
23
+ }
24
+ @-webkit-keyframes fabric-spinner-rotate {
25
+ 0% {
26
+ -webkit-transform: rotate(0);
6
27
  transform: rotate(0);
7
28
  }
8
29
  100% {
30
+ -webkit-transform: rotate(360deg);
9
31
  transform: rotate(360deg);
10
32
  }
11
33
  }
12
34
  @keyframes fabric-spinner-rotate {
13
35
  0% {
36
+ -webkit-transform: rotate(0);
14
37
  transform: rotate(0);
15
38
  }
16
39
  100% {
40
+ -webkit-transform: rotate(360deg);
17
41
  transform: rotate(360deg);
18
42
  }
19
43
  }
@@ -80,12 +104,20 @@
80
104
  outline: none;
81
105
  }
82
106
  .e-ddt .e-ddt-icon::before {
83
- transform: rotate(0deg);
107
+ -webkit-transform: rotate(0deg);
108
+ transform: rotate(0deg);
109
+ -webkit-transition: -webkit-transform 300ms ease;
110
+ transition: -webkit-transform 300ms ease;
84
111
  transition: transform 300ms ease;
112
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
85
113
  }
86
114
  .e-ddt.e-icon-anim .e-ddt-icon::before {
87
- transform: rotate(180deg);
115
+ -webkit-transform: rotate(180deg);
116
+ transform: rotate(180deg);
117
+ -webkit-transition: -webkit-transform 300ms ease;
118
+ transition: -webkit-transform 300ms ease;
88
119
  transition: transform 300ms ease;
120
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
89
121
  }
90
122
  .e-ddt .e-ddt-hidden {
91
123
  border: 0;
@@ -94,7 +126,8 @@
94
126
  width: 0;
95
127
  }
96
128
  .e-ddt.e-input-group.e-control-wrapper .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper .e-clear-icon {
97
- box-sizing: content-box;
129
+ -webkit-box-sizing: content-box;
130
+ box-sizing: content-box;
98
131
  }
99
132
  .e-ddt.e-input-group.e-control-wrapper .e-input-group-icon.e-ddt-icon, .e-ddt.e-float-input.e-control-wrapper .e-input-group-icon.e-ddt-icon {
100
133
  border: 0;
@@ -124,6 +157,7 @@
124
157
  padding-right: 0;
125
158
  }
126
159
  .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 {
160
+ display: -webkit-box;
127
161
  display: -ms-flexbox;
128
162
  display: flex;
129
163
  }
@@ -131,20 +165,25 @@
131
165
  width: 100%;
132
166
  }
133
167
  .e-ddt.e-show-chip .e-chips-close {
134
- line-height: 10px;
135
168
  min-height: 16px;
136
169
  min-width: 16px;
170
+ line-height: 10px;
137
171
  text-align: center;
138
172
  }
139
173
  .e-ddt.e-show-chip .e-chips-close::before {
140
174
  font-size: 16px;
175
+ }
176
+ .e-ddt.e-show-chip .e-chips-close::before {
141
177
  vertical-align: middle;
142
178
  }
143
179
  .e-ddt.e-show-chip .e-chips {
144
- -ms-flex-align: center;
145
- align-items: center;
180
+ -webkit-box-align: center;
181
+ -ms-flex-align: center;
182
+ align-items: center;
146
183
  border-radius: 0px;
147
- box-sizing: border-box;
184
+ -webkit-box-sizing: border-box;
185
+ box-sizing: border-box;
186
+ display: -webkit-inline-box;
148
187
  display: -ms-inline-flexbox;
149
188
  display: inline-flex;
150
189
  float: left;
@@ -175,7 +214,8 @@
175
214
  padding-left: 8px;
176
215
  }
177
216
  .e-ddt .e-overflow.e-total-count {
178
- box-sizing: border-box;
217
+ -webkit-box-sizing: border-box;
218
+ box-sizing: border-box;
179
219
  display: inline-block;
180
220
  overflow: hidden;
181
221
  text-overflow: ellipsis;
@@ -219,12 +259,14 @@
219
259
  .e-ddt .e-dropdowntree.e-chip-input,
220
260
  .e-ddt input[readonly].e-input.e-chip-input {
221
261
  width: 0;
262
+ display: none;
222
263
  }
223
264
  .e-ddt.e-popup {
224
265
  border: 1px solid #e5e7eb;
225
- border-radius: 4px;
226
266
  margin-top: 4px;
227
- box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
267
+ border-radius: 4px;
268
+ -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
269
+ box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
228
270
  position: absolute;
229
271
  }
230
272
  .e-ddt.e-popup .e-selectall-parent {
@@ -255,10 +297,10 @@
255
297
  line-height: 22px;
256
298
  }
257
299
  .e-ddt.e-popup .e-filter-wrap {
258
- border-bottom: 1px solid #e5e7eb;
259
300
  border-top-width: 0;
260
301
  display: block;
261
302
  padding: 4px;
303
+ border-bottom: 1px solid #e5e7eb;
262
304
  }
263
305
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
264
306
  margin-bottom: 0;
@@ -276,8 +318,8 @@
276
318
  cursor: default;
277
319
  font-family: inherit;
278
320
  font-size: 14px;
279
- padding: 8px 16px;
280
321
  text-align: center;
322
+ padding: 8px 16px;
281
323
  }
282
324
  .e-ddt.e-popup .e-popup-content.e-no-data .e-treeview {
283
325
  display: none;
@@ -331,16 +373,16 @@
331
373
  padding: 3px 12px;
332
374
  }
333
375
  .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
334
- margin-left: 18px;
335
376
  margin-right: 4px;
377
+ margin-left: 18px;
336
378
  }
337
379
  .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
338
- margin-left: 18px;
339
380
  margin-right: 4px;
381
+ margin-left: 18px;
340
382
  }
341
383
  .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
342
- margin-left: 45px;
343
384
  margin-right: 4px;
385
+ margin-left: 45px;
344
386
  }
345
387
  .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
346
388
  .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-text .e-clear-icon,
@@ -393,22 +435,14 @@
393
435
  }
394
436
  .e-bigger .e-ddt.e-show-chip .e-chips-close,
395
437
  .e-ddt.e-bigger.e-show-chip .e-chips-close {
396
- line-height: 18px;
397
438
  min-height: 24px;
398
439
  min-width: 24px;
440
+ line-height: 18px;
399
441
  }
400
442
  .e-bigger .e-ddt.e-show-chip .e-chips-close::before,
401
443
  .e-ddt.e-bigger.e-show-chip .e-chips-close::before {
402
444
  font-size: 20px;
403
445
  }
404
- .e-bigger .e-ddt .e-overflow.e-show-text,
405
- .e-ddt.e-bigger .e-overflow.e-show-text {
406
- padding: 7px 16px;
407
- }
408
- .e-bigger .e-ddt .e-overflow .e-remain,
409
- .e-ddt.e-bigger .e-overflow .e-remain {
410
- font-size: 16px;
411
- }
412
446
  .e-bigger .e-ddt.e-show-chip .e-overflow .e-remain.e-wrap-count,
413
447
  .e-ddt.e-bigger.e-show-chip .e-overflow .e-remain.e-wrap-count {
414
448
  line-height: 22px;
@@ -418,6 +452,14 @@
418
452
  .e-ddt.e-bigger.e-show-chip .e-overflow.e-total-count .e-remain {
419
453
  padding: 8px 12px;
420
454
  }
455
+ .e-bigger .e-ddt .e-overflow.e-show-text,
456
+ .e-ddt.e-bigger .e-overflow.e-show-text {
457
+ padding: 7px 16px;
458
+ }
459
+ .e-bigger .e-ddt .e-overflow .e-remain,
460
+ .e-ddt.e-bigger .e-overflow .e-remain {
461
+ font-size: 16px;
462
+ }
421
463
  .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
422
464
  .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
423
465
  max-width: calc(100% - 25px);
@@ -477,8 +519,8 @@
477
519
  }
478
520
  .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
479
521
  .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
480
- margin-left: 52px;
481
- margin-right: 4px;
522
+ margin-right: 52px;
523
+ margin-left: 4px;
482
524
  }
483
525
  .e-bigger .e-ddt.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon, .e-bigger .e-ddt.e-rtl.e-show-text.e-input-group.e-show-dd-icon .e-clear-icon,
484
526
  .e-ddt.e-bigger.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon,
@@ -504,10 +546,13 @@
504
546
  .e-ddt .e-chips:hover > .e-chipcontent {
505
547
  color: #111827;
506
548
  }
507
- .e-ddt.e-disabled .e-chips {
549
+ .e-ddt.e-disabled {
508
550
  background-color: #e5e7eb;
509
551
  }
510
- .e-ddt.e-disabled .e-chips > .e-chipcontent {
552
+ .e-ddt.e-disabled .e-chips-close::before {
553
+ color: #9ca3af;
554
+ }
555
+ .e-ddt.e-disabled > .e-chipcontent {
511
556
  color: #9ca3af;
512
557
  }
513
558
  .e-ddt .e-overflow .e-remain {