@syncfusion/ej2-dropdowns 25.2.7 → 26.1.35

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 (266) 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 +505 -224
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +498 -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 +52 -38
  25. package/src/list-box/list-box.js +30 -9
  26. package/src/mention/mention.js +23 -8
  27. package/src/multi-select/interface.js +0 -1
  28. package/src/multi-select/multi-select.d.ts +15 -0
  29. package/src/multi-select/multi-select.js +135 -12
  30. package/styles/auto-complete/_bootstrap5.3-definition.scss +2 -0
  31. package/styles/auto-complete/_fluent2-definition.scss +2 -0
  32. package/styles/auto-complete/bootstrap-dark.css +5 -2
  33. package/styles/auto-complete/bootstrap.css +5 -2
  34. package/styles/auto-complete/bootstrap4.css +6 -2
  35. package/styles/auto-complete/bootstrap5-dark.css +6 -2
  36. package/styles/auto-complete/bootstrap5.css +6 -2
  37. package/styles/auto-complete/fabric-dark.css +3 -1
  38. package/styles/auto-complete/fabric.css +3 -1
  39. package/styles/auto-complete/fluent-dark.css +6 -2
  40. package/styles/auto-complete/fluent.css +6 -2
  41. package/styles/auto-complete/fluent2.css +1140 -0
  42. package/styles/auto-complete/fluent2.scss +4 -0
  43. package/styles/auto-complete/highcontrast-light.css +3 -1
  44. package/styles/auto-complete/highcontrast.css +3 -1
  45. package/styles/auto-complete/material-dark.css +16 -5
  46. package/styles/auto-complete/material.css +16 -5
  47. package/styles/auto-complete/material3-dark.css +17 -6
  48. package/styles/auto-complete/material3.css +17 -6
  49. package/styles/auto-complete/tailwind-dark.css +16 -5
  50. package/styles/auto-complete/tailwind.css +16 -5
  51. package/styles/bootstrap-dark.css +196 -228
  52. package/styles/bootstrap-dark.scss +28 -8
  53. package/styles/bootstrap.css +196 -228
  54. package/styles/bootstrap.scss +28 -8
  55. package/styles/bootstrap4.css +199 -229
  56. package/styles/bootstrap4.scss +28 -8
  57. package/styles/bootstrap5-dark.css +196 -221
  58. package/styles/bootstrap5-dark.scss +28 -8
  59. package/styles/bootstrap5.css +196 -221
  60. package/styles/bootstrap5.scss +28 -8
  61. package/styles/combo-box/_bootstrap5.3-definition.scss +2 -0
  62. package/styles/combo-box/_fluent2-definition.scss +2 -0
  63. package/styles/combo-box/bootstrap-dark.css +5 -2
  64. package/styles/combo-box/bootstrap.css +5 -2
  65. package/styles/combo-box/bootstrap4.css +6 -2
  66. package/styles/combo-box/bootstrap5-dark.css +6 -2
  67. package/styles/combo-box/bootstrap5.css +6 -2
  68. package/styles/combo-box/fabric-dark.css +3 -1
  69. package/styles/combo-box/fabric.css +3 -1
  70. package/styles/combo-box/fluent-dark.css +6 -2
  71. package/styles/combo-box/fluent.css +6 -2
  72. package/styles/combo-box/fluent2.css +1140 -0
  73. package/styles/combo-box/fluent2.scss +4 -0
  74. package/styles/combo-box/highcontrast-light.css +3 -1
  75. package/styles/combo-box/highcontrast.css +3 -1
  76. package/styles/combo-box/material-dark.css +16 -5
  77. package/styles/combo-box/material.css +16 -5
  78. package/styles/combo-box/material3-dark.css +17 -6
  79. package/styles/combo-box/material3.css +17 -6
  80. package/styles/combo-box/tailwind-dark.css +16 -5
  81. package/styles/combo-box/tailwind.css +16 -5
  82. package/styles/drop-down-base/_bds-definition.scss +2 -2
  83. package/styles/drop-down-base/_bootstrap5.3-definition.scss +117 -0
  84. package/styles/drop-down-base/_fluent2-definition.scss +134 -0
  85. package/styles/drop-down-base/_layout.scss +12 -2
  86. package/styles/drop-down-base/_material3-definition.scss +0 -11
  87. package/styles/drop-down-base/_theme.scss +2 -11
  88. package/styles/drop-down-base/bootstrap-dark.css +2 -1
  89. package/styles/drop-down-base/bootstrap.css +2 -1
  90. package/styles/drop-down-base/bootstrap4.css +2 -1
  91. package/styles/drop-down-base/bootstrap5-dark.css +2 -1
  92. package/styles/drop-down-base/bootstrap5.css +2 -1
  93. package/styles/drop-down-base/fabric-dark.css +2 -1
  94. package/styles/drop-down-base/fabric.css +2 -1
  95. package/styles/drop-down-base/fluent-dark.css +2 -1
  96. package/styles/drop-down-base/fluent.css +2 -1
  97. package/styles/drop-down-base/fluent2.css +1447 -0
  98. package/styles/drop-down-base/fluent2.scss +3 -0
  99. package/styles/drop-down-base/highcontrast-light.css +2 -1
  100. package/styles/drop-down-base/highcontrast.css +2 -1
  101. package/styles/drop-down-base/material-dark.css +2 -1
  102. package/styles/drop-down-base/material.css +2 -1
  103. package/styles/drop-down-base/material3-dark.css +9 -2
  104. package/styles/drop-down-base/material3.css +9 -2
  105. package/styles/drop-down-base/tailwind-dark.css +2 -1
  106. package/styles/drop-down-base/tailwind.css +2 -1
  107. package/styles/drop-down-list/_bootstrap5.3-definition.scss +201 -0
  108. package/styles/drop-down-list/_fluent2-definition.scss +134 -0
  109. package/styles/drop-down-list/_layout.scss +5 -3
  110. package/styles/drop-down-list/_material3-definition.scss +0 -8
  111. package/styles/drop-down-list/bootstrap-dark.css +38 -3
  112. package/styles/drop-down-list/bootstrap.css +38 -3
  113. package/styles/drop-down-list/bootstrap4.css +39 -3
  114. package/styles/drop-down-list/bootstrap5-dark.css +39 -3
  115. package/styles/drop-down-list/bootstrap5.css +39 -3
  116. package/styles/drop-down-list/fabric-dark.css +36 -2
  117. package/styles/drop-down-list/fabric.css +36 -2
  118. package/styles/drop-down-list/fluent-dark.css +39 -3
  119. package/styles/drop-down-list/fluent.css +39 -3
  120. package/styles/drop-down-list/fluent2.css +1684 -0
  121. package/styles/drop-down-list/fluent2.scss +9 -0
  122. package/styles/drop-down-list/highcontrast-light.css +36 -2
  123. package/styles/drop-down-list/highcontrast.css +36 -2
  124. package/styles/drop-down-list/icons/_bootstrap5.3.scss +14 -0
  125. package/styles/drop-down-list/icons/_fluent2.scss +14 -0
  126. package/styles/drop-down-list/material-dark.css +58 -7
  127. package/styles/drop-down-list/material.css +72 -9
  128. package/styles/drop-down-list/material3-dark.css +74 -10
  129. package/styles/drop-down-list/material3.css +74 -10
  130. package/styles/drop-down-list/tailwind-dark.css +49 -6
  131. package/styles/drop-down-list/tailwind.css +49 -6
  132. package/styles/drop-down-tree/_bds-definition.scss +5 -0
  133. package/styles/drop-down-tree/_bootstrap4-definition.scss +1 -0
  134. package/styles/drop-down-tree/_bootstrap5-definition.scss +5 -0
  135. package/styles/drop-down-tree/_bootstrap5.3-definition.scss +66 -0
  136. package/styles/drop-down-tree/_fluent-definition.scss +4 -0
  137. package/styles/drop-down-tree/_fluent2-definition.scss +75 -0
  138. package/styles/drop-down-tree/_layout.scss +289 -327
  139. package/styles/drop-down-tree/_material3-definition.scss +3 -5
  140. package/styles/drop-down-tree/_tailwind-definition.scss +7 -2
  141. package/styles/drop-down-tree/_theme.scss +24 -41
  142. package/styles/drop-down-tree/bootstrap-dark.css +63 -29
  143. package/styles/drop-down-tree/bootstrap.css +63 -29
  144. package/styles/drop-down-tree/bootstrap4.css +64 -30
  145. package/styles/drop-down-tree/bootstrap5-dark.css +63 -27
  146. package/styles/drop-down-tree/bootstrap5.css +63 -27
  147. package/styles/drop-down-tree/fabric-dark.css +63 -29
  148. package/styles/drop-down-tree/fabric.css +63 -29
  149. package/styles/drop-down-tree/fluent-dark.css +71 -35
  150. package/styles/drop-down-tree/fluent.css +71 -35
  151. package/styles/drop-down-tree/fluent2.css +1732 -0
  152. package/styles/drop-down-tree/fluent2.scss +9 -0
  153. package/styles/drop-down-tree/highcontrast-light.css +63 -29
  154. package/styles/drop-down-tree/highcontrast.css +63 -23
  155. package/styles/drop-down-tree/icons/_bootstrap5.3.scss +11 -0
  156. package/styles/drop-down-tree/icons/_fluent2.scss +14 -0
  157. package/styles/drop-down-tree/material-dark.css +80 -43
  158. package/styles/drop-down-tree/material.css +97 -51
  159. package/styles/drop-down-tree/material3-dark.css +85 -32
  160. package/styles/drop-down-tree/material3.css +85 -32
  161. package/styles/drop-down-tree/tailwind-dark.css +72 -28
  162. package/styles/drop-down-tree/tailwind.css +72 -28
  163. package/styles/fabric-dark.css +194 -227
  164. package/styles/fabric-dark.scss +28 -8
  165. package/styles/fabric.css +194 -227
  166. package/styles/fabric.scss +28 -8
  167. package/styles/fluent-dark.css +206 -236
  168. package/styles/fluent-dark.scss +28 -8
  169. package/styles/fluent.css +206 -236
  170. package/styles/fluent.scss +28 -8
  171. package/styles/fluent2.css +4771 -0
  172. package/styles/fluent2.scss +28 -0
  173. package/styles/highcontrast-light.css +197 -227
  174. package/styles/highcontrast-light.scss +28 -8
  175. package/styles/highcontrast.css +197 -221
  176. package/styles/highcontrast.scss +28 -8
  177. package/styles/list-box/_bootstrap-dark-definition.scss +0 -2
  178. package/styles/list-box/_bootstrap5.3-definition.scss +120 -0
  179. package/styles/list-box/_fabric-dark-definition.scss +0 -2
  180. package/styles/list-box/_fluent2-definition.scss +121 -0
  181. package/styles/list-box/_highcontrast-light-definition.scss +0 -2
  182. package/styles/list-box/_layout.scss +65 -44
  183. package/styles/list-box/_material-dark-definition.scss +0 -2
  184. package/styles/list-box/_tailwind-definition.scss +1 -1
  185. package/styles/list-box/_theme.scss +36 -65
  186. package/styles/list-box/bootstrap-dark.css +72 -112
  187. package/styles/list-box/bootstrap.css +72 -112
  188. package/styles/list-box/bootstrap4.css +72 -112
  189. package/styles/list-box/bootstrap5-dark.css +72 -106
  190. package/styles/list-box/bootstrap5.css +72 -106
  191. package/styles/list-box/fabric-dark.css +72 -112
  192. package/styles/list-box/fabric.css +72 -112
  193. package/styles/list-box/fluent-dark.css +72 -112
  194. package/styles/list-box/fluent.css +72 -112
  195. package/styles/list-box/fluent2.css +2029 -0
  196. package/styles/list-box/fluent2.scss +5 -0
  197. package/styles/list-box/highcontrast-light.css +72 -112
  198. package/styles/list-box/highcontrast.css +72 -112
  199. package/styles/list-box/icons/_bootstrap5.3.scss +25 -0
  200. package/styles/list-box/icons/_fluent2.scss +25 -0
  201. package/styles/list-box/material-dark.css +72 -112
  202. package/styles/list-box/material.css +72 -112
  203. package/styles/list-box/material3-dark.css +73 -113
  204. package/styles/list-box/material3.css +73 -113
  205. package/styles/list-box/tailwind-dark.css +74 -114
  206. package/styles/list-box/tailwind.css +74 -114
  207. package/styles/material-dark.css +236 -260
  208. package/styles/material-dark.scss +28 -8
  209. package/styles/material.css +253 -284
  210. package/styles/material.scss +28 -8
  211. package/styles/material3-dark.css +253 -266
  212. package/styles/material3-dark.scss +28 -8
  213. package/styles/material3.css +253 -266
  214. package/styles/material3.scss +28 -8
  215. package/styles/mention/_bootstrap5.3-definition.scss +1 -0
  216. package/styles/mention/_fluent2-definition.scss +1 -0
  217. package/styles/mention/bootstrap-dark.css +24 -0
  218. package/styles/mention/bootstrap.css +24 -0
  219. package/styles/mention/bootstrap4.css +24 -0
  220. package/styles/mention/bootstrap5-dark.css +24 -0
  221. package/styles/mention/bootstrap5.css +24 -0
  222. package/styles/mention/fabric-dark.css +24 -0
  223. package/styles/mention/fabric.css +24 -0
  224. package/styles/mention/fluent-dark.css +24 -0
  225. package/styles/mention/fluent.css +24 -0
  226. package/styles/mention/fluent2.css +1130 -0
  227. package/styles/mention/fluent2.scss +6 -0
  228. package/styles/mention/highcontrast-light.css +24 -0
  229. package/styles/mention/highcontrast.css +24 -0
  230. package/styles/mention/material-dark.css +24 -0
  231. package/styles/mention/material.css +24 -0
  232. package/styles/mention/material3-dark.css +25 -1
  233. package/styles/mention/material3.css +25 -1
  234. package/styles/mention/tailwind-dark.css +24 -0
  235. package/styles/mention/tailwind.css +24 -0
  236. package/styles/multi-select/_bootstrap5.3-definition.scss +230 -0
  237. package/styles/multi-select/_fluent2-definition.scss +236 -0
  238. package/styles/multi-select/_layout.scss +32 -38
  239. package/styles/multi-select/_material3-definition.scss +0 -15
  240. package/styles/multi-select/_theme.scss +0 -4
  241. package/styles/multi-select/bootstrap-dark.css +67 -28
  242. package/styles/multi-select/bootstrap.css +67 -28
  243. package/styles/multi-select/bootstrap4.css +70 -29
  244. package/styles/multi-select/bootstrap5-dark.css +67 -28
  245. package/styles/multi-select/bootstrap5.css +67 -28
  246. package/styles/multi-select/fabric-dark.css +67 -28
  247. package/styles/multi-select/fabric.css +67 -28
  248. package/styles/multi-select/fluent-dark.css +69 -29
  249. package/styles/multi-select/fluent.css +69 -29
  250. package/styles/multi-select/fluent2.css +2663 -0
  251. package/styles/multi-select/fluent2.scss +9 -0
  252. package/styles/multi-select/highcontrast-light.css +70 -28
  253. package/styles/multi-select/highcontrast.css +70 -28
  254. package/styles/multi-select/icons/_bootstrap5.3.scss +26 -0
  255. package/styles/multi-select/icons/_fluent2.scss +692 -0
  256. package/styles/multi-select/material-dark.css +88 -32
  257. package/styles/multi-select/material.css +102 -34
  258. package/styles/multi-select/material3-dark.css +109 -35
  259. package/styles/multi-select/material3.css +109 -35
  260. package/styles/multi-select/tailwind-dark.css +67 -28
  261. package/styles/multi-select/tailwind.css +67 -28
  262. package/styles/tailwind-dark.css +217 -233
  263. package/styles/tailwind-dark.scss +28 -8
  264. package/styles/tailwind.css +217 -233
  265. package/styles/tailwind.scss +28 -8
  266. package/CHANGELOG.md +0 -2200
@@ -0,0 +1,9 @@
1
+ @import 'ej2-base/styles/definition/fluent2.scss';
2
+ @import 'ej2-inputs/styles/input/fluent2-definition.scss';
3
+ @import 'ej2-popups/styles/popup/fluent2-definition.scss';
4
+ @import 'ej2-popups/styles/spinner/fluent2-definition.scss';
5
+ @import 'ej2-navigations/styles/treeview/fluent2-definition.scss';
6
+ @import '../drop-down-base/fluent2-definition.scss';
7
+ @import 'fluent2-definition.scss';
8
+ @import 'icons/fluent2.scss';
9
+ @import 'all.scss';
@@ -1,18 +1,42 @@
1
1
  /* stylelint-disable property-no-vendor-prefix */
2
2
  /* stylelint-disable property-no-vendor-prefix */
3
+ @-webkit-keyframes material-spinner-rotate {
4
+ 0% {
5
+ -webkit-transform: rotate(0);
6
+ transform: rotate(0);
7
+ }
8
+ 100% {
9
+ -webkit-transform: rotate(360deg);
10
+ transform: rotate(360deg);
11
+ }
12
+ }
3
13
  @keyframes material-spinner-rotate {
4
14
  0% {
15
+ -webkit-transform: rotate(0);
16
+ transform: rotate(0);
17
+ }
18
+ 100% {
19
+ -webkit-transform: rotate(360deg);
20
+ transform: rotate(360deg);
21
+ }
22
+ }
23
+ @-webkit-keyframes fabric-spinner-rotate {
24
+ 0% {
25
+ -webkit-transform: rotate(0);
5
26
  transform: rotate(0);
6
27
  }
7
28
  100% {
29
+ -webkit-transform: rotate(360deg);
8
30
  transform: rotate(360deg);
9
31
  }
10
32
  }
11
33
  @keyframes fabric-spinner-rotate {
12
34
  0% {
35
+ -webkit-transform: rotate(0);
13
36
  transform: rotate(0);
14
37
  }
15
38
  100% {
39
+ -webkit-transform: rotate(360deg);
16
40
  transform: rotate(360deg);
17
41
  }
18
42
  }
@@ -57,12 +81,20 @@
57
81
  outline: none;
58
82
  }
59
83
  .e-ddt .e-ddt-icon::before {
60
- transform: rotate(0deg);
84
+ -webkit-transform: rotate(0deg);
85
+ transform: rotate(0deg);
86
+ -webkit-transition: -webkit-transform 300ms ease;
87
+ transition: -webkit-transform 300ms ease;
61
88
  transition: transform 300ms ease;
89
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
62
90
  }
63
91
  .e-ddt.e-icon-anim .e-ddt-icon::before {
64
- transform: rotate(180deg);
92
+ -webkit-transform: rotate(180deg);
93
+ transform: rotate(180deg);
94
+ -webkit-transition: -webkit-transform 300ms ease;
95
+ transition: -webkit-transform 300ms ease;
65
96
  transition: transform 300ms ease;
97
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
66
98
  }
67
99
  .e-ddt .e-ddt-hidden {
68
100
  border: 0;
@@ -71,7 +103,8 @@
71
103
  width: 0;
72
104
  }
73
105
  .e-ddt.e-input-group.e-control-wrapper .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper .e-clear-icon {
74
- box-sizing: content-box;
106
+ -webkit-box-sizing: content-box;
107
+ box-sizing: content-box;
75
108
  min-height: 30px;
76
109
  }
77
110
  .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 {
@@ -102,6 +135,7 @@
102
135
  padding-right: 0;
103
136
  }
104
137
  .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 {
138
+ display: -webkit-box;
105
139
  display: -ms-flexbox;
106
140
  display: flex;
107
141
  }
@@ -109,20 +143,25 @@
109
143
  width: 100%;
110
144
  }
111
145
  .e-ddt.e-show-chip .e-chips-close {
112
- line-height: 21px;
113
146
  min-height: 26px;
114
147
  min-width: 18px;
148
+ line-height: 21px;
115
149
  text-align: center;
116
150
  }
117
151
  .e-ddt.e-show-chip .e-chips-close::before {
118
152
  font-size: 10px;
153
+ }
154
+ .e-ddt.e-show-chip .e-chips-close::before {
119
155
  vertical-align: middle;
120
156
  }
121
157
  .e-ddt.e-show-chip .e-chips {
122
- -ms-flex-align: center;
123
- align-items: center;
158
+ -webkit-box-align: center;
159
+ -ms-flex-align: center;
160
+ align-items: center;
124
161
  border-radius: 0;
125
- box-sizing: border-box;
162
+ -webkit-box-sizing: border-box;
163
+ box-sizing: border-box;
164
+ display: -webkit-inline-box;
126
165
  display: -ms-inline-flexbox;
127
166
  display: inline-flex;
128
167
  float: left;
@@ -150,7 +189,8 @@
150
189
  padding: 6px 10px 0 10px;
151
190
  }
152
191
  .e-ddt .e-overflow.e-total-count {
153
- box-sizing: border-box;
192
+ -webkit-box-sizing: border-box;
193
+ box-sizing: border-box;
154
194
  display: inline-block;
155
195
  overflow: hidden;
156
196
  text-overflow: ellipsis;
@@ -197,7 +237,8 @@
197
237
  }
198
238
  .e-ddt.e-popup {
199
239
  border: 1px solid #757575;
200
- box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
240
+ -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
241
+ box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
201
242
  position: absolute;
202
243
  }
203
244
  .e-ddt.e-popup .e-selectall-parent {
@@ -223,19 +264,18 @@
223
264
  font-size: 14px;
224
265
  margin: 10px;
225
266
  }
226
- .e-ddt.e-popup .e-filter-wrap .e-input, .e-ddt.e-popup .e-filter-wrap .e-input:focus {
227
- padding: 0 12px;
228
- }
229
267
  .e-ddt.e-popup .e-filter-wrap {
230
- border: 1px solid #000;
231
268
  border-top-width: 0;
232
269
  display: block;
233
270
  padding: 5px;
234
- }
235
- .e-ddt.e-popup .e-filter-wrap {
271
+ border: 1px solid #000;
236
272
  border-left-width: 0;
237
273
  border-right-width: 0;
238
274
  }
275
+ .e-ddt.e-popup .e-filter-wrap .e-input,
276
+ .e-ddt.e-popup .e-filter-wrap .e-input:focus {
277
+ padding: 0 12px;
278
+ }
239
279
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
240
280
  margin-bottom: 0;
241
281
  }
@@ -250,8 +290,8 @@
250
290
  cursor: default;
251
291
  font-family: inherit;
252
292
  font-size: 14px;
253
- padding: 14px 16px;
254
293
  text-align: center;
294
+ padding: 14px 16px;
255
295
  }
256
296
  .e-ddt.e-popup .e-popup-content.e-no-data .e-treeview {
257
297
  display: none;
@@ -306,16 +346,16 @@
306
346
  padding: 6px 10px 0 10px;
307
347
  }
308
348
  .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
309
- margin-left: 30px;
310
349
  margin-right: 1px;
350
+ margin-left: 30px;
311
351
  }
312
352
  .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
313
- margin-left: 30px;
314
353
  margin-right: 1px;
354
+ margin-left: 30px;
315
355
  }
316
356
  .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
317
- margin-left: 60px;
318
357
  margin-right: 1px;
358
+ margin-left: 60px;
319
359
  }
320
360
  .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
321
361
  .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,
@@ -388,18 +428,18 @@
388
428
  }
389
429
  .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
390
430
  .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
391
- margin-left: 38px;
392
431
  margin-right: 1px;
432
+ margin-left: 38px;
393
433
  }
394
434
  .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child,
395
435
  .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
396
- margin-left: 38px;
397
436
  margin-right: 1px;
437
+ margin-left: 38px;
398
438
  }
399
439
  .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
400
440
  .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
401
- margin-left: 76px;
402
- margin-right: 1px;
441
+ margin-right: 76px;
442
+ margin-left: 1px;
403
443
  }
404
444
  .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,
405
445
  .e-ddt.e-bigger.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon,
@@ -417,12 +457,6 @@
417
457
  .e-ddt .e-chips > .e-chipcontent {
418
458
  color: #fff;
419
459
  }
420
- .e-ddt .e-chips:hover {
421
- background-color: #ecf;
422
- }
423
- .e-ddt .e-chips:hover > .e-chipcontent {
424
- color: #000;
425
- }
426
460
  .e-ddt .e-overflow .e-remain {
427
461
  color: #000;
428
462
  }
@@ -1,18 +1,42 @@
1
1
  /* stylelint-disable property-no-vendor-prefix */
2
2
  /* stylelint-disable property-no-vendor-prefix */
3
+ @-webkit-keyframes material-spinner-rotate {
4
+ 0% {
5
+ -webkit-transform: rotate(0);
6
+ transform: rotate(0);
7
+ }
8
+ 100% {
9
+ -webkit-transform: rotate(360deg);
10
+ transform: rotate(360deg);
11
+ }
12
+ }
3
13
  @keyframes material-spinner-rotate {
4
14
  0% {
15
+ -webkit-transform: rotate(0);
16
+ transform: rotate(0);
17
+ }
18
+ 100% {
19
+ -webkit-transform: rotate(360deg);
20
+ transform: rotate(360deg);
21
+ }
22
+ }
23
+ @-webkit-keyframes fabric-spinner-rotate {
24
+ 0% {
25
+ -webkit-transform: rotate(0);
5
26
  transform: rotate(0);
6
27
  }
7
28
  100% {
29
+ -webkit-transform: rotate(360deg);
8
30
  transform: rotate(360deg);
9
31
  }
10
32
  }
11
33
  @keyframes fabric-spinner-rotate {
12
34
  0% {
35
+ -webkit-transform: rotate(0);
13
36
  transform: rotate(0);
14
37
  }
15
38
  100% {
39
+ -webkit-transform: rotate(360deg);
16
40
  transform: rotate(360deg);
17
41
  }
18
42
  }
@@ -58,12 +82,20 @@
58
82
  outline: none;
59
83
  }
60
84
  .e-ddt .e-ddt-icon::before {
61
- transform: rotate(0deg);
85
+ -webkit-transform: rotate(0deg);
86
+ transform: rotate(0deg);
87
+ -webkit-transition: -webkit-transform 300ms ease;
88
+ transition: -webkit-transform 300ms ease;
62
89
  transition: transform 300ms ease;
90
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
63
91
  }
64
92
  .e-ddt.e-icon-anim .e-ddt-icon::before {
65
- transform: rotate(180deg);
93
+ -webkit-transform: rotate(180deg);
94
+ transform: rotate(180deg);
95
+ -webkit-transition: -webkit-transform 300ms ease;
96
+ transition: -webkit-transform 300ms ease;
66
97
  transition: transform 300ms ease;
98
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
67
99
  }
68
100
  .e-ddt .e-ddt-hidden {
69
101
  border: 0;
@@ -72,7 +104,8 @@
72
104
  width: 0;
73
105
  }
74
106
  .e-ddt.e-input-group.e-control-wrapper .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper .e-clear-icon {
75
- box-sizing: content-box;
107
+ -webkit-box-sizing: content-box;
108
+ box-sizing: content-box;
76
109
  min-height: 30px;
77
110
  }
78
111
  .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 {
@@ -103,6 +136,7 @@
103
136
  padding-right: 0;
104
137
  }
105
138
  .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 {
139
+ display: -webkit-box;
106
140
  display: -ms-flexbox;
107
141
  display: flex;
108
142
  }
@@ -110,20 +144,25 @@
110
144
  width: 100%;
111
145
  }
112
146
  .e-ddt.e-show-chip .e-chips-close {
113
- line-height: 21px;
114
147
  min-height: 26px;
115
148
  min-width: 18px;
149
+ line-height: 21px;
116
150
  text-align: center;
117
151
  }
118
152
  .e-ddt.e-show-chip .e-chips-close::before {
119
153
  font-size: 10px;
154
+ }
155
+ .e-ddt.e-show-chip .e-chips-close::before {
120
156
  vertical-align: middle;
121
157
  }
122
158
  .e-ddt.e-show-chip .e-chips {
123
- -ms-flex-align: center;
124
- align-items: center;
159
+ -webkit-box-align: center;
160
+ -ms-flex-align: center;
161
+ align-items: center;
125
162
  border-radius: 0;
126
- box-sizing: border-box;
163
+ -webkit-box-sizing: border-box;
164
+ box-sizing: border-box;
165
+ display: -webkit-inline-box;
127
166
  display: -ms-inline-flexbox;
128
167
  display: inline-flex;
129
168
  float: left;
@@ -151,7 +190,8 @@
151
190
  padding: 6px 10px 0 10px;
152
191
  }
153
192
  .e-ddt .e-overflow.e-total-count {
154
- box-sizing: border-box;
193
+ -webkit-box-sizing: border-box;
194
+ box-sizing: border-box;
155
195
  display: inline-block;
156
196
  overflow: hidden;
157
197
  text-overflow: ellipsis;
@@ -198,7 +238,8 @@
198
238
  }
199
239
  .e-ddt.e-popup {
200
240
  border: 1px solid #969696;
201
- box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
241
+ -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
242
+ box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 0px rgba(0, 0, 0, 0.14), 0 3px 14px 0px rgba(0, 0, 0, 0.12);
202
243
  position: absolute;
203
244
  }
204
245
  .e-ddt.e-popup .e-selectall-parent {
@@ -224,19 +265,18 @@
224
265
  font-size: 14px;
225
266
  margin: 10px;
226
267
  }
227
- .e-ddt.e-popup .e-filter-wrap .e-input, .e-ddt.e-popup .e-filter-wrap .e-input:focus {
228
- padding: 0 12px;
229
- }
230
268
  .e-ddt.e-popup .e-filter-wrap {
231
- border: 1px solid #fff;
232
269
  border-top-width: 0;
233
270
  display: block;
234
271
  padding: 5px;
235
- }
236
- .e-ddt.e-popup .e-filter-wrap {
272
+ border: 1px solid #fff;
237
273
  border-left-width: 0;
238
274
  border-right-width: 0;
239
275
  }
276
+ .e-ddt.e-popup .e-filter-wrap .e-input,
277
+ .e-ddt.e-popup .e-filter-wrap .e-input:focus {
278
+ padding: 0 12px;
279
+ }
240
280
  .e-ddt.e-popup .e-filter-wrap .e-input-group {
241
281
  margin-bottom: 0;
242
282
  }
@@ -251,8 +291,8 @@
251
291
  cursor: default;
252
292
  font-family: inherit;
253
293
  font-size: 14px;
254
- padding: 14px 16px;
255
294
  text-align: center;
295
+ padding: 14px 16px;
256
296
  }
257
297
  .e-ddt.e-popup .e-popup-content.e-no-data .e-treeview {
258
298
  display: none;
@@ -307,16 +347,16 @@
307
347
  padding: 6px 10px 0 10px;
308
348
  }
309
349
  .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
310
- margin-left: 30px;
311
350
  margin-right: 1px;
351
+ margin-left: 30px;
312
352
  }
313
353
  .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
314
- margin-left: 30px;
315
354
  margin-right: 1px;
355
+ margin-left: 30px;
316
356
  }
317
357
  .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
318
- margin-left: 60px;
319
358
  margin-right: 1px;
359
+ margin-left: 60px;
320
360
  }
321
361
  .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
322
362
  .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,
@@ -389,18 +429,18 @@
389
429
  }
390
430
  .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
391
431
  .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
392
- margin-left: 38px;
393
432
  margin-right: 1px;
433
+ margin-left: 38px;
394
434
  }
395
435
  .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child,
396
436
  .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
397
- margin-left: 38px;
398
437
  margin-right: 1px;
438
+ margin-left: 38px;
399
439
  }
400
440
  .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
401
441
  .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
402
- margin-left: 76px;
403
- margin-right: 1px;
442
+ margin-right: 76px;
443
+ margin-left: 1px;
404
444
  }
405
445
  .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,
406
446
  .e-ddt.e-bigger.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon,
@@ -0,0 +1,11 @@
1
+ @include export-module('dropdowntree-bootstrap5-icons') {
2
+ .e-ddt {
3
+ .e-ddt-icon::before {
4
+ content: '\e734';
5
+ }
6
+
7
+ .e-chips-close::before {
8
+ content: '\e7e7';
9
+ }
10
+ }
11
+ }
@@ -0,0 +1,14 @@
1
+ @include export-module('dropdowntree-fluent2-icons') {
2
+ .e-ddt {
3
+ .e-ddt-icon::before {
4
+ content: '\e729';
5
+ padding: 3px;
6
+ }
7
+
8
+ .e-chips-close::before,
9
+ .e-clear-icon::before {
10
+ content: '\e7e7';
11
+ font-family: 'e-icons';
12
+ }
13
+ }
14
+ }