@sberdevices/plasma-temple/dist/pages/ConfirmOrderPage/ConfirmOrderPage.js

SberDevices CanvasApp Templates.

"use strict";

function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.ConfirmOrderPage = void 0;

var _react = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("react"));

var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));

var _plasmaUi = /*#__PURE__*/require("@sberdevices/plasma-ui");

var _plasmaTokens = /*#__PURE__*/require("@sberdevices/plasma-tokens");

var _utils = /*#__PURE__*/require("@sberdevices/plasma-ui/utils");

var _Header = /*#__PURE__*/require("../../components/Header/Header");

var _useFocusOnMount = /*#__PURE__*/require("../../hooks/useFocusOnMount");

var _useThrottledCallback = /*#__PURE__*/require("../../hooks/useThrottledCallback");

var _deviceFamily = /*#__PURE__*/require("../../utils/deviceFamily");

var _ConfirmOrderCard = /*#__PURE__*/require("./components/ConfirmOrderCard/ConfirmOrderCard");

var _LocationIcon = /*#__PURE__*/require("./ConfirmOrderPage.assets/LocationIcon");

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

var StyledLocationCol = /*#__PURE__*/(0, _styledComponents["default"])(_plasmaUi.Col).withConfig({
  componentId: "plasma-temple__sc-158yv52-0"
})(["display:flex;flex-direction:column;justify-content:center;align-items:center;margin-left:auto;text-align:center;"]);

var StyledBackground = /*#__PURE__*/_styledComponents["default"].div.withConfig({
  componentId: "plasma-temple__sc-158yv52-1"
})(["position:absolute;top:0;bottom:0;right:0;left:0;height:100vh;", ""], function (_ref) {
  var background = _ref.background;
  return background && (0, _styledComponents.css)(["z-index:-1;mask-image:linear-gradient(90.09deg,rgba(8,8,8,0) 42.41%,rgb(8,8,8) 99.93%);background:url(", ") no-repeat;background-size:cover;"], background);
});

var mapDeviceToAddressTitle = {
  sberBox: _plasmaUi.Headline3,
  sberPortal: _plasmaUi.Body2,
  mobile: _plasmaUi.Body2
};
var AddressTitle = mapDeviceToAddressTitle[/*#__PURE__*/(0, _utils.detectDevice)()];
var StyledAddressTitle = /*#__PURE__*/(0, _styledComponents["default"])(AddressTitle).withConfig({
  componentId: "plasma-temple__sc-158yv52-2"
})(["margin:0.625rem 0;"]);
var mapDeviceToAddressContent = {
  sberBox: _plasmaUi.Body1,
  sberPortal: _plasmaUi.Footnote1,
  mobile: _plasmaUi.Footnote1
};
var AddressContent = mapDeviceToAddressContent[/*#__PURE__*/(0, _utils.detectDevice)()];
var StyledAddressContent = /*#__PURE__*/(0, _styledComponents["default"])(AddressContent).withConfig({
  componentId: "plasma-temple__sc-158yv52-3"
})(["color:", ";"], _plasmaTokens.secondary);
var StyledPhone = /*#__PURE__*/(0, _styledComponents["default"])(AddressTitle).withConfig({
  componentId: "plasma-temple__sc-158yv52-4"
})(["margin-top:1.25rem;"]);
var StyledButton = /*#__PURE__*/(0, _styledComponents["default"])(_plasmaUi.Button).withConfig({
  componentId: "plasma-temple__sc-158yv52-5"
})(["margin-top:1.5rem;", ""], /*#__PURE__*/(0, _utils.mediaQuery)('M', 2)( /*#__PURE__*/(0, _styledComponents.css)(["margin-top:1.25rem;"])));
var defaultHeader = {
  title: 'Оформление заказа'
};

var ConfirmOrderPage = function ConfirmOrderPage(_ref2) {
  var delivery = _ref2.delivery,
      recipient = _ref2.recipient,
      address = _ref2.address,
      amount = _ref2.amount,
      paymentDisabled = _ref2.paymentDisabled,
      onPay = _ref2.onPay,
      onChangeRecipient = _ref2.onChangeRecipient,
      onChangeDelivery = _ref2.onChangeDelivery,
      _ref2$header = _ref2.header,
      header = _ref2$header === void 0 ? defaultHeader : _ref2$header,
      background = _ref2.background;

  var buttonRef = _react["default"].useRef(null);

  (0, _useFocusOnMount.useFocusOnMount)(buttonRef, {
    delay: _useThrottledCallback.THROTTLE_WAIT,
    prevent: !(0, _deviceFamily.isSberBoxLike)()
  });
  var handlePay = (0, _useThrottledCallback.useThrottledCallback)(function () {
    return onPay();
  }, [onPay]);
  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(StyledBackground, {
    background: background
  }), /*#__PURE__*/_react["default"].createElement(_Header.Header, header), /*#__PURE__*/_react["default"].createElement(_plasmaUi.Row, null, /*#__PURE__*/_react["default"].createElement(_plasmaUi.Col, {
    sizeXL: 5.5,
    sizeM: 3
  }, /*#__PURE__*/_react["default"].createElement(_ConfirmOrderCard.ConfirmOrderCard, {
    title: "\u0414\u043E\u0441\u0442\u0430\u0432\u043A\u0430",
    content: delivery.details,
    price: delivery.amount,
    onClick: onChangeDelivery
  }), /*#__PURE__*/_react["default"].createElement(_ConfirmOrderCard.ConfirmOrderCard, {
    title: "\u0414\u0430\u043D\u043D\u044B\u0435 \u043F\u043E\u043B\u0443\u0447\u0430\u0442\u0435\u043B\u044F",
    content: recipient.name,
    caption: recipient.email,
    onClick: onChangeRecipient
  }), /*#__PURE__*/_react["default"].createElement(StyledButton, {
    ref: buttonRef,
    stretch: true,
    view: "primary",
    text: "\u041A \u043E\u043F\u043B\u0430\u0442\u0435",
    "data-cy": "confirm-order-payment-button",
    disabled: paymentDisabled,
    contentRight: /*#__PURE__*/_react["default"].createElement(_plasmaUi.Price, null, amount),
    onClick: handlePay
  })), /*#__PURE__*/_react["default"].createElement(StyledLocationCol, {
    sizeXL: 5.5,
    sizeM: 3,
    offsetXL: 1,
    "data-cy": "confirm-order-location"
  }, /*#__PURE__*/_react["default"].createElement(_LocationIcon.LocationIcon, null), /*#__PURE__*/_react["default"].createElement(StyledAddressTitle, null, address.title), /*#__PURE__*/_react["default"].createElement(StyledAddressContent, null, address.content), /*#__PURE__*/_react["default"].createElement(StyledPhone, null, recipient.phone))));
};

exports.ConfirmOrderPage = ConfirmOrderPage;
//# sourceMappingURL=ConfirmOrderPage.js.map