'use strict';

import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import React from 'react';
import PropTypes from 'prop-types';
import classnames from 'classnames';
import { Button } from './Button';
import { Icon } from './Icon';
export var Banner =
/*#__PURE__*/
function (_React$Component) {
  _inheritsLoose(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.createElement(Button, {
        iconOnly: true,
        bsStyle: "link",
        className: "rc-banner-close-button",
        testAutomationId: "closeButton",
        onClick: this.props.onClose,
        "aria-label": this.props.closeLabel
      }, React.createElement(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 = classnames('rc-banner', className);
    var arrowStyle = {
      left: arrowColsOffset !== null ? 100 / 12 * arrowColsOffset + '%' : arrowOffset,
      marginLeft: additionalOffset
    };
    return React.createElement("div", {
      className: "rc-banner-wrap"
    }, React.createElement("div", {
      className: "rc-banner-triangle-top",
      style: arrowStyle
    }, React.createElement("div", {
      className: "rc-banner-triangle-inner"
    }, React.createElement("div", {
      className: "rc-banner-triangle-border"
    }), React.createElement("div", {
      className: "rc-banner-triangle-fill"
    }))), this.getCloseButton(), React.createElement("div", {
      className: classNames
    }, children));
  };

  return Banner;
}(React.Component);

_defineProperty(Banner, "propTypes", {
  arrowOffset: PropTypes.string,
  arrowColsOffset: PropTypes.number,
  additionalOffset: PropTypes.number,
  closable: PropTypes.bool,
  closeLabel: PropTypes.string,
  onClose: PropTypes.func,
  children: PropTypes.node,
  className: PropTypes.string
});

_defineProperty(Banner, "defaultProps", {
  arrowOffset: '50%',
  arrowColsOffset: 0,
  additionalOffset: 0,
  closable: false,
  closeLabel: 'TRANSLATE:CLOSE',
  onClose: null,
  children: null,
  className: null
});