import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["children", "className", "scrollable", "title", "form", "onSubmit", "tertiaryAction", "secondaryAction", "primaryAction", "leftAction", "onCloseClick"];
import React, { createRef } from 'react';
import omit from 'lodash.omit';
import cx from 'classnames';
import theme from './theme.css';
import { Button, ButtonGroup, DialogBase, Heading3 } from '../../index';
import { IconDragMediumFilled } from '@teamleader/ui-icons';

var Dialog = function Dialog(_ref) {
  var children = _ref.children,
      className = _ref.className,
      _ref$scrollable = _ref.scrollable,
      scrollable = _ref$scrollable === void 0 ? true : _ref$scrollable,
      title = _ref.title,
      form = _ref.form,
      onSubmit = _ref.onSubmit,
      tertiaryAction = _ref.tertiaryAction,
      secondaryAction = _ref.secondaryAction,
      primaryAction = _ref.primaryAction,
      leftAction = _ref.leftAction,
      onCloseClick = _ref.onCloseClick,
      otherProps = _objectWithoutProperties(_ref, _excluded);

  var bodyRef = /*#__PURE__*/createRef();
  var dragHandleRef = /*#__PURE__*/createRef();

  var getHeader = function getHeader() {
    var dragIcon = /*#__PURE__*/React.createElement("div", {
      className: theme['drag-icon'],
      ref: dragHandleRef
    }, /*#__PURE__*/React.createElement(IconDragMediumFilled, null));
    return /*#__PURE__*/React.createElement(DialogBase.Header, {
      icon: dragIcon,
      onCloseClick: onCloseClick
    }, /*#__PURE__*/React.createElement(Heading3, {
      maxLines: 1
    }, title));
  };

  var getFooter = function getFooter() {
    return /*#__PURE__*/React.createElement(DialogBase.Footer, {
      display: "flex",
      justifyContent: leftAction ? 'space-between' : 'flex-end'
    }, leftAction && /*#__PURE__*/React.createElement(Button, leftAction), /*#__PURE__*/React.createElement(ButtonGroup, {
      justifyContent: "flex-end"
    }, tertiaryAction && /*#__PURE__*/React.createElement(Button, _extends({}, tertiaryAction, {
      level: "link"
    })), secondaryAction && /*#__PURE__*/React.createElement(Button, secondaryAction), /*#__PURE__*/React.createElement(Button, _extends({
      level: "primary"
    }, primaryAction))));
  };

  var classNames = cx(theme['dialog'], className);
  var restProps = omit(otherProps, ['onCloseClick', 'primaryAction', 'secondaryAction', 'tertiaryAction', 'leftAction']);
  return /*#__PURE__*/React.createElement(DialogBase, _extends({
    className: classNames
  }, restProps, {
    scrollable: false,
    initialFocusRef: bodyRef,
    dragHandleRef: dragHandleRef,
    form: form,
    onSubmit: onSubmit
  }), title && getHeader(), /*#__PURE__*/React.createElement(DialogBase.Body, {
    ref: bodyRef,
    scrollable: scrollable
  }, children), getFooter());
};

export default Dialog;