@makeen.io/material-ui-kit/distr/atoms/Banner/index.js

Makeen UI components kit. Based on material-ui.

import _extends from "@babel/runtime/helpers/extends";import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";function _templateObject3() {var data = _taggedTemplateLiteral(["\n  color: inherit;\n  cursor: pointer;\n\n  svg {\n    display: block;\n  }\n"]);_templateObject3 = function _templateObject3() {return data;};return data;}function _templateObject2() {var data = _taggedTemplateLiteral(["\n  flex: 1;\n  display: flex;\n  justify-content: center;\n"]);_templateObject2 = function _templateObject2() {return data;};return data;}function _templateObject() {var data = _taggedTemplateLiteral(["\n  border: 1px solid transparent;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n\n  width: 100%;\n  max-height: 100px;\n  padding: 10px;\n\n  overflow: hidden;\n\n  transition: border-width, max-height, padding 0.5s ease-in-out;\n\n  &.hidden {\n    border-width: 0;\n    max-height: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n\n  ", "\n"]);_templateObject = function _templateObject() {return data;};return data;}import React from "react";

import { IoMdClose } from "react-icons/all";
import styled from "styled-components";
import { default as theme } from "../../themes/default";
import Text from "../Text";
var BannerWrapper = styled.div(_templateObject(),




















function (props) {
  if (!props.palette) {
    return "\n            background-color: ".concat(
    theme.palette.BannerColors.basic.backgroundColor, ";\n            color: ").concat(
    theme.palette.BannerColors.basic.textColor, ";\n          ");

  }
  var bannerPalette = theme.palette.BannerColors[props.palette];
  var styles = "";
  styles += "\n        background-color: ".concat(
  bannerPalette.backgroundColor, ";\n        color: ").concat(
  bannerPalette.textColor, ";\n        ");

  if (typeof bannerPalette.borderColor !== "undefined" &&
  bannerPalette.borderColor.length) {
    styles += "\n          border-color: ".concat(
    bannerPalette.borderColor, ";\n          ");

  }
  return styles;
});

var BannerContent = styled.div(_templateObject2());




var CloseBtn = styled.a(_templateObject3());







export default (function (_ref) {var palette = _ref.palette,text = _ref.text,hasCloseBtn = _ref.hasCloseBtn,onClose = _ref.onClose,show = _ref.show,rest = _objectWithoutProperties(_ref, ["palette", "text", "hasCloseBtn", "onClose", "show"]);
  return /*#__PURE__*/React.createElement(BannerWrapper, _extends({ palette: palette, className: !show ? "hidden" : "" }, rest), /*#__PURE__*/
  React.createElement(BannerContent, null, /*#__PURE__*/
  React.createElement(Text, { noWrap: true }, text)),
  hasCloseBtn && /*#__PURE__*/React.createElement(CloseBtn, { onClick: onClose }, /*#__PURE__*/
  React.createElement(IoMdClose, { size: 19 })));
});
//# sourceMappingURL=index.js.map