enhancement(portal): add unstable_skipInitialRender (#902)

reach · Apr 20, 2022 · a8f38a4 · a8f38a4
1 parent 93a3f8d
commit a8f38a4
Showing 1 changed file with 11 additions and 0 deletions.
diff --git a/packages/portal/src/index.tsx b/packages/portal/src/index.tsx
@@ -26,6 +26,7 @@ const Portal: React.FC<PortalProps> = ({
   children,
   type = "reach-portal",
   containerRef,
+  unstable_skipInitialRender,
 }) => {
   let mountNode = React.useRef<HTMLDivElement | null>(null);
   let portalNode = React.useRef<HTMLElement | null>(null);
@@ -72,6 +73,15 @@ const Portal: React.FC<PortalProps> = ({
     };
   }, [type, forceUpdate, containerRef]);
 
+  let [hydrated, setHydrated] = React.useState(false);
+  React.useEffect(() => {
+    setHydrated(true);
+  }, []);
+
+  if (unstable_skipInitialRender && !hydrated) {
+    return;
+  }
+
   return portalNode.current ? (
     createPortal(children, portalNode.current)
   ) : (
@@ -103,6 +113,7 @@ type PortalProps = {
    * @see Docs https://reach.tech/portal#portal-containerRef
    */
   containerRef?: React.RefObject<Node>;
+  unstable_skipInitialRender?: boolean;
 };
 
 if (__DEV__) {