diff --git a/src/app/components/api/overlayoptions.ts b/src/app/components/api/overlayoptions.ts index 8e0dbcda604..476666bd8d6 100644 --- a/src/app/components/api/overlayoptions.ts +++ b/src/app/components/api/overlayoptions.ts @@ -24,6 +24,10 @@ export interface OverlayOnShowEvent { mode?: OverlayModeType; } +export interface OverlayOnBeforeShowEvent extends OverlayOnShowEvent {} + +export interface OverlayOnBeforeHideEvent extends OverlayOnBeforeShowEvent {} + export interface OverlayOnHideEvent extends OverlayOnShowEvent {} export interface OverlayOptions { @@ -39,7 +43,9 @@ export interface OverlayOptions { hideTransitionOptions?: string; listener?: (event: Event, options?: OverlayListenerOptions) => boolean | void; responsive?: ResponsiveOverlayOptions | undefined; + onBeforeShow?: (event?: OverlayOnBeforeShowEvent) => void; onShow?: (event?: OverlayOnShowEvent) => void; + onBeforeHide?: (event?: OverlayOnBeforeHideEvent) => void; onHide?: (event?: OverlayOnHideEvent) => void; onAnimationStart?: (event?: AnimationEvent) => void; onAnimationDone?: (event?: AnimationEvent) => void; diff --git a/src/app/components/overlay/overlay.ts b/src/app/components/overlay/overlay.ts index 98157581b76..89acf31f30c 100644 --- a/src/app/components/overlay/overlay.ts +++ b/src/app/components/overlay/overlay.ts @@ -156,8 +156,12 @@ export class Overlay implements OnDestroy { this._options = val; } + @Output() onBeforeShow: EventEmitter = new EventEmitter(); + @Output() onShow: EventEmitter = new EventEmitter(); + @Output() onBeforeHide: EventEmitter = new EventEmitter(); + @Output() onHide: EventEmitter = new EventEmitter(); @Output() onAnimationStart: EventEmitter = new EventEmitter(); @@ -277,6 +281,8 @@ export class Overlay implements OnDestroy { onOverlayContentAnimationStart(event: AnimationEvent) { switch (event.toState) { case 'visible': + this.handleEvents('onBeforeShow', { overlay: this.overlayEl, target: this.targetEl, mode: this.overlayMode }); + if (this.autoZIndex) { ZIndexUtils.set(this.overlayMode, this.overlayEl, this.baseZIndex + this.config?.zIndex[this.overlayMode]); } @@ -288,6 +294,8 @@ export class Overlay implements OnDestroy { break; case 'void': + this.handleEvents('onBeforeHide', { overlay: this.overlayEl, target: this.targetEl, mode: this.overlayMode }); + DomHandler.appendOverlay(this.overlayEl, this.targetEl, this.appendTo); this.modal && DomHandler.addClass(this.overlayEl, 'p-component-overlay-leave'); this.unbindListeners();