chore(*): updating column groups demo to include exporter

Author: kdinev

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

@@ -8,9 +8,10 @@
     <igx-grid [allowFiltering]="true" [moving]="true" [pinning]="pinningConfig" [rowSelection]="selectionMode" #grid [data]="data">
         <igx-grid-toolbar >
             <igx-grid-toolbar-actions>
-               <igx-grid-toolbar-pinning></igx-grid-toolbar-pinning>
-               <igx-grid-toolbar-hiding></igx-grid-toolbar-hiding>
+                <igx-grid-toolbar-pinning></igx-grid-toolbar-pinning>
+                <igx-grid-toolbar-hiding></igx-grid-toolbar-hiding>
                 <igx-grid-toolbar-advanced-filtering></igx-grid-toolbar-advanced-filtering>
+                <igx-grid-toolbar-exporter></igx-grid-toolbar-exporter>
             </igx-grid-toolbar-actions>
         </igx-grid-toolbar>
         <igx-column [resizable]="true"  field="Missing"></igx-column>
@@ -26,12 +27,12 @@
             </ng-template>
         </igx-column-group>
         <igx-column [hidden]="s" [resizable]="true" field="ID" [editable]="true"></igx-column>
-        <igx-column-group header="Address Information" [(collapsible)]='s' [expanded]='true'>
-            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Country" [visibleWhenCollapsed]= 'false'></igx-column>
-            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Region" [visibleWhenCollapsed]= 'false'></igx-column>
-            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="City" [visibleWhenCollapsed]= 'false'></igx-column>
-            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Address" [visibleWhenCollapsed]= 'false'></igx-column>
-            <igx-column [filterable]="true" [editable]="true" [sortable]="true" [visibleWhenCollapsed]= 'true'  field="FullAddress"></igx-column>
+        <igx-column-group header="Address Information" [(collapsible)]="s" [expanded]="true">
+            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Country" [visibleWhenCollapsed]="false"></igx-column>
+            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Region" [visibleWhenCollapsed]="false"></igx-column>
+            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="City" [visibleWhenCollapsed]="false"></igx-column>
+            <igx-column [filterable]="true" [sortable]="true" [resizable]="true" field="Address" [visibleWhenCollapsed]="false"></igx-column>
+            <igx-column [filterable]="true" [editable]="true" [sortable]="true" [visibleWhenCollapsed]="true" field="FullAddress"></igx-column>
         </igx-column-group>
         <igx-column  field="Missing"></igx-column>
         <igx-column  field="Missing"></igx-column>

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

@@ -1,11 +1,25 @@
 import { Component, HostBinding, ViewChild } from '@angular/core';
-import { ColumnPinningPosition, GridSelectionMode, IgxButtonDirective, IgxButtonGroupComponent, IgxCollapsibleIndicatorTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxGridComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxIconComponent } from 'igniteui-angular';
+import { ColumnPinningPosition, GridSelectionMode, IgxButtonDirective, IgxButtonGroupComponent, IgxCollapsibleIndicatorTemplateDirective, IgxColumnComponent, IgxColumnGroupComponent, IgxGridComponent, IgxGridToolbarActionsComponent, IgxGridToolbarAdvancedFilteringComponent, IgxGridToolbarComponent, IgxGridToolbarHidingComponent, IgxGridToolbarPinningComponent, IgxIconComponent, IgxGridToolbarExporterComponent } from 'igniteui-angular';
 
 @Component({
     selector: 'app-grid-column-groups-sample',
     styleUrls: ['grid-column-groups.sample.scss'],
     templateUrl: 'grid-column-groups.sample.html',
-    imports: [IgxCollapsibleIndicatorTemplateDirective, IgxIconComponent, IgxGridComponent, IgxGridToolbarComponent, IgxGridToolbarActionsComponent, IgxGridToolbarPinningComponent, IgxGridToolbarHidingComponent, IgxGridToolbarAdvancedFilteringComponent, IgxColumnComponent, IgxColumnGroupComponent, IgxButtonDirective, IgxButtonGroupComponent]
+    imports: [
+        IgxCollapsibleIndicatorTemplateDirective,
+        IgxIconComponent,
+        IgxGridComponent,
+        IgxGridToolbarComponent,
+        IgxGridToolbarActionsComponent,
+        IgxGridToolbarPinningComponent,
+        IgxGridToolbarHidingComponent,
+        IgxGridToolbarAdvancedFilteringComponent,
+        IgxGridToolbarExporterComponent,
+        IgxColumnComponent,
+        IgxColumnGroupComponent,
+        IgxButtonDirective,
+        IgxButtonGroupComponent
+    ]
 })
 export class GridColumnGroupsSampleComponent {
     @HostBinding('style.--ig-size')