Merge branch 'pivot-grid-master' of https://github.com/IgniteUI/igniteui-angular into mdragnev/feat-10713

Author: mddragnev

projects/igniteui-angular/src/lib/core/styles/components/grid/_grid-theme.scss

@@ -2878,7 +2878,11 @@
 
     // Pivot grid
     %grid-thead--pivot {
-        flex-direction: column;
+        display: flex;
+
+        %grid-thead--virtualizationWrapper {
+            border-#{$left}: var-get($theme, 'header-border-width') var-get($theme, 'header-border-style') var-get($theme, 'header-border-color');
+        }
     }
 
     %grid-thead--virtualizationWrapper {
@@ -2911,7 +2915,6 @@
         padding: map.get($grid-header-padding, 'comfortable');
         background-clip: border-box !important;
         border-#{$left}: var-get($theme, 'header-border-width') var-get($theme, 'header-border-style') var-get($theme, 'header-border-color');
-        border-#{$right}: var-get($theme, 'header-border-width') var-get($theme, 'header-border-style') var-get($theme, 'header-border-color');
         border-bottom: var-get($theme, 'header-border-width') var-get($theme, 'header-border-style') var-get($theme, 'header-border-color');
 
         igx-chips-area {

projects/igniteui-angular/src/lib/grids/common/grid.interface.ts

@@ -628,6 +628,7 @@ export interface PivotGridType extends GridType {
     showPivotConfigurationUI: boolean;
     columnDimensions: IPivotDimension[];
     rowDimensions: IPivotDimension[];
+    rowDimensionResizing: boolean;
     values: IPivotValue[];
     filterDimensions: IPivotDimension[];
     dimensionDataColumns: ColumnType[];

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.html

@@ -126,7 +126,7 @@
         </igx-circular-bar>
     </div>
 </ng-template>
-<igx-grid-column-resizer *ngIf="colResizingService.showResizer"></igx-grid-column-resizer>
+<igx-pivot-grid-column-resizer [restrictResizerTop]="theadRow.nativeElement.clientHeight" *ngIf="colResizingService.showResizer"></igx-pivot-grid-column-resizer>
 <div class="igx-grid__loading-outlet" #igxLoadingOverlayOutlet igxOverlayOutlet></div>
 <div class="igx-grid__outlet" #igxFilteringOverlayOutlet igxOverlayOutlet></div>
 

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.component.ts

@@ -51,7 +51,7 @@ import { DropPosition } from '../moving/moving.service';
 import { DimensionValuesFilteringStrategy, NoopPivotDimensionsStrategy } from '../../data-operations/pivot-strategy';
 import { IgxGridExcelStyleFilteringComponent } from '../filtering/excel-style/grid.excel-style-filtering.component';
 import { IgxPivotGridNavigationService } from './pivot-grid-navigation.service';
-import { IgxColumnResizingService } from '../resizing/resizing.service';
+import { IgxPivotColumnResizingService } from '../resizing/pivot-grid/pivot-resizing.service';
 import { IgxFlatTransactionFactory, IgxOverlayService, State, Transaction, TransactionService } from '../../services/public_api';
 import { DOCUMENT } from '@angular/common';
 import { DisplayDensityToken, IDisplayDensityOptions } from '../../core/displayDensity';
@@ -65,6 +65,7 @@ import { GridBaseAPIService } from '../api.service';
 import { IgxGridForOfDirective } from '../../directives/for-of/for_of.directive';
 import { IgxPivotRowDimensionContentComponent } from './pivot-row-dimension-content.component';
 import { flatten } from '@angular/compiler';
+import { IgxPivotGridColumnResizerComponent } from '../resizing/pivot-grid/pivot-resizer.component';
 
 let NEXT_ID = 0;
 const MINIMUM_COLUMN_WIDTH = 200;
@@ -81,6 +82,7 @@ const MINIMUM_COLUMN_WIDTH = 200;
         { provide: IGX_GRID_BASE, useExisting: IgxPivotGridComponent },
         { provide: IgxFilteringService, useClass: IgxPivotFilteringService },
         IgxPivotGridNavigationService,
+        IgxPivotColumnResizingService,
         IgxForOfSyncService,
         IgxForOfScrollSyncService
     ]
@@ -129,7 +131,14 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
      * <igx-pivot-grid [pivotConfiguration]="config"></igx-pivot-grid>
      * ```
      */
-    public pivotConfiguration: IPivotConfiguration = { rows: null, columns: null, values: null, filters: null };
+    public set pivotConfiguration(value :IPivotConfiguration) {
+        this._pivotConfiguration = value;
+        this.notifyChanges(true);
+    }
+    
+    public get pivotConfiguration() {
+        return this._pivotConfiguration;
+    }
 
     @Input()
     /**
@@ -161,6 +170,12 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
     @ViewChild('headerTemplate', { read: TemplateRef, static: true })
     public headerTemplate: TemplateRef<any>;
 
+    /**
+     * @hidden @internal
+     */
+    @ViewChild(IgxPivotGridColumnResizerComponent)
+    public resizeLine: IgxPivotGridColumnResizerComponent;
+
     /**
      * @hidden @interal
      */
@@ -323,9 +338,15 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
         return false;
     }
 
+    /**
+     * @hidden @internal
+     */
+    public rowDimensionResizing = true;
+
     protected _defaultExpandState = false;
     private _data;
     private _filteredData;
+    private _pivotConfiguration: IPivotConfiguration = { rows: null, columns: null, values: null, filters: null };
     private p_id = `igx-pivot-grid-${NEXT_ID++}`;
 
 
@@ -498,7 +519,7 @@ export class IgxPivotGridComponent extends IgxGridBaseDirective implements OnIni
 
     constructor(
         public selectionService: IgxGridSelectionService,
-        public colResizingService: IgxColumnResizingService,
+        public colResizingService: IgxPivotColumnResizingService,
         gridAPI: GridBaseAPIService<IgxGridBaseDirective & GridType>,
         protected transactionFactory: IgxFlatTransactionFactory,
         elementRef: ElementRef<HTMLElement>,

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid.interface.ts

@@ -3,29 +3,55 @@ import { FilteringExpressionsTree } from '../../data-operations/filtering-expres
 import { SortingDirection } from '../../data-operations/sorting-strategy';
 import { ColumnType } from '../common/grid.interface';
 
+
+/**
+* Default pivot keys used for data processing in the pivot pipes.
+*/
 export const DEFAULT_PIVOT_KEYS = {
     aggregations: 'aggregations', records: 'records', children: 'children', level: 'level',
     rowDimensionSeparator: '_', columnDimensionSeparator: '-'
 };
 
+
+/**
+ * Event emitted when dimension collection for rows, columns of filters is changed.
+ */
 export interface IDimensionsChange {
+    /** The new list of dimensions. */
     dimensions: IPivotDimension[],
+    /** The dimension list type - Row, Column or Filter. */
     dimensionCollectionType: PivotDimensionType
 }
 
+ /**
+ * Event emitted when values list is changed.
+ */
 export interface IValuesChange {
+    /** The new list of values. */
     values: IPivotValue[]
 }
 
+ /**
+ * Interface describing Pivot data processing for dimensions.
+ * Should contain a process method and return records hierarchy based on the provided dimensions.
+ */
 export interface IPivotDimensionStrategy {
     process(collection: any,
         dimensions: IPivotDimension[],
         values: IPivotValue[],
         pivotKeys?: IPivotKeys): any[];
 }
 
+ /**
+ * Interface describing a PivotAggregation function. 
+ * Accepts an array of extracted data members and a array of the original data records.
+ */
 export type PivotAggregation = (members: any[], data: any[]) => any;
 
+ /**
+ * Interface describing a IPivotAggregator class.
+ * Used for specifying custom aggregator lists.
+ */
 export interface IPivotAggregator {
     /** Aggregation unique key. */
     key: string;
@@ -38,7 +64,7 @@ export interface IPivotAggregator {
     aggregator: (members: any[], data?: any[]) => any;
 }
 
-/**
+ /**
  * Configuration of the pivot grid.
  */
 export interface IPivotConfiguration {
@@ -54,9 +80,13 @@ export interface IPivotConfiguration {
     values: IPivotValue[] | null;
     /** Dimensions to be displayed in the filter area. */
     filters?: IPivotDimension[] | null;
+    /** Pivot data keys used for data generation. Can be used for custom remote scenarios where the data is pre-populated. */
     pivotKeys?: IPivotKeys;
 }
 
+ /**
+ * Configuration of a pivot dimension.
+ */
 export interface IPivotDimension {
     /** Allows defining a hierarchy when multiple sub groups need to be extracted from single member. */
     childLevel?: IPivotDimension;
@@ -70,15 +100,24 @@ export interface IPivotDimension {
      * A predefined or defined via the `igxPivotSelector` filter expression tree for the current dimension to be applied in the filter pipe.
      * */
     filter?: FilteringExpressionsTree | null;
+    /**
+     * The sorting direction of the current dimension. Determines the order in which the values will appear in the related dimension.
+     */
     sortDirection?: SortingDirection;
+    /**
+     * The dataType of the related data field.
+     */
     dataType?: GridColumnDataType;
-    // The width of the dimension cells to be rendered.Can be pixel or %.
-    width? : string;
+    /** The width of the dimension cells to be rendered.Can be pixel or %. */
+    width?: string;
 }
-
+ /**
+ * Configuration of a pivot value aggregation.
+ */
 export interface IPivotValue {
+    /** Field name to use in order to extract value. */
     member: string;
-    // display name if present shows instead of member for the column header of this value
+    /** Display name to show instead of member for the column header of this value. **/
     displayName?: string;
     /**
      * Active aggregator definition with key, label and aggregator.
@@ -88,34 +127,59 @@ export interface IPivotValue {
      * List of aggregates to show in aggregate drop-down.
      */
     aggregateList?: IPivotAggregator[];
-    // Enables/Disables a particular value from pivot aggregation.
+    /** Enables/Disables a particular value from pivot aggregation. */
     enabled: boolean;
-    // Allow conditionally styling of the IgxPivotGrid cells
+    /**  Allow conditionally styling of the IgxPivotGrid cells. */
     styles?: any;
-    // Enables a data type specific template of the cells
+    /** Enables a data type specific template of the cells */
     dataType?: GridColumnDataType;
-    // Applies display format to cell values.
+    /** Applies display format to cell values. */
     formatter?: (value: any, rowData?: any) => any;
 }
 
+/** Interface describing the Pivot data keys used for data generation.
+*  Can be used for custom remote scenarios where the data is pre-populated.
+*/
 export interface IPivotKeys {
+    /** Field that stores children for hierarchy building. */
     children: string;
+    /** Field that stores reference to the original data records. */
     records: string;
+    /** Field that stores aggregation values. */
     aggregations: string;
+    /** Field that stores dimension level based on its hierarchy. */
     level: string;
+    /** Separator used when generating the unique column field values. */
     columnDimensionSeparator: string;
+    /** Separator used when generating the unique row field values. */
     rowDimensionSeparator: string;
 }
 
+/** The dimension types - Row, Column or Filter. */
 export enum PivotDimensionType {
     Row,
     Column,
     Filter
 }
 
+/** Interface describing the pivot dimension data.
+* Contains additional information needed to render dimension headers.
+*/
 export interface IPivotDimensionData {
+    /** Associated column definition. */
     column: ColumnType;
+    /** Associated dimension definition. */
     dimension: IPivotDimension;
+    /** List of previous dimension groups. */
     prevDimensions: IPivotDimension[];
+    /** Whether this a child dimension. */
     isChild?: boolean;
 }
+
+export interface PivotRowHeaderGroupType {
+    rowIndex: number;
+    parent: any;
+    header: any;
+    headerID: string;
+    grid: any;
+}