import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
//  strict
import PropTypes from 'prop-types';
import React from 'react';
import styled, { css } from 'styled-components';
import injectE2E from '../../Tools/injectE2E';
import { theme } from '../../Tools/interpolation';
import { FasCheckCircle, FasExclamationCircle, FasTimes } from '../../Atoms/Icons';
var PADDING = '1.025rem';
var Wrapper =
/*#__PURE__*/
styled.div.attrs(injectE2E).withConfig({
  componentId: "w76f97-0"
})(["\n  display: inline-flex;\n  padding: ", ";\n  font-family: ", ";\n  background-color: ", ";\n  border-radius: ", ";\n  color: ", ";\n  box-shadow: rgba(67, 90, 111, 0.416) 0 0 1px,\n    rgba(67, 90, 111, 0.3) 0 8px 10px -4px;\n  min-width: 250px;\n  max-width: 560px;\n"], PADDING, theme('fontPrimary'), theme('toastBackgroundColor'), theme('toastBorderRadius'), theme('toastTextColor'));
var Content =
/*#__PURE__*/
styled.div.withConfig({
  componentId: "w76f97-1"
})(["\n  display: flex;\n  flex: 1 1 0%;\n  flex-direction: column;\n"]);
var Title =
/*#__PURE__*/
styled.div.withConfig({
  componentId: "w76f97-2"
})(["\n  display: flex;\n  font-weight: 600;\n"]);
var Description =
/*#__PURE__*/
styled.div.withConfig({
  componentId: "w76f97-3"
})(["\n  display: flex;\n  padding-top: 0.325rem;\n"]);
var Close =
/*#__PURE__*/
styled.div.withConfig({
  componentId: "w76f97-4"
})(["\n  padding-left: ", ";\n"], PADDING);
var IndicatorCss =
/*#__PURE__*/
css(["\n  margin-right: ", ";\n  margin-top: 2px;\n"], PADDING);
var IndicatorSuccess =
/*#__PURE__*/
styled(FasCheckCircle).withConfig({
  componentId: "w76f97-5"
})(["\n  ", ";\n  fill: ", ";\n\n  &:hover {\n    fill: ", ";\n  }\n"], IndicatorCss, theme('successColor'), theme('successColor'));
var IndicatorWarning =
/*#__PURE__*/
styled(FasExclamationCircle).withConfig({
  componentId: "w76f97-6"
})(["\n  ", ";\n  fill: ", ";\n\n  &:hover {\n    fill: ", ";\n  }\n"], IndicatorCss, theme('warningColor'), theme('warningColor'));
var IndicatorDanger =
/*#__PURE__*/
styled(IndicatorWarning).withConfig({
  componentId: "w76f97-7"
})(["\n  ", ";\n  fill: ", ";\n\n  &:hover {\n    fill: ", ";\n  }\n"], IndicatorCss, theme('dangerColor'), theme('dangerColor'));

var Toast = function Toast(_ref) {
  var description = _ref.description,
      onClose = _ref.onClose,
      title = _ref.title,
      type = _ref.type,
      rest = _objectWithoutProperties(_ref, ["description", "onClose", "title", "type"]);

  return React.createElement(Wrapper, rest, type === 'success' && React.createElement(IndicatorSuccess, {
    size: "16px"
  }), type === 'warning' && React.createElement(IndicatorWarning, {
    size: "16px"
  }), type === 'danger' && React.createElement(IndicatorDanger, {
    size: "16px"
  }), React.createElement(Content, null, React.createElement(Title, null, title), description != null && React.createElement(Description, null, description)), React.createElement(Close, null, React.createElement(FasTimes, {
    onClick: onClose,
    selectable: true,
    size: "16px"
  })));
};

Toast.propTypes = process.env.NODE_ENV !== "production" ? {
  description: PropTypes.string,
  e2e: PropTypes.string,
  onClose: PropTypes.func,
  title: PropTypes.string.isRequired,
  type: PropTypes.oneOf(['default', 'danger', 'success', 'warning'])
} : {};
Toast.defaultProps = {
  e2e: 'defaultToast',
  type: 'default'
};
export default Toast;