@syncfusion/ej2-multicolumn-combobox 28.2.7 → 29.1.33

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 (145) hide show
  1. package/README.md +1 -1
  2. package/dist/ej2-multicolumn-combobox.umd.min.js +2 -2
  3. package/dist/ej2-multicolumn-combobox.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-multicolumn-combobox.es2015.js +103 -24
  5. package/dist/es6/ej2-multicolumn-combobox.es2015.js.map +1 -1
  6. package/dist/es6/ej2-multicolumn-combobox.es5.js +106 -24
  7. package/dist/es6/ej2-multicolumn-combobox.es5.js.map +1 -1
  8. package/dist/global/ej2-multicolumn-combobox.min.js +2 -2
  9. package/dist/global/ej2-multicolumn-combobox.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/memory-leak-samples/mccb.d.ts +1 -0
  12. package/memory-leak-samples/mccb.html +35 -0
  13. package/memory-leak-samples/mccb.js +109 -0
  14. package/package.json +8 -8
  15. package/src/multicolumn-combobox/multi-column-combo-box-model.d.ts +1 -1
  16. package/src/multicolumn-combobox/multi-column-combo-box.d.ts +5 -0
  17. package/src/multicolumn-combobox/multi-column-combo-box.js +105 -23
  18. package/styles/bds-lite.css +60 -1
  19. package/styles/bds-lite.scss +1 -0
  20. package/styles/bds.css +70 -1
  21. package/styles/bds.scss +1 -0
  22. package/styles/bootstrap-dark-lite.css +60 -1
  23. package/styles/bootstrap-dark-lite.scss +1 -0
  24. package/styles/bootstrap-dark.css +70 -1
  25. package/styles/bootstrap-dark.scss +1 -0
  26. package/styles/bootstrap-lite.css +60 -1
  27. package/styles/bootstrap-lite.scss +1 -0
  28. package/styles/bootstrap.css +70 -1
  29. package/styles/bootstrap.scss +1 -0
  30. package/styles/bootstrap4-lite.css +60 -1
  31. package/styles/bootstrap4-lite.scss +1 -0
  32. package/styles/bootstrap4.css +70 -1
  33. package/styles/bootstrap4.scss +1 -0
  34. package/styles/bootstrap5-dark-lite.css +61 -2
  35. package/styles/bootstrap5-dark-lite.scss +1 -0
  36. package/styles/bootstrap5-dark.css +71 -2
  37. package/styles/bootstrap5-dark.scss +1 -0
  38. package/styles/bootstrap5-lite.css +60 -1
  39. package/styles/bootstrap5-lite.scss +1 -0
  40. package/styles/bootstrap5.3-lite.css +60 -1
  41. package/styles/bootstrap5.3-lite.scss +1 -0
  42. package/styles/bootstrap5.3.css +70 -1
  43. package/styles/bootstrap5.3.scss +1 -0
  44. package/styles/bootstrap5.css +70 -1
  45. package/styles/bootstrap5.scss +1 -0
  46. package/styles/fabric-dark-lite.css +60 -1
  47. package/styles/fabric-dark-lite.scss +1 -0
  48. package/styles/fabric-dark.css +70 -1
  49. package/styles/fabric-dark.scss +1 -0
  50. package/styles/fabric-lite.css +60 -1
  51. package/styles/fabric-lite.scss +1 -0
  52. package/styles/fabric.css +70 -1
  53. package/styles/fabric.scss +1 -0
  54. package/styles/fluent-dark-lite.css +60 -1
  55. package/styles/fluent-dark-lite.scss +1 -0
  56. package/styles/fluent-dark.css +70 -1
  57. package/styles/fluent-dark.scss +1 -0
  58. package/styles/fluent-lite.css +60 -1
  59. package/styles/fluent-lite.scss +1 -0
  60. package/styles/fluent.css +70 -1
  61. package/styles/fluent.scss +1 -0
  62. package/styles/fluent2-lite.css +60 -1
  63. package/styles/fluent2-lite.scss +1 -0
  64. package/styles/fluent2.css +70 -1
  65. package/styles/fluent2.scss +1 -0
  66. package/styles/highcontrast-light-lite.css +60 -1
  67. package/styles/highcontrast-light-lite.scss +1 -0
  68. package/styles/highcontrast-light.css +70 -1
  69. package/styles/highcontrast-light.scss +1 -0
  70. package/styles/highcontrast-lite.css +60 -1
  71. package/styles/highcontrast-lite.scss +1 -0
  72. package/styles/highcontrast.css +70 -1
  73. package/styles/highcontrast.scss +1 -0
  74. package/styles/material-dark-lite.css +60 -1
  75. package/styles/material-dark-lite.scss +1 -0
  76. package/styles/material-dark.css +70 -1
  77. package/styles/material-dark.scss +1 -0
  78. package/styles/material-lite.css +60 -1
  79. package/styles/material-lite.scss +1 -0
  80. package/styles/material.css +70 -1
  81. package/styles/material.scss +1 -0
  82. package/styles/material3-dark-lite.css +60 -1
  83. package/styles/material3-dark-lite.scss +1 -0
  84. package/styles/material3-dark.css +70 -1
  85. package/styles/material3-dark.scss +1 -0
  86. package/styles/material3-lite.css +60 -1
  87. package/styles/material3-lite.scss +1 -0
  88. package/styles/material3.css +70 -1
  89. package/styles/material3.scss +1 -0
  90. package/styles/multicolumn-combobox/_bigger.scss +9 -0
  91. package/styles/multicolumn-combobox/_layout.scss +16 -1
  92. package/styles/multicolumn-combobox/bds.css +70 -1
  93. package/styles/multicolumn-combobox/bds.scss +1 -0
  94. package/styles/multicolumn-combobox/bootstrap-dark.css +70 -1
  95. package/styles/multicolumn-combobox/bootstrap-dark.scss +1 -0
  96. package/styles/multicolumn-combobox/bootstrap.css +70 -1
  97. package/styles/multicolumn-combobox/bootstrap.scss +1 -0
  98. package/styles/multicolumn-combobox/bootstrap4.css +70 -1
  99. package/styles/multicolumn-combobox/bootstrap4.scss +1 -0
  100. package/styles/multicolumn-combobox/bootstrap5-dark.css +71 -2
  101. package/styles/multicolumn-combobox/bootstrap5-dark.scss +1 -0
  102. package/styles/multicolumn-combobox/bootstrap5.3.css +70 -1
  103. package/styles/multicolumn-combobox/bootstrap5.3.scss +1 -0
  104. package/styles/multicolumn-combobox/bootstrap5.css +70 -1
  105. package/styles/multicolumn-combobox/bootstrap5.scss +1 -0
  106. package/styles/multicolumn-combobox/fabric-dark.css +70 -1
  107. package/styles/multicolumn-combobox/fabric-dark.scss +1 -0
  108. package/styles/multicolumn-combobox/fabric.css +70 -1
  109. package/styles/multicolumn-combobox/fabric.scss +1 -0
  110. package/styles/multicolumn-combobox/fluent-dark.css +70 -1
  111. package/styles/multicolumn-combobox/fluent-dark.scss +1 -0
  112. package/styles/multicolumn-combobox/fluent.css +70 -1
  113. package/styles/multicolumn-combobox/fluent.scss +1 -0
  114. package/styles/multicolumn-combobox/fluent2.css +70 -1
  115. package/styles/multicolumn-combobox/fluent2.scss +1 -0
  116. package/styles/multicolumn-combobox/highcontrast-light.css +70 -1
  117. package/styles/multicolumn-combobox/highcontrast-light.scss +1 -0
  118. package/styles/multicolumn-combobox/highcontrast.css +70 -1
  119. package/styles/multicolumn-combobox/highcontrast.scss +1 -0
  120. package/styles/multicolumn-combobox/material-dark.css +70 -1
  121. package/styles/multicolumn-combobox/material-dark.scss +1 -0
  122. package/styles/multicolumn-combobox/material.css +70 -1
  123. package/styles/multicolumn-combobox/material.scss +1 -0
  124. package/styles/multicolumn-combobox/material3-dark.css +70 -1
  125. package/styles/multicolumn-combobox/material3-dark.scss +1 -0
  126. package/styles/multicolumn-combobox/material3.css +70 -1
  127. package/styles/multicolumn-combobox/material3.scss +1 -0
  128. package/styles/multicolumn-combobox/tailwind-dark.css +72 -3
  129. package/styles/multicolumn-combobox/tailwind-dark.scss +1 -0
  130. package/styles/multicolumn-combobox/tailwind.css +70 -1
  131. package/styles/multicolumn-combobox/tailwind.scss +1 -0
  132. package/styles/multicolumn-combobox/tailwind3.css +70 -1
  133. package/styles/multicolumn-combobox/tailwind3.scss +1 -0
  134. package/styles/tailwind-dark-lite.css +62 -3
  135. package/styles/tailwind-dark-lite.scss +1 -0
  136. package/styles/tailwind-dark.css +72 -3
  137. package/styles/tailwind-dark.scss +1 -0
  138. package/styles/tailwind-lite.css +60 -1
  139. package/styles/tailwind-lite.scss +1 -0
  140. package/styles/tailwind.css +70 -1
  141. package/styles/tailwind.scss +1 -0
  142. package/styles/tailwind3-lite.css +60 -1
  143. package/styles/tailwind3-lite.scss +1 -0
  144. package/styles/tailwind3.css +70 -1
  145. package/styles/tailwind3.scss +1 -0
package/styles/fluent-dark.css CHANGED
@@ -107,11 +107,61 @@
107
107
  font-size: 14px;
108
108
  }
109
109
 
110
+ /* stylelint-disable property-no-vendor-prefix */
111
+ @-webkit-keyframes material-spinner-rotate {
112
+ 0% {
113
+ -webkit-transform: rotate(0);
114
+ transform: rotate(0);
115
+ }
116
+ 100% {
117
+ -webkit-transform: rotate(360deg);
118
+ transform: rotate(360deg);
119
+ }
120
+ }
121
+ @keyframes material-spinner-rotate {
122
+ 0% {
123
+ -webkit-transform: rotate(0);
124
+ transform: rotate(0);
125
+ }
126
+ 100% {
127
+ -webkit-transform: rotate(360deg);
128
+ transform: rotate(360deg);
129
+ }
130
+ }
131
+ @-webkit-keyframes fabric-spinner-rotate {
132
+ 0% {
133
+ -webkit-transform: rotate(0);
134
+ transform: rotate(0);
135
+ }
136
+ 100% {
137
+ -webkit-transform: rotate(360deg);
138
+ transform: rotate(360deg);
139
+ }
140
+ }
141
+ @keyframes fabric-spinner-rotate {
142
+ 0% {
143
+ -webkit-transform: rotate(0);
144
+ transform: rotate(0);
145
+ }
146
+ 100% {
147
+ -webkit-transform: rotate(360deg);
148
+ transform: rotate(360deg);
149
+ }
150
+ }
110
151
  .e-input-group.e-control-wrapper .e-multicolumn-list-icon::before {
111
152
  content: "\e729";
112
153
  font-family: "e-icons";
113
154
  }
114
155
 
156
+ .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
157
+ /* stylelint-disable declaration-no-important */
158
+ height: 20px !important;
159
+ width: 20px !important;
160
+ -webkit-transform-origin: 10px 10px 10px !important;
161
+ transform-origin: 10px 10px 10px !important;
162
+ /* stylelint-enable declaration-no-important */
163
+ }
164
+
115
165
  .e-multicolumn-grid tr.e-groupcaptionrow {
116
166
  position: sticky;
117
167
  top: 0;
@@ -152,6 +202,14 @@
152
202
  border-radius: 0 0 2px 2px;
153
203
  }
154
204
 
205
+ .e-multicolumn-list .e-multicolumn-list-hidden {
206
+ border: 0;
207
+ height: 0;
208
+ padding: 0;
209
+ visibility: hidden;
210
+ width: 0;
211
+ }
212
+
155
213
  .e-multicolumn-grid.e-grid {
156
214
  border-width: 1px;
157
215
  border-radius: 2px;
@@ -233,7 +291,8 @@
233
291
  overflow: auto !important; /* stylelint-disable-line declaration-no-important */
234
292
  }
235
293
 
236
- .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon {
294
+ .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon,
295
+ .e-multicolumn-list.e-input-group .e-input-group-icon {
237
296
  position: relative;
238
297
  }
239
298
 
@@ -329,6 +388,16 @@
329
388
  margin-top: 2px;
330
389
  }
331
390
 
391
+ .e-bigger.e-multicolumn-list .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg,
392
+ .e-bigger .e-multicolumn-list .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
393
+ /* stylelint-disable declaration-no-important */
394
+ height: 26px !important;
395
+ width: 26px !important;
396
+ -webkit-transform-origin: 13px 13px 13px !important;
397
+ transform-origin: 13px 13px 13px !important;
398
+ /* stylelint-enable declaration-no-important */
399
+ }
400
+
332
401
  .e-bigger.e-small.e-popup .e-multicolumn-grid .e-headercelldiv,
333
402
  .e-bigger.e-small.e-popup .e-multicolumn-grid .e-rowcell, .e-bigger.e-small.e-popup.e-multicolumn-list .e-popup-footer,
334
403
  .e-bigger.e-small .e-popup .e-multicolumn-grid .e-headercelldiv,
package/styles/fluent-dark.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  @import 'ej2-dropdowns/styles/drop-down-list/fluent-dark-definition.scss';
6
6
  @import 'ej2-dropdowns/styles/combo-box/fluent-dark-definition.scss';
7
7
  @import 'ej2-grids/styles/grid/fluent-dark-definition.scss';
8
+ @import 'ej2-popups/styles/spinner/fluent-dark-definition.scss';
8
9
  @import 'multicolumn-combobox/fluent-dark-definition.scss';
9
10
  @import 'multicolumn-combobox/icons/fluent-dark.scss';
10
11
  @import 'multicolumn-combobox/all.scss';
package/styles/fluent-lite.css CHANGED
@@ -107,11 +107,61 @@
107
107
  font-size: 14px;
108
108
  }
109
109
 
110
+ /* stylelint-disable property-no-vendor-prefix */
111
+ @-webkit-keyframes material-spinner-rotate {
112
+ 0% {
113
+ -webkit-transform: rotate(0);
114
+ transform: rotate(0);
115
+ }
116
+ 100% {
117
+ -webkit-transform: rotate(360deg);
118
+ transform: rotate(360deg);
119
+ }
120
+ }
121
+ @keyframes material-spinner-rotate {
122
+ 0% {
123
+ -webkit-transform: rotate(0);
124
+ transform: rotate(0);
125
+ }
126
+ 100% {
127
+ -webkit-transform: rotate(360deg);
128
+ transform: rotate(360deg);
129
+ }
130
+ }
131
+ @-webkit-keyframes fabric-spinner-rotate {
132
+ 0% {
133
+ -webkit-transform: rotate(0);
134
+ transform: rotate(0);
135
+ }
136
+ 100% {
137
+ -webkit-transform: rotate(360deg);
138
+ transform: rotate(360deg);
139
+ }
140
+ }
141
+ @keyframes fabric-spinner-rotate {
142
+ 0% {
143
+ -webkit-transform: rotate(0);
144
+ transform: rotate(0);
145
+ }
146
+ 100% {
147
+ -webkit-transform: rotate(360deg);
148
+ transform: rotate(360deg);
149
+ }
150
+ }
110
151
  .e-input-group.e-control-wrapper .e-multicolumn-list-icon::before {
111
152
  content: "\e729";
112
153
  font-family: "e-icons";
113
154
  }
114
155
 
156
+ .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
157
+ /* stylelint-disable declaration-no-important */
158
+ height: 20px !important;
159
+ width: 20px !important;
160
+ -webkit-transform-origin: 10px 10px 10px !important;
161
+ transform-origin: 10px 10px 10px !important;
162
+ /* stylelint-enable declaration-no-important */
163
+ }
164
+
115
165
  .e-multicolumn-grid tr.e-groupcaptionrow {
116
166
  position: sticky;
117
167
  top: 0;
@@ -152,6 +202,14 @@
152
202
  border-radius: 0 0 2px 2px;
153
203
  }
154
204
 
205
+ .e-multicolumn-list .e-multicolumn-list-hidden {
206
+ border: 0;
207
+ height: 0;
208
+ padding: 0;
209
+ visibility: hidden;
210
+ width: 0;
211
+ }
212
+
155
213
  .e-multicolumn-grid.e-grid {
156
214
  border-width: 1px;
157
215
  border-radius: 2px;
@@ -233,7 +291,8 @@
233
291
  overflow: auto !important; /* stylelint-disable-line declaration-no-important */
234
292
  }
235
293
 
236
- .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon {
294
+ .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon,
295
+ .e-multicolumn-list.e-input-group .e-input-group-icon {
237
296
  position: relative;
238
297
  }
239
298
 
package/styles/fluent-lite.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  @import 'ej2-dropdowns/styles/drop-down-list/fluent-definition.scss';
6
6
  @import 'ej2-dropdowns/styles/combo-box/fluent-definition.scss';
7
7
  @import 'ej2-grids/styles/grid/fluent-definition.scss';
8
+ @import 'ej2-popups/styles/spinner/fluent-definition.scss';
8
9
  @import 'multicolumn-combobox/fluent-definition.scss';
9
10
  @import 'multicolumn-combobox/icons/fluent.scss';
10
11
  @import 'multicolumn-combobox/all.scss';
package/styles/fluent.css CHANGED
@@ -107,11 +107,61 @@
107
107
  font-size: 14px;
108
108
  }
109
109
 
110
+ /* stylelint-disable property-no-vendor-prefix */
111
+ @-webkit-keyframes material-spinner-rotate {
112
+ 0% {
113
+ -webkit-transform: rotate(0);
114
+ transform: rotate(0);
115
+ }
116
+ 100% {
117
+ -webkit-transform: rotate(360deg);
118
+ transform: rotate(360deg);
119
+ }
120
+ }
121
+ @keyframes material-spinner-rotate {
122
+ 0% {
123
+ -webkit-transform: rotate(0);
124
+ transform: rotate(0);
125
+ }
126
+ 100% {
127
+ -webkit-transform: rotate(360deg);
128
+ transform: rotate(360deg);
129
+ }
130
+ }
131
+ @-webkit-keyframes fabric-spinner-rotate {
132
+ 0% {
133
+ -webkit-transform: rotate(0);
134
+ transform: rotate(0);
135
+ }
136
+ 100% {
137
+ -webkit-transform: rotate(360deg);
138
+ transform: rotate(360deg);
139
+ }
140
+ }
141
+ @keyframes fabric-spinner-rotate {
142
+ 0% {
143
+ -webkit-transform: rotate(0);
144
+ transform: rotate(0);
145
+ }
146
+ 100% {
147
+ -webkit-transform: rotate(360deg);
148
+ transform: rotate(360deg);
149
+ }
150
+ }
110
151
  .e-input-group.e-control-wrapper .e-multicolumn-list-icon::before {
111
152
  content: "\e729";
112
153
  font-family: "e-icons";
113
154
  }
114
155
 
156
+ .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
157
+ /* stylelint-disable declaration-no-important */
158
+ height: 20px !important;
159
+ width: 20px !important;
160
+ -webkit-transform-origin: 10px 10px 10px !important;
161
+ transform-origin: 10px 10px 10px !important;
162
+ /* stylelint-enable declaration-no-important */
163
+ }
164
+
115
165
  .e-multicolumn-grid tr.e-groupcaptionrow {
116
166
  position: sticky;
117
167
  top: 0;
@@ -152,6 +202,14 @@
152
202
  border-radius: 0 0 2px 2px;
153
203
  }
154
204
 
205
+ .e-multicolumn-list .e-multicolumn-list-hidden {
206
+ border: 0;
207
+ height: 0;
208
+ padding: 0;
209
+ visibility: hidden;
210
+ width: 0;
211
+ }
212
+
155
213
  .e-multicolumn-grid.e-grid {
156
214
  border-width: 1px;
157
215
  border-radius: 2px;
@@ -233,7 +291,8 @@
233
291
  overflow: auto !important; /* stylelint-disable-line declaration-no-important */
234
292
  }
235
293
 
236
- .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon {
294
+ .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon,
295
+ .e-multicolumn-list.e-input-group .e-input-group-icon {
237
296
  position: relative;
238
297
  }
239
298
 
@@ -329,6 +388,16 @@
329
388
  margin-top: 2px;
330
389
  }
331
390
 
391
+ .e-bigger.e-multicolumn-list .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg,
392
+ .e-bigger .e-multicolumn-list .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
393
+ /* stylelint-disable declaration-no-important */
394
+ height: 26px !important;
395
+ width: 26px !important;
396
+ -webkit-transform-origin: 13px 13px 13px !important;
397
+ transform-origin: 13px 13px 13px !important;
398
+ /* stylelint-enable declaration-no-important */
399
+ }
400
+
332
401
  .e-bigger.e-small.e-popup .e-multicolumn-grid .e-headercelldiv,
333
402
  .e-bigger.e-small.e-popup .e-multicolumn-grid .e-rowcell, .e-bigger.e-small.e-popup.e-multicolumn-list .e-popup-footer,
334
403
  .e-bigger.e-small .e-popup .e-multicolumn-grid .e-headercelldiv,
package/styles/fluent.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  @import 'ej2-dropdowns/styles/drop-down-list/fluent-definition.scss';
6
6
  @import 'ej2-dropdowns/styles/combo-box/fluent-definition.scss';
7
7
  @import 'ej2-grids/styles/grid/fluent-definition.scss';
8
+ @import 'ej2-popups/styles/spinner/fluent-definition.scss';
8
9
  @import 'multicolumn-combobox/fluent-definition.scss';
9
10
  @import 'multicolumn-combobox/icons/fluent.scss';
10
11
  @import 'multicolumn-combobox/all.scss';
package/styles/fluent2-lite.css CHANGED
@@ -111,11 +111,61 @@
111
111
  min-width: 250px !important;
112
112
  }
113
113
 
114
+ /* stylelint-disable property-no-vendor-prefix */
115
+ @-webkit-keyframes material-spinner-rotate {
116
+ 0% {
117
+ -webkit-transform: rotate(0);
118
+ transform: rotate(0);
119
+ }
120
+ 100% {
121
+ -webkit-transform: rotate(360deg);
122
+ transform: rotate(360deg);
123
+ }
124
+ }
125
+ @keyframes material-spinner-rotate {
126
+ 0% {
127
+ -webkit-transform: rotate(0);
128
+ transform: rotate(0);
129
+ }
130
+ 100% {
131
+ -webkit-transform: rotate(360deg);
132
+ transform: rotate(360deg);
133
+ }
134
+ }
135
+ @-webkit-keyframes fabric-spinner-rotate {
136
+ 0% {
137
+ -webkit-transform: rotate(0);
138
+ transform: rotate(0);
139
+ }
140
+ 100% {
141
+ -webkit-transform: rotate(360deg);
142
+ transform: rotate(360deg);
143
+ }
144
+ }
145
+ @keyframes fabric-spinner-rotate {
146
+ 0% {
147
+ -webkit-transform: rotate(0);
148
+ transform: rotate(0);
149
+ }
150
+ 100% {
151
+ -webkit-transform: rotate(360deg);
152
+ transform: rotate(360deg);
153
+ }
154
+ }
114
155
  .e-input-group.e-control-wrapper .e-multicolumn-list-icon::before {
115
156
  content: "\e729";
116
157
  font-family: "e-icons";
117
158
  }
118
159
 
160
+ .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
161
+ /* stylelint-disable declaration-no-important */
162
+ height: 20px !important;
163
+ width: 20px !important;
164
+ -webkit-transform-origin: 10px 10px 10px !important;
165
+ transform-origin: 10px 10px 10px !important;
166
+ /* stylelint-enable declaration-no-important */
167
+ }
168
+
119
169
  .e-multicolumn-grid tr.e-groupcaptionrow {
120
170
  position: sticky;
121
171
  top: 0;
@@ -156,6 +206,14 @@
156
206
  border-radius: 0 0 4px 4px;
157
207
  }
158
208
 
209
+ .e-multicolumn-list .e-multicolumn-list-hidden {
210
+ border: 0;
211
+ height: 0;
212
+ padding: 0;
213
+ visibility: hidden;
214
+ width: 0;
215
+ }
216
+
159
217
  .e-multicolumn-grid.e-grid {
160
218
  border-width: 1px;
161
219
  border-radius: 4px;
@@ -237,7 +295,8 @@
237
295
  overflow: auto !important; /* stylelint-disable-line declaration-no-important */
238
296
  }
239
297
 
240
- .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon {
298
+ .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon,
299
+ .e-multicolumn-list.e-input-group .e-input-group-icon {
241
300
  position: relative;
242
301
  }
243
302
 
package/styles/fluent2-lite.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  @import 'ej2-dropdowns/styles/drop-down-list/fluent2-definition.scss';
6
6
  @import 'ej2-dropdowns/styles/combo-box/fluent2-definition.scss';
7
7
  @import 'ej2-grids/styles/grid/fluent2-definition.scss';
8
+ @import 'ej2-popups/styles/spinner/fluent2-definition.scss';
8
9
  @import 'multicolumn-combobox/fluent2-definition.scss';
9
10
  @import 'multicolumn-combobox/icons/fluent2.scss';
10
11
  @import 'multicolumn-combobox/all.scss';
package/styles/fluent2.css CHANGED
@@ -111,11 +111,61 @@
111
111
  min-width: 250px !important;
112
112
  }
113
113
 
114
+ /* stylelint-disable property-no-vendor-prefix */
115
+ @-webkit-keyframes material-spinner-rotate {
116
+ 0% {
117
+ -webkit-transform: rotate(0);
118
+ transform: rotate(0);
119
+ }
120
+ 100% {
121
+ -webkit-transform: rotate(360deg);
122
+ transform: rotate(360deg);
123
+ }
124
+ }
125
+ @keyframes material-spinner-rotate {
126
+ 0% {
127
+ -webkit-transform: rotate(0);
128
+ transform: rotate(0);
129
+ }
130
+ 100% {
131
+ -webkit-transform: rotate(360deg);
132
+ transform: rotate(360deg);
133
+ }
134
+ }
135
+ @-webkit-keyframes fabric-spinner-rotate {
136
+ 0% {
137
+ -webkit-transform: rotate(0);
138
+ transform: rotate(0);
139
+ }
140
+ 100% {
141
+ -webkit-transform: rotate(360deg);
142
+ transform: rotate(360deg);
143
+ }
144
+ }
145
+ @keyframes fabric-spinner-rotate {
146
+ 0% {
147
+ -webkit-transform: rotate(0);
148
+ transform: rotate(0);
149
+ }
150
+ 100% {
151
+ -webkit-transform: rotate(360deg);
152
+ transform: rotate(360deg);
153
+ }
154
+ }
114
155
  .e-input-group.e-control-wrapper .e-multicolumn-list-icon::before {
115
156
  content: "\e729";
116
157
  font-family: "e-icons";
117
158
  }
118
159
 
160
+ .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
161
+ /* stylelint-disable declaration-no-important */
162
+ height: 20px !important;
163
+ width: 20px !important;
164
+ -webkit-transform-origin: 10px 10px 10px !important;
165
+ transform-origin: 10px 10px 10px !important;
166
+ /* stylelint-enable declaration-no-important */
167
+ }
168
+
119
169
  .e-multicolumn-grid tr.e-groupcaptionrow {
120
170
  position: sticky;
121
171
  top: 0;
@@ -156,6 +206,14 @@
156
206
  border-radius: 0 0 4px 4px;
157
207
  }
158
208
 
209
+ .e-multicolumn-list .e-multicolumn-list-hidden {
210
+ border: 0;
211
+ height: 0;
212
+ padding: 0;
213
+ visibility: hidden;
214
+ width: 0;
215
+ }
216
+
159
217
  .e-multicolumn-grid.e-grid {
160
218
  border-width: 1px;
161
219
  border-radius: 4px;
@@ -237,7 +295,8 @@
237
295
  overflow: auto !important; /* stylelint-disable-line declaration-no-important */
238
296
  }
239
297
 
240
- .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon {
298
+ .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon,
299
+ .e-multicolumn-list.e-input-group .e-input-group-icon {
241
300
  position: relative;
242
301
  }
243
302
 
@@ -333,6 +392,16 @@
333
392
  margin-top: unset;
334
393
  }
335
394
 
395
+ .e-bigger.e-multicolumn-list .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg,
396
+ .e-bigger .e-multicolumn-list .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
397
+ /* stylelint-disable declaration-no-important */
398
+ height: 26px !important;
399
+ width: 26px !important;
400
+ -webkit-transform-origin: 13px 13px 13px !important;
401
+ transform-origin: 13px 13px 13px !important;
402
+ /* stylelint-enable declaration-no-important */
403
+ }
404
+
336
405
  .e-bigger.e-small.e-popup .e-multicolumn-grid .e-headercelldiv,
337
406
  .e-bigger.e-small.e-popup .e-multicolumn-grid .e-rowcell, .e-bigger.e-small.e-popup.e-multicolumn-list .e-popup-footer,
338
407
  .e-bigger.e-small .e-popup .e-multicolumn-grid .e-headercelldiv,
package/styles/fluent2.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  @import 'ej2-dropdowns/styles/drop-down-list/fluent2-definition.scss';
6
6
  @import 'ej2-dropdowns/styles/combo-box/fluent2-definition.scss';
7
7
  @import 'ej2-grids/styles/grid/fluent2-definition.scss';
8
+ @import 'ej2-popups/styles/spinner/fluent2-definition.scss';
8
9
  @import 'multicolumn-combobox/fluent2-definition.scss';
9
10
  @import 'multicolumn-combobox/icons/fluent2.scss';
10
11
  @import 'multicolumn-combobox/all.scss';
package/styles/highcontrast-light-lite.css CHANGED
@@ -61,11 +61,61 @@
61
61
  border-color: #000;
62
62
  }
63
63
 
64
+ /* stylelint-disable property-no-vendor-prefix */
65
+ @-webkit-keyframes material-spinner-rotate {
66
+ 0% {
67
+ -webkit-transform: rotate(0);
68
+ transform: rotate(0);
69
+ }
70
+ 100% {
71
+ -webkit-transform: rotate(360deg);
72
+ transform: rotate(360deg);
73
+ }
74
+ }
75
+ @keyframes material-spinner-rotate {
76
+ 0% {
77
+ -webkit-transform: rotate(0);
78
+ transform: rotate(0);
79
+ }
80
+ 100% {
81
+ -webkit-transform: rotate(360deg);
82
+ transform: rotate(360deg);
83
+ }
84
+ }
85
+ @-webkit-keyframes fabric-spinner-rotate {
86
+ 0% {
87
+ -webkit-transform: rotate(0);
88
+ transform: rotate(0);
89
+ }
90
+ 100% {
91
+ -webkit-transform: rotate(360deg);
92
+ transform: rotate(360deg);
93
+ }
94
+ }
95
+ @keyframes fabric-spinner-rotate {
96
+ 0% {
97
+ -webkit-transform: rotate(0);
98
+ transform: rotate(0);
99
+ }
100
+ 100% {
101
+ -webkit-transform: rotate(360deg);
102
+ transform: rotate(360deg);
103
+ }
104
+ }
64
105
  .e-input-group.e-control-wrapper .e-multicolumn-list-icon::before {
65
106
  content: "\e966";
66
107
  font-family: "e-icons";
67
108
  }
68
109
 
110
+ .e-multicolumn-list-icon .e-spinner-pane .e-spinner-inner svg {
111
+ /* stylelint-disable declaration-no-important */
112
+ height: 20px !important;
113
+ width: 20px !important;
114
+ -webkit-transform-origin: 10px 10px 10px !important;
115
+ transform-origin: 10px 10px 10px !important;
116
+ /* stylelint-enable declaration-no-important */
117
+ }
118
+
69
119
  .e-multicolumn-grid tr.e-groupcaptionrow {
70
120
  position: sticky;
71
121
  top: 0;
@@ -106,6 +156,14 @@
106
156
  border-radius: 0 0 0 0;
107
157
  }
108
158
 
159
+ .e-multicolumn-list .e-multicolumn-list-hidden {
160
+ border: 0;
161
+ height: 0;
162
+ padding: 0;
163
+ visibility: hidden;
164
+ width: 0;
165
+ }
166
+
109
167
  .e-multicolumn-grid.e-grid {
110
168
  border-width: 1px;
111
169
  border-radius: 0;
@@ -187,7 +245,8 @@
187
245
  overflow: auto !important; /* stylelint-disable-line declaration-no-important */
188
246
  }
189
247
 
190
- .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon {
248
+ .e-multicolumn-container .e-input-group-icon.e-multicolumn-list-icon.e-ddl-disable-icon,
249
+ .e-multicolumn-list.e-input-group .e-input-group-icon {
191
250
  position: relative;
192
251
  }
193
252
 
package/styles/highcontrast-light-lite.scss CHANGED
@@ -5,6 +5,7 @@
5
5
  @import 'ej2-dropdowns/styles/drop-down-list/highcontrast-light-definition.scss';
6
6
  @import 'ej2-dropdowns/styles/combo-box/highcontrast-light-definition.scss';
7
7
  @import 'ej2-grids/styles/grid/highcontrast-light-definition.scss';
8
+ @import 'ej2-popups/styles/spinner/highcontrast-light-definition.scss';
8
9
  @import 'multicolumn-combobox/highcontrast-light-definition.scss';
9
10
  @import 'multicolumn-combobox/icons/highcontrast-light.scss';
10
11
  @import 'multicolumn-combobox/all.scss';