fix(*): adjust header scroll position when focused el i scrolled in view #13547 (#13602)

Co-authored-by: Hristo <[email protected]>

Author: ddincheva

projects/igniteui-angular/src/lib/grids/headers/grid-header-row.component.html

@@ -1,4 +1,4 @@
-<div role="rowgroup" class="igx-grid-thead__wrapper" [style.width.px]="width"
+<div role="rowgroup" class="igx-grid-thead__wrapper" (scroll)="scroll($event)" [style.width.px]="width"
     [class.igx-grid__tr--mrl]="hasMRL">
 
     <!-- Column headers area -->

projects/igniteui-angular/src/lib/grids/headers/grid-header-row.component.ts

@@ -196,6 +196,13 @@ export class IgxGridHeaderRowComponent implements DoCheck {
         this.cdr.markForCheck();
     }
 
+    /**
+     * @hidden @internal
+     */
+    public scroll(event: Event) {
+        this.grid.preventHeaderScroll(event);
+    }
+
     public headerRowSelection(event: MouseEvent) {
         if (!this.grid.isMultiRowSelectionEnabled) {
             return;