Portal.js
1.82 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require("react");
var _reactDom = _interopRequireDefault(require("react-dom"));
var _canUseDom = _interopRequireDefault(require("./Dom/canUseDom"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var Portal = (0, _react.forwardRef)(function (props, ref) {
var didUpdate = props.didUpdate,
getContainer = props.getContainer,
children = props.children;
var containerRef = (0, _react.useRef)(); // Ref return nothing, only for wrapper check exist
(0, _react.useImperativeHandle)(ref, function () {
return {};
}); // Create container in client side with sync to avoid useEffect not get ref
var initRef = (0, _react.useRef)(false);
if (!initRef.current && (0, _canUseDom.default)()) {
containerRef.current = getContainer();
initRef.current = true;
} // [Legacy] Used by `rc-trigger`
(0, _react.useEffect)(function () {
didUpdate === null || didUpdate === void 0 ? void 0 : didUpdate(props);
});
(0, _react.useEffect)(function () {
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 ? _reactDom.default.createPortal(children, containerRef.current) : null;
});
var _default = Portal;
exports.default = _default;