Merge remote-tracking branch 'origin/master' into pivot-grid-master

Author: ChronosSF

CHANGELOG.md

@@ -2,6 +2,18 @@
 
 All notable changes for each version of this project will be documented in this file.
 
+## 13.0.0
+
+### New Features
+- `IgxCsvExporterService`, `IgxExcelExporterService`
+    - Exporter services are no longer required to be provided in the application since they are now injected on a root level. 
+
+## 12.2.1
+
+### New Features
+- `igxGrid`, `igxHierarchicalGrid`, `igxTreeGrid`
+    - new `rowPinned` event is emitted after a row is pinned/unpinned and grid has already refreshed its state to represent the pinned/unpinned rows in the DOM.
+
 ## 12.2.0
 
 ### New Features

ROADMAP.md

@@ -14,7 +14,7 @@
 ## Going down the road
 
 1. Angular Pivot Grid [#5700](https://github.com/IgniteUI/igniteui-angular/issues/5700)
-2. Grid Cell Merging
+2. Grid Cell Merging [#3514](https://github.com/IgniteUI/igniteui-angular/issues/3514)
 3. PDF Export feature on Angular Grid [#5696](https://github.com/IgniteUI/igniteui-angular/issues/5696)
 4. Themes: Move code to Sass modules [#9554](https://github.com/IgniteUI/igniteui-angular/issues/9554)
 5. Themes: Split themes and aid with Grid refactoring [#9556](https://github.com/IgniteUI/igniteui-angular/issues/9556)

projects/igniteui-angular/src/lib/checkbox/checkbox.component.spec.ts

@@ -1,6 +1,6 @@
 import { Component, ViewChild } from '@angular/core';
 import { fakeAsync, TestBed, tick, waitForAsync } from '@angular/core/testing';
-import { FormsModule } from '@angular/forms';
+import { FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { By } from '@angular/platform-browser';
 import { IgxRippleModule } from '../directives/ripple/ripple.directive';
 import { IgxCheckboxComponent } from './checkbox.component';
@@ -22,9 +22,10 @@ describe('IgxCheckbox', () => {
                 CheckboxExternalLabelComponent,
                 CheckboxInvisibleLabelComponent,
                 CheckboxDisabledTransitionsComponent,
+                CheckboxFormGroupComponent,
                 IgxCheckboxComponent
             ],
-            imports: [FormsModule, IgxRippleModule, NoopAnimationsModule]
+            imports: [FormsModule, ReactiveFormsModule, IgxRippleModule, NoopAnimationsModule]
         })
             .compileComponents();
     }));
@@ -34,7 +35,7 @@ describe('IgxCheckbox', () => {
         fixture.detectChanges();
 
         const checkbox = fixture.componentInstance.cb;
-        const nativeCheckbox = fixture.debugElement.query(By.css('input')).nativeElement;
+        const nativeCheckbox = checkbox.nativeCheckbox.nativeElement;
         const nativeLabel = checkbox.nativeLabel.nativeElement;
         const placeholderLabel = fixture.debugElement.query(By.css('.igx-checkbox__label')).nativeElement;
 
@@ -69,7 +70,7 @@ describe('IgxCheckbox', () => {
         fixture.detectChanges();
 
         expect(nativeCheckbox.checked).toBe(false);
-        expect(checkboxInstance.checked).toBe(false);
+        expect(checkboxInstance.checked).toBe(null);
 
         testInstance.subscribed = true;
         checkboxInstance.name = 'my-checkbox';
@@ -85,6 +86,22 @@ describe('IgxCheckbox', () => {
         expect(checkboxInstance.name).toEqual('my-checkbox');
     }));
 
+    it('Initializes with form group', () => {
+        const fixture = TestBed.createComponent(CheckboxFormGroupComponent);
+        fixture.detectChanges();
+
+        const testInstance = fixture.componentInstance;
+        const checkboxInstance = testInstance.cb;
+        const form = testInstance.myForm;
+
+        form.setValue({ checkbox: true });
+        expect(checkboxInstance.checked).toBe(true);
+
+        form.reset();
+
+        expect(checkboxInstance.checked).toBe(null);
+    });
+
     it('Initializes with external label', () => {
         const fixture = TestBed.createComponent(CheckboxExternalLabelComponent);
         const checkboxInstance = fixture.componentInstance.cb;
@@ -197,7 +214,7 @@ describe('IgxCheckbox', () => {
         fixture.detectChanges();
 
         // Should not update
-        expect(checkboxInstance.checked).toBe(false);
+        expect(checkboxInstance.checked).toBe(null);
         expect(testInstance.subscribed).toBe(false);
     });
 
@@ -398,3 +415,14 @@ class CheckboxInvisibleLabelComponent {
 class CheckboxDisabledTransitionsComponent {
     @ViewChild('cb', { static: true }) public cb: IgxCheckboxComponent;
 }
+
+@Component({
+    template: `<form [formGroup]="myForm"><igx-checkbox #cb formControlName="checkbox">Form Group</igx-checkbox></form>`
+})
+class CheckboxFormGroupComponent {
+    @ViewChild('cb', { static: true }) public cb: IgxCheckboxComponent;
+
+    public myForm = this.fb.group({ checkbox: [''] });
+
+    constructor(private fb: FormBuilder) {}
+}

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

@@ -428,9 +428,7 @@ export class IgxCheckboxComponent implements ControlValueAccessor, EditorProvide
 
     /** @hidden @internal */
     public writeValue(value: boolean) {
-        if (typeof value === 'boolean') {
-            this._checked = value;
-        }
+        this._checked = value;
     }
 
     /** @hidden @internal */

projects/igniteui-angular/src/lib/dialog/dialog.component.spec.ts

@@ -345,7 +345,7 @@ describe('Dialog', () => {
         fix.detectChanges();
 
         dialog.open();
-        tick();
+        tick(16);
         fix.detectChanges();
 
         overlaydiv = document.getElementsByClassName(OVERLAY_MAIN_CLASS)[0];

projects/igniteui-angular/src/lib/grids/cell.component.html

@@ -91,12 +91,9 @@
         </igx-input-group>
     </ng-container>
     <ng-container *ngIf="column.dataType === 'boolean'">
-        <!-- The additional [checked] binding is needed as after the initial call of the checked getter
-        it is never called again as no change detection is triggered in the grid after that, resulting in wrong
-        rendered state of the checkbox. -->
         <igx-checkbox
-            [(ngModel)]="editValue"
             [checked]="editValue"
+            (change)="editValue = $event.checked"
             [igxFocus]="true"
             [disableRipple]="true"
         ></igx-checkbox>

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

@@ -54,7 +54,6 @@ import {
     Action,
 } from '../services/public_api';
 import { GridBaseAPIService } from './api.service';
-import { IgxGridCellComponent } from './cell.component';
 import { IgxSummaryOperand, ISummaryExpression } from './summaries/grid-summary';
 import { RowEditPositionStrategy, IPinningConfig } from './grid.common';
 import { IgxGridToolbarComponent } from './toolbar/grid-toolbar.component';
@@ -941,6 +940,17 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
     @Output()
     public rowPinning = new EventEmitter<IPinRowEventArgs>();
 
+    /**
+     * Emitted when the pinned state of a row is changed.
+     *
+     * @example
+     * ```html
+     * <igx-grid [data]="employeeData" (rowPinned)="rowPin($event)" [autoGenerate]="true"></igx-grid>
+     * ```
+     */
+    @Output()
+    public rowPinned = new EventEmitter<IPinRowEventArgs>();
+
     /**
      * Emmited when the active node is changed.
      *
@@ -4829,6 +4839,7 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
         if (this._pinnedRecordIDs.indexOf(rowID) !== -1) {
             return false;
         }
+
         const eventArgs: IPinRowEventArgs = {
             insertAtIndex: index,
             isPinned: true,
@@ -4843,8 +4854,10 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
         this._pinnedRecordIDs.splice(insertIndex, 0, rowID);
         this.pipeTrigger++;
         if (this.gridAPI.grid) {
-            this.notifyChanges();
+            this.cdr.detectChanges();
+            this.rowPinned.emit(eventArgs);
         }
+
         return true;
     }
 
@@ -4870,12 +4883,15 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
             row
         };
         this.rowPinning.emit(eventArgs);
+
         this.crudService.endEdit(false);
         this._pinnedRecordIDs.splice(index, 1);
         this.pipeTrigger++;
         if (this.gridAPI.grid) {
             this.cdr.detectChanges();
+            this.rowPinned.emit(eventArgs);
         }
+
         return true;
     }
 
@@ -6923,16 +6939,21 @@ export abstract class IgxGridBaseDirective extends DisplayDensityBase implements
         const activeEl = this.selectionService.activeElement;
 
         if (this.nativeElement.tagName.toLowerCase() === 'igx-hierarchical-grid') {
-            const expansionRowIndexes = Array.from(this.expansionStates.keys());
+            const expansionRowIndexes = [];
+            for (const [key, value] of this.expansionStates.entries()) {
+                if (value) {
+                    expansionRowIndexes.push(key);
+                }
+            }
             if (this.selectionService.selection.size > 0) {
                 if (expansionRowIndexes.length > 0) {
                     for (const [key, value] of this.selectionService.selection.entries()) {
                         let updatedKey = key;
                         expansionRowIndexes.forEach(row => {
                             let rowIndex;
-                            if (row.ID) {
+                            if (!isNaN(row.ID)) {
                                 rowIndex = Number(row.ID);
-                            }else {
+                            } else {
                                 rowIndex = Number(row);
                             }
 

projects/igniteui-angular/src/lib/grids/grid-public-row.ts

@@ -211,7 +211,7 @@ abstract class BaseRow implements RowType {
      * ```
      */
     public pin(): boolean {
-        return this.grid.pinRow(this.key);
+        return this.grid.pinRow(this.key, this.index);
     }
 
     /**