import _extends from "@babel/runtime/helpers/extends";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["className", "children", "trigger", "placement", "textAlign", "arrow"];

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

import React from "react";
import PropTypes from "prop-types";
import cx from "classnames";
import { Root, Trigger, Content, Arrow } from "@radix-ui/react-dropdown-menu";
import createComponent from "../../system/createComponent";
import getClasses from "./styles";
var Menu = /*#__PURE__*/React.forwardRef(function (props, ref) {
  var className = props.className,
      children = props.children,
      trigger = props.trigger,
      placement = props.placement,
      textAlign = props.textAlign,
      arrow = props.arrow,
      restProps = _objectWithoutProperties(props, _excluded);

  var _placement$split = placement.split("-"),
      _placement$split2 = _slicedToArray(_placement$split, 2),
      side = _placement$split2[0],
      align = _placement$split2[1];

  var classes = getClasses();
  return /*#__PURE__*/React.createElement(Root, {
    modal: false
  }, /*#__PURE__*/React.createElement(Trigger, {
    asChild: true
  }, trigger), /*#__PURE__*/React.createElement(Content, _extends({
    ref: ref,
    side: side,
    align: align
  }, !arrow && {
    sideOffset: 8
  }, {
    className: cx(classes.content, className)
  }, restProps), arrow && /*#__PURE__*/React.createElement(Arrow, {
    height: 10,
    width: 20,
    className: classes.arrow
  }), textAlign ? React.Children.map(children, function (child) {
    return /*#__PURE__*/React.cloneElement(child, _objectSpread({
      textAlign: textAlign
    }, child.props));
  }) : children));
});
Menu.propTypes = {
  className: PropTypes.string,
  trigger: PropTypes.element.isRequired,
  placement: PropTypes.oneOf(["top-start", "top-center", "top-end", "bottom-start", "bottom-center", "bottom-end", "left-start", "left-center", "left-end", "right-start", "right-center", "right-end"]),
  textAlign: PropTypes.oneOf(["left", "center", "right"]),
  arrow: PropTypes.bool
};
Menu.defaultProps = {
  placement: "bottom-center",
  arrow: false
};

if (process.env.NODE_ENV !== "production") {
  Menu.displayName = "Menu";
}

export default createComponent(Menu);