import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
var _excluded = ["children", "inline", "onClose", "primaryAction", "secondaryAction", "showIcon", "status", "title"];
import React from 'react';
import { IconBellMediumOutline, IconCheckmarkBadgedMediumFilled, IconCloseMediumOutline, IconWarningBadgedMediumFilled } from '@teamleader/ui-icons';
import Box from '../box';
import Button from '../button';
import ButtonGroup from '../buttonGroup';
import Icon from '../icon';
import { IconButton } from '../iconButton';
import { Heading3 } from '../typography';
var iconColorMap = {
  error: 'neutral',
  info: 'neutral',
  success: 'neutral',
  warning: 'gold'
};
var iconTintMap = {
  error: 'lightest',
  info: 'darkest',
  success: 'lightest',
  warning: 'dark'
};
var backgroundColorMap = {
  error: 'ruby',
  info: 'neutral',
  success: 'mint',
  warning: 'gold'
};
var backgroundTintMap = {
  error: 'normal',
  info: 'normal',
  success: 'light',
  warning: 'light'
};
var iconMap = {
  error: IconWarningBadgedMediumFilled,
  info: IconBellMediumOutline,
  success: IconCheckmarkBadgedMediumFilled,
  warning: IconWarningBadgedMediumFilled
};

var Message = function Message(_ref) {
  var children = _ref.children,
      inline = _ref.inline,
      onClose = _ref.onClose,
      primaryAction = _ref.primaryAction,
      secondaryAction = _ref.secondaryAction,
      showIcon = _ref.showIcon,
      _ref$status = _ref.status,
      status = _ref$status === void 0 ? 'info' : _ref$status,
      title = _ref.title,
      others = _objectWithoutProperties(_ref, _excluded);

  var hasActions = Boolean(primaryAction || secondaryAction);
  var IconToRender = iconMap[status];
  return /*#__PURE__*/React.createElement(Box, _extends({}, others, {
    display: inline ? 'inline-flex' : 'flex'
  }), status && /*#__PURE__*/React.createElement(Box, {
    backgroundColor: backgroundColorMap[status],
    backgroundTint: backgroundTintMap[status],
    borderBottomLeftRadius: "rounded",
    borderTopLeftRadius: "rounded",
    paddingHorizontal: showIcon ? 2 : 1,
    paddingVertical: 4
  }, showIcon && /*#__PURE__*/React.createElement(Icon, {
    color: iconColorMap[status],
    tint: iconTintMap[status]
  }, /*#__PURE__*/React.createElement(IconToRender, null))), /*#__PURE__*/React.createElement(Box, {
    backgroundColor: "neutral",
    backgroundTint: "lightest",
    borderColor: "neutral",
    borderTint: "normal",
    borderLeftWidth: status ? 0 : 1,
    borderTopWidth: 1,
    borderRightWidth: 1,
    borderBottomWidth: 1,
    borderBottomRightRadius: "rounded",
    borderTopRightRadius: "rounded",
    borderBottomLeftRadius: status ? 'square' : 'rounded',
    borderTopLeftRadius: status ? 'square' : 'rounded',
    flex: 1,
    display: "flex"
  }, /*#__PURE__*/React.createElement(Box, {
    flex: 1,
    paddingLeft: status ? 3 : 4,
    paddingRight: 4,
    paddingVertical: 4
  }, title && /*#__PURE__*/React.createElement(Heading3, {
    color: "teal",
    marginBottom: 2
  }, title), children, hasActions && /*#__PURE__*/React.createElement(ButtonGroup, {
    display: "flex",
    justifyContent: "flex-end",
    marginTop: 4
  }, secondaryAction && /*#__PURE__*/React.createElement(Button, _extends({
    level: "link",
    size: "small"
  }, secondaryAction)), primaryAction && /*#__PURE__*/React.createElement(Button, _extends({
    size: "small"
  }, primaryAction)))), onClose && /*#__PURE__*/React.createElement(Box, {
    paddingVertical: 4,
    paddingRight: 3
  }, /*#__PURE__*/React.createElement(IconButton, {
    icon: /*#__PURE__*/React.createElement(IconCloseMediumOutline, null),
    marginLeft: -2,
    marginTop: -1,
    onClick: onClose
  }))));
};

export default Message;