@nex-ui/react/dist/esm/components/utils/portal/Portal.mjs

🎉 A beautiful, modern, and reliable React component library.

"use client";
import { createPortal } from 'react-dom';
import { useState, useEffect } from 'react';
import { useEvent } from '@nex-ui/hooks';
import { isFunction } from '@nex-ui/utils';

const Portal = (props)=>{
    const { children, container } = props;
    const [mountNode, setMountNode] = useState(null);
    const onMount = useEvent(()=>props.onMount?.());
    const onUnmount = useEvent(()=>props.onUnmount?.());
    useEffect(()=>{
        let node = container;
        if (isFunction(node)) {
            node = node();
        }
        setMountNode(node || document.body);
    }, [
        container
    ]);
    useEffect(()=>{
        if (mountNode) {
            onMount();
            return onUnmount;
        }
    }, [
        mountNode,
        onMount,
        onUnmount
    ]);
    return mountNode ? /*#__PURE__*/ createPortal(children, mountNode) : null;
};
Portal.displayName = 'Portal';

export { Portal };