@alipay/ams-checkout 1.42.1 → 1.43.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/umd/ams-checkout.min.js +1 -1
- package/esm/component/component.popup.style.d.ts +1 -0
- package/esm/component/component.popup.style.js +1 -1
- package/esm/config/index.d.ts +7 -7
- package/esm/config/index.js +7 -7
- package/esm/constant/index.d.ts +9 -0
- package/esm/constant/index.js +11 -0
- package/esm/core/component/index.d.ts +3 -1
- package/esm/core/component/index.js +83 -1
- package/esm/index.d.ts +10 -1
- package/esm/index.js +15 -1
- package/esm/plugin/component/index.d.ts +2 -0
- package/esm/plugin/component/index.js +17 -7
- package/esm/plugin/paypal/index.js +5 -2
- package/esm/types/index.d.ts +3 -0
- package/package.json +2 -2
@@ -1,4 +1,5 @@
|
|
1
1
|
import { PlatformEnum } from '../types';
|
2
|
+
export declare const 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 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.ams-component-mask-close-block-desktop {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 18px;\n top: 10px;\n cursor: pointer;\n z-index: 1013;\n}\n \n.ams-component-mask-close-block-mobile {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 18px;\n cursor: pointer;\n z-index: 1012;\n}\n\n.ams-component-mask-close-block-hidden {\n width: 0px !important;\n height: 0px !important;\n visibility: hidden;\n}\n\n.ams-component-mask-close-block-btn {\n width: 24px;\n height: 24px;\n object-fit: fill;\n position: absolute;\n right: 8px;\n top: 8px;\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.ams-component-mockup-hidden{\nanimation: ams-component-mockup-opacity 0.3s ease-in-out;\n animation-fill-mode: forwards\n}\n/** \u52A0\u8F7D\u52A8\u753B **/\n@-webkit-keyframes ams-component-mockup-opacity {\n 0% {\n opacity: 1;\n }\n\n 100% {\n opacity: 0;\n }\n}\n";
|
2
3
|
export declare const componentAddCSS: () => void;
|
3
4
|
export declare const createBaseElement: (platform: PlatformEnum, closeBtnFunc: () => void) => HTMLDivElement;
|
4
5
|
export declare const createCloseBtn: (platform: PlatformEnum, closeBtnFunc: () => void) => void;
|
@@ -8,7 +8,7 @@
|
|
8
8
|
import { ANIMATION_TIME, closeImg, COMPONENT_CLOSE_BLOCK_ID, COMPONENT_CONTAINER_ID, COMPONENT_CLOSE_MASK_BLOCK_ID, COMPONENT_RETENTION_ID, COMPONENT_SECTION_ID, LOADING_ID, MOCKUP_ID } from "../constant";
|
9
9
|
import { PlatformEnum } from "../types";
|
10
10
|
import { addSetFontSizeEvent, amsSetSize, getDesignFontSize } from "../util";
|
11
|
-
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 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.ams-component-mask-close-block-desktop {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 18px;\n top: 10px;\n cursor: pointer;\n z-index: 1013;\n}\n \n.ams-component-mask-close-block-mobile {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 18px;\n cursor: pointer;\n z-index: 1012;\n}\n\n.ams-component-mask-close-block-hidden {\n width: 0px !important;\n height: 0px !important;\n visibility: hidden;\n}\n\n.ams-component-mask-close-block-btn {\n width: 24px;\n height: 24px;\n object-fit: fill;\n position: absolute;\n right: 8px;\n top: 8px;\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");
|
11
|
+
export 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 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.ams-component-mask-close-block-desktop {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 18px;\n top: 10px;\n cursor: pointer;\n z-index: 1013;\n}\n \n.ams-component-mask-close-block-mobile {\n position: absolute;\n width: 40px;\n height: 40px;\n right: 18px;\n cursor: pointer;\n z-index: 1012;\n}\n\n.ams-component-mask-close-block-hidden {\n width: 0px !important;\n height: 0px !important;\n visibility: hidden;\n}\n\n.ams-component-mask-close-block-btn {\n width: 24px;\n height: 24px;\n object-fit: fill;\n position: absolute;\n right: 8px;\n top: 8px;\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");
|
12
12
|
export var componentAddCSS = function componentAddCSS() {
|
13
13
|
var style = document.createElement('style');
|
14
14
|
style.type = 'text/css';
|
package/esm/config/index.d.ts
CHANGED
@@ -6,10 +6,10 @@ export declare const sdkVersion: string;
|
|
6
6
|
* @description: 目前应用层分为v1和v2,会存在两个应用版本号不是同步发布的情况。所以需要把默认的应用版本号配置抽离出来。
|
7
7
|
* TODO 这里考虑直接换成packagejson.version
|
8
8
|
*/
|
9
|
-
export declare const AMSCheckoutAppVersion = "1.
|
10
|
-
export declare const AMSAutoDebitAppVersion = "1.
|
11
|
-
export declare const AMSEasyPayAppVersion = "1.
|
12
|
-
export declare const AMSCashierPaymentAppVersion = "1.
|
13
|
-
export declare const AMSVaultingAppVersion = "1.
|
14
|
-
export declare const AMSPaymentElementAppVersion = "1.
|
15
|
-
export declare const ADDRESSElementAppVersion = "1.
|
9
|
+
export declare const AMSCheckoutAppVersion = "1.43.0";
|
10
|
+
export declare const AMSAutoDebitAppVersion = "1.43.0";
|
11
|
+
export declare const AMSEasyPayAppVersion = "1.43.0";
|
12
|
+
export declare const AMSCashierPaymentAppVersion = "1.43.0";
|
13
|
+
export declare const AMSVaultingAppVersion = "1.43.0";
|
14
|
+
export declare const AMSPaymentElementAppVersion = "1.43.0";
|
15
|
+
export declare const ADDRESSElementAppVersion = "1.43.0";
|
package/esm/config/index.js
CHANGED
@@ -36,10 +36,10 @@ export var sdkVersion = json.version;
|
|
36
36
|
* @description: 目前应用层分为v1和v2,会存在两个应用版本号不是同步发布的情况。所以需要把默认的应用版本号配置抽离出来。
|
37
37
|
* TODO 这里考虑直接换成packagejson.version
|
38
38
|
*/
|
39
|
-
export var AMSCheckoutAppVersion = '1.
|
40
|
-
export var AMSAutoDebitAppVersion = '1.
|
41
|
-
export var AMSEasyPayAppVersion = '1.
|
42
|
-
export var AMSCashierPaymentAppVersion = '1.
|
43
|
-
export var AMSVaultingAppVersion = '1.
|
44
|
-
export var AMSPaymentElementAppVersion = '1.
|
45
|
-
export var ADDRESSElementAppVersion = '1.
|
39
|
+
export var AMSCheckoutAppVersion = '1.43.0'; // 兜底版本号
|
40
|
+
export var AMSAutoDebitAppVersion = '1.43.0'; // 代扣
|
41
|
+
export var AMSEasyPayAppVersion = '1.43.0'; // easypay
|
42
|
+
export var AMSCashierPaymentAppVersion = '1.43.0'; // 收银台(卡、apm)
|
43
|
+
export var AMSVaultingAppVersion = '1.43.0'; // 绑卡
|
44
|
+
export var AMSPaymentElementAppVersion = '1.43.0'; // payment element
|
45
|
+
export var ADDRESSElementAppVersion = '1.43.0'; // address element
|
package/esm/constant/index.d.ts
CHANGED
@@ -249,6 +249,15 @@ export declare const EVENT: {
|
|
249
249
|
messageForward: {
|
250
250
|
name: string;
|
251
251
|
};
|
252
|
+
validateFieldsResult: {
|
253
|
+
name: string;
|
254
|
+
uniqueKey: string;
|
255
|
+
};
|
256
|
+
};
|
257
|
+
export declare const SENDEVENT: {
|
258
|
+
validateFields: {
|
259
|
+
name: string;
|
260
|
+
};
|
252
261
|
};
|
253
262
|
export declare const COMPONENT_CONTAINER_ID = "ams-component-container";
|
254
263
|
export declare const COMPONENT_SECTION_ID = "ams-component-section";
|
package/esm/constant/index.js
CHANGED
@@ -250,6 +250,17 @@ export var EVENT = {
|
|
250
250
|
*/
|
251
251
|
messageForward: {
|
252
252
|
name: 'onMessageForward'
|
253
|
+
},
|
254
|
+
validateFieldsResult: {
|
255
|
+
name: 'validateFieldsResult',
|
256
|
+
uniqueKey: 'uservalidateFieldsResult'
|
257
|
+
}
|
258
|
+
};
|
259
|
+
|
260
|
+
// 2025.09新增,非全量SDK发送事件码
|
261
|
+
export var SENDEVENT = {
|
262
|
+
validateFields: {
|
263
|
+
name: 'validateFields'
|
253
264
|
}
|
254
265
|
};
|
255
266
|
export var COMPONENT_CONTAINER_ID = 'ams-component-container';
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import ComponentApp from '../../plugin/component';
|
2
|
-
import { ComponentSignEnum, IappendIframeNodesParams, IcreateComponent, IoptionsParams, IPaymentSessionMetaData, Iselector, Isubmit, PaymentMethodTypeEnum, SubPaymentMethodTypeEnum } from '../../types';
|
2
|
+
import { ComponentSignEnum, EventPayloadContext, IappendIframeNodesParams, IcreateComponent, IoptionsParams, IPaymentSessionMetaData, Iselector, Isubmit, PaymentMethodTypeEnum, SubPaymentMethodTypeEnum, ValidationResult } from '../../types';
|
3
3
|
import CoreInstance from '../instance/index';
|
4
4
|
export declare const getComponentSign: (params: IPaymentSessionMetaData) => ComponentSignEnum;
|
5
5
|
export declare const parseSessionData: (sessionData: string) => [IPaymentSessionMetaData, string];
|
@@ -52,4 +52,6 @@ export declare class AMSComponent extends CoreInstance {
|
|
52
52
|
* @param data - Transfer information in the submission interface according to your requirements (optional)
|
53
53
|
*/
|
54
54
|
submit(data?: Isubmit): Promise<unknown>;
|
55
|
+
protected _validateFields(): Promise<ValidationResult>;
|
56
|
+
protected _sendMessageToAPP(eventContext: EventPayloadContext): void;
|
55
57
|
}
|
@@ -35,7 +35,7 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
35
35
|
* 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.
|
36
36
|
*/
|
37
37
|
import { v4 as uuid } from 'uuid';
|
38
|
-
import { COMPONENTPLUGINID, ERRORMESSAGE, EVENT } from "../../constant";
|
38
|
+
import { COMPONENTPLUGINID, ERRORMESSAGE, EVENT, SENDEVENT } from "../../constant";
|
39
39
|
import { ApplePayBusSubscriber } from "../../plugin/applepay";
|
40
40
|
import ComponentApp from "../../plugin/component";
|
41
41
|
import { ExtendPlugin } from "../../plugin/const";
|
@@ -526,6 +526,88 @@ export var AMSComponent = /*#__PURE__*/function (_CoreInstance) {
|
|
526
526
|
}
|
527
527
|
});
|
528
528
|
}
|
529
|
+
|
530
|
+
// 预留给AMSVaulting复用
|
531
|
+
}, {
|
532
|
+
key: "_validateFields",
|
533
|
+
value: function _validateFields() {
|
534
|
+
var _this9 = this;
|
535
|
+
return new Promise(function (resolve) {
|
536
|
+
// 收银台应用渲染表单后,才允许发送校验消息,三端约定一致
|
537
|
+
if (!_this9._componentApp.shouldValidateFields()) {
|
538
|
+
resolve({
|
539
|
+
isValid: false
|
540
|
+
});
|
541
|
+
_this9.logger.logInfo({
|
542
|
+
title: 'sdk_event_validateFields'
|
543
|
+
}, {
|
544
|
+
processResult: 'notRenderComponent'
|
545
|
+
});
|
546
|
+
return;
|
547
|
+
}
|
548
|
+
var timeoutId;
|
549
|
+
var validationPromise = new Promise(function (validationResolve) {
|
550
|
+
// 发送validateFields消息
|
551
|
+
_this9._sendMessageToAPP({
|
552
|
+
event: SENDEVENT.validateFields.name,
|
553
|
+
data: {}
|
554
|
+
});
|
555
|
+
// 接收收银台应用的返回validateFieldsResult消息
|
556
|
+
_this9._overrideSubscription(EVENT.validateFieldsResult.name, /*#__PURE__*/function () {
|
557
|
+
var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(payload) {
|
558
|
+
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
559
|
+
while (1) switch (_context2.prev = _context2.next) {
|
560
|
+
case 0:
|
561
|
+
_this9.logger.logInfo({
|
562
|
+
title: 'sdk_event_validateFields'
|
563
|
+
}, {
|
564
|
+
processResult: payload.isValid ? 'true' : 'false'
|
565
|
+
});
|
566
|
+
// 收银台应用保证数据格式,三端SDK负责透传
|
567
|
+
validationResolve(payload);
|
568
|
+
case 2:
|
569
|
+
case "end":
|
570
|
+
return _context2.stop();
|
571
|
+
}
|
572
|
+
}, _callee2);
|
573
|
+
}));
|
574
|
+
return function (_x2) {
|
575
|
+
return _ref5.apply(this, arguments);
|
576
|
+
};
|
577
|
+
}(), EVENT.validateFieldsResult.uniqueKey);
|
578
|
+
});
|
579
|
+
|
580
|
+
// 兜底场景,三端约定超时时间15秒,兼容cpf网络校验超时场景
|
581
|
+
var timeoutPromise = new Promise(function (timeoutResolve) {
|
582
|
+
timeoutId = setTimeout(function () {
|
583
|
+
_this9.logger.logInfo({
|
584
|
+
title: 'sdk_event_validateFields'
|
585
|
+
}, {
|
586
|
+
processResult: 'timeout'
|
587
|
+
});
|
588
|
+
timeoutResolve({
|
589
|
+
isValid: false
|
590
|
+
});
|
591
|
+
}, 15000);
|
592
|
+
});
|
593
|
+
Promise.race([validationPromise, timeoutPromise]).then(function (result) {
|
594
|
+
clearTimeout(timeoutId);
|
595
|
+
resolve(result);
|
596
|
+
}).catch(function () {
|
597
|
+
clearTimeout(timeoutId);
|
598
|
+
resolve({
|
599
|
+
isValid: false
|
600
|
+
});
|
601
|
+
});
|
602
|
+
});
|
603
|
+
}
|
604
|
+
}, {
|
605
|
+
key: "_sendMessageToAPP",
|
606
|
+
value: function _sendMessageToAPP(eventContext) {
|
607
|
+
this._componentApp.dispatchToApp({
|
608
|
+
context: eventContext
|
609
|
+
});
|
610
|
+
}
|
529
611
|
}]);
|
530
612
|
return AMSComponent;
|
531
613
|
}(CoreInstance);
|
package/esm/index.d.ts
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
import { AddressComponent } from './core/component/address';
|
2
2
|
import { ElementComponent } from './core/component/element';
|
3
3
|
import { AMSComponent } from './core/component/index';
|
4
|
-
import { ComponentSignEnum, IcreateComponent, IElementOptions, IoptionsAddressParams, IoptionsParams, IPreloadOptions } from './types';
|
4
|
+
import { ComponentSignEnum, IcreateComponent, IElementOptions, IoptionsAddressParams, IoptionsParams, IPreloadOptions, ValidationResult } from './types';
|
5
5
|
export { AMSCheckoutPage } from './core/component/ckp';
|
6
6
|
export * from './types';
|
7
7
|
export declare class AMSCheckout extends AMSComponent {
|
@@ -14,6 +14,15 @@ export declare class AMSAutoDebitPay extends AMSCheckout {
|
|
14
14
|
export declare class AMSCashierPayment extends AMSCheckout {
|
15
15
|
constructor(options: IoptionsParams);
|
16
16
|
static preload(options?: IPreloadOptions): void;
|
17
|
+
/**
|
18
|
+
* Form validation function
|
19
|
+
* If the form is currently displayed:
|
20
|
+
* - Successful validation: isValid is true
|
21
|
+
* - Failed validation: isValid is false, and error messages are displayed on the form page
|
22
|
+
* If not on the form display page, isValid returns false
|
23
|
+
* @returns {Promise<ValidationResult>} Returns a Promise containing the validation result
|
24
|
+
*/
|
25
|
+
validateFields(): Promise<ValidationResult>;
|
17
26
|
}
|
18
27
|
export declare class AMSVaulting extends AMSCheckout {
|
19
28
|
constructor(options: IoptionsParams);
|
package/esm/index.js
CHANGED
@@ -111,7 +111,21 @@ export var AMSCashierPayment = /*#__PURE__*/function (_AMSCheckout2) {
|
|
111
111
|
}
|
112
112
|
return _super3.call(this, _options, currentChannelType);
|
113
113
|
}
|
114
|
-
_createClass(AMSCashierPayment,
|
114
|
+
_createClass(AMSCashierPayment, [{
|
115
|
+
key: "validateFields",
|
116
|
+
value:
|
117
|
+
/**
|
118
|
+
* Form validation function
|
119
|
+
* If the form is currently displayed:
|
120
|
+
* - Successful validation: isValid is true
|
121
|
+
* - Failed validation: isValid is false, and error messages are displayed on the form page
|
122
|
+
* If not on the form display page, isValid returns false
|
123
|
+
* @returns {Promise<ValidationResult>} Returns a Promise containing the validation result
|
124
|
+
*/
|
125
|
+
function validateFields() {
|
126
|
+
return this._validateFields();
|
127
|
+
}
|
128
|
+
}], [{
|
115
129
|
key: "preload",
|
116
130
|
value: function preload() {
|
117
131
|
var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
|
@@ -28,6 +28,7 @@ export default class ComponentApp {
|
|
28
28
|
private _isAppWebview;
|
29
29
|
_merchantAppointParam: IMerchantAppointParam;
|
30
30
|
private _webAppHeartBeatTimeoutFn;
|
31
|
+
private _hasRenderComponent;
|
31
32
|
constructor(componentOption?: {
|
32
33
|
appVersion?: string;
|
33
34
|
});
|
@@ -126,5 +127,6 @@ export default class ComponentApp {
|
|
126
127
|
private showRetentionPopup;
|
127
128
|
private hideRetentionPopupFunc;
|
128
129
|
private submitForm;
|
130
|
+
shouldValidateFields(): boolean;
|
129
131
|
}
|
130
132
|
export {};
|
@@ -23,7 +23,7 @@ import { COMPONENTPLUGINID, COMPONENT_CLOSE_BLOCK_ID, COMPONENT_CLOSE_MASK_BLOCK
|
|
23
23
|
import { ElementPaymentMethod } from "../../core/component/oldElement/type";
|
24
24
|
import { queryPaymentInfo, submitPayInfo } from "../../service";
|
25
25
|
import { ComponentSignEnum, DisplayTypeEnum, eventCodeEnum, MessageName, PlatformEnum, ProductSceneEnum, RedirectType, TargetEnum } from "../../types";
|
26
|
-
import { getType, isJsonString, isPC } from "../../util";
|
26
|
+
import { getType, isJsonString, isPC, device } from "../../util";
|
27
27
|
import { getBackScheme } from "../../util/getBackScheme";
|
28
28
|
import { isLocalMock } from "../../util/mock";
|
29
29
|
import { matchVersion } from "../../util/versionCompare";
|
@@ -62,6 +62,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
62
62
|
_defineProperty(this, "_isAppWebview", void 0);
|
63
63
|
_defineProperty(this, "_merchantAppointParam", void 0);
|
64
64
|
_defineProperty(this, "_webAppHeartBeatTimeoutFn", void 0);
|
65
|
+
_defineProperty(this, "_hasRenderComponent", false);
|
65
66
|
this._appVersion = componentOption.appVersion;
|
66
67
|
this._isInitComponent = false;
|
67
68
|
this._selector = "#".concat(COMPONENT_SECTION_ID);
|
@@ -71,7 +72,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
71
72
|
this.createPreloadIframeNode = function () {
|
72
73
|
return Promise.resolve();
|
73
74
|
};
|
74
|
-
this.platform =
|
75
|
+
this.platform = device.isMobile ? PlatformEnum.mobile : PlatformEnum.desktop;
|
75
76
|
this._isRetention = true;
|
76
77
|
this._appLocationSearch = '';
|
77
78
|
this._performanceData.push({
|
@@ -673,6 +674,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
673
674
|
message: res === null || res === void 0 ? void 0 : res.errorMessage
|
674
675
|
};
|
675
676
|
_this5.dispatchToSDK(EVENT.error.name, createComponentError);
|
677
|
+
_this5.dispatchToSDK(EVENT.eventCallback.name, createComponentError);
|
676
678
|
if ((res === null || res === void 0 || (_res$errorActions = res.errorActions) === null || _res$errorActions === void 0 ? void 0 : _res$errorActions.showType) === 'NONE') {
|
677
679
|
// 抛错销毁SDK,不展示错误页面
|
678
680
|
reject(createComponentError);
|
@@ -684,6 +686,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
684
686
|
if (ComponentSignEnum.CASHIER_PAYMENT_CARD === _this5._componentSign) {
|
685
687
|
// 通用操作:抛CREATECOMPONENT_ERROR错误码给商户,商户升级到新版本需要处理CREATECOMPONENT_ERROR逻辑
|
686
688
|
_this5.dispatchToSDK(EVENT.error.name, ERRORMESSAGE.CREATECOMPONENT_ERROR.NETWORK_REQUEST_ERROR);
|
689
|
+
_this5.dispatchToSDK(EVENT.eventCallback.name, ERRORMESSAGE.CREATECOMPONENT_ERROR.NETWORK_REQUEST_ERROR);
|
687
690
|
}
|
688
691
|
if ([ComponentSignEnum.CASHIER_PAYMENT_CARD, ComponentSignEnum.VAULTING_CARD, ComponentSignEnum.CASHIER_PAYMENT_APM].includes(_this5._componentSign)) {
|
689
692
|
return resolve({
|
@@ -1842,6 +1845,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
1842
1845
|
return this._actionSubmitPromise;
|
1843
1846
|
case 9:
|
1844
1847
|
submitRes = _context8.sent;
|
1848
|
+
this._hasRenderComponent = true;
|
1845
1849
|
this._performanceData.push({
|
1846
1850
|
key: 'sdk_render_component',
|
1847
1851
|
value: Date.now()
|
@@ -1897,16 +1901,16 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
1897
1901
|
}
|
1898
1902
|
});
|
1899
1903
|
// eslint-disable-next-line no-empty
|
1900
|
-
_context8.next =
|
1904
|
+
_context8.next = 19;
|
1901
1905
|
break;
|
1902
|
-
case
|
1903
|
-
_context8.prev =
|
1906
|
+
case 17:
|
1907
|
+
_context8.prev = 17;
|
1904
1908
|
_context8.t0 = _context8["catch"](0);
|
1905
|
-
case
|
1909
|
+
case 19:
|
1906
1910
|
case "end":
|
1907
1911
|
return _context8.stop();
|
1908
1912
|
}
|
1909
|
-
}, _callee8, this, [[0,
|
1913
|
+
}, _callee8, this, [[0, 17]]);
|
1910
1914
|
}));
|
1911
1915
|
function sendRenderEvent() {
|
1912
1916
|
return _sendRenderEvent.apply(this, arguments);
|
@@ -1933,6 +1937,7 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
1933
1937
|
this._performanceData = [];
|
1934
1938
|
this._isInitComponent = false;
|
1935
1939
|
this.app = null;
|
1940
|
+
this._hasRenderComponent = false;
|
1936
1941
|
if (immediately) this.cleanElement();else {
|
1937
1942
|
setTimeout(function () {
|
1938
1943
|
_this10.cleanElement();
|
@@ -2019,6 +2024,11 @@ var ComponentApp = /*#__PURE__*/function () {
|
|
2019
2024
|
form.submit();
|
2020
2025
|
}, 0);
|
2021
2026
|
}
|
2027
|
+
}, {
|
2028
|
+
key: "shouldValidateFields",
|
2029
|
+
value: function shouldValidateFields() {
|
2030
|
+
return this._hasRenderComponent;
|
2031
|
+
}
|
2022
2032
|
}]);
|
2023
2033
|
return ComponentApp;
|
2024
2034
|
}();
|
@@ -82,7 +82,7 @@ export var PaypalBusSubscriber = /*#__PURE__*/function (_BusSubscriber) {
|
|
82
82
|
}
|
83
83
|
return Promise.resolve(paypalPluginProps);
|
84
84
|
});
|
85
|
-
// 加载paypal资源
|
85
|
+
// 加载paypal资源 TODO
|
86
86
|
_defineProperty(_assertThisInitialized(_this), "loadPaypalResource", function (paypalPluginProps) {
|
87
87
|
return new Promise(function (resolve, reject) {
|
88
88
|
var _paypalPluginProps$ap;
|
@@ -265,6 +265,7 @@ export var PaypalBusSubscriber = /*#__PURE__*/function (_BusSubscriber) {
|
|
265
265
|
return _ref6.apply(this, arguments);
|
266
266
|
};
|
267
267
|
}());
|
268
|
+
// TODO
|
268
269
|
_defineProperty(_assertThisInitialized(_this), "destroyComponent", /*#__PURE__*/function () {
|
269
270
|
var _ref7 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee5(context, message) {
|
270
271
|
var data;
|
@@ -373,7 +374,9 @@ export var PaypalBusSubscriber = /*#__PURE__*/function (_BusSubscriber) {
|
|
373
374
|
}
|
374
375
|
}, {
|
375
376
|
key: "onMessage",
|
376
|
-
value:
|
377
|
+
value:
|
378
|
+
// TODO
|
379
|
+
function onMessage(context, message) {
|
377
380
|
switch (message.getAction()) {
|
378
381
|
case PaypalActionEnum.mountComponent:
|
379
382
|
this.renderPaypalButton(context, message);
|
package/esm/types/index.d.ts
CHANGED
@@ -40,6 +40,9 @@ export interface IoptionsParams {
|
|
40
40
|
mode?: string;
|
41
41
|
securityRegion?: 'US' | 'SG' | 'DE';
|
42
42
|
}
|
43
|
+
export interface ValidationResult {
|
44
|
+
isValid: boolean;
|
45
|
+
}
|
43
46
|
export interface IPreloadOptions {
|
44
47
|
environment?: string;
|
45
48
|
securityRegion?: 'US' | 'SG' | 'DE';
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@alipay/ams-checkout",
|
3
|
-
"version": "1.
|
3
|
+
"version": "1.43.0",
|
4
4
|
"description": "",
|
5
5
|
"author": "",
|
6
6
|
"main": "esm/index.js",
|
@@ -21,7 +21,7 @@
|
|
21
21
|
"dev": "father dev",
|
22
22
|
"format": "prettier --write --no-error-on-unmatched-pattern \"**/*.{js,jsx,ts,tsx,md,json,css,less}\"",
|
23
23
|
"lint": "eslint ./src",
|
24
|
-
"test": "jest --silent",
|
24
|
+
"test": "jest --coverage --silent",
|
25
25
|
"tsc": "tsc --noEmit"
|
26
26
|
},
|
27
27
|
"commitlint": {
|