import { s as styleInject } from './index-bbdfb97a.js';
import { useTranslation, useDivaCore, getLogger } from '@crystaldesign/diva-core';
import 'react';
import { jsxs, jsx } from 'react/jsx-runtime';
import '@babel/runtime/helpers/defineProperty';
import 'react-dynamic-multi-render';
import 'mobx-react-lite';
import '@babel/runtime/helpers/asyncToGenerator';
import '@babel/runtime/helpers/slicedToArray';
import '@babel/runtime/helpers/objectWithoutProperties';
import '@babel/runtime/regenerator';
import '@babel/runtime/helpers/classCallCheck';
import '@babel/runtime/helpers/createClass';
import '@babel/runtime/helpers/toConsumableArray';
import '@crystaldesign/diva-utils';
import 'mobx';
import '@crystaldesign/web-planner-logic';
import 'classnames';
import 'qrcode.react';
import '@babel/runtime/helpers/typeof';
import 'flat';
import 'react-switch';
import 'react-countup';

var affiliateContainer = "affiliate-container-bOZvB";
var affiliateMain = "affiliate-main-ipOJf";
var affiliateMainMobile = "affiliate-main-mobile-VQW52";
var affiliateProduct = "affiliate-product-ich3t";
var affiliateProductDescription = "affiliate-product-description-ujnXk";
var affiliatePartnerList = "affiliate-partner-list-wXqwE";
var affiliatePartner = "affiliate-partner-Z5vLB";
var affiliatePartnerImage = "affiliate-partner-image-WSYog";
var affiliateParnterButton = "affiliate-parnter-button-myx7O";
var css_248z = ".affiliate-container-bOZvB {\n  max-width: 750px;\n}\n\n.affiliate-container-bOZvB > h2 {\n  margin-top: 0;\n}\n\n.affiliate-main-ipOJf {\n  display: flex;\n  margin-top: 20px;\n  flex-wrap: wrap;\n  gap: 50px;\n}\n.affiliate-main-mobile-VQW52 {\n  display: flex;\n  flex-direction: column;\n  flex-wrap: wrap;\n  margin-top: 10px;\n  gap: 10px;\n}\n\n.affiliate-product-ich3t {\n  display: flex;\n  flex-direction: column;\n}\n\n.affiliate-product-ich3t > img {\n  width: 276px;\n  max-width: 100%;\n}\n\n.affiliate-product-description-ujnXk {\n  line-height: 30px;\n  margin-top: 10px;\n  flex: 1 1 20px;\n}\n\n.affiliate-partner-list-wXqwE {\n  flex: 1 1 200px;\n  display: flex;\n  flex-wrap: wrap;\n  flex-direction: column;\n  gap: 20px;\n}\n\n.affiliate-partner-Z5vLB {\n  display: flex;\n  justify-content: space-between;\n  flex: 1 1 100px;\n  flex-wrap: wrap;\n  align-items: center;\n  justify-content: center;\n  gap: 20px;\n  position: relative;\n}\n\n.affiliate-partner-image-WSYog {\n  cursor: pointer;\n  flex: 1 1 120px;\n  background-color: #fff;\n  background-repeat: no-repeat;\n  background-position: center;\n  width: 204px;\n  max-width: 100%;\n  height: 98px;\n  border: 1px solid #aaa;\n}\n\n.affiliate-parnter-button-myx7O {\n  cursor: pointer;\n  height: 35px;\n  width: 100px;\n  background: var(--secondaryColor);\n  border-radius: 3px;\n  color: #fff;\n  text-align: center;\n  line-height: 35px;\n  flex: 1 1 25px;\n  padding: 0 5px;\n}\n";
styleInject(css_248z);

getLogger('Planner', 'Affiliate');
function Affiliate(_ref) {
  var _product$affiliate;
  var product = _ref.product;
  var _useTranslation = useTranslation(),
    t = _useTranslation.t;
  var _useDivaCore = useDivaCore(),
    isMobile = _useDivaCore.state.dimensions.isMobile;
  return /*#__PURE__*/jsxs("div", {
    className: affiliateContainer,
    children: [/*#__PURE__*/jsx("h2", {
      children: t('affiliatemodal.title')
    }), /*#__PURE__*/jsx("div", {
      children: t('affiliatemodal.text')
    }), /*#__PURE__*/jsxs("div", {
      className: isMobile ? affiliateMainMobile : affiliateMain,
      children: [/*#__PURE__*/jsxs("div", {
        className: affiliateProduct,
        children: [!isMobile && /*#__PURE__*/jsx("img", {
          src: product.image
        }), /*#__PURE__*/jsx("div", {
          className: affiliateProductDescription,
          children: product.shortDescription
        })]
      }), /*#__PURE__*/jsx("div", {
        className: affiliatePartnerList,
        children: (_product$affiliate = product.affiliate) === null || _product$affiliate === void 0 ? void 0 : _product$affiliate.map(function (partner) {
          return /*#__PURE__*/jsxs("div", {
            className: affiliatePartner,
            children: [/*#__PURE__*/jsx("button", {
              "data-test-id": "affiliate-button",
              className: affiliatePartnerImage,
              style: {
                backgroundImage: 'url(' + partner.logoUrl + ')'
              },
              onClick: function onClick() {
                window.open(partner.link, '_blank');
              }
            }), /*#__PURE__*/jsx("div", {
              className: affiliateParnterButton,
              onClick: function onClick() {
                window.open(partner.link, '_blank');
              },
              children: t('affiliatemodal.button')
            })]
          }, partner.id);
        })
      })]
    })]
  });
}

export { Affiliate as default };
