rsuite 5.15.2 → 5.16.2

package/esm/utils/usePortal.js

@@ -1,6 +1,25 @@
-import { useRef, useEffect, useCallback } from 'react';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { useRef, useEffect, useState, useCallback } from 'react';
 import { createPortal } from 'react-dom';
 import canUseDOM from 'dom-lib/canUseDOM';
+var MountedPortal = /*#__PURE__*/React.memo(function (_ref) {
+  var children = _ref.children,
+      container = _ref.container;
+
+  var _useState = useState(false),
+      mounted = _useState[0],
+      setMounted = _useState[1];
+
+  useEffect(function () {
+    return setMounted(true);
+  }, []);
+
+  if (container && mounted) {
+    return /*#__PURE__*/createPortal(children, container);
+  }
+
+  return null;
+});
 
 function usePortal(props) {
   if (props === void 0) {
@@ -8,25 +27,28 @@ function usePortal(props) {
   }
 
   var _props = props,
-      id = _props.id,
-      container = _props.container;
+      container = _props.container,
+      _props$waitMount = _props.waitMount,
+      waitMount = _props$waitMount === void 0 ? false : _props$waitMount;
   var rootElemRef = useRef(canUseDOM ? document.body : null);
   useEffect(function () {
-    var containerElement = typeof container === 'function' ? container() : container; // Look for existing target dom element to append to
-
-    var existingParent = id && document.querySelector("#" + id); // Parent is either a new root or the existing dom element
+    var containerElement = typeof container === 'function' ? container() : container; // Parent is either a new root or the existing dom element
 
-    var parentElement = containerElement || existingParent || document.body;
+    var parentElement = containerElement || document.body;
     rootElemRef.current = parentElement;
-  }, [rootElemRef, container, id]);
-  var Portal = useCallback(function (_ref) {
-    var children = _ref.children;
-    if (rootElemRef.current != null) return /*#__PURE__*/createPortal(children, rootElemRef.current);
-    return null;
-  }, [rootElemRef]);
+  }, [rootElemRef, container]);
+  var Portal = useCallback(function (_ref2) {
+    var children = _ref2.children;
+    return rootElemRef.current != null ? /*#__PURE__*/createPortal(children, rootElemRef.current) : null;
+  }, []);
+  var WaitMountPortal = useCallback(function (props) {
+    return /*#__PURE__*/React.createElement(MountedPortal, _extends({
+      container: rootElemRef.current
+    }, props));
+  }, []);
   return {
     target: rootElemRef.current,
-    Portal: Portal
+    Portal: waitMount ? WaitMountPortal : Portal
   };
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rsuite",
-  "version": "5.15.2",
+  "version": "5.16.2",
   "description": "A suite of react components",
   "main": "cjs/index.js",
   "module": "esm/index.js",
@@ -38,7 +38,7 @@
     "prop-types": "^15.7.2",
     "react-virtualized": "^9.22.3",
     "rsuite-table": "^5.6.0",
-    "schema-typed": "^2.0.2"
+    "schema-typed": "^2.0.3"
   },
   "peerDependencies": {
     "react": ">=16.8.0",