import React from 'react';
import useEngineContext from "../../../../../../../hooks/useEngineContext";
import "./index.less";
import { locales } from '@pisell/utils';
/**
 * @title: 等待加载页
 * @description: 通用的支付等待 loading 页面。
 *              - 默认单行文案模式（传 title 或使用默认文案）
 *              - 传入 subtitle / description 后进入多行文案模式
 *              向后兼容：不传新 props 时行为与原来完全一致。
 */
var ThreedsLoading = function ThreedsLoading(_ref) {
  var _context$appHelper;
  var title = _ref.title,
    subtitle = _ref.subtitle,
    description = _ref.description,
    showSuccessBackButton = _ref.showSuccessBackButton,
    onSuccessBack = _ref.onSuccessBack;
  var context = useEngineContext();
  var _ref2 = ((_context$appHelper = context.appHelper) === null || _context$appHelper === void 0 ? void 0 : _context$appHelper.constants) || {},
    config = _ref2.config;
  return /*#__PURE__*/React.createElement("div", {
    className: 'threeds-loading-wrap'
  }, /*#__PURE__*/React.createElement("img", {
    className: 'threeds-loading-logo',
    src: config.static + '/static/stripe_loading.gif',
    alt: ""
  }), /*#__PURE__*/React.createElement("div", {
    className: 'threeds-loading-title'
  }, title || locales.getText('tocPay.text.waitingForBankVerification')), subtitle && /*#__PURE__*/React.createElement("div", {
    className: 'threeds-loading-subtitle'
  }, subtitle), description && /*#__PURE__*/React.createElement("div", {
    className: 'threeds-loading-description'
  }, description), showSuccessBackButton && /*#__PURE__*/React.createElement("div", {
    onClick: onSuccessBack,
    className: "threeds-loading-success-back-button"
  }, locales.getText('tocPay.text.successBack')));
};
export default ThreedsLoading;