From 53655339e40f012ea3c0ba8a6665b1fa48d08877 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Yi=C4=9Fit=20FINDIKLI?= <yigitfindikli@gmail.com>
Date: Mon, 25 Oct 2021 21:15:39 +0300
Subject: [PATCH] Fixed #10775 - Dynamic Dialog | BlockUI | Modal layer
 enter-leave transition

---
 src/app/components/dynamicdialog/dynamicdialog.ts | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/app/components/dynamicdialog/dynamicdialog.ts b/src/app/components/dynamicdialog/dynamicdialog.ts
index b8c0c2426d1..70f29fa249d 100755
--- a/src/app/components/dynamicdialog/dynamicdialog.ts
+++ b/src/app/components/dynamicdialog/dynamicdialog.ts
@@ -20,7 +20,7 @@ const hideAnimation = animation([
 @Component({
 	selector: 'p-dynamicDialog',
 	template: `
-        <div #mask [ngClass]="{'p-dialog-mask':true, 'p-component-overlay p-dialog-mask-scrollblocker': config.modal !== false}">
+        <div #mask [ngClass]="{'p-dialog-mask':true, 'p-component-overlay-enter p-dialog-mask-scrollblocker': config.modal !== false}">
             <div [ngClass]="{'p-dialog p-dynamic-dialog p-component':true, 'p-dialog-rtl': config.rtl}" [ngStyle]="config.style" [class]="config.styleClass"
                 [@animation]="{value: 'visible', params: {transform: transformOptions, transition: config.transitionOptions || '150ms cubic-bezier(0, 0, 0.2, 1)'}}"
                 (@animation.start)="onAnimationStart($event)" (@animation.done)="onAnimationEnd($event)" role="dialog" *ngIf="visible"
@@ -124,13 +124,16 @@ export class DynamicDialogComponent implements AfterViewInit, OnDestroy {
 			break;
 
 			case 'void':
-				this.onContainerDestroy();
+                if (this.config.modal !== false) {
+                    DomHandler.addClass(this.wrapper, 'p-component-overlay-leave');
+                }
 			break;
 		}
 	}
 
 	onAnimationEnd(event: AnimationEvent) {
 		if (event.toState === 'void') {
+            this.onContainerDestroy();
 			this.dialogRef.destroy();
 		}
 	}