var _excluded = ["width", "title", "theme", "visible", "message", "className", "messageAlign", "closeOnClickOverlay", "onClickCloseIcon"];

function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }

import React, { useContext } from 'react';
import clsx from 'clsx';
import Popup from '../popup';
import Button from '../button';
import ActionBar from '../action-bar';
import { addUnit, noop } from '../utils';
import { BORDER_TOP, BORDER_LEFT } from '../utils/constant';
import ConfigProviderContext from '../config-provider/ConfigProviderContext';

var Dialog = function Dialog(props) {
  var _useContext = useContext(ConfigProviderContext),
      prefixCls = _useContext.prefixCls,
      createNamespace = _useContext.createNamespace,
      locale = _useContext.locale;

  var _createNamespace = createNamespace('dialog', prefixCls),
      bem = _createNamespace[0];

  var width = props.width,
      title = props.title,
      theme = props.theme,
      visible = props.visible,
      message = props.message,
      className = props.className,
      messageAlign = props.messageAlign,
      closeOnClickOverlay = props.closeOnClickOverlay,
      onClickCloseIcon = props.onClickCloseIcon,
      others = _objectWithoutPropertiesLoose(props, _excluded);

  var renderTitle = function renderTitle() {
    if (props.title) {
      return /*#__PURE__*/React.createElement("div", {
        className: clsx(bem('header', {
          isolated: !props.message && !props.children
        }))
      }, title);
    }

    return null;
  };

  var renderContent = function renderContent() {
    if (props.children) {
      return /*#__PURE__*/React.createElement("div", {
        className: clsx(bem('content'))
      }, props.children);
    }

    if (message) {
      var _bem;

      return /*#__PURE__*/React.createElement("div", {
        className: clsx(bem('content', {
          isolated: !title
        }))
      }, /*#__PURE__*/React.createElement("div", {
        className: clsx(bem('message', (_bem = {
          'has-title': title
        }, _bem[messageAlign] = messageAlign, _bem)))
      }, message));
    }

    return null;
  };

  var renderButtons = function renderButtons() {
    var _props$cancelProps, _props$cancelProps2, _props$cancelProps3, _clsx, _props$confirmProps, _props$confirmProps2, _props$confirmProps3;

    return /*#__PURE__*/React.createElement("div", {
      className: clsx(BORDER_TOP, bem('footer'))
    }, props.showCancelButton && /*#__PURE__*/React.createElement(Button, {
      size: "large",
      text: props.cancelButtonText || locale.cancel,
      className: clsx(bem('cancel')),
      style: {
        color: props.cancelButtonColor
      },
      loading: (_props$cancelProps = props.cancelProps) == null ? void 0 : _props$cancelProps.loading,
      disabled: (_props$cancelProps2 = props.cancelProps) == null ? void 0 : _props$cancelProps2.disabled,
      onClick: (_props$cancelProps3 = props.cancelProps) != null && _props$cancelProps3.loading ? noop : props.onCancel
    }), props.showConfirmButton && /*#__PURE__*/React.createElement(Button, {
      size: "large",
      text: props.confirmButtonText || locale.confirm,
      className: clsx(bem('confirm'), (_clsx = {}, _clsx[BORDER_LEFT] = props.showCancelButton, _clsx)),
      round: theme === 'round-button',
      style: {
        color: props.confirmButtonColor
      },
      loading: (_props$confirmProps = props.confirmProps) == null ? void 0 : _props$confirmProps.loading,
      disabled: (_props$confirmProps2 = props.confirmProps) == null ? void 0 : _props$confirmProps2.disabled,
      onClick: (_props$confirmProps3 = props.confirmProps) != null && _props$confirmProps3.loading ? noop : props.onConfirm
    }));
  };

  var renderRoundButtons = function renderRoundButtons() {
    var _props$cancelProps4, _props$cancelProps5, _props$cancelProps6, _props$confirmProps4, _props$confirmProps5, _props$confirmProps6;

    return /*#__PURE__*/React.createElement(ActionBar, {
      className: clsx(bem('footer'))
    }, props.showCancelButton && /*#__PURE__*/React.createElement(ActionBar.Button, {
      type: "warning",
      text: props.cancelButtonText || locale.cancel,
      className: clsx(bem('cancel')),
      color: props.cancelButtonColor,
      loading: (_props$cancelProps4 = props.cancelProps) == null ? void 0 : _props$cancelProps4.loading,
      disabled: (_props$cancelProps5 = props.cancelProps) == null ? void 0 : _props$cancelProps5.disabled,
      onClick: (_props$cancelProps6 = props.cancelProps) != null && _props$cancelProps6.loading ? noop : props.onCancel
    }), props.showConfirmButton && /*#__PURE__*/React.createElement(ActionBar.Button, {
      type: "danger",
      text: props.confirmButtonText || locale.confirm,
      className: clsx(bem('confirm')),
      color: props.confirmButtonColor,
      loading: (_props$confirmProps4 = props.confirmProps) == null ? void 0 : _props$confirmProps4.loading,
      disabled: (_props$confirmProps5 = props.confirmProps) == null ? void 0 : _props$confirmProps5.disabled,
      onClick: (_props$confirmProps6 = props.confirmProps) != null && _props$confirmProps6.loading ? noop : props.onConfirm
    }));
  };

  var renderFooter = function renderFooter() {
    if (props.footer) return props.footer;
    return props.theme === 'round-button' ? renderRoundButtons() : renderButtons();
  };

  return /*#__PURE__*/React.createElement(Popup, _extends({}, others, {
    visible: visible,
    className: clsx(bem([theme]), className),
    style: {
      width: addUnit(width)
    },
    "aria-labelledby": title || message,
    closeOnClickOverlay: closeOnClickOverlay,
    onClickCloseIcon: onClickCloseIcon,
    onClose: props.onClose,
    onClosed: props.onClosed
  }), renderTitle(), renderContent(), renderFooter());
};

Dialog.defaultProps = {
  transition: 'rv-dialog-bounce',
  showConfirmButton: true,
  closeOnPopstate: true
};
export default Dialog;