@atlaskit/portal/dist/esm/internal/components/internal-portal-new.js

A wrapper for rendering components in React portals.

import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import React, { Suspense, useState } from 'react';
import { createPortal } from 'react-dom';
import { ThemeProvider } from '@atlaskit/app-provider/theme-provider';
import { useColorMode } from '@atlaskit/app-provider/use-color-mode';
import { useIsInsideThemeProvider } from '@atlaskit/app-provider/use-is-inside-theme-provider';
import { useIsomorphicLayoutEffect } from '../hooks/use-isomorphic-layout-effect';
import { createAtlaskitPortal } from '../utils/create-atlaskit-portal';
import { createPortalParent } from '../utils/create-portal-parent';
export default function InternalPortalNew(props) {
  var zIndex = props.zIndex,
    children = props.children;
  var _useState = useState(null),
    _useState2 = _slicedToArray(_useState, 2),
    atlaskitPortal = _useState2[0],
    setAtlaskitPortal = _useState2[1];
  var colorMode = useColorMode();
  var isInsideThemeProvider = useIsInsideThemeProvider();
  useIsomorphicLayoutEffect(function () {
    var tempPortalContainer = createAtlaskitPortal(zIndex);
    setAtlaskitPortal(tempPortalContainer);
    var portalParent = createPortalParent();
    if (!tempPortalContainer || !portalParent) {
      return;
    }
    portalParent.appendChild(tempPortalContainer);
    return function () {
      if (tempPortalContainer) {
        portalParent.removeChild(tempPortalContainer);
      }
      setAtlaskitPortal(null);
    };
  }, [zIndex]);

  /**
   * We wrap portal children with a Suspense boundary because in React 18 concurrent,
   * if you suspend from _within_ a portal to a Suspense boundary _outside_ the portal,
   * our portal gets in an infinite loop of rendering.
   */
  var suspendedChildren = /*#__PURE__*/React.createElement(Suspense, {
    fallback: null
  }, isInsideThemeProvider ? /*#__PURE__*/React.createElement(ThemeProvider, {
    defaultColorMode: colorMode
  }, children) : children);
  return atlaskitPortal ? /*#__PURE__*/createPortal(suspendedChildren, atlaskitPortal) : null;
}