@twilio-paste/paste-reakit-fork/lib/Portal/Portal.js

Forked Reakit that addresses SSR hydration issues

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var React = require('react');
var canUseDOM = require('reakit-utils/canUseDOM');
var ReactDOM = require('react-dom');

function getBodyElement() {
  return canUseDOM.canUseDOM ? document.body : null;
}

var PortalContext = /*#__PURE__*/React.createContext(getBodyElement());
function Portal(_ref) {
  var children = _ref.children;
  // if it's a nested portal, context is the parent portal
  // otherwise it's document.body
  // https://github.com/reakit/reakit/issues/513
  var context = React.useContext(PortalContext) || getBodyElement();

  var _React$useState = React.useState(null),
      hostNode = _React$useState[0],
      setHostNode = _React$useState[1];

  React.useEffect(function () {
    if (!context) return undefined;
    var element = document.createElement("div");
    element.className = Portal.__className;
    setHostNode(element);
    context.appendChild(element);
    return function () {
      context.removeChild(element);
    };
  }, [context]);

  if (hostNode) {
    return /*#__PURE__*/ReactDOM.createPortal( /*#__PURE__*/React.createElement(PortalContext.Provider, {
      value: hostNode
    }, children), hostNode);
  } // ssr


  return null;
}
Portal.__className = "__reakit-portal";
Portal.__selector = "." + Portal.__className;

exports.Portal = Portal;
exports.PortalContext = PortalContext;