import _extends from "@babel/runtime/helpers/extends";
// Copyright 1999-2019. Plesk International GmbH. All rights reserved.
import React, { isValidElement, cloneElement, createContext, useContext } from 'react';
import { createPortal } from 'react-dom';
import classNames from 'classnames';
import { CLS_PREFIX } from '../../constants';
const LevelContext = /*#__PURE__*/createContext(0);
export const PortalContext = /*#__PURE__*/createContext(undefined);

/**
 * `Layer` component.
 */
const Layer = ({
  baseClassName = "".concat(CLS_PREFIX, "layer"),
  className,
  children,
  innerRef,
  level = 0,
  ...props
}) => {
  const parentLevel = useContext(LevelContext);
  const container = useContext(PortalContext) || document.body;

  const renderChildren = () => {
    if ( /*#__PURE__*/isValidElement(children)) {
      return /*#__PURE__*/cloneElement(children, {
        style: { ...children.props.style,
          zIndex: parentLevel + level
        }
      });
    }

    return children;
  };

  return /*#__PURE__*/createPortal( /*#__PURE__*/React.createElement(LevelContext.Provider, {
    value: parentLevel + level
  }, /*#__PURE__*/React.createElement("div", _extends({
    className: classNames(baseClassName, className),
    ref: innerRef
  }, props), renderChildren())), container);
};

export default Layer;