"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _reactDom = _interopRequireDefault(require("react-dom"));
var _react = require("react");
var _use_portal_container = require("./use_portal_container.hook");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/*
 * Copyright OpenSearch Contributors
 * SPDX-License-Identifier: Apache-2.0
 */

// created portal so Context menu can render over other nodes.
// Only Z index not working
const Portal = ({
  position,
  children
}) => {
  // Create a container element for testing purposes
  const containerElRef = (0, _react.useRef)(null);
  if (!containerElRef.current) {
    containerElRef.current = document.createElement('div');
  }

  // Use the container element with the hook
  const portalContainer = (0, _use_portal_container.usePortalContainer)(position, containerElRef.current);

  // Pass in menu items from here
  // Can later modify to maybe pass in a prop from Celestial Node
  // to detect what kind of menu is needed and change accordingly
  return /*#__PURE__*/_reactDom.default.createPortal(children, portalContainer);
};

// eslint-disable-next-line import/no-default-export
var _default = exports.default = Portal;
module.exports = exports.default;