amis-rpc-design/node_modules/rc-util/es/Portal.js
2023-10-07 19:42:30 +08:00

44 lines
1.9 KiB
JavaScript

import { useRef, useEffect, forwardRef, useImperativeHandle } from 'react';
import ReactDOM from 'react-dom';
import canUseDom from "./Dom/canUseDom";
var Portal = /*#__PURE__*/forwardRef(function (props, ref) {
var didUpdate = props.didUpdate,
getContainer = props.getContainer,
children = props.children;
var parentRef = useRef();
var containerRef = useRef();
// Ref return nothing, only for wrapper check exist
useImperativeHandle(ref, function () {
return {};
});
// Create container in client side with sync to avoid useEffect not get ref
var initRef = useRef(false);
if (!initRef.current && canUseDom()) {
containerRef.current = getContainer();
parentRef.current = containerRef.current.parentNode;
initRef.current = true;
}
// [Legacy] Used by `rc-trigger`
useEffect(function () {
didUpdate === null || didUpdate === void 0 ? void 0 : didUpdate(props);
});
useEffect(function () {
// Restore container to original place
// React 18 StrictMode will unmount first and mount back for effect test:
// https://reactjs.org/blog/2022/03/29/react-v18.html#new-strict-mode-behaviors
if (containerRef.current.parentNode === null && parentRef.current !== null) {
parentRef.current.appendChild(containerRef.current);
}
return function () {
var _containerRef$current, _containerRef$current2;
// [Legacy] This should not be handle by Portal but parent PortalWrapper instead.
// Since some component use `Portal` directly, we have to keep the logic here.
(_containerRef$current = containerRef.current) === null || _containerRef$current === void 0 ? void 0 : (_containerRef$current2 = _containerRef$current.parentNode) === null || _containerRef$current2 === void 0 ? void 0 : _containerRef$current2.removeChild(containerRef.current);
};
}, []);
return containerRef.current ? /*#__PURE__*/ReactDOM.createPortal(children, containerRef.current) : null;
});
export default Portal;