igniteui-angular 21.1.0 → 21.1.1
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.
- package/fesm2022/igniteui-angular-directives.mjs +28 -28
- package/fesm2022/igniteui-angular-directives.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-core.mjs +3 -0
- package/fesm2022/igniteui-angular-grids-core.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-grid.mjs +8 -7
- package/fesm2022/igniteui-angular-grids-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-pivot-grid.mjs +2 -2
- package/fesm2022/igniteui-angular-grids-pivot-grid.mjs.map +1 -1
- package/package.json +1 -1
- package/skills/igniteui-angular-components/SKILL.md +6 -9
- package/skills/igniteui-angular-components/references/charts.md +20 -10
- package/skills/igniteui-angular-components/references/data-display.md +13 -0
- package/skills/igniteui-angular-components/references/directives.md +123 -0
- package/skills/igniteui-angular-components/references/feedback.md +8 -0
- package/skills/igniteui-angular-components/references/form-controls.md +15 -0
- package/skills/igniteui-angular-components/references/layout-manager.md +5 -0
- package/skills/igniteui-angular-components/references/layout.md +9 -0
- package/skills/igniteui-angular-components/references/setup.md +10 -1
- package/skills/igniteui-angular-grids/SKILL.md +6 -6
- package/skills/igniteui-angular-grids/references/data-operations.md +13 -4
- package/skills/igniteui-angular-grids/references/editing.md +12 -1
- package/skills/igniteui-angular-grids/references/features.md +26 -10
- package/skills/igniteui-angular-grids/references/paging-remote.md +13 -4
- package/skills/igniteui-angular-grids/references/state.md +17 -151
- package/skills/igniteui-angular-grids/references/structure.md +9 -0
- package/skills/igniteui-angular-grids/references/types.md +104 -25
- package/skills/igniteui-angular-theming/SKILL.md +6 -106
- package/skills/igniteui-angular-theming/references/common-patterns.md +45 -0
- package/skills/igniteui-angular-theming/references/mcp-setup.md +77 -0
- package/types/igniteui-angular-grids-grid.d.ts +1 -0
|
@@ -4339,7 +4339,7 @@ class IgxPivotGridComponent extends IgxGridBaseDirective {
|
|
|
4339
4339
|
IgxPivotColumnResizingService,
|
|
4340
4340
|
IgxForOfSyncService,
|
|
4341
4341
|
IgxForOfScrollSyncService
|
|
4342
|
-
], queries: [{ propertyName: "valueChipTemplateDirective", first: true, predicate: IgxPivotValueChipTemplateDirective, descendants: true, read: IgxPivotValueChipTemplateDirective }, { propertyName: "rowDimensionHeaderDirective", first: true, predicate: IgxPivotRowDimensionHeaderTemplateDirective, descendants: true, read: IgxPivotRowDimensionHeaderTemplateDirective }], viewQueries: [{ propertyName: "theadRow", first: true, predicate: IgxPivotHeaderRowComponent, descendants: true, static: true }, { propertyName: "recordTemplate", first: true, predicate: ["record_template"], descendants: true, read: TemplateRef, static: true }, { propertyName: "rowDimensionMrlComponent", first: true, predicate: IgxPivotRowDimensionMrlRowComponent, descendants: true, read: IgxPivotRowDimensionMrlRowComponent }, { propertyName: "headerTemplate", first: true, predicate: ["headerTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "resizeLine", first: true, predicate: IgxPivotGridColumnResizerComponent, descendants: true }, { propertyName: "defaultEmptyPivotGridTemplate", first: true, predicate: ["emptyPivotGridTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "rowDimensionContainer", predicate: ["rowDimensionContainer"], descendants: true, read: ElementRef }, { propertyName: "excelStyleFilteringComponents", predicate: IgxGridExcelStyleFilteringComponent, descendants: true, read: IgxGridExcelStyleFilteringComponent }, { propertyName: "rowDimensionContentCollection", predicate: IgxPivotRowDimensionContentComponent, descendants: true }, { propertyName: "verticalRowDimScrollContainers", predicate: ["verticalRowDimScrollContainer"], descendants: true, read: IgxGridForOfDirective }, { propertyName: "rowDimensionMrlRowsCollection", predicate: IgxPivotRowDimensionMrlRowComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- Toolbar area -->\n<ng-content select=\"igx-grid-toolbar,igc-grid-toolbar\"></ng-content>\n\n<!-- Grid table head row area -->\n<igx-pivot-header-row class=\"igx-grid-thead igx-grid-thead--pivot\" tabindex=\"0\"\n [grid]=\"this\"\n [hasMRL]=\"hasColumnLayouts\"\n [width]=\"calcWidth\"\n [pinnedStartColumnCollection]=\"pinnedStartColumns\"\n [pinnedEndColumnCollection]=\"pinnedEndColumns\"\n [unpinnedColumnCollection]=\"unpinnedColumns\"\n (keydown.meta.c)=\"copyHandler($event)\"\n (keydown.control.c)=\"copyHandler($event)\"\n (copy)=\"copyHandler($event)\"\n (keydown)=\"navigation.headerNavigation($event)\"\n (scroll)=\"preventHeaderScroll($event)\"\n>\n</igx-pivot-header-row>\n\n<div igxGridBody (keydown.control.c)=\"copyHandler($event)\" (copy)=\"copyHandler($event)\" class=\"igx-grid__tbody\" role=\"rowgroup\">\n <ng-container *ngTemplateOutlet=\"rowDimensions.length ? (hasHorizontalLayout ? horizontalRowDimensionsTemplate : defaultRowDimensionsTemplate) : emptyRowDimensionsTemplate; context: this\"></ng-container>\n <div class=\"igx-grid__tbody-content\" tabindex=\"0\" [attr.aria-activedescendant]=\"activeDescendant\" [attr.role]=\"dataView.length ? null : 'row'\" (keydown)=\"navigation.handleNavigation($event)\" (focus)=\"navigation.focusTbody($event)\"\n (dragStop)=\"selectionService.dragMode = $event\" (scroll)=\"preventContainerScroll($event)\"\n (dragScroll)=\"dragScroll($event)\" [igxGridDragSelect]=\"selectionService.dragMode\"\n [style.height.px]=\"totalHeight\" [style.width.px]=\"pivotContentCalcWidth || null\" [style.width]=\"!platform.isBrowser ? '100%' : undefined\" #tbody [attr.aria-activedescendant]=\"activeDescendant\">\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length <= 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-left\"></span>\n }\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length > 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-pinned\" [style.left.px]=\"pinnedStartWidth\"></span>\n }\n <ng-template igxGridFor let-rowData [igxGridForOf]=\"renderData\n | pivotGridFilter:pivotConfiguration:filterStrategy:advancedFilteringExpressionsTree:filteringPipeTrigger:pipeTrigger\n | pivotGridSort:pivotConfiguration:sortStrategy:pipeTrigger\n | pivotGridRow:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridColumn:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridAutoTransform:pivotConfiguration:pipeTrigger\n | pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger\n | pivotGridRowExpansion:pivotConfiguration:expansionStates:defaultExpandState:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"hasColumnLayouts ? rowHeight * multiRowLayoutRowSize + 1 : renderedRowHeight\"\n [igxGridForOfVariableSizes]=\"false\"\n #verticalScrollContainer (dataChanging)=\"dataRebinding($event)\" (dataChanged)=\"dataRebound($event)\">\n <div [attr.data-index]=\"rowIndex\">\n <ng-template\n [igxTemplateOutlet]=\"recordTemplate\"\n [igxTemplateOutletContext]=\"getContext(rowData, rowIndex)\"\n (cachedViewLoaded)=\"cachedViewLoaded($event)\">\n </ng-template>\n </div>\n </ng-template>\n <ng-template #record_template let-rowIndex=\"index\" let-rowData>\n <igx-pivot-row [gridID]=\"id\" [index]=\"rowIndex\" [data]=\"rowData\"\n [ngClass]=\"rowClasses | igxGridRowClasses:row:row.inEditMode:row.selected:row.dirty:row.deleted:row.dragging:rowIndex:hasColumnLayouts:isRecordMerged(rowData):false:rowData:pipeTrigger\"\n [ngStyle]=\"rowStyles | igxGridRowStyles:rowData:rowIndex:pipeTrigger\" #row>\n </igx-pivot-row>\n </ng-template>\n\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n <igc-trial-watermark></igc-trial-watermark>\n </div>\n <div igxToggle #loadingOverlay>\n @if (shouldOverlayLoading) {\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n }\n </div>\n @if (hasMovableColumns && columnInDrag) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\"\n id=\"right\" class=\"igx-grid__scroll-on-drag-right\"></span>\n }\n <div [hidden]=\"!hasVerticalScroll()\" class=\"igx-grid__tbody-scrollbar\" [style.width.px]=\"scrollSize\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__tbody-scrollbar-start\" [style.height.px]=\" isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n <div class=\"igx-grid__tbody-scrollbar-main\" [style.height.px]=\"calcHeight\">\n <ng-template igxGridFor [igxGridForOf]=\"[]\" #verticalScrollHolder></ng-template>\n </div>\n <div class=\"igx-grid__tbody-scrollbar-end\" [style.height.px]=\"!isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n </div>\n\n <div class=\"igx-grid__addrow-snackbar\">\n <igx-snackbar #addRowSnackbar [outlet]=\"igxBodyOverlayOutlet\" [actionText]=\"resourceStrings.igx_grid_snackbar_addrow_actiontext\" [displayTime]=\"snackbarDisplayTime\">{{resourceStrings.igx_grid_snackbar_addrow_label}}</igx-snackbar>\n </div>\n\n <div #igxBodyOverlayOutlet=\"overlay-outlet\" igxOverlayOutlet></div>\n</div>\n\n<div class=\"igx-grid__scroll\" [style.height.px]=\"scrollSize\" #scr [hidden]=\"isHorizontalScrollHidden\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__scroll-start\" [style.width.px]=\"pivotPinnedStartWidth\" [style.min-width.px]=\"pivotPinnedStartWidth\"></div>\n <div class=\"igx-grid__scroll-main\" [style.width.px]=\"pivotUnpinnedWidth\">\n <ng-template igxGridFor [igxGridForOf]=\"EMPTY_DATA\" #scrollContainer>\n </ng-template>\n </div>\n <div class=\"igx-grid__scroll-end\" [style.width.px]=\"pivotPinnedEndWidth\" [style.min-width.px]=\"pivotPinnedEndWidth\" [hidden]=\"pivotPinnedEndWidth === 0\"></div>\n</div>\n\n<div class=\"igx-grid__tfoot\" role=\"rowgroup\" #tfoot>\n</div>\n\n<div class=\"igx-grid__footer\" #footer>\n <ng-content select=\"igx-grid-footer,igc-grid-footer\"></ng-content>\n</div>\n\n<ng-template #emptyFilteredGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyFilteredGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultEmptyGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultLoadingGrid>\n <div class=\"igx-grid__loading\">\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n </div>\n</ng-template>\n@if (colResizingService.showResizer) {\n <igx-pivot-grid-column-resizer [restrictResizerTop]=\"calculateResizerTop()\"></igx-pivot-grid-column-resizer>\n}\n<div class=\"igx-grid__loading-outlet\" #igxLoadingOverlayOutlet igxOverlayOutlet></div>\n<div class=\"igx-grid__outlet\" #igxFilteringOverlayOutlet igxOverlayOutlet></div>\n\n<ng-template #headerTemplate let-column>\n <div class=\"igx-grid__tr--header\">\n <igx-icon\n family=\"default\"\n [name]=\"getColumnGroupExpandState(column) ? 'tree_expand' : 'tree_collapse'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleColumn(column)\">\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #defaultRowDimensionsTemplate>\n @for (dim of rowDimensions; track dim.memberName; let dimIndex = $index) {\n <div tabindex=\"0\" [style.height.px]=\"totalHeight\" #rowDimensionContainer class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n <ng-template igxGridFor let-rowData\n [igxGridForOf]=\"dataView | pivotGridCellMerging:pivotConfiguration:dim:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n #verticalRowDimScrollContainer\n >\n <igx-pivot-row-dimension-content\n class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"rowData.dimensions[dimIndex]\"\n [rootDimension]=\"dim\"\n [style.height.px]=\"renderedRowHeight * (rowData.rowSpan || 1)\"\n [rowIndex]=\"rowIndex\" [rowData]=\"rowData\"\n [width]=\"rowDimensionWidthToPixels(dim)\">\n </igx-pivot-row-dimension-content>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(dim) }\"></ng-container>\n </div>\n }\n</ng-template>\n\n<ng-template #horizontalRowDimensionsTemplate>\n <div tabindex=\"0\" class=\"igx-grid__tbody-pivot-mrl-dimension\" #rowDimensionContainer [style.height.px]=\"totalHeight\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if (dataView | pivotGridHorizontalRowGrouping:pivotConfiguration:pipeTrigger:regroupTrigger; as groupedData) {\n <ng-template #verticalRowDimScrollContainer role=\"rowgroup\" igxGridFor let-rowGroup let-rowIndex=\"index\"\n [igxGridForOf]=\"groupedData\"\n [igxForScrollOrientation]=\"'vertical'\"\n [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n >\n <igx-pivot-row-dimension-mrl-row [rowIndex]=\"rowIndex\" [rowGroup]=\"rowGroup\" [groupedData]=\"groupedData\" [style.height.px]=\"renderedRowHeight * rowGroup.length\"></igx-pivot-row-dimension-mrl-row>\n </ng-template>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: pivotRowWidths }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyRowDimensionsTemplate>\n <div tabindex=\"0\" #rowDimensionContainer role=\"rowgroup\" class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if ((columnDimensions.length > 0 || values.length > 0) && data.length > 0) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"emptyRowDimension\"\n [rootDimension]=\"emptyRowDimension\"\n [rowIndex]=\"0\" [rowData]=\"dataView[0]\"\n [width]=\"rowDimensionWidthToPixels(emptyRowDimension)\">\n </igx-pivot-row-dimension-content>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(emptyRowDimension) }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyPivotGridTemplate>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{resourceStrings.igx_grid_pivot_empty_message}}</span>\n </span>\n</ng-template>\n\n<ng-template #emptyRowDimensionFill let-width=\"widthPx\">\n @if (emptyBottomSize > 0) {\n <div class=\"igx-pivot-grid-row-filler__wrapper\" [style.height.px]=\"emptyBottomSize\" [style.width.px]=\"width\">\n <!-- Reuse header styles to keep visuals consistent -->\n <div class=\"igx-grid-thead__wrapper\">\n <div class=\"igx-grid-th\"></div>\n </div>\n </div>\n }\n</ng-template>\n\n<div [hidden]=\"true\">\n <igx-grid-excel-style-filtering [maxHeight]=\"excelStyleFilterMaxHeight\" [minHeight]=\"excelStyleFilterMinHeight\">\n <div igxExcelStyleColumnOperations [hidden]=\"true\"></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@if (platform.isElements) {\n <div #sink style=\"display: none;\"></div>\n <ng-content select=\"igx-grid-state,igc-grid-state\"></ng-content>\n}\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IgxPivotHeaderRowComponent, selector: "igx-pivot-header-row" }, { kind: "directive", type: IgxGridBodyDirective, selector: "[igxGridBody]" }, { kind: "directive", type: IgxGridDragSelectDirective, selector: "[igxGridDragSelect]", inputs: ["igxGridDragSelect"], outputs: ["dragStop", "dragScroll"] }, { kind: "directive", type: IgxColumnMovingDropDirective, selector: "[igxColumnMovingDrop]", inputs: ["igxColumnMovingDrop"] }, { kind: "directive", type: IgxGridForOfDirective, selector: "[igxGridFor][igxGridForOf]", inputs: ["igxGridForOf", "igxGridForOfUniqueSizeCache", "igxGridForOfVariableSizes"], outputs: ["dataChanging"] }, { kind: "directive", type: IgxTemplateOutletDirective, selector: "[igxTemplateOutlet]", inputs: ["igxTemplateOutletContext", "igxTemplateOutlet"], outputs: ["viewCreated", "viewMoved", "cachedViewLoaded", "beforeViewDetach"] }, { kind: "component", type: IgxPivotRowComponent, selector: "igx-pivot-row", inputs: ["selected", "data"] }, { kind: "directive", type: IgxToggleDirective, selector: "[igxToggle]", inputs: ["id"], outputs: ["opened", "opening", "closed", "closing", "appended"], exportAs: ["toggle"] }, { kind: "component", type: IgxCircularProgressBarComponent, selector: "igx-circular-bar", inputs: ["id", "textVisibility", "type"] }, { kind: "component", type: IgxSnackbarComponent, selector: "igx-snackbar", inputs: ["id", "actionText", "positionSettings"], outputs: ["clicked", "animationStarted", "animationDone"] }, { kind: "directive", type: IgxOverlayOutletDirective, selector: "[igxOverlayOutlet]", exportAs: ["overlay-outlet"] }, { kind: "component", type: IgxPivotGridColumnResizerComponent, selector: "igx-pivot-grid-column-resizer" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "component", type: IgxPivotRowDimensionContentComponent, selector: "igx-pivot-row-dimension-content", inputs: ["rowIndex", "colIndex", "layout", "dimension", "rootDimension", "rowData"] }, { 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: "[igxExcelStyleColumnOperations],igx-excel-style-column-operations" }, { kind: "directive", type: IgxExcelStyleFilterOperationsTemplateDirective, selector: "[igxExcelStyleFilterOperations],igx-excel-style-filter-operations" }, { kind: "component", type: IgxExcelStyleSearchComponent, selector: "igx-excel-style-search", inputs: ["id"] }, { kind: "component", type: IgxPivotRowDimensionMrlRowComponent, selector: "igx-pivot-row-dimension-mrl-row", inputs: ["rowIndex", "rowGroup", "groupedData"] }, { kind: "pipe", type: IgxGridRowClassesPipe, name: "igxGridRowClasses" }, { kind: "pipe", type: IgxGridRowStylesPipe, name: "igxGridRowStyles" }, { kind: "pipe", type: IgxPivotRowPipe, name: "pivotGridRow" }, { kind: "pipe", type: IgxPivotRowExpansionPipe, name: "pivotGridRowExpansion" }, { kind: "pipe", type: IgxPivotAutoTransform, name: "pivotGridAutoTransform" }, { kind: "pipe", type: IgxPivotColumnPipe, name: "pivotGridColumn" }, { kind: "pipe", type: IgxPivotGridFilterPipe, name: "pivotGridFilter" }, { kind: "pipe", type: IgxPivotGridSortingPipe, name: "pivotGridSort" }, { kind: "pipe", type: IgxPivotGridColumnSortingPipe, name: "pivotGridColumnSort" }, { kind: "pipe", type: IgxPivotCellMergingPipe, name: "pivotGridCellMerging" }, { kind: "pipe", type: IgxPivotGridHorizontalRowGrouping, name: "pivotGridHorizontalRowGrouping" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4342
|
+
], queries: [{ propertyName: "valueChipTemplateDirective", first: true, predicate: IgxPivotValueChipTemplateDirective, descendants: true, read: IgxPivotValueChipTemplateDirective }, { propertyName: "rowDimensionHeaderDirective", first: true, predicate: IgxPivotRowDimensionHeaderTemplateDirective, descendants: true, read: IgxPivotRowDimensionHeaderTemplateDirective }], viewQueries: [{ propertyName: "theadRow", first: true, predicate: IgxPivotHeaderRowComponent, descendants: true, static: true }, { propertyName: "recordTemplate", first: true, predicate: ["record_template"], descendants: true, read: TemplateRef, static: true }, { propertyName: "rowDimensionMrlComponent", first: true, predicate: IgxPivotRowDimensionMrlRowComponent, descendants: true, read: IgxPivotRowDimensionMrlRowComponent }, { propertyName: "headerTemplate", first: true, predicate: ["headerTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "resizeLine", first: true, predicate: IgxPivotGridColumnResizerComponent, descendants: true }, { propertyName: "defaultEmptyPivotGridTemplate", first: true, predicate: ["emptyPivotGridTemplate"], descendants: true, read: TemplateRef, static: true }, { propertyName: "rowDimensionContainer", predicate: ["rowDimensionContainer"], descendants: true, read: ElementRef }, { propertyName: "excelStyleFilteringComponents", predicate: IgxGridExcelStyleFilteringComponent, descendants: true, read: IgxGridExcelStyleFilteringComponent }, { propertyName: "rowDimensionContentCollection", predicate: IgxPivotRowDimensionContentComponent, descendants: true }, { propertyName: "verticalRowDimScrollContainers", predicate: ["verticalRowDimScrollContainer"], descendants: true, read: IgxGridForOfDirective }, { propertyName: "rowDimensionMrlRowsCollection", predicate: IgxPivotRowDimensionMrlRowComponent, descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<!-- Toolbar area -->\n<ng-content select=\"igx-grid-toolbar,igc-grid-toolbar\"></ng-content>\n\n<!-- Grid table head row area -->\n<igx-pivot-header-row class=\"igx-grid-thead igx-grid-thead--pivot\" tabindex=\"0\"\n [grid]=\"this\"\n [hasMRL]=\"hasColumnLayouts\"\n [width]=\"calcWidth\"\n [pinnedStartColumnCollection]=\"pinnedStartColumns\"\n [pinnedEndColumnCollection]=\"pinnedEndColumns\"\n [unpinnedColumnCollection]=\"unpinnedColumns\"\n (keydown.meta.c)=\"copyHandler($event)\"\n (keydown.control.c)=\"copyHandler($event)\"\n (copy)=\"copyHandler($event)\"\n (keydown)=\"navigation.headerNavigation($event)\"\n (scroll)=\"preventHeaderScroll($event)\"\n>\n</igx-pivot-header-row>\n\n<div igxGridBody (keydown.control.c)=\"copyHandler($event)\" (copy)=\"copyHandler($event)\" class=\"igx-grid__tbody\" role=\"rowgroup\">\n <ng-container *ngTemplateOutlet=\"rowDimensions.length ? (hasHorizontalLayout ? horizontalRowDimensionsTemplate : defaultRowDimensionsTemplate) : emptyRowDimensionsTemplate; context: this\"></ng-container>\n <div class=\"igx-grid__tbody-content\" tabindex=\"0\" [attr.aria-activedescendant]=\"activeDescendant\" [attr.role]=\"dataView.length ? null : 'row'\" (keydown)=\"navigation.handleNavigation($event)\" (focus)=\"navigation.focusTbody($event)\"\n (dragStop)=\"selectionService.dragMode = $event\" (scroll)=\"preventContainerScroll($event)\"\n (dragScroll)=\"dragScroll($event)\" [igxGridDragSelect]=\"selectionService.dragMode\"\n [style.height.px]=\"totalHeight\" [style.width.px]=\"pivotContentCalcWidth || null\" [style.width]=\"!platform.isBrowser ? '100%' : undefined\" #tbody [attr.aria-activedescendant]=\"activeDescendant\">\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length <= 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-left\"></span>\n }\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length > 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-pinned\" [style.left.px]=\"pinnedStartWidth\"></span>\n }\n <ng-template igxGridFor let-rowData [igxGridForOf]=\"renderData\n | pivotGridFilter:pivotConfiguration:filterStrategy:advancedFilteringExpressionsTree:filteringPipeTrigger:pipeTrigger\n | pivotGridSort:pivotConfiguration:sortStrategy:pipeTrigger\n | pivotGridRow:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridColumn:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridAutoTransform:pivotConfiguration:pipeTrigger\n | pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger\n | pivotGridRowExpansion:pivotConfiguration:expansionStates:defaultExpandState:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"hasColumnLayouts ? rowHeight * multiRowLayoutRowSize + 1 : renderedRowHeight\"\n\n #verticalScrollContainer (dataChanging)=\"dataRebinding($event)\" (dataChanged)=\"dataRebound($event)\">\n <div [attr.data-index]=\"rowIndex\">\n <ng-template\n [igxTemplateOutlet]=\"recordTemplate\"\n [igxTemplateOutletContext]=\"getContext(rowData, rowIndex)\"\n (cachedViewLoaded)=\"cachedViewLoaded($event)\">\n </ng-template>\n </div>\n </ng-template>\n <ng-template #record_template let-rowIndex=\"index\" let-rowData>\n <igx-pivot-row [gridID]=\"id\" [index]=\"rowIndex\" [data]=\"rowData\"\n [ngClass]=\"rowClasses | igxGridRowClasses:row:row.inEditMode:row.selected:row.dirty:row.deleted:row.dragging:rowIndex:hasColumnLayouts:isRecordMerged(rowData):false:rowData:pipeTrigger\"\n [ngStyle]=\"rowStyles | igxGridRowStyles:rowData:rowIndex:pipeTrigger\" #row>\n </igx-pivot-row>\n </ng-template>\n\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n <igc-trial-watermark></igc-trial-watermark>\n </div>\n <div igxToggle #loadingOverlay>\n @if (shouldOverlayLoading) {\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n }\n </div>\n @if (hasMovableColumns && columnInDrag) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\"\n id=\"right\" class=\"igx-grid__scroll-on-drag-right\"></span>\n }\n <div [hidden]=\"!hasVerticalScroll()\" class=\"igx-grid__tbody-scrollbar\" [style.width.px]=\"scrollSize\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__tbody-scrollbar-start\" [style.height.px]=\" isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n <div class=\"igx-grid__tbody-scrollbar-main\" [style.height.px]=\"calcHeight\">\n <ng-template igxGridFor [igxGridForOf]=\"[]\" #verticalScrollHolder></ng-template>\n </div>\n <div class=\"igx-grid__tbody-scrollbar-end\" [style.height.px]=\"!isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n </div>\n\n <div class=\"igx-grid__addrow-snackbar\">\n <igx-snackbar #addRowSnackbar [outlet]=\"igxBodyOverlayOutlet\" [actionText]=\"resourceStrings.igx_grid_snackbar_addrow_actiontext\" [displayTime]=\"snackbarDisplayTime\">{{resourceStrings.igx_grid_snackbar_addrow_label}}</igx-snackbar>\n </div>\n\n <div #igxBodyOverlayOutlet=\"overlay-outlet\" igxOverlayOutlet></div>\n</div>\n\n<div class=\"igx-grid__scroll\" [style.height.px]=\"scrollSize\" #scr [hidden]=\"isHorizontalScrollHidden\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__scroll-start\" [style.width.px]=\"pivotPinnedStartWidth\" [style.min-width.px]=\"pivotPinnedStartWidth\"></div>\n <div class=\"igx-grid__scroll-main\" [style.width.px]=\"pivotUnpinnedWidth\">\n <ng-template igxGridFor [igxGridForOf]=\"EMPTY_DATA\" #scrollContainer>\n </ng-template>\n </div>\n <div class=\"igx-grid__scroll-end\" [style.width.px]=\"pivotPinnedEndWidth\" [style.min-width.px]=\"pivotPinnedEndWidth\" [hidden]=\"pivotPinnedEndWidth === 0\"></div>\n</div>\n\n<div class=\"igx-grid__tfoot\" role=\"rowgroup\" #tfoot>\n</div>\n\n<div class=\"igx-grid__footer\" #footer>\n <ng-content select=\"igx-grid-footer,igc-grid-footer\"></ng-content>\n</div>\n\n<ng-template #emptyFilteredGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyFilteredGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultEmptyGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultLoadingGrid>\n <div class=\"igx-grid__loading\">\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n </div>\n</ng-template>\n@if (colResizingService.showResizer) {\n <igx-pivot-grid-column-resizer [restrictResizerTop]=\"calculateResizerTop()\"></igx-pivot-grid-column-resizer>\n}\n<div class=\"igx-grid__loading-outlet\" #igxLoadingOverlayOutlet igxOverlayOutlet></div>\n<div class=\"igx-grid__outlet\" #igxFilteringOverlayOutlet igxOverlayOutlet></div>\n\n<ng-template #headerTemplate let-column>\n <div class=\"igx-grid__tr--header\">\n <igx-icon\n family=\"default\"\n [name]=\"getColumnGroupExpandState(column) ? 'tree_expand' : 'tree_collapse'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleColumn(column)\">\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #defaultRowDimensionsTemplate>\n @for (dim of rowDimensions; track dim.memberName; let dimIndex = $index) {\n <div tabindex=\"0\" [style.height.px]=\"totalHeight\" #rowDimensionContainer class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n <ng-template igxGridFor let-rowData\n [igxGridForOf]=\"dataView | pivotGridCellMerging:pivotConfiguration:dim:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n #verticalRowDimScrollContainer\n >\n <igx-pivot-row-dimension-content\n class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"rowData.dimensions[dimIndex]\"\n [rootDimension]=\"dim\"\n [style.height.px]=\"renderedRowHeight * (rowData.rowSpan || 1)\"\n [rowIndex]=\"rowIndex\" [rowData]=\"rowData\"\n [width]=\"rowDimensionWidthToPixels(dim)\">\n </igx-pivot-row-dimension-content>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(dim) }\"></ng-container>\n </div>\n }\n</ng-template>\n\n<ng-template #horizontalRowDimensionsTemplate>\n <div tabindex=\"0\" class=\"igx-grid__tbody-pivot-mrl-dimension\" #rowDimensionContainer [style.height.px]=\"totalHeight\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if (dataView | pivotGridHorizontalRowGrouping:pivotConfiguration:pipeTrigger:regroupTrigger; as groupedData) {\n <ng-template #verticalRowDimScrollContainer role=\"rowgroup\" igxGridFor let-rowGroup let-rowIndex=\"index\"\n [igxGridForOf]=\"groupedData\"\n [igxForScrollOrientation]=\"'vertical'\"\n [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n >\n <igx-pivot-row-dimension-mrl-row [rowIndex]=\"rowIndex\" [rowGroup]=\"rowGroup\" [groupedData]=\"groupedData\" [style.height.px]=\"renderedRowHeight * rowGroup.length\"></igx-pivot-row-dimension-mrl-row>\n </ng-template>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: pivotRowWidths }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyRowDimensionsTemplate>\n <div tabindex=\"0\" #rowDimensionContainer role=\"rowgroup\" class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if ((columnDimensions.length > 0 || values.length > 0) && data.length > 0) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"emptyRowDimension\"\n [rootDimension]=\"emptyRowDimension\"\n [rowIndex]=\"0\" [rowData]=\"dataView[0]\"\n [width]=\"rowDimensionWidthToPixels(emptyRowDimension)\">\n </igx-pivot-row-dimension-content>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(emptyRowDimension) }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyPivotGridTemplate>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{resourceStrings.igx_grid_pivot_empty_message}}</span>\n </span>\n</ng-template>\n\n<ng-template #emptyRowDimensionFill let-width=\"widthPx\">\n @if (emptyBottomSize > 0) {\n <div class=\"igx-pivot-grid-row-filler__wrapper\" [style.height.px]=\"emptyBottomSize\" [style.width.px]=\"width\">\n <!-- Reuse header styles to keep visuals consistent -->\n <div class=\"igx-grid-thead__wrapper\">\n <div class=\"igx-grid-th\"></div>\n </div>\n </div>\n }\n</ng-template>\n\n<div [hidden]=\"true\">\n <igx-grid-excel-style-filtering [maxHeight]=\"excelStyleFilterMaxHeight\" [minHeight]=\"excelStyleFilterMinHeight\">\n <div igxExcelStyleColumnOperations [hidden]=\"true\"></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@if (platform.isElements) {\n <div #sink style=\"display: none;\"></div>\n <ng-content select=\"igx-grid-state,igc-grid-state\"></ng-content>\n}\n", dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IgxPivotHeaderRowComponent, selector: "igx-pivot-header-row" }, { kind: "directive", type: IgxGridBodyDirective, selector: "[igxGridBody]" }, { kind: "directive", type: IgxGridDragSelectDirective, selector: "[igxGridDragSelect]", inputs: ["igxGridDragSelect"], outputs: ["dragStop", "dragScroll"] }, { kind: "directive", type: IgxColumnMovingDropDirective, selector: "[igxColumnMovingDrop]", inputs: ["igxColumnMovingDrop"] }, { kind: "directive", type: IgxGridForOfDirective, selector: "[igxGridFor][igxGridForOf]", inputs: ["igxGridForOf", "igxGridForOfUniqueSizeCache", "igxGridForOfVariableSizes"], outputs: ["dataChanging"] }, { kind: "directive", type: IgxTemplateOutletDirective, selector: "[igxTemplateOutlet]", inputs: ["igxTemplateOutletContext", "igxTemplateOutlet"], outputs: ["viewCreated", "viewMoved", "cachedViewLoaded", "beforeViewDetach"] }, { kind: "component", type: IgxPivotRowComponent, selector: "igx-pivot-row", inputs: ["selected", "data"] }, { kind: "directive", type: IgxToggleDirective, selector: "[igxToggle]", inputs: ["id"], outputs: ["opened", "opening", "closed", "closing", "appended"], exportAs: ["toggle"] }, { kind: "component", type: IgxCircularProgressBarComponent, selector: "igx-circular-bar", inputs: ["id", "textVisibility", "type"] }, { kind: "component", type: IgxSnackbarComponent, selector: "igx-snackbar", inputs: ["id", "actionText", "positionSettings"], outputs: ["clicked", "animationStarted", "animationDone"] }, { kind: "directive", type: IgxOverlayOutletDirective, selector: "[igxOverlayOutlet]", exportAs: ["overlay-outlet"] }, { kind: "component", type: IgxPivotGridColumnResizerComponent, selector: "igx-pivot-grid-column-resizer" }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "component", type: IgxPivotRowDimensionContentComponent, selector: "igx-pivot-row-dimension-content", inputs: ["rowIndex", "colIndex", "layout", "dimension", "rootDimension", "rowData"] }, { 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: "[igxExcelStyleColumnOperations],igx-excel-style-column-operations" }, { kind: "directive", type: IgxExcelStyleFilterOperationsTemplateDirective, selector: "[igxExcelStyleFilterOperations],igx-excel-style-filter-operations" }, { kind: "component", type: IgxExcelStyleSearchComponent, selector: "igx-excel-style-search", inputs: ["id"] }, { kind: "component", type: IgxPivotRowDimensionMrlRowComponent, selector: "igx-pivot-row-dimension-mrl-row", inputs: ["rowIndex", "rowGroup", "groupedData"] }, { kind: "pipe", type: IgxGridRowClassesPipe, name: "igxGridRowClasses" }, { kind: "pipe", type: IgxGridRowStylesPipe, name: "igxGridRowStyles" }, { kind: "pipe", type: IgxPivotRowPipe, name: "pivotGridRow" }, { kind: "pipe", type: IgxPivotRowExpansionPipe, name: "pivotGridRowExpansion" }, { kind: "pipe", type: IgxPivotAutoTransform, name: "pivotGridAutoTransform" }, { kind: "pipe", type: IgxPivotColumnPipe, name: "pivotGridColumn" }, { kind: "pipe", type: IgxPivotGridFilterPipe, name: "pivotGridFilter" }, { kind: "pipe", type: IgxPivotGridSortingPipe, name: "pivotGridSort" }, { kind: "pipe", type: IgxPivotGridColumnSortingPipe, name: "pivotGridColumnSort" }, { kind: "pipe", type: IgxPivotCellMergingPipe, name: "pivotGridCellMerging" }, { kind: "pipe", type: IgxPivotGridHorizontalRowGrouping, name: "pivotGridHorizontalRowGrouping" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
4343
4343
|
}
|
|
4344
4344
|
__decorate([
|
|
4345
4345
|
WatchChanges()
|
|
@@ -4398,7 +4398,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.3", ngImpor
|
|
|
4398
4398
|
IgxPivotCellMergingPipe,
|
|
4399
4399
|
IgxPivotGridHorizontalRowGrouping,
|
|
4400
4400
|
IgxPivotRowDimensionMrlRowComponent
|
|
4401
|
-
], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<!-- Toolbar area -->\n<ng-content select=\"igx-grid-toolbar,igc-grid-toolbar\"></ng-content>\n\n<!-- Grid table head row area -->\n<igx-pivot-header-row class=\"igx-grid-thead igx-grid-thead--pivot\" tabindex=\"0\"\n [grid]=\"this\"\n [hasMRL]=\"hasColumnLayouts\"\n [width]=\"calcWidth\"\n [pinnedStartColumnCollection]=\"pinnedStartColumns\"\n [pinnedEndColumnCollection]=\"pinnedEndColumns\"\n [unpinnedColumnCollection]=\"unpinnedColumns\"\n (keydown.meta.c)=\"copyHandler($event)\"\n (keydown.control.c)=\"copyHandler($event)\"\n (copy)=\"copyHandler($event)\"\n (keydown)=\"navigation.headerNavigation($event)\"\n (scroll)=\"preventHeaderScroll($event)\"\n>\n</igx-pivot-header-row>\n\n<div igxGridBody (keydown.control.c)=\"copyHandler($event)\" (copy)=\"copyHandler($event)\" class=\"igx-grid__tbody\" role=\"rowgroup\">\n <ng-container *ngTemplateOutlet=\"rowDimensions.length ? (hasHorizontalLayout ? horizontalRowDimensionsTemplate : defaultRowDimensionsTemplate) : emptyRowDimensionsTemplate; context: this\"></ng-container>\n <div class=\"igx-grid__tbody-content\" tabindex=\"0\" [attr.aria-activedescendant]=\"activeDescendant\" [attr.role]=\"dataView.length ? null : 'row'\" (keydown)=\"navigation.handleNavigation($event)\" (focus)=\"navigation.focusTbody($event)\"\n (dragStop)=\"selectionService.dragMode = $event\" (scroll)=\"preventContainerScroll($event)\"\n (dragScroll)=\"dragScroll($event)\" [igxGridDragSelect]=\"selectionService.dragMode\"\n [style.height.px]=\"totalHeight\" [style.width.px]=\"pivotContentCalcWidth || null\" [style.width]=\"!platform.isBrowser ? '100%' : undefined\" #tbody [attr.aria-activedescendant]=\"activeDescendant\">\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length <= 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-left\"></span>\n }\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length > 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-pinned\" [style.left.px]=\"pinnedStartWidth\"></span>\n }\n <ng-template igxGridFor let-rowData [igxGridForOf]=\"renderData\n | pivotGridFilter:pivotConfiguration:filterStrategy:advancedFilteringExpressionsTree:filteringPipeTrigger:pipeTrigger\n | pivotGridSort:pivotConfiguration:sortStrategy:pipeTrigger\n | pivotGridRow:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridColumn:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridAutoTransform:pivotConfiguration:pipeTrigger\n | pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger\n | pivotGridRowExpansion:pivotConfiguration:expansionStates:defaultExpandState:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"hasColumnLayouts ? rowHeight * multiRowLayoutRowSize + 1 : renderedRowHeight\"\n [igxGridForOfVariableSizes]=\"false\"\n #verticalScrollContainer (dataChanging)=\"dataRebinding($event)\" (dataChanged)=\"dataRebound($event)\">\n <div [attr.data-index]=\"rowIndex\">\n <ng-template\n [igxTemplateOutlet]=\"recordTemplate\"\n [igxTemplateOutletContext]=\"getContext(rowData, rowIndex)\"\n (cachedViewLoaded)=\"cachedViewLoaded($event)\">\n </ng-template>\n </div>\n </ng-template>\n <ng-template #record_template let-rowIndex=\"index\" let-rowData>\n <igx-pivot-row [gridID]=\"id\" [index]=\"rowIndex\" [data]=\"rowData\"\n [ngClass]=\"rowClasses | igxGridRowClasses:row:row.inEditMode:row.selected:row.dirty:row.deleted:row.dragging:rowIndex:hasColumnLayouts:isRecordMerged(rowData):false:rowData:pipeTrigger\"\n [ngStyle]=\"rowStyles | igxGridRowStyles:rowData:rowIndex:pipeTrigger\" #row>\n </igx-pivot-row>\n </ng-template>\n\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n <igc-trial-watermark></igc-trial-watermark>\n </div>\n <div igxToggle #loadingOverlay>\n @if (shouldOverlayLoading) {\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n }\n </div>\n @if (hasMovableColumns && columnInDrag) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\"\n id=\"right\" class=\"igx-grid__scroll-on-drag-right\"></span>\n }\n <div [hidden]=\"!hasVerticalScroll()\" class=\"igx-grid__tbody-scrollbar\" [style.width.px]=\"scrollSize\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__tbody-scrollbar-start\" [style.height.px]=\" isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n <div class=\"igx-grid__tbody-scrollbar-main\" [style.height.px]=\"calcHeight\">\n <ng-template igxGridFor [igxGridForOf]=\"[]\" #verticalScrollHolder></ng-template>\n </div>\n <div class=\"igx-grid__tbody-scrollbar-end\" [style.height.px]=\"!isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n </div>\n\n <div class=\"igx-grid__addrow-snackbar\">\n <igx-snackbar #addRowSnackbar [outlet]=\"igxBodyOverlayOutlet\" [actionText]=\"resourceStrings.igx_grid_snackbar_addrow_actiontext\" [displayTime]=\"snackbarDisplayTime\">{{resourceStrings.igx_grid_snackbar_addrow_label}}</igx-snackbar>\n </div>\n\n <div #igxBodyOverlayOutlet=\"overlay-outlet\" igxOverlayOutlet></div>\n</div>\n\n<div class=\"igx-grid__scroll\" [style.height.px]=\"scrollSize\" #scr [hidden]=\"isHorizontalScrollHidden\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__scroll-start\" [style.width.px]=\"pivotPinnedStartWidth\" [style.min-width.px]=\"pivotPinnedStartWidth\"></div>\n <div class=\"igx-grid__scroll-main\" [style.width.px]=\"pivotUnpinnedWidth\">\n <ng-template igxGridFor [igxGridForOf]=\"EMPTY_DATA\" #scrollContainer>\n </ng-template>\n </div>\n <div class=\"igx-grid__scroll-end\" [style.width.px]=\"pivotPinnedEndWidth\" [style.min-width.px]=\"pivotPinnedEndWidth\" [hidden]=\"pivotPinnedEndWidth === 0\"></div>\n</div>\n\n<div class=\"igx-grid__tfoot\" role=\"rowgroup\" #tfoot>\n</div>\n\n<div class=\"igx-grid__footer\" #footer>\n <ng-content select=\"igx-grid-footer,igc-grid-footer\"></ng-content>\n</div>\n\n<ng-template #emptyFilteredGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyFilteredGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultEmptyGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultLoadingGrid>\n <div class=\"igx-grid__loading\">\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n </div>\n</ng-template>\n@if (colResizingService.showResizer) {\n <igx-pivot-grid-column-resizer [restrictResizerTop]=\"calculateResizerTop()\"></igx-pivot-grid-column-resizer>\n}\n<div class=\"igx-grid__loading-outlet\" #igxLoadingOverlayOutlet igxOverlayOutlet></div>\n<div class=\"igx-grid__outlet\" #igxFilteringOverlayOutlet igxOverlayOutlet></div>\n\n<ng-template #headerTemplate let-column>\n <div class=\"igx-grid__tr--header\">\n <igx-icon\n family=\"default\"\n [name]=\"getColumnGroupExpandState(column) ? 'tree_expand' : 'tree_collapse'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleColumn(column)\">\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #defaultRowDimensionsTemplate>\n @for (dim of rowDimensions; track dim.memberName; let dimIndex = $index) {\n <div tabindex=\"0\" [style.height.px]=\"totalHeight\" #rowDimensionContainer class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n <ng-template igxGridFor let-rowData\n [igxGridForOf]=\"dataView | pivotGridCellMerging:pivotConfiguration:dim:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n #verticalRowDimScrollContainer\n >\n <igx-pivot-row-dimension-content\n class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"rowData.dimensions[dimIndex]\"\n [rootDimension]=\"dim\"\n [style.height.px]=\"renderedRowHeight * (rowData.rowSpan || 1)\"\n [rowIndex]=\"rowIndex\" [rowData]=\"rowData\"\n [width]=\"rowDimensionWidthToPixels(dim)\">\n </igx-pivot-row-dimension-content>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(dim) }\"></ng-container>\n </div>\n }\n</ng-template>\n\n<ng-template #horizontalRowDimensionsTemplate>\n <div tabindex=\"0\" class=\"igx-grid__tbody-pivot-mrl-dimension\" #rowDimensionContainer [style.height.px]=\"totalHeight\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if (dataView | pivotGridHorizontalRowGrouping:pivotConfiguration:pipeTrigger:regroupTrigger; as groupedData) {\n <ng-template #verticalRowDimScrollContainer role=\"rowgroup\" igxGridFor let-rowGroup let-rowIndex=\"index\"\n [igxGridForOf]=\"groupedData\"\n [igxForScrollOrientation]=\"'vertical'\"\n [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n >\n <igx-pivot-row-dimension-mrl-row [rowIndex]=\"rowIndex\" [rowGroup]=\"rowGroup\" [groupedData]=\"groupedData\" [style.height.px]=\"renderedRowHeight * rowGroup.length\"></igx-pivot-row-dimension-mrl-row>\n </ng-template>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: pivotRowWidths }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyRowDimensionsTemplate>\n <div tabindex=\"0\" #rowDimensionContainer role=\"rowgroup\" class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if ((columnDimensions.length > 0 || values.length > 0) && data.length > 0) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"emptyRowDimension\"\n [rootDimension]=\"emptyRowDimension\"\n [rowIndex]=\"0\" [rowData]=\"dataView[0]\"\n [width]=\"rowDimensionWidthToPixels(emptyRowDimension)\">\n </igx-pivot-row-dimension-content>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(emptyRowDimension) }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyPivotGridTemplate>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{resourceStrings.igx_grid_pivot_empty_message}}</span>\n </span>\n</ng-template>\n\n<ng-template #emptyRowDimensionFill let-width=\"widthPx\">\n @if (emptyBottomSize > 0) {\n <div class=\"igx-pivot-grid-row-filler__wrapper\" [style.height.px]=\"emptyBottomSize\" [style.width.px]=\"width\">\n <!-- Reuse header styles to keep visuals consistent -->\n <div class=\"igx-grid-thead__wrapper\">\n <div class=\"igx-grid-th\"></div>\n </div>\n </div>\n }\n</ng-template>\n\n<div [hidden]=\"true\">\n <igx-grid-excel-style-filtering [maxHeight]=\"excelStyleFilterMaxHeight\" [minHeight]=\"excelStyleFilterMinHeight\">\n <div igxExcelStyleColumnOperations [hidden]=\"true\"></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@if (platform.isElements) {\n <div #sink style=\"display: none;\"></div>\n <ng-content select=\"igx-grid-state,igc-grid-state\"></ng-content>\n}\n" }]
|
|
4401
|
+
], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<!-- Toolbar area -->\n<ng-content select=\"igx-grid-toolbar,igc-grid-toolbar\"></ng-content>\n\n<!-- Grid table head row area -->\n<igx-pivot-header-row class=\"igx-grid-thead igx-grid-thead--pivot\" tabindex=\"0\"\n [grid]=\"this\"\n [hasMRL]=\"hasColumnLayouts\"\n [width]=\"calcWidth\"\n [pinnedStartColumnCollection]=\"pinnedStartColumns\"\n [pinnedEndColumnCollection]=\"pinnedEndColumns\"\n [unpinnedColumnCollection]=\"unpinnedColumns\"\n (keydown.meta.c)=\"copyHandler($event)\"\n (keydown.control.c)=\"copyHandler($event)\"\n (copy)=\"copyHandler($event)\"\n (keydown)=\"navigation.headerNavigation($event)\"\n (scroll)=\"preventHeaderScroll($event)\"\n>\n</igx-pivot-header-row>\n\n<div igxGridBody (keydown.control.c)=\"copyHandler($event)\" (copy)=\"copyHandler($event)\" class=\"igx-grid__tbody\" role=\"rowgroup\">\n <ng-container *ngTemplateOutlet=\"rowDimensions.length ? (hasHorizontalLayout ? horizontalRowDimensionsTemplate : defaultRowDimensionsTemplate) : emptyRowDimensionsTemplate; context: this\"></ng-container>\n <div class=\"igx-grid__tbody-content\" tabindex=\"0\" [attr.aria-activedescendant]=\"activeDescendant\" [attr.role]=\"dataView.length ? null : 'row'\" (keydown)=\"navigation.handleNavigation($event)\" (focus)=\"navigation.focusTbody($event)\"\n (dragStop)=\"selectionService.dragMode = $event\" (scroll)=\"preventContainerScroll($event)\"\n (dragScroll)=\"dragScroll($event)\" [igxGridDragSelect]=\"selectionService.dragMode\"\n [style.height.px]=\"totalHeight\" [style.width.px]=\"pivotContentCalcWidth || null\" [style.width]=\"!platform.isBrowser ? '100%' : undefined\" #tbody [attr.aria-activedescendant]=\"activeDescendant\">\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length <= 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-left\"></span>\n }\n @if (hasMovableColumns && columnInDrag && pinnedColumns.length > 0) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\" id=\"left\"\n class=\"igx-grid__scroll-on-drag-pinned\" [style.left.px]=\"pinnedStartWidth\"></span>\n }\n <ng-template igxGridFor let-rowData [igxGridForOf]=\"renderData\n | pivotGridFilter:pivotConfiguration:filterStrategy:advancedFilteringExpressionsTree:filteringPipeTrigger:pipeTrigger\n | pivotGridSort:pivotConfiguration:sortStrategy:pipeTrigger\n | pivotGridRow:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridColumn:pivotConfiguration:pivotValueCloneStrategy:expansionStates:pipeTrigger:sortingExpressions\n | pivotGridAutoTransform:pivotConfiguration:pipeTrigger\n | pivotGridColumnSort:sortingExpressions:sortStrategy:pipeTrigger\n | pivotGridRowExpansion:pivotConfiguration:expansionStates:defaultExpandState:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"hasColumnLayouts ? rowHeight * multiRowLayoutRowSize + 1 : renderedRowHeight\"\n\n #verticalScrollContainer (dataChanging)=\"dataRebinding($event)\" (dataChanged)=\"dataRebound($event)\">\n <div [attr.data-index]=\"rowIndex\">\n <ng-template\n [igxTemplateOutlet]=\"recordTemplate\"\n [igxTemplateOutletContext]=\"getContext(rowData, rowIndex)\"\n (cachedViewLoaded)=\"cachedViewLoaded($event)\">\n </ng-template>\n </div>\n </ng-template>\n <ng-template #record_template let-rowIndex=\"index\" let-rowData>\n <igx-pivot-row [gridID]=\"id\" [index]=\"rowIndex\" [data]=\"rowData\"\n [ngClass]=\"rowClasses | igxGridRowClasses:row:row.inEditMode:row.selected:row.dirty:row.deleted:row.dragging:rowIndex:hasColumnLayouts:isRecordMerged(rowData):false:rowData:pipeTrigger\"\n [ngStyle]=\"rowStyles | igxGridRowStyles:rowData:rowIndex:pipeTrigger\" #row>\n </igx-pivot-row>\n </ng-template>\n\n <ng-container *ngTemplateOutlet=\"template; context: { $implicit: this }\"></ng-container>\n <igc-trial-watermark></igc-trial-watermark>\n </div>\n <div igxToggle #loadingOverlay>\n @if (shouldOverlayLoading) {\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n }\n </div>\n @if (hasMovableColumns && columnInDrag) {\n <span [igxColumnMovingDrop]=\"headerContainer\" [attr.droppable]=\"true\"\n id=\"right\" class=\"igx-grid__scroll-on-drag-right\"></span>\n }\n <div [hidden]=\"!hasVerticalScroll()\" class=\"igx-grid__tbody-scrollbar\" [style.width.px]=\"scrollSize\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__tbody-scrollbar-start\" [style.height.px]=\" isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n <div class=\"igx-grid__tbody-scrollbar-main\" [style.height.px]=\"calcHeight\">\n <ng-template igxGridFor [igxGridForOf]=\"[]\" #verticalScrollHolder></ng-template>\n </div>\n <div class=\"igx-grid__tbody-scrollbar-end\" [style.height.px]=\"!isRowPinningToTop ? pinnedRowHeight : 0\"></div>\n </div>\n\n <div class=\"igx-grid__addrow-snackbar\">\n <igx-snackbar #addRowSnackbar [outlet]=\"igxBodyOverlayOutlet\" [actionText]=\"resourceStrings.igx_grid_snackbar_addrow_actiontext\" [displayTime]=\"snackbarDisplayTime\">{{resourceStrings.igx_grid_snackbar_addrow_label}}</igx-snackbar>\n </div>\n\n <div #igxBodyOverlayOutlet=\"overlay-outlet\" igxOverlayOutlet></div>\n</div>\n\n<div class=\"igx-grid__scroll\" [style.height.px]=\"scrollSize\" #scr [hidden]=\"isHorizontalScrollHidden\" (pointerdown)=\"$event.preventDefault()\">\n <div class=\"igx-grid__scroll-start\" [style.width.px]=\"pivotPinnedStartWidth\" [style.min-width.px]=\"pivotPinnedStartWidth\"></div>\n <div class=\"igx-grid__scroll-main\" [style.width.px]=\"pivotUnpinnedWidth\">\n <ng-template igxGridFor [igxGridForOf]=\"EMPTY_DATA\" #scrollContainer>\n </ng-template>\n </div>\n <div class=\"igx-grid__scroll-end\" [style.width.px]=\"pivotPinnedEndWidth\" [style.min-width.px]=\"pivotPinnedEndWidth\" [hidden]=\"pivotPinnedEndWidth === 0\"></div>\n</div>\n\n<div class=\"igx-grid__tfoot\" role=\"rowgroup\" #tfoot>\n</div>\n\n<div class=\"igx-grid__footer\" #footer>\n <ng-content select=\"igx-grid-footer,igc-grid-footer\"></ng-content>\n</div>\n\n<ng-template #emptyFilteredGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyFilteredGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultEmptyGrid>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{emptyGridMessage}}</span>\n </span>\n</ng-template>\n\n<ng-template #defaultLoadingGrid>\n <div class=\"igx-grid__loading\">\n <igx-circular-bar [indeterminate]=\"true\">\n </igx-circular-bar>\n </div>\n</ng-template>\n@if (colResizingService.showResizer) {\n <igx-pivot-grid-column-resizer [restrictResizerTop]=\"calculateResizerTop()\"></igx-pivot-grid-column-resizer>\n}\n<div class=\"igx-grid__loading-outlet\" #igxLoadingOverlayOutlet igxOverlayOutlet></div>\n<div class=\"igx-grid__outlet\" #igxFilteringOverlayOutlet igxOverlayOutlet></div>\n\n<ng-template #headerTemplate let-column>\n <div class=\"igx-grid__tr--header\">\n <igx-icon\n family=\"default\"\n [name]=\"getColumnGroupExpandState(column) ? 'tree_expand' : 'tree_collapse'\"\n [attr.draggable]=\"false\"\n (click)=\"toggleColumn(column)\">\n </igx-icon>\n {{column.header}}\n </div>\n</ng-template>\n\n<ng-template #defaultRowDimensionsTemplate>\n @for (dim of rowDimensions; track dim.memberName; let dimIndex = $index) {\n <div tabindex=\"0\" [style.height.px]=\"totalHeight\" #rowDimensionContainer class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n <ng-template igxGridFor let-rowData\n [igxGridForOf]=\"dataView | pivotGridCellMerging:pivotConfiguration:dim:pipeTrigger\"\n let-rowIndex=\"index\" [igxForScrollOrientation]=\"'vertical'\" [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n #verticalRowDimScrollContainer\n >\n <igx-pivot-row-dimension-content\n class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"rowData.dimensions[dimIndex]\"\n [rootDimension]=\"dim\"\n [style.height.px]=\"renderedRowHeight * (rowData.rowSpan || 1)\"\n [rowIndex]=\"rowIndex\" [rowData]=\"rowData\"\n [width]=\"rowDimensionWidthToPixels(dim)\">\n </igx-pivot-row-dimension-content>\n </ng-template>\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(dim) }\"></ng-container>\n </div>\n }\n</ng-template>\n\n<ng-template #horizontalRowDimensionsTemplate>\n <div tabindex=\"0\" class=\"igx-grid__tbody-pivot-mrl-dimension\" #rowDimensionContainer [style.height.px]=\"totalHeight\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if (dataView | pivotGridHorizontalRowGrouping:pivotConfiguration:pipeTrigger:regroupTrigger; as groupedData) {\n <ng-template #verticalRowDimScrollContainer role=\"rowgroup\" igxGridFor let-rowGroup let-rowIndex=\"index\"\n [igxGridForOf]=\"groupedData\"\n [igxForScrollOrientation]=\"'vertical'\"\n [igxForScrollContainer]=\"verticalScroll\"\n [igxForContainerSize]=\"calcHeight\"\n [igxForItemSize]=\"renderedRowHeight\"\n [igxForSizePropName]=\"'height'\"\n >\n <igx-pivot-row-dimension-mrl-row [rowIndex]=\"rowIndex\" [rowGroup]=\"rowGroup\" [groupedData]=\"groupedData\" [style.height.px]=\"renderedRowHeight * rowGroup.length\"></igx-pivot-row-dimension-mrl-row>\n </ng-template>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: pivotRowWidths }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyRowDimensionsTemplate>\n <div tabindex=\"0\" #rowDimensionContainer role=\"rowgroup\" class=\"igx-grid__tbody-pivot-dimension\" (focus)=\"navigation.focusTbody($event)\" (keydown)=\"navigation.handleNavigation($event)\"\n [attr.aria-activedescendant]=\"headerRowActiveDescendant\">\n @if ((columnDimensions.length > 0 || values.length > 0) && data.length > 0) {\n <igx-pivot-row-dimension-content class=\"igx-grid-thead\" [grid]=\"this\"\n [dimension]=\"emptyRowDimension\"\n [rootDimension]=\"emptyRowDimension\"\n [rowIndex]=\"0\" [rowData]=\"dataView[0]\"\n [width]=\"rowDimensionWidthToPixels(emptyRowDimension)\">\n </igx-pivot-row-dimension-content>\n }\n <ng-container *ngTemplateOutlet=\"emptyRowDimensionFill; context: { $implicit: this, widthPx: rowDimensionWidthToPixels(emptyRowDimension) }\"></ng-container>\n </div>\n</ng-template>\n\n<ng-template #emptyPivotGridTemplate>\n <span class=\"igx-grid__tbody-message\" role=\"cell\">\n <span>{{resourceStrings.igx_grid_pivot_empty_message}}</span>\n </span>\n</ng-template>\n\n<ng-template #emptyRowDimensionFill let-width=\"widthPx\">\n @if (emptyBottomSize > 0) {\n <div class=\"igx-pivot-grid-row-filler__wrapper\" [style.height.px]=\"emptyBottomSize\" [style.width.px]=\"width\">\n <!-- Reuse header styles to keep visuals consistent -->\n <div class=\"igx-grid-thead__wrapper\">\n <div class=\"igx-grid-th\"></div>\n </div>\n </div>\n }\n</ng-template>\n\n<div [hidden]=\"true\">\n <igx-grid-excel-style-filtering [maxHeight]=\"excelStyleFilterMaxHeight\" [minHeight]=\"excelStyleFilterMinHeight\">\n <div igxExcelStyleColumnOperations [hidden]=\"true\"></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@if (platform.isElements) {\n <div #sink style=\"display: none;\"></div>\n <ng-content select=\"igx-grid-state,igc-grid-state\"></ng-content>\n}\n" }]
|
|
4402
4402
|
}], propDecorators: { dimensionsChange: [{
|
|
4403
4403
|
type: Output
|
|
4404
4404
|
}], pivotConfigurationChange: [{
|