Merge branch 'rkaraivanov/multi-column-headers' of https://github.com/IgniteUI/igniteui-angular into rkaraivanov/multi-column-headers

Author: INFRAGISTICS\tiliev

projects/igniteui-angular/src/lib/chips/chips.module.ts

@@ -5,7 +5,7 @@ import { cloneArray } from '../core/utils';
 import { IgxRippleModule } from '../directives/ripple/ripple.directive';
 import { IgxButtonModule } from '../directives/button/button.directive';
 import { IgxAvatarModule } from '../avatar/avatar.component';
-import { IgxIconModule } from '../icon';
+import { IgxIconModule } from '../icon/index';
 import { IgxConnectorDirective } from './connector.directive';
 import { IgxChipComponent } from './chip.component';
 import { IgxChipsAreaComponent } from './chips-area.component';

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

@@ -16,7 +16,7 @@ import { IgxTextHighlightDirective } from '../directives/text-highlight/text-hig
 import { IgxGridAPIService } from './api.service';
 import { IgxGridCellComponent } from './cell.component';
 import { IgxDateSummaryOperand, IgxNumberSummaryOperand, IgxSummaryOperand, IgxSummaryResult } from './grid-summary';
-import { IgxGridSummaryComponent } from './grid-summary.component';
+import { IgxGridRowComponent } from './row.component';
 import {
     IgxCellEditorTemplateDirective,
     IgxCellFooterTemplateDirective,
@@ -228,16 +228,19 @@ export class IgxColumnComponent implements AfterContentInit {
     }
 
     get cells(): IgxGridCellComponent[] {
-        return this.grid.rowList.map((row) => row.cells.filter((cell) => cell.columnIndex === this.index))
-        .reduce((a, b) => a.concat(b), []);
+        return this.grid.rowList.filter((row) => row instanceof IgxGridRowComponent)
+            .map((row) => row.cells.filter((cell) => cell.columnIndex === this.index))
+                .reduce((a, b) => a.concat(b), []);
     }
 
     get visibleIndex(): number {
         const grid = this.gridAPI.get(this.gridID);
         let vIndex = -1;
+
         if (this.columnGroup) {
             return vIndex;
         }
+
         if (!this.pinned) {
             const indexInCollection = grid.unpinnedColumns.indexOf(this);
             vIndex = indexInCollection === -1 ? -1 : grid.pinnedColumns.length + indexInCollection;
@@ -502,7 +505,7 @@ export class IgxColumnGroupComponent extends IgxColumnComponent implements After
 
     @Input()
     get hidden() {
-        return this._hidden;
+        return this.allChildren.every(c => c.hidden);
     }
 
     set hidden(value: boolean) {
@@ -537,8 +540,8 @@ export class IgxColumnGroupComponent extends IgxColumnComponent implements After
 }
 
 
-function flatten(arr: any[]) {
 
+function flatten(arr: any[]) {
     let result = [];
 
     arr.forEach(el => {

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

@@ -1379,7 +1379,7 @@ export class IgxGridComponent implements OnInit, OnDestroy, AfterContentInit, Af
 
     get selectedCells(): IgxGridCellComponent[] | any[] {
         if (this.rowList) {
-            return this.rowList.map((row) => row.cells.filter((cell) => cell.selected))
+            return this.rowList.filter((row) => row instanceof IgxGridRowComponent).map((row) => row.cells.filter((cell) => cell.selected))
                 .reduce((a, b) => a.concat(b), []);
         }
         return [];

src/app/drop-down/drop-down.sample.html

@@ -2,12 +2,12 @@
     <app-page-header title="Dropdown menu" description="description for dropdown menu"></app-page-header>
     <section class="sample-content">
         <button #button igxButton="raised" igxRipple (click)="toggleDropDown()">Toggle</button>
-        <igx-drop-down (onSelection)="onSelection($event)" (onOpening)="onOpening($event)">
+        <igx-drop-down (onSelection)="onSelection()" (onOpening)="onOpening()">
             <igx-drop-down-item *ngFor="let item of items" disabled={{item.disabled}} isHeader={{item.header}}>
                 <div class="igx-drop-down__item-template">
                     {{ item.field }}
                 </div>
             </igx-drop-down-item>
         </igx-drop-down>
     </section>
-</div>
+</div>

src/app/grid-column-groups/grid-column-groups.sample.ts

@@ -1,11 +1,11 @@
-import { Component, ViewChild } from '@angular/core';
+import { Component, ViewChild, AfterViewInit } from '@angular/core';
 import { IgxGridComponent } from 'igniteui-angular';
 
 @Component({
     selector: 'app-grid-column-groups-sample',
     templateUrl: 'grid-column-groups.sample.html'
 })
-export class GridColumnGroupsSampleComponent {
+export class GridColumnGroupsSampleComponent implements AfterViewInit {
 
     @ViewChild('grid', { read: IgxGridComponent })
     grid: IgxGridComponent;
@@ -43,12 +43,18 @@ export class GridColumnGroupsSampleComponent {
     // tslint:enable:max-line-length
 
     pinGroup() {
-        const t = this.grid.getColumnByName('ID');
+        const t = this.grid.getColumnByName('ContactTitle');
         t.pinned = !t.pinned;
     }
 
     hideGroup() {
         const col = this.grid.columnList.filter(c => c.header === 'Person Details')[0];
         col.hidden = !col.hidden;
+        this.grid.getColumnByName('CompanyName').hidden = true;
+        console.log(this.grid.getColumnByName('CompanyName').parent);
+    }
+
+    ngAfterViewInit() {
+        // this.grid.groupBy({ fieldName: 'Country', dir: 1, ignoreCase: false });
     }
 }