@alipay/ams-checkout 0.0.1703483942-dev.11 → 0.0.1703483942-dev.13

package/esm/constant/index.d.ts

@@ -164,6 +164,9 @@ export declare const EVENT: {
     getUserAgentFromSdk: {
         name: string;
     };
+    appHeartBeat: {
+        name: string;
+    };
 };
 export declare const COMPONENT_CONTAINER_ID = "ams-component-container";
 export declare const COMPONENT_SECTION_ID = "ams-component-section";
@@ -179,5 +182,7 @@ export declare const AMSPOPUP_PREFIX = "ams-popup";
 export declare const LOADTIME_LIMIT = 15000;
 export declare const POPUP_LOADTIME_LOG_LIMIT = 3000;
 export declare const ANIMATION_TIME = 300;
+export declare const TIMEOUT_WEB_APP_HEART_BEAT = 6000;
+export declare const TIME_DELAY_SEND_HEART_BEAT = 1000;
 export declare const closeImg = "https://cdn.marmot-cloud.com/storage/2023/5/18/1692a487-99b5-4314-9d6f-e9814bc1ca41.svg";
 export declare const LOADINGIMG = "data:image/png;base64,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";

package/esm/constant/index.js

@@ -163,6 +163,9 @@ export var EVENT = {
   },
   getUserAgentFromSdk: {
     name: 'getUserAgentFromSdk'
+  },
+  appHeartBeat: {
+    name: 'appHeartBeat'
   }
 };
 export var COMPONENT_CONTAINER_ID = 'ams-component-container';
@@ -179,5 +182,7 @@ export var AMSPOPUP_PREFIX = 'ams-popup';
 export var LOADTIME_LIMIT = 15000;
 export var POPUP_LOADTIME_LOG_LIMIT = 3000;
 export var ANIMATION_TIME = 300;
+export var TIMEOUT_WEB_APP_HEART_BEAT = 6000;
+export var TIME_DELAY_SEND_HEART_BEAT = 1000;
 export var closeImg = 'https://cdn.marmot-cloud.com/storage/2023/5/18/1692a487-99b5-4314-9d6f-e9814bc1ca41.svg';
 export var LOADINGIMG = 'data:image/png;base64,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';

package/esm/core/component/index.js

@@ -221,6 +221,9 @@ export var AMSComponent = /*#__PURE__*/function (_CoreInstance) {
               data: data
             }
           });
+          _this4.logger.logError({
+            title: 'sdk_event_apiSubmit'
+          });
         } catch (error) {
           reject(error);
         }

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

@@ -8,7 +8,7 @@
 import { ANIMATION_TIME, closeImg, COMPONENT_CLOSE_BLOCK_ID, COMPONENT_CONTAINER_ID, COMPONENT_RETENTION_ID, COMPONENT_SECTION_ID, LOADING_ID, MOCKUP_ID } from "../../constant";
 import { platformEnum } from "../../types";
 import { addSetFontSizeEvent, amsSetSize, getDesignFontSize } from "../../util";
-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: 0px;\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  height: 100%;\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: 12px;\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: translate(-50%, -50%) scale(0.4);\n    opacity: 0\n  }\n\n  80% {\n    opacity: 1\n  }\n\n  100% {\n    opacity: 1;\n    transform: translate(-50%, -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: ams-component-container-zoom-out 0.3s ease-in-out;\n  animation-fill-mode: forwards;\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.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-block-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-block-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  border-radius: 12px 12px 0 0;\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: 500;\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: 500;\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: 500;\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 16px;\n  max-width: 225px;\n  min-width: 159px;\n}\n\n#ams-component-retention-leave {\n  border-radius: 100px;\n  border: 1px solid #0079FF;\n  font-style: normal;\n  font-weight: 500;\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 16px;\n  max-width: 225px;\n  min-width: 144px;\n}\n.".concat(MOCKUP_ID, "-hidden{\nanimation: ").concat(MOCKUP_ID, "-opacity 0.3s ease-in-out;\n  animation-fill-mode: forwards\n}\n/** \u52A0\u8F7D\u52A8\u753B **/\n@-webkit-keyframes ").concat(MOCKUP_ID, "-opacity {\n  0% {\n      opacity: 1;\n  }\n\n  100% {\n      opacity: 0;\n  }\n}\n");
+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: 0px;\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  height: 100%;\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: 12px;\n  overflow: hidden;\n  transform-origin: 50% 50%;\n  transform: translate(-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: translate(-50%, -50%) scale(0.4);\n    opacity: 0\n  }\n\n  80% {\n    opacity: 1\n  }\n\n  100% {\n    opacity: 1;\n    transform: translate(-50%, -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: ams-component-container-zoom-out 0.3s ease-in-out;\n  animation-fill-mode: forwards;\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.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-block-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-block-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  border-radius: 12px 12px 0 0;\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: 500;\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: 500;\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: 500;\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 16px;\n  max-width: 225px;\n  min-width: 159px;\n}\n\n#ams-component-retention-leave {\n  border-radius: 100px;\n  border: 1px solid #0079FF;\n  font-style: normal;\n  font-weight: 500;\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 16px;\n  max-width: 225px;\n  min-width: 144px;\n}\n.".concat(MOCKUP_ID, "-hidden{\nanimation: ").concat(MOCKUP_ID, "-opacity 0.3s ease-in-out;\n  animation-fill-mode: forwards\n}\n/** \u52A0\u8F7D\u52A8\u753B **/\n@-webkit-keyframes ").concat(MOCKUP_ID, "-opacity {\n  0% {\n      opacity: 1;\n  }\n\n  100% {\n      opacity: 0;\n  }\n}\n");
 export var componentAddCSS = function componentAddCSS() {
   var style = document.createElement('style');
   style.type = 'text/css';

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

@@ -24,6 +24,8 @@ export default class ComponentApp {
     private _renderDisplayType;
     private _multipleCallbackEvents;
     _merchantAppointParam: IMerchantAppointParam;
+    private _webAppHeartBeatTimeoutId;
+    private _webAppHeartBeatTimeoutFn;
     constructor();
     /**
      * @description Cancel listening and destroy the dom
@@ -79,6 +81,9 @@ export default class ComponentApp {
     private handleRedirect;
     private handleDeclareInfo;
     private handleDeclarePopWindowCallback;
+    private handleAppHeartBeat;
+    private isAppAttached;
+    private isWindowVisible;
     private handleCloseBtnShow;
     /**
      * @description Send message to SDK

package/esm/plugin/component/index.js

@@ -17,7 +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 { 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 } from "../../constant";
+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";
 import { componentSignEnum, eventCodeEnum, messageName, platformEnum, productSceneEnum, RedirectType, renderDisplayTypeEnum, targetEnum } from "../../types";
 import { getType, isJsonString, isPC } from "../../util";
@@ -51,6 +51,8 @@ var ComponentApp = /*#__PURE__*/function () {
     _defineProperty(this, "_renderDisplayType", renderDisplayTypeEnum.popup);
     _defineProperty(this, "_multipleCallbackEvents", void 0);
     _defineProperty(this, "_merchantAppointParam", void 0);
+    _defineProperty(this, "_webAppHeartBeatTimeoutId", void 0);
+    _defineProperty(this, "_webAppHeartBeatTimeoutFn", void 0);
     this._appVersion = '1.9.0';
     this._isInitComponent = false;
     this._selector = "#".concat(COMPONENT_SECTION_ID);
@@ -313,6 +315,9 @@ var ComponentApp = /*#__PURE__*/function () {
       var _this4 = this;
       return new Promise(function (resolve, reject) {
         _this4._loadAppPromiseResolve = resolve;
+        _this4.AMSSDK.logger.logError({
+          title: 'sdk_event_webAppPreLoadStart'
+        });
         setTimeout(function () {
           reject(ERRORMESSAGE.CREATECOMPONENT_ERROR.LOAD_APP_TIMEOUT);
         }, loadTimeLimit !== null && loadTimeLimit !== void 0 ? loadTimeLimit : LOADTIME_LIMIT);
@@ -955,6 +960,10 @@ var ComponentApp = /*#__PURE__*/function () {
         this._multipleCallbackEvents = data.context.data;
         return;
       }
+      if (data.context.event === EVENT.appHeartBeat.name) {
+        this.handleAppHeartBeat();
+        return;
+      }
       if (data.context.event === EVENT.eventCallback.name) {
         this.AMSSDK.logger.logInfo({
           title: 'sdk_event_event_callback'
@@ -1016,6 +1025,7 @@ var ComponentApp = /*#__PURE__*/function () {
             cashier.style.transition = 'height 0.28s ease-in-out';
           }, 500);
         }
+        // 关闭loading，保留蒙层
         this.dismissLoadingFunc();
       }
       if (this._renderDisplayType === renderDisplayTypeEnum.inline) {
@@ -1132,6 +1142,56 @@ var ComponentApp = /*#__PURE__*/function () {
         console.log("not valid ".concat(eventInfoName, " in "), this._multipleCallbackEvents);
       }
     }
+  }, {
+    key: "handleAppHeartBeat",
+    value: function handleAppHeartBeat() {
+      var _this8 = this;
+      try {
+        if (!this._webAppHeartBeatTimeoutFn) {
+          this._webAppHeartBeatTimeoutFn = function () {
+            if (_this8.isAppAttached()) {
+              _this8.AMSSDK.logger.logError({
+                title: 'sdk_error_appHeartBeatTimeout'
+              });
+            }
+          };
+        }
+        if (this._webAppHeartBeatTimeoutId) {
+          clearTimeout(this._webAppHeartBeatTimeoutId);
+          this._webAppHeartBeatTimeoutId = null;
+        }
+        if (this._webAppHeartBeatTimeoutFn) {
+          this._webAppHeartBeatTimeoutId = setTimeout(this._webAppHeartBeatTimeoutFn, TIMEOUT_WEB_APP_HEART_BEAT);
+        }
+        setTimeout(function () {
+          if (_this8.isAppAttached()) {
+            _this8.dispatchToApp({
+              context: {
+                event: 'sdkHeartBeat',
+                data: {}
+              }
+            });
+          }
+        }, TIME_DELAY_SEND_HEART_BEAT);
+      } catch (error) {
+        this.AMSSDK.logger.logError({
+          title: 'sdk_error_handleAppHeartBeat'
+        }, {
+          errorMessage: error.message
+        });
+      }
+    }
+  }, {
+    key: "isAppAttached",
+    value: function isAppAttached() {
+      return this.app || this.popupApp;
+    }
+  }, {
+    key: "isWindowVisible",
+    value: function isWindowVisible() {
+      var _document;
+      return ((_document = document) === null || _document === void 0 ? void 0 : _document.visibilityState) === 'visible';
+    }
   }, {
     key: "handleCloseBtnShow",
     value: function handleCloseBtnShow(showClose) {
@@ -1248,6 +1308,9 @@ var ComponentApp = /*#__PURE__*/function () {
                   }
                 }
               });
+              this.AMSSDK.logger.logInfo({
+                title: 'sdk_event_renderComponent'
+              });
               this.dispatchToApp({
                 context: {
                   event: 'web-sdk-performance',
@@ -1257,16 +1320,16 @@ var ComponentApp = /*#__PURE__*/function () {
                 }
               });
               // eslint-disable-next-line no-empty
-              _context8.next = 16;
+              _context8.next = 17;
               break;
-            case 14:
-              _context8.prev = 14;
+            case 15:
+              _context8.prev = 15;
               _context8.t0 = _context8["catch"](0);
-            case 16:
+            case 17:
             case "end":
               return _context8.stop();
           }
-        }, _callee8, this, [[0, 14]]);
+        }, _callee8, this, [[0, 15]]);
       }));
       function sendRenderEvent() {
         return _sendRenderEvent.apply(this, arguments);
@@ -1281,7 +1344,7 @@ var ComponentApp = /*#__PURE__*/function () {
     key: "cleanContainer",
     value: function cleanContainer() {
       var _document$getElementB4,
-        _this8 = this;
+        _this9 = this;
       var immediately = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
       this.AMSSDK.logger.logInfo({
         title: 'sdk_event_clean_component'
@@ -1296,7 +1359,7 @@ var ComponentApp = /*#__PURE__*/function () {
       this.app = null;
       if (immediately) this.cleanElement();else {
         setTimeout(function () {
-          _this8.cleanElement();
+          _this9.cleanElement();
         }, 300);
       }
     }
@@ -1356,8 +1419,8 @@ var ComponentApp = /*#__PURE__*/function () {
     key: "submitForm",
     value: function submitForm(data) {
       var attributes = data.attributes;
-      var _document = document,
-        body = _document.body;
+      var _document2 = document,
+        body = _document2.body;
       var form = document.createElement('form');
       form.setAttribute('height', '1');
       form.setAttribute('width', '1');

package/esm/util/logger.d.ts

@@ -8,7 +8,7 @@ interface LogPayload {
     code?: string;
     traceId?: string;
 }
-type Extra = Record<string, string>;
+type Extra = Record<string, any>;
 export interface LogMetaData {
     platform?: string;
     sdkVersion?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alipay/ams-checkout",
-  "version": "0.0.1703483942-dev.11",
+  "version": "0.0.1703483942-dev.13",
   "description": "",
   "author": "",
   "main": "esm/index.js",