pay-sdk-react/dist/lib/Airwallex/airwallex-button.js

A cross-platform payment SDK for React, supporting Alipay, WeChat Pay, PayPal, Stripe, Payssion, and Airwallex, compatible with H5, PC, and App environments.

"use strict";

var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
var _react = _interopRequireWildcard(require("react"));
var _airwallexPopup = _interopRequireDefault(require("./airwallex-popup"));
var _airwallexModal = _interopRequireDefault(require("./airwallex-modal"));
var _Button = _interopRequireDefault(require("../Button"));
var _PayMask = _interopRequireDefault(require("../PayMask"));
var _omit = _interopRequireDefault(require("../utils/omit"));
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const AirwallexButton = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
  const {
    children = 'Airwallex',
    onClick,
    createOrder,
    ...others
  } = props;
  const airwallexButtonRef = (0, _react.useRef)({
    nativeElement: null
  });
  const airwallexPopupRef = (0, _react.useRef)(null);
  const airwallexModalRef = (0, _react.useRef)(null);
  const [showMask, setShowMask] = (0, _react.useState)(false);
  const [airwallexUrl, setAirwallexUrl] = (0, _react.useState)();
  (0, _react.useImperativeHandle)(ref, () => airwallexButtonRef.current);
  const handlePayCreateOrder = (0, _react.useCallback)(async () => {
    if (createOrder) {
      // 1. 业务侧创建订单，获取参数
      const options = await createOrder();
      if (options) {
        if ((props === null || props === void 0 ? void 0 : props.payMode) === 'embedded') {
          if ((props === null || props === void 0 ? void 0 : props.displayType) === 'modal') {
            var _airwallexModalRef$cu;
            airwallexModalRef === null || airwallexModalRef === void 0 || (_airwallexModalRef$cu = airwallexModalRef.current) === null || _airwallexModalRef$cu === void 0 || _airwallexModalRef$cu.open(options);
          } else {
            var _airwallexPopupRef$cu;
            (_airwallexPopupRef$cu = airwallexPopupRef.current) === null || _airwallexPopupRef$cu === void 0 || _airwallexPopupRef$cu.open(options);
          }
        } else {
          setShowMask(true);
          setAirwallexUrl(options.airwallexUrl);
        }
      }
    }
  }, [createOrder, props]);
  const handleClick = (0, _react.useCallback)(e => {
    onClick === null || onClick === void 0 || onClick(e);
    if (createOrder) {
      handlePayCreateOrder();
      return;
    }
    if ((props === null || props === void 0 ? void 0 : props.payMode) === 'embedded') {
      if ((props === null || props === void 0 ? void 0 : props.displayType) === 'modal') {
        var _airwallexModalRef$cu2;
        airwallexModalRef === null || airwallexModalRef === void 0 || (_airwallexModalRef$cu2 = airwallexModalRef.current) === null || _airwallexModalRef$cu2 === void 0 || _airwallexModalRef$cu2.open();
      } else {
        var _airwallexPopupRef$cu2;
        airwallexPopupRef === null || airwallexPopupRef === void 0 || (_airwallexPopupRef$cu2 = airwallexPopupRef.current) === null || _airwallexPopupRef$cu2 === void 0 || _airwallexPopupRef$cu2.open();
      }
      return;
    }
    if ((props === null || props === void 0 ? void 0 : props.payMode) === 'redirect') {
      setShowMask(true);
      setAirwallexUrl(props === null || props === void 0 ? void 0 : props.airwallexUrl);
    }
  }, [onClick, createOrder, handlePayCreateOrder, props]);
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Button.default, (0, _extends2.default)({
    ref: airwallexButtonRef,
    onClick: handleClick
  }, (0, _omit.default)(others, ['payMode', 'displayType', 'createOrder', 'airwallexUrl', 'maskProps', 'popupProps', 'modalProps'])), children), (props === null || props === void 0 ? void 0 : props.payMode) === 'embedded' && (props === null || props === void 0 ? void 0 : props.displayType) === 'popup' && /*#__PURE__*/_react.default.createElement(_airwallexPopup.default, (0, _extends2.default)({
    ref: airwallexPopupRef
  }, props === null || props === void 0 ? void 0 : props.popupProps)), (props === null || props === void 0 ? void 0 : props.payMode) === 'embedded' && (props === null || props === void 0 ? void 0 : props.displayType) === 'modal' && /*#__PURE__*/_react.default.createElement(_airwallexModal.default, (0, _extends2.default)({
    ref: airwallexModalRef
  }, props === null || props === void 0 ? void 0 : props.modalProps)), (props === null || props === void 0 ? void 0 : props.payMode) === 'redirect' && showMask && airwallexUrl && /*#__PURE__*/_react.default.createElement(_PayMask.default, (0, _extends2.default)({
    visible: showMask,
    onClose: () => {
      var _props$maskProps, _props$maskProps$onCl;
      setShowMask(false);
      props === null || props === void 0 || (_props$maskProps = props.maskProps) === null || _props$maskProps === void 0 || (_props$maskProps$onCl = _props$maskProps.onClose) === null || _props$maskProps$onCl === void 0 || _props$maskProps$onCl.call(_props$maskProps);
    },
    payUrl: airwallexUrl,
    title: 'Airwallex'
  }, (0, _omit.default)((props === null || props === void 0 ? void 0 : props.maskProps) || {}, ['onClose']))));
});
AirwallexButton.displayName = 'AirwallexButton';
var _default = exports.default = /*#__PURE__*/(0, _react.memo)(AirwallexButton);