Fixed #10775 - Dynamic Dialog | BlockUI | Modal layer enter-leave tra…

…nsition

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();
 		}
 	}