diff --git a/components/lib/blockui/BlockUI.js b/components/lib/blockui/BlockUI.js index 3017dc1c07..91c2c38e69 100644 --- a/components/lib/blockui/BlockUI.js +++ b/components/lib/blockui/BlockUI.js @@ -28,26 +28,31 @@ export const BlockUI = React.forwardRef((inProps, ref) => { }; const unblock = () => { - const callback = () => { - setVisibleState(false); + if (!maskRef.current) { + removeMask(); - if (props.fullScreen) { - DomHandler.unblockBodyScroll(); - activeElementRef.current && activeElementRef.current.focus(); - } - - props.onUnblocked && props.onUnblocked(); - }; + return; + } - if (maskRef.current) { - DomHandler.addClass(maskRef.current, 'p-component-overlay-leave'); + if (!isUnstyled && DomHandler.hasCSSAnimation(maskRef.current)) { maskRef.current.addEventListener('animationend', () => { ZIndexUtils.clear(maskRef.current); - callback(); + removeMask(); }); } else { - callback(); + removeMask(); + } + }; + + const removeMask = () => { + setVisibleState(false); + + if (props.fullScreen) { + DomHandler.unblockBodyScroll(); + activeElementRef.current && activeElementRef.current.focus(); } + + props.onUnblocked && props.onUnblocked(); }; const onPortalMounted = () => { diff --git a/components/lib/utils/DomHandler.js b/components/lib/utils/DomHandler.js index e26e14ffdd..b50473cb62 100644 --- a/components/lib/utils/DomHandler.js +++ b/components/lib/utils/DomHandler.js @@ -1214,4 +1214,26 @@ export default class DomHandler { // Seem the same return true; } + + static hasCSSAnimation(element) { + if (element) { + const style = getComputedStyle(element); + const animationDuration = parseFloat(style.getPropertyValue('animation-duration') || '0'); + + return animationDuration > 0; + } + + return false; + } + + static hasCSSTransition(element) { + if (element) { + const style = getComputedStyle(element); + const transitionDuration = parseFloat(style.getPropertyValue('transition-duration') || '0'); + + return transitionDuration > 0; + } + + return false; + } }