@alipay/ams-checkout 2.0.19 → 2.0.21

package/esm/config/index.d.ts

@@ -1,3 +1,10 @@
+/**
+ * Copyright (c) 2022 International Business Group, Ant Group. All rights reserved.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), the rights to use, copy, modify, merge, and/or distribute the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+ * 1. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE; and
+ * 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.
+ */
 export declare const marmotMap: Record<string, string>;
 export declare const marmotConfigMap: Record<string, string>;
 export declare const v2AppMarmotMap: Record<string, string>;

package/esm/config/index.js

@@ -5,7 +5,7 @@
  * 1. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE; and
  * 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.
  */
-import json from "../../package.json";
+
 export var marmotMap = {
   dev: 'http://page.alipay.net/page/antom-web-checkout/src/component-app',
   sit: 'http://page.test.alipay.net/page/antom-web-checkout/src/component-app',
@@ -30,7 +30,7 @@ export var v2AppMarmotMap = {
   light_sandbox: 'https://checkout.antom.com',
   prod: 'https://checkout.antom.com'
 };
-export var sdkVersion = json.version;
+export var sdkVersion = "2.0.21";
 
 /**
  * @description: 目前应用层分为v1和v2，会存在两个应用版本号不是同步发布的情况。所以需要把默认的应用版本号配置抽离出来。

package/esm/constant/element.d.ts

@@ -22,5 +22,6 @@ export declare enum ELEMENT_PAGE_URL {
     INSTRUCTION_GUIDE = "/elements/pages/instruction-guide/index.html",
     THREED_PAGE = "/elements/pages/threed-page/index.html",
     ELEMENT_AUTH = "/auth-element/pages/element_auth/index.html",
-    ADDRESS = "/element-address/pages/address/index.html"
+    ADDRESS = "/element-address/pages/address/index.html",
+    NEW_ELEMENT_PAYMENT = "/elements2/pages/element_payment/index.html"
 }

package/esm/constant/element.js

@@ -26,5 +26,6 @@ export var ELEMENT_PAGE_URL = /*#__PURE__*/function (ELEMENT_PAGE_URL) {
   ELEMENT_PAGE_URL["THREED_PAGE"] = "/elements/pages/threed-page/index.html";
   ELEMENT_PAGE_URL["ELEMENT_AUTH"] = "/auth-element/pages/element_auth/index.html";
   ELEMENT_PAGE_URL["ADDRESS"] = "/element-address/pages/address/index.html";
+  ELEMENT_PAGE_URL["NEW_ELEMENT_PAYMENT"] = "/elements2/pages/element_payment/index.html";
   return ELEMENT_PAGE_URL;
 }({});

package/esm/constant/index.d.ts

@@ -325,24 +325,7 @@ export declare const LOADINGIMG = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgA
 /**
  * @description Promise回调code映射
  */
-export declare const PROMISE_CALLBACK_CODE: {
-    SUCCESS: {
-        code: string;
-    };
-    UNKNOWN_EXCEPTION: {
-        code: string;
-        message: string;
-    };
-    REPEAT_REQ_REJECT: {
-        code: string;
-        message: string;
-    };
-    PROCESS_FAIL: {
-        code: string;
-        message: string;
-    };
-    INQUIRY_PAYMENT_SESSION_FAILED: {
-        code: string;
-        message: string;
-    };
-};
+export declare const PROMISE_CALLBACK_CODE: Record<string, {
+    code: string;
+    message?: string;
+}>;

package/esm/core/component/ckp/index.d.ts

@@ -20,7 +20,7 @@ export declare class AMSCheckoutPage {
     /**
      * 挂载组件
      */
-    mountComponent(params: Pick<IcreateComponent, 'sessionData'>, selector: string): Promise<void>;
+    mountComponent(params: Pick<IcreateComponent, 'sessionData' | 'isDemoMode'>, selector: string): Promise<void>;
     /**
      * 卸载组件
      */

package/esm/core/component/ckp/index.js

@@ -50,7 +50,7 @@ export var AMSCheckoutPage = /*#__PURE__*/function () {
     _defineProperty(this, "originOptions", void 0);
     _defineProperty(this, "APP_IFRAME_ID", 'antom-checkout-page-sub-page-iframe');
     _defineProperty(this, "eventListener", void 0);
-    _defineProperty(this, "generateIframeSrc", function (sessionData) {
+    _defineProperty(this, "generateIframeSrc", function (sessionData, isDemoMode) {
       var env = _this.originOptions.environment || 'prod';
       var session = sessionData || '';
       var lang = _this.originOptions.locale || 'en_US';
@@ -66,6 +66,9 @@ export var AMSCheckoutPage = /*#__PURE__*/function () {
       if (env === 'sandbox') {
         queryObj.shadow = 'true';
       }
+      if (isDemoMode) {
+        queryObj.demoMode = 'true';
+      }
       Object.keys(queryObj).forEach(function (key) {
         url += "".concat(url.includes('?') ? '&' : '?').concat(key, "=").concat(encodeURIComponent(queryObj[key]));
       });
@@ -177,7 +180,7 @@ export var AMSCheckoutPage = /*#__PURE__*/function () {
         throw new Error('PARAMS_ERROR_ALREADY_MOUNTED');
       }
       this.addListener();
-      var ckpPageAddress = this.generateIframeSrc(params.sessionData);
+      var ckpPageAddress = this.generateIframeSrc(params.sessionData, params.isDemoMode);
       var iframe = document.createElement('iframe');
       iframe.id = this.APP_IFRAME_ID;
       iframe.src = ckpPageAddress;

package/esm/core/component/element/elementController/index.d.ts

@@ -1,5 +1,5 @@
-import { AddressMountOptions, EventDataMap, EVENTNAME, ICommonApiResponse, IElementOptions, IPaymentApiResponse, LinkAuthMountOptions, PaymentMountOptions, SubmitFuncParams } from '../type';
-declare class ElementController {
+import { AddressMountOptions, EventDataMap, EVENTNAME, ICommonApiResponse, IElementController, IElementOptions, IPaymentApiResponse, LinkAuthMountOptions, PaymentMountOptions, SubmitFuncParams } from '../type';
+declare class ElementController implements IElementController {
     private options;
     private elementContainer;
     private serviceMap;
@@ -44,7 +44,7 @@ declare class ElementController {
     private getErrorFromResponse;
     private areAllContainersReady;
     private sendReady;
-    updatePayment(paymentSessionData: any): Promise<unknown>;
+    updatePayment(paymentSessionData: string): Promise<boolean>;
     private destroyHandle;
     destroy(): void;
     private setControllerStatusOrView;

package/esm/core/component/element/elementController/index.js

@@ -37,7 +37,7 @@ import { ServiceProvider } from "../../../../foundation/service";
 import { convertPaymentSession } from "../../../../foundation/utils/payment_context_utils";
 import { ProductSceneEnum } from "../../../../types";
 import { ELEMENT_SPM_MAP } from "../../../../util/spm-map";
-import { executeWithTimeout, BEFORE_CONFIRM_TIMEOUT_MS } from "../../../../util/beforeConfirm";
+import { executeWithTimeout, BEFORE_CONFIRM_TIMEOUT_MS, MERCHANT_CONFIRM_ABORT_CODE, MERCHANT_CONFIRM_TIMEOUT_CODE } from "../../../../util/beforeConfirm";
 import { ElementContainerService } from "../elementContainerService"; // 引入 ElementContainerService
 import { IContainerStatus } from "../elementContainerService/containerService";
 import { EventCenter as ElementEventCenter } from "../EventCenter/index";
@@ -233,6 +233,7 @@ var ElementController = /*#__PURE__*/function () {
   }, {
     key: "initializeAndMountProcessor",
     value: function initializeAndMountProcessor(type, selector, options) {
+      var _this$serviceMap$Log, _options$appearance;
       this.initElementProcessors(type);
       // 创建 iframe，拉起应用页面，同时监听全局的数据更新和获取事件
       this.elementContainerService.mount({
@@ -248,6 +249,12 @@ var ElementController = /*#__PURE__*/function () {
       ServiceProvider.getInstance(newInstanceId).update(paymentContext);
       // 更新埋点service
       this.serviceMap.Log = ServiceProvider.getInstance(newInstanceId).getService('Log');
+      (_this$serviceMap$Log = this.serviceMap.Log) === null || _this$serviceMap$Log === void 0 || _this$serviceMap$Log.logInfo({
+        title: 'sdk_event_appearance'
+      }, {
+        variables: options !== null && options !== void 0 && (_options$appearance = options.appearance) !== null && _options$appearance !== void 0 && _options$appearance.variables ? true : false,
+        theme: options === null || options === void 0 ? void 0 : options.theme
+      });
       this.elementProcessors[type].beforeMount();
     }
     // 处理业务流程启动失败
@@ -375,7 +382,7 @@ var ElementController = /*#__PURE__*/function () {
     value: function () {
       var _submitPayment = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee4(submitParams) {
         var _this3 = this;
-        var startEventId, res, logParams, isApplePay, paymentMethodType, startTime, _yield$executeWithTim, shouldContinue, timedOut, recordResult, _recordResult, _recordResult2, _recordResult3, _recordResult4, _recordResult5, _logParams;
+        var startEventId, res, logParams, isApplePay, paymentMethodType, startTime, _yield$executeWithTim, shouldContinue, timedOut, isTimeout, recordResult, _recordResult, _recordResult2, _recordResult3, _recordResult4, _recordResult5, _logParams;
         return _regeneratorRuntime().wrap(function _callee4$(_context4) {
           while (1) switch (_context4.prev = _context4.next) {
             case 0:
@@ -405,7 +412,7 @@ var ElementController = /*#__PURE__*/function () {
               isApplePay = this.currentPaymentMethodType === 'APPLEPAY';
               paymentMethodType = this.currentPaymentMethodType || 'UNKNOWN';
               if (!(submitParams !== null && submitParams !== void 0 && submitParams.onBeforeConfirm && !isApplePay)) {
-                _context4.next = 34;
+                _context4.next = 40;
                 break;
               }
               this.serviceMap.Log.logInfo({
@@ -424,49 +431,65 @@ var ElementController = /*#__PURE__*/function () {
               _yield$executeWithTim = _context4.sent;
               shouldContinue = _yield$executeWithTim.result;
               timedOut = _yield$executeWithTim.timedOut;
-              if (!(timedOut || !shouldContinue || Date.now() - startTime >= BEFORE_CONFIRM_TIMEOUT_MS)) {
-                _context4.next = 23;
+              isTimeout = timedOut || Date.now() - startTime >= BEFORE_CONFIRM_TIMEOUT_MS;
+              if (!isTimeout) {
+                _context4.next = 24;
                 break;
               }
-              if (timedOut) {
-                this.serviceMap.Log.logError({
-                  title: 'sdk_before_confirm_timeout'
-                }, {
-                  paymentMethodType: paymentMethodType,
-                  path: 'nonApplePay_sync'
-                });
-              } else {
-                this.serviceMap.Log.logInfo({
-                  title: 'sdk_before_confirm_abort'
-                }, {
-                  paymentMethodType: paymentMethodType,
-                  path: 'nonApplePay_sync'
-                });
+              this.serviceMap.Log.logError({
+                title: 'sdk_before_confirm_timeout'
+              }, {
+                paymentMethodType: paymentMethodType,
+                path: 'nonApplePay_sync'
+              });
+              this.changeLoading(false);
+              this.elementEventCenter.endEvent(startEventId, {
+                eventCode: PaymentStatus.FAIL,
+                errorName: MERCHANT_CONFIRM_TIMEOUT_CODE
+              });
+              return _context4.abrupt("return", {
+                status: PaymentStatus.FAIL,
+                error: {
+                  code: MERCHANT_CONFIRM_TIMEOUT_CODE,
+                  message: 'Merchant confirmation timed out.',
+                  needChangeSessionForRetry: false
+                }
+              });
+            case 24:
+              if (shouldContinue) {
+                _context4.next = 29;
+                break;
               }
+              this.serviceMap.Log.logInfo({
+                title: 'sdk_before_confirm_abort'
+              }, {
+                paymentMethodType: paymentMethodType,
+                path: 'nonApplePay_sync'
+              });
               this.changeLoading(false);
               this.elementEventCenter.endEvent(startEventId, {
                 eventCode: PaymentStatus.FAIL,
-                errorName: 'MERCHANT_CONFIRM_ABORT'
+                errorName: MERCHANT_CONFIRM_ABORT_CODE
               });
               return _context4.abrupt("return", {
                 status: PaymentStatus.FAIL,
                 error: {
-                  code: 'MERCHANT_CONFIRM_ABORT',
-                  message: 'Merchant canceled payment.',
+                  code: MERCHANT_CONFIRM_ABORT_CODE,
+                  message: 'Payment was cancelled by merchant before confirmation.',
                   needChangeSessionForRetry: false
                 }
               });
-            case 23:
+            case 29:
               this.serviceMap.Log.logInfo({
                 title: 'sdk_before_confirm_success'
               }, {
                 paymentMethodType: paymentMethodType,
                 path: 'nonApplePay_sync'
               });
-              _context4.next = 32;
+              _context4.next = 38;
               break;
-            case 26:
-              _context4.prev = 26;
+            case 32:
+              _context4.prev = 32;
               _context4.t0 = _context4["catch"](11);
               this.serviceMap.Log.logError({
                 title: 'sdk_before_confirm_error'
@@ -478,20 +501,20 @@ var ElementController = /*#__PURE__*/function () {
               this.changeLoading(false);
               this.elementEventCenter.endEvent(startEventId, {
                 eventCode: PaymentStatus.FAIL,
-                errorName: 'MERCHANT_CONFIRM_ABORT'
+                errorName: MERCHANT_CONFIRM_ABORT_CODE
               });
               return _context4.abrupt("return", {
                 status: PaymentStatus.FAIL,
                 error: {
-                  code: 'MERCHANT_CONFIRM_ABORT',
-                  message: 'Merchant canceled payment.',
+                  code: MERCHANT_CONFIRM_ABORT_CODE,
+                  message: 'Payment was cancelled by merchant before confirmation.',
                   needChangeSessionForRetry: false
                 }
               });
-            case 32:
-              _context4.next = 35;
+            case 38:
+              _context4.next = 41;
               break;
-            case 34:
+            case 40:
               if (!(submitParams !== null && submitParams !== void 0 && submitParams.onBeforeConfirm)) {
                 this.serviceMap.Log.logInfo({
                   title: 'sdk_before_confirm_skip'
@@ -500,10 +523,10 @@ var ElementController = /*#__PURE__*/function () {
                   path: isApplePay ? 'applePay_eventBridge' : 'nonApplePay_sync'
                 });
               }
-            case 35:
+            case 41:
               recordResult = null;
-              _context4.prev = 36;
-              _context4.next = 39;
+              _context4.prev = 42;
+              _context4.next = 45;
               return new Promise( /*#__PURE__*/function () {
                 var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(resolve) {
                   var that, recordResultCallback, params, processStep, hasBeforeConfirmForApplePay, hasAmount, hasCurrency, _yield$_this3$onValid2, _data, errorString, errorResult;
@@ -592,7 +615,8 @@ var ElementController = /*#__PURE__*/function () {
                         }, {
                           msg: safeStringify({
                             hasBeforeConfirmForApplePay: hasBeforeConfirmForApplePay,
-                            isApplePay: isApplePay
+                            isApplePay: isApplePay,
+                            amount: "".concat(submitParams === null || submitParams === void 0 ? void 0 : submitParams.amount, ", ").concat(submitParams === null || submitParams === void 0 ? void 0 : submitParams.currency)
                           })
                         });
                         _this3.elementProcessors[ElementType.payment].setOnBeforeConfirm(hasBeforeConfirmForApplePay ? submitParams.onBeforeConfirm : null);
@@ -660,10 +684,10 @@ var ElementController = /*#__PURE__*/function () {
                   return _ref3.apply(this, arguments);
                 };
               }());
-            case 39:
+            case 45:
               return _context4.abrupt("return", _context4.sent);
-            case 40:
-              _context4.prev = 40;
+            case 46:
+              _context4.prev = 46;
               _logParams = {
                 eventCode: (_recordResult = recordResult) === null || _recordResult === void 0 ? void 0 : _recordResult.status,
                 errorName: (_recordResult2 = recordResult) === null || _recordResult2 === void 0 || (_recordResult2 = _recordResult2.error) === null || _recordResult2 === void 0 ? void 0 : _recordResult2.code,
@@ -674,12 +698,12 @@ var ElementController = /*#__PURE__*/function () {
               };
               this.elementEventCenter.endEvent(startEventId, _logParams);
               this.changeLoading(false);
-              return _context4.finish(40);
-            case 45:
+              return _context4.finish(46);
+            case 51:
             case "end":
               return _context4.stop();
           }
-        }, _callee4, this, [[11, 26], [36,, 40, 45]]);
+        }, _callee4, this, [[11, 32], [42,, 46, 51]]);
       }));
       function submitPayment(_x) {
         return _submitPayment.apply(this, arguments);

package/esm/core/component/element/elementProcessor/baseElementProcessor.d.ts

@@ -8,6 +8,7 @@ interface ElementProcessorOptions {
     mode: string;
     analytics?: Ianalytics;
     product: string;
+    preview?: boolean | 'web' | 'mobile';
 }
 declare abstract class BaseElementProcessor {
     elementContainer: AntomSDKCore;

package/esm/core/component/element/elementProcessor/baseElementProcessor.js

@@ -57,6 +57,7 @@ var BaseElementProcessor = /*#__PURE__*/function () {
       _setEnv();
       this.options.locale = (options === null || options === void 0 ? void 0 : options.locale) || '';
       this.options.product = options === null || options === void 0 ? void 0 : options.product;
+      this.options.preview = options === null || options === void 0 ? void 0 : options.preview;
     }
   }, {
     key: "registerElementContainer",

package/esm/core/component/element/elementProcessor/convertPaymentMethods.d.ts

@@ -0,0 +1,22 @@
+import { IPaymentMethod } from "../../../../types";
+interface PaymentMethodsConfig {
+    expressCheckout?: {
+        enabled: boolean;
+        methods?: {
+            paymentMethodName: string;
+            paymentMethodType: string;
+        }[];
+    };
+    supportedMethods?: {
+        paymentMethodName: string;
+        paymentMethodType: string;
+        logoUrl?: string;
+    }[];
+    topping?: string;
+}
+/**
+ * 将 paymentMethods 配置转换为内部格式
+ * 与 CKP 的 convertPaymentMethods 逻辑保持一致
+ */
+export declare function convertPaymentMethods(paymentMethodsConf?: PaymentMethodsConfig): IPaymentMethod[];
+export {};

package/esm/core/component/element/elementProcessor/convertPaymentMethods.js

@@ -0,0 +1,159 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * 为 GOOGLEPAY 支付方式补充 mock 的 paymentMethodDetail 数据
+ * 预览模式下 GooglePay 需要完整的 googlePayProps 才能正常渲染
+ */
+function handleGooglePayMethodDetail(method) {
+  if (method.paymentMethodType === 'GOOGLEPAY') {
+    method.paymentMethodDetail = _objectSpread(_objectSpread({}, method.paymentMethodDetail), {}, {
+      googlePayProps: {
+        environment: 'TEST',
+        existingPaymentMethodRequired: true,
+        paymentRequest: {
+          allowedPaymentMethods: [{
+            parameters: {
+              allowedAuthMethods: ['PAN_ONLY', 'CRYPTOGRAM_3DS'],
+              allowedCardNetworks: ['VISA', 'JCB']
+            },
+            tokenizationSpecification: {
+              parameters: {
+                protocolVersion: 'ECv2',
+                publicKey: 'BDM6GVTLZmxSmTQzm04QKI2av54kFpkqjhbkejtdDUx+VMvUtJ6vc+ZlDp8TygNTf+QeihxpD869sCVWaa0KMJc='
+              },
+              type: 'DIRECT'
+            },
+            type: 'CARD'
+          }],
+          apiVersion: 2,
+          apiVersionMinor: 0,
+          callbackIntents: ['PAYMENT_AUTHORIZATION'],
+          merchantInfo: {
+            merchantId: '123',
+            merchantName: 'merchantName'
+          },
+          shippingAddressRequired: true,
+          transactionInfo: {
+            countryCode: 'US',
+            currencyCode: 'EUR',
+            totalPrice: '10',
+            totalPriceStatus: 'FINAL'
+          }
+        }
+      }
+    });
+  }
+}
+
+/**
+ * 为 ONLINEBANKING_YAPILY 支付方式处理 mock 数据
+ * Yapily 在预览模式下需要清空 paymentElements
+ */
+function handleYapilyMethodDetail(method) {
+  if (method.paymentMethodType === 'ONLINEBANKING_YAPILY') {
+    method.paymentElements = [];
+  }
+}
+
+/**
+ * 合并所有的 Card 类支付方式
+ * 与 CKP handleAllCardsData 逻辑一致
+ */
+function handleAllCardsData() {
+  var supportedMethods = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+  var firstCardIndex = -1;
+  var logoList = [];
+  supportedMethods.forEach(function (item, index) {
+    if (item.paymentMethodName === 'CARD') {
+      logoList.push({
+        cardBrand: item.paymentMethodType,
+        logoUrl: item.logoUrl || ''
+      });
+      if (firstCardIndex === -1) {
+        firstCardIndex = index;
+      }
+    }
+  });
+  if (logoList.length) {
+    return {
+      firstCardIndex: firstCardIndex,
+      cardPaymentMethod: {
+        antomPage: 'paymentMetaPage',
+        category: 'CARD',
+        expressCheckout: false,
+        logoList: logoList,
+        paymentMethod: 'CARD',
+        paymentMethodName: 'Card',
+        paymentMethodType: 'CARD',
+        recommend: false,
+        webRedirectType: 'PAGE_REFRESH'
+      }
+    };
+  }
+  return null;
+}
+
+/**
+ * 将 paymentMethods 配置转换为内部格式
+ * 与 CKP 的 convertPaymentMethods 逻辑保持一致
+ */
+export function convertPaymentMethods(paymentMethodsConf) {
+  if (!paymentMethodsConf) {
+    return [];
+  }
+  var expressCheckout = paymentMethodsConf.expressCheckout,
+    supportedMethods = paymentMethodsConf.supportedMethods,
+    topping = paymentMethodsConf.topping;
+
+  // 1. 处理极速支付（排在最前面）
+  var supportedExpressCheckoutMethods = ((expressCheckout === null || expressCheckout === void 0 ? void 0 : expressCheckout.methods) || []).map(function (item) {
+    var method = {
+      paymentMethodName: item.paymentMethodName,
+      paymentMethodType: item.paymentMethodType,
+      category: item.paymentMethodType,
+      expressCheckout: true
+    };
+    handleGooglePayMethodDetail(method);
+    return method;
+  });
+
+  // 2. 处理普通支付方式（跳过 CARD，CARD 统一合并处理）
+  var supportedPaymentMethods = [];
+  (supportedMethods || []).forEach(function (item) {
+    if (item.paymentMethodName === 'CARD') {
+      return;
+    }
+    var method = {
+      paymentMethodName: item.paymentMethodName,
+      paymentMethodType: item.paymentMethodType,
+      category: item.paymentMethodType,
+      icon: item.logoUrl,
+      recommend: false
+    };
+    if (method.paymentMethodType === topping) {
+      method.recommend = true;
+    }
+    handleGooglePayMethodDetail(method);
+    handleYapilyMethodDetail(method);
+    supportedPaymentMethods.push(method);
+  });
+
+  // 3. 合并所有的 Card 类支付方式
+  var cardPaymentMethods = handleAllCardsData(supportedMethods);
+
+  // 4. 插入 Card 类支付方式 (card 第一次出现的位置)
+  if (cardPaymentMethods) {
+    supportedPaymentMethods.splice(cardPaymentMethods.firstCardIndex, 0, cardPaymentMethods.cardPaymentMethod);
+  }
+  return [].concat(_toConsumableArray(supportedExpressCheckoutMethods), supportedPaymentMethods);
+}

package/esm/core/component/element/elementProcessor/paymentProcessor.d.ts

@@ -23,6 +23,11 @@ declare class PaymentProcessor extends BaseElementProcessor {
         instanceId: any;
     }): string;
     obtainData(): Promise<any>;
+    /**
+     * 构建预览模式的 mock 数据
+     * 合并 mock.ts 的硬编码数据和 mount 传入的 paymentMethods 配置
+     */
+    private buildPreviewMockData;
     getValue(): any;
     update({ data, paymentSessionData }: {
         data: any;