@syncfusion/ej2-treegrid 25.2.6 → 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 (102) hide show
  1. package/.eslintrc.json +3 -2
  2. package/dist/ej2-treegrid.min.js +2 -2
  3. package/dist/ej2-treegrid.umd.min.js +2 -2
  4. package/dist/ej2-treegrid.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-treegrid.es2015.js +621 -462
  6. package/dist/es6/ej2-treegrid.es2015.js.map +1 -1
  7. package/dist/es6/ej2-treegrid.es5.js +922 -762
  8. package/dist/es6/ej2-treegrid.es5.js.map +1 -1
  9. package/dist/global/ej2-treegrid.min.js +2 -2
  10. package/dist/global/ej2-treegrid.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +10 -10
  13. package/src/treegrid/actions/edit.js +8 -7
  14. package/src/treegrid/actions/excel-export.js +4 -3
  15. package/src/treegrid/actions/page.js +4 -0
  16. package/src/treegrid/actions/rowdragdrop.js +13 -11
  17. package/src/treegrid/actions/selection.js +4 -1
  18. package/src/treegrid/base/constant.d.ts +2 -0
  19. package/src/treegrid/base/constant.js +2 -0
  20. package/src/treegrid/base/data.js +2 -1
  21. package/src/treegrid/base/interface.js +0 -1
  22. package/src/treegrid/base/treegrid-model.d.ts +1 -1
  23. package/src/treegrid/base/treegrid.d.ts +3 -0
  24. package/src/treegrid/base/treegrid.js +230 -62
  25. package/src/treegrid/renderer/virtual-row-model-generator.js +2 -2
  26. package/src/treegrid/renderer/virtual-tree-content-render.js +2 -1
  27. package/styles/bootstrap-dark.css +76 -48
  28. package/styles/bootstrap-dark.scss +18 -1
  29. package/styles/bootstrap.css +76 -49
  30. package/styles/bootstrap.scss +18 -1
  31. package/styles/bootstrap4.css +77 -48
  32. package/styles/bootstrap4.scss +18 -1
  33. package/styles/bootstrap5-dark.css +77 -49
  34. package/styles/bootstrap5-dark.scss +18 -1
  35. package/styles/bootstrap5.css +77 -49
  36. package/styles/bootstrap5.scss +18 -1
  37. package/styles/fabric-dark.css +74 -47
  38. package/styles/fabric-dark.scss +18 -1
  39. package/styles/fabric.css +74 -47
  40. package/styles/fabric.scss +18 -1
  41. package/styles/fluent-dark.css +77 -49
  42. package/styles/fluent-dark.scss +18 -1
  43. package/styles/fluent.css +77 -49
  44. package/styles/fluent.scss +18 -1
  45. package/styles/fluent2.css +1721 -0
  46. package/styles/fluent2.scss +18 -0
  47. package/styles/highcontrast-light.css +74 -47
  48. package/styles/highcontrast-light.scss +18 -1
  49. package/styles/highcontrast.css +74 -47
  50. package/styles/highcontrast.scss +18 -1
  51. package/styles/material-dark.css +111 -54
  52. package/styles/material-dark.scss +18 -1
  53. package/styles/material.css +125 -57
  54. package/styles/material.scss +18 -1
  55. package/styles/material3-dark.css +111 -56
  56. package/styles/material3-dark.scss +18 -1
  57. package/styles/material3.css +111 -56
  58. package/styles/material3.scss +18 -1
  59. package/styles/tailwind-dark.css +87 -51
  60. package/styles/tailwind-dark.scss +18 -1
  61. package/styles/tailwind.css +87 -51
  62. package/styles/tailwind.scss +18 -1
  63. package/styles/treegrid/_bds-definition.scss +0 -4
  64. package/styles/treegrid/_bootstrap-dark-definition.scss +0 -1
  65. package/styles/treegrid/_bootstrap-definition.scss +0 -1
  66. package/styles/treegrid/_bootstrap4-definition.scss +0 -1
  67. package/styles/treegrid/_bootstrap5-definition.scss +0 -4
  68. package/styles/treegrid/_bootstrap5.3-definition.scss +24 -0
  69. package/styles/treegrid/_fabric-dark-definition.scss +0 -1
  70. package/styles/treegrid/_fabric-definition.scss +0 -1
  71. package/styles/treegrid/_fluent-definition.scss +0 -4
  72. package/styles/treegrid/_fluent2-definition.scss +24 -0
  73. package/styles/treegrid/_fusionnew-definition.scss +0 -4
  74. package/styles/treegrid/_highcontrast-definition.scss +0 -1
  75. package/styles/treegrid/_highcontrast-light-definition.scss +0 -1
  76. package/styles/treegrid/_layout.scss +81 -85
  77. package/styles/treegrid/_material-dark-definition.scss +0 -1
  78. package/styles/treegrid/_material-definition.scss +0 -1
  79. package/styles/treegrid/_material3-definition.scss +0 -4
  80. package/styles/treegrid/_tailwind-definition.scss +0 -4
  81. package/styles/treegrid/bootstrap-dark.css +76 -48
  82. package/styles/treegrid/bootstrap.css +76 -49
  83. package/styles/treegrid/bootstrap4.css +77 -48
  84. package/styles/treegrid/bootstrap5-dark.css +77 -49
  85. package/styles/treegrid/bootstrap5.css +77 -49
  86. package/styles/treegrid/fabric-dark.css +74 -47
  87. package/styles/treegrid/fabric.css +74 -47
  88. package/styles/treegrid/fluent-dark.css +77 -49
  89. package/styles/treegrid/fluent.css +77 -49
  90. package/styles/treegrid/fluent2.css +1721 -0
  91. package/styles/treegrid/fluent2.scss +18 -0
  92. package/styles/treegrid/highcontrast-light.css +74 -47
  93. package/styles/treegrid/highcontrast.css +74 -47
  94. package/styles/treegrid/icons/_bootstrap5.3.scss +37 -0
  95. package/styles/treegrid/icons/_fluent2.scss +37 -0
  96. package/styles/treegrid/material-dark.css +111 -54
  97. package/styles/treegrid/material.css +125 -57
  98. package/styles/treegrid/material3-dark.css +111 -56
  99. package/styles/treegrid/material3.css +111 -56
  100. package/styles/treegrid/tailwind-dark.css +87 -51
  101. package/styles/treegrid/tailwind.css +87 -51
  102. package/CHANGELOG.md +0 -264
package/styles/treegrid/fluent.css CHANGED
@@ -1,7 +1,8 @@
1
1
  /* stylelint-disable property-no-vendor-prefix */
2
2
  .e-popup.e-ddl {
3
3
  border-radius: 4px;
4
- box-shadow: none;
4
+ -webkit-box-shadow: none;
5
+ box-shadow: none;
5
6
  margin-top: 1px;
6
7
  }
7
8
  .e-popup.e-ddl .e-input-group {
@@ -16,6 +17,7 @@
16
17
  }
17
18
 
18
19
  .e-popup.e-ddl .e-filter-parent .e-input-group {
20
+ display: -webkit-box;
19
21
  display: -ms-flexbox;
20
22
  display: flex;
21
23
  width: auto;
@@ -87,11 +89,13 @@
87
89
  .e-control.e-dropdownlist .e-input-group:not(.e-disabled) .e-input-group-icon:active,
88
90
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-back-icon:active,
89
91
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon:active {
90
- box-shadow: none;
92
+ -webkit-box-shadow: none;
93
+ box-shadow: none;
91
94
  }
92
95
 
93
96
  .e-ddl.e-popup .e-input-group:not(.e-disabled) .e-clear-icon {
94
97
  background: none;
98
+ display: -webkit-box;
95
99
  display: -ms-flexbox;
96
100
  display: flex;
97
101
  position: relative;
@@ -126,19 +130,43 @@
126
130
  }
127
131
 
128
132
  /* stylelint-disable property-no-vendor-prefix */
133
+ @-webkit-keyframes material-spinner-rotate {
134
+ 0% {
135
+ -webkit-transform: rotate(0);
136
+ transform: rotate(0);
137
+ }
138
+ 100% {
139
+ -webkit-transform: rotate(360deg);
140
+ transform: rotate(360deg);
141
+ }
142
+ }
129
143
  @keyframes material-spinner-rotate {
130
144
  0% {
145
+ -webkit-transform: rotate(0);
146
+ transform: rotate(0);
147
+ }
148
+ 100% {
149
+ -webkit-transform: rotate(360deg);
150
+ transform: rotate(360deg);
151
+ }
152
+ }
153
+ @-webkit-keyframes fabric-spinner-rotate {
154
+ 0% {
155
+ -webkit-transform: rotate(0);
131
156
  transform: rotate(0);
132
157
  }
133
158
  100% {
159
+ -webkit-transform: rotate(360deg);
134
160
  transform: rotate(360deg);
135
161
  }
136
162
  }
137
163
  @keyframes fabric-spinner-rotate {
138
164
  0% {
165
+ -webkit-transform: rotate(0);
139
166
  transform: rotate(0);
140
167
  }
141
168
  100% {
169
+ -webkit-transform: rotate(360deg);
142
170
  transform: rotate(360deg);
143
171
  }
144
172
  }
@@ -177,10 +205,6 @@
177
205
  .e-bigger .e-treegrid .e-hierarchycheckbox {
178
206
  padding-left: 2px;
179
207
  }
180
- .e-bigger .e-treegrid .e-hierarchycheckbox .e-frame {
181
- height: 18px;
182
- width: 18px;
183
- }
184
208
  .e-bigger .e-treegrid .e-hierarchycheckbox .e-frame {
185
209
  font-size: 12px;
186
210
  line-height: 12px;
@@ -195,7 +219,6 @@
195
219
  font-size: 16px;
196
220
  font-weight: bold;
197
221
  }
198
-
199
222
  .e-treegrid .e-icons.e-none::before {
200
223
  content: "";
201
224
  }
@@ -231,10 +254,12 @@
231
254
  font-weight: bold;
232
255
  }
233
256
  .e-treegrid .e-rtl .e-treegridcollapse {
234
- transform: scale(-1);
257
+ -webkit-transform: scale(-1);
258
+ transform: scale(-1);
235
259
  }
236
260
  .e-treegrid .e-treegridexpand {
237
- transform: rotate(90deg);
261
+ -webkit-transform: rotate(90deg);
262
+ transform: rotate(90deg);
238
263
  }
239
264
  .e-treegrid .e-treerowexpanded:not(.e-hiddenrow) {
240
265
  display: table-row;
@@ -290,7 +315,7 @@
290
315
  display: table-cell;
291
316
  line-height: 19px;
292
317
  }
293
- .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container {
318
+ .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container, .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container {
294
319
  white-space: nowrap;
295
320
  }
296
321
  .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecolumn-container .e-treecell {
@@ -298,9 +323,6 @@
298
323
  white-space: normal;
299
324
  word-wrap: break-word;
300
325
  }
301
- .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container {
302
- white-space: nowrap;
303
- }
304
326
  .e-treegrid .e-grid.e-wrap .e-rowcell .e-treecheckbox-container .e-treecheckbox {
305
327
  display: inline-block;
306
328
  white-space: normal;
@@ -325,53 +347,57 @@
325
347
  display: none;
326
348
  }
327
349
  .e-treegrid .e-icons.e-errorelem {
328
- display: inline-block;
329
350
  padding-left: 10px;
351
+ display: inline-block;
330
352
  vertical-align: middle;
331
353
  }
332
354
  .e-treegrid .e-errorelem::before {
333
355
  color: #d13438;
334
356
  content: "\e839";
335
- transform: rotate(180deg);
357
+ -webkit-transform: rotate(180deg);
358
+ transform: rotate(180deg);
336
359
  }
337
360
  .e-treegrid .e-gridcontent td.e-childborder {
338
361
  border-color: #0078d4;
339
362
  border-width: 2px 0 0;
340
- box-shadow: 0 1px 0 0 #0078d4;
363
+ -webkit-box-shadow: 0 1px 0 0 #0078d4;
364
+ box-shadow: 0 1px 0 0 #0078d4;
341
365
  position: relative;
342
366
  z-index: 1;
343
367
  }
344
368
  .e-treegrid .e-gridcontent td.e-rowcell.e-childborder.e-dragborder,
345
369
  .e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom.e-dragborder td.e-rowdragdrop.e-dropbottom.e-dragborder {
346
- box-shadow: 0 1px 0 0 #0078d4;
370
+ -webkit-box-shadow: 0 1px 0 0 #0078d4;
371
+ box-shadow: 0 1px 0 0 #0078d4;
347
372
  }
348
373
  .e-treegrid .e-gridcontent td.e-rowcell.e-dragborder,
349
374
  .e-treegrid .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
350
375
  .e-treegrid .e-gridcontent .e-rowdragdrop.e-dragborder {
351
- box-shadow: 0 0 0 0;
376
+ -webkit-box-shadow: 0 0 0 0;
377
+ box-shadow: 0 0 0 0;
352
378
  }
353
379
  .e-treegrid .e-gridcontent td.e-childborder:first-child {
354
380
  border-left: 2px dashed #0078d4;
355
- box-shadow: 0 1px 0 0 #0078d4;
381
+ -webkit-box-shadow: 0 1px 0 0 #0078d4;
382
+ box-shadow: 0 1px 0 0 #0078d4;
356
383
  position: relative;
357
384
  z-index: 1;
358
385
  }
359
- .e-treegrid .e-gridcontent td.e-rowcell.e-childborder:last-child {
386
+ .e-treegrid .e-gridcontent td.e-rowcell.e-childborder:last-child,
387
+ .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
360
388
  border-right: 2px dashed #0078d4;
361
389
  }
362
390
  .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder {
363
391
  border-width: 2px 0;
364
392
  }
365
- .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
366
- border-right: 2px dashed #0078d4;
367
- }
368
393
  .e-treegrid .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
369
394
  border-left: 2px dashed #0078d4;
370
395
  }
371
396
  .e-treegrid .e-gridcontent td.e-dropbottom:first-child,
372
397
  .e-treegrid .e-gridcontent td.e-rowcell.e-dropbottom,
373
398
  .e-treegrid .e-gridcontent td.e-dropbottom {
374
- box-shadow: 0 1px 0 0 #0078d4;
399
+ -webkit-box-shadow: 0 1px 0 0 #0078d4;
400
+ box-shadow: 0 1px 0 0 #0078d4;
375
401
  position: relative;
376
402
  z-index: 1;
377
403
  }
@@ -384,7 +410,8 @@
384
410
  border-bottom-color: #0078d4;
385
411
  }
386
412
  .e-treegrid .e-gridcontent td.e-rowdragdrop.e-droptop.e-dragborder {
387
- box-shadow: 0 0 0 0;
413
+ -webkit-box-shadow: 0 0 0 0;
414
+ box-shadow: 0 0 0 0;
388
415
  }
389
416
  .e-treegrid .e-gridcontent .e-gridheader .e-firstrow-dragborder {
390
417
  height: 1px;
@@ -392,18 +419,14 @@
392
419
  .e-treegrid .e-gridcontent .e-lastrow-dragborder {
393
420
  height: 0;
394
421
  }
395
- .e-treegrid .e-gridheader .e-firstrow-dragborder {
396
- height: 0;
397
- }
398
- .e-treegrid .e-droptop .e-lastrow-dragborder {
422
+ .e-treegrid .e-gridheader .e-firstrow-dragborder,
423
+ .e-treegrid .e-droptop .e-lastrow-dragborder,
424
+ .e-treegrid .e-gridheader .e-firstrow-dragborder tr:first-child.e-dropbottom {
399
425
  height: 0;
400
426
  }
401
427
  .e-treegrid .e-treegrid-relative {
402
428
  position: relative;
403
429
  }
404
- .e-treegrid .e-gridheader .e-firstrow-dragborder tr:first-child.e-dropbottom {
405
- height: 0;
406
- }
407
430
  .e-treegrid .e-gridheader .e-firstrow-border,
408
431
  .e-treegrid .e-gridcontent .e-lastrow-border {
409
432
  background-color: #0078d4;
@@ -417,7 +440,8 @@
417
440
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowdragdrop.e-childborder {
418
441
  border-bottom: 2px dashed #0078d4;
419
442
  border-top: 2px dashed #0078d4;
420
- box-shadow: 0 0 0 0 #0078d4;
443
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
444
+ box-shadow: 0 0 0 0 #0078d4;
421
445
  }
422
446
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowcell.e-droptop,
423
447
  .e-treegrid .e-grid .e-gridcontent tr.e-row:first-child td.e-rowdragdrop.e-droptop {
@@ -426,30 +450,37 @@
426
450
  .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-childborder {
427
451
  border-bottom: 2px dashed #0078d4;
428
452
  border-top: 2px dashed #0078d4;
429
- box-shadow: 0 0 0 0 #0078d4;
453
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
454
+ box-shadow: 0 0 0 0 #0078d4;
430
455
  }
431
456
  .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-childborder {
432
457
  border-bottom: 2px dashed #0078d4;
433
458
  border-top: 2px dashed #0078d4;
434
- box-shadow: 0 0 0 0 #0078d4;
459
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
460
+ box-shadow: 0 0 0 0 #0078d4;
435
461
  }
436
462
  .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-dropbottom {
437
463
  border-bottom: 2px solid #0078d4;
438
- box-shadow: 0 0 0 0 #0078d4;
464
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
465
+ box-shadow: 0 0 0 0 #0078d4;
439
466
  }
440
467
  .e-treegrid .e-grid .e-gridcontent td.e-rowcell.e-droptop {
441
468
  border-top: 2px solid #0078d4;
442
- box-shadow: 0 0 0 0 #0078d4;
469
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
470
+ box-shadow: 0 0 0 0 #0078d4;
443
471
  }
444
472
  .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-dropbottom {
445
473
  border-bottom: 2px solid #0078d4;
446
- box-shadow: 0 0 0 0 #0078d4;
474
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
475
+ box-shadow: 0 0 0 0 #0078d4;
447
476
  }
448
477
  .e-treegrid .e-grid .e-gridcontent td.e-rowdragdrop.e-droptop {
449
478
  border-top: 2px solid #0078d4;
450
- box-shadow: 0 0 0 0 #0078d4;
479
+ -webkit-box-shadow: 0 0 0 0 #0078d4;
480
+ box-shadow: 0 0 0 0 #0078d4;
451
481
  }
452
- .e-treegrid .e-grid.e-rtl .e-gridheader .e-firstrow-dragborder {
482
+ .e-treegrid .e-grid.e-rtl .e-gridheader .e-firstrow-dragborder,
483
+ .e-treegrid .e-grid.e-rtl .e-droptop .e-lastrow-dragborder {
453
484
  height: 0;
454
485
  }
455
486
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder {
@@ -461,15 +492,18 @@
461
492
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-dragborder,
462
493
  .e-treegrid .e-grid.e-rtl .e-gridcontent tr.e-row:first-child .e-rowcell.e-dragborder,
463
494
  .e-treegrid .e-grid.e-rtl .e-gridcontent .e-rowdragdrop.e-dragborder {
464
- box-shadow: 0 0 0 0;
495
+ -webkit-box-shadow: 0 0 0 0;
496
+ box-shadow: 0 0 0 0;
465
497
  }
466
498
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-childborder:first-child {
467
499
  border-right: 2px dashed #0078d4;
468
- box-shadow: 0 1px 0 0 #0078d4;
500
+ -webkit-box-shadow: 0 1px 0 0 #0078d4;
501
+ box-shadow: 0 1px 0 0 #0078d4;
469
502
  position: relative;
470
503
  z-index: 1;
471
504
  }
472
- .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-childborder:last-child {
505
+ .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-childborder:last-child,
506
+ .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
473
507
  border-left: 2px dashed #0078d4;
474
508
  }
475
509
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder {
@@ -478,9 +512,6 @@
478
512
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:last-child {
479
513
  border-right: 2px dashed #0078d4;
480
514
  }
481
- .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-childborder:first-child {
482
- border-left: 2px dashed #0078d4;
483
- }
484
515
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-droptop:first-child,
485
516
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-rowcell.e-droptop {
486
517
  border-top-color: #0078d4;
@@ -489,8 +520,5 @@
489
520
  .e-treegrid .e-grid.e-rtl .e-gridcontent td.e-lastrowcell.e-dropbottom {
490
521
  border-bottom-color: #0078d4;
491
522
  }
492
- .e-treegrid .e-grid.e-rtl .e-gridcontent .e-droptop .e-lastrow-dragborder {
493
- height: 0;
494
- }
495
523
 
496
524
  /* stylelint-disable-line no-empty-source */