igniteui-angular 21.0.0-beta.0 → 21.0.0-beta.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 (52) hide show
  1. package/fesm2022/igniteui-angular-accordion.mjs +7 -7
  2. package/fesm2022/igniteui-angular-action-strip.mjs +10 -10
  3. package/fesm2022/igniteui-angular-avatar.mjs +7 -7
  4. package/fesm2022/igniteui-angular-badge.mjs +7 -7
  5. package/fesm2022/igniteui-angular-banner.mjs +10 -10
  6. package/fesm2022/igniteui-angular-bottom-nav.mjs +22 -22
  7. package/fesm2022/igniteui-angular-button-group.mjs +7 -7
  8. package/fesm2022/igniteui-angular-calendar.mjs +58 -58
  9. package/fesm2022/igniteui-angular-card.mjs +31 -31
  10. package/fesm2022/igniteui-angular-carousel.mjs +25 -25
  11. package/fesm2022/igniteui-angular-chat-extras.mjs +6 -6
  12. package/fesm2022/igniteui-angular-chat.mjs +18 -18
  13. package/fesm2022/igniteui-angular-chat.mjs.map +1 -1
  14. package/fesm2022/igniteui-angular-checkbox.mjs +7 -7
  15. package/fesm2022/igniteui-angular-chips.mjs +10 -10
  16. package/fesm2022/igniteui-angular-combo.mjs +52 -52
  17. package/fesm2022/igniteui-angular-core.mjs +48 -48
  18. package/fesm2022/igniteui-angular-date-picker.mjs +38 -38
  19. package/fesm2022/igniteui-angular-dialog.mjs +13 -13
  20. package/fesm2022/igniteui-angular-directives.mjs +191 -191
  21. package/fesm2022/igniteui-angular-drop-down.mjs +29 -29
  22. package/fesm2022/igniteui-angular-expansion-panel.mjs +28 -28
  23. package/fesm2022/igniteui-angular-grids-core.mjs +429 -429
  24. package/fesm2022/igniteui-angular-grids-grid.mjs +42 -42
  25. package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs +33 -33
  26. package/fesm2022/igniteui-angular-grids-pivot-grid.mjs +75 -75
  27. package/fesm2022/igniteui-angular-grids-tree-grid.mjs +51 -51
  28. package/fesm2022/igniteui-angular-icon.mjs +10 -10
  29. package/fesm2022/igniteui-angular-input-group.mjs +26 -26
  30. package/fesm2022/igniteui-angular-input-group.mjs.map +1 -1
  31. package/fesm2022/igniteui-angular-list.mjs +40 -40
  32. package/fesm2022/igniteui-angular-navbar.mjs +13 -13
  33. package/fesm2022/igniteui-angular-navigation-drawer.mjs +16 -16
  34. package/fesm2022/igniteui-angular-paginator.mjs +19 -19
  35. package/fesm2022/igniteui-angular-progressbar.mjs +19 -19
  36. package/fesm2022/igniteui-angular-query-builder.mjs +22 -22
  37. package/fesm2022/igniteui-angular-radio.mjs +12 -12
  38. package/fesm2022/igniteui-angular-radio.mjs.map +1 -1
  39. package/fesm2022/igniteui-angular-select.mjs +25 -25
  40. package/fesm2022/igniteui-angular-simple-combo.mjs +7 -7
  41. package/fesm2022/igniteui-angular-slider.mjs +28 -28
  42. package/fesm2022/igniteui-angular-snackbar.mjs +7 -7
  43. package/fesm2022/igniteui-angular-splitter.mjs +14 -14
  44. package/fesm2022/igniteui-angular-splitter.mjs.map +1 -1
  45. package/fesm2022/igniteui-angular-stepper.mjs +34 -34
  46. package/fesm2022/igniteui-angular-switch.mjs +7 -7
  47. package/fesm2022/igniteui-angular-tabs.mjs +34 -34
  48. package/fesm2022/igniteui-angular-time-picker.mjs +19 -19
  49. package/fesm2022/igniteui-angular-toast.mjs +7 -7
  50. package/fesm2022/igniteui-angular-tree.mjs +28 -28
  51. package/migrations/update-21_0_0_import-migration/index.js +4 -0
  52. package/package.json +2 -2
@@ -100,10 +100,10 @@ class IgxPivotRowPipe {
100
100
  const data = cloneArray(collection, true);
101
101
  return rowStrategy.process(data, enabledRows, config.values, cloneStrategy, pivotKeys);
102
102
  }
103
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
104
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowPipe, isStandalone: true, name: "pivotGridRow" }); }
103
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
104
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowPipe, isStandalone: true, name: "pivotGridRow" }); }
105
105
  }
106
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowPipe, decorators: [{
106
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowPipe, decorators: [{
107
107
  type: Pipe,
108
108
  args: [{
109
109
  name: 'pivotGridRow',
@@ -167,10 +167,10 @@ class IgxPivotAutoTransform {
167
167
  }
168
168
  return result;
169
169
  }
170
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotAutoTransform, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
171
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotAutoTransform, isStandalone: true, name: "pivotGridAutoTransform" }); }
170
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotAutoTransform, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
171
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotAutoTransform, isStandalone: true, name: "pivotGridAutoTransform" }); }
172
172
  }
173
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotAutoTransform, decorators: [{
173
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotAutoTransform, decorators: [{
174
174
  type: Pipe,
175
175
  args: [{
176
176
  name: 'pivotGridAutoTransform',
@@ -214,10 +214,10 @@ class IgxPivotRowExpansionPipe {
214
214
  }
215
215
  return finalData;
216
216
  }
217
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowExpansionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
218
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowExpansionPipe, isStandalone: true, name: "pivotGridRowExpansion" }); }
217
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowExpansionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
218
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowExpansionPipe, isStandalone: true, name: "pivotGridRowExpansion" }); }
219
219
  }
220
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowExpansionPipe, decorators: [{
220
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowExpansionPipe, decorators: [{
221
221
  type: Pipe,
222
222
  args: [{
223
223
  name: 'pivotGridRowExpansion',
@@ -269,10 +269,10 @@ class IgxPivotCellMergingPipe {
269
269
  }
270
270
  return res;
271
271
  }
272
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotCellMergingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
273
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotCellMergingPipe, isStandalone: true, name: "pivotGridCellMerging" }); }
272
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotCellMergingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
273
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotCellMergingPipe, isStandalone: true, name: "pivotGridCellMerging" }); }
274
274
  }
275
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotCellMergingPipe, decorators: [{
275
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotCellMergingPipe, decorators: [{
276
276
  type: Pipe,
277
277
  args: [{
278
278
  name: 'pivotGridCellMerging',
@@ -311,10 +311,10 @@ class IgxPivotGridHorizontalRowGrouping {
311
311
  res.push(curGroup);
312
312
  return res;
313
313
  }
314
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridHorizontalRowGrouping, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
315
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridHorizontalRowGrouping, isStandalone: true, name: "pivotGridHorizontalRowGrouping" }); }
314
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridHorizontalRowGrouping, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
315
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridHorizontalRowGrouping, isStandalone: true, name: "pivotGridHorizontalRowGrouping" }); }
316
316
  }
317
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridHorizontalRowGrouping, decorators: [{
317
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridHorizontalRowGrouping, decorators: [{
318
318
  type: Pipe,
319
319
  args: [{
320
320
  name: "pivotGridHorizontalRowGrouping",
@@ -396,10 +396,10 @@ class IgxPivotGridHorizontalRowCellMerging {
396
396
  }
397
397
  return res;
398
398
  }
399
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridHorizontalRowCellMerging, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
400
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridHorizontalRowCellMerging, isStandalone: true, name: "pivotGridHorizontalRowCellMerging" }); }
399
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridHorizontalRowCellMerging, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
400
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridHorizontalRowCellMerging, isStandalone: true, name: "pivotGridHorizontalRowCellMerging" }); }
401
401
  }
402
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridHorizontalRowCellMerging, decorators: [{
402
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridHorizontalRowCellMerging, decorators: [{
403
403
  type: Pipe,
404
404
  args: [{
405
405
  name: "pivotGridHorizontalRowCellMerging",
@@ -418,10 +418,10 @@ class IgxPivotColumnPipe {
418
418
  const data = cloneArray(collection, true);
419
419
  return colStrategy.process(data, enabledColumns, enabledValues, cloneStrategy, pivotKeys);
420
420
  }
421
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotColumnPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
422
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotColumnPipe, isStandalone: true, name: "pivotGridColumn" }); }
421
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotColumnPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
422
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotColumnPipe, isStandalone: true, name: "pivotGridColumn" }); }
423
423
  }
424
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotColumnPipe, decorators: [{
424
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotColumnPipe, decorators: [{
425
425
  type: Pipe,
426
426
  args: [{
427
427
  name: 'pivotGridColumn',
@@ -449,10 +449,10 @@ class IgxPivotGridFilterPipe {
449
449
  const result = FilterUtil.filter(cloneArray(collection, true), state, this.gridAPI.grid);
450
450
  return result;
451
451
  }
452
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
453
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridFilterPipe, isStandalone: true, name: "pivotGridFilter" }); }
452
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridFilterPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
453
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridFilterPipe, isStandalone: true, name: "pivotGridFilter" }); }
454
454
  }
455
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridFilterPipe, decorators: [{
455
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridFilterPipe, decorators: [{
456
456
  type: Pipe,
457
457
  args: [{
458
458
  name: 'pivotGridFilter',
@@ -477,10 +477,10 @@ class IgxPivotGridColumnSortingPipe {
477
477
  }
478
478
  return result;
479
479
  }
480
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridColumnSortingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
481
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridColumnSortingPipe, isStandalone: true, name: "pivotGridColumnSort" }); }
480
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridColumnSortingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
481
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridColumnSortingPipe, isStandalone: true, name: "pivotGridColumnSort" }); }
482
482
  }
483
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridColumnSortingPipe, decorators: [{
483
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridColumnSortingPipe, decorators: [{
484
484
  type: Pipe,
485
485
  args: [{
486
486
  name: 'pivotGridColumnSort',
@@ -508,10 +508,10 @@ class IgxPivotGridSortingPipe {
508
508
  }
509
509
  return result;
510
510
  }
511
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridSortingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
512
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridSortingPipe, isStandalone: true, name: "pivotGridSort" }); }
511
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridSortingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
512
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridSortingPipe, isStandalone: true, name: "pivotGridSort" }); }
513
513
  }
514
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridSortingPipe, decorators: [{
514
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridSortingPipe, decorators: [{
515
515
  type: Pipe,
516
516
  args: [{
517
517
  name: 'pivotGridSort',
@@ -543,10 +543,10 @@ class IgxFilterPivotItemsPipe {
543
543
  }
544
544
  return copy;
545
545
  }
546
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxFilterPivotItemsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
547
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxFilterPivotItemsPipe, isStandalone: true, name: "filterPivotItems" }); }
546
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxFilterPivotItemsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
547
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxFilterPivotItemsPipe, isStandalone: true, name: "filterPivotItems" }); }
548
548
  }
549
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxFilterPivotItemsPipe, decorators: [{
549
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxFilterPivotItemsPipe, decorators: [{
550
550
  type: Pipe,
551
551
  args: [{
552
552
  name: "filterPivotItems",
@@ -570,10 +570,10 @@ class IgxPivotGridCellStyleClassesPipe {
570
570
  }
571
571
  return result.join(' ');
572
572
  }
573
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridCellStyleClassesPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
574
- static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridCellStyleClassesPipe, isStandalone: true, name: "igxPivotCellStyleClasses" }); }
573
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridCellStyleClassesPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
574
+ static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridCellStyleClassesPipe, isStandalone: true, name: "igxPivotCellStyleClasses" }); }
575
575
  }
576
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridCellStyleClassesPipe, decorators: [{
576
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridCellStyleClassesPipe, decorators: [{
577
577
  type: Pipe,
578
578
  args: [{
579
579
  name: 'igxPivotCellStyleClasses',
@@ -1086,10 +1086,10 @@ class IgxPivotDataSelectorComponent {
1086
1086
  this.valuesExpandedChange.emit(this.valuesExpanded);
1087
1087
  }
1088
1088
  }
1089
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotDataSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1090
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotDataSelectorComponent, isStandalone: true, selector: "igx-pivot-data-selector", inputs: { columnsExpanded: ["columnsExpanded", "columnsExpanded", booleanAttribute], rowsExpanded: ["rowsExpanded", "rowsExpanded", booleanAttribute], filtersExpanded: ["filtersExpanded", "filtersExpanded", booleanAttribute], valuesExpanded: ["valuesExpanded", "valuesExpanded", booleanAttribute], grid: "grid" }, outputs: { columnsExpandedChange: "columnsExpandedChange", rowsExpandedChange: "rowsExpandedChange", filtersExpandedChange: "filtersExpandedChange", valuesExpandedChange: "valuesExpandedChange" }, host: { properties: { "class.igx-pivot-data-selector": "this.cssClass", "style.--ig-size": "this.size" } }, ngImport: i0, template: "<div class=\"igx-pivot-data-selector__filter\">\n <igx-input-group type=\"box\">\n <igx-icon family=\"default\" name=\"search\" igxPrefix></igx-icon>\n <input\n #input\n igxInput\n tabindex=\"0\"\n placeholder=\"Search\"\n autocomplete=\"off\"\n />\n </igx-input-group>\n <igx-list>\n @for (\n item of dims | filterPivotItems: input.value:grid?.pipeTrigger;\n track item.memberName\n ) {\n <igx-list-item [id]=\"item.memberName\">\n <igx-checkbox\n [aria-labelledby]=\"item.memberName\"\n [disableRipple]=\"true\"\n [checked]=\"item.enabled\"\n (click)=\"toggleItem(item)\"\n ></igx-checkbox>\n <span>{{ item.displayName || item.memberName }}</span>\n </igx-list-item>\n }\n @for (\n item of values | filterPivotItems: input.value:grid?.pipeTrigger;\n track item\n ) {\n <igx-list-item [id]=\"item.member\">\n <igx-checkbox\n [aria-labelledby]=\"item.member\"\n [disableRipple]=\"true\"\n [checked]=\"item.enabled\"\n (click)=\"toggleItem(item)\"\n ></igx-checkbox>\n <span>{{ item.displayName || item.member }}</span>\n </igx-list-item>\n }\n </igx-list>\n</div>\n\n<igx-accordion>\n @for (panel of _panels; track panel) {\n <igx-expansion-panel\n [animationSettings]=\"animationSettings\"\n [collapsed]=\"getPanelCollapsed(panel.type)\"\n (collapsedChange)=\"onCollapseChange($event, panel.type)\"\n >\n <igx-expansion-panel-header\n iconPosition=\"left\"\n [disabled]=\"false\"\n igxDrop\n (enter)=\"onPanelEntry($event, panel.name)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n >\n <igx-expansion-panel-title class=\"igx-pivot-data-selector__header\">\n <h6 class=\"igx-pivot-data-selector__header-title\">\n {{ grid?.resourceStrings[panel.i18n] }}\n </h6>\n <div class=\"igx-pivot-data-selector__header-extra\">\n <igx-icon family=\"default\" [name]=\"panel.icon\"></igx-icon>\n <igx-chip>{{ this.grid ? this.grid[panel.dataKey].length : 0 }}</igx-chip>\n </div>\n </igx-expansion-panel-title>\n </igx-expansion-panel-header>\n <igx-expansion-panel-body\n igxDrop\n (enter)=\"onPanelEntry($event, panel.name)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n >\n @if (this.grid && this.grid[panel.dataKey].length > 0) {\n <igx-list>\n @for (\n item of this.grid[panel.dataKey];\n track (item.memberName || item.member)\n ) {\n <igx-list-item\n igxDrop\n [igxDrag]=\"{ gridID: grid.id, selectorChannels: panel.dragChannels }\"\n [ghostTemplate]=\"itemGhost\"\n (ghostCreate)=\"ghostCreated($event, item[panel.itemKey])\"\n (over)=\"onItemDragOver($event)\"\n (leave)=\"onItemDragLeave($event)\"\n (dragMove)=\"onItemDragMove($event)\"\n (dragEnd)=\"onItemDragEnd($event)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n [id]=\"item[panel.itemKey]\"\n >\n <div class=\"igx-pivot-data-selector__item\">\n <div\n class=\"igx-pivot-data-selector__item-start\"\n (click)=\"onItemSort($event, item, panel.type)\"\n [class.igx-pivot-data-selector__action-sort]=\"\n panel.sortable\n \"\n >\n <div class=\"igx-pivot-data-selector__item-text\">\n @if (panel.type === null) {\n <span>{{\n item.aggregate.key\n }}</span>\n }\n @if (panel.type === null) {\n <span>(</span>\n }\n <span>{{ item[panel.displayKey] || item[panel.itemKey] }}</span>\n @if (panel.type === null) {\n <span>)</span>\n }\n </div>\n @if (panel.sortable && item.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"item.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n class=\"igx-pivot-data-selector__action-sort\"\n >\n </igx-icon>\n }\n </div>\n <div class=\"igx-pivot-data-selector__item-end\">\n @if (panel.type !== null) {\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n class=\"igx-pivot-data-selector__action-filter\"\n (pointerdown)=\"onFilteringIconPointerDown($event)\"\n (click)=\"onFilteringIconClick($event, item)\">\n </igx-icon>\n }\n @if (panel.type === null) {\n <igx-icon\n family=\"default\"\n name=\"functions\"\n class=\"igx-pivot-data-selector__action-summary\"\n (click)=\"onSummaryClick($event, item, dropdown)\"\n [igxDropDownItemNavigation]=\"dropdown\">\n </igx-icon>\n }\n @if (panel.dragChannels.length > 0) {\n <igx-icon\n family=\"default\"\n name=\"drag_indicator\"\n igxDragHandle\n class=\"igx-pivot-data-selector__action-move\"\n >\n </igx-icon>\n }\n </div>\n </div>\n </igx-list-item>\n }\n </igx-list>\n }\n @if (this.grid && this.grid[panel.dataKey].length === 0) {\n <div class=\"igx-pivot-data-selector__empty\">\n {{ grid?.resourceStrings.igx_grid_pivot_selector_panel_empty }}\n </div>\n }\n </igx-expansion-panel-body>\n </igx-expansion-panel>\n }\n</igx-accordion>\n\n<igx-drop-down #dropdown (selectionChanging)=\"onAggregationChange($event)\">\n @for (item of aggregateList; track item) {\n <igx-drop-down-item\n [selected]=\"isSelected(item)\"\n [value]=\"item\"\n >\n {{ item.label }}\n </igx-drop-down-item>\n }\n</igx-drop-down>\n\n<ng-template #itemGhost>\n <div\n class=\"igx-pivot-data-selector__item-ghost\"\n [style.width.px]=\"ghostWidth\"\n [class.igx-pivot-data-selector__item-ghost--no-drop]=\"!dropAllowed\"\n >\n <div class=\"igx-pivot-data-selector__item-ghost-text\">\n <igx-icon family=\"default\" name=\"import_export\"></igx-icon>\n <span>{{ ghostText }}</span>\n </div>\n <igx-icon family=\"default\" name=\"drag_indicator\"></igx-icon>\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: IgxInputGroupComponent, selector: "igx-input-group", inputs: ["resourceStrings", "suppressInputAutofocus", "type", "theme"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix],[igxStart]" }, { kind: "directive", type: IgxInputDirective, selector: "[igxInput]", inputs: ["value", "disabled", "required"], exportAs: ["igxInput"] }, { kind: "component", type: IgxListComponent, selector: "igx-list", inputs: ["panEndTriggeringThreshold", "id", "allowLeftPanning", "allowRightPanning", "isLoading", "resourceStrings", "role"], outputs: ["leftPan", "rightPan", "startPan", "endPan", "resetPan", "panStateChange", "itemClicked"] }, { kind: "component", type: IgxListItemComponent, selector: "igx-list-item", inputs: ["isHeader", "hidden", "index", "role", "selected"] }, { kind: "component", type: IgxCheckboxComponent, selector: "igx-checkbox", inputs: ["indeterminate", "checked", "disabled", "invalid", "readonly", "disableTransitions"] }, { kind: "component", type: IgxAccordionComponent, selector: "igx-accordion", inputs: ["id", "animationSettings", "singleBranchExpand"], outputs: ["panelExpanding", "panelExpanded", "panelCollapsing", "panelCollapsed"] }, { kind: "component", type: IgxExpansionPanelComponent, selector: "igx-expansion-panel", inputs: ["animationSettings", "id", "collapsed"], outputs: ["collapsedChange", "contentCollapsing", "contentCollapsed", "contentExpanding", "contentExpanded"] }, { kind: "component", type: IgxExpansionPanelHeaderComponent, selector: "igx-expansion-panel-header", inputs: ["lv", "role", "iconPosition", "disabled"], outputs: ["interaction"] }, { kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "directive", type: IgxExpansionPanelTitleDirective, selector: "igx-expansion-panel-title" }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["variant", "id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxExpansionPanelBodyComponent, selector: "igx-expansion-panel-body", inputs: ["role", "label", "labelledBy"] }, { kind: "directive", type: IgxDragDirective, selector: "[igxDrag]", inputs: ["igxDrag", "dragTolerance", "dragDirection", "dragChannel", "ghost", "ghostClass", "ghostStyle", "ghostTemplate", "ghostHost", "scrollContainer", "ghostOffsetX", "ghostOffsetY"], outputs: ["dragStart", "dragMove", "dragEnd", "dragClick", "ghostCreate", "ghostDestroy", "transitioned"], exportAs: ["drag"] }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "directive", type: IgxDragHandleDirective, selector: "[igxDragHandle]" }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy", "role"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "pipe", type: IgxFilterPivotItemsPipe, name: "filterPivotItems" }] }); }
1089
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotDataSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1090
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotDataSelectorComponent, isStandalone: true, selector: "igx-pivot-data-selector", inputs: { columnsExpanded: ["columnsExpanded", "columnsExpanded", booleanAttribute], rowsExpanded: ["rowsExpanded", "rowsExpanded", booleanAttribute], filtersExpanded: ["filtersExpanded", "filtersExpanded", booleanAttribute], valuesExpanded: ["valuesExpanded", "valuesExpanded", booleanAttribute], grid: "grid" }, outputs: { columnsExpandedChange: "columnsExpandedChange", rowsExpandedChange: "rowsExpandedChange", filtersExpandedChange: "filtersExpandedChange", valuesExpandedChange: "valuesExpandedChange" }, host: { properties: { "class.igx-pivot-data-selector": "this.cssClass", "style.--ig-size": "this.size" } }, ngImport: i0, template: "<div class=\"igx-pivot-data-selector__filter\">\n <igx-input-group type=\"box\">\n <igx-icon family=\"default\" name=\"search\" igxPrefix></igx-icon>\n <input\n #input\n igxInput\n tabindex=\"0\"\n placeholder=\"Search\"\n autocomplete=\"off\"\n />\n </igx-input-group>\n <igx-list>\n @for (\n item of dims | filterPivotItems: input.value:grid?.pipeTrigger;\n track item.memberName\n ) {\n <igx-list-item [id]=\"item.memberName\">\n <igx-checkbox\n [aria-labelledby]=\"item.memberName\"\n [disableRipple]=\"true\"\n [checked]=\"item.enabled\"\n (click)=\"toggleItem(item)\"\n ></igx-checkbox>\n <span>{{ item.displayName || item.memberName }}</span>\n </igx-list-item>\n }\n @for (\n item of values | filterPivotItems: input.value:grid?.pipeTrigger;\n track item\n ) {\n <igx-list-item [id]=\"item.member\">\n <igx-checkbox\n [aria-labelledby]=\"item.member\"\n [disableRipple]=\"true\"\n [checked]=\"item.enabled\"\n (click)=\"toggleItem(item)\"\n ></igx-checkbox>\n <span>{{ item.displayName || item.member }}</span>\n </igx-list-item>\n }\n </igx-list>\n</div>\n\n<igx-accordion>\n @for (panel of _panels; track panel) {\n <igx-expansion-panel\n [animationSettings]=\"animationSettings\"\n [collapsed]=\"getPanelCollapsed(panel.type)\"\n (collapsedChange)=\"onCollapseChange($event, panel.type)\"\n >\n <igx-expansion-panel-header\n iconPosition=\"left\"\n [disabled]=\"false\"\n igxDrop\n (enter)=\"onPanelEntry($event, panel.name)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n >\n <igx-expansion-panel-title class=\"igx-pivot-data-selector__header\">\n <h6 class=\"igx-pivot-data-selector__header-title\">\n {{ grid?.resourceStrings[panel.i18n] }}\n </h6>\n <div class=\"igx-pivot-data-selector__header-extra\">\n <igx-icon family=\"default\" [name]=\"panel.icon\"></igx-icon>\n <igx-chip>{{ this.grid ? this.grid[panel.dataKey].length : 0 }}</igx-chip>\n </div>\n </igx-expansion-panel-title>\n </igx-expansion-panel-header>\n <igx-expansion-panel-body\n igxDrop\n (enter)=\"onPanelEntry($event, panel.name)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n >\n @if (this.grid && this.grid[panel.dataKey].length > 0) {\n <igx-list>\n @for (\n item of this.grid[panel.dataKey];\n track (item.memberName || item.member)\n ) {\n <igx-list-item\n igxDrop\n [igxDrag]=\"{ gridID: grid.id, selectorChannels: panel.dragChannels }\"\n [ghostTemplate]=\"itemGhost\"\n (ghostCreate)=\"ghostCreated($event, item[panel.itemKey])\"\n (over)=\"onItemDragOver($event)\"\n (leave)=\"onItemDragLeave($event)\"\n (dragMove)=\"onItemDragMove($event)\"\n (dragEnd)=\"onItemDragEnd($event)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n [id]=\"item[panel.itemKey]\"\n >\n <div class=\"igx-pivot-data-selector__item\">\n <div\n class=\"igx-pivot-data-selector__item-start\"\n (click)=\"onItemSort($event, item, panel.type)\"\n [class.igx-pivot-data-selector__action-sort]=\"\n panel.sortable\n \"\n >\n <div class=\"igx-pivot-data-selector__item-text\">\n @if (panel.type === null) {\n <span>{{\n item.aggregate.key\n }}</span>\n }\n @if (panel.type === null) {\n <span>(</span>\n }\n <span>{{ item[panel.displayKey] || item[panel.itemKey] }}</span>\n @if (panel.type === null) {\n <span>)</span>\n }\n </div>\n @if (panel.sortable && item.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"item.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n class=\"igx-pivot-data-selector__action-sort\"\n >\n </igx-icon>\n }\n </div>\n <div class=\"igx-pivot-data-selector__item-end\">\n @if (panel.type !== null) {\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n class=\"igx-pivot-data-selector__action-filter\"\n (pointerdown)=\"onFilteringIconPointerDown($event)\"\n (click)=\"onFilteringIconClick($event, item)\">\n </igx-icon>\n }\n @if (panel.type === null) {\n <igx-icon\n family=\"default\"\n name=\"functions\"\n class=\"igx-pivot-data-selector__action-summary\"\n (click)=\"onSummaryClick($event, item, dropdown)\"\n [igxDropDownItemNavigation]=\"dropdown\">\n </igx-icon>\n }\n @if (panel.dragChannels.length > 0) {\n <igx-icon\n family=\"default\"\n name=\"drag_indicator\"\n igxDragHandle\n class=\"igx-pivot-data-selector__action-move\"\n >\n </igx-icon>\n }\n </div>\n </div>\n </igx-list-item>\n }\n </igx-list>\n }\n @if (this.grid && this.grid[panel.dataKey].length === 0) {\n <div class=\"igx-pivot-data-selector__empty\">\n {{ grid?.resourceStrings.igx_grid_pivot_selector_panel_empty }}\n </div>\n }\n </igx-expansion-panel-body>\n </igx-expansion-panel>\n }\n</igx-accordion>\n\n<igx-drop-down #dropdown (selectionChanging)=\"onAggregationChange($event)\">\n @for (item of aggregateList; track item) {\n <igx-drop-down-item\n [selected]=\"isSelected(item)\"\n [value]=\"item\"\n >\n {{ item.label }}\n </igx-drop-down-item>\n }\n</igx-drop-down>\n\n<ng-template #itemGhost>\n <div\n class=\"igx-pivot-data-selector__item-ghost\"\n [style.width.px]=\"ghostWidth\"\n [class.igx-pivot-data-selector__item-ghost--no-drop]=\"!dropAllowed\"\n >\n <div class=\"igx-pivot-data-selector__item-ghost-text\">\n <igx-icon family=\"default\" name=\"import_export\"></igx-icon>\n <span>{{ ghostText }}</span>\n </div>\n <igx-icon family=\"default\" name=\"drag_indicator\"></igx-icon>\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: IgxInputGroupComponent, selector: "igx-input-group", inputs: ["resourceStrings", "suppressInputAutofocus", "type", "theme"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix],[igxStart]" }, { kind: "directive", type: IgxInputDirective, selector: "[igxInput]", inputs: ["value", "disabled", "required"], exportAs: ["igxInput"] }, { kind: "component", type: IgxListComponent, selector: "igx-list", inputs: ["panEndTriggeringThreshold", "id", "allowLeftPanning", "allowRightPanning", "isLoading", "resourceStrings", "role"], outputs: ["leftPan", "rightPan", "startPan", "endPan", "resetPan", "panStateChange", "itemClicked"] }, { kind: "component", type: IgxListItemComponent, selector: "igx-list-item", inputs: ["isHeader", "hidden", "index", "role", "selected"] }, { kind: "component", type: IgxCheckboxComponent, selector: "igx-checkbox", inputs: ["indeterminate", "checked", "disabled", "invalid", "readonly", "disableTransitions"] }, { kind: "component", type: IgxAccordionComponent, selector: "igx-accordion", inputs: ["id", "animationSettings", "singleBranchExpand"], outputs: ["panelExpanding", "panelExpanded", "panelCollapsing", "panelCollapsed"] }, { kind: "component", type: IgxExpansionPanelComponent, selector: "igx-expansion-panel", inputs: ["animationSettings", "id", "collapsed"], outputs: ["collapsedChange", "contentCollapsing", "contentCollapsed", "contentExpanding", "contentExpanded"] }, { kind: "component", type: IgxExpansionPanelHeaderComponent, selector: "igx-expansion-panel-header", inputs: ["lv", "role", "iconPosition", "disabled"], outputs: ["interaction"] }, { kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "directive", type: IgxExpansionPanelTitleDirective, selector: "igx-expansion-panel-title" }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["variant", "id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxExpansionPanelBodyComponent, selector: "igx-expansion-panel-body", inputs: ["role", "label", "labelledBy"] }, { kind: "directive", type: IgxDragDirective, selector: "[igxDrag]", inputs: ["igxDrag", "dragTolerance", "dragDirection", "dragChannel", "ghost", "ghostClass", "ghostStyle", "ghostTemplate", "ghostHost", "scrollContainer", "ghostOffsetX", "ghostOffsetY"], outputs: ["dragStart", "dragMove", "dragEnd", "dragClick", "ghostCreate", "ghostDestroy", "transitioned"], exportAs: ["drag"] }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "directive", type: IgxDragHandleDirective, selector: "[igxDragHandle]" }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy", "role"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "pipe", type: IgxFilterPivotItemsPipe, name: "filterPivotItems" }] }); }
1091
1091
  }
1092
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotDataSelectorComponent, decorators: [{
1092
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotDataSelectorComponent, decorators: [{
1093
1093
  type: Component,
1094
1094
  args: [{ selector: "igx-pivot-data-selector", imports: [IgxInputGroupComponent, IgxIconComponent, IgxPrefixDirective, IgxInputDirective, IgxListComponent, IgxListItemComponent, IgxCheckboxComponent, IgxAccordionComponent, IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxDropDirective, IgxExpansionPanelTitleDirective, IgxChipComponent, IgxExpansionPanelBodyComponent, IgxDragDirective, IgxDropDownItemNavigationDirective, IgxDragHandleDirective, IgxDropDownComponent, IgxDropDownItemComponent, IgxFilterPivotItemsPipe], template: "<div class=\"igx-pivot-data-selector__filter\">\n <igx-input-group type=\"box\">\n <igx-icon family=\"default\" name=\"search\" igxPrefix></igx-icon>\n <input\n #input\n igxInput\n tabindex=\"0\"\n placeholder=\"Search\"\n autocomplete=\"off\"\n />\n </igx-input-group>\n <igx-list>\n @for (\n item of dims | filterPivotItems: input.value:grid?.pipeTrigger;\n track item.memberName\n ) {\n <igx-list-item [id]=\"item.memberName\">\n <igx-checkbox\n [aria-labelledby]=\"item.memberName\"\n [disableRipple]=\"true\"\n [checked]=\"item.enabled\"\n (click)=\"toggleItem(item)\"\n ></igx-checkbox>\n <span>{{ item.displayName || item.memberName }}</span>\n </igx-list-item>\n }\n @for (\n item of values | filterPivotItems: input.value:grid?.pipeTrigger;\n track item\n ) {\n <igx-list-item [id]=\"item.member\">\n <igx-checkbox\n [aria-labelledby]=\"item.member\"\n [disableRipple]=\"true\"\n [checked]=\"item.enabled\"\n (click)=\"toggleItem(item)\"\n ></igx-checkbox>\n <span>{{ item.displayName || item.member }}</span>\n </igx-list-item>\n }\n </igx-list>\n</div>\n\n<igx-accordion>\n @for (panel of _panels; track panel) {\n <igx-expansion-panel\n [animationSettings]=\"animationSettings\"\n [collapsed]=\"getPanelCollapsed(panel.type)\"\n (collapsedChange)=\"onCollapseChange($event, panel.type)\"\n >\n <igx-expansion-panel-header\n iconPosition=\"left\"\n [disabled]=\"false\"\n igxDrop\n (enter)=\"onPanelEntry($event, panel.name)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n >\n <igx-expansion-panel-title class=\"igx-pivot-data-selector__header\">\n <h6 class=\"igx-pivot-data-selector__header-title\">\n {{ grid?.resourceStrings[panel.i18n] }}\n </h6>\n <div class=\"igx-pivot-data-selector__header-extra\">\n <igx-icon family=\"default\" [name]=\"panel.icon\"></igx-icon>\n <igx-chip>{{ this.grid ? this.grid[panel.dataKey].length : 0 }}</igx-chip>\n </div>\n </igx-expansion-panel-title>\n </igx-expansion-panel-header>\n <igx-expansion-panel-body\n igxDrop\n (enter)=\"onPanelEntry($event, panel.name)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n >\n @if (this.grid && this.grid[panel.dataKey].length > 0) {\n <igx-list>\n @for (\n item of this.grid[panel.dataKey];\n track (item.memberName || item.member)\n ) {\n <igx-list-item\n igxDrop\n [igxDrag]=\"{ gridID: grid.id, selectorChannels: panel.dragChannels }\"\n [ghostTemplate]=\"itemGhost\"\n (ghostCreate)=\"ghostCreated($event, item[panel.itemKey])\"\n (over)=\"onItemDragOver($event)\"\n (leave)=\"onItemDragLeave($event)\"\n (dragMove)=\"onItemDragMove($event)\"\n (dragEnd)=\"onItemDragEnd($event)\"\n (dropped)=\"onItemDropped($event, panel.type)\"\n [id]=\"item[panel.itemKey]\"\n >\n <div class=\"igx-pivot-data-selector__item\">\n <div\n class=\"igx-pivot-data-selector__item-start\"\n (click)=\"onItemSort($event, item, panel.type)\"\n [class.igx-pivot-data-selector__action-sort]=\"\n panel.sortable\n \"\n >\n <div class=\"igx-pivot-data-selector__item-text\">\n @if (panel.type === null) {\n <span>{{\n item.aggregate.key\n }}</span>\n }\n @if (panel.type === null) {\n <span>(</span>\n }\n <span>{{ item[panel.displayKey] || item[panel.itemKey] }}</span>\n @if (panel.type === null) {\n <span>)</span>\n }\n </div>\n @if (panel.sortable && item.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"item.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n class=\"igx-pivot-data-selector__action-sort\"\n >\n </igx-icon>\n }\n </div>\n <div class=\"igx-pivot-data-selector__item-end\">\n @if (panel.type !== null) {\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n class=\"igx-pivot-data-selector__action-filter\"\n (pointerdown)=\"onFilteringIconPointerDown($event)\"\n (click)=\"onFilteringIconClick($event, item)\">\n </igx-icon>\n }\n @if (panel.type === null) {\n <igx-icon\n family=\"default\"\n name=\"functions\"\n class=\"igx-pivot-data-selector__action-summary\"\n (click)=\"onSummaryClick($event, item, dropdown)\"\n [igxDropDownItemNavigation]=\"dropdown\">\n </igx-icon>\n }\n @if (panel.dragChannels.length > 0) {\n <igx-icon\n family=\"default\"\n name=\"drag_indicator\"\n igxDragHandle\n class=\"igx-pivot-data-selector__action-move\"\n >\n </igx-icon>\n }\n </div>\n </div>\n </igx-list-item>\n }\n </igx-list>\n }\n @if (this.grid && this.grid[panel.dataKey].length === 0) {\n <div class=\"igx-pivot-data-selector__empty\">\n {{ grid?.resourceStrings.igx_grid_pivot_selector_panel_empty }}\n </div>\n }\n </igx-expansion-panel-body>\n </igx-expansion-panel>\n }\n</igx-accordion>\n\n<igx-drop-down #dropdown (selectionChanging)=\"onAggregationChange($event)\">\n @for (item of aggregateList; track item) {\n <igx-drop-down-item\n [selected]=\"isSelected(item)\"\n [value]=\"item\"\n >\n {{ item.label }}\n </igx-drop-down-item>\n }\n</igx-drop-down>\n\n<ng-template #itemGhost>\n <div\n class=\"igx-pivot-data-selector__item-ghost\"\n [style.width.px]=\"ghostWidth\"\n [class.igx-pivot-data-selector__item-ghost--no-drop]=\"!dropAllowed\"\n >\n <div class=\"igx-pivot-data-selector__item-ghost-text\">\n <igx-icon family=\"default\" name=\"import_export\"></igx-icon>\n <span>{{ ghostText }}</span>\n </div>\n <igx-icon family=\"default\" name=\"drag_indicator\"></igx-icon>\n </div>\n</ng-template>\n" }]
1095
1095
  }], propDecorators: { columnsExpanded: [{
@@ -1183,10 +1183,10 @@ class IgxPivotRowDimensionHeaderComponent extends IgxGridHeaderComponent {
1183
1183
  this.sortIconContainer.nativeElement.setAttribute("data-sortIndex", newSortIndex >= 0 ? newSortIndex : "");
1184
1184
  }
1185
1185
  }
1186
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1187
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotRowDimensionHeaderComponent, isStandalone: true, selector: "igx-pivot-row-dimension-header", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #defaultColumn>\n <span [title]=\"title\">{{ column.header || column.field }}</span>\n</ng-template>\n\n<ng-template #defaultESFHeaderIconTemplate>\n <igx-icon family=\"default\" name=\"more_vert\"></igx-icon>\n</ng-template>\n\n<ng-template #defaultSortHeaderIconTemplate>\n <igx-icon\n family=\"default\"\n [name]=\"sortDirection < 2 ? 'sort_asc' : 'sort_desc'\">\n </igx-icon>\n</ng-template>\n\n<span class=\"igx-grid-th__title\">\n <ng-container\n *ngTemplateOutlet=\"column.headerTemplate ? column.headerTemplate : defaultColumn; context: { $implicit: column, column: column}\">\n </ng-container>\n</span>\n@if (!column.columnGroup) {\n <div class=\"igx-grid-th__icons\">\n @if (column.sortable && !disabled) {\n <div #sortIconContainer class=\"sort-icon\"\n [attr.data-sortIndex]=\"(grid.sortingOptions.mode === 'single' && grid.sortingExpressions.length <=1) ? null : column.field | sortingIndex:grid.sortingExpressions\"\n (pointerdown)=\"onPointerDownIndicator($event)\" (click)=\"onSortingIconClick($event)\">\n <ng-container *ngTemplateOutlet=\"sortIconTemplate; context: { $implicit: this }\"></ng-container>\n </div>\n }\n @if (grid.allowFiltering && column.filterable && grid.filterMode === 'excelStyleFilter') {\n <div [ngClass]=\"filterIconClassName\" (pointerdown)=\"onPointerDownIndicator($event)\" (click)=\"onFilteringIconClick($event)\" >\n <ng-container *ngTemplateOutlet=\"esfIconTemplate; context: { $implicit: this }\"></ng-container>\n </div>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SortingIndexPipe, name: "sortingIndex" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1186
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1187
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotRowDimensionHeaderComponent, isStandalone: true, selector: "igx-pivot-row-dimension-header", host: { listeners: { "click": "onClick($event)" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #defaultColumn>\n <span [title]=\"title\">{{ column.header || column.field }}</span>\n</ng-template>\n\n<ng-template #defaultESFHeaderIconTemplate>\n <igx-icon family=\"default\" name=\"more_vert\"></igx-icon>\n</ng-template>\n\n<ng-template #defaultSortHeaderIconTemplate>\n <igx-icon\n family=\"default\"\n [name]=\"sortDirection < 2 ? 'sort_asc' : 'sort_desc'\">\n </igx-icon>\n</ng-template>\n\n<span class=\"igx-grid-th__title\">\n <ng-container\n *ngTemplateOutlet=\"column.headerTemplate ? column.headerTemplate : defaultColumn; context: { $implicit: column, column: column}\">\n </ng-container>\n</span>\n@if (!column.columnGroup) {\n <div class=\"igx-grid-th__icons\">\n @if (column.sortable && !disabled) {\n <div #sortIconContainer class=\"sort-icon\"\n [attr.data-sortIndex]=\"(grid.sortingOptions.mode === 'single' && grid.sortingExpressions.length <=1) ? null : column.field | sortingIndex:grid.sortingExpressions\"\n (pointerdown)=\"onPointerDownIndicator($event)\" (click)=\"onSortingIconClick($event)\">\n <ng-container *ngTemplateOutlet=\"sortIconTemplate; context: { $implicit: this }\"></ng-container>\n </div>\n }\n @if (grid.allowFiltering && column.filterable && grid.filterMode === 'excelStyleFilter') {\n <div [ngClass]=\"filterIconClassName\" (pointerdown)=\"onPointerDownIndicator($event)\" (click)=\"onFilteringIconClick($event)\" >\n <ng-container *ngTemplateOutlet=\"esfIconTemplate; context: { $implicit: this }\"></ng-container>\n </div>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: SortingIndexPipe, name: "sortingIndex" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1188
1188
  }
1189
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionHeaderComponent, decorators: [{
1189
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionHeaderComponent, decorators: [{
1190
1190
  type: Component,
1191
1191
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-row-dimension-header', imports: [IgxIconComponent, NgTemplateOutlet, NgClass, SortingIndexPipe], template: "<ng-template #defaultColumn>\n <span [title]=\"title\">{{ column.header || column.field }}</span>\n</ng-template>\n\n<ng-template #defaultESFHeaderIconTemplate>\n <igx-icon family=\"default\" name=\"more_vert\"></igx-icon>\n</ng-template>\n\n<ng-template #defaultSortHeaderIconTemplate>\n <igx-icon\n family=\"default\"\n [name]=\"sortDirection < 2 ? 'sort_asc' : 'sort_desc'\">\n </igx-icon>\n</ng-template>\n\n<span class=\"igx-grid-th__title\">\n <ng-container\n *ngTemplateOutlet=\"column.headerTemplate ? column.headerTemplate : defaultColumn; context: { $implicit: column, column: column}\">\n </ng-container>\n</span>\n@if (!column.columnGroup) {\n <div class=\"igx-grid-th__icons\">\n @if (column.sortable && !disabled) {\n <div #sortIconContainer class=\"sort-icon\"\n [attr.data-sortIndex]=\"(grid.sortingOptions.mode === 'single' && grid.sortingExpressions.length <=1) ? null : column.field | sortingIndex:grid.sortingExpressions\"\n (pointerdown)=\"onPointerDownIndicator($event)\" (click)=\"onSortingIconClick($event)\">\n <ng-container *ngTemplateOutlet=\"sortIconTemplate; context: { $implicit: this }\"></ng-container>\n </div>\n }\n @if (grid.allowFiltering && column.filterable && grid.filterMode === 'excelStyleFilter') {\n <div [ngClass]=\"filterIconClassName\" (pointerdown)=\"onPointerDownIndicator($event)\" (click)=\"onFilteringIconClick($event)\" >\n <ng-container *ngTemplateOutlet=\"esfIconTemplate; context: { $implicit: this }\"></ng-container>\n </div>\n }\n </div>\n}\n" }]
1192
1192
  }], ctorParameters: () => [], propDecorators: { onClick: [{
@@ -1291,10 +1291,10 @@ class IgxPivotRowHeaderGroupComponent extends IgxGridHeaderGroupComponent {
1291
1291
  getHeaderWidthFromDimension() {
1292
1292
  return this.grid.hasHorizontalLayout && this.dimWidth === -1 ? 'fit-content' : null;
1293
1293
  }
1294
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowHeaderGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1295
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotRowHeaderGroupComponent, isStandalone: true, selector: "igx-pivot-row-header-group", inputs: { rowIndex: "rowIndex", dimWidth: "dimWidth", rootDimension: "rootDimension" }, host: { properties: { "style.user-select": "this.userSelect", "attr.id": "this.headerID", "attr.title": "this.title", "class.igx-grid-th--active": "this.active", "class.asc": "this.sortAscendingStyle", "class.desc": "this.sortDescendingStyle", "class.igx-grid-th--sortable": "this.sortableStyle", "class.igx-grid-th--sorted": "this.sortedStyle" } }, viewQueries: [{ propertyName: "header", first: true, predicate: IgxPivotRowDimensionHeaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultColumn>\n <span class=\"igx-grid-th__group-title\" [title]=\"title\">{{column.header}}</span>\n</ng-template>\n\n<ng-template #defaultCollapseIndicator>\n <igx-icon\n family=\"default\"\n [name]=\"column.expanded ? 'tree_collapse' : 'tree_expand'\">\n </igx-icon>\n</ng-template>\n\n@if (!column.columnGroup) {\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-left\"></span>\n }\n <igx-pivot-row-dimension-header\n [attr.role]=\"role\"\n class=\"igx-grid-th--fw\"\n [id]=\"header ? grid.id + '_' + header.title : grid.id + '_' + column.field\"\n [ngClass]=\"column.headerClasses\"\n [ngStyle]=\"column.headerStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\"\n [igxColumnMovingDrag]=\"column\"\n [ghostHost]=\"grid.outlet.nativeElement\"\n [attr.droppable]=\"true\"\n (pointerdown)=\"pointerdown($event)\"\n [igxColumnMovingDrop]=\"column\"\n [column]=\"column\"\n (keydown)=\"grid.navigation.headerNavigation($event)\"\n [style.min-width]=\"getHeaderWidthFromDimension()\"\n [style.width]=\"getHeaderWidthFromDimension()\"\n >\n </igx-pivot-row-dimension-header>\n @if (!column.columnGroup && column.resizable) {\n <span class=\"igx-grid-th__resize-handle\"\n [igxPivotResizeHandle]=\"column\"\n [igxPivotResizeHandleHeader]=\"this\"\n [attr.draggable]=\"false\"\n [style.cursor]=\"colResizingService.resizeCursor\">\n </span>\n }\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-right\"></span>\n }\n}\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "component", type: IgxPivotRowDimensionHeaderComponent, selector: "igx-pivot-row-dimension-header" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: IgxColumnMovingDragDirective, selector: "[igxColumnMovingDrag]", inputs: ["igxColumnMovingDrag"] }, { kind: "directive", type: IgxColumnMovingDropDirective, selector: "[igxColumnMovingDrop]", inputs: ["igxColumnMovingDrop"] }, { kind: "directive", type: IgxPivotResizeHandleDirective, selector: "[igxPivotResizeHandle]", inputs: ["igxPivotResizeHandle", "igxPivotResizeHandleHeader"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1294
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowHeaderGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1295
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotRowHeaderGroupComponent, isStandalone: true, selector: "igx-pivot-row-header-group", inputs: { rowIndex: "rowIndex", dimWidth: "dimWidth", rootDimension: "rootDimension" }, host: { properties: { "style.user-select": "this.userSelect", "attr.id": "this.headerID", "attr.title": "this.title", "class.igx-grid-th--active": "this.active", "class.asc": "this.sortAscendingStyle", "class.desc": "this.sortDescendingStyle", "class.igx-grid-th--sortable": "this.sortableStyle", "class.igx-grid-th--sorted": "this.sortedStyle" } }, viewQueries: [{ propertyName: "header", first: true, predicate: IgxPivotRowDimensionHeaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultColumn>\n <span class=\"igx-grid-th__group-title\" [title]=\"title\">{{column.header}}</span>\n</ng-template>\n\n<ng-template #defaultCollapseIndicator>\n <igx-icon\n family=\"default\"\n [name]=\"column.expanded ? 'tree_collapse' : 'tree_expand'\">\n </igx-icon>\n</ng-template>\n\n@if (!column.columnGroup) {\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-left\"></span>\n }\n <igx-pivot-row-dimension-header\n [attr.role]=\"role\"\n class=\"igx-grid-th--fw\"\n [id]=\"header ? grid.id + '_' + header.title : grid.id + '_' + column.field\"\n [ngClass]=\"column.headerClasses\"\n [ngStyle]=\"column.headerStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\"\n [igxColumnMovingDrag]=\"column\"\n [ghostHost]=\"grid.outlet.nativeElement\"\n [attr.droppable]=\"true\"\n (pointerdown)=\"pointerdown($event)\"\n [igxColumnMovingDrop]=\"column\"\n [column]=\"column\"\n (keydown)=\"grid.navigation.headerNavigation($event)\"\n [style.min-width]=\"getHeaderWidthFromDimension()\"\n [style.width]=\"getHeaderWidthFromDimension()\"\n >\n </igx-pivot-row-dimension-header>\n @if (!column.columnGroup && column.resizable) {\n <span class=\"igx-grid-th__resize-handle\"\n [igxPivotResizeHandle]=\"column\"\n [igxPivotResizeHandleHeader]=\"this\"\n [attr.draggable]=\"false\"\n [style.cursor]=\"colResizingService.resizeCursor\">\n </span>\n }\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-right\"></span>\n }\n}\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "component", type: IgxPivotRowDimensionHeaderComponent, selector: "igx-pivot-row-dimension-header" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: IgxColumnMovingDragDirective, selector: "[igxColumnMovingDrag]", inputs: ["igxColumnMovingDrag"] }, { kind: "directive", type: IgxColumnMovingDropDirective, selector: "[igxColumnMovingDrop]", inputs: ["igxColumnMovingDrop"] }, { kind: "directive", type: IgxPivotResizeHandleDirective, selector: "[igxPivotResizeHandle]", inputs: ["igxPivotResizeHandle", "igxPivotResizeHandleHeader"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1296
1296
  }
1297
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowHeaderGroupComponent, decorators: [{
1297
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowHeaderGroupComponent, decorators: [{
1298
1298
  type: Component,
1299
1299
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-row-header-group', imports: [IgxIconComponent, IgxPivotRowDimensionHeaderComponent, NgClass, NgStyle, IgxColumnMovingDragDirective, IgxColumnMovingDropDirective, IgxPivotResizeHandleDirective, IgxHeaderGroupStylePipe], template: "<ng-template #defaultColumn>\n <span class=\"igx-grid-th__group-title\" [title]=\"title\">{{column.header}}</span>\n</ng-template>\n\n<ng-template #defaultCollapseIndicator>\n <igx-icon\n family=\"default\"\n [name]=\"column.expanded ? 'tree_collapse' : 'tree_expand'\">\n </igx-icon>\n</ng-template>\n\n@if (!column.columnGroup) {\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-left\"></span>\n }\n <igx-pivot-row-dimension-header\n [attr.role]=\"role\"\n class=\"igx-grid-th--fw\"\n [id]=\"header ? grid.id + '_' + header.title : grid.id + '_' + column.field\"\n [ngClass]=\"column.headerClasses\"\n [ngStyle]=\"column.headerStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\"\n [igxColumnMovingDrag]=\"column\"\n [ghostHost]=\"grid.outlet.nativeElement\"\n [attr.droppable]=\"true\"\n (pointerdown)=\"pointerdown($event)\"\n [igxColumnMovingDrop]=\"column\"\n [column]=\"column\"\n (keydown)=\"grid.navigation.headerNavigation($event)\"\n [style.min-width]=\"getHeaderWidthFromDimension()\"\n [style.width]=\"getHeaderWidthFromDimension()\"\n >\n </igx-pivot-row-dimension-header>\n @if (!column.columnGroup && column.resizable) {\n <span class=\"igx-grid-th__resize-handle\"\n [igxPivotResizeHandle]=\"column\"\n [igxPivotResizeHandleHeader]=\"this\"\n [attr.draggable]=\"false\"\n [style.cursor]=\"colResizingService.resizeCursor\">\n </span>\n }\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-right\"></span>\n }\n}\n" }]
1300
1300
  }], propDecorators: { userSelect: [{
@@ -1775,10 +1775,10 @@ class IgxPivotHeaderRowComponent extends IgxGridHeaderRowComponent {
1775
1775
  getRowDimensionColumn(dim) {
1776
1776
  return this.grid.dimensionDataColumns ? this.grid.dimensionDataColumns.find((col) => col.field === dim.memberName) : null;
1777
1777
  }
1778
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotHeaderRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1779
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotHeaderRowComponent, isStandalone: true, selector: "igx-pivot-header-row", host: { properties: { "attr.aria-activedescendant": "this.activeDescendant" } }, viewQueries: [{ propertyName: "esf", first: true, predicate: ["esf"], descendants: true }, { propertyName: "filterArea", first: true, predicate: ["filterAreaHidden"], descendants: true }, { propertyName: "filtersButton", first: true, predicate: ["filterIcon"], descendants: true }, { propertyName: "dropdownChips", first: true, predicate: ["dropdownChips"], descendants: true }, { propertyName: "pivotFilterContainer", first: true, predicate: ["pivotFilterContainer"], descendants: true }, { propertyName: "pivotRowContainer", first: true, predicate: ["pivotRowContainer"], descendants: true }, { propertyName: "notificationChips", predicate: ["notifyChip"], descendants: true }, { propertyName: "headerContainers", predicate: ["headerVirtualContainer"], descendants: true, read: IgxGridForOfDirective }, { propertyName: "rowDimensionHeaders", predicate: ["rowDimensionHeaders"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div>\n <div class=\"igx-grid-thead__wrapper igx-grid-thead__wrapper--pivot\" role=\"row\" [style.width.px]=\"width\">\n <div class=\"igx-grid__tr\" role=\"row\" [style.width.px]=\"width\">\n <div class='igx-grid__tr-pivot--filter-container'>\n @if (grid.pivotUI.showConfiguration) {\n <div #pivotFilterContainer\n class=\"igx-grid__tr-pivot igx-grid__tr-pivot--filter\" [style.min-width.px]=\"grid.pivotRowWidths - 1\"\n [style.max-width.px]=\"grid.pivotRowWidths - 1\" (igxDragLeave)=\"onAreaDragLeave($event, filterArea)\"\n igxDrop (dropped)=\"onDimDrop($event, filterArea, 2)\" (pointerdown)=\"$event.preventDefault()\">\n <!-- Filter area -->\n <igx-chips-area #filterArea droppable='true'>\n @if (grid.filterDimensions.length === 0) {\n <span id='empty' igxDrop (dropped)=\"onDimDrop($event, filterArea, 2)\"\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_filter_drop_area}}</span>\n }\n @for (filter of this.filterAreaDimensions; track filter; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(filterArea)'></span>\n <igx-chip [id]=\"filter.memberName\" [draggable]=\"true\" [data]=\"{ pivotArea: 'filter' }\"\n [removable]=\"true\" (remove)=\"filterRemoved($event)\" (dragOver)=\"onDimDragOver($event, 2)\"\n (dragLeave)=\"onDimDragLeave($event)\" (dragDrop)=\"onDimDrop($event, filterArea, 2)\"\n (moveStart)='onDimDragStart($event, filterArea)' (moveEnd)='onDimDragEnd()'>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, filter)'>\n </igx-icon>\n {{filter.displayName || filter.memberName}}\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(filterArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, filterArea, 2)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_filter_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n @if (isFiltersButton && grid.filterDimensions.length !== 0) {\n <div class=\"igx-grid__pivot-filter-toggle\">\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n #filterIcon\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFiltersAreaDropdownClick($event)'>\n </igx-icon>\n <igx-badge value=\"{{this.filterDropdownDimensions.size}}\"></igx-badge>\n </div>\n }\n </div>\n }\n <div class='igx-grid__tr-pivot--drop-row-area'>\n @if (grid.pivotUI.showConfiguration && grid.pivotUI.showRowHeaders) {\n <div #pivotRowContainer [style.width.px]=\"grid.pivotRowWidths - 1\"\n class=\"igx-grid__tr-pivot igx-grid__tr-pivot--small-row-area\" igxDrop\n (igxDragLeave)=\"onAreaDragLeave($event, rowArea)\"\n (dropped)=\"onDimDrop($event, rowArea, 0)\">\n <igx-chips-area #rowArea droppable='true'>\n @if (grid.rowDimensions.length === 0) {\n <span id='empty' igxDrop (dropped)=\"onDimDrop($event, rowArea, 0)\"\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_row_drop_area}}</span>\n }\n @for (row of grid.rowDimensions; track row.memberName; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n <igx-chip [draggable]=\"true\" [id]=\"row.memberName\" [data]=\"{ pivotArea: 'row' }\"\n [removable]=\"true\" (remove)=\"rowRemoved($event)\" (dragLeave)=\"onDimDragLeave($event)\"\n (dragDrop)=\"onDimDrop($event, rowArea, 0)\" (dragOver)=\"onDimDragOver($event, 0)\"\n (moveStart)='onDimDragStart($event, rowArea)' (moveEnd)='onDimDragEnd()'\n (click)=\"onChipSort($event, row)\">\n <igx-icon igxPrefix family=\"default\" name=\"table_rows\"></igx-icon>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, row)'>\n </igx-icon>\n {{ row.displayName || row.memberName}}\n @if (row.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"row.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n igxSuffix>\n </igx-icon>\n }\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, rowArea, 0)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_row_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n </div>\n }\n </div>\n </div>\n\n <div class=\"igx-grid__tr-pivot-group\">\n @if (grid.pivotUI.showConfiguration) {\n <div #pivotColumnContainer class=\"igx-grid__tr-pivot\"\n (dropped)=\"onDimDrop($event, colArea, 1)\" igxDrop (igxDragLeave)=\"onAreaDragLeave($event, colArea)\">\n <!-- Columns area -->\n <igx-chips-area #colArea droppable='true'>\n @if (grid.columnDimensions.length === 0) {\n <span id='empty' (dropped)=\"onDimDrop($event, colArea, 1)\" igxDrop\n class='igx-grid__pivot-empty-chip-area'>\n {{grid.resourceStrings.igx_grid_pivot_empty_column_drop_area}}</span>\n }\n @for (col of grid.columnDimensions; track col.memberName; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(colArea)'></span>\n <igx-chip [draggable]=\"true\" [id]=\"col.memberName\" [data]=\"{ pivotArea: 'column' }\"\n [removable]=\"true\" (remove)=\"columnRemoved($event)\" (dragOver)=\"onDimDragOver($event, 1)\"\n (dragLeave)=\"onDimDragLeave($event)\" (dragDrop)=\"onDimDrop($event, colArea, 1)\"\n (moveStart)='onDimDragStart($event, colArea)' (moveEnd)='onDimDragEnd()'\n (click)=\"onChipSort($event, col)\">\n <igx-icon\n family=\"default\"\n name=\"view_column\"\n igxPrefix>\n </igx-icon>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, col)'>\n </igx-icon>\n {{col.displayName || col.memberName}}\n @if (col.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"col.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n igxSuffix>\n </igx-icon>\n }\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(colArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, colArea, 1)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_column_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n </div>\n }\n\n @if (grid.pivotUI.showConfiguration) {\n <div #pivotValueContainer class=\"igx-grid__tr-pivot\"\n (pointerdown)=\"$event.preventDefault()\" (dropped)=\"onValueDrop($event, valueArea)\" igxDrop\n (igxDragLeave)=\"onAreaDragLeave($event, valueArea)\">\n <!-- Value area -->\n <igx-chips-area #valueArea droppable='true'>\n @if (grid.values.length === 0) {\n <span id='empty' (dropped)=\"onValueDrop($event, valueArea)\" igxDrop\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_value_drop_area}}</span>\n }\n @for (value of grid.values; track value.member; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(valueArea)'></span>\n <igx-chip #currChip [draggable]=\"true\" [id]=\"value.displayName || value.member\" [data]=\"{ pivotArea: 'value' }\"\n [removable]=\"true\" (remove)=\"valueRemoved($event)\"\n (dragLeave)=\"onDimDragLeave($event)\" (dragOver)=\"onDimDragOver($event)\"\n (dragDrop)=\"onValueDrop($event, valueArea)\">\n <div class=\"igx-grid__tr-pivot-toggle-icons\" igxPrefix\n (click)='onSummaryClick($event, value, dropdown, currChip)'\n (pointerdown)='$event.stopPropagation()' [igxDropDownItemNavigation]=\"dropdown\">\n <igx-icon family=\"default\" name=\"functions\"></igx-icon>\n <igx-icon family=\"default\" name=\"arrow_drop_down\"></igx-icon>\n </div>\n <ng-container *ngTemplateOutlet=\"grid.valueChipTemplate ? grid.valueChipTemplate : valueChipDefaultTemplate; context: { $implicit: value }\"></ng-container>\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(valueArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onValueDrop($event, valueArea)\" #notifyValueChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_value_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n </div>\n }\n </div>\n </div>\n </div>\n <div role=\"rowgroup\" class=\"igx-grid-thead__wrapper\" [style.width.px]=\"width\"\n [class.igx-grid__tr--mrl]=\"hasMRL\">\n\n <!-- Column headers area -->\n <div class=\"igx-grid__tr\" role=\"row\" [style.width.px]=\"width\">\n @if (!grid.pivotUI.showRowHeaders || grid.rowDimensions.length === 0) {\n <div #pivotContainer class=\"igx-grid__tr-pivot igx-grid__tr-pivot--row-area\"\n [style.width.px]=\"grid.pivotRowWidths - 1\" (igxDragLeave)=\"onAreaDragLeave($event, rowArea)\" igxDrop\n (dropped)=\"onDimDrop($event, rowArea, 0)\" (pointerdown)=\"$event.preventDefault()\">\n <!-- Row area -->\n <igx-chips-area #rowArea droppable='true'>\n @if (grid.pivotUI.showConfiguration || grid.rowDimensions.length === 0) {\n @if (grid.rowDimensions.length === 0) {\n <span id='empty' igxDrop (dropped)=\"onDimDrop($event, rowArea, 0)\"\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_row_drop_area}}</span>\n }\n @for (row of grid.rowDimensions; track row.memberName; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n <igx-chip [draggable]=\"true\" [id]=\"row.memberName\" [data]=\"{ pivotArea: 'row' }\"\n [removable]=\"true\" (remove)=\"rowRemoved($event)\" (dragLeave)=\"onDimDragLeave($event)\"\n (dragDrop)=\"onDimDrop($event, rowArea, 0)\" (dragOver)=\"onDimDragOver($event, 0)\"\n (moveStart)='onDimDragStart($event, rowArea)' (moveEnd)='onDimDragEnd()'\n (click)=\"onChipSort($event, row)\">\n <igx-icon igxPrefix family=\"default\" name=\"table_rows\"></igx-icon>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, row)'>\n </igx-icon>\n {{ row.displayName || row.memberName}}\n @if (row.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"row.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n igxSuffix>\n </igx-icon>\n }\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, rowArea, 0)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_row_drop_chip}}\n </igx-chip>\n }\n </igx-chips-area>\n </div>\n }\n\n @if (grid.pivotUI.showRowHeaders && grid.rowDimensions.length > 0) {\n <div class=\"igx-grid__tr igx-grid__tr-header-row\" [style.width.px]=\"grid.pivotRowWidths - 1\">\n @for (dim of grid.visibleRowDimensions; track dim; let colIndex = $index; let isLast = $last) {\n @if (getRowDimensionColumn(dim); as dimCol) {\n <igx-pivot-row-header-group #rowDimensionHeaders\n [ngClass]=\"dimCol.headerGroupClasses\"\n [ngStyle]=\"dimCol.headerGroupStyles | igxHeaderGroupStyle:dimCol:grid.pipeTrigger\"\n [style.width.px]=\"grid.rowDimensionWidthToPixels(this.grid.visibleRowDimensions[colIndex])\"\n [style.flex-basis.px]=\"grid.rowDimensionWidthToPixels(this.grid.visibleRowDimensions[colIndex])\"\n [column]=\"dimCol\"\n [rootDimension]=\"grid.visibleRowDimensions[colIndex]\"\n [dimWidth]=\"grid.rowDimensionWidthToPixels(this.grid.visibleRowDimensions[colIndex])\"\n [rowIndex]=\"-1\" >\n </igx-pivot-row-header-group>\n }\n }\n </div>\n }\n\n <!-- Pinned columns collection from the start -->\n @if (pinnedStartColumnCollection.length) {\n @for (column of pinnedStartColumnCollection | igxTopLevel; track column) {\n <igx-grid-header-group [ngClass]=\"column.headerGroupClasses\"\n [ngStyle]=\"column.headerGroupStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\" [column]=\"column\"\n [style.min-width]=\"column.resolvedWidth\"\n [style.flex-basis]=\"column.resolvedWidth\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-header-group>\n }\n }\n <div class=\"igx-grid-thead--virtualizationWrapper\" [style.max-height.px]=\"maxContainerHeight\" (click)=\"grid.navigation.focusOutRowHeader($event)\">\n @for (dimLevelColumns of columnDimensionsByLevel; track $index; let i = $index) {\n <div class=\"igx-grid-thead__group igx-grid-thead--virtualizationContainer\" [style.height.px]=\"totalDepth > 1 ? grid.rowHeight : undefined\" [style.width.px]=\"grid.unpinnedWidth\">\n <ng-template igxGridFor #headerVirtualContainer let-column\n [igxGridForOf]=\"dimLevelColumns\" [igxGridForOfUniqueSizeCache]=\"true\" [igxForScrollContainer]=\"grid.parentVirtDir\"\n [igxForContainerSize]=\"grid.unpinnedWidth\" [igxForTrackBy]=\"grid.trackColumnChanges\"\n [igxForSizePropName]=\"'calcPixelWidth'\" [igxForScrollOrientation]=\"'horizontal'\">\n <igx-grid-header-group [ngClass]=\"column.headerGroupClasses\"\n [style.height.px]=\"totalDepth > 1 ? calcHeight(column, i) : undefined\"\n [ngStyle]=\"column.headerGroupStyles |igxHeaderGroupStyle:column:grid.pipeTrigger\" [column]=\"column\"\n [style.min-width]=\"column.resolvedWidth\"\n [style.flex-basis]=\"column.resolvedWidth\"\n [class.igx-grid__tr-pivot--columnDimensionLeaf]=\"isDuplicateOfExistingParent(column, i)\"\n [class.igx-grid__tr-pivot--columnMultiRowSpan]=\"isMultiRow(column, i)\"\n >\n </igx-grid-header-group>\n </ng-template>\n </div>\n }\n </div>\n\n <!-- Pinned columns collection at the end -->\n @if (pinnedEndColumnCollection.length) {\n @for (column of pinnedEndColumnCollection | igxTopLevel; track column) {\n <igx-grid-header-group [ngClass]=\"column.headerGroupClasses\"\n [ngStyle]=\"column.headerGroupStyles |igxHeaderGroupStyle:column:grid.pipeTrigger\" [column]=\"column\"\n [style.min-width]=\"column.resolvedWidth\"\n [style.flex-basis]=\"column.resolvedWidth\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-header-group>\n }\n }\n </div>\n\n <!-- Render a hidden row of the leaf column headers for accessibility purposes -->\n <div role=\"row\" style=\"width: 0; height: 0; position: absolute; top: -10000px;\">\n @for (column of visibleLeafColumns; track column.index) {\n <div role=\"columnheader\" [attr.aria-hidden]=\"isLeafHeaderAriaHidden\">{{ column.header || column.field }}</div>\n }\n </div>\n </div>\n</div>\n<!-- Header thumb area -->\n<div class=\"igx-grid-thead__thumb\" [hidden]=\"!grid.hasVerticalScroll()\" [style.width.px]=\"grid.scrollSize\">\n</div>\n\n<igx-drop-down #dropdown (selectionChanging)='onAggregationChange($event)'>\n @for (item of aggregateList; track item.key) {\n <igx-drop-down-item [selected]='isSelected(item)' [value]='item'>\n {{ item.label }}\n </igx-drop-down-item>\n }\n</igx-drop-down>\n\n<div [hidden]='true'>\n <igx-grid-excel-style-filtering [maxHeight]='grid.excelStyleFilterMaxHeight' [minHeight]='grid.excelStyleFilterMinHeight' #esf>\n <div igxExcelStyleColumnOperations>\n <igx-chips-area #dropdownChips>\n @for (filter of this.filterDropdownDimensions; track filter) {\n <igx-chip [id]=\"filter.memberName\"\n [removable]=\"true\" (remove)=\"filterRemoved($event)\"\n (chipClick)='onFiltersSelectionChanged($event)' [selectable]='true' [selected]='filter === this.filterDropdownDimensions.values().next().value'>\n {{filter.displayName || filter.memberName}}\n </igx-chip>\n }\n </igx-chips-area>\n </div>\n <igx-excel-style-filter-operations>\n <igx-excel-style-search></igx-excel-style-search>\n </igx-excel-style-filter-operations>\n </igx-grid-excel-style-filtering>\n</div>\n\n<div style=\"visibility: hidden; position: absolute; top: -10000px\">\n <igx-chips-area #filterAreaHidden droppable='true'>\n @for (filter of grid.filterDimensions; track filter) {\n <igx-chip\n [id]=\"filter.memberName\"\n [draggable]=\"true\"\n [removable]=\"true\"\n (remove)=\"filterRemoved($event)\">\n <igx-icon family=\"default\" name=\"filter_list\" igxPrefix></igx-icon>\n {{filter.displayName || filter.memberName}}\n </igx-chip>\n }\n </igx-chips-area>\n</div>\n\n<ng-template #valueChipDefaultTemplate let-value>\n {{value.aggregate.key}}({{value.displayName || value.member}})\n</ng-template>\n", dependencies: [{ kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "component", type: IgxChipsAreaComponent, selector: "igx-chips-area", inputs: ["width", "height"], outputs: ["reorder", "selectionChange", "moveStart", "moveEnd"] }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["variant", "id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix],[igxStart]" }, { kind: "component", type: IgxBadgeComponent, selector: "igx-badge", inputs: ["id", "type", "value", "icon", "iconSet", "shape", "outlined", "dot"] }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix],[igxEnd]" }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IgxGridHeaderGroupComponent, selector: "igx-grid-header-group", inputs: ["column"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: IgxGridForOfDirective, selector: "[igxGridFor][igxGridForOf]", inputs: ["igxGridForOf", "igxGridForOfUniqueSizeCache", "igxGridForOfVariableSizes"], outputs: ["dataChanging"] }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy", "role"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "component", type: IgxGridExcelStyleFilteringComponent, selector: "igx-grid-excel-style-filtering", inputs: ["column", "minHeight", "maxHeight"], outputs: ["loadingStart", "loadingEnd", "initialized", "sortingChanged", "columnChange", "listDataLoaded", "filterCleared"] }, { kind: "directive", type: IgxExcelStyleColumnOperationsTemplateDirective, selector: "igx-excel-style-column-operations,[igxExcelStyleColumnOperations]" }, { kind: "directive", type: IgxExcelStyleFilterOperationsTemplateDirective, selector: "igx-excel-style-filter-operations,[igxExcelStyleFilterOperations]" }, { kind: "component", type: IgxExcelStyleSearchComponent, selector: "igx-excel-style-search", inputs: ["id"] }, { kind: "component", type: IgxPivotRowHeaderGroupComponent, selector: "igx-pivot-row-header-group", inputs: ["rowIndex", "dimWidth", "rootDimension"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }, { kind: "pipe", type: IgxGridTopLevelColumns, name: "igxTopLevel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1778
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotHeaderRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
1779
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotHeaderRowComponent, isStandalone: true, selector: "igx-pivot-header-row", host: { properties: { "attr.aria-activedescendant": "this.activeDescendant" } }, viewQueries: [{ propertyName: "esf", first: true, predicate: ["esf"], descendants: true }, { propertyName: "filterArea", first: true, predicate: ["filterAreaHidden"], descendants: true }, { propertyName: "filtersButton", first: true, predicate: ["filterIcon"], descendants: true }, { propertyName: "dropdownChips", first: true, predicate: ["dropdownChips"], descendants: true }, { propertyName: "pivotFilterContainer", first: true, predicate: ["pivotFilterContainer"], descendants: true }, { propertyName: "pivotRowContainer", first: true, predicate: ["pivotRowContainer"], descendants: true }, { propertyName: "notificationChips", predicate: ["notifyChip"], descendants: true }, { propertyName: "headerContainers", predicate: ["headerVirtualContainer"], descendants: true, read: IgxGridForOfDirective }, { propertyName: "rowDimensionHeaders", predicate: ["rowDimensionHeaders"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div>\n <div class=\"igx-grid-thead__wrapper igx-grid-thead__wrapper--pivot\" role=\"row\" [style.width.px]=\"width\">\n <div class=\"igx-grid__tr\" role=\"row\" [style.width.px]=\"width\">\n <div class='igx-grid__tr-pivot--filter-container'>\n @if (grid.pivotUI.showConfiguration) {\n <div #pivotFilterContainer\n class=\"igx-grid__tr-pivot igx-grid__tr-pivot--filter\" [style.min-width.px]=\"grid.pivotRowWidths - 1\"\n [style.max-width.px]=\"grid.pivotRowWidths - 1\" (igxDragLeave)=\"onAreaDragLeave($event, filterArea)\"\n igxDrop (dropped)=\"onDimDrop($event, filterArea, 2)\" (pointerdown)=\"$event.preventDefault()\">\n <!-- Filter area -->\n <igx-chips-area #filterArea droppable='true'>\n @if (grid.filterDimensions.length === 0) {\n <span id='empty' igxDrop (dropped)=\"onDimDrop($event, filterArea, 2)\"\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_filter_drop_area}}</span>\n }\n @for (filter of this.filterAreaDimensions; track filter; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(filterArea)'></span>\n <igx-chip [id]=\"filter.memberName\" [draggable]=\"true\" [data]=\"{ pivotArea: 'filter' }\"\n [removable]=\"true\" (remove)=\"filterRemoved($event)\" (dragOver)=\"onDimDragOver($event, 2)\"\n (dragLeave)=\"onDimDragLeave($event)\" (dragDrop)=\"onDimDrop($event, filterArea, 2)\"\n (moveStart)='onDimDragStart($event, filterArea)' (moveEnd)='onDimDragEnd()'>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, filter)'>\n </igx-icon>\n {{filter.displayName || filter.memberName}}\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(filterArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, filterArea, 2)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_filter_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n @if (isFiltersButton && grid.filterDimensions.length !== 0) {\n <div class=\"igx-grid__pivot-filter-toggle\">\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n #filterIcon\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFiltersAreaDropdownClick($event)'>\n </igx-icon>\n <igx-badge value=\"{{this.filterDropdownDimensions.size}}\"></igx-badge>\n </div>\n }\n </div>\n }\n <div class='igx-grid__tr-pivot--drop-row-area'>\n @if (grid.pivotUI.showConfiguration && grid.pivotUI.showRowHeaders) {\n <div #pivotRowContainer [style.width.px]=\"grid.pivotRowWidths - 1\"\n class=\"igx-grid__tr-pivot igx-grid__tr-pivot--small-row-area\" igxDrop\n (igxDragLeave)=\"onAreaDragLeave($event, rowArea)\"\n (dropped)=\"onDimDrop($event, rowArea, 0)\">\n <igx-chips-area #rowArea droppable='true'>\n @if (grid.rowDimensions.length === 0) {\n <span id='empty' igxDrop (dropped)=\"onDimDrop($event, rowArea, 0)\"\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_row_drop_area}}</span>\n }\n @for (row of grid.rowDimensions; track row.memberName; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n <igx-chip [draggable]=\"true\" [id]=\"row.memberName\" [data]=\"{ pivotArea: 'row' }\"\n [removable]=\"true\" (remove)=\"rowRemoved($event)\" (dragLeave)=\"onDimDragLeave($event)\"\n (dragDrop)=\"onDimDrop($event, rowArea, 0)\" (dragOver)=\"onDimDragOver($event, 0)\"\n (moveStart)='onDimDragStart($event, rowArea)' (moveEnd)='onDimDragEnd()'\n (click)=\"onChipSort($event, row)\">\n <igx-icon igxPrefix family=\"default\" name=\"table_rows\"></igx-icon>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, row)'>\n </igx-icon>\n {{ row.displayName || row.memberName}}\n @if (row.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"row.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n igxSuffix>\n </igx-icon>\n }\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, rowArea, 0)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_row_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n </div>\n }\n </div>\n </div>\n\n <div class=\"igx-grid__tr-pivot-group\">\n @if (grid.pivotUI.showConfiguration) {\n <div #pivotColumnContainer class=\"igx-grid__tr-pivot\"\n (dropped)=\"onDimDrop($event, colArea, 1)\" igxDrop (igxDragLeave)=\"onAreaDragLeave($event, colArea)\">\n <!-- Columns area -->\n <igx-chips-area #colArea droppable='true'>\n @if (grid.columnDimensions.length === 0) {\n <span id='empty' (dropped)=\"onDimDrop($event, colArea, 1)\" igxDrop\n class='igx-grid__pivot-empty-chip-area'>\n {{grid.resourceStrings.igx_grid_pivot_empty_column_drop_area}}</span>\n }\n @for (col of grid.columnDimensions; track col.memberName; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(colArea)'></span>\n <igx-chip [draggable]=\"true\" [id]=\"col.memberName\" [data]=\"{ pivotArea: 'column' }\"\n [removable]=\"true\" (remove)=\"columnRemoved($event)\" (dragOver)=\"onDimDragOver($event, 1)\"\n (dragLeave)=\"onDimDragLeave($event)\" (dragDrop)=\"onDimDrop($event, colArea, 1)\"\n (moveStart)='onDimDragStart($event, colArea)' (moveEnd)='onDimDragEnd()'\n (click)=\"onChipSort($event, col)\">\n <igx-icon\n family=\"default\"\n name=\"view_column\"\n igxPrefix>\n </igx-icon>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, col)'>\n </igx-icon>\n {{col.displayName || col.memberName}}\n @if (col.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"col.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n igxSuffix>\n </igx-icon>\n }\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(colArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, colArea, 1)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_column_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n </div>\n }\n\n @if (grid.pivotUI.showConfiguration) {\n <div #pivotValueContainer class=\"igx-grid__tr-pivot\"\n (pointerdown)=\"$event.preventDefault()\" (dropped)=\"onValueDrop($event, valueArea)\" igxDrop\n (igxDragLeave)=\"onAreaDragLeave($event, valueArea)\">\n <!-- Value area -->\n <igx-chips-area #valueArea droppable='true'>\n @if (grid.values.length === 0) {\n <span id='empty' (dropped)=\"onValueDrop($event, valueArea)\" igxDrop\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_value_drop_area}}</span>\n }\n @for (value of grid.values; track value.member; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(valueArea)'></span>\n <igx-chip #currChip [draggable]=\"true\" [id]=\"value.displayName || value.member\" [data]=\"{ pivotArea: 'value' }\"\n [removable]=\"true\" (remove)=\"valueRemoved($event)\"\n (dragLeave)=\"onDimDragLeave($event)\" (dragOver)=\"onDimDragOver($event)\"\n (dragDrop)=\"onValueDrop($event, valueArea)\">\n <div class=\"igx-grid__tr-pivot-toggle-icons\" igxPrefix\n (click)='onSummaryClick($event, value, dropdown, currChip)'\n (pointerdown)='$event.stopPropagation()' [igxDropDownItemNavigation]=\"dropdown\">\n <igx-icon family=\"default\" name=\"functions\"></igx-icon>\n <igx-icon family=\"default\" name=\"arrow_drop_down\"></igx-icon>\n </div>\n <ng-container *ngTemplateOutlet=\"grid.valueChipTemplate ? grid.valueChipTemplate : valueChipDefaultTemplate; context: { $implicit: value }\"></ng-container>\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(valueArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onValueDrop($event, valueArea)\" #notifyValueChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_value_drop_chip}}\n </igx-chip>\n </igx-chips-area>\n </div>\n }\n </div>\n </div>\n </div>\n <div role=\"rowgroup\" class=\"igx-grid-thead__wrapper\" [style.width.px]=\"width\"\n [class.igx-grid__tr--mrl]=\"hasMRL\">\n\n <!-- Column headers area -->\n <div class=\"igx-grid__tr\" role=\"row\" [style.width.px]=\"width\">\n @if (!grid.pivotUI.showRowHeaders || grid.rowDimensions.length === 0) {\n <div #pivotContainer class=\"igx-grid__tr-pivot igx-grid__tr-pivot--row-area\"\n [style.width.px]=\"grid.pivotRowWidths - 1\" (igxDragLeave)=\"onAreaDragLeave($event, rowArea)\" igxDrop\n (dropped)=\"onDimDrop($event, rowArea, 0)\" (pointerdown)=\"$event.preventDefault()\">\n <!-- Row area -->\n <igx-chips-area #rowArea droppable='true'>\n @if (grid.pivotUI.showConfiguration || grid.rowDimensions.length === 0) {\n @if (grid.rowDimensions.length === 0) {\n <span id='empty' igxDrop (dropped)=\"onDimDrop($event, rowArea, 0)\"\n class='igx-grid__pivot-empty-chip-area'>{{grid.resourceStrings.igx_grid_pivot_empty_row_drop_area}}</span>\n }\n @for (row of grid.rowDimensions; track row.memberName; let last = $last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n <igx-chip [draggable]=\"true\" [id]=\"row.memberName\" [data]=\"{ pivotArea: 'row' }\"\n [removable]=\"true\" (remove)=\"rowRemoved($event)\" (dragLeave)=\"onDimDragLeave($event)\"\n (dragDrop)=\"onDimDrop($event, rowArea, 0)\" (dragOver)=\"onDimDragOver($event, 0)\"\n (moveStart)='onDimDragStart($event, rowArea)' (moveEnd)='onDimDragEnd()'\n (click)=\"onChipSort($event, row)\">\n <igx-icon igxPrefix family=\"default\" name=\"table_rows\"></igx-icon>\n <igx-icon\n family=\"default\"\n name=\"filter_list\"\n igxPrefix\n (pointerdown)='onFilteringIconPointerDown($event)'\n (click)='onFilteringIconClick($event, row)'>\n </igx-icon>\n {{ row.displayName || row.memberName}}\n @if (row.sortDirection) {\n <igx-icon\n family=\"default\"\n [name]=\"row.sortDirection < 2 ? 'sort_asc' : 'sort_desc'\"\n igxSuffix>\n </igx-icon>\n }\n </igx-chip>\n @if (last) {\n <span class=\"igx-grid__tr-pivot--chip_drop_indicator\"\n [style.height.px]='getAreaHeight(rowArea)'></span>\n }\n }\n <igx-chip igxDrop (dragDrop)=\"onDimDrop($event, rowArea, 0)\" #notifyChip [hidden]='true'>\n {{grid.resourceStrings.igx_grid_pivot_row_drop_chip}}\n </igx-chip>\n }\n </igx-chips-area>\n </div>\n }\n\n @if (grid.pivotUI.showRowHeaders && grid.rowDimensions.length > 0) {\n <div class=\"igx-grid__tr igx-grid__tr-header-row\" [style.width.px]=\"grid.pivotRowWidths - 1\">\n @for (dim of grid.visibleRowDimensions; track dim; let colIndex = $index; let isLast = $last) {\n @if (getRowDimensionColumn(dim); as dimCol) {\n <igx-pivot-row-header-group #rowDimensionHeaders\n [ngClass]=\"dimCol.headerGroupClasses\"\n [ngStyle]=\"dimCol.headerGroupStyles | igxHeaderGroupStyle:dimCol:grid.pipeTrigger\"\n [style.width.px]=\"grid.rowDimensionWidthToPixels(this.grid.visibleRowDimensions[colIndex])\"\n [style.flex-basis.px]=\"grid.rowDimensionWidthToPixels(this.grid.visibleRowDimensions[colIndex])\"\n [column]=\"dimCol\"\n [rootDimension]=\"grid.visibleRowDimensions[colIndex]\"\n [dimWidth]=\"grid.rowDimensionWidthToPixels(this.grid.visibleRowDimensions[colIndex])\"\n [rowIndex]=\"-1\" >\n </igx-pivot-row-header-group>\n }\n }\n </div>\n }\n\n <!-- Pinned columns collection from the start -->\n @if (pinnedStartColumnCollection.length) {\n @for (column of pinnedStartColumnCollection | igxTopLevel; track column) {\n <igx-grid-header-group [ngClass]=\"column.headerGroupClasses\"\n [ngStyle]=\"column.headerGroupStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\" [column]=\"column\"\n [style.min-width]=\"column.resolvedWidth\"\n [style.flex-basis]=\"column.resolvedWidth\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-header-group>\n }\n }\n <div class=\"igx-grid-thead--virtualizationWrapper\" [style.max-height.px]=\"maxContainerHeight\" (click)=\"grid.navigation.focusOutRowHeader($event)\">\n @for (dimLevelColumns of columnDimensionsByLevel; track $index; let i = $index) {\n <div class=\"igx-grid-thead__group igx-grid-thead--virtualizationContainer\" [style.height.px]=\"totalDepth > 1 ? grid.rowHeight : undefined\" [style.width.px]=\"grid.unpinnedWidth\">\n <ng-template igxGridFor #headerVirtualContainer let-column\n [igxGridForOf]=\"dimLevelColumns\" [igxGridForOfUniqueSizeCache]=\"true\" [igxForScrollContainer]=\"grid.parentVirtDir\"\n [igxForContainerSize]=\"grid.unpinnedWidth\" [igxForTrackBy]=\"grid.trackColumnChanges\"\n [igxForSizePropName]=\"'calcPixelWidth'\" [igxForScrollOrientation]=\"'horizontal'\">\n <igx-grid-header-group [ngClass]=\"column.headerGroupClasses\"\n [style.height.px]=\"totalDepth > 1 ? calcHeight(column, i) : undefined\"\n [ngStyle]=\"column.headerGroupStyles |igxHeaderGroupStyle:column:grid.pipeTrigger\" [column]=\"column\"\n [style.min-width]=\"column.resolvedWidth\"\n [style.flex-basis]=\"column.resolvedWidth\"\n [class.igx-grid__tr-pivot--columnDimensionLeaf]=\"isDuplicateOfExistingParent(column, i)\"\n [class.igx-grid__tr-pivot--columnMultiRowSpan]=\"isMultiRow(column, i)\"\n >\n </igx-grid-header-group>\n </ng-template>\n </div>\n }\n </div>\n\n <!-- Pinned columns collection at the end -->\n @if (pinnedEndColumnCollection.length) {\n @for (column of pinnedEndColumnCollection | igxTopLevel; track column) {\n <igx-grid-header-group [ngClass]=\"column.headerGroupClasses\"\n [ngStyle]=\"column.headerGroupStyles |igxHeaderGroupStyle:column:grid.pipeTrigger\" [column]=\"column\"\n [style.min-width]=\"column.resolvedWidth\"\n [style.flex-basis]=\"column.resolvedWidth\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-header-group>\n }\n }\n </div>\n\n <!-- Render a hidden row of the leaf column headers for accessibility purposes -->\n <div role=\"row\" style=\"width: 0; height: 0; position: absolute; top: -10000px;\">\n @for (column of visibleLeafColumns; track column.index) {\n <div role=\"columnheader\" [attr.aria-hidden]=\"isLeafHeaderAriaHidden\">{{ column.header || column.field }}</div>\n }\n </div>\n </div>\n</div>\n<!-- Header thumb area -->\n<div class=\"igx-grid-thead__thumb\" [hidden]=\"!grid.hasVerticalScroll()\" [style.width.px]=\"grid.scrollSize\">\n</div>\n\n<igx-drop-down #dropdown (selectionChanging)='onAggregationChange($event)'>\n @for (item of aggregateList; track item.key) {\n <igx-drop-down-item [selected]='isSelected(item)' [value]='item'>\n {{ item.label }}\n </igx-drop-down-item>\n }\n</igx-drop-down>\n\n<div [hidden]='true'>\n <igx-grid-excel-style-filtering [maxHeight]='grid.excelStyleFilterMaxHeight' [minHeight]='grid.excelStyleFilterMinHeight' #esf>\n <div igxExcelStyleColumnOperations>\n <igx-chips-area #dropdownChips>\n @for (filter of this.filterDropdownDimensions; track filter) {\n <igx-chip [id]=\"filter.memberName\"\n [removable]=\"true\" (remove)=\"filterRemoved($event)\"\n (chipClick)='onFiltersSelectionChanged($event)' [selectable]='true' [selected]='filter === this.filterDropdownDimensions.values().next().value'>\n {{filter.displayName || filter.memberName}}\n </igx-chip>\n }\n </igx-chips-area>\n </div>\n <igx-excel-style-filter-operations>\n <igx-excel-style-search></igx-excel-style-search>\n </igx-excel-style-filter-operations>\n </igx-grid-excel-style-filtering>\n</div>\n\n<div style=\"visibility: hidden; position: absolute; top: -10000px\">\n <igx-chips-area #filterAreaHidden droppable='true'>\n @for (filter of grid.filterDimensions; track filter) {\n <igx-chip\n [id]=\"filter.memberName\"\n [draggable]=\"true\"\n [removable]=\"true\"\n (remove)=\"filterRemoved($event)\">\n <igx-icon family=\"default\" name=\"filter_list\" igxPrefix></igx-icon>\n {{filter.displayName || filter.memberName}}\n </igx-chip>\n }\n </igx-chips-area>\n</div>\n\n<ng-template #valueChipDefaultTemplate let-value>\n {{value.aggregate.key}}({{value.displayName || value.member}})\n</ng-template>\n", dependencies: [{ kind: "directive", type: IgxDropDirective, selector: "[igxDrop]", inputs: ["igxDrop", "dropChannel", "dropStrategy"], outputs: ["enter", "over", "leave", "dropped"], exportAs: ["drop"] }, { kind: "component", type: IgxChipsAreaComponent, selector: "igx-chips-area", inputs: ["width", "height"], outputs: ["reorder", "selectionChange", "moveStart", "moveEnd"] }, { kind: "component", type: IgxChipComponent, selector: "igx-chip", inputs: ["variant", "id", "tabIndex", "data", "draggable", "animateOnRelease", "hideBaseOnDrag", "removable", "removeIcon", "selectable", "selectIcon", "class", "disabled", "selected", "color", "resourceStrings"], outputs: ["selectedChange", "moveStart", "moveEnd", "remove", "chipClick", "selectedChanging", "selectedChanged", "keyDown", "dragEnter", "dragLeave", "dragOver", "dragDrop"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxPrefixDirective, selector: "igx-prefix,[igxPrefix],[igxStart]" }, { kind: "component", type: IgxBadgeComponent, selector: "igx-badge", inputs: ["id", "type", "value", "icon", "iconSet", "shape", "outlined", "dot"] }, { kind: "directive", type: IgxSuffixDirective, selector: "igx-suffix,[igxSuffix],[igxEnd]" }, { kind: "directive", type: IgxDropDownItemNavigationDirective, selector: "[igxDropDownItemNavigation]", inputs: ["igxDropDownItemNavigation"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IgxGridHeaderGroupComponent, selector: "igx-grid-header-group", inputs: ["column"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: IgxGridForOfDirective, selector: "[igxGridFor][igxGridForOf]", inputs: ["igxGridForOf", "igxGridForOfUniqueSizeCache", "igxGridForOfVariableSizes"], outputs: ["dataChanging"] }, { kind: "component", type: IgxDropDownComponent, selector: "igx-drop-down", inputs: ["allowItemsFocus", "labelledBy", "role"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "component", type: IgxDropDownItemComponent, selector: "igx-drop-down-item" }, { kind: "component", type: IgxGridExcelStyleFilteringComponent, selector: "igx-grid-excel-style-filtering", inputs: ["column", "minHeight", "maxHeight"], outputs: ["loadingStart", "loadingEnd", "initialized", "sortingChanged", "columnChange", "listDataLoaded", "filterCleared"] }, { kind: "directive", type: IgxExcelStyleColumnOperationsTemplateDirective, selector: "igx-excel-style-column-operations,[igxExcelStyleColumnOperations]" }, { kind: "directive", type: IgxExcelStyleFilterOperationsTemplateDirective, selector: "igx-excel-style-filter-operations,[igxExcelStyleFilterOperations]" }, { kind: "component", type: IgxExcelStyleSearchComponent, selector: "igx-excel-style-search", inputs: ["id"] }, { kind: "component", type: IgxPivotRowHeaderGroupComponent, selector: "igx-pivot-row-header-group", inputs: ["rowIndex", "dimWidth", "rootDimension"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }, { kind: "pipe", type: IgxGridTopLevelColumns, name: "igxTopLevel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1780
1780
  }
1781
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotHeaderRowComponent, decorators: [{
1781
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotHeaderRowComponent, decorators: [{
1782
1782
  type: Component,
1783
1783
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-header-row', imports: [IgxDropDirective, IgxChipsAreaComponent, IgxChipComponent, IgxIconComponent,
1784
1784
  IgxPrefixDirective, IgxBadgeComponent, IgxSuffixDirective, IgxDropDownItemNavigationDirective,
@@ -2173,10 +2173,10 @@ class IgxPivotGridNavigationService extends IgxGridNavigationService {
2173
2173
  });
2174
2174
  return nextCell.layout;
2175
2175
  }
2176
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridNavigationService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
2177
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridNavigationService }); }
2176
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridNavigationService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
2177
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridNavigationService }); }
2178
2178
  }
2179
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridNavigationService, decorators: [{
2179
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridNavigationService, decorators: [{
2180
2180
  type: Injectable
2181
2181
  }] });
2182
2182
 
@@ -2245,10 +2245,10 @@ class IgxPivotFilteringService extends IgxFilteringService {
2245
2245
  hideESF() {
2246
2246
  this._overlayService.hide(this.filtersESFId);
2247
2247
  }
2248
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotFilteringService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
2249
- static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotFilteringService }); }
2248
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotFilteringService, deps: null, target: i0.ɵɵFactoryTarget.Injectable }); }
2249
+ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotFilteringService }); }
2250
2250
  }
2251
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotFilteringService, decorators: [{
2251
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotFilteringService, decorators: [{
2252
2252
  type: Injectable
2253
2253
  }] });
2254
2254
 
@@ -2366,10 +2366,10 @@ class IgxPivotRowDimensionHeaderGroupComponent extends IgxGridHeaderGroupCompone
2366
2366
  get selectable() {
2367
2367
  return false;
2368
2368
  }
2369
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionHeaderGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2370
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotRowDimensionHeaderGroupComponent, isStandalone: true, selector: "igx-pivot-row-dimension-header-group", inputs: { rowIndex: "rowIndex", colIndex: "colIndex", layout: "layout", parent: "parent" }, host: { listeners: { "click": "onClick($event)" }, properties: { "style.user-select": "this.userSelect", "attr.id": "this.headerID", "attr.title": "this.title", "class.igx-grid-th--active": "this.active" } }, viewQueries: [{ propertyName: "header", first: true, predicate: IgxPivotRowDimensionHeaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultColumn>\n <span class=\"igx-grid-th__group-title\" [title]=\"title\">{{column.header}}</span>\n</ng-template>\n\n<ng-template #defaultCollapseIndicator>\n <igx-icon\n family=\"default\"\n [name]=\"column.expanded ? 'tree_collapse' : 'tree_expand'\">\n </igx-icon>\n</ng-template>\n\n@if (!column.columnGroup) {\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-left\"></span>\n }\n <igx-pivot-row-dimension-header\n [attr.role]=\"role\"\n class=\"igx-grid-th--fw\"\n [id]=\"header ? grid.id + '_' + header.title : grid.id + '_' + column.field\"\n [ngClass]=\"column.headerClasses\"\n [ngStyle]=\"column.headerStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\"\n [igxColumnMovingDrag]=\"column\"\n [ghostHost]=\"grid.outlet.nativeElement\"\n [attr.droppable]=\"true\"\n (pointerdown)=\"pointerdown($event)\"\n [igxColumnMovingDrop]=\"column\"\n [column]=\"column\"\n (keydown)=\"grid.navigation.headerNavigation($event)\"\n [style.min-width]=\"getHeaderWidthFromDimension()\"\n [style.width]=\"getHeaderWidthFromDimension()\"\n >\n </igx-pivot-row-dimension-header>\n @if (!column.columnGroup && column.resizable) {\n <span class=\"igx-grid-th__resize-handle\"\n [igxPivotResizeHandle]=\"column\"\n [igxPivotResizeHandleHeader]=\"this\"\n [attr.draggable]=\"false\"\n [style.cursor]=\"colResizingService.resizeCursor\">\n </span>\n }\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-right\"></span>\n }\n}\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "component", type: IgxPivotRowDimensionHeaderComponent, selector: "igx-pivot-row-dimension-header" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: IgxColumnMovingDragDirective, selector: "[igxColumnMovingDrag]", inputs: ["igxColumnMovingDrag"] }, { kind: "directive", type: IgxColumnMovingDropDirective, selector: "[igxColumnMovingDrop]", inputs: ["igxColumnMovingDrop"] }, { kind: "directive", type: IgxPivotResizeHandleDirective, selector: "[igxPivotResizeHandle]", inputs: ["igxPivotResizeHandle", "igxPivotResizeHandleHeader"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2369
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionHeaderGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2370
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotRowDimensionHeaderGroupComponent, isStandalone: true, selector: "igx-pivot-row-dimension-header-group", inputs: { rowIndex: "rowIndex", colIndex: "colIndex", layout: "layout", parent: "parent" }, host: { listeners: { "click": "onClick($event)" }, properties: { "style.user-select": "this.userSelect", "attr.id": "this.headerID", "attr.title": "this.title", "class.igx-grid-th--active": "this.active" } }, viewQueries: [{ propertyName: "header", first: true, predicate: IgxPivotRowDimensionHeaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultColumn>\n <span class=\"igx-grid-th__group-title\" [title]=\"title\">{{column.header}}</span>\n</ng-template>\n\n<ng-template #defaultCollapseIndicator>\n <igx-icon\n family=\"default\"\n [name]=\"column.expanded ? 'tree_collapse' : 'tree_expand'\">\n </igx-icon>\n</ng-template>\n\n@if (!column.columnGroup) {\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-left\"></span>\n }\n <igx-pivot-row-dimension-header\n [attr.role]=\"role\"\n class=\"igx-grid-th--fw\"\n [id]=\"header ? grid.id + '_' + header.title : grid.id + '_' + column.field\"\n [ngClass]=\"column.headerClasses\"\n [ngStyle]=\"column.headerStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\"\n [igxColumnMovingDrag]=\"column\"\n [ghostHost]=\"grid.outlet.nativeElement\"\n [attr.droppable]=\"true\"\n (pointerdown)=\"pointerdown($event)\"\n [igxColumnMovingDrop]=\"column\"\n [column]=\"column\"\n (keydown)=\"grid.navigation.headerNavigation($event)\"\n [style.min-width]=\"getHeaderWidthFromDimension()\"\n [style.width]=\"getHeaderWidthFromDimension()\"\n >\n </igx-pivot-row-dimension-header>\n @if (!column.columnGroup && column.resizable) {\n <span class=\"igx-grid-th__resize-handle\"\n [igxPivotResizeHandle]=\"column\"\n [igxPivotResizeHandleHeader]=\"this\"\n [attr.draggable]=\"false\"\n [style.cursor]=\"colResizingService.resizeCursor\">\n </span>\n }\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-right\"></span>\n }\n}\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "component", type: IgxPivotRowDimensionHeaderComponent, selector: "igx-pivot-row-dimension-header" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: IgxColumnMovingDragDirective, selector: "[igxColumnMovingDrag]", inputs: ["igxColumnMovingDrag"] }, { kind: "directive", type: IgxColumnMovingDropDirective, selector: "[igxColumnMovingDrop]", inputs: ["igxColumnMovingDrop"] }, { kind: "directive", type: IgxPivotResizeHandleDirective, selector: "[igxPivotResizeHandle]", inputs: ["igxPivotResizeHandle", "igxPivotResizeHandleHeader"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2371
2371
  }
2372
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionHeaderGroupComponent, decorators: [{
2372
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionHeaderGroupComponent, decorators: [{
2373
2373
  type: Component,
2374
2374
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-row-dimension-header-group', imports: [IgxIconComponent, IgxPivotRowDimensionHeaderComponent, NgClass, NgStyle, IgxColumnMovingDragDirective, IgxColumnMovingDropDirective, IgxPivotResizeHandleDirective, IgxHeaderGroupStylePipe], template: "<ng-template #defaultColumn>\n <span class=\"igx-grid-th__group-title\" [title]=\"title\">{{column.header}}</span>\n</ng-template>\n\n<ng-template #defaultCollapseIndicator>\n <igx-icon\n family=\"default\"\n [name]=\"column.expanded ? 'tree_collapse' : 'tree_expand'\">\n </igx-icon>\n</ng-template>\n\n@if (!column.columnGroup) {\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-left\"></span>\n }\n <igx-pivot-row-dimension-header\n [attr.role]=\"role\"\n class=\"igx-grid-th--fw\"\n [id]=\"header ? grid.id + '_' + header.title : grid.id + '_' + column.field\"\n [ngClass]=\"column.headerClasses\"\n [ngStyle]=\"column.headerStyles | igxHeaderGroupStyle:column:grid.pipeTrigger\"\n [igxColumnMovingDrag]=\"column\"\n [ghostHost]=\"grid.outlet.nativeElement\"\n [attr.droppable]=\"true\"\n (pointerdown)=\"pointerdown($event)\"\n [igxColumnMovingDrop]=\"column\"\n [column]=\"column\"\n (keydown)=\"grid.navigation.headerNavigation($event)\"\n [style.min-width]=\"getHeaderWidthFromDimension()\"\n [style.width]=\"getHeaderWidthFromDimension()\"\n >\n </igx-pivot-row-dimension-header>\n @if (!column.columnGroup && column.resizable) {\n <span class=\"igx-grid-th__resize-handle\"\n [igxPivotResizeHandle]=\"column\"\n [igxPivotResizeHandleHeader]=\"this\"\n [attr.draggable]=\"false\"\n [style.cursor]=\"colResizingService.resizeCursor\">\n </span>\n }\n @if (grid.hasMovableColumns) {\n <span class=\"igx-grid-th__drop-indicator-right\"></span>\n }\n}\n" }]
2375
2375
  }], propDecorators: { userSelect: [{
@@ -2504,10 +2504,10 @@ class IgxPivotRowDimensionContentComponent extends IgxGridHeaderRowComponent {
2504
2504
  }
2505
2505
  return ref.instance;
2506
2506
  }
2507
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2508
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: IgxPivotRowDimensionContentComponent, isStandalone: true, selector: "igx-pivot-row-dimension-content", inputs: { rowIndex: "rowIndex", colIndex: "colIndex", layout: "layout", dimension: "dimension", rootDimension: "rootDimension", rowData: "rowData" }, host: { properties: { "style.grid-row-start": "this.rowStart", "style.grid-row-end": "this.rowsEnd", "style.grid-column-start": "this.colStart", "style.grid-column-end": "this.colEnd" } }, viewQueries: [{ propertyName: "headerTemplate", first: true, predicate: ["headerTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headerTemplateDefault", first: true, predicate: ["headerDefaultTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headerGroups", predicate: IgxPivotRowDimensionHeaderGroupComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"igx-grid-thead__wrapper\" [style.width.px]=\"width\"\n [class.igx-grid__tr--mrl]=\"hasMRL\">\n <div class=\"igx-grid__tr igx-grid__tr-header-row\" role=\"row\" [style.width.px]=\"width\">\n <igx-pivot-row-dimension-header-group [ngClass]=\"rowDimensionColumn.headerGroupClasses\"\n [ngStyle]=\"rowDimensionColumn.headerGroupStyles | igxHeaderGroupStyle:rowDimensionColumn:grid.pipeTrigger\" [column]=\"rowDimensionColumn\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"colIndex\"\n [layout]=\"layout\"\n [parent]='this'>\n </igx-pivot-row-dimension-header-group>\n </div>\n</div>\n\n<ng-template #headerTemplate let-column>\n <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel()}}'>\n <igx-icon\n family=\"default\"\n [name]=\"getExpandState() ? 'tree_collapse' : 'tree_expand'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleRowDimension($event)\"\n >\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #headerDefaultTemplate let-column>\n <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel()}}' style=\"--component-size: 3\">\n <!--Using the igx-icon as a sizable spacer spacer here-->\n <igx-icon style='flex-shrink: 0;' [attr.draggable]=\"false\"></igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: IgxPivotRowDimensionHeaderGroupComponent, selector: "igx-pivot-row-dimension-header-group", inputs: ["rowIndex", "colIndex", "layout", "parent"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2507
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2508
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: IgxPivotRowDimensionContentComponent, isStandalone: true, selector: "igx-pivot-row-dimension-content", inputs: { rowIndex: "rowIndex", colIndex: "colIndex", layout: "layout", dimension: "dimension", rootDimension: "rootDimension", rowData: "rowData" }, host: { properties: { "style.grid-row-start": "this.rowStart", "style.grid-row-end": "this.rowsEnd", "style.grid-column-start": "this.colStart", "style.grid-column-end": "this.colEnd" } }, viewQueries: [{ propertyName: "headerTemplate", first: true, predicate: ["headerTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headerTemplateDefault", first: true, predicate: ["headerDefaultTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "headerGroups", predicate: IgxPivotRowDimensionHeaderGroupComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"igx-grid-thead__wrapper\" [style.width.px]=\"width\"\n [class.igx-grid__tr--mrl]=\"hasMRL\">\n <div class=\"igx-grid__tr igx-grid__tr-header-row\" role=\"row\" [style.width.px]=\"width\">\n <igx-pivot-row-dimension-header-group [ngClass]=\"rowDimensionColumn.headerGroupClasses\"\n [ngStyle]=\"rowDimensionColumn.headerGroupStyles | igxHeaderGroupStyle:rowDimensionColumn:grid.pipeTrigger\" [column]=\"rowDimensionColumn\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"colIndex\"\n [layout]=\"layout\"\n [parent]='this'>\n </igx-pivot-row-dimension-header-group>\n </div>\n</div>\n\n<ng-template #headerTemplate let-column>\n <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel()}}'>\n <igx-icon\n family=\"default\"\n [name]=\"getExpandState() ? 'tree_collapse' : 'tree_expand'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleRowDimension($event)\"\n >\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #headerDefaultTemplate let-column>\n <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel()}}' style=\"--component-size: 3\">\n <!--Using the igx-icon as a sizable spacer spacer here-->\n <igx-icon style='flex-shrink: 0;' [attr.draggable]=\"false\"></igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: IgxPivotRowDimensionHeaderGroupComponent, selector: "igx-pivot-row-dimension-header-group", inputs: ["rowIndex", "colIndex", "layout", "parent"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "pipe", type: IgxHeaderGroupStylePipe, name: "igxHeaderGroupStyle" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2509
2509
  }
2510
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionContentComponent, decorators: [{
2510
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionContentComponent, decorators: [{
2511
2511
  type: Component,
2512
2512
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-row-dimension-content', imports: [IgxPivotRowDimensionHeaderGroupComponent, NgClass, NgStyle, IgxIconComponent, IgxHeaderGroupStylePipe], template: "<div class=\"igx-grid-thead__wrapper\" [style.width.px]=\"width\"\n [class.igx-grid__tr--mrl]=\"hasMRL\">\n <div class=\"igx-grid__tr igx-grid__tr-header-row\" role=\"row\" [style.width.px]=\"width\">\n <igx-pivot-row-dimension-header-group [ngClass]=\"rowDimensionColumn.headerGroupClasses\"\n [ngStyle]=\"rowDimensionColumn.headerGroupStyles | igxHeaderGroupStyle:rowDimensionColumn:grid.pipeTrigger\" [column]=\"rowDimensionColumn\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"colIndex\"\n [layout]=\"layout\"\n [parent]='this'>\n </igx-pivot-row-dimension-header-group>\n </div>\n</div>\n\n<ng-template #headerTemplate let-column>\n <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel()}}'>\n <igx-icon\n family=\"default\"\n [name]=\"getExpandState() ? 'tree_collapse' : 'tree_expand'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleRowDimension($event)\"\n >\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #headerDefaultTemplate let-column>\n <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel()}}' style=\"--component-size: 3\">\n <!--Using the igx-icon as a sizable spacer spacer here-->\n <igx-icon style='flex-shrink: 0;' [attr.draggable]=\"false\"></igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n" }]
2513
2513
  }], propDecorators: { rowStart: [{
@@ -2555,10 +2555,10 @@ class IgxPivotValueChipTemplateDirective {
2555
2555
  static ngTemplateContextGuard(_directive, context) {
2556
2556
  return true;
2557
2557
  }
2558
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotValueChipTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2559
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxPivotValueChipTemplateDirective, isStandalone: true, selector: "[igxPivotValueChip]", ngImport: i0 }); }
2558
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotValueChipTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2559
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxPivotValueChipTemplateDirective, isStandalone: true, selector: "[igxPivotValueChip]", ngImport: i0 }); }
2560
2560
  }
2561
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotValueChipTemplateDirective, decorators: [{
2561
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotValueChipTemplateDirective, decorators: [{
2562
2562
  type: Directive,
2563
2563
  args: [{
2564
2564
  selector: '[igxPivotValueChip]',
@@ -2575,10 +2575,10 @@ class IgxPivotRowDimensionHeaderTemplateDirective {
2575
2575
  static ngTemplateContextGuard(_directive, context) {
2576
2576
  return true;
2577
2577
  }
2578
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionHeaderTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2579
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.0", type: IgxPivotRowDimensionHeaderTemplateDirective, isStandalone: true, selector: "[igxPivotRowDimensionHeader]", ngImport: i0 }); }
2578
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionHeaderTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
2579
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.0.2", type: IgxPivotRowDimensionHeaderTemplateDirective, isStandalone: true, selector: "[igxPivotRowDimensionHeader]", ngImport: i0 }); }
2580
2580
  }
2581
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionHeaderTemplateDirective, decorators: [{
2581
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionHeaderTemplateDirective, decorators: [{
2582
2582
  type: Directive,
2583
2583
  args: [{
2584
2584
  selector: '[igxPivotRowDimensionHeader]',
@@ -2737,10 +2737,10 @@ class IgxPivotRowComponent extends IgxRowDirective {
2737
2737
  value: pivotValue
2738
2738
  };
2739
2739
  }
2740
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2741
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.0", type: IgxPivotRowComponent, isStandalone: true, selector: "igx-pivot-row", inputs: { selected: "selected", data: "data" }, host: { properties: { "attr.aria-selected": "this.selected" } }, providers: [{ provide: IgxRowDirective, useExisting: forwardRef(() => IgxPivotRowComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-template igxGridFor let-col [igxGridForOf]=\"unpinnedColumns | igxNotGrouped\"\n [igxForScrollContainer]=\"grid.parentVirtDir\" let-colIndex=\"index\" [igxForSizePropName]='\"calcPixelWidth\"'\n [igxForScrollOrientation]=\"'horizontal'\" [igxForContainerSize]='grid.unpinnedWidth'\n [igxForTrackBy]='grid.trackColumnChanges' #igxDirRef>\n <igx-grid-cell #cell class=\"igx-grid__td igx-grid__td--fw\"\n [class.igx-grid__td--edited]=\"key | transactionState:col.field:grid.rowEditable:grid.transactions:grid.pipeTrigger:grid.gridAPI.crudService.cell:grid.gridAPI.crudService.row\"\n\n [class.igx-grid__td--number]=\"col.dataType === 'number' || col.dataType === 'percent' || col.dataType === 'currency'\"\n [class.igx-grid__td--bool]=\"col.dataType === 'boolean'\"\n [ngClass]=\"this.getCellClass(col) | igxPivotCellStyleClasses:data[col.field]:data:getColumnData(col):viewIndex:grid.pipeTrigger\"\n [ngStyle]=\"col.cellStyles | igxCellStyles:pivotAggregationData[col.field]:pivotAggregationData:col.field:viewIndex:grid.pipeTrigger\"\n [editMode]=\"col.editable && this.grid.crudService.targetInEdit(index, col.index)\" [column]=\"col\"\n [formatter]=\"col.formatter\" [intRow]=\"this\" [active]=\"isCellActive(col.visibleIndex)\"\n [rowData]=\"data\" [columnData]='getColumnData(col)'\n [style.min-width]=\"col.resolvedWidth\" [style.max-width]=\"col.resolvedWidth\"\n [style.flex-basis]=\"col.resolvedWidth\" [width]=\"col.getCellWidth()\" [visibleColumnIndex]=\"col.visibleIndex\"\n [value]=\"pivotAggregationData[col.field]\"\n [cellTemplate]=\"col.bodyTemplate\" [lastSearchInfo]=\"grid.lastSearchInfo\"\n [cellSelectionMode]=\"grid.cellSelection\" [displayPinnedChip]=\"shouldDisplayPinnedChip(col)\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-cell>\n</ng-template>\n\n<ng-template #rowSelectorBaseTemplate>\n <div class=\"igx-grid__cbx-padding\">\n <igx-checkbox [tabindex]=\"-1\" [readonly]=\"true\" [checked]=\"selected\" [disableRipple]=\"true\" [disabled]=\"deleted\"\n [disableTransitions]=\"grid.disableTransitions\" [aria-label]=\"rowCheckboxAriaLabel\">\n </igx-checkbox>\n </div>\n</ng-template>\n\n", dependencies: [{ kind: "directive", type: IgxGridForOfDirective, selector: "[igxGridFor][igxGridForOf]", inputs: ["igxGridForOf", "igxGridForOfUniqueSizeCache", "igxGridForOfVariableSizes"], outputs: ["dataChanging"] }, { kind: "component", type: IgxGridCellComponent, selector: "igx-grid-cell", inputs: ["column", "isPlaceholder", "isMerged", "intRow", "row", "rowData", "columnData", "cellTemplate", "cellValidationErrorTemplate", "pinnedIndicator", "value", "formatter", "visibleColumnIndex", "cellSelectionMode", "lastSearchInfo", "lastPinned", "firstPinned", "editMode", "width", "active", "displayPinnedChip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IgxCheckboxComponent, selector: "igx-checkbox", inputs: ["indeterminate", "checked", "disabled", "invalid", "readonly", "disableTransitions"] }, { kind: "pipe", type: IgxGridNotGroupedPipe, name: "igxNotGrouped" }, { kind: "pipe", type: IgxGridCellStylesPipe, name: "igxCellStyles" }, { kind: "pipe", type: IgxGridTransactionStatePipe, name: "transactionState" }, { kind: "pipe", type: IgxPivotGridCellStyleClassesPipe, name: "igxPivotCellStyleClasses" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2740
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2741
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.0.2", type: IgxPivotRowComponent, isStandalone: true, selector: "igx-pivot-row", inputs: { selected: "selected", data: "data" }, host: { properties: { "attr.aria-selected": "this.selected" } }, providers: [{ provide: IgxRowDirective, useExisting: forwardRef(() => IgxPivotRowComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-template igxGridFor let-col [igxGridForOf]=\"unpinnedColumns | igxNotGrouped\"\n [igxForScrollContainer]=\"grid.parentVirtDir\" let-colIndex=\"index\" [igxForSizePropName]='\"calcPixelWidth\"'\n [igxForScrollOrientation]=\"'horizontal'\" [igxForContainerSize]='grid.unpinnedWidth'\n [igxForTrackBy]='grid.trackColumnChanges' #igxDirRef>\n <igx-grid-cell #cell class=\"igx-grid__td igx-grid__td--fw\"\n [class.igx-grid__td--edited]=\"key | transactionState:col.field:grid.rowEditable:grid.transactions:grid.pipeTrigger:grid.gridAPI.crudService.cell:grid.gridAPI.crudService.row\"\n\n [class.igx-grid__td--number]=\"col.dataType === 'number' || col.dataType === 'percent' || col.dataType === 'currency'\"\n [class.igx-grid__td--bool]=\"col.dataType === 'boolean'\"\n [ngClass]=\"this.getCellClass(col) | igxPivotCellStyleClasses:data[col.field]:data:getColumnData(col):viewIndex:grid.pipeTrigger\"\n [ngStyle]=\"col.cellStyles | igxCellStyles:pivotAggregationData[col.field]:pivotAggregationData:col.field:viewIndex:grid.pipeTrigger\"\n [editMode]=\"col.editable && this.grid.crudService.targetInEdit(index, col.index)\" [column]=\"col\"\n [formatter]=\"col.formatter\" [intRow]=\"this\" [active]=\"isCellActive(col.visibleIndex)\"\n [rowData]=\"data\" [columnData]='getColumnData(col)'\n [style.min-width]=\"col.resolvedWidth\" [style.max-width]=\"col.resolvedWidth\"\n [style.flex-basis]=\"col.resolvedWidth\" [width]=\"col.getCellWidth()\" [visibleColumnIndex]=\"col.visibleIndex\"\n [value]=\"pivotAggregationData[col.field]\"\n [cellTemplate]=\"col.bodyTemplate\" [lastSearchInfo]=\"grid.lastSearchInfo\"\n [cellSelectionMode]=\"grid.cellSelection\" [displayPinnedChip]=\"shouldDisplayPinnedChip(col)\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-cell>\n</ng-template>\n\n<ng-template #rowSelectorBaseTemplate>\n <div class=\"igx-grid__cbx-padding\">\n <igx-checkbox [tabindex]=\"-1\" [readonly]=\"true\" [checked]=\"selected\" [disableRipple]=\"true\" [disabled]=\"deleted\"\n [disableTransitions]=\"grid.disableTransitions\" [aria-label]=\"rowCheckboxAriaLabel\">\n </igx-checkbox>\n </div>\n</ng-template>\n\n", dependencies: [{ kind: "directive", type: IgxGridForOfDirective, selector: "[igxGridFor][igxGridForOf]", inputs: ["igxGridForOf", "igxGridForOfUniqueSizeCache", "igxGridForOfVariableSizes"], outputs: ["dataChanging"] }, { kind: "component", type: IgxGridCellComponent, selector: "igx-grid-cell", inputs: ["column", "isPlaceholder", "isMerged", "intRow", "row", "rowData", "columnData", "cellTemplate", "cellValidationErrorTemplate", "pinnedIndicator", "value", "formatter", "visibleColumnIndex", "cellSelectionMode", "lastSearchInfo", "lastPinned", "firstPinned", "editMode", "width", "active", "displayPinnedChip"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IgxCheckboxComponent, selector: "igx-checkbox", inputs: ["indeterminate", "checked", "disabled", "invalid", "readonly", "disableTransitions"] }, { kind: "pipe", type: IgxGridNotGroupedPipe, name: "igxNotGrouped" }, { kind: "pipe", type: IgxGridCellStylesPipe, name: "igxCellStyles" }, { kind: "pipe", type: IgxGridTransactionStatePipe, name: "transactionState" }, { kind: "pipe", type: IgxPivotGridCellStyleClassesPipe, name: "igxPivotCellStyleClasses" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2742
2742
  }
2743
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowComponent, decorators: [{
2743
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowComponent, decorators: [{
2744
2744
  type: Component,
2745
2745
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-row', providers: [{ provide: IgxRowDirective, useExisting: forwardRef(() => IgxPivotRowComponent) }], imports: [IgxGridForOfDirective, IgxGridCellComponent, NgClass, NgStyle, IgxCheckboxComponent, IgxGridNotGroupedPipe, IgxGridCellStylesPipe, IgxGridTransactionStatePipe, IgxPivotGridCellStyleClassesPipe], template: "<ng-template igxGridFor let-col [igxGridForOf]=\"unpinnedColumns | igxNotGrouped\"\n [igxForScrollContainer]=\"grid.parentVirtDir\" let-colIndex=\"index\" [igxForSizePropName]='\"calcPixelWidth\"'\n [igxForScrollOrientation]=\"'horizontal'\" [igxForContainerSize]='grid.unpinnedWidth'\n [igxForTrackBy]='grid.trackColumnChanges' #igxDirRef>\n <igx-grid-cell #cell class=\"igx-grid__td igx-grid__td--fw\"\n [class.igx-grid__td--edited]=\"key | transactionState:col.field:grid.rowEditable:grid.transactions:grid.pipeTrigger:grid.gridAPI.crudService.cell:grid.gridAPI.crudService.row\"\n\n [class.igx-grid__td--number]=\"col.dataType === 'number' || col.dataType === 'percent' || col.dataType === 'currency'\"\n [class.igx-grid__td--bool]=\"col.dataType === 'boolean'\"\n [ngClass]=\"this.getCellClass(col) | igxPivotCellStyleClasses:data[col.field]:data:getColumnData(col):viewIndex:grid.pipeTrigger\"\n [ngStyle]=\"col.cellStyles | igxCellStyles:pivotAggregationData[col.field]:pivotAggregationData:col.field:viewIndex:grid.pipeTrigger\"\n [editMode]=\"col.editable && this.grid.crudService.targetInEdit(index, col.index)\" [column]=\"col\"\n [formatter]=\"col.formatter\" [intRow]=\"this\" [active]=\"isCellActive(col.visibleIndex)\"\n [rowData]=\"data\" [columnData]='getColumnData(col)'\n [style.min-width]=\"col.resolvedWidth\" [style.max-width]=\"col.resolvedWidth\"\n [style.flex-basis]=\"col.resolvedWidth\" [width]=\"col.getCellWidth()\" [visibleColumnIndex]=\"col.visibleIndex\"\n [value]=\"pivotAggregationData[col.field]\"\n [cellTemplate]=\"col.bodyTemplate\" [lastSearchInfo]=\"grid.lastSearchInfo\"\n [cellSelectionMode]=\"grid.cellSelection\" [displayPinnedChip]=\"shouldDisplayPinnedChip(col)\"\n (pointerdown)=\"grid.navigation.focusOutRowHeader($event)\">\n </igx-grid-cell>\n</ng-template>\n\n<ng-template #rowSelectorBaseTemplate>\n <div class=\"igx-grid__cbx-padding\">\n <igx-checkbox [tabindex]=\"-1\" [readonly]=\"true\" [checked]=\"selected\" [disableRipple]=\"true\" [disabled]=\"deleted\"\n [disableTransitions]=\"grid.disableTransitions\" [aria-label]=\"rowCheckboxAriaLabel\">\n </igx-checkbox>\n </div>\n</ng-template>\n\n" }]
2746
2746
  }], propDecorators: { selected: [{
@@ -2806,10 +2806,10 @@ class IgxPivotRowDimensionMrlRowComponent extends IgxGridHeaderRowComponent {
2806
2806
  const key = PivotUtil.getRecordKey(rec, group.rootDimension);
2807
2807
  return key;
2808
2808
  }
2809
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionMrlRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2810
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotRowDimensionMrlRowComponent, isStandalone: true, selector: "igx-pivot-row-dimension-mrl-row", inputs: { rowIndex: "rowIndex", rowGroup: "rowGroup", groupedData: "groupedData" }, host: { properties: { "class.igx-grid__tbody-pivot-dimension": "this.pivotDim", "class.igx-grid__mrl-block": "this.mrlBlock", "style.grid-template-rows": "this.rowsTemplate", "style.grid-template-columns": "this.colsTemplate" } }, viewQueries: [{ propertyName: "rowDimensionContentCollection", predicate: IgxPivotRowDimensionContentComponent, descendants: true }, { propertyName: "contentCells", predicate: IgxPivotRowDimensionContentComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@for (\n cell of rowGroup | pivotGridHorizontalRowCellMerging:grid.pivotConfiguration:grid.pipeTrigger;\n track getGroupKey(cell); let cellIndex = $index\n) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\"\n [grid]=\"grid\"\n [dimension]=\"cell.rootDimension\"\n [rootDimension]=\"cell.rootDimension\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"cellIndex\"\n [rowData]=\"cell.records[0]\"\n [width]=\"rowDimensionWidthCombined(cell.dimensions)\"\n [layout]=\"{\n rowStart: cell.rowStart,\n rowEnd: cell.rowStart + cell.rowSpan,\n colStart: cell.colStart,\n colEnd: cell.colStart + cell.colSpan,\n columnVisibleIndex: cellIndex\n }\">\n </igx-pivot-row-dimension-content>\n}\n", dependencies: [{ kind: "component", type: IgxPivotRowDimensionContentComponent, selector: "igx-pivot-row-dimension-content", inputs: ["rowIndex", "colIndex", "layout", "dimension", "rootDimension", "rowData"] }, { kind: "pipe", type: IgxPivotGridHorizontalRowCellMerging, name: "pivotGridHorizontalRowCellMerging" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2809
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionMrlRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
2810
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotRowDimensionMrlRowComponent, isStandalone: true, selector: "igx-pivot-row-dimension-mrl-row", inputs: { rowIndex: "rowIndex", rowGroup: "rowGroup", groupedData: "groupedData" }, host: { properties: { "class.igx-grid__tbody-pivot-dimension": "this.pivotDim", "class.igx-grid__mrl-block": "this.mrlBlock", "style.grid-template-rows": "this.rowsTemplate", "style.grid-template-columns": "this.colsTemplate" } }, viewQueries: [{ propertyName: "rowDimensionContentCollection", predicate: IgxPivotRowDimensionContentComponent, descendants: true }, { propertyName: "contentCells", predicate: IgxPivotRowDimensionContentComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "@for (\n cell of rowGroup | pivotGridHorizontalRowCellMerging:grid.pivotConfiguration:grid.pipeTrigger;\n track getGroupKey(cell); let cellIndex = $index\n) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\"\n [grid]=\"grid\"\n [dimension]=\"cell.rootDimension\"\n [rootDimension]=\"cell.rootDimension\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"cellIndex\"\n [rowData]=\"cell.records[0]\"\n [width]=\"rowDimensionWidthCombined(cell.dimensions)\"\n [layout]=\"{\n rowStart: cell.rowStart,\n rowEnd: cell.rowStart + cell.rowSpan,\n colStart: cell.colStart,\n colEnd: cell.colStart + cell.colSpan,\n columnVisibleIndex: cellIndex\n }\">\n </igx-pivot-row-dimension-content>\n}\n", dependencies: [{ kind: "component", type: IgxPivotRowDimensionContentComponent, selector: "igx-pivot-row-dimension-content", inputs: ["rowIndex", "colIndex", "layout", "dimension", "rootDimension", "rowData"] }, { kind: "pipe", type: IgxPivotGridHorizontalRowCellMerging, name: "pivotGridHorizontalRowCellMerging" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
2811
2811
  }
2812
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotRowDimensionMrlRowComponent, decorators: [{
2812
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotRowDimensionMrlRowComponent, decorators: [{
2813
2813
  type: Component,
2814
2814
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'igx-pivot-row-dimension-mrl-row', imports: [IgxPivotRowDimensionContentComponent, IgxPivotGridHorizontalRowCellMerging], template: "@for (\n cell of rowGroup | pivotGridHorizontalRowCellMerging:grid.pivotConfiguration:grid.pipeTrigger;\n track getGroupKey(cell); let cellIndex = $index\n) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\"\n [grid]=\"grid\"\n [dimension]=\"cell.rootDimension\"\n [rootDimension]=\"cell.rootDimension\"\n [rowIndex]=\"rowIndex\"\n [colIndex]=\"cellIndex\"\n [rowData]=\"cell.records[0]\"\n [width]=\"rowDimensionWidthCombined(cell.dimensions)\"\n [layout]=\"{\n rowStart: cell.rowStart,\n rowEnd: cell.rowStart + cell.rowSpan,\n colStart: cell.colStart,\n colEnd: cell.colStart + cell.colSpan,\n columnVisibleIndex: cellIndex\n }\">\n </igx-pivot-row-dimension-content>\n}\n" }]
2815
2815
  }], propDecorators: { rowDimensionContentCollection: [{
@@ -4856,8 +4856,8 @@ class IgxPivotGridComponent extends IgxGridBaseDirective {
4856
4856
  }
4857
4857
  return row;
4858
4858
  }
4859
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
4860
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.0", type: IgxPivotGridComponent, isStandalone: true, selector: "igx-pivot-grid", inputs: { valueChipTemplate: "valueChipTemplate", rowDimensionHeaderTemplate: "rowDimensionHeaderTemplate", pivotConfiguration: "pivotConfiguration", autoGenerateConfig: ["autoGenerateConfig", "autoGenerateConfig", booleanAttribute], pivotUI: "pivotUI", superCompactMode: "superCompactMode", pivotValueCloneStrategy: "pivotValueCloneStrategy", addRowEmptyTemplate: "addRowEmptyTemplate", autoGenerateExclude: "autoGenerateExclude", snackbarDisplayTime: "snackbarDisplayTime", defaultExpandState: ["defaultExpandState", "defaultExpandState", booleanAttribute], pagingMode: "pagingMode", hideRowSelectors: ["hideRowSelectors", "hideRowSelectors", booleanAttribute], rowDraggable: ["rowDraggable", "rowDraggable", booleanAttribute], allowAdvancedFiltering: ["allowAdvancedFiltering", "allowAdvancedFiltering", booleanAttribute], filterMode: "filterMode", allowFiltering: ["allowFiltering", "allowFiltering", booleanAttribute], page: "page", perPage: "perPage", summaryRowHeight: "summaryRowHeight", rowEditable: ["rowEditable", "rowEditable", booleanAttribute], pinning: "pinning", summaryPosition: "summaryPosition", summaryCalculationMode: "summaryCalculationMode", showSummaryOnCollapse: ["showSummaryOnCollapse", "showSummaryOnCollapse", booleanAttribute], batchEditing: ["batchEditing", "batchEditing", booleanAttribute], id: "id", data: "data", totalRecords: "totalRecords", emptyPivotGridTemplate: "emptyPivotGridTemplate" }, outputs: { dimensionsChange: "dimensionsChange", pivotConfigurationChange: "pivotConfigurationChange", dimensionInit: "dimensionInit", valueInit: "valueInit", dimensionsSortingExpressionsChange: "dimensionsSortingExpressionsChange", valuesChange: "valuesChange", cellEdit: "cellEdit", cellEditDone: "cellEditDone", cellEditEnter: "cellEditEnter", cellEditExit: "cellEditExit", columnMovingStart: "columnMovingStart", columnMoving: "columnMoving", columnMovingEnd: "columnMovingEnd", columnPin: "columnPin", columnPinned: "columnPinned", rowAdd: "rowAdd", rowAdded: "rowAdded", rowDeleted: "rowDeleted", rowDelete: "rowDelete", rowDragStart: "rowDragStart", rowDragEnd: "rowDragEnd", rowEditEnter: "rowEditEnter", rowEdit: "rowEdit", rowEditDone: "rowEditDone", rowEditExit: "rowEditExit", rowPinning: "rowPinning", rowPinned: "rowPinned" }, host: { properties: { "attr.role": "this.role", "class.igx-grid__pivot--super-compact": "this.superCompactMode", "attr.id": "this.id" } }, providers: [
4859
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
4860
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: IgxPivotGridComponent, isStandalone: true, selector: "igx-pivot-grid", inputs: { valueChipTemplate: "valueChipTemplate", rowDimensionHeaderTemplate: "rowDimensionHeaderTemplate", pivotConfiguration: "pivotConfiguration", autoGenerateConfig: ["autoGenerateConfig", "autoGenerateConfig", booleanAttribute], pivotUI: "pivotUI", superCompactMode: "superCompactMode", pivotValueCloneStrategy: "pivotValueCloneStrategy", addRowEmptyTemplate: "addRowEmptyTemplate", autoGenerateExclude: "autoGenerateExclude", snackbarDisplayTime: "snackbarDisplayTime", defaultExpandState: ["defaultExpandState", "defaultExpandState", booleanAttribute], pagingMode: "pagingMode", hideRowSelectors: ["hideRowSelectors", "hideRowSelectors", booleanAttribute], rowDraggable: ["rowDraggable", "rowDraggable", booleanAttribute], allowAdvancedFiltering: ["allowAdvancedFiltering", "allowAdvancedFiltering", booleanAttribute], filterMode: "filterMode", allowFiltering: ["allowFiltering", "allowFiltering", booleanAttribute], page: "page", perPage: "perPage", summaryRowHeight: "summaryRowHeight", rowEditable: ["rowEditable", "rowEditable", booleanAttribute], pinning: "pinning", summaryPosition: "summaryPosition", summaryCalculationMode: "summaryCalculationMode", showSummaryOnCollapse: ["showSummaryOnCollapse", "showSummaryOnCollapse", booleanAttribute], batchEditing: ["batchEditing", "batchEditing", booleanAttribute], id: "id", data: "data", totalRecords: "totalRecords", emptyPivotGridTemplate: "emptyPivotGridTemplate" }, outputs: { dimensionsChange: "dimensionsChange", pivotConfigurationChange: "pivotConfigurationChange", dimensionInit: "dimensionInit", valueInit: "valueInit", dimensionsSortingExpressionsChange: "dimensionsSortingExpressionsChange", valuesChange: "valuesChange", cellEdit: "cellEdit", cellEditDone: "cellEditDone", cellEditEnter: "cellEditEnter", cellEditExit: "cellEditExit", columnMovingStart: "columnMovingStart", columnMoving: "columnMoving", columnMovingEnd: "columnMovingEnd", columnPin: "columnPin", columnPinned: "columnPinned", rowAdd: "rowAdd", rowAdded: "rowAdded", rowDeleted: "rowDeleted", rowDelete: "rowDelete", rowDragStart: "rowDragStart", rowDragEnd: "rowDragEnd", rowEditEnter: "rowEditEnter", rowEdit: "rowEdit", rowEditDone: "rowEditDone", rowEditExit: "rowEditExit", rowPinning: "rowPinning", rowPinned: "rowPinned" }, host: { properties: { "attr.role": "this.role", "class.igx-grid__pivot--super-compact": "this.superCompactMode", "attr.id": "this.id" } }, providers: [
4861
4861
  IgxGridCRUDService,
4862
4862
  IgxGridValidationService,
4863
4863
  IgxGridSummaryService,
@@ -4880,7 +4880,7 @@ __decorate([
4880
4880
  __decorate([
4881
4881
  WatchChanges()
4882
4882
  ], IgxPivotGridComponent.prototype, "rowEditable", null);
4883
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.0", ngImport: i0, type: IgxPivotGridComponent, decorators: [{
4883
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImport: i0, type: IgxPivotGridComponent, decorators: [{
4884
4884
  type: Component,
4885
4885
  args: [{ changeDetection: ChangeDetectionStrategy.OnPush, preserveWhitespaces: false, selector: 'igx-pivot-grid', providers: [
4886
4886
  IgxGridCRUDService,