@datorama/core 22.15.0 → 22.15.2

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 (32) hide show
  1. package/bundle.scss +122 -50
  2. package/bundles/datorama-core.umd.js +140 -47
  3. package/bundles/datorama-core.umd.js.map +1 -1
  4. package/bundles/datorama-core.umd.min.js +27 -27
  5. package/bundles/datorama-core.umd.min.js.map +1 -1
  6. package/datorama-core.metadata.json +1 -1
  7. package/esm2015/lib/grid/grid/grid.component.js +4 -4
  8. package/esm2015/lib/grid/grid-sort.utils.js +7 -2
  9. package/esm2015/lib/grid-v2/grid/grid-v2.component.js +10 -3
  10. package/esm2015/lib/grid-v2/grid/grid-v2.config.js +30 -4
  11. package/esm2015/lib/grid-v2/grid-controller/grid-controller.component.js +58 -24
  12. package/esm2015/lib/grid-v2/grid-header/grid-header.component.js +3 -2
  13. package/esm2015/lib/grid-v2/grid-store/grid.query.js +9 -5
  14. package/esm2015/lib/grid-v2/grid-toolbar/grid-toolbar.component.js +22 -16
  15. package/esm2015/lib/version.js +2 -2
  16. package/esm5/lib/grid/grid/grid.component.js +4 -4
  17. package/esm5/lib/grid/grid-sort.utils.js +7 -2
  18. package/esm5/lib/grid-v2/grid/grid-v2.component.js +14 -3
  19. package/esm5/lib/grid-v2/grid/grid-v2.config.js +30 -4
  20. package/esm5/lib/grid-v2/grid-controller/grid-controller.component.js +62 -24
  21. package/esm5/lib/grid-v2/grid-header/grid-header.component.js +3 -2
  22. package/esm5/lib/grid-v2/grid-store/grid.query.js +9 -5
  23. package/esm5/lib/grid-v2/grid-toolbar/grid-toolbar.component.js +22 -16
  24. package/esm5/lib/version.js +2 -2
  25. package/fesm2015/datorama-core.js +133 -48
  26. package/fesm2015/datorama-core.js.map +1 -1
  27. package/fesm5/datorama-core.js +141 -48
  28. package/fesm5/datorama-core.js.map +1 -1
  29. package/lib/grid-v2/grid/grid-v2.component.d.ts +4 -0
  30. package/lib/grid-v2/grid-controller/grid-controller.component.d.ts +15 -0
  31. package/lib/grid-v2/grid-toolbar/grid-toolbar.component.d.ts +1 -0
  32. package/package.json +1 -1
package/bundle.scss CHANGED
@@ -18369,65 +18369,97 @@ dato-input input:disabled:hover {
18369
18369
  display: block;
18370
18370
  position: relative;
18371
18371
  cursor: pointer;
18372
- font-size: 22px;
18373
18372
  user-select: none;
18374
18373
  height: 16px;
18375
18374
  width: 16px;
18376
18375
  margin-top: 4px;
18377
18376
  margin-right: 12px;
18378
18377
  }
18379
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon {
18378
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox,
18379
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-input-field {
18380
+ display: block;
18381
+ position: static;
18380
18382
  height: 100%;
18381
18383
  width: 100%;
18384
+ }
18385
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper {
18386
+ box-sizing: border-box;
18387
+ height: 16px;
18388
+ width: 16px;
18389
+ min-height: 16px;
18390
+ min-width: 16px;
18382
18391
  border-radius: 2px;
18383
18392
  position: absolute;
18384
- top: 0;
18393
+ top: 50%;
18385
18394
  left: 0;
18395
+ margin-top: -8px;
18396
+ font-size: 0;
18397
+ line-height: normal;
18398
+ box-shadow: none;
18399
+ background-image: none;
18400
+ background-color: themify(primary-0);
18401
+ border: solid 1px themify(primary-300);
18402
+ }
18403
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper .ag-checkbox-input {
18404
+ opacity: 0;
18405
+ height: 100%;
18406
+ width: 100%;
18407
+ margin: 0;
18408
+ cursor: pointer;
18386
18409
  }
18387
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon:after {
18410
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper:after {
18388
18411
  content: "";
18389
18412
  position: absolute;
18390
18413
  display: none;
18391
- left: 6px;
18392
- top: 3px;
18414
+ left: 50%;
18415
+ top: 45%;
18393
18416
  width: 5px;
18394
- height: 10px;
18417
+ height: 9px;
18395
18418
  border: solid white;
18396
18419
  border-width: 0 2px 2px 0;
18397
- transform: rotate(45deg);
18420
+ transform: translate(-50%, -50%) rotate(45deg);
18398
18421
  box-sizing: border-box;
18399
18422
  }
18400
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-checked {
18423
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper:hover {
18424
+ border-color: themify(accent-500);
18425
+ }
18426
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper:active {
18427
+ border-color: themify(accent-600);
18428
+ }
18429
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-checked {
18401
18430
  background-color: themify(accent-400);
18431
+ border-color: themify(accent-400);
18402
18432
  }
18403
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-checked:hover {
18433
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-checked:hover {
18404
18434
  background-color: themify(accent-500);
18435
+ border-color: themify(accent-500);
18405
18436
  }
18406
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-checked:active {
18437
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-checked:active {
18407
18438
  background-color: themify(accent-600);
18439
+ border-color: themify(accent-600);
18408
18440
  }
18409
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-checked:after {
18441
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-checked:after {
18410
18442
  display: block;
18411
18443
  }
18412
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-checked:before {
18413
- display: none;
18414
- }
18415
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-unchecked,
18416
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-indeterminate {
18444
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-indeterminate {
18417
18445
  background-color: themify(primary-0);
18418
18446
  border: solid 1px themify(primary-300);
18419
18447
  }
18420
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-unchecked:hover,
18421
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-indeterminate:hover {
18448
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-indeterminate:hover {
18422
18449
  border-color: themify(accent-500);
18423
18450
  }
18424
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-unchecked:active,
18425
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-indeterminate:active {
18451
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-indeterminate:active {
18426
18452
  border-color: themify(accent-600);
18427
18453
  }
18428
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-unchecked:before,
18429
- .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-icon.ag-icon-checkbox-indeterminate:before {
18430
- display: none;
18454
+ .dato-grid .ag-header .ag-header-cell .ag-header-select-all .ag-checkbox-input-wrapper.ag-indeterminate:after {
18455
+ display: block;
18456
+ left: 50%;
18457
+ top: 50%;
18458
+ width: 8px;
18459
+ height: 0;
18460
+ border: none;
18461
+ border-top: 2px solid themify(primary-300);
18462
+ transform: translate(-50%, -50%);
18431
18463
  }
18432
18464
  .dato-grid .ag-header .ag-header-cell-label {
18433
18465
  font-size: 12px;
@@ -18478,71 +18510,111 @@ dato-input input:disabled:hover {
18478
18510
  }
18479
18511
  .dato-grid .ag-cell {
18480
18512
  -webkit-font-smoothing: antialiased;
18513
+ overflow: hidden;
18514
+ }
18515
+ .dato-grid .ag-cell > .ag-cell-wrapper {
18516
+ min-width: 0;
18517
+ }
18518
+ .dato-grid .ag-cell.checkbox-selection-cell .ag-cell-wrapper {
18519
+ height: 100%;
18520
+ display: flex;
18521
+ align-items: center;
18481
18522
  }
18482
18523
  .dato-grid .ag-cell .ag-selection-checkbox {
18483
18524
  display: block;
18484
18525
  position: relative;
18485
18526
  cursor: pointer;
18486
- font-size: 22px;
18487
18527
  user-select: none;
18488
18528
  height: 16px;
18489
18529
  width: 16px;
18490
18530
  display: inline-block;
18491
18531
  vertical-align: middle;
18492
- margin-top: -1px;
18493
18532
  }
18494
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon {
18533
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox,
18534
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-input-field {
18535
+ display: block;
18536
+ position: static;
18495
18537
  height: 100%;
18496
18538
  width: 100%;
18539
+ }
18540
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper {
18541
+ box-sizing: border-box;
18542
+ height: 16px;
18543
+ width: 16px;
18544
+ min-height: 16px;
18545
+ min-width: 16px;
18497
18546
  border-radius: 2px;
18498
18547
  position: absolute;
18499
- top: 0;
18548
+ top: 50%;
18500
18549
  left: 0;
18550
+ margin-top: -8px;
18551
+ font-size: 0;
18552
+ line-height: normal;
18553
+ box-shadow: none;
18554
+ background-image: none;
18555
+ background-color: themify(primary-0);
18556
+ border: solid 1px themify(primary-300);
18501
18557
  }
18502
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon:after {
18558
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper .ag-checkbox-input {
18559
+ opacity: 0;
18560
+ height: 100%;
18561
+ width: 100%;
18562
+ margin: 0;
18563
+ cursor: pointer;
18564
+ }
18565
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper:after {
18503
18566
  content: "";
18504
18567
  position: absolute;
18505
18568
  display: none;
18506
- left: 6px;
18507
- top: 3px;
18569
+ left: 50%;
18570
+ top: 45%;
18508
18571
  width: 5px;
18509
- height: 10px;
18572
+ height: 9px;
18510
18573
  border: solid white;
18511
18574
  border-width: 0 2px 2px 0;
18512
- transform: rotate(45deg);
18575
+ transform: translate(-50%, -50%) rotate(45deg);
18513
18576
  box-sizing: border-box;
18514
18577
  }
18515
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked {
18578
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper:hover {
18579
+ border-color: themify(accent-500);
18580
+ }
18581
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper:active {
18582
+ border-color: themify(accent-600);
18583
+ }
18584
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-checked {
18516
18585
  background-color: themify(accent-400);
18586
+ border-color: themify(accent-400);
18517
18587
  }
18518
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:hover {
18588
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-checked:hover {
18519
18589
  background-color: themify(accent-500);
18590
+ border-color: themify(accent-500);
18520
18591
  }
18521
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:active {
18592
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-checked:active {
18522
18593
  background-color: themify(accent-600);
18594
+ border-color: themify(accent-600);
18523
18595
  }
18524
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:after {
18596
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-checked:after {
18525
18597
  display: block;
18526
18598
  }
18527
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-checked:before {
18528
- display: none;
18529
- }
18530
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked,
18531
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate {
18599
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate {
18532
18600
  background-color: themify(primary-0);
18533
18601
  border: solid 1px themify(primary-300);
18534
18602
  }
18535
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:hover,
18536
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:hover {
18603
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate:hover {
18537
18604
  border-color: themify(accent-500);
18538
18605
  }
18539
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:active,
18540
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:active {
18606
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate:active {
18541
18607
  border-color: themify(accent-600);
18542
18608
  }
18543
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-unchecked:before,
18544
- .dato-grid .ag-cell .ag-selection-checkbox .ag-icon.ag-icon-checkbox-indeterminate:before {
18545
- display: none;
18609
+ .dato-grid .ag-cell .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate:after {
18610
+ display: block;
18611
+ left: 50%;
18612
+ top: 50%;
18613
+ width: 8px;
18614
+ height: 0;
18615
+ border: none;
18616
+ border-top: 2px solid themify(primary-300);
18617
+ transform: translate(-50%, -50%);
18546
18618
  }
18547
18619
  .dato-grid .ag-cell .ag-selection-checkbox .ag-cell-value {
18548
18620
  margin-left: 0;
@@ -18777,7 +18849,7 @@ dato-grid-v2 ag-grid-angular:not(.with-multi-selection-col) .ag-pinned-left-cols
18777
18849
  dato-grid-v2 ag-grid-angular.tree .ag-cell .initials {
18778
18850
  background-color: themify(primary-100) !important;
18779
18851
  }
18780
- dato-grid-v2 ag-grid-angular.tree .ag-selection-checkbox .ag-icon-checkbox-indeterminate {
18852
+ dato-grid-v2 ag-grid-angular.tree .ag-selection-checkbox .ag-checkbox-input-wrapper.ag-indeterminate {
18781
18853
  background-color: themify(primary-200) !important;
18782
18854
  }
18783
18855