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

Author: mddragnev

CHANGELOG.md

@@ -55,6 +55,8 @@ All notable changes for each version of this project will be documented in this
          - `dragOver`
 - `IgxGrid`, `IgxTreeGrid`, `IgxHierarchicalGrid`
     - Added new directives for re-templating header sorting indicators - `IgxSortHeaderIconDirective`, `IgxSortAscendingHeaderIconDirective` and `IgxSortDescendingHeaderIconDirective`.
+- `IgxGrid`
+    - Exposed a `groupStrategy` input that functions similarly to `sortStrategy`, allowing customization of the grouping behavior of the grid. Please, refer to the [Group By ](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/groupby) topic for more information.
 - `IgxDialog`
     - Added `focusTrap` input to set whether the Tab key focus is trapped within the dialog when opened. Defaults to `true`.
 
@@ -106,8 +108,6 @@ All notable changes for each version of this project will be documented in this
         ```
     - `IgxColumnActionsComponent`
         - **Breaking Change** -  Input `columns` has been removed. Use `igxGrid` `columns` input instead.
-    - `igxGrid`
-    - Exposed a `groupStrategy` input that functions similarly to `sortStrategy`, allowing customization of the grouping behavior of the grid. Please, refer to the [Group By ](https://www.infragistics.com/products/ignite-ui-angular/angular/components/grid/groupby) topic for more information.
 - `IgxCarousel`
     - **Breaking Changes** - The carousel animation type `CarouselAnimationType` is renamed to `HorizontalAnimationType`.
 

projects/igniteui-angular/src/lib/core/styles/themes/schemas/light/_button.scss

@@ -11,7 +11,6 @@
 /// @type {Map}
 /// @prop {Color} shadow-color [transparent] - The shadow color of the button.
 /// @prop {Color} border-color [transparent] - The outline color of the button.
-/// @prop {Color} focus-border-color [transparent] - The focused border color of the button.
 /// @prop {Color} disabled-border-color [transparent] - The disabled border color of the button.
 /// @prop {Color} disabled-background [igx-color: ('grays', 300)] - The disabled background color of the button.
 /// @prop {Color} disabled-foreground [igx-color: ('grays', 500)] - The disabled foreground color of the button.
@@ -22,8 +21,6 @@ $material-base-button: (
 
     border-color: transparent,
 
-    focus-border-color: transparent,
-
     disabled-border-color: transparent,
 
     disabled-background: (
@@ -80,7 +77,6 @@ $material-flat-button: extend(
 
 /// @type {Map}
 /// @prop {Map} border-color [igx-color: ('secondary', 500)] - The outline color of the button.
-/// @prop {Map} focus-border-color [igx-color: ('grays', 300)] - The focused border color of the button.
 /// @prop {Map} disabled-border-color [igx-color: ('grays', 300)] - The disabled focused border color of the button.
 /// @requires {function} extend
 /// @requires {Map} $material-flat-button
@@ -90,11 +86,7 @@ $material-outlined-button: extend(
         selector: '[igxButton="outlined"], .igx-button--outlined',
 
         border-color: (
-            igx-color: ('secondary', 300)
-        ),
-
-        focus-border-color: (
-            igx-color: ('grays', 300)
+            igx-color: ('secondary', 500)
         ),
 
         disabled-border-color: (

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

@@ -5766,7 +5766,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
      * @hidden @internal
      */
     public isSummaryRow(rowData): boolean {
-        return rowData.summaries && (rowData.summaries instanceof Map);
+        return rowData && rowData.summaries && (rowData.summaries instanceof Map);
     }
 
     /**

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

@@ -598,7 +598,7 @@ export class IgxGridComponent extends IgxGridBaseDirective implements GridType,
      * @hidden @internal
      */
     public isDetailRecord(record) {
-        return record.detailsData !== undefined;
+        return record && record.detailsData !== undefined;
     }
 
     /**

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

@@ -30,7 +30,7 @@
                 <!-- Columns area -->
                 <igx-chips-area #colArea droppable='true' style="width:fit-content; height: 100%;">
                     <igx-chip *ngFor="let col of grid.columnDimensions" [draggable]="true" [id]="col.memberName"
-                        [removable]="true" (remove)="columnRemoved($event)" 
+                        [removable]="true" (remove)="columnRemoved($event)"
                         (dragOver)="onDimDragOver($event, 1)"
                         (dragLeave)="onDimDragLeave($event)"
                         (dragDrop)="onDimDrop($event, colArea, 1)"
@@ -80,7 +80,7 @@
             <div #pivotContainer class="igx-grid__tr-action" [style.min-width.px]="grid.pivotRowWidths"
                 (igxDragEnter)="onAreaDragEnter($event, rowArea, 0)" (igxDragLeave)="onAreaDragLeave($event, rowArea)"
                 igxDrop (dropped)="onDimDrop($event, rowArea, 0)" (pointerdown)="$event.preventDefault()"
-                style='display: flex; align-items: flex-end;'>
+                style='display: flex; align-items: flex-end; z-index: 4; background: inherit;'>
 
                 <div *ngIf="grid.rowDimensions.length === 0">
                     <span class='igx-pivot__emptyChipArea'>Drop Row Fields here.</span>
@@ -147,4 +147,4 @@
     <igx-drop-down-item *ngFor="let item of aggregateList" [selected] ='isSelected(item)' [value]='item'>
         {{ item.label }}
     </igx-drop-down-item>
-</igx-drop-down>
+</igx-drop-down>