@syncfusion/ej2-vue-treegrid 20.1.48 → 20.1.55

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 (50) hide show
  1. package/CHANGELOG.md +14 -58
  2. package/dist/ej2-vue-treegrid.umd.min.js +11 -2
  3. package/dist/es6/ej2-vue-treegrid.es2015.js +126 -9
  4. package/dist/es6/ej2-vue-treegrid.es2015.js.map +1 -1
  5. package/dist/es6/ej2-vue-treegrid.es5.js +88 -9
  6. package/dist/es6/ej2-vue-treegrid.es5.js.map +1 -1
  7. package/dist/global/ej2-vue-treegrid.min.js +2 -2
  8. package/package.json +8 -14
  9. package/src/treegrid/aggregate-columns.directive.d.ts +3 -1
  10. package/src/treegrid/aggregate-columns.directive.js +24 -2
  11. package/src/treegrid/aggregates.directive.d.ts +3 -1
  12. package/src/treegrid/aggregates.directive.js +24 -2
  13. package/src/treegrid/columns.directive.d.ts +3 -1
  14. package/src/treegrid/columns.directive.js +24 -2
  15. package/src/treegrid/treegrid.component.d.ts +3 -0
  16. package/src/treegrid/treegrid.component.js +17 -1
  17. package/styles/bootstrap-dark.css +36 -104
  18. package/styles/bootstrap.css +36 -104
  19. package/styles/bootstrap4.css +30 -103
  20. package/styles/bootstrap5-dark.css +52 -118
  21. package/styles/bootstrap5.css +52 -118
  22. package/styles/fabric-dark.css +36 -102
  23. package/styles/fabric.css +36 -102
  24. package/styles/fluent-dark.css +473 -0
  25. package/styles/fluent-dark.scss +1 -0
  26. package/styles/fluent.css +473 -0
  27. package/styles/fluent.scss +1 -0
  28. package/styles/highcontrast-light.css +34 -113
  29. package/styles/highcontrast.css +34 -113
  30. package/styles/material-dark.css +24 -91
  31. package/styles/material.css +24 -92
  32. package/styles/tailwind-dark.css +41 -162
  33. package/styles/tailwind.css +26 -147
  34. package/styles/treegrid/bootstrap-dark.css +36 -104
  35. package/styles/treegrid/bootstrap.css +36 -104
  36. package/styles/treegrid/bootstrap4.css +30 -103
  37. package/styles/treegrid/bootstrap5-dark.css +52 -118
  38. package/styles/treegrid/bootstrap5.css +52 -118
  39. package/styles/treegrid/fabric-dark.css +36 -102
  40. package/styles/treegrid/fabric.css +36 -102
  41. package/styles/treegrid/fluent-dark.css +473 -0
  42. package/styles/treegrid/fluent-dark.scss +1 -0
  43. package/styles/treegrid/fluent.css +473 -0
  44. package/styles/treegrid/fluent.scss +1 -0
  45. package/styles/treegrid/highcontrast-light.css +34 -113
  46. package/styles/treegrid/highcontrast.css +34 -113
  47. package/styles/treegrid/material-dark.css +24 -91
  48. package/styles/treegrid/material.css +24 -92
  49. package/styles/treegrid/tailwind-dark.css +41 -162
  50. package/styles/treegrid/tailwind.css +26 -147
@@ -1,14 +1,11 @@
1
- @charset "UTF-8";
2
1
  .e-popup.e-ddl {
3
2
  border-radius: 4px;
4
3
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.5);
5
4
  margin-top: 3px;
6
5
  }
7
-
8
6
  .e-popup.e-ddl .e-input-group {
9
7
  width: auto;
10
8
  }
11
-
12
9
  .e-popup.e-ddl .e-input-group input {
13
10
  line-height: 15px;
14
11
  }
@@ -22,7 +19,6 @@
22
19
  display: flex;
23
20
  width: auto;
24
21
  }
25
-
26
22
  .e-popup.e-ddl .e-filter-parent .e-input-group .e-back-icon {
27
23
  border: 0;
28
24
  }
@@ -31,9 +27,7 @@
31
27
  margin-top: 0;
32
28
  }
33
29
 
34
- .e-bigger .e-popup.e-ddl .e-list-item,
35
- .e-bigger .e-popup.e-ddl .e-list-group-item,
36
- .e-bigger .e-popup.e-ddl .e-fixed-head {
30
+ .e-bigger .e-popup.e-ddl .e-list-item, .e-bigger .e-popup.e-ddl .e-list-group-item, .e-bigger .e-popup.e-ddl .e-fixed-head {
37
31
  font-size: 15px;
38
32
  line-height: 40px;
39
33
  padding-left: 0;
@@ -48,8 +42,7 @@
48
42
  padding: 4px 0;
49
43
  }
50
44
 
51
- .e-bigger .e-popup.e-ddl .e-input-group input,
52
- .e-bigger .e-popup.e-ddl .e-input-group input.e-input {
45
+ .e-bigger .e-popup.e-ddl .e-input-group input, .e-bigger .e-popup.e-ddl .e-input-group input.e-input {
53
46
  height: 38px;
54
47
  }
55
48
 
@@ -87,9 +80,7 @@
87
80
  border-bottom: 1px solid #484848;
88
81
  }
89
82
 
90
- .e-bigger.e-small .e-ddl.e-popup .e-list-item,
91
- .e-bigger.e-small .e-ddl.e-popup .e-list-group-item,
92
- .e-bigger.e-small .e-ddl.e-popup .e-fixed-head {
83
+ .e-bigger.e-small .e-ddl.e-popup .e-list-item, .e-bigger.e-small .e-ddl.e-popup .e-list-group-item, .e-bigger.e-small .e-ddl.e-popup .e-fixed-head {
93
84
  font-size: 14px;
94
85
  line-height: 34px;
95
86
  padding-left: 0;
@@ -104,8 +95,7 @@
104
95
  padding: 4px 0;
105
96
  }
106
97
 
107
- .e-bigger.e-small .e-ddl.e-popup .e-input-group input,
108
- .e-bigger.e-small .e-ddl.e-popup .e-input-group input.e-input {
98
+ .e-bigger.e-small .e-ddl.e-popup .e-input-group input, .e-bigger.e-small .e-ddl.e-popup .e-input-group input.e-input {
109
99
  height: 30px;
110
100
  }
111
101
 
@@ -121,7 +111,6 @@
121
111
  transform: rotate(360deg);
122
112
  }
123
113
  }
124
-
125
114
  @keyframes fabric-spinner-rotate {
126
115
  0% {
127
116
  transform: rotate(0);
@@ -130,26 +119,21 @@
130
119
  transform: rotate(360deg);
131
120
  }
132
121
  }
133
-
134
122
  .e-treegrid .e-treegridexpand::before,
135
123
  .e-treegrid .e-treegridcollapse::before {
136
- content: '\e22f';
124
+ content: "\e22f";
137
125
  }
138
-
139
126
  .e-treegrid .e-toolbar-item .e-expand::before {
140
- content: '\e558';
127
+ content: "\e558";
141
128
  }
142
-
143
129
  .e-treegrid .e-toolbar-item .e-collapse::before {
144
- content: '\e557';
130
+ content: "\e557";
145
131
  }
146
-
147
132
  .e-treegrid .e-toolbar-item .e-indent::before {
148
- content: '\e33f';
133
+ content: "\e33f";
149
134
  }
150
-
151
135
  .e-treegrid .e-toolbar-item .e-outdent::before {
152
- content: '\e35d';
136
+ content: "\e35d";
153
137
  }
154
138
 
155
139
  .e-bigger .e-treegrid .e-treegridexpand,
@@ -158,109 +142,91 @@
158
142
  height: 18px;
159
143
  width: 18px;
160
144
  }
161
-
162
- .e-bigger .e-treegrid .e-rowcell.e-treerowcell {
163
- padding-left: 5px;
164
- }
165
-
166
145
  .e-bigger .e-treegrid .e-hierarchycheckbox {
167
146
  padding-left: 2px;
168
147
  }
169
-
170
148
  .e-bigger .e-treegrid .e-hierarchycheckbox .e-frame {
171
149
  height: 20px;
172
150
  width: 20px;
173
151
  }
174
-
152
+ .e-bigger .e-treegrid .e-hierarchycheckbox .e-frame {
153
+ font-size: 12px;
154
+ line-height: 12px;
155
+ padding: 2px 0;
156
+ height: 20px;
157
+ width: 20px;
158
+ }
175
159
  .e-bigger .e-treegrid .e-treecell {
176
160
  line-height: 18px;
177
161
  }
178
-
179
162
  .e-treegrid .e-icons.e-none::before {
180
- content: '';
163
+ content: "";
181
164
  }
182
-
183
165
  .e-treegrid .e-gridheader .e-headercell .e-css.e-hierarchycheckbox {
184
166
  height: 20px;
185
167
  vertical-align: middle;
186
168
  }
187
-
188
169
  .e-treegrid .e-treegridexpand::before,
189
170
  .e-treegrid .e-treegridcollapse::before {
190
171
  text-align: center;
191
172
  vertical-align: middle;
192
173
  }
193
-
194
174
  .e-treegrid .e-rowcell:not(.e-gridclip) .e-treecolumn-container {
195
175
  display: block;
196
176
  overflow: hidden;
197
177
  text-overflow: ellipsis;
198
178
  }
199
-
200
179
  .e-treegrid .e-rowcell:not(.e-gridclip) .e-treecolumn-container span.e-treecell {
201
180
  display: inline;
202
181
  overflow: hidden;
203
182
  text-overflow: ellipsis;
204
183
  }
205
-
206
184
  .e-treegrid .e-treegridexpand:hover::before,
207
185
  .e-treegrid .e-treegridcollapse:hover::before {
208
186
  color: #f0f0f0;
209
187
  }
210
-
211
- .e-treegrid .e-rowcell.e-treerowcell {
212
- padding-left: 5px;
213
- }
214
-
215
188
  .e-treegrid .e-rtl .e-treegridcollapse {
216
189
  transform: scale(-1);
217
190
  }
218
-
219
191
  .e-treegrid .e-treegridexpand {
220
192
  transform: rotate(90deg);
221
193
  }
222
-
223
194
  .e-treegrid .e-treerowexpanded:not(.e-hiddenrow) {
224
195
  display: table-row;
225
196
  }
226
-
227
197
  .e-treegrid .e-treerowcollapsed {
228
198
  display: none;
229
199
  }
230
-
231
200
  .e-treegrid .e-treecheckbox-container {
232
201
  display: block;
233
202
  overflow: hidden;
234
203
  text-overflow: ellipsis;
235
204
  }
236
-
237
205
  .e-treegrid .e-treecheckbox-container :not(.e-treecheckbox) {
238
206
  white-space: nowrap;
239
207
  }
240
-
241
208
  .e-treegrid .e-treecheckbox {
242
209
  overflow: hidden;
243
210
  text-overflow: ellipsis;
244
211
  vertical-align: middle;
245
212
  }
246
-
247
213
  .e-treegrid .e-treecolumn-container span {
248
214
  display: inline-block;
249
215
  vertical-align: middle;
250
216
  }
251
-
252
217
  .e-treegrid .e-hierarchycheckbox .e-frame {
253
- height: 20px;
254
- width: 20px;
218
+ font-size: 10px;
219
+ height: 16px;
220
+ line-height: 11px;
221
+ padding: 2px 0;
222
+ width: 16px;
255
223
  }
256
-
257
224
  .e-treegrid .e-checkselection .e-frozenheader .e-rowcell,
258
225
  .e-treegrid .e-checkselection .e-movableheader .e-rowcell,
259
226
  .e-treegrid .e-checkselection .e-frozencontent .e-rowcell,
260
227
  .e-treegrid .e-checkselection .e-movablecontent .e-rowcell {
261
228
  line-height: 21px;
262
229
  }
263
-
264
230
  .e-treegrid .e-treegridexpand,
265
231
  .e-treegrid .e-treegridcollapse {
266
232
  color: #f0f0f0;
@@ -272,36 +238,29 @@
272
238
  vertical-align: bottom;
273
239
  width: 16px;
274
240
  }
275
-
276
241
  .e-treegrid .e-treecell {
277
242
  display: table-cell;
278
243
  line-height: normal;
279
244
  }
280
-
281
245
  .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container {
282
246
  white-space: nowrap;
283
247
  }
284
-
285
248
  .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container .e-treecell {
286
249
  display: inline-block;
287
250
  white-space: normal;
288
251
  word-wrap: break-word;
289
252
  }
290
-
291
253
  .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container {
292
254
  white-space: nowrap;
293
255
  }
294
-
295
256
  .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container .e-treecheckbox {
296
257
  display: inline-block;
297
258
  white-space: normal;
298
259
  word-wrap: break-word;
299
260
  }
300
-
301
261
  .e-treegrid.e-grid.e-print-grid-layout .e-icons {
302
262
  display: inline-block;
303
263
  }
304
-
305
264
  .e-treegrid .e-treecheckselect,
306
265
  .e-treegrid .e-treeselectall {
307
266
  margin: 0;
@@ -309,7 +268,6 @@
309
268
  position: absolute;
310
269
  width: 0;
311
270
  }
312
-
313
271
  .e-treegrid .e-detailheadercell,
314
272
  .e-treegrid .e-headercontent .e-table .e-detail-intent,
315
273
  .e-treegrid .e-gridcontent .e-table .e-detail-intent,
@@ -319,19 +277,16 @@
319
277
  .e-treegrid .e-filterbarcell.e-mastercell {
320
278
  display: none;
321
279
  }
322
-
323
280
  .e-treegrid .e-icons.e-errorelem {
324
281
  display: inline-block;
325
282
  padding-left: 10px;
326
283
  vertical-align: middle;
327
284
  }
328
-
329
285
  .e-treegrid .e-errorelem::before {
330
286
  color: #e3165b;
331
- content: "";
287
+ content: "\e22a";
332
288
  transform: rotate(180deg);
333
289
  }
334
-
335
290
  .e-treegrid .e-gridcontent td.e-childborder {
336
291
  border-color: #0070f0;
337
292
  border-width: 1px 0 0;
@@ -339,41 +294,33 @@
339
294
  position: relative;
340
295
  z-index: 1;
341
296
  }
342
-
343
297
  .e-treegrid .e-gridcontent td.e-rowcell.e-childborder.e-dragborder,
344
298
  .e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom.e-dragborder td.e-rowdragdrop.e-dropbottom.e-dragborder {
345
299
  box-shadow: 0 1px 0 0 #0070f0;
346
300
  }
347
-
348
301
  .e-treegrid .e-gridcontent td.e-rowcell.e-dragborder,
349
302
  .e-treegrid .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
350
303
  .e-treegrid .e-gridcontent .e-rowdragdrop.e-dragborder {
351
304
  box-shadow: 0 0 0 0;
352
305
  }
353
-
354
306
  .e-treegrid .e-gridcontent td.e-childborder:first-child {
355
307
  border-left: 1px solid #0070f0;
356
308
  box-shadow: 0 1px 0 0 #0070f0;
357
309
  position: relative;
358
310
  z-index: 1;
359
311
  }
360
-
361
312
  .e-treegrid .e-gridcontent td.e-rowcell.e-childborder:last-child {
362
313
  border-right: 1px solid #0070f0;
363
314
  }
364
-
365
315
  .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder {
366
316
  border-width: 1px 0;
367
317
  }
368
-
369
318
  .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
370
319
  border-right: 1px solid #0070f0;
371
320
  }
372
-
373
321
  .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
374
322
  border-left: 1px solid #0070f0;
375
323
  }
376
-
377
324
  .e-treegrid .e-gridcontent td.e-dropbottom:first-child,
378
325
  .e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom,
379
326
  .e-treegrid .e-gridcontent td.e-dropbottom {
@@ -381,45 +328,35 @@
381
328
  position: relative;
382
329
  z-index: 1;
383
330
  }
384
-
385
331
  .e-treegrid .e-gridcontent td.e-droptop:first-child,
386
332
  .e-treegrid .e-gridcontent td.e-rowcell.e-droptop {
387
333
  border-top-color: #0070f0;
388
334
  border-width: 1px 0 0;
389
335
  }
390
-
391
336
  .e-treegrid .e-gridcontent td.e-lastrowcell.e-dropbottom {
392
337
  border-bottom-color: #0070f0;
393
338
  }
394
-
395
339
  .e-treegrid .e-gridcontent td.e-rowdragdrop.e-droptop.e-dragborder {
396
340
  box-shadow: 0 0 0 0;
397
341
  }
398
-
399
342
  .e-treegrid .e-gridcontent .e-gridheader .e-firstrow-dragborder {
400
343
  height: 1px;
401
344
  }
402
-
403
345
  .e-treegrid .e-gridcontent .e-lastrow-dragborder {
404
346
  height: 0;
405
347
  }
406
-
407
348
  .e-treegrid .e-gridheader .e-firstrow-dragborder {
408
349
  height: 0;
409
350
  }
410
-
411
351
  .e-treegrid .e-droptop .e-lastrow-dragborder {
412
352
  height: 0;
413
353
  }
414
-
415
354
  .e-treegrid .e-treegrid-relative {
416
355
  position: relative;
417
356
  }
418
-
419
357
  .e-treegrid .e-gridheader .e-firstrow-dragborder tr:first-child.e-dropbottom {
420
358
  height: 0;
421
359
  }
422
-
423
360
  .e-treegrid .e-gridheader .e-firstrow-border,
424
361
  .e-treegrid .e-gridcontent .e-lastrow-border {
425
362
  background-color: #0070f0;
@@ -429,79 +366,74 @@
429
366
  position: absolute;
430
367
  z-index: 1;
431
368
  }
432
-
433
369
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowcell.e-childborder,
434
370
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowdragdrop.e-childborder {
435
371
  border-bottom: 1px solid #0070f0;
436
372
  border-top: 1px solid #0070f0;
437
373
  box-shadow: 0 0 0 0 #0070f0;
438
374
  }
439
-
440
375
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowcell.e-droptop,
441
376
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowdragdrop.e-droptop {
442
377
  border-top: 1px solid #0070f0;
443
378
  }
444
-
445
- .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-childborder, .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-dropbottom {
379
+ .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-childborder {
446
380
  border-bottom: 1px solid #0070f0;
381
+ border-top: 1px solid #0070f0;
447
382
  box-shadow: 0 0 0 0 #0070f0;
448
383
  }
449
-
450
- .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-childborder, .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-dropbottom {
384
+ .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-childborder {
385
+ border-bottom: 1px solid #0070f0;
386
+ border-top: 1px solid #0070f0;
387
+ box-shadow: 0 0 0 0 #0070f0;
388
+ }
389
+ .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-dropbottom {
390
+ border-bottom: 1px solid #0070f0;
391
+ box-shadow: 0 0 0 0 #0070f0;
392
+ }
393
+ .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-dropbottom {
451
394
  border-bottom: 1px solid #0070f0;
452
395
  box-shadow: 0 0 0 0 #0070f0;
453
396
  }
454
-
455
397
  .e-treegrid .e-grid.e-rtl .e-gridheader .e-firstrow-dragborder {
456
398
  height: 0;
457
399
  }
458
-
459
400
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder {
460
401
  border-color: #0070f0;
461
402
  border-width: 1px 0 0;
462
403
  position: relative;
463
404
  z-index: 1;
464
405
  }
465
-
466
406
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-dragborder,
467
407
  .e-treegrid .e-grid.e-rtl .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
468
408
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-rowdragdrop.e-dragborder {
469
409
  box-shadow: 0 0 0 0;
470
410
  }
471
-
472
411
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder:first-child {
473
412
  border-right: 1px solid #0070f0;
474
413
  box-shadow: 0 1px 0 0 #0070f0;
475
414
  position: relative;
476
415
  z-index: 1;
477
416
  }
478
-
479
417
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-childborder:last-child {
480
418
  border-left: 1px solid #0070f0;
481
419
  }
482
-
483
420
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder {
484
421
  border-width: 1px 0;
485
422
  }
486
-
487
423
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
488
424
  border-right: 1px solid #0070f0;
489
425
  }
490
-
491
426
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
492
427
  border-left: 1px solid #0070f0;
493
428
  }
494
-
495
429
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-droptop:first-child,
496
430
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-droptop {
497
431
  border-top-color: #0070f0;
498
432
  border-width: 1px 0 0;
499
433
  }
500
-
501
434
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-dropbottom {
502
435
  border-bottom-color: #0070f0;
503
436
  }
504
-
505
437
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
506
438
  height: 0;
507
- }
439
+ }