'use strict';

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

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

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

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

var _classnames = _interopRequireDefault(require("classnames"));

var _Button = require("./Button");

var _Icon = require("./Icon");

var Banner =
/*#__PURE__*/
function (_React$Component) {
  (0, _inheritsLoose2.default)(Banner, _React$Component);

  function Banner() {
    return _React$Component.apply(this, arguments) || this;
  }

  var _proto = Banner.prototype;

  _proto.getCloseButton = function getCloseButton() {
    if (!this.props.closable) {
      return null;
    } else {
      return _react.default.createElement(_Button.Button, {
        iconOnly: true,
        bsStyle: "link",
        className: "rc-banner-close-button",
        testAutomationId: "closeButton",
        onClick: this.props.onClose,
        "aria-label": this.props.closeLabel
      }, _react.default.createElement(_Icon.Icon, {
        name: "close"
      }));
    }
  };

  _proto.render = function render() {
    var _this$props = this.props,
        children = _this$props.children,
        className = _this$props.className,
        arrowOffset = _this$props.arrowOffset,
        arrowColsOffset = _this$props.arrowColsOffset,
        additionalOffset = _this$props.additionalOffset;

    if (arrowColsOffset > 11 || arrowColsOffset < 0) {
      // eslint-disable-next-line
      console.error('arrowColsOffset must be between 1 and 11');
    }

    var classNames = (0, _classnames.default)('rc-banner', className);
    var arrowStyle = {
      left: arrowColsOffset !== null ? 100 / 12 * arrowColsOffset + '%' : arrowOffset,
      marginLeft: additionalOffset
    };
    return _react.default.createElement("div", {
      className: "rc-banner-wrap"
    }, _react.default.createElement("div", {
      className: "rc-banner-triangle-top",
      style: arrowStyle
    }, _react.default.createElement("div", {
      className: "rc-banner-triangle-inner"
    }, _react.default.createElement("div", {
      className: "rc-banner-triangle-border"
    }), _react.default.createElement("div", {
      className: "rc-banner-triangle-fill"
    }))), this.getCloseButton(), _react.default.createElement("div", {
      className: classNames
    }, children));
  };

  return Banner;
}(_react.default.Component);

exports.Banner = Banner;
(0, _defineProperty2.default)(Banner, "propTypes", {
  arrowOffset: _propTypes.default.string,
  arrowColsOffset: _propTypes.default.number,
  additionalOffset: _propTypes.default.number,
  closable: _propTypes.default.bool,
  closeLabel: _propTypes.default.string,
  onClose: _propTypes.default.func,
  children: _propTypes.default.node,
  className: _propTypes.default.string
});
(0, _defineProperty2.default)(Banner, "defaultProps", {
  arrowOffset: '50%',
  arrowColsOffset: 0,
  additionalOffset: 0,
  closable: false,
  closeLabel: 'TRANSLATE:CLOSE',
  onClose: null,
  children: null,
  className: null
});