@alipay/ams-checkout 1.3.1 → 1.4.0

package/esm/core/instance/index.d.ts

@@ -0,0 +1,59 @@
+import type { AMSCheckoutOptions, callOnError, callOnLog, callOnSizeChanged, checkoutState, optionsParams } from '../../types/index';
+import { EventCenter } from '../../util/index';
+export default class AMSSDK {
+    options: AMSCheckoutOptions;
+    checkoutState: checkoutState;
+    eventCenter: EventCenter;
+    protected plugins: Map<string, any>;
+    _instanceId: string;
+    constructor(options: optionsParams);
+    /**
+     * @description Destroy and process some contents of the plug-in
+     */
+    destroy(): void;
+    /**
+     * @description Set the sdk basic configuration
+     */
+    private _setOptions;
+    /**
+     * @description Set environment variables
+     */
+    private _setEnv;
+    /**
+     * @description Set UI and Network Mode
+     */
+    private _setMode;
+    /**
+     * @description Initialize event related tasks
+     */
+    private _initEvent;
+    /**
+     * @description Register plug-in
+     */
+    protected _registerPlugin(pluginId: string, plugin: any): void;
+    /**
+     * @description Get Plug-in
+     */
+    _getPlugin(pluginId: string): any;
+    /**
+     * @description Execute to open app or jump link
+     */
+    _redirect(data: {
+        normalUrl?: string;
+        schemeUrl?: string;
+        applinkUrl?: string;
+    }): Promise<void>;
+    /**
+     * @description Overlay Subscription
+     */
+    protected _overrideSubscription(name: string, func: any, funcKey: string): void;
+    /**
+     * @description Create an event handler, called when an error occurs in AMSCheckout.
+     */
+    onError(event: callOnError): void;
+    /**
+     * @description Create an event handler
+     */
+    onSizeChanged(event: callOnSizeChanged): void;
+    onLog(event: callOnLog): void;
+}

package/esm/core/instance/index.js

@@ -0,0 +1,254 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+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 _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 _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
+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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+/**
+ * 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.
+ */
+import { v4 as uuid } from 'uuid';
+import { ERRORMESSAGE, EVENT } from "../../constant";
+import { environment, mode, networkMode, osType, terminalType } from "../../types/index";
+import { device, EventCenter, getType, queryParse } from "../../util/index";
+import CallApp from "../../util/intl-callapp/es/main";
+var AMSSDK = /*#__PURE__*/function () {
+  function AMSSDK(options) {
+    _classCallCheck(this, AMSSDK);
+    _defineProperty(this, "options", void 0);
+    _defineProperty(this, "checkoutState", void 0);
+    _defineProperty(this, "eventCenter", void 0);
+    _defineProperty(this, "plugins", void 0);
+    _defineProperty(this, "_instanceId", void 0);
+    this._instanceId = uuid();
+    // eslint-disable-next-line @typescript-eslint/consistent-type-assertions
+    this.options = {};
+    this.eventCenter = new EventCenter();
+    this.checkoutState = {
+      paymentMethodType: ''
+    };
+    this._initEvent(options);
+    this._setOptions(options);
+    this.plugins = new Map();
+  }
+  /**
+   * @description Destroy and process some contents of the plug-in
+   */
+  _createClass(AMSSDK, [{
+    key: "destroy",
+    value: function destroy() {
+      var _iterator = _createForOfIteratorHelper(this.plugins.values()),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var plugin = _step.value;
+          try {
+            plugin.logoutPlugin();
+            // eslint-disable-next-line no-empty
+          } catch (error) {}
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+    /**
+     * @description Set the sdk basic configuration
+     */
+  }, {
+    key: "_setOptions",
+    value: function _setOptions(options) {
+      this._setMode(options);
+      this._setEnv(options);
+      this.options.locale = (options === null || options === void 0 ? void 0 : options.locale) || '';
+    }
+    /**
+     * @description Set environment variables
+     */
+  }, {
+    key: "_setEnv",
+    value: function _setEnv(options) {
+      var _queryParse = queryParse(),
+        _moreEnv = _queryParse._moreEnv;
+      if (options !== null && options !== void 0 && options.environment && !((options === null || options === void 0 ? void 0 : options.environment) in environment) && _moreEnv !== 'true') {
+        console.warn(ERRORMESSAGE.INIT_PARAMETER_ERROR.ENVIRONMENT_ERROR.errorMessage);
+        options.environment = 'prod';
+      }
+      this.options.env = {
+        terminalType: device.isMobile ? terminalType.WAP : terminalType.WEB,
+        environment: (options === null || options === void 0 ? void 0 : options.environment) || 'prod'
+      };
+      if (this.options.env.terminalType === terminalType.WAP) {
+        // eslint-disable-next-line no-nested-ternary
+        this.options.env.osType = device.iOS ? osType.IOS : device.Android ? osType.ANDROID : osType.ELSE;
+      }
+    }
+    /**
+     * @description Set UI and Network Mode
+     */
+  }, {
+    key: "_setMode",
+    value: function _setMode(options) {
+      this.options.mode = (options === null || options === void 0 ? void 0 : options.mode) || mode.dropin;
+      if (options !== null && options !== void 0 && options.mode && !((options === null || options === void 0 ? void 0 : options.mode) in mode)) {
+        console.warn(ERRORMESSAGE.INIT_PARAMETER_ERROR.MODE_ERROR.errorMessage);
+        this.options.mode = mode.component;
+      }
+      this.options.networkMode = (options === null || options === void 0 ? void 0 : options.networkMode) || networkMode.session;
+      if (options !== null && options !== void 0 && options.networkMode && !((options === null || options === void 0 ? void 0 : options.networkMode) in networkMode)) {
+        console.warn(ERRORMESSAGE.INIT_PARAMETER_ERROR.NET_MODE_NOT_SUPPORT.errorMessage);
+        this.options.networkMode = networkMode.proxy;
+      }
+    }
+    /**
+     * @description Initialize event related tasks
+     */
+  }, {
+    key: "_initEvent",
+    value: function _initEvent(options) {
+      if (options !== null && options !== void 0 && options.onError) {
+        if (getType(options.onError) !== 'function') throw new Error(ERRORMESSAGE.INIT_PARAMETER_ERROR.EVENT_ERROR.errorMessage);
+        this._overrideSubscription(EVENT.error.name, options.onError, EVENT.error.uniqueKey);
+      }
+      if (options !== null && options !== void 0 && options.onPaymentMethodSelected) {
+        if (getType(options.onPaymentMethodSelected) !== 'function') throw new Error(ERRORMESSAGE.INIT_PARAMETER_ERROR.EVENT_ERROR.errorMessage);
+        this._overrideSubscription(EVENT.paymentMethodSelected.name, options.onPaymentMethodSelected, EVENT.paymentMethodSelected.uniqueKey);
+      }
+      if (options !== null && options !== void 0 && options.onSizeChanged) {
+        if (getType(options.onSizeChanged) !== 'function') throw new Error(ERRORMESSAGE.INIT_PARAMETER_ERROR.EVENT_ERROR.errorMessage);
+        this._overrideSubscription(EVENT.sizeChanged.name, options.onSizeChanged, EVENT.sizeChanged.uniqueKey);
+      }
+      if (options !== null && options !== void 0 && options.onLog) {
+        if (getType(options.onLog) !== 'function') throw new Error(ERRORMESSAGE.INIT_PARAMETER_ERROR.EVENT_ERROR.errorMessage);
+        this._overrideSubscription(EVENT.log.name, options.onLog, EVENT.log.uniqueKey);
+      }
+      if (options !== null && options !== void 0 && options.onEventCallback) {
+        if (getType(options.onEventCallback) !== 'function') throw new Error(ERRORMESSAGE.INIT_PARAMETER_ERROR.EVENT_ERROR.errorMessage);
+        this._overrideSubscription(EVENT.eventCallback.name, options.onEventCallback, EVENT.eventCallback.uniqueKey);
+      }
+      if (options !== null && options !== void 0 && options.onClose) {
+        if (getType(options.onClose) !== 'function') throw new Error(ERRORMESSAGE.INIT_PARAMETER_ERROR.EVENT_ERROR.errorMessage);
+        this._overrideSubscription(EVENT.onClose.name, options.onClose, EVENT.onClose.uniqueKey);
+      }
+    }
+    /**
+     * @description Register plug-in
+     */
+  }, {
+    key: "_registerPlugin",
+    value: function _registerPlugin(pluginId, plugin) {
+      this.plugins.set(pluginId, plugin);
+      try {
+        plugin.applyPlugin(this);
+      } catch (error) {
+        this.plugins.delete(pluginId);
+        if (getType(error) === 'error') throw error;
+        throw new Error("Failed to register plug-in\uFF1A".concat(pluginId, " Exception in the apply function of the plug-in"));
+      }
+    }
+    /**
+     * @description Get Plug-in
+     */
+  }, {
+    key: "_getPlugin",
+    value: function _getPlugin(pluginId) {
+      if (!this.plugins.has(pluginId)) {
+        console.warn("".concat(pluginId, "Plugin unregistered"));
+        return null;
+      }
+      return this.plugins.get(pluginId);
+    }
+    /**
+     * @description Execute to open app or jump link
+     */
+  }, {
+    key: "_redirect",
+    value: function _redirect(data) {
+      var _this = this;
+      return new Promise(function (resolve, reject) {
+        var isWeb = _this.options.env.terminalType === terminalType.WEB;
+        var normalUrl = (data === null || data === void 0 ? void 0 : data.normalUrl) || '';
+        var schemeUrl = (data === null || data === void 0 ? void 0 : data.schemeUrl) || '';
+        var applinkUrl = (data === null || data === void 0 ? void 0 : data.applinkUrl) || '';
+        var jumpFunc = function jumpFunc() {
+          if (normalUrl) {
+            resolve();
+            window.location.href = normalUrl;
+            return;
+          }
+          reject(ERRORMESSAGE.SDK_CALL_URL_ERROR.REDIRECT_ERROR);
+        };
+        var callAppFunc = function callAppFunc() {
+          if (!schemeUrl && !applinkUrl) {
+            jumpFunc();
+            return;
+          }
+          var config = {
+            fallback: function fallback() {
+              jumpFunc();
+            },
+            successCb: function successCb() {
+              resolve();
+            },
+            delay: 0
+          };
+          try {
+            var callLib = new CallApp(config);
+            callLib.open({
+              scheme: schemeUrl,
+              link: applinkUrl
+            });
+          } catch (error) {
+            jumpFunc();
+          }
+        };
+        if (isWeb) {
+          jumpFunc();
+        } else {
+          callAppFunc();
+        }
+      });
+    }
+    /**
+     * @description Overlay Subscription
+     */
+  }, {
+    key: "_overrideSubscription",
+    value: function _overrideSubscription(name, func, funcKey) {
+      this.eventCenter.off(name, func, funcKey);
+      this.eventCenter.on(name, func, funcKey);
+    }
+    /**
+     * @description Create an event handler, called when an error occurs in AMSCheckout.
+     */
+  }, {
+    key: "onError",
+    value: function onError(event) {
+      this._overrideSubscription(EVENT.error.name, event, EVENT.error.uniqueKey);
+    }
+    /**
+     * @description Create an event handler
+     */
+  }, {
+    key: "onSizeChanged",
+    value: function onSizeChanged(event) {
+      this._overrideSubscription(EVENT.sizeChanged.name, event, EVENT.sizeChanged.uniqueKey);
+    }
+  }, {
+    key: "onLog",
+    value: function onLog(event) {
+      this._overrideSubscription(EVENT.log.name, event, EVENT.log.uniqueKey);
+    }
+  }]);
+  return AMSSDK;
+}();
+export { AMSSDK as default };

package/esm/image/cta.svg

@@ -0,0 +1,9 @@
+<svg width="44" height="44" viewBox="0 0 44 44" fill="none" xmlns="">
+<path d="M-9.61651e-07 22C-1.49276e-06 9.84974 9.84973 -4.30546e-07 22 -9.61651e-07C34.1503 -1.49276e-06 44 9.84973 44 22C44 34.1503 34.1503 44 22 44C9.84974 44 -4.30546e-07 34.1503 -9.61651e-07 22ZM4 22C4 31.9411 12.0589 40 22 40C31.9411 40 40 31.9411 40 22C40 12.0589 31.9411 4 22 4C12.0589 4 4 12.0589 4 22Z" fill="url(#paint0_angular_2884_126722)"/>
+<defs>
+<radialGradient id="paint0_angular_2884_126722" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(22 22) rotate(180) scale(22)">
+<stop stop-color="#889CB8"/>
+<stop offset="1" stop-color="#CFD8E5" stop-opacity="0"/>
+</radialGradient>
+</defs>
+</svg>

package/esm/index.d.ts

@@ -0,0 +1,22 @@
+/**
+ * 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.
+ */
+import { IcreateComponentFunc } from './core/component/index';
+import { IconfirmPaymentFunc, IcreatePaymentFunc } from './core/drop-in/index';
+import AMSSDK from './core/instance';
+import { optionsParams } from './types';
+export * from './types';
+export declare class AMSCheckout extends AMSSDK {
+    createComponent: IcreateComponentFunc;
+    createPayment: IcreatePaymentFunc;
+    confirmPayment: IconfirmPaymentFunc;
+    constructor(options: optionsParams);
+}
+export declare class AMSAutoDebit extends AMSCheckout {
+    constructor(options: optionsParams);
+}
+export default AMSCheckout;

package/esm/plugin/component/cashierApp.d.ts

@@ -0,0 +1,23 @@
+import { componentSignEnum, Ianalytics } from '../../types';
+export declare const getAppPath: (environment: string | undefined, appVersion: string, componentSign: componentSignEnum, productSceneVersion: string, extendInfo: string) => any;
+export declare const getAppDomain: (domainParams: {
+    environment: string;
+    appVersion: string;
+    componentSign: componentSignEnum;
+    productSceneVersion: string;
+    extendInfo: string;
+}) => string;
+export declare const getIframeUrl: (iframeParams: {
+    componentSign: componentSignEnum;
+    analytics?: Ianalytics;
+    productSceneVersion: string;
+    environment: string;
+    appVersion: string;
+    extendInfo: string;
+    locale: string;
+    instanceId: string;
+}) => string;
+/**
+ * @description Create iframe
+ */
+export declare const createIframe: (mode: string) => HTMLIFrameElement;

package/esm/plugin/component/cashierApp.js

@@ -0,0 +1,122 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+/**
+ * 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.
+ */
+import { marmptMap, sdkVersion } from "../../config/index";
+import { componentSignEnum } from "../../types";
+import { getViewPort, queryParse, serialize } from "../../util/index";
+var getAppVersion = function getAppVersion(_extendInfo) {
+  try {
+    var info = JSON.parse(_extendInfo);
+    return info.versionMap.web[sdkVersion].targetWebVerison;
+  } catch (error) {
+    return '';
+  }
+};
+var getFinalProductSceneVersion = function getFinalProductSceneVersion(componentSign, productSceneVersion) {
+  var _signSupportMap;
+  var signSupportMap = (_signSupportMap = {}, _defineProperty(_signSupportMap, componentSignEnum.NONE, ['']), _defineProperty(_signSupportMap, componentSignEnum.AUTO_DEBIT_WALLET, ['1.0']), _defineProperty(_signSupportMap, componentSignEnum.CASHIER_PAYMENT_BANK, ['1.0']), _defineProperty(_signSupportMap, componentSignEnum.CASHIER_PAYMENT_CARD, ['1.0']), _defineProperty(_signSupportMap, componentSignEnum.EASY_PAY_WALLET, ['1.0', '2.0']), _signSupportMap);
+  var supportProductSceneVersion = signSupportMap[componentSign];
+  // 从左到右，从旧到新
+  var isSupport = supportProductSceneVersion.find(function (it) {
+    return it === productSceneVersion;
+  });
+  var finalProductSceneVersion = supportProductSceneVersion[supportProductSceneVersion.length - 1];
+  return isSupport ? productSceneVersion : finalProductSceneVersion;
+};
+export var getAppPath = function getAppPath() {
+  var environment = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'prod';
+  var appVersion = arguments.length > 1 ? arguments[1] : undefined;
+  var componentSign = arguments.length > 2 ? arguments[2] : undefined;
+  var productSceneVersion = arguments.length > 3 ? arguments[3] : undefined;
+  var extendInfo = arguments.length > 4 ? arguments[4] : undefined;
+  var _ref = queryParse() || {},
+    urlTestHost = _ref.host;
+  var finalAppVersion = getAppVersion(extendInfo) || appVersion;
+  var finalProductSceneVersion = getFinalProductSceneVersion(componentSign, productSceneVersion);
+
+  // only for test while testurl?host=https://xxxxx.test.html
+  if (urlTestHost && !['sandbox', 'light_sandbox', 'prod'].includes(environment)) {
+    return urlTestHost;
+  }
+  return "".concat(marmptMap[environment], "/").concat(componentSign, "/").concat(finalProductSceneVersion, "/index.").concat(finalAppVersion, ".html");
+};
+export var getAppDomain = function getAppDomain(domainParams) {
+  var environment = domainParams.environment,
+    appVersion = domainParams.appVersion,
+    componentSign = domainParams.componentSign,
+    productSceneVersion = domainParams.productSceneVersion,
+    extendInfo = domainParams.extendInfo;
+  var reg = /^https?:\/\/([^/<>\s]+\.?)*/;
+  var macth = reg.exec(getAppPath(environment, appVersion, componentSign, productSceneVersion, extendInfo));
+  return macth && macth[0] || '';
+};
+export var getIframeUrl = function getIframeUrl(iframeParams) {
+  var componentSign = iframeParams.componentSign,
+    _iframeParams$analyti = iframeParams.analytics,
+    analytics = _iframeParams$analyti === void 0 ? {
+      enabled: true
+    } : _iframeParams$analyti,
+    productSceneVersion = iframeParams.productSceneVersion,
+    environment = iframeParams.environment,
+    appVersion = iframeParams.appVersion,
+    extendInfo = iframeParams.extendInfo,
+    locale = iframeParams.locale,
+    instanceId = iframeParams.instanceId;
+  var path = getAppPath(environment, appVersion, componentSign, productSceneVersion, extendInfo || '');
+  var initialScale = 1;
+  var scale = getViewPort('initial-scale') || initialScale;
+  var _queryParse = queryParse(),
+    _sandbox = _queryParse._sandbox,
+    _light_sandbox = _queryParse._light_sandbox,
+    _queryParse$requestHo = _queryParse.requestHost,
+    requestHost = _queryParse$requestHo === void 0 ? '' : _queryParse$requestHo,
+    _queryParse$groupId = _queryParse.groupId,
+    groupId = _queryParse$groupId === void 0 ? '' : _queryParse$groupId,
+    LOCAL_MOCK = _queryParse.LOCAL_MOCK;
+  var urlParams = Object.assign({}, {
+    locale: locale,
+    scale: scale,
+    instanceId: instanceId,
+    sandbox: environment === 'light_sandbox' || _light_sandbox === 'true' ? 'true' : 'false',
+    analyticsEnabled: (analytics === null || analytics === void 0 ? void 0 : analytics.enabled) === false ? 'false' : 'true',
+    sdkVersion: sdkVersion,
+    refUrl: window.location.href,
+    shadow: environment === 'sandbox' || _sandbox === 'true' ? 'true' : 'false',
+    requestHost: requestHost,
+    groupId: groupId,
+    LOCAL_MOCK: LOCAL_MOCK
+  });
+  var locationSearch = serialize(urlParams);
+  return "".concat(path, "?").concat(locationSearch);
+};
+var getIframeId = function getIframeId(UIMode) {
+  var IdMap = {
+    dropin: 'checkout-dropin',
+    component: 'checkout-component'
+  };
+  return IdMap[UIMode] || 'checkout-component';
+};
+
+/**
+ * @description Create iframe
+ */
+export var createIframe = function createIframe(mode) {
+  var iframe = document.createElement('iframe');
+  var iframeId = getIframeId(mode);
+  var none = '0';
+  var width = '100%';
+  iframe.id = iframeId;
+  iframe.style.height = none;
+  iframe.style.width = width;
+  iframe.style.border = none;
+  iframe.style.overflow = 'hidden';
+  return iframe;
+};

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

@@ -0,0 +1,8 @@
+/**
+ * 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 function componentAddCSS(): void;

package/esm/plugin/component/component.style.js

@@ -0,0 +1,15 @@
+/**
+ * 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.
+ */
+
+var componentCss = ".ams-component-container-mobile {\n  width: 100%;\n  height: 1px;\n  position: fixed;\n  bottom: -1px;\n  left: 0;\n  z-index: 1001;\n  border-radius: 12px 12px 0 0;\n  overflow: hidden;\n}\n.ams-component-container-mobile-animation{\n  animation: ams-component-container-slide-in 0.3s ease-in-out;\n}\n\n.ams-component-section-desktop {\n  font-size: 0;\n}\n\n.ams-component-container-hidden-mobile {\n  width: 100%;\n  height: 1px;\n  position: fixed;\n  bottom: -1px;\n  left: 0;\n  z-index: 1001;\n  background-color: transparent;\n  border-radius: 12px 12px 0 0;\n  animation: ams-component-container-slide-out 0.26s ease-in forwards;\n  overflow: hidden;\n}\n\n.ams-component-section-mobile {\n  border-radius: 12px 12px 0 0;\n  overflow: hidden;\n  font-size: 0;\n}\n\n.ams-component-container-desktop {\n  display: block;\n  width: 672px;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  z-index: 1001;\n  border-radius: 8px;\n  overflow: hidden;\n  transform-origin: 50% 50%;\n}\n.ams-component-container-desktop-animation{\n  animation: ams-component-container-zoom-in 0.3s ease-in-out;\n  animation-fill-mode: forwards\n}\n\n@keyframes ams-component-container-zoom-out {\n  0% {\n    transform: translate(-50%, -50%) scale(1);\n    -webkit-transform: translate(-50%, -50%) scale(1);\n    opacity: 1\n  }\n  \n  100% {\n    opacity: 0;\n    transform: translate(-50%, -50%) scale(0.4);\n    -webkit-transform: translate(-50%, -50%) scale(0.4);\n  }\n}\n\n@keyframes ams-component-container-zoom-in {\n  0% {\n    transform: translateX(-50%) translateY(-50%) scale(0.4);\n    opacity: 0\n  }\n\n  80% {\n    opacity: 1\n  }\n\n  100% {\n    opacity: 1;\n    transform: translateX(-50%) translateY(-50%) scale(1);\n  }\n}\n\n.ams-component-container-hidden-desktop {\n  display: block;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  z-index: 1001;\n  border-radius: 8px;\n  overflow: hidden;\n  animation-fill-mode: forwards;\n  animation: ams-component-container-zoom-out 0.3s ease-in-out;\n  transform-origin: 50% 50%;\n}\n\n.ams-component-loading {\n  width: 0.8em;\n  height:0.8em;\n  background: rgba(0, 0, 0, 0.5);\n  border-radius: 8px;\n  position: fixed;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  z-index: 1001;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n}\n\n.ams-component-loading .line {\n  width: 40px;\n  height: 40px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n}\n.ams-component-loading .line div {\n  position: absolute;\n  left: 17.67px;\n  top: 0;\n  width: 5.33px;\n  height: 40px;\n}\n\n.ams-component-loading .line div:before,\n.ams-component-loading .line div:after {\n  content: '';\n  display: block;\n  height: 13.33px;\n  background: #fcfcfc;\n  border-radius: 5.3px;\n}\n.ams-component-loading .line div:after {\n  margin-top: 13.33px;\n}\n\n.ams-component-loading .line div:nth-child(2) {\n  -webkit-transform: rotate(45deg);\n}\n\n.ams-component-loading .line div:nth-child(3) {\n  -webkit-transform: rotate(90deg);\n}\n\n.ams-component-loading .line div:nth-child(4) {\n  -webkit-transform: rotate(135deg);\n}\n\n/** \u52A0\u8F7D\u52A8\u753B **/\n@-webkit-keyframes load {\n  0% {\n      opacity: 0;\n  }\n\n  100% {\n      opacity: 1;\n  }\n\n}\n\n.ams-component-loading .line div:nth-child(1):before {\n  -webkit-animation: load 1s linear 0s infinite;\n}\n\n.ams-component-loading .line div:nth-child(2):before {\n  -webkit-animation: load 1s linear 0.125s infinite;\n}\n\n.ams-component-loading .line div:nth-child(3):before {\n  -webkit-animation: load 1s linear 0.25s infinite;\n}\n\n.ams-component-loading .line div:nth-child(4):before {\n  -webkit-animation: load 1s linear 0.375s infinite;\n}\n\n.ams-component-loading .line div:nth-child(1):after {\n  -webkit-animation: load 1s linear 0.5s infinite;\n}\n\n.ams-component-loading .line div:nth-child(2):after {\n  -webkit-animation: load 1s linear 0.675s infinite;\n}\n\n.ams-component-loading .line div:nth-child(3):after {\n  -webkit-animation: load 1s linear 0.75s infinite;\n}\n\n.ams-component-loading .line div:nth-child(4):after {\n  -webkit-animation: load 1s linear 0.875s infinite;\n}\n\n.ams-component-loading-logo {\n  width: 0.44em;\n  height: 0.44em;\n  -webkit-transform:rotate(360deg);\n  transform:rotate(360deg);\n  -webkit-transition:-webkit-transform 1s linear;\n  transition:transform 1s linear;\n  animation: ams-component-loading-logo 1s linear infinite;\n}\n\n.asm-component-close-block-desktop {\n  position: absolute;\n  width: 40px;\n  height: 40px;\n  right: 0;\n  top: 0;\n  cursor: pointer;\n}\n.asm-component-close-btn-desktop {\n  width: 11px;\n  height: 11px;\n  object-fit: fill;\n  position: absolute;\n  right: 18.7px;\n  top: 26.7px;\n}\n.asm-component-close-block-hidden {\n  width: 0px !important;\n  height: 0px !important;\n  visibility: hidden;\n}\n.asm-component-close-block-mobile {\n  position: absolute;\n  width: 0.4em;\n  height: 0.4em;\n  right: 0;\n  top: 0;\n  cursor: pointer;\n  z-index: 1009;\n}\n\n.asm-component-close-btn-mobile {\n  width: 0.11em;\n  height: 0.11em;\n  object-fit: fill;\n  position: absolute;\n  right: 0.147em;\n  top: 0.167em;\n}\n\n\n.ams-component-container-opacity{\n  opacity: 1;\n}\n\n.ams-component-container-opacity:after{\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: block;\n  content: \"\";\n  z-index: 1010;\n  background-color: rgba(0, 0, 0, 0.35);\n}\n\n#ams-component-retention {\n  position: fixed;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  transform-origin: 50%;\n  height: auto;\n  display: none;\n  z-index: 1009;\n}\n\n.ams-component-retention-show {\n  display: flex !important;\n  animation: ams-component-container-zoom-in 0.3s ease-in-out;\n  animation-fill-mode: forwards\n}\n\n.ams-component-retention-hidden {\n  display: flex !important;\n  animation: ams-component-container-zoom-out 0.3s ease-in-out;\n  -webkit-animation: ams-component-container-zoom-out 0.3s ease-in-out;\n  animation-fill-mode: forwards;\n  -webkit-animation-fill-mode: forwards;\n}\n\n.ams-component-retention-mobile {\n  width: 294px;\n  border-radius: 12px;\n  padding: 24px 0;\n  background-color: #fff;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n.ams-component-retention-desktop {\n  width: 544px;\n  border-radius: 12px;\n  padding: 32px;\n  background-color: #fff;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  box-sizing: border-box;\n}\n\n@media screen and (max-width: 300px) {\n  .ams-component-retention-mobile {\n      transform: translate(-50%, -50%) scale(0.8);\n  }\n}\n\n.ams-component-retention-title-mobile {\n  width: 100%;\n  font-style: normal;\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 24px;\n  color: #2A3A52;\n  text-align: center;\n  padding: 0 16px;\n  box-sizing: border-box;\n}\n\n.ams-component-retention-title-desktop {\n  text-align: left;\n  width: 100%;\n  font-style: normal;\n  font-weight: 600;\n  font-size: 16px;\n  line-height: 24px;\n  color: #2A3A52;\n}\n\n.ams-component-retention-sub-title-mobile {\n  width: 100%;\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  color: #7C8CA3;\n  margin-top: 8px;\n  text-align: center;\n  padding: 0 16px;\n  box-sizing: border-box;\n}\n\n.ams-component-retention-sub-title-desktop {\n  text-align: left;\n  font-style: normal;\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  color: #7C8CA3;\n  margin-top: 10px;\n}\n\n.ams-component-retention-btn-block-mobile {\n  width: 100%;\n  display: flex;\n  flex-direction: column;\n  align-items: flex-start;\n  justify-content: center;\n  margin-top: 24px;\n  padding: 0 24px;\n  box-sizing: border-box;\n}\n\n.ams-component-retention-btn-block-desktop {\n  width: 100%;\n  margin-top: 24px;\n}\n\n#ams-component-retention-remain {\n  background: #0079FF;\n  border-radius: 100px;\n  font-style: normal;\n  font-weight: 600;\n  text-align: center;\n  box-sizing: border-box;\n  color: #FFFFFF;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ams-component-retention-remain-mobile {\n  width: 100%;\n  height: 44px;\n  font-size: 16px;\n  line-height: 44px;\n  padding: 0 6px;\n}\n\n.ams-component-retention-remain-desktop {\n  height: 44px;\n  font-size: 16px;\n  line-height: 44px;\n  display: inline-block;\n  padding: 0 24px;\n  float: right;\n  cursor: pointer;\n  padding: 0 8px;\n  max-width: 225px;\n}\n\n#ams-component-retention-leave {\n  border-radius: 100px;\n  border: 1px solid #0079FF;\n  font-style: normal;\n  font-weight: 600;\n  text-align: center;\n  box-sizing: border-box;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.ams-component-retention-leave-mobile {\n  width: 100%;\n  height: 44px;\n  font-size: 16px;\n  line-height: 44px;\n  color: #1677FF;\n  margin-top: 12px;\n  padding: 0 6px;\n}\n\n.ams-component-retention-leave-desktop {\n  height: 44px;\n  font-size: 16px;\n  line-height: 44px;\n  color: #1677FF;\n  display: inline-block;\n  padding: 0 24px;\n  float: right;\n  margin-right: 16px;\n  cursor: pointer;\n  padding: 0 8px;\n  max-width: 225px;\n}\n\n";
+export function componentAddCSS() {
+  var style = document.createElement('style');
+  style.type = 'text/css';
+  style.innerHTML = componentCss;
+  document.head.appendChild(style);
+}

package/esm/plugin/component/index.d.ts

@@ -0,0 +1,102 @@
+import type AMSCheckout from '../../core/instance';
+import type { IappendIframeNodesParams, IcreateComponent } from '../../types';
+import { CashierSdkActionQueryResult, componentSignEnum } from '../../types';
+export default class ComponentApp {
+    app: any;
+    appDomain: string;
+    AMSSDK: AMSCheckout;
+    platform: 'desktop' | 'mobile';
+    private createIframeNode;
+    private _selector;
+    private _appVersion;
+    private _isRetention;
+    private _actionQueryPromise;
+    private _renderParams;
+    private _componentSign;
+    private _performanceData;
+    private _isInitComponent;
+    private _clickEventName;
+    constructor();
+    /**
+     * @description Cancel listening and destroy the dom
+     */
+    logoutPlugin(): void;
+    /**
+     * @description When SDK registers plug-ins, it is a required function to receive SDK instances
+     */
+    applyPlugin(AMSSDK: AMSCheckout): void;
+    /**
+     * @description Set the rendering capability of the cashier plug-in. Different technology stacks have some differences in the packaging and use of rendering functions
+     */
+    setRender(createIframeNode: (context: ComponentApp, params: IcreateComponent) => Promise<void>): void;
+    /**
+     * @description render iframe content
+     */
+    appendIframeNodes(componentSign: componentSignEnum, renderParams: IappendIframeNodesParams): Promise<void | [void, CashierSdkActionQueryResult | null]>;
+    /**
+     * @description Interface request
+     */
+    private createActionQueryPromise;
+    private cleanApp;
+    /**
+     * @description Create app
+     */
+    private createApp;
+    private listener;
+    private resizeListener;
+    /**
+     * @description Initialize subscription iframe message
+     */
+    private _addEventListener;
+    private _removeEventListener;
+    /**
+     * @description Processing messages from iframe
+     */
+    private _handleAppMessage;
+    private handleSizeChanged;
+    private handleRedirect;
+    private handleDeclareInfo;
+    private handleCloseBtnShow;
+    /**
+     * @description Send message to SDK
+     */
+    private dispatchToSDK;
+    /**
+     * @description Send message to iframe
+     */
+    private dispatchToApp;
+    /**
+     * @description Subscribe to messages from SDK
+     */
+    private subscribeFromSDK;
+    /**
+     * @description Send rendering events to iframe
+     */
+    private sendRenderEvent;
+    private showLoading;
+    /**
+     * @description show cashier
+     */
+    private showCashier;
+    /**
+     * @description close cashier
+     */
+    private closeCashier;
+    private hideComponentAndCleanDom;
+    private closeBtnFunc;
+    /**
+     * @description create mount node
+     */
+    private createMountElement;
+    private createCloseBtn;
+    private createRetentionPopup;
+    private retentionPopupLeaveFunc;
+    private removeRetentionPopup;
+    private showRetentionPopup;
+    private hideRetentionPopup;
+    /**
+     * @description create mockup
+     */
+    private createMockup;
+    private submitForm;
+}