"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.Toast = void 0;

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

var _react = _interopRequireDefault(require("react"));

var _reactToastNotifications = require("react-toast-notifications");

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _templateObject, _templateObject2;

var Toast = function Toast(_ref) {
  var children = _ref.children,
      props = (0, _objectWithoutPropertiesLoose2["default"])(_ref, ["children"]);
  return /*#__PURE__*/_react["default"].createElement(StyledToast, props, /*#__PURE__*/_react["default"].createElement(Content, null, children));
};

exports.Toast = Toast;
var StyledToast = (0, _styledComponents["default"])(_reactToastNotifications.DefaultToast)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  background-color: ", " !important;\n  border-radius: 0.8rem !important;\n  color: ", " !important;\n\n  .react-toast-notifications__toast__icon-wrapper {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    background-color: unset;\n    border-radius: 0.8rem 0 0 0.8rem;\n    padding: 0;\n    width: 4.4rem;\n    height: 4.4rem;\n\n    .react-toast-notifications__toast__countdown {\n      background-color: ", ";\n    }\n\n    svg {\n      fill: ", "!important;\n      background-color: ", "!important;\n      border-radius: 100%;\n      padding: 0.8rem;\n      width: 3rem;\n      height: 3rem;\n    }\n  }\n\n  .react-toast-notifications__toast__content {\n    display: flex;\n    align-items: center;\n  }\n\n  .react-toast-notifications__toast__dismiss-button {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    opacity: 1;\n    padding: 0;\n    width: 4.4rem;\n    height: 4.4rem;\n\n    svg {\n      fill: ", "!important;\n      background-color: ", "!important;\n      border-radius: 100%;\n      padding: 0.8rem;\n      width: 3rem;\n      height: 3rem;\n\n      path {\n        transform: translateX(0.1rem);\n      }\n    }\n\n    svg:hover {\n      background-color: ", "!important;\n    }\n  }\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.palette.secondary;
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.palette.primary;
}, function (_ref4) {
  var theme = _ref4.theme;
  return theme.palette.light;
}, function (_ref5) {
  var theme = _ref5.theme;
  return theme.palette.primary;
}, function (_ref6) {
  var theme = _ref6.theme;
  return theme.palette.whiteSmoke;
}, function (_ref7) {
  var theme = _ref7.theme;
  return theme.palette.primary;
}, function (_ref8) {
  var theme = _ref8.theme;
  return theme.palette.whiteSmoke;
}, function (_ref9) {
  var theme = _ref9.theme;
  return theme.palette.light;
});

var Content = _styledComponents["default"].small(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])([""])));
//# sourceMappingURL=index.js.map