Merge pull request #8250 from IgniteUI/simeonoff/fix-8023-9.1.x

refactor(grid): do not hide editing row on scroll

Author: Lipata

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

@@ -297,6 +297,16 @@ export class IgxToggleDirective implements IToggleView, OnInit, OnDestroy {
         return info ? info.closeAnimationPlayer : false;
     }
 
+    /**
+     * Returns the id of the overlay the content is rendered in.
+     * ```typescript
+     * this.myToggle.overlayId;
+     * ```
+     */
+    public get overlayId() {
+        return this._overlayId;
+    }
+
     /**
      * Repositions the toggle.
      * ```typescript

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

@@ -2893,6 +2893,8 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
         });
 
         this.overlayService.onOpened.pipe(destructor).subscribe((event) => {
+            const overlaySettings = this.overlayService.getOverlayById(event.id)?.settings;
+
             // do not hide the advanced filtering overlay on scroll
             if (this._advancedFilteringOverlayId === event.id) {
                 const instance = event.componentRef.instance as IgxAdvancedFilteringDialogComponent;
@@ -2903,8 +2905,12 @@ export class IgxGridBaseDirective extends DisplayDensityBase implements
                 return;
             }
 
-            if (this.overlayService.getOverlayById(event.id)?.settings?.outlet === this.outlet &&
-                this.overlayIDs.indexOf(event.id) < 0) {
+            // do not hide the overlay if it's attached to a row
+            if (this.rowEditingOverlay?.overlayId === event.id) {
+                return;
+            }
+
+            if (overlaySettings?.outlet === this.outlet && this.overlayIDs.indexOf(event.id) === -1) {
                 this.overlayIDs.push(event.id);
             }
         });

projects/igniteui-angular/src/lib/grids/grid.common.ts

@@ -1,4 +1,4 @@
-import { Directive } from '@angular/core';
+import { Directive } from '@angular/core';
 import { ConnectedPositioningStrategy } from '../services/public_api';
 import { VerticalAlignment, PositionSettings } from '../services/overlay/utilities';
 import { scaleInVerBottom, scaleInVerTop } from '../animations/main';