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 StoreButton, { Theme as StoreButtonTheme } from "../StoreButton/StoreButton";
import "./StoreBanner.css";
export var Theme = {
  DEFAULT: 'default',
  GREEN: 'green',
  SPB_SKY_1: 'spbSky1',
  SPB_SKY_0: 'spbSky0'
};
export var DeviceMask = {
  ANDROID: 'android',
  NEW_IPHONE: 'new-iphone',
  /** DEPRECATED: 'black-iphone', 'white-iphone', 'iphone-12' */
  BLACK_IPHONE: 'black-iphone',
  WHITE_IPHONE: 'white-iphone',
  IPHONE_12: 'iphone-12'
};
var testIdPrefix = 'StoreBanner';
var cn = cnCreate('mfui-store-banner');
var StoreBanner = function StoreBanner(_ref) {
  var className = _ref.className,
    _ref$classes = _ref.classes,
    _ref$classes2 = _ref$classes === void 0 ? {} : _ref$classes,
    rootClassName = _ref$classes2.root,
    appleLinkClassName = _ref$classes2.appleLink,
    galaxyStoreLinkClassName = _ref$classes2.galaxyStoreLink,
    googleLinkClassName = _ref$classes2.googleLink,
    huaweiLinkClassName = _ref$classes2.huaweiLink,
    miStoreLinkClassName = _ref$classes2.miStoreLink,
    ruStoreLinkClassName = _ref$classes2.ruStoreLink,
    vAppstoreLinkClassName = _ref$classes2.vAppstoreLink,
    buttonClassName = _ref$classes2.button,
    title = _ref.title,
    text = _ref.text,
    linkApple = _ref.linkApple,
    linkGalaxyStore = _ref.linkGalaxyStore,
    linkGoogle = _ref.linkGoogle,
    linkHuawei = _ref.linkHuawei,
    linkMiStore = _ref.linkMiStore,
    linkRuStore = _ref.linkRuStore,
    linkVAppstore = _ref.linkVAppstore,
    linkButton = _ref.linkButton,
    _ref$textButton = _ref.textButton,
    textButton = _ref$textButton === void 0 ? 'Установите приложение' : _ref$textButton,
    rel = _ref.rel,
    qrCode = _ref.qrCode,
    imageSrc = _ref.imageSrc,
    _ref$theme = _ref.theme,
    theme = _ref$theme === void 0 ? 'default' : _ref$theme,
    deviceMask = _ref.deviceMask,
    isContentLeftMobile = _ref.isContentLeftMobile,
    rootRef = _ref.rootRef,
    dataAttrs = _ref.dataAttrs,
    onClickApple = _ref.onClickApple,
    onClickGalaxyStore = _ref.onClickGalaxyStore,
    onClickGoogle = _ref.onClickGoogle,
    onClickHuawei = _ref.onClickHuawei,
    onClickMiStore = _ref.onClickMiStore,
    onClickRuStore = _ref.onClickRuStore,
    onClickVAppstore = _ref.onClickVAppstore;
  return /*#__PURE__*/React.createElement("div", _extends({
    className: cn({
      theme: theme,
      mask: deviceMask,
      'content-left-mobile': isContentLeftMobile
    }, [className, rootClassName]),
    ref: rootRef
  }, filterDataAttrs(dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.root)), /*#__PURE__*/React.createElement("div", {
    className: cn('container')
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('grid')
  }, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(GridColumn, {
    all: "6",
    mobile: "12",
    rightOffsetWide: "1"
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('content')
  }, /*#__PURE__*/React.createElement(Header, {
    as: "h2",
    className: cn('title'),
    color: "inherit"
  }, convert(title, titleConvertConfig)), /*#__PURE__*/React.createElement("div", {
    className: cn('text'),
    color: "inherit"
  }, convert(text, textConvertConfig)), /*#__PURE__*/React.createElement("div", {
    className: cn('links', {
      three: !!linkApple && !!linkGoogle && !!linkHuawei
    })
  }, !linkButton && qrCode && /*#__PURE__*/React.createElement("img", {
    src: qrCode,
    className: cn('qr-code'),
    alt: "QR-\u043A\u043E\u0434",
    "data-testid": "".concat(testIdPrefix, "-qrCode")
  }), !linkButton && /*#__PURE__*/React.createElement("div", {
    className: cn('stores'),
    "data-testid": "".concat(testIdPrefix, "-stores")
  }, linkApple && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkApple
    },
    theme: StoreButtonTheme.APP_STORE,
    href: linkApple,
    rel: rel,
    onClick: onClickApple,
    className: cn('store-link', {
      'app-store': true
    }, appleLinkClassName)
  }), linkGoogle && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkGoogle
    },
    theme: StoreButtonTheme.GOOGLE_PLAY,
    href: linkGoogle,
    rel: rel,
    className: cn('store-link', {
      'google-play': true
    }, googleLinkClassName),
    onClick: onClickGoogle
  }), linkRuStore && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkRuStore
    },
    theme: StoreButtonTheme.RU_STORE,
    href: linkRuStore,
    rel: rel,
    className: cn('store-link', {
      'ru-store': true
    }, ruStoreLinkClassName),
    onClick: onClickRuStore
  }), linkGalaxyStore && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkGalaxyStore
    },
    theme: StoreButtonTheme.GALAXY_STORE,
    href: linkGalaxyStore,
    rel: rel,
    className: cn('store-link', {
      'galaxy-store': true
    }, galaxyStoreLinkClassName),
    onClick: onClickGalaxyStore
  }), linkHuawei && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkHuawei
    },
    theme: StoreButtonTheme.HUAWEI_STORE,
    href: linkHuawei,
    rel: rel,
    className: cn('store-link', {
      'huawei-store': true
    }, huaweiLinkClassName),
    onClick: onClickHuawei
  }), linkMiStore && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkMiStore
    },
    theme: StoreButtonTheme.MI_STORE,
    href: linkMiStore,
    rel: rel,
    className: cn('store-link', {
      'mi-store': true
    }, miStoreLinkClassName),
    onClick: onClickMiStore
  }), linkVAppstore && /*#__PURE__*/React.createElement(StoreButton, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.linkVAppstore
    },
    theme: StoreButtonTheme.V_APPSTORE,
    href: linkVAppstore,
    rel: rel,
    className: cn('store-link', {
      'v-appstore': true
    }, vAppstoreLinkClassName),
    onClick: onClickVAppstore
  })), linkButton && /*#__PURE__*/React.createElement(Button, {
    dataAttrs: {
      root: dataAttrs === null || dataAttrs === void 0 ? void 0 : dataAttrs.button
    },
    className: cn('button', [buttonClassName]),
    href: linkButton,
    rel: rel,
    theme: theme === 'green' ? 'purple' : 'green'
  }, textButton)))), /*#__PURE__*/React.createElement(GridColumn, {
    all: "4",
    desktop: "6",
    tablet: "6",
    mobile: "12"
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('device-wrapper')
  }, /*#__PURE__*/React.createElement("div", {
    className: cn('device-mask')
  }), /*#__PURE__*/React.createElement("img", {
    src: imageSrc,
    className: cn('screen'),
    alt: "\u0418\u0437\u043E\u0431\u0440\u0430\u0436\u0435\u043D\u0438\u0435 \u043F\u0440\u0438\u043B\u043E\u0436\u0435\u043D\u0438\u044F \u043D\u0430 \u044D\u043A\u0440\u0430\u043D\u0435 \u0442\u0435\u043B\u0435\u0444\u043E\u043D\u0430"
  })))))));
};
export default StoreBanner;