import _extends from "@babel/runtime/helpers/extends";
import "core-js/modules/es.array.concat.js";
import "core-js/modules/es.array.map.js";
import * as React from 'react';
import { cnCreate, filterDataAttrs } from '@megafon/ui-helpers';
import BenefitCard from "./BenefitCard/BenefitCard";
import { checkIsExtraColoredCard } from "./helpers";
import "./BenefitCards.css";
var cn = cnCreate('mfui-9-benefit-cards');
var BenefitCards = function BenefitCards(_ref) {
  var className = _ref.className,
    items = _ref.items,
    mainBackground = _ref.mainBackground,
    extraBackground = _ref.extraBackground,
    classes = _ref.classes,
    dataAttrs = _ref.dataAttrs,
    rootRef = _ref.rootRef;
  return /*#__PURE__*/React.createElement("div", _extends({}, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root), {
    className: cn([className, classes === null || classes === void 0 ? void 0 : classes.root]),
    ref: rootRef
  }), items.map(function (item, i) {
    var isExtraColored = !!extraBackground && checkIsExtraColoredCard(i, items.length);
    return /*#__PURE__*/React.createElement("div", {
      className: cn('item'),
      key: "".concat(item.title, "_").concat(i)
    }, /*#__PURE__*/React.createElement(BenefitCard, _extends({}, item, {
      background: isExtraColored ? extraBackground : mainBackground,
      dataAttrs: {
        root: filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.card, i + 1)
      },
      className: classes === null || classes === void 0 ? void 0 : classes.card
    })));
  }));
};
export default BenefitCards;