@alipay/ams-checkout 1.20.0 → 1.21.0

package/esm/plugin/component/index.js

@@ -17,6 +17,7 @@ function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e
  * 2. If applicable, the use of the Software is also subject to the terms and conditions of any non-disclosure agreement signed by you and the relevant Ant Group entity.
  */
 /* eslint-disable @typescript-eslint/no-explicit-any */
+import { v4 as uuid } from 'uuid';
 import { sdkVersion } from "../../config";
 import { COMPONENTPLUGINID, COMPONENT_CLOSE_BLOCK_ID, COMPONENT_CONTAINER_ID, COMPONENT_RETENTION_ID, COMPONENT_SECTION_ID, ERRORMESSAGE, EVENT, LISTENER_PREFIX, LOADING_ID, LOADTIME_LIMIT, MOCKUP_ID, POPUP_LOADTIME_LOG_LIMIT, TIMEOUT_WEB_APP_HEART_BEAT, TIME_DELAY_SEND_HEART_BEAT } from "../../constant";
 import { queryPaymentInfo, submitPayInfo } from "../../service";
@@ -24,14 +25,15 @@ import { componentSignEnum, eventCodeEnum, messageName, platformEnum, productSce
 import { getType, isJsonString, isPC } from "../../util";
 import { isLocalMock } from "../../util/mock";
 import { matchVersion } from "../../util/versionCompare";
+import { handlePaymentSessionConfig } from "../payment-element/utils";
 import { createIframe, createPreloadIframe, getAppDomain, getIframeUrl } from "./cashierApp";
 import { getChannelBehavior } from "./channel";
 import { addInlineLoading, createInlineBaseElement } from "./component.inline.style";
-import { addPopupLoading, createBaseElement, createMockup, createRetentionPopup, handleDeclareInfo as _handleDeclareInfo, hideRetentionPopup, removeRetentionPopup as _removeRetentionPopup } from "./component.popup.style";
-import { createModal, destroyModal, insertStyleSheet } from "./popupWindow.style";
+import { addPopupLoading, createBaseElement, createMockup, createRetentionPopup, handleDeclareInfo as _handleDeclareInfo, hideRetentionPopup, removeRetentionPopup as _removeRetentionPopup, slideInAndOutKeyframes } from "./component.popup.style";
+import { createModal, destroyModal, insertStyleSheet, removePopupLoading } from "./popupWindow.style";
 window.changingPageHeight = window.innerHeight;
 var ComponentApp = /*#__PURE__*/function () {
-  function ComponentApp() {
+  function ComponentApp(componentOption) {
     _classCallCheck(this, ComponentApp);
     _defineProperty(this, "app", void 0);
     _defineProperty(this, "AMSSDK", void 0);
@@ -57,7 +59,7 @@ var ComponentApp = /*#__PURE__*/function () {
     _defineProperty(this, "_multipleCallbackEvents", void 0);
     _defineProperty(this, "_merchantAppointParam", void 0);
     _defineProperty(this, "_webAppHeartBeatTimeoutFn", void 0);
-    this._appVersion = '1.19.0';
+    this._appVersion = componentOption.appVersion;
     this._isInitComponent = false;
     this._selector = "#".concat(COMPONENT_SECTION_ID);
     this.createIframeNode = function () {
@@ -258,12 +260,12 @@ var ComponentApp = /*#__PURE__*/function () {
         return Promise.reject(ERRORMESSAGE.CREATECOMPONENT_ERROR.SINGLETON_COMPONENT_ERROR);
       }
       renderParams = this.setParameterDefaultValues(componentSign, renderParams);
+      this._merchantAppointParam = renderParams.merchantAppointParam;
       this._isInitComponent = true;
       this._renderParams = renderParams;
       this._componentSign = componentSign;
       if ((_renderParams = renderParams) !== null && _renderParams !== void 0 && _renderParams.selector) this._selector = renderParams.selector;
       this._renderDisplayType = renderParams.renderDisplayType;
-      this._merchantAppointParam = renderParams.merchantAppointParam;
       var insertedNode = this._renderDisplayType === renderDisplayTypeEnum.inline ? "#".concat(COMPONENT_CONTAINER_ID) : this._selector;
       this.initLoggerMeta();
       this.initSecurity();
@@ -386,10 +388,22 @@ var ComponentApp = /*#__PURE__*/function () {
   }, {
     key: "renderInlineLoading",
     value: function renderInlineLoading(renderParams, selector) {
-      var _renderParams$appeara;
+      var _renderParams$appeara, _this$_renderParams11;
       var showLoading = renderParams === null || renderParams === void 0 || (_renderParams$appeara = renderParams.appearance) === null || _renderParams$appeara === void 0 ? void 0 : _renderParams$appeara.showLoading;
       showLoading = typeof showLoading === 'boolean' ? showLoading : true;
-      if (showLoading) addInlineLoading(selector, this.platform);
+      var extendInfo = renderParams.paymentSessionMetaData.extendInfo;
+      var isExpressCheckout = false;
+      try {
+        // expressCheckout可能出现string(false) JSON.parse再转一次
+        isExpressCheckout = JSON.parse(JSON.parse(extendInfo).expressCheckout);
+      } catch (error) {
+        // 遇到JSON解析错误，默认false
+      }
+      if (showLoading) addInlineLoading(selector, this.platform, {
+        componentSign: this._componentSign,
+        type: (_this$_renderParams11 = this._renderParams) === null || _this$_renderParams11 === void 0 || (_this$_renderParams11 = _this$_renderParams11.appearance) === null || _this$_renderParams11 === void 0 || (_this$_renderParams11 = _this$_renderParams11.layout) === null || _this$_renderParams11 === void 0 ? void 0 : _this$_renderParams11.type,
+        isExpressCheckout: isExpressCheckout
+      });
     }
   }, {
     key: "renderPopupLoading",
@@ -426,9 +440,7 @@ var ComponentApp = /*#__PURE__*/function () {
   }, {
     key: "createActionQueryPromise",
     value: function createActionQueryPromise() {
-      var _this$_renderParams11,
-        _this5 = this;
-      var paymentMethodType = (_this$_renderParams11 = this._renderParams) === null || _this$_renderParams11 === void 0 || (_this$_renderParams11 = _this$_renderParams11.paymentSessionMetaData) === null || _this$_renderParams11 === void 0 || (_this$_renderParams11 = _this$_renderParams11.paymentMethodInfoView) === null || _this$_renderParams11 === void 0 ? void 0 : _this$_renderParams11.paymentMethodType;
+      var _this5 = this;
       this._performanceData.push({
         key: 'sdk_action_query_start',
         value: Date.now()
@@ -437,7 +449,7 @@ var ComponentApp = /*#__PURE__*/function () {
       this._actionQueryPromise = new Promise( /*#__PURE__*/function () {
         var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(resolve, reject) {
           var _this5$_renderParams, _this5$_renderParams2, _this5$_renderParams3, _this5$_renderParams4, _this5$_renderParams5, _this5$_renderParams6;
-          var envInfo, params, _ref6, _ref6$extendInfo, extendInfo, actionData, enableVaultingApiOptimize, enableEasypayApiOptimize, _ref7, skipSdkQuery, skipSdkQueryForm, extendInfoData, ifSkip, channelBehavior, _this5$_renderParams7, _this5$_renderParams8, _ref8, _ref8$productSceneVer, productSceneVersion, _ref8$productScene, productScene, _ref9, _ref9$action, _ref9$action2, _ref9$action2$autoDeb, autoDebitWithToken, _this5$_renderParams9, _action$web2, _action$wap2, action, signType;
+          var envInfo, params, _ref6, _ref6$extendInfo, extendInfo, actionData, enableVaultingApiOptimize, enableEasypayApiOptimize, _ref7, skipSdkQuery, skipSdkQueryForm, extendInfoData, ifSkip, channelBehavior, _this5$_renderParams7, _ref8, _ref8$productSceneVer, productSceneVersion, _ref8$productScene, productScene, _this5$_renderParams8, _action$web2, _action$wap2, action, signType;
           return _regeneratorRuntime().wrap(function _callee2$(_context2) {
             while (1) switch (_context2.prev = _context2.next) {
               case 0:
@@ -473,22 +485,35 @@ var ComponentApp = /*#__PURE__*/function () {
                   success: true
                 }));
               case 9:
+                if (componentSignEnum.ELEMENT_PAYMENT === _this5._componentSign) {
+                  params.paymentSessionConfig = handlePaymentSessionConfig(params.paymentSessionConfig);
+                }
+                /** 地址组件跳过接口查询 */
+                if (!(componentSignEnum.ELEMENT_ADDRESS === _this5._componentSign)) {
+                  _context2.next = 12;
+                  break;
+                }
+                return _context2.abrupt("return", resolve({
+                  message: 'sdk no need to make query request',
+                  success: true
+                }));
+              case 12:
                 if (!(componentSignEnum.VAULTING_CARD === _this5._componentSign)) {
-                  _context2.next = 21;
+                  _context2.next = 24;
                   break;
                 }
                 if (!enableVaultingApiOptimize) {
-                  _context2.next = 21;
+                  _context2.next = 24;
                   break;
                 }
                 if (!skipSdkQueryForm) {
-                  _context2.next = 18;
+                  _context2.next = 21;
                   break;
                 }
                 // 优先判断 skipSdkQueryForm
                 ifSkip = matchVersion(skipSdkQueryForm, _this5._appVersion);
                 if (!ifSkip) {
-                  _context2.next = 16;
+                  _context2.next = 19;
                   break;
                 }
                 resolve({
@@ -496,12 +521,12 @@ var ComponentApp = /*#__PURE__*/function () {
                   success: true
                 });
                 return _context2.abrupt("return");
-              case 16:
-                _context2.next = 21;
+              case 19:
+                _context2.next = 24;
                 break;
-              case 18:
+              case 21:
                 if (!skipSdkQuery) {
-                  _context2.next = 21;
+                  _context2.next = 24;
                   break;
                 }
                 resolve({
@@ -509,10 +534,10 @@ var ComponentApp = /*#__PURE__*/function () {
                   success: true
                 });
                 return _context2.abrupt("return");
-              case 21:
+              case 24:
                 channelBehavior = getChannelBehavior((_this5$_renderParams6 = _this5._renderParams) === null || _this5$_renderParams6 === void 0 ? void 0 : _this5$_renderParams6.paymentSessionMetaData); // Easypay TOSS 渠道无需actionQuery
                 if (!(channelBehavior !== null && channelBehavior !== void 0 && channelBehavior.usePaymentSessionAsQueryResult)) {
-                  _context2.next = 24;
+                  _context2.next = 27;
                   break;
                 }
                 return _context2.abrupt("return", resolve({
@@ -520,79 +545,78 @@ var ComponentApp = /*#__PURE__*/function () {
                   amountConfirmRequired: actionData === null || actionData === void 0 ? void 0 : actionData.amountConfirmRequired,
                   success: true
                 }));
-              case 24:
+              case 27:
                 if (!(componentSignEnum.CASHIER_PAYMENT_CARD === _this5._componentSign || componentSignEnum.VAULTING_CARD === _this5._componentSign)) {
-                  _context2.next = 30;
+                  _context2.next = 33;
                   break;
                 }
                 params.paymentMethodType = 'CARD';
-                _context2.next = 28;
+                _context2.next = 31;
                 return _this5.getDeviceIdAndLog();
-              case 28:
+              case 31:
                 envInfo.deviceId = _context2.sent;
                 if (window.navigator.userAgent.indexOf('miniProgram') > -1) {
                   envInfo.extendInfo = {
                     WAP_SUB_TYPE: 'WECHAT_MINI_PROGRAM'
                   };
                 }
-              case 30:
+              case 33:
                 if (!(componentSignEnum.EASY_PAY_WALLET === _this5._componentSign)) {
-                  _context2.next = 40;
+                  _context2.next = 42;
                   break;
                 }
                 _ref8 = params.paymentSessionConfig || {}, _ref8$productSceneVer = _ref8.productSceneVersion, productSceneVersion = _ref8$productSceneVer === void 0 ? '' : _ref8$productSceneVer, _ref8$productScene = _ref8.productScene, productScene = _ref8$productScene === void 0 ? '' : _ref8$productScene;
-                _ref9 = ((_this5$_renderParams7 = _this5._renderParams) === null || _this5$_renderParams7 === void 0 ? void 0 : _this5$_renderParams7.paymentSessionMetaData) || {}, _ref9$action = _ref9.action, _ref9$action2 = _ref9$action === void 0 ? {} : _ref9$action, _ref9$action2$autoDeb = _ref9$action2.autoDebitWithToken, autoDebitWithToken = _ref9$action2$autoDeb === void 0 ? false : _ref9$action2$autoDeb;
-                if (!((_this5$_renderParams8 = _this5._renderParams) !== null && _this5$_renderParams8 !== void 0 && (_this5$_renderParams8 = _this5$_renderParams8.paymentSessionMetaData) !== null && _this5$_renderParams8 !== void 0 && (_this5$_renderParams8 = _this5$_renderParams8.action) !== null && _this5$_renderParams8 !== void 0 && _this5$_renderParams8.skipSdkQuery && enableEasypayApiOptimize)) {
-                  _context2.next = 35;
+                if (!((_this5$_renderParams7 = _this5._renderParams) !== null && _this5$_renderParams7 !== void 0 && (_this5$_renderParams7 = _this5$_renderParams7.paymentSessionMetaData) !== null && _this5$_renderParams7 !== void 0 && (_this5$_renderParams7 = _this5$_renderParams7.action) !== null && _this5$_renderParams7 !== void 0 && _this5$_renderParams7.skipSdkQuery && enableEasypayApiOptimize)) {
+                  _context2.next = 37;
                   break;
                 }
                 return _context2.abrupt("return", resolve({
                   message: 'sdk no need to make query request',
                   success: true
                 }));
-              case 35:
+              case 37:
                 if (!(productScene === productSceneEnum.EASY_PAY && productSceneVersion === '2.0')) {
-                  _context2.next = 37;
+                  _context2.next = 39;
                   break;
                 }
                 return _context2.abrupt("return", resolve({
                   message: 'sdk no need to make query request',
                   success: true
                 }));
-              case 37:
-                _context2.next = 39;
-                return _this5.getDeviceIdAndLog();
               case 39:
+                _context2.next = 41;
+                return _this5.getDeviceIdAndLog();
+              case 41:
                 envInfo.deviceId = _context2.sent;
-              case 40:
+              case 42:
                 if (!(componentSignEnum.AUTO_DEBIT_WALLET === _this5._componentSign)) {
-                  _context2.next = 50;
+                  _context2.next = 52;
                   break;
                 }
-                action = ((_this5$_renderParams9 = _this5._renderParams) === null || _this5$_renderParams9 === void 0 || (_this5$_renderParams9 = _this5$_renderParams9.paymentSessionMetaData) === null || _this5$_renderParams9 === void 0 ? void 0 : _this5$_renderParams9.action) || {};
+                action = ((_this5$_renderParams8 = _this5._renderParams) === null || _this5$_renderParams8 === void 0 || (_this5$_renderParams8 = _this5$_renderParams8.paymentSessionMetaData) === null || _this5$_renderParams8 === void 0 ? void 0 : _this5$_renderParams8.action) || {};
                 signType = isPC() ? action === null || action === void 0 || (_action$web2 = action.web) === null || _action$web2 === void 0 ? void 0 : _action$web2.signType : action === null || action === void 0 || (_action$wap2 = action.wap) === null || _action$wap2 === void 0 ? void 0 : _action$wap2.signType;
                 if (!(signType === 'SMS')) {
-                  _context2.next = 45;
+                  _context2.next = 47;
                   break;
                 }
                 return _context2.abrupt("return", resolve({
                   message: 'sdk no need to make query request',
                   success: true
                 }));
-              case 45:
+              case 47:
                 if (!(!signType || signType !== 'REDIRECT')) {
-                  _context2.next = 47;
+                  _context2.next = 49;
                   break;
                 }
                 return _context2.abrupt("return", resolve({
                   success: false
                 }));
-              case 47:
-                _context2.next = 49;
-                return _this5.getDeviceIdAndLog();
               case 49:
+                _context2.next = 51;
+                return _this5.getDeviceIdAndLog();
+              case 51:
                 envInfo.deviceId = _context2.sent;
-              case 50:
+              case 52:
                 _this5.AMSSDK.logger.logInfo({
                   title: 'sdk_event_sdkQuery'
                 }, {
@@ -631,7 +655,7 @@ var ComponentApp = /*#__PURE__*/function () {
                   }).send();
                   reject(err);
                 });
-              case 52:
+              case 54:
               case "end":
                 return _context2.stop();
             }
@@ -663,12 +687,21 @@ var ComponentApp = /*#__PURE__*/function () {
       var channelBehavior = getChannelBehavior((_this$_renderParams14 = this._renderParams) === null || _this$_renderParams14 === void 0 ? void 0 : _this$_renderParams14.paymentSessionMetaData);
       // eslint-disable-next-line no-async-promise-executor
       this._actionSubmitPromise = new Promise( /*#__PURE__*/function () {
-        var _ref10 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(resolve) {
+        var _ref9 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(resolve) {
           var _channelBehavior$buil, _this6$_renderParams$;
-          var shouldSkipSubmitPayInSDK, _this6$_renderParams, _this6$_renderParams2, _ref11, _ref11$productSceneVe, productSceneVersion, _ref11$productScene, productScene, _ref12, _ref12$action, _ref12$action2, _ref12$action2$enable, enableSignAgreement, _ref12$action2$autoDe, autoDebitWithToken, extParams;
+          var shouldSkipSubmitPayInSDK, _this6$_renderParams, _this6$_renderParams2, _ref10, _ref10$productSceneVe, productSceneVersion, _ref10$productScene, productScene, _ref11, _ref11$action, _ref11$action2, _ref11$action2$enable, enableSignAgreement, _ref11$action2$autoDe, autoDebitWithToken, extParams;
           return _regeneratorRuntime().wrap(function _callee3$(_context3) {
             while (1) switch (_context3.prev = _context3.next) {
               case 0:
+                if (!(_this6.AMSSDK.options.product === productSceneEnum.ELEMENT_ADDRESS)) {
+                  _context3.next = 2;
+                  break;
+                }
+                return _context3.abrupt("return", resolve({
+                  message: 'sdk no need to make submitPay request',
+                  success: true
+                }));
+              case 2:
                 shouldSkipSubmitPayInSDK = false;
                 if (channelBehavior) {
                   // 新逻辑走 channelBehavior判断
@@ -677,8 +710,8 @@ var ComponentApp = /*#__PURE__*/function () {
                   shouldSkipSubmitPayInSDK = !((_this6$_renderParams = _this6._renderParams) !== null && _this6$_renderParams !== void 0 && (_this6$_renderParams = _this6$_renderParams.paymentSessionMetaData) !== null && _this6$_renderParams !== void 0 && (_this6$_renderParams = _this6$_renderParams.action) !== null && _this6$_renderParams !== void 0 && _this6$_renderParams.skipSdkQuery) || componentSignEnum.EASY_PAY_WALLET !== _this6._componentSign;
                 }
                 if (componentSignEnum.EASY_PAY_WALLET === _this6._componentSign) {
-                  _ref11 = params.paymentSessionConfig || {}, _ref11$productSceneVe = _ref11.productSceneVersion, productSceneVersion = _ref11$productSceneVe === void 0 ? '' : _ref11$productSceneVe, _ref11$productScene = _ref11.productScene, productScene = _ref11$productScene === void 0 ? '' : _ref11$productScene;
-                  _ref12 = ((_this6$_renderParams2 = _this6._renderParams) === null || _this6$_renderParams2 === void 0 ? void 0 : _this6$_renderParams2.paymentSessionMetaData) || {}, _ref12$action = _ref12.action, _ref12$action2 = _ref12$action === void 0 ? {} : _ref12$action, _ref12$action2$enable = _ref12$action2.enableSignAgreement, enableSignAgreement = _ref12$action2$enable === void 0 ? false : _ref12$action2$enable, _ref12$action2$autoDe = _ref12$action2.autoDebitWithToken, autoDebitWithToken = _ref12$action2$autoDe === void 0 ? false : _ref12$action2$autoDe;
+                  _ref10 = params.paymentSessionConfig || {}, _ref10$productSceneVe = _ref10.productSceneVersion, productSceneVersion = _ref10$productSceneVe === void 0 ? '' : _ref10$productSceneVe, _ref10$productScene = _ref10.productScene, productScene = _ref10$productScene === void 0 ? '' : _ref10$productScene;
+                  _ref11 = ((_this6$_renderParams2 = _this6._renderParams) === null || _this6$_renderParams2 === void 0 ? void 0 : _this6$_renderParams2.paymentSessionMetaData) || {}, _ref11$action = _ref11.action, _ref11$action2 = _ref11$action === void 0 ? {} : _ref11$action, _ref11$action2$enable = _ref11$action2.enableSignAgreement, enableSignAgreement = _ref11$action2$enable === void 0 ? false : _ref11$action2$enable, _ref11$action2$autoDe = _ref11$action2.autoDebitWithToken, autoDebitWithToken = _ref11$action2$autoDe === void 0 ? false : _ref11$action2$autoDe;
                   if (productScene === productSceneEnum.EASY_PAY && productSceneVersion === '2.0' && !autoDebitWithToken) {
                     ///EasyPay 2.0 首次传signAgreement字段
                     params['signAgreement'] = enableSignAgreement;
@@ -687,14 +720,14 @@ var ComponentApp = /*#__PURE__*/function () {
                 // 带上标记告知WebCheckOut SDK已发送submitpay请求
                 _this6._allowSubmitPayCallAhead = !shouldSkipSubmitPayInSDK;
                 if (!shouldSkipSubmitPayInSDK) {
-                  _context3.next = 6;
+                  _context3.next = 8;
                   break;
                 }
                 return _context3.abrupt("return", resolve({
                   message: 'sdk no need to make submitPay request',
                   success: true
                 }));
-              case 6:
+              case 8:
                 _this6.AMSSDK.logger.logInfo({
                   title: 'sdk_event_submitPay'
                 }, {
@@ -713,9 +746,9 @@ var ComponentApp = /*#__PURE__*/function () {
                 _context3.t0 = submitPayInfo;
                 _context3.t1 = params;
                 _context3.t2 = _this6.AMSSDK.options.env.environment;
-                _context3.next = 14;
+                _context3.next = 16;
                 return _this6.getDeviceIdAndLog();
-              case 14:
+              case 16:
                 _context3.t3 = _context3.sent;
                 _context3.t4 = {
                   deviceId: _context3.t3
@@ -749,14 +782,14 @@ var ComponentApp = /*#__PURE__*/function () {
                     success: false
                   });
                 });
-              case 19:
+              case 21:
               case "end":
                 return _context3.stop();
             }
           }, _callee3);
         }));
         return function (_x3) {
-          return _ref10.apply(this, arguments);
+          return _ref9.apply(this, arguments);
         };
       }());
     }
@@ -797,19 +830,17 @@ var ComponentApp = /*#__PURE__*/function () {
     value: function createPreloadApp(componentSign) {
       var productSceneVersion = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '1.0';
       var preloadIframe = createPreloadIframe(componentSign, productSceneVersion);
+      var productScene = componentSign.split(/_(?=[^_]*$)/)[0];
       var _getIframeUrl = getIframeUrl({
           renderDisplayType: renderDisplayTypeEnum.popup,
           componentSign: componentSign,
           analytics: {
             enabled: false
           },
-          productScene: componentSign,
+          productScene: productScene,
           productSceneVersion: productSceneVersion,
           environment: this.AMSSDK.options.env.environment,
-          // TODO 确定一下这个参数是干啥的
           appVersion: this._appVersion,
-          extendInfo: '',
-          locale: '',
           instanceId: '',
           isPreload: 'true',
           mid: ''
@@ -933,7 +964,7 @@ var ComponentApp = /*#__PURE__*/function () {
     key: "createDialog",
     value: function () {
       var _createDialog = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(data) {
-        var pageUrl, isLoad, timeout, logTimeout;
+        var pageUrl, _data$device, isLoad, timeout, logTimeout;
         return _regeneratorRuntime().wrap(function _callee4$(_context4) {
           while (1) switch (_context4.prev = _context4.next) {
             case 0:
@@ -943,8 +974,8 @@ var ComponentApp = /*#__PURE__*/function () {
               _context4.next = 5;
               return createModal({
                 widthPadding: data === null || data === void 0 ? void 0 : data.widthPadding,
-                heightPadding: data === null || data === void 0 ? void 0 : data.heightPadding,
-                device: this.platform,
+                device: (_data$device = data === null || data === void 0 ? void 0 : data.device) !== null && _data$device !== void 0 ? _data$device : this.platform,
+                loadingConfig: data === null || data === void 0 ? void 0 : data.loadingConfig,
                 url: pageUrl
               });
             case 5:
@@ -963,6 +994,7 @@ var ComponentApp = /*#__PURE__*/function () {
               }, POPUP_LOADTIME_LOG_LIMIT);
               this.popupApp.onload = function () {
                 isLoad = true;
+                removePopupLoading();
                 clearTimeout(timeout);
                 clearTimeout(logTimeout);
               };
@@ -1212,6 +1244,25 @@ var ComponentApp = /*#__PURE__*/function () {
         this.handleAppHeartBeat();
         return;
       }
+      if (data.context.event === EVENT.beforeSubmit.name) {
+        var _this$AMSSDK$_eventCe;
+        if ((_this$AMSSDK$_eventCe = this.AMSSDK._eventCenter) !== null && _this$AMSSDK$_eventCe !== void 0 && _this$AMSSDK$_eventCe.isExist(EVENT.beforeSubmit.name)) {
+          this.AMSSDK._eventCenter.emit(EVENT.beforeSubmit.name, data.context.data);
+          return;
+        }
+        // 不存在事件，默认通过
+        var eventCallbackId = uuid();
+        this.dispatchToApp({
+          context: {
+            event: EVENT.beforeSubmitDone.name,
+            eventCallbackId: eventCallbackId,
+            data: {
+              result: 'IGNORE'
+            }
+          }
+        });
+        return;
+      }
       if (data.context.event === EVENT.eventCallback.name) {
         this.AMSSDK.logger.logInfo({
           title: 'sdk_event_event_callback'
@@ -1255,9 +1306,8 @@ var ComponentApp = /*#__PURE__*/function () {
 
           // 此style用于弹窗出现和高度变化时动画，动画不同，属性不同
           this.app.style.height = parseInt(this.app.style.height) > 0 ? '100%' : "".concat(data.context.data.height, "px");
-
           // 弹出和弹入动画
-          var runkeyframes = "@keyframes ".concat(COMPONENT_CONTAINER_ID, "-slide-in {\n          0% {\n            height: 1px;\n          }\n          100% {\n            height: ").concat(data.context.data.height, "px;\n          }\n        }\n        @keyframes ").concat(COMPONENT_CONTAINER_ID, "-slide-out {\n          0% {\n            height: ").concat(data.context.data.height, "px;\n            opacity: 1;\n          }\n          50% {\n            opacity: 1;\n          }\n          100% {\n            height: 1px;\n            opacity: 0;\n          }\n        }");
+          var runkeyframes = slideInAndOutKeyframes(COMPONENT_CONTAINER_ID, data.context.data.height);
           // 创建style标签
           var style = document.createElement('style');
           style.id = animationStyleId;
@@ -1267,7 +1317,6 @@ var ComponentApp = /*#__PURE__*/function () {
           style.innerHTML = runkeyframes;
           // 将style样式存放到head标签
           document.getElementsByTagName('head')[0].appendChild(style);
-
           // size变动时动画
           setTimeout(function () {
             cashier.style.transition = 'height 0.28s ease-in-out';
@@ -1387,9 +1436,9 @@ var ComponentApp = /*#__PURE__*/function () {
     }
   }, {
     key: "handleDeclareInfo",
-    value: function handleDeclareInfo(_ref13) {
-      var _ref13$closeDialogDat = _ref13.closeDialogData,
-        closeDialogData = _ref13$closeDialogDat === void 0 ? {} : _ref13$closeDialogDat;
+    value: function handleDeclareInfo(_ref12) {
+      var _ref12$closeDialogDat = _ref12.closeDialogData,
+        closeDialogData = _ref12$closeDialogDat === void 0 ? {} : _ref12$closeDialogDat;
       _handleDeclareInfo({
         closeDialogData: closeDialogData
       });
@@ -1530,24 +1579,25 @@ var ComponentApp = /*#__PURE__*/function () {
     key: "sendRenderEvent",
     value: (function () {
       var _sendRenderEvent = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee8() {
-        var _this$_renderParams15, _this$_renderParams16, _this$_renderParams17, _this$_renderParams18, _this$_renderParams19, _this$_renderParams20, _this$AMSSDK$logger, _this$_renderParams21, _this$_renderParams22, _this$_renderParams23, _this$AMSSDK, _this$_renderParams24, res, submitRes;
+        var _this$_renderParams15, _this$_renderParams16, _this$_renderParams17, _this$_renderParams18, _this$_renderParams19, _this$_renderParams20, _this$_renderParams21, _this$_renderParams22, _this$_renderParams23, _this$AMSSDK$logger, _this$_renderParams24, _this$_renderParams25, _this$_renderParams26, _this$AMSSDK, _this$_renderParams27, isAddressElement, res, submitRes;
         return _regeneratorRuntime().wrap(function _callee8$(_context8) {
           while (1) switch (_context8.prev = _context8.next) {
             case 0:
               _context8.prev = 0;
-              if (!(!this._actionQueryPromise || !this._actionSubmitPromise)) {
-                _context8.next = 3;
+              isAddressElement = this.AMSSDK.options.product === productSceneEnum.ELEMENT_ADDRESS;
+              if (!((!this._actionQueryPromise || !this._actionSubmitPromise) && !isAddressElement)) {
+                _context8.next = 4;
                 break;
               }
               return _context8.abrupt("return");
-            case 3:
-              _context8.next = 5;
+            case 4:
+              _context8.next = 6;
               return this._actionQueryPromise;
-            case 5:
+            case 6:
               res = _context8.sent;
-              _context8.next = 8;
+              _context8.next = 9;
               return this._actionSubmitPromise;
-            case 8:
+            case 9:
               submitRes = _context8.sent;
               this._performanceData.push({
                 key: 'sdk_render_component',
@@ -1567,21 +1617,25 @@ var ComponentApp = /*#__PURE__*/function () {
                     notRedirectAfterComplete: ((_this$_renderParams19 = this._renderParams) === null || _this$_renderParams19 === void 0 ? void 0 : _this$_renderParams19.notRedirectAfterComplete) === true,
                     merchantAppointParam: this._merchantAppointParam,
                     allowSubmitPayCallAhead: this._allowSubmitPayCallAhead,
+                    /** 地址组件集成的参数 */
+                    configParams: (_this$_renderParams20 = this._renderParams) === null || _this$_renderParams20 === void 0 ? void 0 : _this$_renderParams20.configParams,
+                    prefillValue: (_this$_renderParams21 = this._renderParams) === null || _this$_renderParams21 === void 0 ? void 0 : _this$_renderParams21.prefillValue,
+                    componentSession: (_this$_renderParams22 = this._renderParams) === null || _this$_renderParams22 === void 0 ? void 0 : _this$_renderParams22.componentSession,
                     envInfo: {
                       screenHeight: screen.height,
                       screenWidth: screen.width
                     },
                     logMetaData: _objectSpread(_objectSpread({
-                      trackId: (_this$_renderParams20 = this._renderParams) === null || _this$_renderParams20 === void 0 ? void 0 : _this$_renderParams20.sessionData,
+                      trackId: (_this$_renderParams23 = this._renderParams) === null || _this$_renderParams23 === void 0 ? void 0 : _this$_renderParams23.sessionData,
                       platform: this.platform,
                       firstLogTime: (_this$AMSSDK$logger = this.AMSSDK.logger) === null || _this$AMSSDK$logger === void 0 ? void 0 : _this$AMSSDK$logger.getComponentStartTime()
-                    }, ((_this$_renderParams21 = this._renderParams) === null || _this$_renderParams21 === void 0 || (_this$_renderParams21 = _this$_renderParams21.paymentSessionMetaData) === null || _this$_renderParams21 === void 0 ? void 0 : _this$_renderParams21.paymentSessionConfig) || {}), {}, {
-                      renderDisplayType: (_this$_renderParams22 = this._renderParams) === null || _this$_renderParams22 === void 0 ? void 0 : _this$_renderParams22.renderDisplayType,
+                    }, ((_this$_renderParams24 = this._renderParams) === null || _this$_renderParams24 === void 0 || (_this$_renderParams24 = _this$_renderParams24.paymentSessionMetaData) === null || _this$_renderParams24 === void 0 ? void 0 : _this$_renderParams24.paymentSessionConfig) || {}), {}, {
+                      renderDisplayType: (_this$_renderParams25 = this._renderParams) === null || _this$_renderParams25 === void 0 ? void 0 : _this$_renderParams25.renderDisplayType,
                       sdkVersion: this._appVersion,
-                      merchantId: (_this$_renderParams23 = this._renderParams) === null || _this$_renderParams23 === void 0 || (_this$_renderParams23 = _this$_renderParams23.paymentSessionMetaData) === null || _this$_renderParams23 === void 0 ? void 0 : _this$_renderParams23.clientId,
+                      merchantId: (_this$_renderParams26 = this._renderParams) === null || _this$_renderParams26 === void 0 || (_this$_renderParams26 = _this$_renderParams26.paymentSessionMetaData) === null || _this$_renderParams26 === void 0 ? void 0 : _this$_renderParams26.clientId,
                       instanceId: (_this$AMSSDK = this.AMSSDK) === null || _this$AMSSDK === void 0 ? void 0 : _this$AMSSDK._instanceId,
                       performanceData: this._performanceData,
-                      paymentMethodType: (_this$_renderParams24 = this._renderParams) === null || _this$_renderParams24 === void 0 || (_this$_renderParams24 = _this$_renderParams24.paymentSessionMetaData) === null || _this$_renderParams24 === void 0 || (_this$_renderParams24 = _this$_renderParams24.paymentMethodInfoView) === null || _this$_renderParams24 === void 0 ? void 0 : _this$_renderParams24.paymentMethodType
+                      paymentMethodType: (_this$_renderParams27 = this._renderParams) === null || _this$_renderParams27 === void 0 || (_this$_renderParams27 = _this$_renderParams27.paymentSessionMetaData) === null || _this$_renderParams27 === void 0 || (_this$_renderParams27 = _this$_renderParams27.paymentMethodInfoView) === null || _this$_renderParams27 === void 0 ? void 0 : _this$_renderParams27.paymentMethodType
                     })
                   }
                 }
@@ -1598,16 +1652,16 @@ var ComponentApp = /*#__PURE__*/function () {
                 }
               });
               // eslint-disable-next-line no-empty
-              _context8.next = 17;
+              _context8.next = 18;
               break;
-            case 15:
-              _context8.prev = 15;
+            case 16:
+              _context8.prev = 16;
               _context8.t0 = _context8["catch"](0);
-            case 17:
+            case 18:
             case "end":
               return _context8.stop();
           }
-        }, _callee8, this, [[0, 15]]);
+        }, _callee8, this, [[0, 16]]);
       }));
       function sendRenderEvent() {
         return _sendRenderEvent.apply(this, arguments);
@@ -1641,8 +1695,9 @@ var ComponentApp = /*#__PURE__*/function () {
   }, {
     key: "hideComponentAnimation",
     value: function hideComponentAnimation() {
+      var _container$style;
       var container = document.getElementById(COMPONENT_CONTAINER_ID);
-      if (this.app) this.app.style.height = container.style.height;
+      if (this.app) this.app.style.height = container === null || container === void 0 || (_container$style = container.style) === null || _container$style === void 0 ? void 0 : _container$style.height;
       if (container) {
         // size变化动画取消
         container.style.transition = '';

package/esm/plugin/component/popupWindow.style.d.ts

@@ -1,8 +1,11 @@
+export declare const createCustomSheet: (curTheme?: 'dark' | 'light') => void;
+export declare const renderPopupLoading: (container: HTMLDivElement, curTheme: 'dark' | 'light') => void;
+export declare const removePopupLoading: (isShowMockup?: boolean) => void;
 export declare const insertStyleSheet: () => void;
-export declare const createModal: ({ device, url, widthPadding, heightPadding }: {
+export declare const createModal: ({ device, url, widthPadding, loadingConfig }: {
     device: any;
     url: any;
     widthPadding: any;
-    heightPadding: any;
+    loadingConfig: any;
 }) => Promise<HTMLIFrameElement>;
 export declare const destroyModal: () => void;