chore(*): Post-merge fixes

* Group area consolidation and fixes
* Some typings for grid outlets
* Prevented circular dep for the row directive from the services barrel file

Author: rkaraivanov

projects/igniteui-angular/src/lib/directives/notification/notifications.directive.ts

@@ -37,7 +37,7 @@ export abstract class IgxNotificationsDirective extends IgxToggleDirective
      *  `outlet` is an instance of `IgxOverlayOutletDirective` or an `ElementRef`.
      */
     @Input()
-    public outlet: IgxOverlayOutletDirective | ElementRef;
+    public outlet: IgxOverlayOutletDirective | ElementRef<HTMLElement>;
 
     /**
      * Enables/Disables the visibility of the element.

projects/igniteui-angular/src/lib/directives/toggle/toggle.directive.ts

@@ -511,7 +511,7 @@ export class IgxToggleActionDirective implements OnInit {
     selector: '[igxOverlayOutlet]'
 })
 export class IgxOverlayOutletDirective {
-    constructor(public element: ElementRef) { }
+    constructor(public element: ElementRef<HTMLElement>) { }
 
     /** @hidden */
     public get nativeElement() {

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

@@ -153,7 +153,7 @@ import { IgxGridHeaderRowComponent } from './headers/grid-header-row.component';
 import { RowType } from './common/row.interface';
 import { IgxGridRowComponent } from './grid/grid-row.component';
 import { IPageEventArgs } from '../paginator/paginator_interfaces';
-import { IgxGridGroupByAreaComponent } from './group-by-area/group-by-area.component';
+import { IgxGridGroupByAreaComponent } from './grouping/grid-group-by-area.component';
 
 let FAKE_ROW_ID = -1;
 

projects/igniteui-angular/src/lib/grids/group-by-area/group-by-area.component.html

@@ -37,15 +37,15 @@ export abstract class IgxGroupByAreaDirective {
     @Input()
     public density: DisplayDensity = DisplayDensity.comfortable;
 
-    @HostBinding('class.igx-grid__grouparea')
+    @HostBinding('class.igx-grid-grouparea')
     public defaultClass =  true;
 
-    @HostBinding('class.igx-grid__grouparea--cosy')
+    @HostBinding('class.igx-grid-grouparea--cosy')
     public get cosyStyle() {
         return this.density === 'cosy';
     }
 
-    @HostBinding('class.igx-grid__grouparea--compact')
+    @HostBinding('class.igx-grid-grouparea--compact')
     public get compactStyle() {
         return this.density === 'compact';
     }
@@ -102,7 +102,7 @@ export abstract class IgxGroupByAreaDirective {
 
 
     public get dropAreaVisible(): boolean {
-        return (this.grid.draggedColumn && this.grid.draggedColumn.groupable) ||
+        return (this.grid.columnInDrag && this.grid.columnInDrag.groupable) ||
             !this.expressions.length;
     }
 

projects/igniteui-angular/src/lib/grids/group-by-area/group-by-area.component.ts

@@ -19,7 +19,7 @@ import { IgxCheckboxComponent } from '../checkbox/checkbox.component';
 import { IgxGridForOfDirective } from '../directives/for-of/for_of.directive';
 import { GridBaseAPIService } from './api.service';
 import { IgxColumnComponent } from './columns/column.component';
-import { TransactionType } from '../services/public_api';
+import { TransactionType } from '../services/transaction/transaction';
 import { IgxGridBaseDirective } from './grid-base.directive';
 import { IgxGridSelectionService } from './selection/selection.service';
 import { IgxRow } from './common/crud.service';