import _extends from "@babel/runtime/helpers/extends";
import * as React from 'react';
import { Button, Grid, GridColumn, Header } from '@megafon/ui-core';
import { cnCreate, filterDataAttrs, convert, titleConvertConfig, textConvertConfig } from '@megafon/ui-helpers';
import "./ButtonBanner.css";
export var ButtonColor = {
  GREEN: 'green',
  PURPLE: 'purple'
};
export var ButtonTypes = {
  PRIMARY: 'primary',
  OUTLINE: 'outline'
};
export var ButtonTarget = {
  SELF: '_self',
  BLANK: '_blank'
};
export var ImageScaling = {
  COVER: 'cover',
  CONTAIN: 'contain'
};
var getMediaStyle = function getMediaStyle(imageUrl) {
  return imageUrl ? {
    backgroundImage: "url(".concat(imageUrl, ")")
  } : undefined;
};
var cn = cnCreate('mfui-button-banner');
var testIdPrefix = 'ButtonBanner';
var ButtonBanner = function ButtonBanner(_ref) {
  var dataAttrs = _ref.dataAttrs,
    className = _ref.className,
    _ref$classes = _ref.classes,
    classes = _ref$classes === void 0 ? {} : _ref$classes,
    rootRef = _ref.rootRef,
    title = _ref.title,
    text = _ref.text,
    _ref$imageUrl = _ref.imageUrl,
    imageUrl = _ref$imageUrl === void 0 ? '' : _ref$imageUrl,
    buttonText = _ref.buttonText,
    buttonUrl = _ref.buttonUrl,
    buttonDownload = _ref.buttonDownload,
    _ref$buttonTarget = _ref.buttonTarget,
    buttonTarget = _ref$buttonTarget === void 0 ? '_self' : _ref$buttonTarget,
    _ref$buttonColor = _ref.buttonColor,
    buttonColor = _ref$buttonColor === void 0 ? 'green' : _ref$buttonColor,
    _ref$buttonType = _ref.buttonType,
    buttonType = _ref$buttonType === void 0 ? 'primary' : _ref$buttonType,
    buttonRel = _ref.buttonRel,
    _ref$imageScaling = _ref.imageScaling,
    imageScaling = _ref$imageScaling === void 0 ? 'cover' : _ref$imageScaling,
    onButtonClick = _ref.onButtonClick;
  var buttonElem = /*#__PURE__*/React.createElement(Button, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button
    },
    className: cn('button', [classes.button]),
    href: buttonUrl,
    rel: buttonRel,
    target: buttonTarget,
    theme: buttonColor,
    type: buttonType,
    onClick: onButtonClick,
    download: buttonDownload
  }, buttonText);
  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
    className: cn({
      image: !!imageUrl,
      scaling: imageScaling
    }, [className, classes.root]),
    ref: rootRef
  }), /*#__PURE__*/React.createElement(Grid, {
    guttersLeft: "medium"
  }, /*#__PURE__*/React.createElement(GridColumn, {
    all: "6",
    mobile: "12",
    leftOffsetTablet: "1",
    leftOffsetDesktop: "1",
    leftOffsetWide: "1"
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('content'),
    "data-testid": "".concat(testIdPrefix, "-content")
  }, /*#__PURE__*/React.createElement(Header, {
    className: cn('header'),
    as: "h2"
  }, convert(title, titleConvertConfig)), /*#__PURE__*/React.createElement("div", {
    className: cn('text')
  }, typeof text === 'string' ? convert(text, textConvertConfig) : text), !!imageUrl && buttonElem)), /*#__PURE__*/React.createElement(GridColumn, {
    all: "5",
    mobile: "12"
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('media'),
    style: getMediaStyle(imageUrl),
    "data-testid": "".concat(testIdPrefix, "-media")
  }, !imageUrl && buttonElem))));
};
export default ButtonBanner;