chore(*): Minor navigation related fixes.

Author: MKirova

projects/igniteui-angular/src/lib/grids/pivot-grid/pivot-grid-navigation.service.ts

@@ -38,14 +38,15 @@ export class IgxPivotGridNavigationService extends IgxGridNavigationService {
             if ((key.includes('right') || key === 'end') && this.activeNode.column < this.lastRowDimensionsIndex) {
                 newActiveNode.column = ctrl || key === 'end' ? this.lastRowDimensionsIndex : this.activeNode.column + 1;
             }
+            const verticalContainer = this.grid.verticalRowDimScrollContainers.toArray()[newActiveNode.column];
             if ((key.includes('up')) && this.activeNode.row > 0) {
                 newActiveNode.row = ctrl ? 0 : this.activeNode.row - 1;
             }
             if ((key.includes('down')) && this.activeNode.row < this.findLastDataRowIndex()) {
                 newActiveNode.row = ctrl ? this.findLastDataRowIndex() : this.activeNode.row + 1;
             }
             this.setActiveNode(newActiveNode);
-            this.grid.navigateTo(newActiveNode.row);
+            verticalContainer.scrollTo(newActiveNode.row);
         } else {
             super.handleNavigation(event);
         }

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

@@ -19,7 +19,7 @@
 </igx-pivot-header-row>
 
 <div igxGridBody (keydown.control.c)="copyHandler($event)" (copy)="copyHandler($event)" class="igx-grid__tbody" role="rowgroup">
-    <div *ngFor='let dim of rowDimensions' #rowDimensionContainer role="rowgroup" class='igx-grid__tbody-pivot-dimension'>
+    <div tabindex="0" *ngFor='let dim of rowDimensions' #rowDimensionContainer role="rowgroup" class='igx-grid__tbody-pivot-dimension' (focus)="navigation.focusTbody($event)" (keydown)="navigation.handleNavigation($event)">
         <ng-template igxGridFor let-rowData [igxGridForOf]="dataView
         | pivotGridCellMerging:pivotConfiguration:dim:pivotKeys:pipeTrigger"
             let-rowIndex="index" [igxForScrollOrientation]="'vertical'" [igxForScrollContainer]='verticalScroll'

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

@@ -13,8 +13,8 @@
 
 <ng-template #headerTemplate let-column>
     <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel(column)}}'
-        (pointerdown)="selectPivotRow(column, $event)">
-        <igx-icon [attr.draggable]=" false" (pointerdown)="grid.toggleRow(getRowDimensionKey(column))">
+        (click)="selectPivotRow(column, $event)">
+        <igx-icon [attr.draggable]=" false" (click)="grid.toggleRow(getRowDimensionKey(column))">
             {{ getExpandState(column) ? 'expand_more' : 'chevron_right'}}</igx-icon>
         {{column.header}}
     </div>
@@ -23,7 +23,7 @@
 <ng-template #headerDefaultTemplate let-column>
 
     <div class='igx-grid__tr--header igx-grid__row-indentation--level-{{getLevel(column)}}'
-        (pointerdown)="selectPivotRow(column, $event)">
+        (click)="selectPivotRow(column, $event)">
         <igx-icon style='flex-shrink: 0;' [attr.draggable]=" false">
         </igx-icon>
         {{column.header}}