Merge branch '19.2.x' into didimmova/vhelper-scrollbar-size

Author: simeonoff

projects/igniteui-angular/src/lib/core/styles/components/combo/_combo-theme.scss

@@ -165,18 +165,15 @@
     %igx-combo__case-icon,
     %igx-combo__case-icon--active {
         line-height: 0;
-
-        igx-icon {
-            --size: rem(18px);
-        }
     }
 
     // The wrapping element here is needed
     // in order to override the !important rule of .igx-icon--inactive.
     %igx-combo__case-icon {
         igx-icon {
-            // Important is needed since the .igx-icon--inactive has !important
-            color: color($color: 'gray', $variant: 600) !important;
+            --igx-icon-disabled-color: var(--ig-gray-600);
+            
+            opacity: 1;
         }
     }
 
@@ -244,6 +241,13 @@
         }
     }
 
+    @if $variant == 'fluent' or $variant == 'bootstrap' {
+        %igx-combo__search {
+            --igx-input-group-input-suffix-background: transparent;
+            --igx-input-group-input-suffix-background--focused: transparent;
+        }
+    }
+
     .igx-input-group {
         %igx-combo__toggle-button {
             background: var-get($theme, 'toggle-button-background');

projects/igniteui-angular/src/lib/grids/columns/column.component.ts

@@ -2309,7 +2309,7 @@ export class IgxColumnComponent implements AfterContentInit, OnDestroy, ColumnTy
         // estimate the exact index at which column will be inserted
         // takes into account initial unpinned index of the column
         if (!hasIndex) {
-            const indices = grid.unpinnedColumns.map(col => col.index);
+            const indices = grid._unpinnedColumns.map(col => col.index);
             indices.push(this.index);
             indices.sort((a, b) => a - b);
             index = indices.indexOf(this.index);

projects/igniteui-angular/src/lib/grids/grid/column-pinning.spec.ts

@@ -108,27 +108,6 @@ describe('Column Pinning UI #grid', () => {
             verifyColumnIsPinned(column, false, 0);
         });
 
-        it('Checks order of columns after unpinning', () => {
-            for (const column of grid.columnList) {
-                column.pin();
-            }
-            fix.detectChanges();
-            grid.getColumnByName('ID').unpin();
-            grid.getColumnByName('ReleaseDate').unpin();
-            grid.getColumnByName('Downloads').unpin();
-            grid.getColumnByName('ProductName').unpin();
-            grid.getColumnByName('Released').unpin();
-            fix.detectChanges();
-            grid.unpinnedColumns.forEach((column, index) => {
-                if (index === grid.unpinnedColumns.length - 1) {
-                    return;
-                }
-                expect(
-                    column.index < grid.unpinnedColumns[index + 1].index
-                ).toBe(true);
-            });
-        });
-
         it('reflects properly grid column pinned value changes.', () => {
             const name = 'ReleaseDate';
             verifyCheckbox(name, false, false, columnChooserElement);
@@ -307,6 +286,36 @@ describe('Column Pinning UI #grid', () => {
                 ).toBe(true);
             });
         });
+
+        it('Checks order of columns after unpinning if there are hidden columns', () => {
+            // Columns are ordered like this: ID, ProductName, Downloads, Released, ReleaseDate
+            expect(grid.getColumnByName('Downloads').index).toBe(2);
+            expect(grid.getColumnByName('Released').index).toBe(3);
+
+            grid.getColumnByName('ID').hidden = true;
+            grid.getColumnByName('Downloads').pin();
+            grid.getColumnByName('Released').pin();
+            fix.detectChanges();
+
+            // unpinnedColumns contains only visible cols
+            expect(grid.unpinnedColumns.length).toBe(2);
+            // _unpinnedColumns contains all unpinned cols (including hidden)
+            expect((grid as any)._unpinnedColumns.length).toBe(3);
+
+            grid.getColumnByName('Released').unpin();
+            fix.detectChanges();
+
+            expect(grid.unpinnedColumns.length).toBe(3);
+            expect((grid as any)._unpinnedColumns.length).toBe(4);
+            // Downloads is still pinned; ID is not part of unpinnedColumns
+            expect(grid.getColumnByName('Released').field).toEqual((grid as any).unpinnedColumns[1].field);
+            expect(grid.getColumnByName('Released').field).toEqual((grid as any)._unpinnedColumns[2].field);
+
+            grid.getColumnByName('Downloads').unpin();
+            fix.detectChanges();
+            expect(grid.getColumnByName('Downloads').field).toEqual((grid as any).unpinnedColumns[1].field);
+            expect(grid.getColumnByName('Downloads').field).toEqual((grid as any)._unpinnedColumns[2].field);
+        });
     });
 
     describe('Pinning with Column Groups', () => {

projects/igniteui-angular/src/lib/grids/grid/grid-toolbar.spec.ts

@@ -173,6 +173,18 @@ describe('IgxGrid - Grid Toolbar #grid - ', () => {
             expect($('#csvEntry').textContent).toMatch(instance.customCSVText);
         });
 
+        it('progress indicator should stop on canceling the export', () => {
+            fixture.componentInstance.exportStartCancelled = true;
+            fixture.detectChanges();
+            $(TOOLBAR_EXPORTER_TAG).querySelector('button').click();
+            fixture.detectChanges();
+            $('#excelEntry').click();
+            fixture.detectChanges();
+
+            expect(instance.exporterAction.isExporting).toBeFalse();
+            expect(instance.exporterAction.toolbar.showProgress).toBeFalse();
+        });
+
         it('Setting overlaySettings for each toolbar columns action', () => {
             const defaultSettings = instance.pinningAction.overlaySettings;
             const defaultFiltSettings = instance.advancedFiltAction.overlaySettings;
@@ -297,7 +309,7 @@ export class DefaultToolbarComponent {
                 <igx-grid-toolbar-advanced-filtering #advancedFiltAction>
                     {{ advancedFilteringTitle }}
                 </igx-grid-toolbar-advanced-filtering>
-                <igx-grid-toolbar-exporter #exporterAction [exportCSV]="exportCSV" [exportExcel]="exportExcel" [filename]="exportFilename">
+                <igx-grid-toolbar-exporter #exporterAction [exportCSV]="exportCSV" [exportExcel]="exportExcel" [filename]="exportFilename" (exportStarted)="exportStarted($event)">
                     {{ exporterText }}
                     <span id="excelEntry" excelText>{{ customExcelText }}</span>
                     <span id="csvEntry" csvText>{{ customCSVText }}</span>
@@ -346,8 +358,15 @@ export class ToolbarActionsComponent {
         modal: true,
         closeOnEscape: false
     };
+    public exportStartCancelled = false;
 
     constructor() {
         this.data = [...DATA];
     }
+
+    public exportStarted(args) {
+        if (this.exportStartCancelled) {
+            args.cancel = true;
+        }
+    }
 }

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

@@ -126,13 +126,14 @@ export class IgxGridToolbarExporterComponent extends BaseToolbarDirective {
 
         this.exportStarted.emit(args);
         this.grid.toolbarExporting.emit(args);
-        this.isExporting = true;
-        this.toolbar.showProgress = true;
 
         if (args.cancel) {
             return;
         }
 
+        this.isExporting = true;
+        this.toolbar.showProgress = true;
+
         exporter.exportEnded.pipe(first()).subscribe(() => {
             this.exportEnded.emit();
             this.isExporting = false;