"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CoalitionHeroBanner = void 0;
var _react = _interopRequireDefault(require("react"));
var _utils = require("./../../utils");
require("./CoalitionHeroBanner.css");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
const CoalitionHeroBanner = _ref => {
  let {
    name,
    balance
  } = _ref;
  return /*#__PURE__*/_react.default.createElement("div", {
    className: "coalition-hero-banner"
  }, name && name.length > 1 ? /*#__PURE__*/_react.default.createElement("h2", {
    className: "coalition-hero-banner-title"
  }, "Hola ", name) : null, /*#__PURE__*/_react.default.createElement("div", {
    className: "coalition-hero-color-balance"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "coalition-hero-color-balance-label"
  }, "Tus puntos disponibles:"), /*#__PURE__*/_react.default.createElement("div", {
    className: "coalition-hero-color-balance-value"
  }, (0, _utils.drawBalance)(balance))), /*#__PURE__*/_react.default.createElement("div", {
    className: "coalition-hero-background"
  }, /*#__PURE__*/_react.default.createElement("div", {
    className: "color-degradated"
  })));
};
exports.CoalitionHeroBanner = CoalitionHeroBanner;